:root {
    /* The page background */
    --pagebackground: black;
    
}


/* Dark mode turns everything topsy turvy */
body {
    font-family: 'KcomFont', Fallback, Verdana;
    background-color: black!important;
    color: white!important;
    padding-top: 0;
}

a {
    color: var(--nasstarpink)
}

p {
    text-align: left
}

input[type=text], textarea {
    font-family: 'KcomFont', Fallback, Verdana;
}

.logo-image {
    width: 200px !important;
    margin: 0;
    padding: 0;
    margin-top: 6px;
    margin-left: -12px;
}
/* Css for the partner logo */
.logo {
    /* This goes up another directory because we has been fingerprinted ... */
    background: url('../../img/brand-partner-portal/Nasstar Channel_Logo-02-opt.png');
    background-size: contain;
    background-repeat: no-repeat;
    height: 101px !important;
    width: 200px;
    margin: 0;
    padding: 0;
    margin-top: 6px;
    -webkit-animation-name: logoanimate;
    animation-name: logoanimate;
    -webkit-animation-delay: 5s;
    animation-delay: 5s;
    -webkit-animation-duration: 10s;
    animation-duration: 10s;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    margin-left: -12px;
}

@supports(-webkit-box-reflect:below -1px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(80%, transparent), to(rgba(255, 255, 255, 0.3)))) {
    .logo {
        -webkit-box-reflect: below -1px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(80%, transparent), to(rgba(255, 255, 255, 0.3)));
    }
}

.logo-image {
    width: 200px !important;
    margin: 0;
    padding: 0;
    margin-top: 6px;
    margin-left: -12px;
    height: 120px !important;
}

.logospecialoverride {
    -webkit-animation: none;
    animation: none;
    height: 100px !important;
}

/*@-webkit-keyframes logoanimate {
    from {
        -webkit-filter: none;
        filter: none
    }

    25% {
        -webkit-filter: var(--filter_nasstargreen);
        filter: var(--filter_nasstargreen);
        -webkit-box-reflect: below -37px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, transparent), to(rgba(255, 255, 255, 0.5)));
        -webkit-box-reflect: below -37px -ms-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, transparent), to(rgba(255, 255, 255, 0.5)));
    }


    50% {
        -webkit-filter: var(--filter_nasstarorange);
        filter: var(--filter_nasstarorange);
        -webkit-box-reflect: below -37px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, transparent), to(rgba(255, 255, 255, 0.5)));
        -webkit-box-reflect: below -37px -ms-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, transparent), to(rgba(255, 255, 255, 0.5)));
    }

    75% {
        -webkit-filter: var(--filter_nasstarpink);
        filter: var(--filter_nasstarpink);
        -webkit-box-reflect: below -37px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, transparent), to(rgba(255, 255, 255, 0.5)));
        -webkit-box-reflect: below -37px -ms-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, transparent), to(rgba(255, 255, 255, 0.5)));
    }

    to {
        -webkit-filter: var(--filter_nasstarblue);
        filter: var(--filter_nasstarblue);
        -webkit-box-reflect: below -37px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, transparent), to(rgba(255, 255, 255, 0.5)));
        -webkit-box-reflect: below -37px -ms-gradient(linear, left top, left bottom, from(transparent), color-stop(50%, transparent), to(rgba(255, 255, 255, 0.5)));
    }
}
*/
@keyframes logoanimate {
    from {
        -webkit-filter: none;
        filter: none
    }

    25% {
        -webkit-filter: var(--filter_nasstargreen);
        filter: var(--filter_nasstargreen)
    }


    50% {
        -webkit-filter: var(--filter_nasstarorange);
        filter: var(--filter_nasstarorange);
    }

    75% {
        -webkit-filter: var(--filter_nasstarpink);
        filter: var(--filter_nasstarpink);
    }

    to {
        -webkit-filter: var(--filter_nasstarblue);
        filter: var(--filter_nasstarblue);
    }
}

.tophomemenubar {
}

.homeScreenOverrideColour {
    color: white;
}

.module {
    background-color: white;
    padding: 10px;
    max-width: 98%;
    width: 98%;
}

.module-login {
    background-color: var(--pagebackground);
    color: white;
}

.moduleLeftNav ul li a:hover {
    background-color: var(--pagebackground);
    color: var(--nasstarorange);
}

.navigation_main a.externalLink {
    background-color: #f90;
}

.navigation_main ul ul {
    margin-left: 20px;
}

.navigation_main ul li {
    display: block;
    position: relative;
}

    .navigation_main ul li a {
        text-decoration: none;
        margin: 0 0 5px;
        padding: 7px;
        border-radius: 5px;
        font-size: 0.9em;
        display: block;
        position: relative;
        color: white;
    }

    .navigation_main ul li a {
        /*color:#000;*/
    }

        .navigation_main ul li a span.new {
            display: block;
            width: 28px;
            height: 27px;
            /*background:url(../img/menu-new.png) no-repeat;*/
            position: absolute;
            top: -3px;
            right: -3px;
        }

        .navigation_main ul li a:hover {
            background-color: var(--partner_logo_colour_rgb_for_hover);
        }

.navigation_main ul ul li a {
}

    .navigation_main ul ul li a:hover {
        background-position: -1250px 0;
    }

.navigation_main ul ul li ul li a {
    /*background-position:-500px 0;
  background-color:#A2D7EF;
  border:1px solid #A2D7EF;*/
}

    .navigation_main ul ul li ul li a:hover {
        background-position: -1500px 0;
    }

.navigation_main ul ul li ul li ul li a {
    /*background-position:-750px 0;
  background-color:#BEE3F3;
  border:1px solid #BEE3F3;*/
}

.navigation_main ul li.active a {
    font-weight: bold;
}

.navigation_main ul li.active ul li a {
    font-weight: normal;
}

.navigation_main a.externalLink {
    background-position: -2000px 0;
    background-color: #FF9900;
    border: 1px solid #FF9900;
}

    .navigation_main a.externalLink:hover {
        background-position: -2250px 0;
    }



.navigation_main ul a:hover {
    background: #AADEF5
}

.mcResults {
    color: #179bd4;
}

.paginate_enabled_next_mc:hover, .paginate_enabled_previous_mc:hover {
    background-color: #179bd4;
    border: 1px solid #179bd4;
}


.headerTitle {
    font-family: 'Trebuchet MS Bold', 'Trebuchet MS';
    font-weight: 700;
    font-style: normal;
    font-size: 18px;
    color: #179bd4;
}

.smallHeader {
    font-family: 'Trebuchet MS Bold', 'Trebuchet MS';
    font-weight: 700;
    font-style: normal;
    color: #179bd4;
}

.hyperLinkNoStyle {
    color: rgb(23,155,212);
    text-decoration: none;
}

.hyperLinkStyle {
    color: rgb(23,155,212);
}


/*User Features*/
.userFeatures {
    background: #F2F2F2 !important;
}

.UserContent {
    background-color: white;
    color: var(--pagebackground);
    border-radius: 10px;
}

.UserContentHomeScreen {
    /*background: radial-gradient( circle at top left, #201f1f, #656363 );*/
    border-radius: 10px;
}

.editUserFeatures {
    background: #F2F2F2 !important;
    display: table;
}

.disabledMailboxImage {
    background: url('/img/sprites/Users/UserFeaturesSprite.png') no-repeat -96px -51px;
    width: 31px;
    height: 31px;
}

.enabledMailboxImage {
    background: url('/img/sprites/Users/UserFeaturesSprite.png') no-repeat -96px -19px;
    width: 31px;
    height: 31px;
}

.disabledFtpImage {
    background: url('/img/sprites/Users/UserFeaturesSprite.png') no-repeat -33px -52px;
    width: 31px;
    height: 26px;
}

.enabledFtpImage {
    background: url('/img/sprites/Users/UserFeaturesSprite.png') no-repeat -33px -20px;
    width: 31px;
    height: 26px;
}

.disabledAntispamImage {
    background: url('/img/sprites/Users/UserFeaturesSprite.png') no-repeat -162px -50px;
    width: 28px;
    height: 31px;
}

.enabledAntispamImage {
    background: url('/img/sprites/Users/UserFeaturesSprite.png') no-repeat -162px -17px;
    width: 28px;
    height: 31px;
}

.editUserFeatureIcon {
    float: left;
    margin-right: 20px;
    vertical-align: middle;
    clear: both
}

.UserFeaturesOrange {
    color: #179bd4;
}

.editUserLeftColMargin {
    margin-right: 40% !important;
    display: table-cell;
    float: none !important;
}

.editUserRightColWidth {
    width: 40% !important;
    display: table-cell;
    float: none !important;
}

.userDetailFeatureIcon {
    float: left;
    margin: 10px;
    cursor: pointer;
}

.userDetailFeatureEditText {
    clear: left;
}

.editUserFeatureBtn {
    float: right;
    margin-top: 10px;
}

.editUserBtn, .editUserBackBtn, .editUserFeatureBtn {
    margin: 15px;
    border-radius: 8px;
    font-family: Arial;
    font-size: 13px;
    padding: 10px 15px 10px 15px;
    text-decoration: none;
    font-weight: bold;
    margin-left: 5px;
    margin-right: 5px;
}

.editUserBtn, .editUserFeatureBtn {
    color: #fff;
    background: #179bd4;
}


    .editUserBtn:hover, .editUserFeatureBtn:hover {
        background: #abcfe1;
        color: #fff;
        text-decoration: none;
        cursor: pointer;
    }

.editUserBackBtn {
    border: 1px solid #999;
    color: #000;
    background: #eee;
}

    .editUserBackBtn:hover {
        background: #F2F2F2;
        color: #000;
        text-decoration: none;
        cursor: pointer;
    }

table.editUserAlias > tr > td {
    padding-bottom: 0;
}

table.editUserFeature > tr > td {
    padding-bottom: 5px;
}

.editUserSubBtn {
    border-radius: 8px;
    font-family: Arial;
    color: #fff;
    font-size: 13px;
    background: #179bd4;
    padding: 5px 10px;
    text-decoration: none;
    margin-bottom: 10px;
    margin-top: 15px;
    vertical-align: middle;
}

    .editUserSubBtn:hover {
        background: #abcfe1;
        text-decoration: none;
        cursor: pointer;
    }

.editUserFeatureSection {
    border-top: 1px solid gray;
    float: left;
    padding-bottom: 20px;
    padding-top: 20px;
    width: 100%;
}

.editUserFeatureSectionPanel {
    clear: left;
}

.lightbox-header-success {
    color: #339900;
}

.lightbox-header-fail {
    color: #cc0000;
}

.lightbox-header-neutral {
    color: #333333;
}

.editable-content-area {
    border: 1px solid gray;
    height: 28px;
    overflow: auto;
    padding: 2px;
    resize: both;
    width: auto;
    height: auto;
    max-height: 150px;
}

/* order products */
.OrderBtn {
    border: 1px solid #179bd4;
    background: #179bd4;
    padding: 2px 10px 2px 10px;
    border-radius: 3px;
    -webkit-box-shadow: rgba(255,255,255,0.4) 0 0 0, inset rgba(255,255,255,0.4) 0 0 0;
    box-shadow: rgba(255,255,255,0.4) 0 0 0, inset rgba(255,255,255,0.4) 0 0 0;
    color: #fff;
    font-size: 13px;
    line-height: 13px;
    font-family: 'Trebuchet MS', helvetica;
    font-weight: bold;
    text-decoration: none;
    vertical-align: middle;
    float: right;
}

    .OrderBtn:hover {
        border: 1px solid #abcfe1;
        background: #abcfe1;
        color: #fff;
    }

/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */

/* Normal buttons */
.button2021 {
    padding: 7px 14px;
    display: inline-block;
    text-decoration: none;
    position: relative;
    border: 1px solid var(--partner_logo_colour);
    border-bottom: var(--partner_logo_colour) 3px solid;
    border-left: var(--partner_logo_colour) 1px solid;
    border-right: var(--partner_logo_colour) 1px solid;
    background: black;
    color: white;
}

    .button2021:hover {
        border: 1px solid var(--nasstarorange);
        border-bottom: var(--nasstarorange) 3px solid;
        border-left: var(--nasstarorange) 1px solid;
        border-right: var(--nasstarorange) 1px solid;
        background: black;
        color: var(--nasstarorange)
    }

.button2021alert {
    border: 1px solid var(--nasstargreen) !important;
    border-bottom: var(--nasstargreen) 3px solid !important;
    border-left: var(--nasstargreen) 1px solid !important;
    border-right: var(--nasstargreen) 1px solid !important;
    background: black;
    color: white;
    -webkit-animation-name: darthformessages;
    animation-name: darthformessages;
    -webkit-animation-duration: 5s;
    animation-duration: 5s;
    -webkit-animation-iteration-count: 2;
    animation-iteration-count: 2;
}

.button2021thumbnail {
    width: 85%
}

@-webkit-keyframes darthformessages {
    from {
        -webkit-box-shadow: 0 0 7px 3px var(--nasstargreen),0 0 2px 2px var(--nasstargreen);
        box-shadow: 0 0 7px 3px var(--nasstargreen),0 0 2px 2px var(--nasstargreen);
        color: white;
        border-radius: 5px;
    }

    25% {
        -webkit-box-shadow: 0 0 14px 3px var(--nasstargreen),0 0 3px 2px var(--nasstargreen);
        box-shadow: 0 0 14px 3px var(--nasstargreen),0 0 3px 2px var(--nasstargreen);
        color: var(--nasstarorange);
    }


    50% {
        -webkit-box-shadow: 0 0 36px 3px var(--nasstargreen),0 0 8px 2px var(--nasstargreen);
        box-shadow: 0 0 36px 3px var(--nasstargreen),0 0 8px 2px var(--nasstargreen);
        color: var(--nasstarorange);
    }

    75% {
        -webkit-box-shadow: 0 0 14px 3px var(--nasstargreen),0 0 3px 2px var(--nasstargreen);
        box-shadow: 0 0 14px 3px var(--nasstargreen),0 0 3px 2px var(--nasstargreen);
        color: var(--nasstarorange);
    }

    to {
        -webkit-box-shadow: 0 0 3px 3px var(--nasstargreen),0 0 1px 2px var(--nasstargreen);
        box-shadow: 0 0 3px 3px var(--nasstargreen),0 0 1px 2px var(--nasstargreen);
        color: white;
        border-bottom: var(--partner_logo_colour) 1px solid !important;
    }
}

@keyframes darthformessages {
    from {
        -webkit-box-shadow: 0 0 7px 3px var(--nasstargreen),0 0 2px 2px var(--nasstargreen);
        box-shadow: 0 0 7px 3px var(--nasstargreen),0 0 2px 2px var(--nasstargreen);
        color: white;
        border-radius: 5px;
    }

    25% {
        -webkit-box-shadow: 0 0 14px 3px var(--nasstargreen),0 0 3px 2px var(--nasstargreen);
        box-shadow: 0 0 14px 3px var(--nasstargreen),0 0 3px 2px var(--nasstargreen);
        color: var(--nasstarorange);
    }


    50% {
        -webkit-box-shadow: 0 0 36px 3px var(--nasstargreen),0 0 8px 2px var(--nasstargreen);
        box-shadow: 0 0 36px 3px var(--nasstargreen),0 0 8px 2px var(--nasstargreen);
        color: var(--nasstarorange);
    }

    75% {
        -webkit-box-shadow: 0 0 14px 3px var(--nasstargreen),0 0 3px 2px var(--nasstargreen);
        box-shadow: 0 0 14px 3px var(--nasstargreen),0 0 3px 2px var(--nasstargreen);
        color: var(--nasstarorange);
    }

    to {
        -webkit-box-shadow: 0 0 3px 3px var(--nasstargreen),0 0 1px 2px var(--nasstargreen);
        box-shadow: 0 0 3px 3px var(--nasstargreen),0 0 1px 2px var(--nasstargreen);
        color: white;
        border-bottom: var(--partner_logo_colour) 1px solid !important;
    }
}

.button2021wide {
    background-color: #29a1d9 !important;
    width: 140px !important;
}

.button2021homenested {
    background-color: var(--pagebackground) !important;
}

.awesomeicon {
    color: var(--partner_logo_colour);
}

.awesomeiconquicklink {
    text-align: center !important;
    padding-bottom: 5px !important;
}

.awesomeicontabs {
    color: var(--partner_logo_colour);
}



.awesomeshadow {
    text-shadow: 0px 0px 0px var(--nasstarorange);
}


/*.OldUmbracoSectionBox {*/
    /*border: 2px solid var(--partner_logo_colour);*/
    /*border: 2px solid #ccc6c6;
    background: white;
    margin-bottom: 20px;
}*/

/*.OldUmbracoSectionBoxFudge {
    background: var(--pagebackground);
}
*/
/*.OldUmbracoSectionBox:hover {
    opacity: 0.9;*/
    /*border: 2px solid var(--partner_logo_colour);*/
    /* background: -o-radial-gradient( top right, , #16222A, #3A6073 );
        background: radial-gradient( circle at top right, #16222A, #3A6073 );*/
    /*-webkit-box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
    box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
    -webkit-animation-name: yoda;
    animation-name: yoda;
    -webkit-animation-duration: 6s;
    animation-duration: 6s;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}

@-webkit-keyframes yoda {
    from {
        -webkit-box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
        box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
    }

    50% {
        -webkit-box-shadow: 0 0 27px 3px var(--nasstarorange),0 0 8px 2px var(--nasstarorange);
        box-shadow: 0 0 27px 3px var(--nasstarorange),0 0 8px 2px var(--nasstarorange);
    }

    to {
        -webkit-box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
        box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
    }
}

@keyframes yoda {
    from {
        -webkit-box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
        box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
    }

    50% {
        -webkit-box-shadow: 0 0 27px 3px var(--nasstarorange),0 0 8px 2px var(--nasstarorange);
        box-shadow: 0 0 27px 3px var(--nasstarorange),0 0 8px 2px var(--nasstarorange);
    }

    to {
        -webkit-box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
        box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
    }
}*/

.OldUmbracoSectionHeader {
    background-color: var(--partner_logo_colour);
    margin-bottom: 0;
    font-weight: 700;
}


.OldUmbracoSectionLeft2 {
    padding-top: 0;
    margin-top: 0;
}

.OldUmbracoSectionLeft {
    flex-grow: 1;
}





.top-link:hover {
    background-color: var(--partner_logo_colour);
    color: black;
}

.button2021nav {
    border-bottom: var(--partner_logo_colour) 1px solid !important;
    border-left: none !important;
    border-right: none !important;
    border-radius: 0 !important;
    border-top: none !important;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: var(--pagebackground);
}

    .button2021nav:hover {
        border-bottom: none !important;
        -webkit-animation-name: darthfornav;
        animation-name: darthfornav;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;
        border-radius: 5px !important;
        -webkit-box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
        box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
    }



/* Text for show filter.  Hide filter*/
#toggle_content {
    color: var(--pagebackground);
}

#filters_content .button {
    border: 1px solid var(--partner_logo_colour);
    border-bottom: var(--partner_logo_colour) 3px solid;
    border-left: var(--partner_logo_colour) 1px solid;
    border-right: var(--partner_logo_colour) 1px solid;
}

    #filters_content .button:hover {
        background-color: var(--partner_logo_colour_rgb_for_hover);
        border: 1px solid var(--partner_logo_colour_rgb);
        border-bottom: var(--partner_logo_colour_rgb) 3px solid;
        border-left: var(--partner_logo_colour_rgb) 1px solid;
        border-right: var(--partner_logo_colour_rgb) 1px solid;
    }

#filters_content .button2 {
    border: 1px solid var(--partner_logo_colour);
    border-bottom: var(--partner_logo_colour) 3px solid;
    border-left: var(--partner_logo_colour) 1px solid;
    border-right: var(--partner_logo_colour) 1px solid;
}

    #filters_content .button2:hover {
        background-color: var(--partner_logo_colour_rgb_for_hover);
        border: 1px solid var(--partner_logo_colour_rgb);
        border-bottom: var(--partner_logo_colour_rgb) 3px solid;
        border-left: var(--partner_logo_colour_rgb) 1px solid;
        border-right: var(--partner_logo_colour_rgb) 1px solid;
    }

.ConnTable tr:hover td {
    background-color: var(--tablerowhovercol);
}

.moduleLeftNav ul li a:hover {
    -webkit-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
    border: 1px solid var(--nasstarorange);
    border-bottom: var(--nasstarorange) 1px solid;
    border-left: var(--nasstarorange) 1px solid;
    border-right: none;
}

.tab-right {
    background-color: var(--nasstarwasgreennowblue);
    color: var(--pagebackground);
    border: 1px solid var(--partner_logo_textcolour);
    margin-right: 25px;
}

#filters_content {
    border-bottom: 3px solid var(--partner_logo_colour);
}

.filterShowHideFilterText {
    color: white;
    font-size: 1em;
    font-weight: 400;
}

#filters_toggle {
    background: #786699;
    color: white;
}

div#ContentPlaceHolder_Body_HomeSweetHome_ImportantMessages_TitleBar {
    /*background: linear-gradient(180deg, var(--nasstarpink) 0%, var(--nasstarorange) 70%, var(--nasstarorange) 100%) !important;*/
    background: #eb4f4f;
    color: black;
}

/* Accordion home screen */
#accordion .ui-accordion-header.ui-state-active {
    background-color: var(--nasstargreen) !important;
    opacity: 0.9;
    color: #000;
}

#accordionimportant {
    /*background-color: var(--pagebackground );*/
    border-radius: 5px;
}


#accordion .ui-accordion-content-active {
    color: white !important;
    border-radius: 5px;
}
.newsitems {
    color: var(--pagebackground);
    background-color: white;
}

/*div#quickLinksContainer:hover {
    background: radial-gradient( circle at top right, #16222A, #3A6073 );
}*/
/* Tables */
.ConnTable td {
    color: var(--pagebackground);
    background-color: white;
    border-bottom: 1px solid #797171 !important;
}

.ConnTable th {
    color: var(--nasstarorange);
    background-color: var(--pagebackground);
    font-weight: 400;
    vertical-align: text-top;
}

.DashtableHeader {
    color: var(--nasstarorange);
    background-color: var(--pagebackground);
    background-image: none !important;
}

.DashPanel {
    float: left;
    width: 100%
}
/* For the order screenwith the green expanding button controls the background*/
table.dataTable.display tbody tr.odd > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 {
    background-color: white !important;
    color: var(--pagebackground) !important;
}

table.dataTable.display tbody tr.even > .sorting_1, table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {
    background-color: white;
    color: var(--pagebackground) !important;
}

/* Text showing 1 of x */
.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate {
    color: var(--pagebackground) !important;
}

    /* Drop down for number of rows to show*/
    .dataTables_wrapper .dataTables_length select {
        background-color: white !important;
    }



.labelownline {
    color: var(--pagebackground);
    background-color: white;
}

.partnerteamhighlight {
    -webkit-box-shadow: 0 0 17px 3px var(--partner_glow),0 0 4px 2px var(--partner_glow) !important;
    box-shadow: 0 0 17px 3px var(--partner_glow),0 0 4px 2px var(--partner_glow) !important;
    border-radius: 5px;
}

.partnerteamemail {
    color: white;
    padding-left: 0;
}

.partnerteam {
    margin-bottom: 10px;
    text-align: center;
    padding-bottom: 7px;
}

    .partnerteam:hover {
        -webkit-filter: none !important;
        filter: none !important;
        opacity: 1 !important;
        -webkit-box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange) !important;
        box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange) !important
    }


.partnerteamemail:hover {
    color: white !important;
    padding-left: 0;
}

.ConnectionSummaryBoxes {
    background-color: white;
}

table.basic th {
    background-color: var(--pagebackground);
    color: var(--nasstarwasgreennowblue);
}

.module-outer-loginonly {
    padding: 3px;
    border-radius: 0px !important;
    background-color: var(--pagebackground);
    color: white !important;
}

/*.module-content {
    background-color: white;
    color: var(--pagebackground);
}
*/
.module-content-login {
    background-color: var(--pagebackground);
    color: white;
}

.right-columnmiddlerow {
    background-color: white !important;
    max-width: 100% !important;
}

.ModuleRightContent {
    background-color: white !important;
    color: var(--pagebackground);
}

.moduleRightContent {
    background-color: white !important;
    color: var(--pagebackground);
}


.moduleLeftNav ul li a {
    background-color: white;
    color: var(--pagebackground);
}

.moduleLeftNav ul li.active a {
    background-color: var(--nasstarpink);
    color: var(--pagebackground);
}

.module.toptabs .tabs li a.tabLink {
    background-color: var(--pagebackground);
    color: white;
}

    .module.toptabs .tabs li a.tabLink:hover {
        background-color: var(--nasstarorange);
        color: var(--pagebackground);
    }

.module.toptabs .tabs li.active a.tabLink, .module.toptabs .tabs li:hover a.tabLink {
    /*background-color: var(--nasstarpink);*/
    color: var(--pagebackground);
    text-shadow: none;
}

/* Not just used by connection table, also by order table as well*/
.ConnTable tr:hover td {
    /* Row hover col for tables */
    background-color: var(--tablerowhovercol);
    color: var(--pagebackground);
}

.ConnTable a {
    color: var(--nasstarblue);
}

.ConnTable th:last-child {
    color: var(--nasstarorange);
}

.dtr-control sorting_1 {
    background-color: black;
}

#FilterSelectors .facontent {
    background: var(--pagebackground);
    color: white;
}

#FilterSelectors .header {
    background-color: var(--nasstarwasgreennowblue);
    color: white;
}
/* */
table.dataTable.display tbody tr.even > .sorting_1, table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {
    background-color: var(--pagebackground);
}

.ConnectionButton {
    color: var(--nasstarpink);
}



table.basic tr.odd {
    background-color: white;
    color: black;
}

table.basic tr.even {
    background-color: white;
    color: black;
}

/* DANGER! */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
    /*background-color: var(--pagebackground);*/
}

h3 {
    color: var(--pagebackground);
}
/* Warning Info boxes */
.warning.icon {
    background-color: var(--nasstarorange);
    color: black;
    margin-top: 10px;
}

/* Odds and evens */
tr.odd {
    background-color: white !important;
    color: var(--pagebackground);
}

tr.even {
    background-color: white !important;
    color: var(--pagebackground);
}

.th {
    background-color: var(--pagebackground) !important;
    color: var(--nasstarorange);
}
/* Loading panel

*/
.loadingBackground p {
    background-color: var(--nasstarorange);
    color: var(--pagebackground);
}

/* LOGIN */
.webp .login {
    background: url('../../img/brand-partner-portal/backgroundnass.webp?version=1');
    background-position-x: center;
}

.no-webp .login {
    background: url('../../img/brand-partner-portal/backgroundnass.jpg?version=1');
    background-position-x: center;
}

.login .inner {
    border-left: 1px solid white;
    border-top: 1px solid white;
    border-right: 2px solid white;
    border-bottom: 2px solid white;
    border-radius: 16px !important;
    -webkit-box-shadow: 0 0 7px 3px white,0 0 2px 2px white;
    z-index: 10000;
    background-color: var(--pagebackground);
}

@keyframes yoda {
    from {
        -webkit-box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
        box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
    }

    25% {
        -webkit-box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
        box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
    }


    50% {
        -webkit-box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 17px 2px var(--nasstarorange);
        box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 17px 2px var(--nasstarorange);
    }

    75% {
        -webkit-box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
        box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
    }

    to {
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}

/*
    Dont you wish you could animate key frames like me ... don't ya ... don't ya
*/
@-webkit-keyframes darth {
    from {
        -webkit-box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
        box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
        color: white;
        border-radius: 5px;
    }

    25% {
        -webkit-box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        color: var(--nasstarorange);
    }


    50% {
        -webkit-box-shadow: 0 0 36px 3px var(--nasstarorange),0 0 8px 2px var(--nasstarorange);
        box-shadow: 0 0 36px 3px var(--nasstarorange),0 0 8px 2px var(--nasstarorange);
        color: var(--nasstarorange);
    }

    75% {
        -webkit-box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        color: var(--nasstarorange);
    }

    to {
        -webkit-box-shadow: 0 0 3px 3px var(--nasstarorange),0 0 1px 2px var(--nasstarorange);
        box-shadow: 0 0 3px 3px var(--nasstarorange),0 0 1px 2px var(--nasstarorange);
        color: white;
    }
}

@keyframes darth {
    from {
        -webkit-box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
        box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
        color: white;
        border-radius: 5px;
    }

    25% {
        -webkit-box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        color: var(--nasstarorange);
    }


    50% {
        -webkit-box-shadow: 0 0 36px 3px var(--nasstarorange),0 0 8px 2px var(--nasstarorange);
        box-shadow: 0 0 36px 3px var(--nasstarorange),0 0 8px 2px var(--nasstarorange);
        color: var(--nasstarorange);
    }

    75% {
        -webkit-box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        color: var(--nasstarorange);
    }

    to {
        -webkit-box-shadow: 0 0 3px 3px var(--nasstarorange),0 0 1px 2px var(--nasstarorange);
        box-shadow: 0 0 3px 3px var(--nasstarorange),0 0 1px 2px var(--nasstarorange);
        color: white;
    }
}

@-webkit-keyframes darthfornav {
    from {
        -webkit-box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
        box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
        color: white;
        border-radius: 5px;
    }

    25% {
        -webkit-box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        color: var(--nasstarorange);
    }


    50% {
        -webkit-box-shadow: 0 0 36px 3px var(--nasstarorange),0 0 8px 2px var(--nasstarorange);
        box-shadow: 0 0 36px 3px var(--nasstarorange),0 0 8px 2px var(--nasstarorange);
        color: var(--nasstarorange);
    }

    75% {
        -webkit-box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        color: var(--nasstarorange);
    }

    to {
        -webkit-box-shadow: 0 0 3px 3px var(--nasstarorange),0 0 1px 2px var(--nasstarorange);
        box-shadow: 0 0 3px 3px var(--nasstarorange),0 0 1px 2px var(--nasstarorange);
        color: white;
        border-bottom: var(--partner_logo_colour) 1px solid !important;
    }
}

@keyframes darthfornav {
    from {
        -webkit-box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
        box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
        color: white;
        border-radius: 5px;
    }

    25% {
        -webkit-box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        color: var(--nasstarorange);
    }


    50% {
        -webkit-box-shadow: 0 0 36px 3px var(--nasstarorange),0 0 8px 2px var(--nasstarorange);
        box-shadow: 0 0 36px 3px var(--nasstarorange),0 0 8px 2px var(--nasstarorange);
        color: var(--nasstarorange);
    }

    75% {
        -webkit-box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        box-shadow: 0 0 14px 3px var(--nasstarorange),0 0 3px 2px var(--nasstarorange);
        color: var(--nasstarorange);
    }

    to {
        -webkit-box-shadow: 0 0 3px 3px var(--nasstarorange),0 0 1px 2px var(--nasstarorange);
        box-shadow: 0 0 3px 3px var(--nasstarorange),0 0 1px 2px var(--nasstarorange);
        color: white;
        border-bottom: var(--partner_logo_colour) 1px solid !important;
    }
}

@-webkit-keyframes TransitioningBackground {
    0% {
        background-position: 1% 0%;
    }

    50% {
        background-position: 99% 100%;
    }

    100% {
        background-position: 1% 0%;
    }
}

@keyframes TransitioningBackground {
    0% {
        background-position: 1% 0%;
    }

    50% {
        background-position: 99% 100%;
    }

    100% {
        background-position: 1% 0%;
    }
}

.CustomDisplayText {
    display: none;
}

.NoticeForCookies {
    color: white;
    margin-top: 12px;
    margin-bottom: 0;
    font-size: 0.8em;
}

.logOnBtn {
    background-color: var(--pagebackground);
    color: white;
    color: #fff;
    -webkit-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
    border-color: white;
}

    .logOnBtn::before {
        content: '';
        display: block;
        position: absolute;
        background: rgba(255, 255, 255, 0.5);
        width: 60px;
        height: 100%;
        top: 0;
        -webkit-filter: blur(5px);
        filter: blur(5px);
    }

    .logOnBtn::after {
        content: '';
        display: block;
        position: absolute;
        background: white;
        width: 30px;
        height: 100%;
        top: 0;
        -webkit-filter: blur(15px);
        filter: blur(15px);
    }



    .logOnBtn:hover {
        -webkit-animation-name: darth;
        animation-name: darth;
        -webkit-animation-duration: 5s;
        animation-duration: 5s;
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
        background-image: -webkit-gradient(linear, right top, left top, from(#3498db), to(black));
        background-image: -o-linear-gradient(right, #3498db, black);
        background-image: linear-gradient(to left, #3498db, black);
        border-color: var(--nasstarorange);
    }

@supports(-webkit-backdrop-filter: grayscale(1)) {
    .logOnBtn:hover {
        -webkit-backdrop-filter: grayscale(1);
    }
}
@supports(backdrop-filter: grayscale(1)) {
    .logOnBtn:hover {
        backdrop-filter: grayscale(1);
    }
}

.logOnBtn:hover::before::after {
    -webkit-transform: translateX(300px) skewX(-15deg);
    -ms-transform: translateX(300px) skewX(-15deg);
    transform: translateX(300px) skewX(-15deg);
    -webkit-transition: 0.3s;
    -o-transition: 0.3s;
    transition: 0.3s;
}

.forgottenpassword {
    color: var(--nassstarhyperlink);
}

.button-fttc {
    border: 1px solid var(--partner_logo_colour);
    border-bottom: var(--partner_logo_colour) 3px solid;
    border-left: var(--partner_logo_colour) 1px solid;
    border-right: var(--partner_logo_colour) 1px solid;
    background: black;
    color: white;
}

/* COLORBOX - Spelt the American way */
#cboxContent {
    background-color: white !important; /* Add a color of your choice */
}

#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxCurrent {
    display: none !important;
}

.button#cboxClose {
}
/* OVERRIDES FOR BADLY WRITTEN TABLES.css! */
thead th {
    background-color: var(--pagebackground) !important;
    color: var(--nasstarorange);
}

td.detail, tr.detail {
    background-color: white !important;
    color: var(--pagebackground) !important;
}

table.details td {
    background-color: white !important;
    color: var(--pagebackground) !important;
}

.detail {
    background-color: var(--pagebackground) !important;
    color: white !important;
}

/* Legal blah blah */
.hyperLinkFooter {
    color: var(--nasstarpink)
}

.gradientLine {
    -webkit-box-shadow: 0 0 10px 0 #3498db inset, 0 0 10px 2px #3498db;
    box-shadow: 0 0 10px 0 #3498db inset, 0 0 10px 2px #3498db;
}

.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate {
    color: var(--pagebackground);
    background-color: white;
    font-size: 1em;
}

/* DOMAINS */
#domain_content {
    border-bottom: solid 4px #ff9900;
}

    #domain_content .selected {
        color: #222;
        border-left: 1px solid #CCC;
        border-top: 1px solid #CCC;
        border-right: 1px solid #999;
        border-bottom: none;
        line-height: 28px;
        font-weight: bold;
        text-decoration: none;
        vertical-align: middle;
        border-radius: 5px 5px 0px 0px;
        float: inherit;
        font-size: 0.8em;
        text-shadow: none;
        background-color: var(--nasstarpink);
        width: 170px !important;
    }

    #domain_content .button {
        color: #BFBFBF;
        border-left: 1px solid #CCC;
        border-top: 1px solid #CCC;
        border-right: 1px solid #999;
        border-bottom: none;
        line-height: 15px;
        vertical-align: middle;
        border-radius: 5px 5px 0px 0px;
        -webkit-box-shadow: none;
        box-shadow: none;
        border-bottom: 1px solid #999;
        margin-top: 5px;
        margin-bottom: 0;
        margin-left: 2px;
        width: 170px;
        font-size: 0.8em;
        border-bottom: none;
    }


        #domain_content .button:hover {
            background-color: var(--nasstarorange) !important;
            color: var(--pagebackground) !important;
            line-height: 15px !important;
        }

        #domain_content .button .selected {
        }

.readonlytextcolor {
    color: lightslategray
}

#domain_content .button:active {
    background-color: var(--nasstarpink) !important;
    color: var(--pagebackground) !important;
    line-height: 15px !important;
    text-shadow: none;
}

.tabLink {
    width: 139px !important
}

/* We hide Sign into partner portal */
.logmsg {
    display: none !important;
}

@media only screen and (max-width : 667px) and (orientation : portrait) {
    body .mobilealert {
        background-color: var(--nasstarorange);
        color: var(--pagebackground);
        -webkit-box-shadow: 0 0 7px 3px var(--nasstarblue),0 0 2px 2px var(--nasstarblue);
        box-shadow: 0 0 7px 3px var(--nasstarblue),0 0 2px 2px var(--nasstarblue);
    }
}

.WelcomeMessage {
    background-color: var(--pagebackground);
    color: white;
    border-bottom: solid 1px var(--nasstarorange);
}




.quickconnectionsearch {
}

    .quickconnectionsearch:hover {
        border-bottom: none !important;
        -webkit-animation-name: darthfornav;
        animation-name: darthfornav;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;
        border-radius: 5px !important;
        -webkit-box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
        box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
    }

.loginfields {
}

    .loginfields:hover {
        border-bottom: none !important;
        -webkit-animation-name: darthfornav;
        animation-name: darthfornav;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
        -webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;
        border-radius: 5px !important;
        -webkit-box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
        box-shadow: 0 0 7px 3px var(--nasstarorange),0 0 2px 2px var(--nasstarorange);
    }

/* Forgotten password override */
.forgetmenot {
    background-color: var(--pagebackground);
    color: white;
}

/**/
.popover-title {
    background-color: var(--nasstarorange);
    color: black;
    padding: 10px;
}

.popover-content {
    padding: 9px 14px;
    width: 100%;
}

.fail {
    background-color: white;
    color: #c33232;
    font-size: 0.8em;
    box-shadow: none !important;
}

.pass {
    background-color: white;
    color: #267626;
    font-size: 0.8em;
    padding: 4px;
    margin: 10px;
    box-shadow: none !important;
}

/* Resources */
.ProdContainer {
    background-color: white;
}

.Resources_Box {
    background: var(--nasstargreen);
    height: 43px;
}

.PartnerResources_Box {
    border: 1px solid var(--nasstargreen);
    background: white;
    text-transform: uppercase !important;
    text-align: center !important;
    background: linear-gradient(180deg, #4eb38d 0%, #4eb38d 40%, #6649f4 100%) !important;
    opacity: 0.9;
}

    .PartnerResources_Box:hover {
        -webkit-box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
        box-shadow: 0 0 17px 3px var(--nasstarorange),0 0 4px 2px var(--nasstarorange);
        -webkit-animation-name: yoda;
        animation-name: yoda;
        -webkit-animation-duration: 6s;
        animation-duration: 6s;
        -webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;
    }

@supports (-webkit-box-reflect: below -1px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(85%, transparent), to(rgba(255, 255, 255, 0.2)))) {
    .PartnerResources_Box:hover {
        -webkit-box-reflect: below -1px -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(85%, transparent), to(rgba(255, 255, 255, 0.2)));
    }
}
.Resource_Box_Text {
}

.PartnerResources_ImageThumnail {
    height: 80px;
    width: auto;
}

input[type="submit"] {
    -webkit-appearance: none !important;
    padding: 7px 14px !important;
    display: inline-block !important;
    text-decoration: none !important;
    position: relative !important;
    border: 1px solid var(--partner_logo_colour) !important;
    border-bottom: var(--partner_logo_colour) 3px solid !important;
    border-left: var(--partner_logo_colour) 1px solid !important;
    border-right: var(--partner_logo_colour) 1px solid !important;
    background: black;
    color: white;
}

    input[type="submit"]:hover {
        border: 1px solid var(--nasstarorange);
        border-bottom: var(--nasstarorange) 3px solid;
        border-left: var(--nasstarorange) 1px solid;
        border-right: var(--nasstarorange) 1px solid;
        background: black;
        color: var(--nasstarorange)
    }


.box.inset {
    font-size: 0.9em;
    background-color: var(--pagebackground)
}

.quicklinks li {
    color: white;
    padding: 8px;
}
/*
input:not([type="radio"]):not([type="checkbox"]) {
    -webkit-appearance: none;
    border-radius: 0;
}*/

.wobble-fix {
    animation: div-rotate 0.7s infinite steps(8);
    transform: translateZ(0);
    transform-origin: 50% 50%;
}

@keyframes div-rotate {
    0% {
        transform: rotate( 0deg) scale(0.1);
    }

    100% {
        transform: rotate(360deg) scale(0.1);
    }
}

.hidesupportlinks {
    display: none;
}



/*
    DASHBOARD
*/
.chartWrapper {
    position: relative;
    height: 150px
}


.chartWrapperLarge {
    position: relative;
    height: 550px
}

.tileIntroWrapper {
    height: var(--tileIntroSectionHeight);
    border-bottom: var(--tileIntroSectionBottomBorder);
    margin-bottom: 10px;
    display: block;
    padding-right: 10px;
}

.tileIntroText {
    padding-left: 10px;
    font-size: var(--tileIntroSectionFontSize);
    text-align: left;
}

/* For tiles with text and some sort of control like slider, radio buttons */
.tileTextPart {
    width: 65%;
}

.tileControlPart {
    width: 35%;
    height: var(--tileIntroSectionHeight);
    border-bottom: var(--tileIntroSectionBottomBorder);
}

.tab-contentDashboard {
    width: 100% !important;
}

progress[value]::-webkit-progress-value::before {
    content: '80%';
    position: absolute;
    right: 0;
    top: -125%;
}

progress[value]::-webkit-progress-bar {
    background-color: #eee;
    border-radius: 2px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
}

.progressBackground {
    background: var(--pagebackground);
    padding: 10px;
    border-radius: 10px;
    margin-bottom: 10px;
    padding: 10px;
    margin: 14px;
    border: 1px solid #3ab3dd !important;
    margin-bottom: 0;
    box-shadow: 0 0 10px 0 #3498db inset, 0 0 10px 2px #3498db
}

.blackText {
    color: black;
}

/*.OldUmbracoSectionHeaderDashboard {
    background-color: var(--partner_logo_colour);
    margin-bottom: 0;
    font-weight: 700;
    padding-top: 0;
    padding-bottom: 0;
    color: black;
    padding-left: 13px;
    padding: 9px;
    border-radius: var(--headerRadius);
}*/



.dashSliderContainer {
    padding-left: 20px;
}

.OldUmbracoSectionContentDashboard {
    border-radius: 5px;
    margin: 5px;
}



/*.button2021dashboard {*/
    /* margin-top: 10px; */
    /*background: #0d0e0e;
    border: 1px solid #3b3a3a;
    font-weight: 600;
    border-radius: 5px;
    padding: 5px;
    margin-top: 5px;
    float: right;
    margin-right: 6px;
    width: 35px;
    height: 33px !important;
}

    .button2021dashboard:hover {
        cursor: pointer;
    }*/

.DashflexibleContainer {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    gap: 12px;
}


.Dash2 {
    width: 48%
}

.DashFull {
    width: 100%;
}

.chartWrapperFullHeightAndWidth {
    height: 350px;
    width: 100%;
}

.OldUmbracoSectionBoxDashboardTileGreedy {
    width: 100%
}




.noDataWrapper {
    position: relative;
    height: 150px;
    background-color: var(--pagebackground);
}

.noDataText {
    color: white;
    text-align: center;
    padding-top: 20px;
}


@media screen and (min-width: 768px) and (max-width: 992px) {
    .Dash2 {
        width: 98%
    }

    .DashFull {
        width: 98%;
    }

    .tileIntroWrapper {
        display: none
    }

    .tileTextPart {
        display: none;
    }

    .chartWrapper {
        position: relative;
        height: 350px
    }

    .noDataWrapper {
        height: 350px;
    }

    .r-tabs .r-tabs-panel {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .OldUmbracoSectionContentDashboard {
        margin: 2px;
    }

    .tileControlPart {
        width: 98%
    }

    .tileControlPart {
        padding: 15px;
    }

    .mapSearchWrapper {
        width: 96%;
    }

    .button2021dashboard {
        padding: 10px;
        margin-top: 10px;
        width: 40px;
        height: 26px;
        align-items: center;
        margin-bottom: 8px;
    }

    /* No point in displaying expand button when in small device mode, a tile is already 100% width */
    .dashexpand {
        display: none;
    }

    .availScreen1Info {
        display: none;
    }
}

@media screen and (min-width: 50px) and (max-width: 767px) {
    .Dash2 {
        width: 98%
    }

    .DashFull {
        width: 98%;
    }

    .tileIntroWrapper {
        display: none
    }

    .tileTextPart {
        display: none;
    }

    .chartWrapper {
        position: relative;
        height: 350px
    }

    .noDataWrapper {
        height: 350px;
    }

    .r-tabs .r-tabs-panel {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .OldUmbracoSectionContentDashboard {
        margin: 2px;
    }

    .tileControlPart {
        width: 98%
    }

    .tileControlPart {
        padding: 15px;
    }

    .mapSearchWrapper {
        width: 96%;
    }

    .button2021dashboard {
        padding: 10px;
        margin-top: 10px;
        width: 40px;
        height: 26px;
        align-items: center;
        margin-bottom: 8px;
    }

    /* No point in displaying expand button when in small device mode, a tile is already 100% width */
    .dashexpand {
        display: none;
    }

    .dashboardTileHeaderText {
        width: 98%;
    }

    .dashboardTileHeaderControls {
        width: 98%;
    }

    .flex-toolbarrightaligned {
        justify-content: flex-start;
    }

    .flex-toolbar2 {
        -ms-flex-flow: unset;
        flex-flow: unset;
    }

    .availScreen1Info {
        display: none;
    }
}

.loadingBackgroundLarge p {
    background: #FFF url(../../css/images/loading-large.gif) no-repeat 30% 90%;
    height: 81px;
    width: 161px;
}
/* Google stuff */
.maplegend {
    background-color: black;
    margin-right: 15px;
    padding: 15px;
    color: black;
    border-radius: 10px;
    box-shadow: black;
    width: 100px;
    margin-left: 10px;
    -webkit-box-shadow: 5px 5px 15px 5px #000000;
    box-shadow: 5px 5px 15px 5px #000000;
    margin-bottom: 10px;
}

.maplegenditem {
    color: white;
    font-size: 1.2em;
    float: right;
}

.maplegendheader {
    color: white;
    font-size: 1.3em;
    text-align: center;
    border-bottom: 1px solid var(--nasstarorange);
    padding-bottom: 5px;
    padding-top: 0;
    margin-top: 0;
    margin-bottom: 12px;
}

.mapPostcodeHeader {
    font-weight: 600;
    margin-bottom: 0;
    padding-bottom: 0;
    font-family: 'Monaco'
}

.waitCenter {
    position: absolute;
    top: 15%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
    width: 100px;
    height: 100px;
}

.awesomeicondashboard {
    color: white;
}


    .awesomeicondashboard:hover {
        color: var(--nasstarorange);
    }

/*.dashboardTileHeaderText {
    width: 40%;
}
*/
.dashboardTileHeaderTextDetail {
    width: 60%;
}


.dashboardTileHeaderControlsDetail {
    width: 40%;
}

.flex-toolbarrightaligned {
    justify-content: flex-end;
}

/* Google tables */
.google-visualization-table-table td {
    color: black;
    font-size: 0.9em;
}

.normal-whitespace {
    white-space: normal;
}

.googleSearchBox {
    width: 50%
}

.googleSearchBoxOptions {
    width: 20%;
    text-align:center
}

.googleSearchBoxResults {
    
}


.googleSearchResultsTextStyleNoMatch {
    margin-left: 30px !important;
    min-width: 120px !important;
    color: #e11111;
    text-align: left;
    padding: 7px;
    font-weight: bold;
    text-align: end
}

.infobox-popup {
    background: #fff;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    padding: 5px;
    margin-left: -100px;
    margin-bottom: 30px;
    width: 200px;
    -webkit-box-shadow: 0 0 1px 0 #595959;
    box-shadow: 0 0 1px 0 #595959;
}

.google-visualization-table .gradient {
    background-image: none !important;
}

.googletablepadding {
    padding: 10px;
}


.tooltipDashboard {
    position: absolute;
    display: none;
    margin-top: 5px;
    margin-right: 7px;
    width: 138px;
    background-color: #56585b;
    border-radius: 5px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    -webkit-box-shadow: 10px 8px 14px -5px rgba(39,39,43,0.75);
    -moz-box-shadow: 10px 8px 14px -5px rgba(39,39,43,0.75);
    box-shadow: 10px 8px 14px -5px rgba(39,39,43,0.75);
    margin-top: -26px;
    margin-right: -4px;
}

.tooltipTextDashboard {
    color: #f8c818;
    font-size: 13px;
    padding-left: 10px;
    padding-top: 5px;
    padding-bottom: 0;
    margin-bottom: 6px;
}

.waiting {
    border: 1px solid black;
    background: black;
    position: absolute;
    top: 50%;
    left: 50%;
    /*display:contents;*/
}

.waitingHeartBeat {
    position: absolute;
    top: 15%;
    left: 15%;
    padding: 20px;
    border: 2px solid limegreen;
    border-radius: 10px;
}

.waitingImage {
    width: 100px;
    height: 20px;
    margin-top: 5px;
    margin-right: 10px;
    opacity: 0.8;
    border-radius: 10px;
    animation-name: logoanimatewaiting;
    animation-delay: 0s;
    animation-duration: 5s;
    animation-iteration-count: 20;
}

@-webkit-keyframes logoanimatewaiting {
    from {
        -webkit-filter: none;
        filter: none
    }

    25% {
        filter: opacity(75%);
    }


    50% {
        filter: opacity(50%);
    }

    75% {
        filter: opacity(25%);
    }

    to {
        filter: opacity(0%);
    }

    85% {
        filter: opacity(25%);
    }

    to {
        filter: opacity(50%);
    }
}

.waitingImageHeartBeat {
    width: 253px;
    height: 47px;
    border-radius: 10px;
    background-color: black;
}

.gm-style .gm-style-iw {
    color: black !important;
    /*font-weight: bold;*/
}

.chartWrapperAvailability {
    position: relative;
    /*height: 150px;*/
    background-color: white;
    border-radius: 6px;
    color: black;
    padding: 10px;
}

.availablilityForm {
    width: 100%;
    /*border-bottom: 1px solid #b4d4ed;*/
    padding: 10px;
}

.availabilityLabelField {
    width: 50%;
}

.availabilityControlField {
    width: 50%;
}

.availabilityControl {
    font-size: 1em;
    padding: 5px;
    border-radius: 5px;
    border-color: #aaabad;
    width: 162px;
    height: 24px;
}

.AvailabilityPanel {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    gap: 12px;
    justify-content: flex-start;
}

.button2021fixednotext {
    width: 20px;
    margin-top: 0px;
    float: right;
}

.availScreen1 {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
    gap: 2px;
}

.availScreen1UserInput {
    width: 100%
}

.availScreen1Info {
    width: 100%;
    padding-top: 0px;
}

.AvailabilityPanelUserInput {
    width: 49%
}

.AvailabilityPanelUserInfoAndResults {
    width: 49%
}

/*.AvailabilityFormTile {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    gap: 6px;
}

    .AvailabilityFormTile > div {
        display: inline-flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: flex-start;
        width: 100%;
        gap: 12px;
    }
*/

.AvailabilityFormTileLabels {
    width: 49%
}

.AvailabilityFormTileControls {
    width: 70%
}

.AvailabilityFormTileLabelsAddress {
    width: 100%
}

.AvailabilityFormTileControlsWide {
    width: 73%
}

.AvailabilityFormTileControlsExtra {
    width: 15%
}

.textBoxAvailability {
    width: 80px;
}

/*.OldUmbracoSectionContentAvailability {
    -moz-border-radius-bottomleft: 5px;
    -moz-border-radius-bottomright: 5px;
    background-color: #c0dcff;
    margin: 5px;
    border-radius: 5px;
    padding: 3px;
}*/

.waitingTileAvailabilityQuickCheck {
    display: inline-flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-end;
    width: 72%;
    background-color: white;
    border-radius: 10px;
    border-color: rgba(255, 255, 255, 0.5);
    padding-left: 40px;
}

.waitingTileAvailabilityQuickCheckText {
    color: rgba(39,39,43,0.75);
    padding-right: 10px;
    margin-right: 0px;
    padding-top: 10px;
    font-weight: 800;
    text-align: right;
}

.tileHeaderAlertBox {
    color: white;
    background-color: green;
    border-radius: 5px;
    margin-right: 10px;
    height: 26px;
    margin-top: 5px;
    padding-left: 11px;
    padding-right: 11px;
    padding-top: 5px;
}

.waitingImageWrapper {
    margin-right: 5px;
    padding-left: 0;
    margin-top: 4px;
}

.waitingTextWrapper {
    float: right
}

.productAvailabilityCard {
    border: solid 4px var(--productAvailable);
    border-radius: 10px;
    -webkit-box-shadow: 10px 8px 14px -5px rgba(39,39,43,0.75);
    -moz-box-shadow: 10px 8px 14px -5px rgba(39,39,43,0.75);
    box-shadow: 10px 8px 14px -5px rgba(39,39,43,0.75);
    width: 147px;
    padding: 10px;
    animation-name: productanim;
    animation-duration: 1s;
    animation-iteration-count: 1;
}

@keyframes productanim {
    from {
        -webkit-box-shadow: 0 0 7px 3px var(--productAvailable),0 0 2px 2px var(--productAvailable);
        box-shadow: 0 0 7px 3px var(--productAvailable),0 0 2px 2px var(--productAvailable);
    }

    25% {
        -webkit-box-shadow: 0 0 14px 3px var(--productAvailable),0 0 3px 2px var(--productAvailable);
        box-shadow: 0 0 14px 3px var(--productAvailable),0 0 3px 2px var(--productAvailable);
    }


    50% {
        -webkit-box-shadow: 0 0 36px 3px var(--productAvailable),0 0 8px 2px var(--productAvailable);
        box-shadow: 0 0 36px 3px var(--productAvailable),0 0 8px 2px var(--productAvailable);
    }

    75% {
        -webkit-box-shadow: 0 0 14px 3px var(--productAvailable),0 0 3px 2px var(--productAvailable);
        box-shadow: 0 0 14px 3px var(--productAvailable),0 0 3px 2px var(--productAvailable);
    }

    to {
        -webkit-box-shadow: 0 0 3px 3px var(--productAvailable),0 0 1px 2px var(--productAvailable);
        box-shadow: 0 0 3px 3px var(--productAvailable),0 0 1px 2px var(--productAvailable);
    }
}

.productNoAvailabilityCard {
    border-radius: 10px;
    -webkit-box-shadow: 10px 8px 14px -5px rgba(39,39,43,0.75);
    -moz-box-shadow: 10px 8px 14px -5px rgba(39,39,43,0.75);
    box-shadow: 10px 8px 14px -5px rgba(39,39,43,0.75);
    width: 147px;
    padding: 10px;
    border: solid 4px var(--noAvailablity);
    opacity: 0.5;
}

.productAvailabilityCardHeader {
    font-size: 1.5em;
    text-align: center;
    border-bottom: solid 3px #d0cfcf;
}

.productNoAvailabilityCardHeader {
    font-size: 1.5em;
    text-align: center;
    border-bottom: solid 3px var(--noAvailablity);
    color: var(--noAvailablity);
}

.productAvailabilityCardHeaderSpeed {
    font-size: 1.2em;
    text-align: center;
}

.productAvailabilityCardHeaderBlurb {
    text-align: center;
    height: 144px;
    font-size: 0.85em;
}

.featureAvailabilityCard {
    border: solid 2px #73d7f3;
    border-radius: 10px;
    -webkit-box-shadow: 10px 8px 14px -5px rgba(39,39,43,0.75);
    -moz-box-shadow: 10px 8px 14px -5px rgba(39,39,43,0.75);
    box-shadow: 10px 8px 14px -5px rgba(39,39,43,0.75);
    height: 31px;
    width: 147px;
    padding: 10px;
    background-color: green;
    color: white;
    margin-bottom: 20px;
}

.featureAvailabilityCard {
    background-color: var(--noAvailablity);
    color: white
}

.featureAvailabilityCard {
    border: solid 2px var(--noAvailablity);
    opacity: 0.5;
}

.featureAvailabilityCardHeader {
    font-size: 1.5em;
    text-align: center;
}

.featureNoAvailabilityCardHeader {
    color: var(--noAvailablity);
}

.availabilityHelp {
    padding-left: 40px;
    font-size: 1em;
}

/* Bulk */
.bulkCheckingDone {
    animation-name: bulkdoneanim;
    animation-duration: 4s;
    animation-iteration-count: 2;
}

@keyframes bulkdoneanim {
    from {
        -webkit-box-shadow: 0 0 7px 3px var(--productAvailable),0 0 2px 2px var(--productAvailable);
        box-shadow: 0 0 7px 3px var(--productAvailable),0 0 2px 2px var(--productAvailable);
    }

    25% {
        -webkit-box-shadow: 0 0 14px 3px var(--productAvailable),0 0 3px 2px var(--productAvailable);
        box-shadow: 0 0 14px 3px var(--productAvailable),0 0 3px 2px var(--productAvailable);
    }


    50% {
        -webkit-box-shadow: 0 0 36px 3px var(--productAvailable),0 0 8px 2px var(--productAvailable);
        box-shadow: 0 0 36px 3px var(--productAvailable),0 0 8px 2px var(--productAvailable);
    }

    75% {
        -webkit-box-shadow: 0 0 14px 3px var(--productAvailable),0 0 3px 2px var(--productAvailable);
        box-shadow: 0 0 14px 3px var(--productAvailable),0 0 3px 2px var(--productAvailable);
    }

    to {
        -webkit-box-shadow: 0 0 3px 3px var(--productAvailable),0 0 1px 2px var(--productAvailable);
        box-shadow: 0 0 3px 3px var(--productAvailable),0 0 1px 2px var(--productAvailable);
    }
}

.swal2-title {
    font-size: 1em !important;
}

.swal2-container.swal2-center > .swal2-popup {
    font-size: 0.8em !important;
}

pre {
    font-family: 'KcomFont', Fallback, Verdana !important;
    font-size: 16px !important
}

.hide {
    display: none !important
}

.show {
    display: block !important
}

.top-link:hover {
    background-color: #ffb548;
}

.show {
    display: flex !important
}