﻿@charset "UTF-8";

@font-face {
    font-family: 'Roboto';
    src: local('Roboto'), url('/fonts/Roboto/Roboto-VariableFont_wdth,wght.ttf') format('truetype');
}


@font-face {
    font-family: 'Roboto Mono';
    src: local('Roboto Mono'), local('Roboto-Mono'), url('/fonts/Roboto_Mono/RobotoMono-VariableFont_wght.ttf') format('truetype');
}

@font-face {
    font-family: 'Inter';
    src: local('Inter'), url('/fonts/Inter/Inter-VariableFont_opsz,wght.ttf') format('truetype');
}




@media only screen and (min-width: 1px) AND (max-width: 339px) {

    .maindeny {
        display: block !important;
    }

    .mainallow {
        display: none !important;
    }
}

@media only screen and (min-width: 340px) {

    .maindeny {
        display: none !important;
    }

    .mainallow {
        display: block !important;
    }
}

.maindeny {
    max-width: 340px;
    height:100vh;
    border: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    -webkit-box-shadow: 0 16px 24px 2px rgba(0, 0, 0, .14), 0 6px 30px 5px rgba(0, 0, 0, .12), 0 8px 10px -7px rgba(0, 0, 0, .2);
    box-shadow: 0 16px 24px 2px rgba(0, 0, 0, .14), 0 6px 30px 5px rgba(0, 0, 0, .12), 0 8px 10px -7px rgba(0, 0, 0, .2);
    background-color: #fff;
}

.sessionexpiredlogocontainer {
    margin: auto;
    text-align: center;
    background-color: transparent;
    opacity: 1;
}

.sessionexpiredlogo {
    max-width: 150px;
    margin-top: 20px;
}

.sessionexpiredtextcontainerdeny {
    display: grid;
    place-items: center;
    margin-top: 60px;
    position: relative;
}

.sessionexpiredtextdeny {
    color: #888888 !important;
    font-size: 6vw;
    text-transform: uppercase;
    font-weight: 600;
    width: 100%;
    text-align: center;
}


:root,
[data-bs-theme=light] {
    --bs-sku1: #89AD19;
    --bs-sku2: #44AEA6;
    --bs-sku3: #002D62;
    --bs-sku4: #DDDDDD;
    --bs-sku5: #3b4056;
    --bs-sku6: #D22B2B;
    --bs-sku7: forestgreen;
}

    #LoginButton, #sendemail, #restart, #MainContent_butCheckout {
        width: 100%;
    }

    a {
        color: var(--bs-sku5);
    }

        a:hover, .button-plusMSP:hover, .button-minusMSP:hover {
            color: forestgreen !important;
        }

    .d-inline-grid {
        display: inline-grid;
    }

    .d-contents {
        display: contents !important;
    }

    .btn-danger {
        color: #fff !important;
        background-color: #ff4d49 !important;
    }

    .inedit .form-control {
        border: solid 2px #89AD19;
    }

    .inattributes .form-control {
        border: solid 2px #89AD19;
    }

    .ininsert .form-control.tomvalidate.skuerror {
        border: solid 2px Red !important;
        color: unset !important;
    }

    .inattributes .form-control.tomvalidate.skuerror {
        border: solid 2px Red !important;
        color: unset !important;
    }

    ul:not(.browser-default) > li {
        list-style-type: none;
    }

    .button-plusSP:hover, .button-minusSP:hover, .button-addSP:hover, .button-viewSP:hover, .button-deleteSP:hover {
        color: var(--bs-sku4) !important;
    }

    .form-control:hover:not([disabled]):not([focus]) {
        border-color: var(--bs-sku2) !important;
    }

    .form-floating > .form-control:focus ~ label:not(.fccombolabelrcbheader), .form-floating > .form-control:not(:placeholder-shown) ~ label:not(.fccombolabelrcbheader),
    .form-floating > .form-control-plaintext ~ label:not(.fccombolabelrcbheader), .form-floating > .form-select ~ label:not(.fccombolabelrcbheader) {
        color: var(--bs-sku2) !important;
    }


    .form-floating-outline .form-control:focus, .form-floating-outline .form-select:focus {
        border-color: var(--bs-sku2) !important;
    }

    .riTextBox.form-control, .riTextBox.form-control:focus {
        height: unset !important;
        padding: 9.5px !important;
    }

    .text-align-right {
        text-align: right !important;
    }

    .text-align-center {
        text-align: center !important;
    }

    .valigntop {
        vertical-align: top !important;
    }

    .RadGrid button, .RadGrid [type="button"] {
        -webkit-border-radius: var(--bs-btn-border-radius) !important;
    }

    .tomvalidate.skuerror {
        color: white !important;
    }

        .tomvalidate.skuerror select {
            background-color: transparent !important;
            color: unset !important;
        }

    input.tomvalidate.skuerror {
        border: solid 1px Red !important;
        color: unset !important;
    }

    input:focus.tomvalidate.skuerror {
        border: solid 2px Red !important;
        color: unset !important;
    }

    .RadWindowPDF1 {
        width: 100% !important;
        height: 100vh !important;
        padding: 0px !important;
        position: fixed !important;
        top: 0px !important;
    }

    .RadWindow .rwTable {
        width: 100vw !important;
        height: 100vh !important;
        table-layout: auto;
    }

    .RadWindow .rwWindowContent {
        height: 20% !important;
    }

    .RadWindow_Silk {
        border-radius: 0px !important;
    }

    #RadEditor1Container.tomvalidate.skuerror {
        background-color: Red !important;
        color: white !important;
        font-style: inherit;
    }

    .RadPicker.form-control {
        height: unset !important;
        min-height: unset !important;
    }

    .tomvalidate.riTextBox.skuerror {
        background-color: Red !important;
        color: white !important;
        font-style: inherit;
    }

    .display-flex {
        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
    }

    .display-inline-block {
        display: inline-block;
    }

    #template-customizer {
        display: none !important;
    }

    #UpdatePanelloginbox {
        display: grid;
    }

    .app-brand-logo img {
        max-height: 48px;
        padding: 0px;
    }

    .btn-primary {
        color: #fff !important;
        background-color: #89AD19 !important;
        border-color: #89AD19 !important;
    }

        .btn-primary:hover:not(.aspNetDisabled) {
            color: #fff !important;
            background-color: #44AEA6 !important;
            border-color: #44AEA6 !important;
        }

    .btn-warning {
        color: #fff !important;
        background-color: #fdb528 !important;
        border-color: #fdb528 !important;
    }

        .btn-warning:hover:not(.aspNetDisabled) {
            color: #fff !important;
            background-color: #e4a324 !important;
            border-color: #e4a324 !important;
        }

    .waves-button-input {
        margin: 0;
        padding: 1px 6px 1px 6px;
        line-height: inherit;
    }

    .w-100i {
        padding: 0px;
        width: 100% !important;
        height: 39px !important;
        min-width: 120px;
    }

    .w-100i input {
        padding: 0px;
        width: 100% !important;
        height: 39px !important;
    }


    .orange {
        background-color: #fdb528 !important;
    }

    .green {
        background-color: #72e128 !important;
    }

    .grey {
        background-color: rgba(38, 43, 67, 0.6) !important;
    }

    .NoRecords {
        font-size:1.2em;
    }

.bg-warning {
    background-color: #f0ad4e !important;
}

    .swal2-modal.swal2-popup .swal2-title {
        margin: 1rem auto 0.5rem;
        max-width: 16em;
        line-height: 1.375;
        padding: 0;
    }

    .swal2-modal.swal2-popup {
        border-radius: 5px !important;
    }

    div:where(.swal2-icon) {
        margin: 1em auto 0.6em;
    }

    .heartbeat {
        position: absolute;
        margin: 0;
        color: red;
        right: 10px;
        top: 20px;
        z-index: 888;
    }

    .modal-content {

    }

    div:where(.swal2-container) .swal2-html-container {
        margin: 0.3em 1.6em 0.3em;
    }

    .RadGrid .rgPagerCell .rgPagerLabel {
        margin: 0px 10px 0px 0px !important;
    }

    .RadGrid_Silk .rgPagerCell .rgNumPart a.rgCurrentPage {
        min-width: 40px;
    }

    .RadGrid .rgPagerCell .rgInfoPart {
        margin-right: 10px;
    }

    @media only screen and (min-width: 1200px) {
        .layout-menu-fixed .layout-horizontal .layout-page .menu-horizontal, .layout-menu-fixed-offcanvas .layout-horizontal .layout-page .menu-horizontal {
            opacity: 0.9;
        }
    }

    .text-ellipsis {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .ml-20px575 {
        margin-left: 20px;
    }

    .ml-10px {
        margin-left: 10px;
    }

@media only screen and (max-width: 575px) {
    .ml-20px575 {
        margin-left: 0px;
    }
}

@media only screen and (max-width: 767.98px) {
    .layout-navbar .navbar-nav .nav-item.dropdown {
        position: relative;
        float: unset;
    }

        .layout-navbar .navbar-nav .nav-item.dropdown .dropdown-menu {
            position: absolute;
            left: unset;
            min-width: 14rem;
            width: unset;
        }
}

@media only screen and (max-width: 767.98px) {
    .layout-navbar .navbar-nav .nav-item.dropdown .dropdown-menu {
        max-width: 14rem !important;
        left: auto !important;
        right: 4px;
        top: unset !important;
    }
}

    #template-customizer {
        display: none;
    }

@media only screen and (min-width: 1400px) {
    .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
        max-width: unset !important;
    }
}

    .RadButton.RadCheckBox .rbIcon, .RadButton.RadCheckBox .rbIcon::before {
        font-size: inherit;
        width: 1em;
        height: 1em;
    }

    .RadComboBox_Silk .rcbInner, .RadComboBoxDropDown_Silk {
        border-radius: 5px;
    }


    /** modal **********************************************************************/
    .modalprogress {
        position: fixed;
        z-index: 999999;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
    }

    .modal-backdrop {
        background-color: var(--bs-sku5);
    }

    .centerpage {
        z-index: 1;
        width: 120px;
        height: 70px;
        margin: auto;
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: white;
        border-radius: 10%;
    }

    .centerimage {
        position: absolute;
        top: 5px;
        left: 20px;
    }

    .modal-overlay {
        position: fixed;
        z-index: 1000;
        top: -25%;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 125%;
        will-change: opacity;
        background-color: var(--bs-sku5);
        opacity: 0.5;
    }

    .sk-wave {
        width: 80px;
        white-space: nowrap;
    }

    .sk-wave-rect {
        background-color: #44AEA6 !important;
        height: 200%;
        width: 18%;
        animation: sk-wave 1.2s infinite ease-in-out;
    }

    .navbar .navbar-light ul a {
        color: white;
    }

    .mr-10px {
        margin-right: 10px;
        width: 12px;
    }

    .mr-50px {
        margin-right: 50px;
    }

    .mr-10 {
        margin-right: 10px;
    }

    a .ordertitle {
        padding: 10px 10px 10px 10px;
        background-color: transparent;
        display: block;
        text-align: center;
        border: solid 1px var(--bs-heading-color);
        border-radius: 5px;
    }

    a .ordertitle:hover {
        background-color: transparent;
    }

    .ordertitle H5 {

    }


@media only screen and (max-width: 767.98px) {
    .modal .modal-dialog:not(.modal-fullscreen) {
        padding: 0px !important;
    }
}


    /** search **********************************************************************/

    #TopContent_btnSearch, #TopContent_butShowBasket {
        /**color: #3b4056 !important;**/
    }

    #search-results-wrapper {
        color: #fff;
        background-color: rgba(16,22,15,.9);
        border-bottom-color: rgba(221,90,18,.9);
        box-shadow: 0 2px 2px rgba(0,11,3,.6);
    }

    #search-results-wrapper {
        position: absolute;
        z-index: 10000;
        top: 0;
        left: 0;
        right: 0;
        border-bottom: 5px solid;
        transition: background 1s;
        color: #fff;
        background-color: rgba(16,22,15,.9);
        border-bottom-color: var(--bs-sku2);
    }

    #search-results-wrapper1 .search-close {
        position: absolute;
        top: 20px;
        right: 20px;
    }

    .searchcontainer {
        position: relative;
        width: 100% !important;
        top: 0px;
        height: 60px;
    }

        .searchcontainer table {
            width: 100%;
            position: relative;
            top: 8px;
        }

    .hidden {
        display: none !important;
    }

    .ProductSearchTop {
        width: 100% !important;
        font-size: 1.8em !important;
        display: block !important;
    }

    .ProductSearchTopProducts {
        width: 100% !important;
        font-size: 1.2em !important;
        display: block !important;
    }

    .CustomerSearchTop {
        width: 100% !important;
        font-size: 1.2em !important;
        display: block !important;
        background-color: var(--bs-sku1);
        color: white;
        border-radius: 5px;
        font-weight: 500;
    }

    .UserSearchTop {
        width: 90% !important;
        font-size: 1.8em !important;
        display: block !important;


    }

    .ImpersonateSearchTop {
        width: 100% !important;
        font-size: 1.6em !important;
        display: block !important;
        background-color: var(--bs-sku1);
        color: white;
        border-radius: 5px;
        font-weight: 500;

    }

    .ManageUsersSearchTop {
        width: 100% !important;
        font-size: 1.6em !important;
        display: block !important;
        background-color: var(--bs-sku1);
        color: white;
        border-radius: 5px;
        font-weight: 500;
    }

    .EnterTodaysRaceSearchTop {
        width: 100% !important;
        font-size: 2em !important;
        display: block !important;
        background-color: var(--bs-sku1);
        color: white;
        border-radius: 5px;
        font-weight: 500;
    }

    .EnterResultsRaceSearchTop {
        width: 100% !important;
        font-size: 1.6em !important;
        display: block !important;
        background-color: var(--bs-sku1);
        color: white;
        border-radius: 5px;
        font-weight: 500;
    }

@media only screen and (max-width: 767.98px) {
    .ImpersonateSearchTop {
        font-size: 1.2em !important;
    }

    .ManageUsersSearchTop {
        font-size: 1.2em !important;
    }
}


@media only screen and (max-width: 400px) {
    .ImpersonateSearchTop {
        font-size: 1em !important;
    }

    .ManageUsersSearchTop {
        font-size: 1em !important;
    }
}



    #ctl00_SearchContent_RadSearchBox1_Input, #ctl00_SearchContent_RadSearchBox1_Input:focus, #ctl00_SearchContent_RadSearchBox1_Input:active {
        border-bottom: none;
        box-shadow: none;
        font-size: 1em !important;
        text-transform: uppercase;
        text-decoration: none;
        font-style: unset !important;
        margin: 0px;
    }

    #ctl00_MainContent_RadSearchBoxCustomer_Input, #ctl00_MainContent_RadSearchBoxCustomer_Input:focus, #ctl00_MainContent_RadSearchBoxCustomer_Input:active {
        border-bottom: none;
        box-shadow: none;
        font-size: 1em !important;
        text-transform: uppercase;
        text-decoration: none;
        font-style: unset !important;
        margin: 0px;
    }

    #ctl00_MainContent_RadSearchBox1_Input, #ctl00_MainContent_RadSearchBox1_Input:focus, #ctl00_MainContent_RadSearchBox1_Input:active {
        border-bottom: none;
        box-shadow: none;
        font-size: 1em !important;
        text-transform: uppercase;
        text-decoration: none;
        font-style: unset !important;
        margin: 0px;
    }


    .RadSearchBox .rsbInner {
        border-radius: 5px;
    }

    .RadSearchBox .rsbInput {
        padding: 6px 0px 6px 12px !important;
        height: 30px !important;
        width: calc(100% - 12px) !important;
    }


    @media only screen and (max-width : 500px) {

        h2, .h2 {
            line-height: 2.2rem !important;
        }

        .ProductSearchTop {
            font-size: 4vw !important;
            min-width: unset;
            position: relative;
            top: 4px;
        }

        #search-results-wrapper1 .search-close {
        }
    }

    .productbasketqtyTOTAL {
        margin-left: 4px;
    }

    .maincard {
        position: relative;
        top: 40px;
        margin-bottom:20px;
    }

    @media only screen and (max-width: 1199px) {
        .maincard {
            position: relative;
            top: -20px;
            margin-bottom: -40px;
        }
    }

    /** password **********************************************************************/

    .navbar-brandMC {
        display: none;
    }

    .mustchangepassword {
        max-width: 35rem;
    }

    .modal-footerMC {
        display: flex;
        flex-shrink: 0;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-end;
    }


    .progress {
        left: 0px;
        max-width: 100%;
    }


    .progress {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        overflow: hidden;
        font-size: .75rem;
        line-height: 1rem;
        text-align: center;
        background-color: #cccccc;
        height: unset !important;
        top: 0px;
        left: 10px;
        margin-bottom: 0px;
        max-width: 100%;
        border-radius: 5px !important;
    }

    .progress-bar-animated {
        -webkit-animation: progress-bar-stripes 1s linear infinite;
        -o-animation: progress-bar-stripes 1s linear infinite;
        animation: progress-bar-stripes 1s linear infinite;
    }

    .progress-bar-striped {
        background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
        background-image: -o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
        background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
        -webkit-background-size: 1rem 1rem;
        background-size: 1rem 1rem;
    }

    .progress-bar {
        height: 2rem;
        color: #fff;
        border-radius: 5px !important;
    }

    .passwordinfo {
        color: darkred;
    }

    /** password **********************************************************************/


    @media only screen and (max-width: 430px) {
        .hide-on-verysmall-only,
        .hide-on-verysmall-and-down {
            display: none !important;
        }


    }

@media only screen and (max-width: 767.98px) {
    .hide-on-small-only,
    .hide-on-small-and-down {
        display: none !important;
    }

    .hideonmobile {
        display: none !important;
    }
}

    @media only screen and (max-width: 991px) {
        .hide-on-med-and-down {
            display: none !important;
        }



    }

    @media only screen and (max-width: 1199px) {
        .hide-on-ddm-and-down {
            display: none !important;
        }
    }

    @media only screen and (min-width: 601px) {
        .hide-on-med-and-up {
            display: none !important;
        }
    }

    @media only screen and (min-width: 601px) and (max-width: 991px) {
        .hide-on-med-only {
            display: none !important;
        }
    }

    @media only screen and (min-width: 1200px) {
        .hide-on-large-only {
            display: none !important;
        }
    }

    @media only screen and (min-width: 2999px) {
        .hide-on-extra-large-only {
            display: none !important;
        }
    }

    @media only screen and (min-width: 1200px) {
        .show-on-extra-large {
            display: block !important;
        }
    }

    @media only screen and (min-width: 992px) {
        .show-on-large {
            display: block !important;
        }
    }

    @media only screen and (min-width: 600px) and (max-width: 991px) {
        .show-on-medium {
            display: block !important;
        }
    }

    @media only screen and (max-width: 600px) {
        .show-on-small {
            display: block !important;
        }
    }

    @media only screen and (min-width: 601px) {
        .show-on-medium-and-up {
            display: block !important;
        }
    }

    @media only screen and (max-width: 991px) {
        .show-on-medium-and-down {
            display: block !important;
        }
    }

    /* Margin Left */
    .ml-0 {
        margin-left: 0 !important;
    }

    .ml-1 {
        margin-left: 1% !important;
    }

    .ml-2 {
        margin-left: 2% !important;
    }

    .ml-3 {
        margin-left: 3% !important;
    }

    .ml-4 {
        margin-left: 4% !important;
    }

    .ml-5 {
        margin-left: 5% !important;
    }

    .ml-6 {
        margin-left: 6% !important;
    }

    .ml-7 {
        margin-left: 7% !important;
    }

    .ml-8 {
        margin-left: 8% !important;
    }

    .ml-9 {
        margin-left: 9% !important;
    }

    .ml-10 {
        margin-left: 10% !important;
    }

    /* rsbPopup */

    .rsbPopup {
        font-size: 1.2em;
        color: white;
        background-color: rgba(16,22,15,.9);
        margin-top: 4px;
        cursor: pointer !important;
        width: calc(100% - 12px) !important;
    }

    @media only screen and (max-width : 500px) {

        .rsbPopup {
            font-size: 1em;
            width: calc(100% - 12px) !important;
        }
    }

    .rsbPopup .rsbList {
    }

    .rsbListItemHovered, .rsbListItem {
        background-color: var(--bs-sku2);
    }

    .rsbPopup .rsbShowAll a {
        padding: 2px 5px;
        border-width: 1px 0 0;
        border-style: solid;
        text-align: center;
        background-color: #DB6B30;
    }

    .rsbListItem:hover {
        background-color: var(--bs-sku1);
    }

/** countdown **********************************************************************/

    .countdown {
        text-align: center;
    }

        .countdown span.time {
            padding: 0px;
            display: inline-block;
            font-size: 64px;
            font-weight: 900;
            color: var(--bs-grey);
            border-radius: 10px;
        }

    .rtt {
    }

    #return-to-top {
        font-family: "Open Sans", BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !important;
        font-size: inherit !important;
        position: fixed;
        top: 0;
        right: 0;
        height: 100%;
        z-index: 9;
        display: none;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        width: 400px;
        -webkit-box-shadow: 0px 8px 26px 0px rgba(38, 43, 67, 0.18);
        box-shadow: 0px 8px 26px 0px rgba(38, 43, 67, 0.18);
        -webkit-transition: all 0.2s ease-in;
        -o-transition: all 0.2s ease-in;
        transition: all 0.2s ease-in;
        -webkit-transform: translateX(420px);
        -ms-transform: translateX(420px);
        transform: translateX(420px);
    }

        #return-to-top .return-to-top-open-btn {
            position: absolute;
            bottom: 80px;
            left: 0;
            z-index: -1;
            display: block;
            width: 38px;
            height: 38px;
            border-top-left-radius: 50%;
            border-bottom-left-radius: 50%;
            background: var(--bs-sku7);
            color: #fff !important;
            text-align: center;
            font-size: 18px !important;
            line-height: 38px;
            opacity: 1;
            -webkit-transition: all 0.1s linear 0.2s;
            -o-transition: all 0.1s linear 0.2s;
            transition: all 0.1s linear 0.2s;
            -webkit-transform: translateX(-58px);
            -ms-transform: translateX(-58px);
            transform: translateX(-58px);
        }

            #return-to-top .return-to-top-open-btn:hover {
                background: var(--bs-sku3);
            }



.show-system-tools-btn {
    position: fixed;
    top: 180px;
    right: 0px;
    display: block;
    width: 38px;
    height: 38px;
    border-top-left-radius: 50%;
    border-bottom-left-radius: 50%;
    background: var(--bs-sku6);
    color: #fff !important;
    text-align: center;
    font-size: 18px !important;
    line-height: 38px;
    opacity: 1;
    z-index: 9;
}


    .show-system-tools-btn:hover {
        background: var(--bs-sku3);
        color: #fff !important;
    }


    #breadcrumbs-wrapper {
        padding: 0px 0;
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 10px;
        margin-bottom: 10px;
        display: block;
    }

/** alert **********************************************************************/

    #alertwrapper {
        padding: 0px 0;
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 0px;
        margin-bottom: 0px;
        position: fixed;
        top: 124px;
        right: 0;
        left: 0;
        z-index: 11;
    }

    @media only screen and (max-width: 1199px) {
        #alertwrapper {
            top: 56px;
        }
    }

    .alert {
        padding: 15px !important;
        padding-left: 10px !important;
        line-height: unset !important;
        border-radius: 0px !important;
        position: relative;
        border-width: 0px !important;
        min-height:60.88px;
    }

    .message {
        background-position-y: -8px;
        background-position-x: -19px;
    }

    .warning {
        padding: 15px !important;
        padding-left: 10px !important;
        line-height: 1.375rem !important;
        border-radius: 0px !important;
        position: relative;
        border-width: 0px !important;
    }



    .alert-container {
        display: none;
    }

    .alert-success {
        margin-bottom: 10px !important;
        margin-top: 9px !important;
        transition: background 1s;
        color: white !important;
        border-color: forestgreen !important;
        background-color: forestgreen !important;
        background-image: linear-gradient(135deg, var(--bs-sku2), var(--bs-sku1)) !important;
    }

    .alert-warning {
        margin-bottom: 10px !important;
        margin-top: 9px !important;
        transition: background 1s;
        color: white !important;
        border-color: darkred !important;
        background-color: darkred !important;
        background-image: linear-gradient(135deg, #880808, #E97451) !important;
    }

        .alert-success a:hover, .alert-warning a:hover {
            color: white !important;
        }


    .alert-message {
    padding-left: 10px;
    padding-right: 10px;
    font-size: 1.4em;
    width: calc(100vw - 90px) !important;
}

@media only screen and (max-width: 400px) {
    .alert-message {
        font-size: 1em;
    }
}


    @media only screen and (min-width: 1200px) {
        .alert-message {
            font-size: 1.4em;
        }
    }



    .message {
        padding: 15px;
        border-radius: 0;
    }

    .alert-close {
        cursor: pointer;
    }

    .alert table {
        width: 90%;
    }

    /** messages **********************************************************************/

    #messagewrapper {
        padding: 0px 0;
        margin-left: 0px;
        margin-right: 0px;
        margin-top: 0px;
        margin-bottom: 0px;
        position: fixed;
        top: 124px;
        right: 0;
        left: 0;
        z-index: 10;
    }

    @media only screen and (max-width: 1199px) {
        #messagewrapper {
            top: 56px;
        }
    }

    .alert-announcement {
        color: rgba(255,255,255,.15);
        margin-bottom: 10px;
        margin-top: 9px;
        transition: background 1s;
        border-bottom-color: var(--bs-sku1);
        border-color: var(--bs-sku1);
        background-color: var(--bs-sku1);
    }

        .alert-announcement .alert-close, .alert-announcement .alert-close:hover {
            color: rgba(255,255,255) !important;
        }


    #message-container {
    }

.alert-message-announcement {
    padding-left: 10px;
    padding-right: 10px;
    font-size: 1.4em;
    color: rgba(255,255,255);
    width: calc(100vw - 70px - var(--scrollbar-width)) !important;
}

.alert-message-announcement2 {
    padding-left: 10px;
    padding-right: 10px;
    font-size: 1.4em;
    color: rgba(255,255,255);
    width: calc(100vw - 120px - var(--scrollbar-width)) !important;
}

@media only screen and (max-width: 400px) {
    .alert-message-announcement {
        font-size: 1em;
        padding-left: 10px;
    }

    .alert-message-announcement2 {
        font-size: 1em;
        padding-left: 10px;
    }
}


    @media only screen and (min-width: 1200px) {
        .alert-message-announcement {
            font-size: 1.4em;
        }

        .alert-message-announcement2 {
            font-size: 1.4em;
        }
    }

    #UpdatePanelmessagewrapper, #UpdatePanelAlertMessage {
        display: contents !important;
    }

    /** RadComboBox **********************************************************************/

    .rcbSeparator {
        color: lightgray;
    }

    .dropdown-trigger {
        display: none !important
    }

    .ddbox {
        position: relative;
        top: 0px;
        left: 0px;
    }

    .ddbox2 {
        position: relative;
        top: 0px;
        left: 0px;
        border: solid 1px #c4c4c4;
        border-radius:5px;
    }

.RadComboBox_Bootstrap .rcbInput {
    font-size: 1em !important;
    height: 40px !important;
}

    .RadComboBox_Bootstrap table {
        -moz-border-radius: 5px !important;
        -webkit-border-radius: 5px !important;
        -khtml-border-radius: 5px !important;
        border-radius: 5px !important;
    }

.RadComboBox select {
    padding: 5px !important;
    display: unset;
    line-height: 48px !important;
    position: relative;
    z-index: 1;
    height: 48px !important;
    margin: 0px 0px 0px 0px !important;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: none;
    outline: none;
    background-color: #fff;
    color: #676b7b;
    border-radius: 5px !important;
}

    .RCBCategory-wrapper, .RCBPage-wrapper, .RCBSort-wrapper, .RCBProductSort-wrapper {
        display: inline-block
    }

    /** Place Order **********************************************************************/

    .product-group-heading {
        font-size: 2em;
    }

    #product-group {
        margin-bottom: 0px;
        margin-top: 5px;
    }

    .container-fluid-alt, .container-fluid-alt2 {
        padding-right: 15px;
        padding-left: 15px;
        margin-right: auto;
        margin-left: auto;
    }

    .productcontainer {
        position: relative;
        max-width: 360px;
        margin: auto;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
    }


    .RadComboBox_Silk .rcbReadOnly.rcbFocused, .RadComboBox_Silk .rcbReadOnly.rcbExpanded {
        border-color: #1193aa;
        color: #fff;
        background-color: var(--bs-sku2) !important;
        background-image: linear-gradient(var(--bs-sku2), #1193aa) !important;
    }

    .RadComboBoxDropDown_Silk .rcbHovered {
        color: #333;
        background-color: var(--bs-sku1) !important;
    }

    .RadComboBox_Silk .rcbReadOnly.rcbHovered {
        border-color: #1193aa;
        color: #fff;
        background-color: var(--bs-sku1) !important;
        background-image: unset !important;
    }


    .zoom:hover {
        transform: scale(1.1); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
    }

    @media only screen and (max-width: 400px) {
        .zoom:hover {
            transform: unset;
        }
    }


    .product-image-wrapper img {
        display: block;
        max-width: 100%;
        height: auto;
    }

    .riSingle {
        display: inline-block;
        white-space: nowrap;
        text-align: left;
        box-sizing: border-box;
    }

    .SelectOptions {
        color: var(--bs-body-color);
    }

    .card-width {
        padding: 0 2rem;
    }

    .card .card-content {
        border-radius: 0px 0px 10px 10px;
        margin-top: 0px;
        margin-bottom: 0px;
        padding-left: 12px;
        padding-right: 12px;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .card-content-colour {
        background-color: #5BB3E5 !important;
    }

.z-depth-4 {
    -webkit-box-shadow: 0 16px 24px 2px rgba(0, 0, 0, .14), 0 6px 30px 5px rgba(0, 0, 0, .12), 0 8px 10px -7px rgba(0, 0, 0, .2);
    box-shadow: 0 16px 24px 2px rgba(0, 0, 0, .14), 0 6px 30px 5px rgba(0, 0, 0, .12), 0 8px 10px -7px rgba(0, 0, 0, .2);
}


    /** Media **********************************************************************/


@media only screen and (min-width: 0px) and (max-width: 767.98px) {

    .container-xxl {
        padding-right: 0.5rem;
        padding-left: 0.5rem;
    }

    .product-group-heading {
        font-size: 1.8em;
    }

    .container-fluid-alt {
        padding-right: 5px;
        padding-left: 5px;
        margin-right: auto;
        margin-left: auto;
    }

    .container-fluid-alt2 {
        padding-right: 5px;
        padding-left: 5px;
        margin-right: auto;
        margin-left: auto;
    }
}


    @media only screen and (min-width: 0px) and (max-width: 500px) {


        .col-s-12 {
            width: 100%;
        }

        .col-sm-12 {
            flex: 0 0 auto;
            width: 100%;
        }

        .productcontainer {
            max-width: 100%;
        }

        .container-fluid-alt {
            padding-right: 2px;
            padding-left: 2px;
            margin-right: auto;
            margin-left: auto;
        }

        .container-fluid-alt2 {
            padding-right: 5px;
            padding-left: 5px;
            margin-right: auto;
            margin-left: auto;
        }

    }

    @media only screen and (min-width: 0px) and (max-width: 320px) {

        .col-s-12 {
            width: 100%;
        }

        .col-sm-12 {
            flex: 0 0 auto;
            width: 100%;
        }
    }


    /** Settings **********************************************************************/

    .rlbGeneralSettings {
    }

        .rlbGeneralSettings ul.rlbList {
            min-height: 300px;
            height: 300px;
            overflow-y: scroll;
            overflow-x: unset;
        }

    .rlbButtonAreaBottom li {
        display: block !important;
    }

    .RadListBox .rlbButtonAreaTop li + li, .RadListBox .rlbButtonAreaBottom li + li {
        margin-left: 0px !important;
    }

.listingiframe1 {
    border: solid 1px #dedede;
    border-radius: 5px;
    padding: 2px;
    top: 0px;
    position: relative;
    border-style:solid; 
    border-width: 1px; 
    border-color:  #c9c9c9;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
    height: 738px;
    max-width:700px;
    width:700px;


}

    .RadEditorMessages {
    }

    .RadEditor {
        border-radius: 5px;
    }

        .RadEditor .MetroTouch.reToolbar {
            border: none !important;
        }

    .PanelWorkingDays {
        width: 100%;
        position: relative;
        top: 0px;
        margin-bottom: 50px;
    }

    .GeneralSettings {
        width: 100%;
        position: relative;
        top: 0px;
        margin-bottom: 50px;
    }

    .RadGrid.RadGrid_Silk {
        border-radius: 5px;
    }


    .RadGrid_Silk .rgCommandCell {
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
    }


    .RadGrid.RadGrid_Silk:not(#ctl00_MainContent_RadGridUsers) {
    }

@media only screen and (max-width: 575px) {

    .RadGrid .rgRow > td,
    .RadGrid .rgAltRow > td,
    .RadGrid .rgEditRow > td,
    .RadGrid .rgFooter > td,
    .RadGrid .rgFilterRow > td,
    .RadGrid .rgHeader,
    .RadGrid .rgResizeCol,
    .RadGrid .rgGroupHeader td {
        padding-left: 10px !important;
        padding-right: 2px !important;
    }
}

@media only screen and (min-width: 576px) {

    .RadGrid .rgRow > td,
    .RadGrid .rgAltRow > td,
    .RadGrid .rgEditRow > td,
    .RadGrid .rgFooter > td,
    .RadGrid .rgFilterRow > td,
    .RadGrid .rgHeader,
    .RadGrid .rgResizeCol,
    .RadGrid .rgGroupHeader td {
        padding-left: 6px !important;
        padding-right: 6px !important;
    }
}




    .rcbExpiry {
        width: 100%;
        position: relative;
        top: 0px;
        margin-bottom: 10px;
    }

    .reTextArea {
        outline-color: #dedede;
        font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
        font-size: 1.1em !important;
        color: #000 !important;
        font-weight: 400;
    }

    #ctl00_MainContent_RadEditor1_contentIframe:not(.reHtmlMode), #RadEditor1_contentIframe:not(.reHtmlMode) {
        min-height: max-content;
    }

    #ctl00_MainContent_RadEditor1_contentIframe .reHtmlMode, #RadEditor1_contentIframe .reHtmlMode {
        height: auto !important;
        min-height: 0px;
    }

    .MetroTouch.RadEditor .reEditorModes a:focus, .MetroTouch.RadEditor .reEditorModes a:active, .MetroTouch.RadEditor a.reMode_selected, .MetroTouch.RadEditor a.reMode_selected:hover, .MetroTouch.reToolWrapper .reSplitButton.reTool:hover {
        background-color: var(--bs-sku2) !important;
        border-color: #25a0da;
        color: #fff !important;
    }


    .RadPicker_Silk.rcCalPopupOpen .rcCalPopup, .RadPicker_Silk.rcMYPopupOpen .rcCalPopup, .RadPicker_Silk.rcTimePopupOpen .rcTimePopup {
        border-color: var(--bs-sku2) !important;
        color: #fff;
        background-color: var(--bs-sku2) !important;
        background-image: none;
    }

    .RadCalendar_Silk .rcSelected a, .RadCalendar_Silk .rcSelected span {
        border-color: var(--bs-sku2) !important;
        color: #fff;
        background-color: var(--bs-sku2) !important;
    }

    .RadInput_Silk a:focus, .RadInput_Silk a:active {
        border-color: #1193aa;
        color: #fff !important;
        background-color: #14afca;
        background-image: none;
    }

    .RadInput_Silk a:focus, .RadInput_Silk a:active {
        border-color: var(--bs-sku2) !important;
        color: #fff;
        background-color: var(--bs-sku2) !important;
        background-image: none;
    }

    .hidedata .rgEditRow {
        display: none;
    }

    .hidedata .rgRow, .hidedata .rgAltRow, .hidedata .rgCommandRow, .hidedata .rgHeader, .hidedata .rgFooter {
        display: none;
    }

    .RadGrid_Silk .rgEditForm {
        border-bottom: unset !important
    }

    .W185 {
        width: 150px;
        display: inline-block;
    }

    .W220 {
        width: 220px;
        display: inline-block;
    }

    .RadMultiSelect.form-control {
        display: inline-table;
    }


    .RadMultiSelect .k-input {
        display: none !important
    }

    .RulesTitle1 {
        font-size: 1.6em;
        font-weight: 600;
    }

    .RulesTitle2 {
        font-size: 1.4em;
        font-weight: 600;
    }

    .RulesTitle3 {
        font-size: 1.2em;
        font-weight: 600;
    }

    .RadGrid3Header {
        height: 110px;
        max-width: 1440px;
        width: 100%;
        color: #5f5f5f;
        border-bottom: none;
        min-height: 110px;
        width: 100%;
        border-radius: 5px 5px 0px 0px;
        overflow-x: auto;
    }

    /* Switch
   ========================================================================== */
    .switch,
    .switch * {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-tap-highlight-color: transparent;
    }

        .switch label {
            cursor: pointer;
        }

            .switch label input[type=checkbox] {
                width: 0;
                height: 0;
                opacity: 0;
            }


                .switch label input[type=checkbox]:checked + .lever:before,
                .switch label input[type=checkbox]:checked + .lever:after {
                    left: 18px;
                }


            .switch label .lever {
                position: relative;
                display: inline-block;
                width: 36px;
                height: 14px;
                margin: 0 16px;
                margin-right: 10px;
                content: '';
                -webkit-transition: background .3s ease;
                -moz-transition: background .3s ease;
                -o-transition: background .3s ease;
                transition: background .3s ease;
                vertical-align: middle;
                border-radius: 15px;
                background-color: rgba(0, 0, 0, .38);
            }

                .switch label .lever:before,
                .switch label .lever:after {
                    position: absolute;
                    top: -3px;
                    left: 0;
                    display: inline-block;
                    width: 20px;
                    height: 20px;
                    content: '';
                    -webkit-transition: left .3s ease, background .3s ease, -webkit-box-shadow .1s ease, -webkit-transform .1s ease;
                    -moz-transition: left .3s ease, background .3s ease, box-shadow .1s ease, transform .1s ease, -moz-transform .1s ease;
                    -o-transition: left .3s ease, background .3s ease, box-shadow .1s ease, -o-transform .1s ease;
                    transition: left .3s ease, background .3s ease, -webkit-box-shadow .1s ease, -webkit-transform .1s ease;
                    transition: left .3s ease, background .3s ease, box-shadow .1s ease, transform .1s ease;
                    transition: left .3s ease, background .3s ease, box-shadow .1s ease, transform .1s ease, -webkit-box-shadow .1s ease, -webkit-transform .1s ease, -moz-transform .1s ease, -o-transform .1s ease;
                    border-radius: 50%;
                }

                .switch label .lever:before {
                    background-color: rgba(255, 145, 0, .15);
                }

                .switch label .lever:after {
                    background-color: #f1f1f1;
                    -webkit-box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
                    box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
                }

    input[type=checkbox]:checked:not(:disabled) ~ .lever:active::before,
    input[type=checkbox]:checked:not(:disabled).tabbed:focus ~ .lever::before {
        -webkit-transform: scale(2.4);
        -moz-transform: scale(2.4);
        -ms-transform: scale(2.4);
        -o-transform: scale(2.4);
        transform: scale(2.4);
        background-color: rgba(255, 145, 0, .15);
    }

    input[type=checkbox]:not(:disabled) ~ .lever:active:before,
    input[type=checkbox]:not(:disabled).tabbed:focus ~ .lever::before {
        -webkit-transform: scale(2.4);
        -moz-transform: scale(2.4);
        -ms-transform: scale(2.4);
        -o-transform: scale(2.4);
        transform: scale(2.4);
        background-color: rgba(0, 0, 0, .08);
    }

    .switch input[type=checkbox][disabled] + .lever {
        cursor: default;
        background-color: rgba(0, 0, 0, .12);
    }

    .switch label input[type=checkbox][disabled] + .lever:after,
    .switch label input[type=checkbox][disabled]:checked + .lever:after {
        background-color: #949494;
    }

    /** type='checkbox' **********************************************************************/


    [type='checkbox']:not(:checked), [type='checkbox']:checked {
        opacity: unset !important;
        position: relative !important;
        pointer-events: unset !important;
    }

    .RadButton_Silk.rbCheckBox .rbText, .RadButton_Silk.rbRadioButton .rbText, .RadButton_Silk.rbToggleButton .rbText {
        color: unset !important;
    }

    .switch {
        margin-right: unset !important;
    }

        .switch label input[type=checkbox]:checked + .lever {
            background-color: rgba(0, 0, 0, .38);
        }

        .switch label input[type=checkbox] + .lever:after {
            background-color: darkred;
        }

        .switch label input[type=checkbox]:checked + .lever:after {
            background-color: forestgreen;
        }

        .switch label input[type=checkbox] + .lever.both:after, .switch label input[type=checkbox] + .lever.both:before {
            background-color: forestgreen;
        }

        .switch label .RadAjaxPanel + .lever:after {
            background-color: forestgreen;
            left: 18px;
        }

        .switch label span.aspNetDisabled + span.lever.checked:after {
            background-color: forestgreen;
            left: 18px !important;
        }

        .switch label span.aspNetDisabled + span.lever.notchecked:after {
            background-color: darkred;
            left: 0px !important;
        }

        .switch label .aspNetDisabled + .lever:after {
            background-color: purple;
            left: 0px !important;
        }

        .switch label .aspNetDisabled + .lever:before {
            background-color: unset;
        }

        .switch label .RadAjaxPanel + .lever:before {
            background-color: unset;
        }

        .switch.WorkingDays label input[type=checkbox] + .lever:after {
            background-color: forestgreen;
        }

        .switch.WorkingDays label input[type=checkbox] + .lever:after {
            background-color: forestgreen;
        }

        .switch.WorkingDays {
            left: 30px;
            top: -1px;
            position: relative;
        }

            .switch.WorkingDays label .lever {
                top: -1px;
            }

    .WorkingDaysCountries {
    }

        .WorkingDaysCountries .RadCheckBox {
            display: block;
        }


    .switch.PYSelecter label input[type=checkbox] + .lever:after {
        background-color: forestgreen;
    }



    /** RadUpload **********************************************************************/
    .RadUpload {
        width: 100% !important;
    }

    html .RadUpload .ruUploadProgress {
        display: inline-block;
        width: 220px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: top;
    }

    html .demo-container .ruFakeInput {
        width: 200px;
        height: 18px;
    }

    .qsf-demo-canvas {
        width: 100%;
        position: relative;
        top: 20px;
        margin-bottom: 20px;
    }

        .qsf-demo-canvas .qsf-list {
            margin: 0;
            padding: 1em 0 1em 0;
            list-style: none;
        }

        .qsf-demo-canvas .RadUpload {
            width: auto;
        }

        .qsf-demo-canvas .ruInputs {
            padding-left: 10px;
        }

            .qsf-demo-canvas .ruInputs li {
                position: relative;
            }

                .qsf-demo-canvas .ruInputs li:first-child {
                    padding-top: 0em;
                    padding-bottom: 0em;
                }

            .qsf-demo-canvas .ruInputs .ruError {
                padding: 5px 5px !important;
                margin: 10px 0px;
                background: #f9e8e8;
                border-radius: 5px;
            }

    .RadUpload_Bootstrap .ruRemove {
        height: 37px !important;
        padding: 0 22px 0 22px !important;
        color: red !important;
        filter: none;
        font-size: 15px !important;
        border: solid 1px #ff4d49 !important;
        text-align: center;
        box-shadow: 0 0.125rem 0.375rem 0 rgba(38, 43, 67, 0.14);
        cursor: pointer;
        color: #fff !important;
        background-color: #ff4d49 !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        letter-spacing: 0.4px;
        min-width: 120px;
        font-weight: 400 !important;
        font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
    }

        .RadUpload_Bootstrap .ruRemove:hover {
            text-decoration: none !important;
            background-color: #e64542 !important;
            border-color: #e64542 !important;
        }


    .qsf-demo-canvas .ruError .ruFileWrap {
        height: auto;
        overflow: visible !important;
        display: block;
    }

    .qsf-demo-canvas .ruError .ruUploadProgress {
        display: block;
    }

    .qsf-demo-canvas .ruError .ruUploadFailure {
        background-position: 2px 80%;
        font-size: 1.2em;
    }

    .qsf-demo-canvas .ruError .ruErrorMessage {
        display: block;
        font-variant: small-caps;
        text-transform: lowercase;
        margin-left: 0px;
        color: #ff4d49;
        padding-bottom: 0;
        padding-left: 0px;
    }

    .ruError .ruErrorMessage {
        display: block;
        font-variant: small-caps;
        text-transform: lowercase;
        margin-left: 5px;
        color: red;
    }

    .qsf-demo-canvas .qsf-results {
        padding: 1em 0 1em 0;
    }

        .qsf-demo-canvas .qsf-results h3 {
            margin: 0;
            padding: 1em 0 1em 40px;
            font-size: 10px;
            font-weight: normal;
            text-transform: uppercase;
            background-position: left center;
            background-repeat: no-repeat;
        }

    .qsf-demo-canvas .qsf-success {
        margin-bottom: 0px;
    }

        .qsf-demo-canvas .qsf-success h3 {
            color: #328d0a;
            background-image: url("images/qsf-demo-success-bg.png");
        }

    .qsf-demo-canvas .qsf-error h3 {
        color: #ef0000;
        background-image: url("images/qsf-demo-error-bg.png");
    }

    .qsf-demo-canvas .qsf-results .qsf-list {
        padding: 10px;
        background: none;
    }

    .qsf-demo-canvas .qsf-success .qsf-list, .qsf-success {
        padding-left: 0px;
        color: green;
    }

    .qsf-demo-canvas .qsf-error .qsf-list {
        background-color: #f9e8e8;
        margin-bottom: 1em;
    }

    .RadUpload .ruFileWrap {
        display: unset !important;
    }


    .UploadSubmitButton:not(:hover) {
        color: #fff !important;
        background-color: #89AD19 !important;
        border-color: #89AD19 !important;
        box-shadow: 0 0.125rem 0.375rem 0 rgba(38, 43, 67, 0.14);
        min-width: 120px;
        font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
        font-weight: 400 !important;
    }

    .UploadSubmitButton:hover {
        color: #fff !important;
        background-color: #44AEA6 !important;
        border-color: #44AEA6 !important;
        box-shadow: 0 0.125rem 0.375rem 0 rgba(38, 43, 67, 0.14);
        min-width: 120px;
        font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
        font-weight: 400 !important;
    }

    .UploadResetButton:not(:hover) {
        color: #fff !important;
        background-color: #89AD19 !important;
        border-color: #89AD19 !important;
        box-shadow: 0 0.125rem 0.375rem 0 rgba(38, 43, 67, 0.14);
        min-width: 120px;
        font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
    }

    .UploadResetButton:hover {
        color: #fff !important;
        background-color: #44AEA6 !important;
        border-color: #44AEA6 !important;
        box-shadow: 0 0.125rem 0.375rem 0 rgba(38, 43, 67, 0.14);
        min-width: 120px;
        font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
    }

    .RadUpload .ruButton.ruBrowse:not(:hover), .RadUpload_Bootstrap .ruBrowse.ruButtonFocus {
        color: #fff !important;
        background-color: #89AD19 !important;
        border-color: #89AD19 !important;
        box-shadow: 0 0.125rem 0.375rem 0 rgba(38, 43, 67, 0.14);
        padding: 8.1px 22px 8.1px 22px !important;
        height: 38.95px;
        width: unset;
        border-radius: 5px !important;
        z-index: 999;
        cursor: pointer;
        outline: unset;
        min-width: 120px;
        font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
    }

    .RadUpload .ruButton.ruBrowse.ruButtonHover {
        color: #fff !important;
        background-color: #44AEA6 !important;
        border-color: #44AEA6 !important;
        box-shadow: 0 0.125rem 0.375rem 0 rgba(38, 43, 67, 0.14);
        padding: 8.1px 22px 8.1px 22px !important;
        height: 38.95px;
        width: unset;
        border-radius: 5px !important;
        z-index: 999;
        cursor: pointer;
        outline: unset;
    }

    .RadUpload .ruStyled .ruFileInput {
        width: 80px;
        top: -3px;
        left: 0px;
        height: 36px;
    }



    .RadButton.rlbaddclose, .RadButton.rlbedit, .RadButton.rlbenable {
        border-radius: 5px !important;
        width: 134px !important;
        color: black !important;
    }

        .RadButton.rlbaddclose input, .RadButton.rlbedit input, .RadButton.rlbenable input {
            font-size: 15px !important;
        }

    .rlbenable {
        position: relative !important;
        top: 0px;
        left: 0px;
        display: block !important;
    }

    .RadButton .rbPrimaryIcon {
        margin: 0 0 0 0 !important;
    }

    span.RadButton_Silk .rbDecorated.rbPrimary {
        padding-left: 20px !important;
    }

    .RadListBox .rlbButtonAreaRight {
        margin-left: 5px;
        float: right;
    }

    .RadListBox .rlbButton {
        width: 134px !important;
    }

    .RadListBox .rlbGroup {
    }

    .rlbaddclose, .rlbsave, .rlbenable, .rlbsave3, .rlbedit {
        border-radius: 5px !important;
        padding: 4px !important;
        height: 31.42px !important;
        line-height: 20px !important;
    }

    .rlbaddclose {
        position: relative !important;
        top: 0px;
        left: 0px;
        display: block !important;
    }

    .rlbedit {
        position: relative !important;
        top: 0px;
        left: 0px;
        display: block !important;
    }


        .rlbenable .rbConfig:before, .rlbaddclose .rbAdd:before, .rlbedit .rbEdit:before {
            content: none;
        }


    .card-content.GeneralSettings {
        min-height: 500px;
        position: relative;
        top: 0px;
        left: 0px;
    }

    .butMasterAttributeSave {
        top: -1px;
        left: 0px;
        position: relative;
    }

    html body .RadInput input.riEmpty, html body .RadInput textarea.riEmpty, html body input.RadInput_Empty {
        font-style: normal !important;
    }

    .riDisabled {
        background-color: #e3e3e3 !important;
    }


    .RadAutoCompleteBox .racTokenList {
        border: none !important;
        padding: 0px 20px 0px 0px !important;
        background-color: transparent !important;
        font-size: 1em;
        border-radius: 5px;
    }

    .RadAutoCompleteBoxPopup_Silk {
        font-size: unset !important;
        font-family: unset !important;
        border-radius: 5px !important;
    }

        .RadAutoCompleteBoxPopup_Silk .racList {
        }

            .RadAutoCompleteBoxPopup_Silk .racList .racItem {
                font-size: unset !important;
                font-family: unset !important;
                color: #fff;
                background-color: var(--bs-sku2) !important;
            }

                .RadAutoCompleteBoxPopup_Silk .racList .racItem:hover {
                    font-size: unset !important;
                    font-family: unset !important;
                    color: #fff;
                    background-color: var(--bs-sku1) !important;
                }

    .RadAutoCompleteBox_Silk .racToken {
        border-radius: 5px !important;
    }

    .RadListBox_Silk .rlbItem.rlbSelected {
        color: #fff;
        background-color: var(--bs-sku2) !important
    }

    .btns, .csbtns, .pbtns, .obtns {
        border: none;
        opacity: 1;
        background-color: transparent;
        color: unset;
    }

    .clipboard .csbtns {
        position: absolute;
        top: 13px;
        left: 210px;
    }

    .ProductDelete {
        position: absolute;
        top: 15px;
        left: -30px;
    }

    /** Products **********************************************************************/


    .fccombo {
        display: inline-table !important;
        position: relative;
        top: -3px;
    }

    .fccombolabel {
        top: -3px !important;
    }


    .RadEditorTitle {
        color: var(--bs-sku2) !important;
    }

    .productitem {
        position: relative;
    }

    .useritem {
        position: relative;
    }

    .productcollection {
    }

    .productgroupitem, .producttypeitem {
        width: 130px;
    }

    .producttypeitem, .productgroupitem, .MasterSwitchDeleted, .MasterSwitchActive {
        vertical-align: sub !important;
    }


    .productnameitem {
        min-width: 300px;
    }

    .productitem400 {
        width: 400px;
    }

    .productitem500 {
        width: 495px;
    }

    .productitem700 {
        width: 700px;
    }

    .productitem762 {
        width: 762px;
    }

    .productitem200 {
        width: 200px;
    }

    .productitem180 {
        width: 180px;
    }

@media only screen and (max-width: 630px) {

    .productitem180 {
        width: 160px;
    }
}

@media only screen and (max-width: 570px) {

    .productitem180 {
        width: 150px;
    }
}


    .productitem185 {
        width: 193px;
    }

    .productitem100 {
        width: 102px;
    }

    .productitem120 {
        width: 120px;
    }

@media only screen and (max-width: 520px) {

    .productitem120 {
        width: 100px;
    }
}

@media only screen and (max-width: 400px) {

    .productitem120 {
        width: 80px;
    }
}

    .productitem220 {
        width: 220px;
    }

    .productitem230 {
        width: 220px;
    }

    .productitem677 {
        width: 677px;
    }

    .storeitem185 {
        width: 193px;
    }

    .productitem193 {
        width: 193px;
    }

    .productitem100P {
        width: 100%;
    }

    .productitem50P {
        width: 40%;
    }

    .productitem100PF {
        width: 100%;
    }

    #ctl00_MainContent_IDOB_wrapper, #ctl00_MainContent_RadDataForm3_ctrl0_RadDatePicker1_wrapper {
        width: 86% !important;
    }

    #ctl00_MainContent_RadDatePickerNU_wrapper {
        width: 92% !important;
    }

    .MasterSwitchActiveTitle {
        display: none;
    }

    .hrwide {
        border-top: solid thin var(--bs-sku2);
        width: 100%;
        margin: auto;
    }

    .RadListViewMT {
        width: 100%;
        min-width: 600px;
    }

    .rlvEmpty {
        padding: 10px;
    }


    .rtsLI.rtsSelected .rtsLink {
        border-bottom: 1px solid var(--bs-sku2) !important;
    }


@media only screen and (min-width: 992px) AND (max-width: 1214px) {

    .hrwide {
        width: 100%;
    }


    .productitem185 {
        width: 193px;
    }

    .productgroupitem, .producttypeitem {
        width: 100%;
        min-width: unset;
        font-size: 13px !important;
    }

    .productnameitem {
        min-width: unset;
    }

    .productgroupitem p, .producttypeitem p {
        padding: 0px !important;
        margin: 0px !important;
    }

    .MasterFilter, .MasterTable {
        display: none !important;
    }

    .MasterSwitchActive {
        display: block !important;
    }

    .MasterSwitch {
        display: inline-block;
        position: relative;
        top: -2px;
        left: -14px
    }

    .MasterSwitchActiveTitle {
        display: inline-block;
    }

    .MasterSwitchDeleted {
        display: none !important;
    }


    .RadButtonEditS {
        position: absolute;
        bottom: 10px;
    }
}


@media only screen and (min-width: 768px) AND (max-width: 991px) {

    .hrwide {
        width: 100%;
    }

    .productitem185 {
        width: 193px;
    }

    .productgroupitem, .producttypeitem {
        width: 100%;
        min-width: unset;
        font-size: 13px !important;
    }

    .productnameitem {
        min-width: unset;
    }

    .productgroupitem p, .producttypeitem p {
        padding: 0px !important;
        margin: 0px !important;
    }

    .MasterFilter, .MasterTable {
        display: none !important;
    }

    .MasterSwitchActive {
        display: block !important;
    }

    .MasterSwitch {
        display: inline-block;
        position: relative;
        top: -2px;
        left: -14px
    }

    .MasterSwitchActiveTitle {
        display: inline-block;
    }

    .MasterSwitchDeleted {
        display: none !important;
    }

    .RadButtonEditS {
        position: absolute;
        bottom: 10px;
    }
}

@media only screen and (min-width: 340px) AND (max-width: 767.98px) {

    .hrwide {
        width: 100%;
    }

    .productitem185 {
        width: 193px;
    }

    .productgroupitem, .producttypeitem {
        width: 100%;
        min-width: unset;
        font-size: 13px !important;
    }

    .productnameitem {
        min-width: unset;
        max-width: calc(100vw - 200px - var(--scrollbar-width)) !important;
        white-space: nowrap;
        overflow: hidden;
    }


    .productgroupitem p, .producttypeitem p {
        padding: 0px !important;
        margin: 0px !important;
    }

    .MasterFilter, .MasterTable {
        display: none !important;
    }

    .MasterSwitchActive {
        display: block !important;
    }

    .MasterSwitch {
        display: inline-block;
        position: relative;
        top: -2px;
        left: -14px
    }

    .MasterSwitchActiveTitle {
        display: inline-block;
    }

    .MasterSwitchDeleted {
        display: none !important;
    }

    .RadButtonEditS {
        position: absolute;
        bottom: 10px;
    }
}

@media only screen and (max-width: 540px) {

    .productitem500 {
        width: 100%;
    }

    .productitem400 {
        width: 100%;
    }

    .productitem700 {
        width: 100%;
    }

    .productitem220 {
        width: 100%;
    }

    .productitem200 {
        width: 100%;
    }

    .productitem185 {
        width: 100%;
    }

    .productitem193 {
        width: 100%;
    }

    .productitem100P {
        width: 100%;
    }

    .productitem50P {
        width: 100%;
    }

    .productitem100PF {
        width: 100%;
    }

    #ctl00_MainContent_IDOB_wrapper, #ctl00_MainContent_RadDataForm3_ctrl0_RadDatePicker1_wrapper {
        width: 92% !important;
    }
}

    .modal-dialogcreatenewuser {
        max-width: 440px !important;
    }

@media only screen and (max-width: 480px) {

    #ctl00_MainContent_RadDatePickerNU_wrapper {
        width: calc(100vw - 112px - var(--scrollbar-width)) !important;
    }
}

    /** Classes **********************************************************************/
    .RadGridClasses {
        transition: 0.3s all cubic-bezier(0.4, 0, 0.2, 1);
        transition-property: margin-top, margin-bottom, border-radius, border;
        box-shadow: 0 0.125rem 0.375rem 0 rgba(38, 43, 67, 0.14);
        border: 0;
    }

        .RadGridClasses.RadGrid_Silk {
            width: 1600px;
            max-width: 1600px;
        }

        .RadGridClasses .rgMasterTable {
            width: 100%;
            max-width: 1600px;
        }


        .RadgridClasses.RadGrid_Silk .rgAltRow > td:hover, .RadgridClasses.RadGrid_Silk .rgRow > td:hover {
            color: #fff;
            background-color: var(--bs-sku2) !important;
        }

        .RadgridClasses.RadGrid_Silk .rgAltRow:hover, .RadgridClasses.RadGrid_Silk .rgRow:hover {
            color: #fff;
            background-color: var(--bs-sku2) !important;
        }

        .RadgridClasses colgroup col {
            width: 100% !important;
        }

        .RadgridClasses.RadGrid_Silk .rgAltRow > td, .RadgridClasses.RadGrid_Silk .rgRow > td {
            width: 100%;
        }

        .RadgridClasses .rgFilterRow > td {
            white-space: unset !important;
        }

        .RadgridClasses .rgHeader, .RadgridClasses .rgFilterRow {
            width: 100%;
        }

        .RadgridClasses .rgFilterRow {
            display: flex;
        }

        .RadgridClasses .rgHeader, .RadgridClasses .rgFilterRow {
            max-width: 1600px;
        }

    .RadGrid div.rgHeaderWrapper {
        max-width: 1600px;
    }


    .radgridfullscreen1600 {
        max-width: 1600px;
        overflow-y: hidden;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch !important;
    }

    .FieldSet2 {
        min-height: 600px;
        margin-bottom: 50px;
        font-size: 1.0rem !important;
    }

    /** Users **********************************************************************/


    .RadGridUsers {
        transition: 0.3s all cubic-bezier(0.4, 0, 0.2, 1);
        transition-property: margin-top, margin-bottom, border-radius, border;
        box-shadow: 0 0.125rem 0.375rem 0 rgba(38, 43, 67, 0.14);
        border: 0;
    }

        .RadGridUsers.RadGrid_Silk {
            width: 100%;
            max-width: 710px;
        }

        .RadGridUsers .rgMasterTable {
            width: 100%;
            max-width: 712px;
        }

        .RadGridUsers.RadGrid_Silk .rgAltRow > td:hover, .RadGridUsers.RadGrid_Silk .rgRow > td:hover {
            color: #fff;
            background-color: var(--bs-sku2) !important;
        }

        .RadGridUsers.RadGrid_Silk .rgAltRow:hover, .RadGridUsers.RadGrid_Silk .rgRow:hover {
            color: #fff;
            background-color: var(--bs-sku2) !important;
        }

        .RadGridUsers colgroup col {
            width: 100% !important;
        }

        .RadGridUsers.RadGrid_Silk .rgAltRow > td, .RadGridUsers.RadGrid_Silk .rgRow > td {
            width: 100%;
        }

        .RadGridUsers .rgFilterRow > td {
            white-space: unset !important;
        }

        .RadGridUsers .rgHeader, .RadGridUsers .rgFilterRow {
            width: 100%;
        }

        .RadGridUsers .rgFilterRow {
            display: flex;
        }

        .RadGridUsers .rgHeader, .RadGridUsers .rgFilterRow {
            max-width: 712px;
        }

    .RadGrid div.rgHeaderWrapper {
        max-width: 712px;
    }


@media only screen and (min-width: 841px) AND (max-width: 1214px) {

    .hrwide {
        width: 100%;
    }

    .RadGridUsers.RadGrid_Silk {
        width: 710px !important;
        max-width: 710px !important;
        min-width: unset;
    }

    .RadGridUsers .rgMasterTable {
        max-width: 712px;
        min-width: unset;
    }

    .RadGridUsers .rgFooter {
        max-width: 712px;
        display: flex !important;
    }

    .RadGridUsers .rgCommandRow {
        max-width: 712px;
    }

    .RadGridUsers.RadGrid .rgCommandCell {
        max-width: 712px;
        display: block;
        background-color: unset !important;
        border-style: none !important;
        border-bottom: unset !important;
        border-width: 0 !important;
        margin-bottom: 0px;
    }


    .RadGridUsers .rgRow, .RadGridUsers .rgAltRow {
        display: block;
        height: auto !important;
        border: solid 1px #eee;
        padding: 4px;
        position: relative;
        padding-bottom: 10px;
        max-width: 712px;
    }

    .RadGridUsers.RadGrid_Silk .rgRow > td, .RadGridUsers.RadGrid_Silk .rgAltRow > td, .RadGridUsers.RadGrid_Silk .rgEditRow > td {
        border-style: none !important;
        border-bottom: unset !important;
        border-width: 0 !important;
        display: inline-grid;
    }

    .RadGridUsers .rgHeader, .RadGridUsers .rgFilterRow {
        max-width: 712px;
    }

    .RadGrid div.rgHeaderWrapper {
        max-width: 712px;
    }
}

@media only screen and (min-width: 768px) AND (max-width: 840px) {

    .hrwide {
        width: 100%;
    }

    .RadGridUsers.RadGrid_Silk {
        width: calc(100vw - 136px - var(--scrollbar-width)) !important;
        max-width: calc(100vw - 136px - var(--scrollbar-width)) !important;
        min-width: unset;
    }

    .RadGridUsers .rgMasterTable {
        max-width: calc(100vw - 138px - var(--scrollbar-width)) !important;
        min-width: unset;
    }

    .RadGridUsers .rgFooter {
        max-width: calc(100vw - 138px - var(--scrollbar-width)) !important;
        display: flex !important;
    }

    .RadGridUsers .rgCommandRow {
        max-width: calc(100vw - 138px - var(--scrollbar-width)) !important;
    }

    .RadGridUsers.RadGrid .rgCommandCell {
        max-width: calc(100vw - 138px - var(--scrollbar-width)) !important;
        display: block;
        background-color: unset !important;
        border-style: none !important;
        border-bottom: unset !important;
        border-width: 0 !important;
        margin-bottom: 0px;
    }


    .RadGridUsers .rgRow, .RadGridUsers .rgAltRow {
        display: block;
        height: auto !important;
        border: solid 1px #eee;
        padding: 4px;
        position: relative;
        padding-bottom: 10px;
        max-width: calc(100vw - 138px - var(--scrollbar-width)) !important;
    }

    .RadGridUsers.RadGrid_Silk .rgRow > td, .RadGridUsers.RadGrid_Silk .rgAltRow > td, .RadGridUsers.RadGrid_Silk .rgEditRow > td {
        border-style: none !important;
        border-bottom: unset !important;
        border-width: 0 !important;
        display: inline-grid;
    }

    .RadGridUsers .rgHeader, .RadGridUsers .rgFilterRow {
        max-width: calc(100vw - 138px - var(--scrollbar-width)) !important;
    }

    .RadGrid div.rgHeaderWrapper:not(.EnterResult,.rgHeaderWrapper) {
        max-width: calc(100vw - 138px - var(--scrollbar-width)) !important;
    }
}

@media only screen and (min-width: 340px) AND (max-width: 767.98px) {

    .hrwide {
        width: 100%;
    }

    .RadGridUsers.RadGrid_Silk {
        width: calc(100vw - 58px - var(--scrollbar-width)) !important;
        max-width: calc(100vw - 58px - var(--scrollbar-width)) !important;
        min-width: unset;
    }

    .RadGridUsers .rgMasterTable {
        min-width: unset;
        max-width: calc(100vw - 60px - var(--scrollbar-width)) !important;
    }

    .RadGridUsers .rgFooter {
        max-width: calc(100vw - 60px - var(--scrollbar-width)) !important;
        display: flex !important;
    }

    .RadGridUsers .rgCommandRow {
        max-width: calc(100vw - 60px - var(--scrollbar-width)) !important;
    }

    .RadGridUsers.RadGrid .rgCommandCell {
        max-width: calc(100vw - 60px - var(--scrollbar-width)) !important;
        display: block;
        background-color: unset !important;
        border-style: none !important;
        border-bottom: unset !important;
        border-width: 0 !important;
        margin-bottom: 0px;
    }


    .RadGridUsers .rgRow, .RadGridUsers .rgAltRow {
        display: block;
        height: auto !important;
        border: solid 1px #eee;
        padding: 4px;
        position: relative;
        padding-bottom: 10px;
        max-width: calc(100vw - 60px - var(--scrollbar-width)) !important;
    }

    .RadGridUsers.RadGrid_Silk .rgRow > td, .RadGridUsers.RadGrid_Silk .rgAltRow > td, .RadGridUsers.RadGrid_Silk .rgEditRow > td {
        border-style: none !important;
        border-bottom: unset !important;
        border-width: 0 !important;
        display: inline-grid;
    }

    .RadGridUsers .rgHeader, .RadGridUsers .rgFilterRow {
        max-width: calc(100vw - 60px - var(--scrollbar-width)) !important;
    }

    .RadGrid div.rgHeaderWrapper:not(.EnterResult,.rgHeaderWrapper) {
        max-width: calc(100vw - 60px - var(--scrollbar-width)) !important;
    }
}


    .useritem.productitem400 {
        width: 400px;
    }

    .useritem .productitem400eye {
        position: relative;
        top: 33px;
        left: 370px;
        z-index: 999;
    }


    .useritem.productitem700 {
        width: 700px;
    }

    .useritem.productitem185 {
        width: 193px;
    }

    .useritem.productitem193 {
        width: 193px;
    }

    .useritem.productitem100P {
        width: 100%;
    }

    .useritem.productitem100PF {
        width: 100%;
    }



@media only screen and (max-width: 540px) {

    .useritem.productitem400 {
        width: 100%;
    }

    .useritem .productitem400eye {
        position: relative;
        top: 33px;
        left: calc(100vw - 130px - var(--scrollbar-width));
        z-index: 2;
    }

    .useritem.productitem700 {
        width: 100%;
    }

    .useritem.productitem185 {
        width: 100%;
    }

    .useritem.productitem193 {
        width: 100%;
    }

    .useritem.productitem100P {
        width: 100%;
    }

    .useritem.productitem100PF {
        width: 100%;
    }
}

.accordion-item:not(.active) .last-accordion-item {
    border-bottom-right-radius: 0.625rem !important;
    border-bottom-left-radius: 0.625rem !important;
}

.accordion-item:not(.active):not(:first-child) .accordion-header {
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
}

.accordion-button-header {
    border: none;
    font-size: 1.75rem !important;
    font-weight: 500;
    background-color: unset !important;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.accordion-item:not(:first-of-type):not(.active) .card-header:first-child {
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
}





.useraccordian {
    width: 704px;
    position: relative;
    top: 2px;
    margin-bottom: 74px;
    max-width: 704px;
    border-radius: 5px;
    left: 4px;
}

    .craftaccordian {
        width: 510px;
        position: relative;
        top: 2px;
        max-width: 704px;
        border-radius: 5px;
        left: 4px;
    }

    .craftaccordianER {
        width: calc(100vw - var(--scrollbar-width) - 70px) !important;
        position: relative;
        top: 2px;
        max-width: 520px;
        border-radius: 5px;
        left: 0px;
    }


    .useraccordian2 {
        width: 704px;
        position: relative;
        top: 20px;
        margin-bottom: 14px;
        max-width: 704px;
        border-radius: 5px;
        left: 4px;
    }

    .accordioncontainer {
        width: 100%;
    }


@media only screen and (max-width: 1556px) {

    .useraccordian {
        top: 20px;
    }
}

@media only screen and (min-width: 768px) AND (max-width: 840px) {
    .useraccordian, .useraccordian2 {
        width: calc(100vw - 136px - var(--scrollbar-width)) !important;
        max-width: calc(100vw - 136px - var(--scrollbar-width)) !important;
        min-width: unset;
    }
}

@media only screen and (min-width: 340px) AND (max-width: 767.98px) {
    .useraccordian, .useraccordian2 {
        width: calc(100vw - 60px - var(--scrollbar-width)) !important;
        max-width: calc(100vw - 60px - var(--scrollbar-width)) !important;
        min-width: unset;
    }
}

    .midform-header {
        font-size: 0.9375rem;
    }


    .RadGrid_Silk .rgMasterTable .rgSelectedCell, .RadGrid_Silk .rgSelectedRow {
        color: #fff;
        background-color: var(--bs-sku1) !important;
    }

    .RadGrid_Silk .rgHoveredRow {
        color: #fff !important;
        background-color: var(--bs-sku2) !important;
        background: var(--bs-sku2) !important;
    }

    .RadGrid_Silk .rgEditRow {
        background-color: var(--bs-sku1) !important;
        color: #fff !important;
        border: none;
    }


/** Announcements ********************************************************************

    #ctl00_MainContent_RadDatePicker1_wrapper, #ctl00_MainContent_RadDatePicker2_wrapper {
        width: calc(100vw - 110px - var(--scrollbar-width) ) !important;
        max-width: 655px !important;
    }**/

    /** Tool Tips **********************************************************************/

    .CloseIcon {
        position: absolute;
        top: -26px !important;
        right: -25px !important;
        background-image: url(/businessservices/images/Close.png) !important;
        background-position: 0 0 !important;
        background-repeat: no-repeat;
        width: 30px !important;
        height: 30px !important;
        border: none !important;
        background-color: transparent !important;
        z-index: 20;
    }

    .RadToolTip_Silk .rtCloseIcon {
        position: absolute;
        top: -16px !important;
        right: -25px !important;
        background-image: url(/businessservices/images/Close.png) !important;
        background-position: 0 0 !important;
        background-repeat: no-repeat;
        width: 40px !important;
        height: 40px !important;
        border: none !important;
        background-color: transparent !important;
        z-index: 20;
    }

    .RadToolTip_Bootstrap .rtCloseIcon {
        position: absolute;
        top: -14px !important;
        left: -14px !important;
        background-image: url(/businessservices/images/Close.png) !important;
        background-position: 0 0 !important;
        background-repeat: no-repeat;
        width: 40px !important;
        height: 40px !important;
        border: none !important;
        background-color: transparent !important;
        z-index: 20;
    }

    .RadToolTip .rtCloseIcon:before {
        display: none !important;
    }

    .RadToolTip_Bootstrap .rtClose {
        background-color: transparent;
    }

        .RadToolTip_Bootstrap .rtClose:hover {
            border: none !important;
            background-color: transparent;
            box-shadow: none !important;
        }

    .RadToolTip_Bootstrap button.rtClose {
        background-color: transparent !important;
        border: none;
    }

    /** Collection **********************************************************************/

    .collectionheader {
        color: var(--bs-sku1) !important;
    }

    .warehouseaddress {
        color: var(--bs-sku1) !important;
    }


    .RadMultiSelect_Silk .k-multiselect-wrap {
        border: none !important;
    }

    /** Manage Orders **********************************************************************/

    .ClientSelectColumn input {
        height: 20px;
        width: 20px;
        margin-top: 8px;
    }

    .RadButton:not(.remove-cb):not(.rlbaddclose):not(.rlbenable):not(.rlbsave4):not(.k-switch):not(.rlbsave7):not(.sameas):not(.rlbedit):not(.lbtnenterrace):not(.SCRMTouch):not(.rdfPageFirst):not(.rdfPagePrev):not(.rdfPageNext):not(.rdfPageLast) {
        height: 38.95px !important;
        line-height: 38.95px !important;
        font-size: 1em !important;
    }

    .pdflogosmall {
        height: 30px;
    }

    .carrierlogosmall {
        height: 30px;
    }

    .RadCalendar1, .RadCalendar2 {
        height: auto !important;
        width: 360px !important;
    }

    .RadCalendar_Bootstrap {
        font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
    }

    .sameas {
        position: relative;
        top: -2px;
    }


    /** Manage Stores **********************************************************************/
    .RadGridStores.RadGrid_Silk .rgEditForm {
        border-bottom: 1px solid #e3e3e3;
        margin-left: 0px;
        margin-right: 0px;
        width: 100%;
    }

    .RadGridStores.RadGrid_Silk {
        max-width: 1472px !important;
    }

    .offcanvas.offcanvas-end.offcanvas-wide {
        width: 90%;
        max-width: 500px;
    }

@media only screen and (max-width: 540px) {
    .offcanvas.offcanvas-end.offcanvas-wide {
        width: 100%;
        max-width: 540px;
    }
}




    /** OrderFlow **********************************************************************/

    .ledsize {
        margin-top: 0px;
        width: 32px;
    }

    .ledsize2 {
        margin-top: 0px;
        width: 40px;
    }


    /** ManageCustomers **********************************************************************/

    .imgcontrol {
        position: absolute;
        top: 100px;
        left: 10px;
        background-color: #fff;
        z-index: 4;
        height: 38px;
        width: 80px;
        padding: 0px !important;
        border: solid 1px #cfd0d6;
        border-radius: 5px;
    }

    .imgdelete {
        position: absolute;
        top: 1px;
        left: 5px;
    }

    .imgupload {
        position: absolute;
        top: 1px;
        left: 43px;
    }

    .RadGrid.RadGridCustomers .rgEditForm table {
        border-collapse: separate !important;
    }

    .RadGrid.RadGridClubs .rgEditForm table {
        border-collapse: separate !important;
    }

    .RadGrid.RadGridClients .rgEditForm table {
        border-collapse: separate !important;
    }


    .imgcustomerok {
        position: relative;
        top: 10px;
    }


    /** Reporting **********************************************************************/

    .rlbFilters {
        background: none !important;
        margin-top: 0px;
        margin-left: 0px;
        margin-bottom: 10px;
    }

        .rlbFilters .rlbGroup, .RadListBox_Silk .rlbFilters .rlbGroup {
            border: none !important;
        }

        .rlbFilters label {
        }

        .rlbFilters .rlbItem {
            padding-left: 10px !important;
            margin-bottom: 0px;
        }

    .rlbItem:not(.rlbSelected) .report-filter-icon {
        display: none !important;
    }

    .PieChartContainer {
        height: 360px;
        width: 360px;
    }

    .PieChartTitleContainer {
        text-align: center;
    }

    .PieChartTitle {
        font-weight: 500;
        font-size: 1em;
    }

    .PieChartSubTitle {
        font-size: 0.8em;
    }

    .btn-primary.hovered {
        color: #fff !important;
        background-color: #44AEA6 !important;
        border-color: #44AEA6 !important;
    }


    .vieworderpdf {
        position: absolute;
        top: 30px;
        left: 10px;
    }

    .LabelOrderID {
        margin-left: 10px;
        margin-bottom: 10px;
    }

    .reporting-search-results-wrapper {
        position: relative;
        top: 10px;
        border-top: 3px solid;
        border-bottom: 3px solid;
        transition: background 1s;
        border-top-color: var(--bs-sku2);
        border-bottom-color: var(--bs-sku2);
        max-width: 1440px;
        display: block;
    }

    .reportingsearchcontainer {
        padding-right: 10px;
        padding-left: 10px;
        padding-top: 10px;
        margin-right: auto;
        margin-left: auto;
        width: 356px;
        height: 53px;
        display: inline-block;
    }

    .rcfilterlist {
        position: relative;
        top: 0px;
        left: 30px;
        display: flex;
        max-width: 80%;
        font-style: italic;
        padding-bottom: 5px;
    }

    .ReportSearchTop {
        width: 100% !important;
        font-size: 1.2em !important;
        display: block !important;
    }


    #ctl00_MainContent_RadSearchBoxR1_Input, #ctl00_MainContent_RadSearchBoxR1_Input:focus, #ctl00_MainContent_RadSearchBoxR1_Input:active,
    #ctl00_MainContent_RadSearchBoxR2_Input, #ctl00_MainContent_RadSearchBoxR2_Input:focus, #ctl00_MainContent_RadSearchBoxR2_Input:active,
    #ctl00_MainContent_RadSearchBoxR3_Input, #ctl00_MainContent_RadSearchBoxR3_Input:focus, #ctl00_MainContent_RadSearchBoxR3_Input:active,
    #ctl00_MainContent_RadSearchBoxR4_Input, #ctl00_MainContent_RadSearchBoxR4_Input:focus, #ctl00_MainContent_RadSearchBoxR4_Input:active {
        border-bottom: none;
        box-shadow: none;
        font-size: 1em !important;
        text-transform: uppercase;
        text-decoration: none;
        font-style: unset !important;
        margin: 0px;
    }

    .RadSearchBox.ReportSearchTop .rsbInput {
        padding: 6px 0px 6px 12px !important;
        height: 30px !important;
        width: calc(100% - 35px) !important;
    }

    .RadSearchBox.ReportSearchTop {
        background-color: var(--bs-sku1);
        color: white;
        border-radius: 5px;
        font-weight: 500;
    }

        .RadSearchBox.ReportSearchTop.rsbDisabled {
            background-color: #e3e3e3;
            color: unset;
        }


@media only screen and (max-width: 400px) {
    .ReportSearchTop {
        width: calc(100vw - 76px - var(--scrollbar-width)) !important;
        max-width: calc(100vw - 76px - var(--scrollbar-width)) !important;
        min-width: 340px;
    }

    .RadSearchBox.ReportSearchTop .rsbInput {
        width: calc(100vw - 114px - var(--scrollbar-width)) !important;
    }

    .rsbPopup .rsbList {
        width: calc(100vw - 64px - var(--scrollbar-width)) !important;
    }

    .rsbSlide {
        width: calc(100vw - 64px - var(--scrollbar-width)) !important;
    }
}

    /** Dashboard **********************************************************************/

    .DataListLD {
        position: relative !IMPORTANT;
        top: 240px;
        left: unset !important;
        background-color: transparent;
        font-size: 2em;
        text-align: left;
    }

    .DataListLL {
        position: absolute !IMPORTANT;
        top: 280px;
        left: 0px !important;
        background-color: transparent;
        font-size: 1.2em;
        text-align: center;
        float: left;
        width: 100%;
    }

    .gaugeproducts {
        background-color: #fff;
        background-repeat: no-repeat;
        background-size: cover;
        max-width: 500px;
        width: 500px !important;
        border-width: 4px !important;
        border-color: #dcf6fe !important;
        border-style: solid !important;
    }

    .craftdetaildataGroup {
        font-size: 14px;
    }




@media only screen and (max-width: 575px) {
    .gaugeproducts {
            left: 10px !important;
        }
    }

@media only screen and (max-width: 720px) {


    #RadToolTipWrapper_ctl00_MainContent_RadToolTipActiveCraft,
    #RadToolTipWrapper_ctl00_MainContent_RadToolTipActiveRaces {
        width: calc(100vw - 20px - var(--scrollbar-width)) !important;
    }

    .gaugeproducts {
        left: unset;
    }
}

    .racetitledataGroup fieldset legend, .craftdetaildataGroup fieldset legend {
        font-weight: 600;
        color: forestgreen;
        font-size: 16.8px;
        margin-left:10px;
    }


        .dataGroup fieldset legend {
            width: 100%;
            height: 20px;
            padding-right: 0;
            line-height: 20px;
            font-weight: bold;
            font-size: 13px;
            border-bottom: 1px solid #ffffff;
            margin-left: 2px !important;
        }

    .dataGroup2 fieldset legend {
        width: 100%;
        height: 20px;
        padding-right: 0;
        line-height: 20px;
        font-weight: bold;
        font-size: 13px;
        border-bottom: 1px solid #ffffff;
        margin-left: 10px;
    }

    .RadToolTip .rtTitleWrapper .rtTitle {
        height: 20px !important;
        padding-right: 0 !important;
        line-height: 20px !important;
        font-weight: bold !important;
        font-size: 16px !important;
        color: #3b4056 !important;
    }

    .rtContent {
        overflow-y: auto;
        max-height: 235px;
        padding-right: 10px;
        color: #3b4056;
    }

    .RadToolTipHelmName .rtContent {
        overflow-y: auto;
        max-height: 160px;
        padding: 0px;
    }

    .RadToolTipHelmName {
        border-radius: 50% !important;
        border: none !important;
        z-index:99;
    }

        .RadToolTipHelmName .rtRelativeWrapper {
            box-sizing: border-box;
            position: relative;
            height: 100%;
            padding: 0px !important;
        }


    .reptable th, .reptable td {
        padding-left: 4px;
        padding-right: 4px;
    }

.dataGroup fieldset, .racetitledataGroup fieldset, .craftdetaildataGroup fieldset {
    border: none !important;
}

    .RadRadialGaugeL {
        position: absolute !IMPORTANT;
        top: 0px;
        left: 0px;
    }

    .GaugeL {
        border-style: none;
        position: relative;
        width: 300px;
        height: 305px;
        display: inline-block;
        margin-bottom: 20px;
    }

    .opc:hover #RadRadialGaugeL5, .opc:hover #RadRadialGaugeL1, .opc:hover #RadRadialGaugeL2, .opc:hover #RadRadialGaugeL3 {
        opacity: 0.3;
    }

    .opc:hover .themiddlePGRID {
        opacity: 1;
    }

    .k-arcgauge-label {
        font-size: 40px;
        color: transparent;
        -webkit-text-stroke-width: 1px;
        -webkit-text-stroke-color: #000;
        font-family: "Roboto Mono";
        font-weight: 500;
        font-style: normal;
    }

    #RadRadialGauge1 .k-arcgauge-label, #RadRadialGauge2 .k-arcgauge-label {
        font-size: 40px;
        color: forestgreen;
        font-family: "Roboto Mono";
        font-weight: 600;
        font-style: normal;
        -webkit-text-stroke-width: 0px;
        -webkit-text-stroke-color: #000;
    }

    .ArcGaugeL {
        border-style: none;
        position: relative;
        width: 160px;
        height: 154px;
        display: inline-block;
        margin-bottom: 30px;
    }

    .DataListLZ {
        position: relative;
        top: 0px;
    }

    .themiddlePGRID {
        transition: .5s ease;
        opacity: 0;
        position: absolute;
        top: 45% !important;
        left: 50%;
        transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        text-align: center;
        border-radius: 5px;
    }

    .thetextPGRID {
        background-color: forestgreen;
        color: white;
        font-size: 1.2em;
        padding: 8px 16px;
        border-radius: 5px;
    }

    .chartcenter {
        font-family: Arial, Helvetica, sans-serif;
        color: #808080;
        font-size: 14px;
    }

    .fakecombo {
        line-height: 1.42857143;
        text-align: left;
        display: inline-block;
        vertical-align: middle;
        border-color: #c4c4c4;
        color: #5f5f5f;
        background-color: #e3e3e3;
        background-image: linear-gradient(white, #e3e3e3);
        padding: 4px 2em 4px 10px;
        border-width: 1px;
        border-style: solid;
        background-repeat: repeat-x;
        background-position: 0 0;
        display: block;
        position: relative;
        border-radius: 5px;
        top: -5px;
    }

    .RadTreeView_Silk .rtSelected .rtIn {
        border-color: unset !IMPORTANT;
        color: #fff !IMPORTANT;
        background-color: unset !IMPORTANT;
    }

        .RadTreeView_Silk .rtSelected .rtIn .fakecombo {
            background-color: var(--bs-sku2);
            background-image: linear-gradient(var(--bs-sku2), #1193aa);
            color: #fff;
        }

    .RadTreeView_Silk .fakecombo:hover {
        background-color: var(--bs-sku1);
        background-image: unset;
        color: #fff;
        border-color: var(--bs-sku2);
    }

    .RadTreeView_Silk .rtHover .rtIn {
        border-color: unset !IMPORTANT;
        color: #fff !IMPORTANT;
        background-color: unset !IMPORTANT;
    }

    .RadTreeView .rtPlus:before, .RadTreeView .rtMinus:before {
        font: 24px 'WebComponentsIcons' !IMPORTANT;
        margin: -.5em 0 0 -.5em;
        width: 2em !IMPORTANT;
        height: 2em !IMPORTANT;
        line-height: 2em !IMPORTANT;
        text-align: center;
        position: absolute;
        top: 50%;
        left: 50%;
    }

    .RadTreeView .rtPlus, .RadTreeView .rtMinus {
        width: 24px !IMPORTANT;
        height: 24px !IMPORTANT;
        line-height: 24px !IMPORTANT;
        position: absolute;
        top: .71428571em;
        left: -12px !IMPORTANT;
        margin-top: -19px !IMPORTANT;
        cursor: pointer;
    }

        .helmimage {
            height: 100px;
            width: 100px;
            background-color: white;
            padding: 10px;
            margin-top: 0px;
            background-size: cover;
            background-repeat: no-repeat;
            background-position-x: center;
            background-position-y: center;
            border-radius: 50%;
            -moz-border-radius: 50%;
            -webkit-border-radius: 50%;
            border: solid 1px #c5c6c6;
        }

            .helmimage.uc1 {
                position: absolute;
                top: 10px;
                right: 10px;
                left: unset;
                height: 80px;
                width: 80px;
            }

            .helmimage.rg0 {
                position: absolute;
                top: 3px;
                left: -3px;
                height: 80px;
                width: 80px;
            }

            .helmimage.rg1 {
                position: absolute;
                top: 10px;
                left: 5px;
                height: 80px;
                width: 80px;
            }

            .helmimage.rg2 {
                position: absolute;
                top: 3px;
                left: -6px;
                height: 80px;
                width: 80px;
            }

            .helmimage.rg3 {
                position: absolute;
                top: 3px;
                left: -3px;
                height: 80px;
                width: 80px;
            }

            .helmimage.rg4 {
                position: absolute;
                top: 10px;
                left: 5px;
                height: 80px;
                width: 80px;
            }

            .helmimage.sr1 {
                position: absolute;
                top: 10px;
                right: 10px;
                left: unset;
                height: 80px;
                width: 80px;
            }

            .helmimage.er1 {
                position: absolute;
                top: 10px;
                left: 180px;
                height: 80px;
                width: 80px;
            }

            .helmimage.etr1 {
                position: relative;
                top: 0px;
                left: 0px;
                height: 70px;
                width: 70px;
            }

    @media only screen and (min-width: 1200px) {

        .helmimage.rg0 {
            position: absolute;
            top: 5px;
            left: -170px;
            height: 80px;
            width: 80px;
        }

        .helmimage.rg3 {
            position: absolute;
            top: 5px;
            left: -270px;
            height: 80px;
            width: 80px;
        }

        .helmimage.rg2 {
            position: absolute;
            top: 6px;
            left: -170px;
            height: 80px;
            width: 80px;
        }

        .RadGridResults0MasterGrid {
            table-layout: fixed !important;
        }

        .RadGridResults2MasterGrid {
            table-layout: fixed !important;
        }

        .RadGridResults3MasterGrid {
            table-layout: fixed !important;
        }


    }

    @media only screen and (max-width: 975px) {

        .helmimage.uc1 {
            position: absolute;
            top: 10px;
            right: 10px;
            left: unset;
            height: 80px;
            width: 80px;
        }
    }





    /** Notification **********************************************************************/
    .layout-navbar .navbar-nav .nav-item.dropdown .dropdown-menu.user-notifications {
        max-width: 340px !important;
        width: 340px !important;
        right: 4px !important;
        top: unset !important;
        min-width: auto;
        position: absolute !important;
        left: auto !important;
    }

    .user-notificationsdd {
        position: static !important;
    }

    .activity {
        margin-left: 10px;
        margin-right: 10px;
        font-size: 0.8em;
    }

    .collection {
        position: relative;
        margin: .5rem 0 1rem 0;
    }

    #activity .collection .collection-item {
        margin: 0;
        padding: 10px 20px;
        background-color: #fff;
        padding-left: 1rem;
        border: none;
    }


    .activity ul {
        max-height: 25.75rem;
        overflow: auto;
    }

    #activity .collection-item::before {
        font-family: 'Material Icons';
        font-size: 1rem;
        position: absolute;
        left: 1.6%;
        content: 'lens';
        color: #e0e0e0;
        border-radius: 100%;
    }

    #activity .collection .collection-item p {
    }

    .font-weight-900 {
        font-weight: 900 !important;
    }



    #activity .collection .collection-item .secondary-content {
        color: #c5cae9;
    }

    /** General **********************************************************************/

    span.badge[data-badge-caption]::after {
        content: ' ' attr(data-badge-caption);
    }


    .secondary-content {
        float: right;
    }

    .badge {
        font-size: 12px !important;
    }


    .login-bg {
        background-image: url('/app-assets/images/gallery/flat-bg.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: left bottom;
    }

    .fa-rya {
        background-image: url(/businessservices/documentation/RYA/RYA.png) !important;
        height: 24px !important;
        width: 24px !important;
        background-size: contain;
        background-repeat: no-repeat;
    }

    .fa-ws {
        background-image: url(/businessservices/documentation/RROS/ws.png) !important;
        height: 24px !important;
        width: 24px !important;
        background-size: contain;
        background-repeat: no-repeat;
    }

    .fa-allen {
        background-image: url(/businessservices/documentation/RROS/allen.png) !important;
        height: 24px !important;
        width: 24px !important;
        background-size: contain;
        background-repeat: no-repeat;
    }

    .fa-pk {
        background-image: url(/businessservices/documentation/SCSC/pk.png) !important;
        height: 24px !important;
        width: 24px !important;
        background-size: contain;
        background-repeat: no-repeat;
    }

    .brand-colour-1 {
        color: #3b4056 !important;
    }

    .RadInput .riTextBox:not(.EditRace) {
        height: 31px !important;
    }

    .tomvalidate.skuerror {
        border: solid 1px Red !important;
        color: unset !important;
    }

    select.skuerror {
        background-color: Red !important;
        color: white !important;
        font-style: inherit;
    }

    .RadInput .rcCalPopup {
        text-indent: 0px !important;
    }

    .form-controlrdp {
        padding-top: 0.47rem !important;
        padding-bottom: 0.47rem !important;
    }

    .borderradius4 {
        border-radius: 4px;
    }

    .rcbCraftError {
        font-size: 1.8em;
        line-height: 10px;
        color: red;
        top: 10px;
        position: relative;
    }

    .red-text {
        color: #f44336 !important;
    }

    .green-text {
        color: forestgreen !important;
    }

    .grey-text {
        color: #000 !important;
    }

    .rgHoveredRow .grey-text {
        color: #fff !important;
    }


.orange-text {
    color: orange !important;
}

    .forestgreen {
        color: forestgreen;
    }

    .larger-text {
        font-size: 1.2em;
    }

    .clubavatar {
        position: relative;
        cursor: pointer;
    }

.avatar .avatar-initial {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #5BB3E5;
    font-size: 0.9375rem;
    color:white;
}


    .clubzoom:hover {
        zoom: 6;
        z-index: 9999;
        position: absolute;
        top: 10px;
        right: 0px;
    }

    .sticky-element {
        position: sticky;
        position: -webkit-sticky;
        z-index: 8;
        top: 120px;
        margin-inline-end: 0px;
        border-top-left-radius: 10px !important;
        border-top-right-radius: 10px !important;
    }

    @media only screen and (max-width: 1199px) {
        .sticky-element {
            position: sticky;
            position: -webkit-sticky;
            z-index: 8;
            top: 64px;
            margin-inline-end: 0px;
            border-top-left-radius: 10px !important;
            border-top-right-radius: 10px !important;
        }
    }

    .borderradius5top {
        border-top-left-radius: 10px !important;
        border-top-right-radius: 10px !important;
    }

    .rtbMultiLine {
        height: 100px !important;
    }

    .RadGrid .rgCommandRow img {
        width: 32px;
    }

    .inline-block {
        display: inline-block !important;
    }


    .RadButton.lbtnenterrace.rbDisabled {
        opacity: 1;
        cursor: default;
    }


    .accordion-button:not(.accordion-button2) {
        height: 65px;
        line-height:20px;
    }

    .accordion-button2 {
        height: 45px;
    }

    .iframe {
        height: 80vh;
        border: 1px solid lightgray;
        width: 100%;
    }


    @media only screen and (max-width: 400px) {
        .iframe {
            height: 70vh;
        }

    }

    @media only screen and (max-width: 380px) {

        .logintitle {
            font-size: 0.8em;
        }
    }

    .caret {
        display: none;
    }

    .RadTouchExtender {
        width: 100% !important;
    }


    .RadGrid_Silk .rgGroupHeader {
        font-size: 1.2em !important;
    }

    .RadGrid_Silk .rgGroupItem {
        font-size: 1.2em !important;
    }

    .rgUngroup {
        display: none !important;
    }

    .RadGrid div.rgHeaderWrapper {
        max-width: unset;
    }

    .rgMasterTable {
        font-size: 14px;
    }

    .card-content.GeneralSettings {
        min-height: 0px;
    }


    .aspNetDisabled.btn {
        color: #fff !important;
        opacity: var(--bs-btn-disabled-opacity);
        cursor: default;
    }

    .RadTreeList .rtlHeader, .RadTreeList .rtlRFooter {
        color: #888;
        text-transform: uppercase;
        font-size: .714em;
        line-height: 2;
    }

    .rcCalPopup:before {
        content: "\e108"
    }

    .rcTimePopup:before {
        content: "\e107"
    }

    .RadPicker .RadInput a {
        text-indent: 0px;
        min-width: 30px;
        border-width: 0px !important;
    }

    .RadPicker .rcSelect {
        border-style: solid;
        border-width: 0px;
    }

    .RadPicker .rcSelect {
        right: 0px !important;
        top: 0px !important;
        bottom: 0px !important;
    }

    .RadTreeList_Silk .rtlEditForm a {
        color: #5f5f5f !important;
    }

    .RadPicker .riTextBox {
        padding: 4px 10px !important;
        border-width: 0px !important;
        font-size: 15px !important;
    }


    .pin {
        color: white !important;
        background-color: #2c323f !important;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
    }

        .pin:hover {
            color: white !important;
            background-color: black !important;
            -webkit-transition: all 0.3s ease;
            -moz-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
        }

    .pin1 {
        color: white !important;
        background-color: darkred !important;
        -webkit-transition: all 0.3s ease;
        -moz-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
    }

        .pin1:hover {
            color: white !important;
            background-color: black !important;
            -webkit-transition: all 0.3s ease;
            -moz-transition: all 0.3s ease;
            -o-transition: all 0.3s ease;
            -ms-transition: all 0.3s ease;
        }



    .race-container-keyboard {
        margin: auto;
        text-align: center;
    }

    .race-container-search {
        max-width: 570px;
        margin: auto;
        text-align: center;
        margin-top: 10px;
    }

    .impersonate-container-search {
        max-width: 570px;
        text-align: left;
        margin-top: 10px;
    }

    .FieldSet1 .RadButton:not(.SCRMTouch) {
        height: 38.95px !important;
        line-height: 38.95px !important;
        top: -1px;
    }

    .SCRMTouchKey {
        height: 80px !important;
        width: 80px !important;
        display: inline-block;
    }

    .SCRMTouchKeySpace {
        height: 80px !important;
        width: 400px !important;
        display: inline-block;
    }

    .spacekeypadding {
        padding-top: 80px;
    }


    .SCRMTouchKey button {
        font-size: 2em !important;
        padding: 0px !important;
    }

    .SCRMTouchKeySpace button {
        font-size: 2em !important;
        padding: 0px !important;
    }

    .SCRMTouchKey1 {
        height: 80px !important;
        width: 80px !important;
        display: inline-block;
    }

        .SCRMTouchKey1 button {
            font-size: 2em !important;
            padding: 0px !important;
        }

    .SCRMTouchKey1L {
        height: 70px !important;
        width: 370px !important;
        display: inline-block;
    }

    .SCRMTouchKey1A {
        display: none;
        height: 34px !important;
        width: 34px !important;
    }

    @media only screen and (max-width: 953px) {
        .SCRMTouchKey {
            height: 70px !important;
            width: 70px !important;
            display: inline-block;
        }

        .SCRMTouchKeySpace {
            height: 70px !important;
            width: 380px !important;
            display: inline-block;
        }

        .spacekeypadding {
            padding-top: 70px;
        }

        .SCRMTouchKey button {
            font-size: 1.9em !important;
            padding: 0px !important;
        }

        .SCRMTouchKeySpace button {
            font-size: 1.9em !important;
            padding: 0px !important;
        }

        .SCRMTouchKey1 {
            height: 70px !important;
            width: 70px !important;
            display: inline-block;
        }

            .SCRMTouchKey1 button {
                font-size: 1.9em !important;
                padding: 0px !important;
            }

        .race-container-search {
            width: 528px;
        }

        .EnterTodaysRaceSearchTop {
            font-size: 2em !important;
        }
    }

    .EnterTodaysRaceSearchTop {
        font-size: 2em !important;
    }


    @media only screen and (max-width: 853px) {
        .SCRMTouchKey {
            height: 60px !important;
            width: 60px !important;
            display: inline-block;
        }

        .SCRMTouchKeySpace {
            height: 60px !important;
            width: 340px !important;
            display: inline-block;
        }

        .spacekeypadding {
            padding-top: 60px;
        }

        .SCRMTouchKey button {
            font-size: 1.8em !important;
            padding: 0px !important;
        }

        .SCRMTouchKeySpace button {
            font-size: 1.8em !important;
            padding: 0px !important;
        }

        .SCRMTouchKey1 {
            height: 60px !important;
            width: 60px !important;
            display: inline-block;
        }

            .SCRMTouchKey1 button {
                font-size: 1.8em !important;
                padding: 0px !important;
            }

        .race-container-search {
            width: 468px;
        }

        .EnterTodaysRaceSearchTop {
            font-size: 1.8em !important;
        }
    }

    @media only screen and (max-width: 700px) {
        .SCRMTouchKey {
            height: 50px !important;
            width: 50px !important;
            display: inline-block;
        }

        .SCRMTouchKeySpace {
            height: 50px !important;
            width: 280px !important;
            display: inline-block;
        }

        .spacekeypadding {
            padding-top: 50px;
        }

        .SCRMTouchKey button {
            font-size: 1.6em !important;
            padding: 0px !important;
        }

        .SCRMTouchKeySpace button {
            font-size: 1.6em !important;
            padding: 0px !important;
        }

        .SCRMTouchKey1 {
            height: 50px !important;
            width: 50px !important;
            display: inline-block;
        }

            .SCRMTouchKey1 button {
                font-size: 1.6em !important;
                padding: 0px !important;
            }

        .race-container-search {
            width: 390px;
        }

        .EnterTodaysRaceSearchTop {
            font-size: 1.8em !important;
        }
    }

    @media only screen and (max-width: 600px) {

        .race-container-search {
            width: 100%;
            display: flex;
        }

        .EnterTodaysRaceSearchTop {
            font-size: 1.2em !important;
            width: calc(100vw - 110px - var(--scrollbar-width)) !important;
            min-width: unset !important;
        }

        .race-container-keyboard {
            display: none;
        }

        .SCRMTouchKey1A {
            display: block;
            margin-left: 4px;
        }
    }


    .RadButtonEdit.SCRMTouch {
        width: 97px !important;
        height: 97px !important;
        padding: 10px !important;
    }

    .RadButtonEdit.SCRMTouch {
        font-size: 10.4px !important;
        width: 90px !important;
        height: 90px !important;
        padding: 10px !important;
    }



@media only screen and (max-width: 767.98px) {
    .accordion-button-header {
        font-size: 1.4rem !important;
    }

    .accordion-button:not(.accordion-button2) {
        height: 42px;
        line-height: 20px;
    }

    .card-title {
        font-size: 1.4rem;
    }

    .card-header {
        padding: 6px !important;
    }

}

    .border-top-radius-10px {
        border-top-left-radius: 10px !important;
        border-top-right-radius: 10px !important;
    }

    .scrmlogocontainer {
        text-align: left;
        background-color: transparent;
        opacity: 1;
        vertical-align: top;
    }

    .scrmtextcontainer {
        text-align: left;
        background-color: transparent;
        opacity: 1;
        vertical-align: top;
        margin-top: 20px;
    }

    .scrmlogo {
        max-width: 200px;
    }

    .scrmtext {
        font-size: 1em;
    }

    @media only screen and (max-width: 575px) {

        .scrmlogocontainer {
            text-align: center;
        }

        .scrmtextcontainer {
            text-align: center;
        }

        .scrmtext {
            margin-left: 0px;
        }
    }


    .noborder {
        border: none !important;
        border-width: 0px !important;
    }


    .fccombolabelrcb {
        margin-top: 0.125rem;
        transform: translateY(-0.8rem) translateX(-2px);
    }




    .rcbox select, .rcbox ::picker(select) {
        appearance: base-select;
        border: none;
        background: var(--bs-card-bg);
        border-radius: 5px;
    }


        .rcbox ::picker(select):popover-open {
            opacity: 1;
        }


    @starting-style {
        .rcbox ::picker(select):popover-open {
            opacity: 0;
        }
    }


    .rcbox select {
        transition: 0.4s;
    }

    .rcbox option:checked {
        background-color: #89AD19;
    }



    .rcbox option:first-of-type {
        border-radius: 5px 5px 0 0;
    }

    .rcbox option:last-of-type {
        border-radius: 0 0 5px 5px;
    }

    .rcbox option:not(option:last-of-type) {
        border-bottom: none;
    }


    .rcbox option:hover {
        background-color: #44AEA6;
    }


    .tomvalidate.skuerror:not(.rcbox) select option {
        background-color: transparent;
        color: #3b4056 !important;
    }


    #MainContent_UpdatePanelDataExport1 {
        display: none !important;
    }


    .noborder2 {
        border-bottom: none !important;
        border-bottom-width: 0px !important;
        border-bottom-color: transparent !important;
        box-shadow: none !important;
        border-color: transparent !important;
        border-width: 0px !important;
        background-color: unset;
    }

    .width-100 {
        width: 100% !important;
    }

    #rlbRacesAdhoc {
    }

    .MyRaceTitle1 {
        font-size: 1.2em;
        font-weight: 600;
    }

    .MyRaceTitle2 {
        font-size: 1.1em;
        margin-bottom: 10px;
        font-weight: 600;
    }



    /** Manage Races **********************************************************************/

    .RadGrid.RadGridManageRaces colgroup {
        display: none;
    }

    .RadGrid.RadGridManageRaces table.rgMasterTable tr .rgGroupCol {
        padding: 0 !important;
        width: 10px;
    }

    .RadGrid.RadGridManageRaces .rgGroupCol .rgActionButton .rgIcon {
        display: none;
    }

    .RadGrid.RadGridManageRaces .rgGroupHeaderText {
        font-weight: 400;
        font-size: 1em;
        font-style: italic;
    }

    input.tomvalidate.skuerror.EditRace {
        border: solid 1px Red !important;
        background-color: red !important;
        color: #fff !important;
    }

    .EditRace {
        border-radius: 5px;
        height: 41px !important;
        font-size: 14px !important;
    }


    /** Manage Club Rules **********************************************************************/
    .RadGrid.RadGridScoringOptions colgroup {
        display: none;
    }

    .RadGrid.RadGridScoringOptions table.rgMasterTable tr .rgGroupCol {
        padding: 0 !important;
        width: 10px;
    }

    .RadGrid.RadGridScoringOptions .rgGroupCol .rgActionButton .rgIcon {
        display: none;
    }

    .RadGrid.RadGridScoringOptions .rgGroupHeaderText {
        font-weight: 400;
        font-size: 1em;
        font-style: italic;
    }

    /** Enter Todays Races **********************************************************************/

    .rgDetailTable {
        width: 90% !important;
    }


    .RadGridCompetitors {
        max-width: 800px;
        min-width: 800px;
        width: 100% !important;
    }

    .RadGridRaces {
        min-width: 800px;
    }

    .RadGrid.RadGridRaces .lbtnenterrace {
    }

    @media only screen and (max-width: 700px) {

        .RadGrid.RadGridRaces .lbtnenterrace {
            display: none;
        }
    }

    @media only screen and (min-width: 701px) {

        .RadGrid.RadGridRaces .lbtnenterrace2 {
            display: none;
        }
    }

    .RadGrid.RadGridRaces td.rgExpandCol {
        background-color: transparent !important;
        width: 10px;
    }



    .RadGrid.RadGridRaces .rgGroupHeaderText, .RadGrid.RadGridCompetitors .rgGroupHeaderText {
        font-weight: 400;
        font-size: 1em;
        font-style: italic;
    }

    .RadGrid.RadGridRaces .rgGroupHeader {
        text-align: left !important;
    }

    .RadGrid.RadGridCompetitors .rgGroupHeader {
        text-align: left !important;
    }

    .RadGrid.RadGridRaces td.rgExpandCol {
        background-color: transparent !important;
    }

    .RadGrid.RadGridRaces .rgGroupCol .rgActionButton .rgIcon {
        display: none;
    }

    .RadGrid.RadGridCompetitors .rgGroupCol .rgActionButton .rgIcon {
        display: none;
    }

    .RadGrid.RadGridRaces colgroup {
        display: none;
    }

    .RadGrid.RadGridRaces table.rgMasterTable tr .rgGroupCol {
        padding: 0 !important;
        width: 0px;
    }

    .RadGrid.RadGridCompetitors colgroup {
        display: none;
    }

    .RadGrid.RadGridCompetitors table.rgMasterTable tr .rgGroupCol {
        padding: 0 !important;
        width: 10px;
    }


    @media only screen and (max-width: 975px) {

        .RadGrid.RadGridCompetitors .lbtnenterrace2 {
            display: none;
        }

        .RadGrid.RadGridCompetitors .HomePageResultsRow {
            position: relative;
            width: 300px;
        }
    }

    .RadGrid.RadGridRaces .rgDetailTable,
    .RadGrid.RadGridRaces .rgDetailTable tbody,
    .RadGrid.RadGridRaces .rgDetailTable tr {
        border-top: none;
        border-left: none;
        border-right: none;
        border-bottom: none;
    }

        .RadGrid.RadGridRaces .rgDetailTable,
        .RadGrid.RadGridRaces .rgDetailTable tbody,
        .RadGrid.RadGridRaces .rgDetailTable tr,
        .RadGrid.RadGridRaces .rgDetailTable td {
            border-top: none;
            border-left: none;
            border-right: none;
        }


    /** Racing Results **********************************************************************/



    .RadGrid9Header {
        margin-left: 10px;
    }

    .RadGrid.RadGridResults1 .rgGroupCol {
        display: none;
    }

        .RadGrid.RadGridResults1 .rgGroupCol .rgActionButton .rgIcon {
            display: none;
        }

    .RadGrid.RadGridResults2 .rgGroupCol .rgActionButton .rgIcon {
        display: none;
    }

    .ResultsHeaderTable1, .SeriesResultsHeaderTable1 {
        width: 100%;
        margin-left: 0px;
    }

    .ResultsHeaderTable2 {
        width: 100%;
        max-width: 400px;
        margin-left: 0px;
        margin-bottom: 10px;
    }

    .whitespacewrap {
        word-spacing: 3000px;
    }

    .whitespacenowrap {
        white-space: nowrap;
    }

    .variabledisplay {
        display: flex;
    }

    .variabledisplay2 {
        display: flex;
    }


    .mobileshow {
        display: none !important;
    }

    .mobilenotshow {
        display: table-cell;
    }

    .RadGrid.RadGridResults2 .rgGroupHeaderText {
        font-weight: 400;
        font-size: 1em;
        font-style: italic;
    }

    .RadGrid.RadGridResults2 .RaceResultsRow {
        border-left: none;
        border-right: none;
    }

    .RadGrid.RadGridResults2 .rgRow, .RadGrid.RaceResultsRow .rgAltRow,
    .RadGrid.RadGridResults2 .rgGroupCol:not(.rgHeader),
    .RadGrid.RadGridResults2 .rgRow td:not(.rgHeader):not(.RaceResultsRow):not(.lbtnenterrace) {
        border-top: none !important;
        border-bottom: none !important;
    }

    .RadGrid.RadGridResults1 .rgGroupHeaderText {
        font-weight: 400;
        font-size: 1em;
        font-style: italic;
    }

    .RadGrid.RadGridResults1 .RaceResultsRow {
        border-left: none;
        border-right: none;
    }

    .RadGrid.RadGridResults1 .rgRow, .RadGrid.RaceResultsRow .rgAltRow,
    .RadGrid.RadGridResults1 .rgGroupCol:not(.rgHeader),
    .RadGrid.RadGridResults1 .rgRow td:not(.rgHeader):not(.HomePageResultsRow):not(.lbtnenterrace) {
        border-top: none !important;
        border-bottom: none !important;
    }

    .RaceResultsHelmRow {
        position: relative;
    }

    .RaceResultsHelmHeaderRow a {
        padding-left: 84px;
    }


    .RadGrid.RadGridResults2 colgroup {
        <!-- display: none; -->
    }

    .RadGrid.RadGridResults2 table.rgMasterTable tr .rgGroupCol {
        padding: 0 !important;
        width: 10px;
    }

    .RadGrid.RadGridResults1 colgroup {
        display: none;
    }

    .RadGrid.RadGridResults1 table.rgMasterTable tr .rgGroupCol {
        padding: 0 !important;
        width: 10px;
    }


    @media only screen and (max-width: 700px) {

        .RadGrid.RadGridResults1 .RaceResultsRow {
            position: relative;
            width: 100%;
        }

        .RadGrid.RadGridResults4 .RaceResultsRow {
            position: relative;
            width: 100%;
        }

        .RadGrid.RadGridResults1 .lbtnenterrace {
            display: none;
        }

        .RadGrid.RadGridResults4 .lbtnenterrace {
            display: none;
        }
    }

    @media only screen and (min-width: 701px) {

        .RadGrid.RadGridResults1 .lbtnenterrace2 {
            display: none;
        }

        .RadGrid.RadGridResults4 .lbtnenterrace2 {
            display: none;
        }

        .RadGrid.RadGridResults1 .RaceResultsRow {
            position: relative;
            width: 400px;
        }

        .RadGrid.RadGridResults4 .RaceResultsRow {
            position: relative;
            width: 400px;
        }
    }



    .R00width {
        width: 0px !important;
    }

    .RadGridResults0 {
        width: 100%;
    }

    .RadGridResults1 {
        width: 100%;
        max-width: 1200px;
    }

    .RadGridResults2 {
        width: 100%;
    }

    .RadGridResults3 {
        width: 100%;
    }

    .RadGridResults4 {
        width: 100%;
        max-width: 1200px;
    }


    .RadGridResults0 .rgMasterTable {
        width: 100%;
    }

    .RadGridResults1 .rgMasterTable {
        width: 100%;
    }

    .RadGridResults2 .rgMasterTable {
        width: 100%;
    }

    .RadGridResults3 .rgMasterTable {
        width: 100%;
    }

    .RadGridResults4 .rgMasterTable {
        width: 100%;
    }

    .showonmobileonly {
        display: none;
    }

    @media only screen and (max-width: 1200px) {

        .showonmobileonly {
            display: block;
        }

        .variabledisplay {
            display: block;
        }

        .variabledisplay2 {
            display: block;
            margin-left: 84px;
        }

        .R00width {
            width: 100% !important;
        }

        .mobileshow {
            display: table-cell !important;
        }

        .mobilenotshow {
            display: none !important;
            width: 0px !important;
        }

        .RadGridResults0 {
            max-width: calc(100vw - 70px - var(--scrollbar-width)) !important;
        }

            .RadGridResults0 .rgHeader {
                display: none !important;
            }


        .RadGridResults2 {
            max-width: calc(100vw - 70px - var(--scrollbar-width)) !important;
        }

            .RadGridResults2 .rgHeader {
                display: none !important;
            }

        .RadGridResults3 {
            max-width: calc(100vw - 70px - var(--scrollbar-width)) !important;
        }

            .RadGridResults3 .rgHeader {
                display: none !important;
            }
    }

    @media only screen and (max-width: 600px) {

        .RadGridResults0 {
            max-width: calc(100vw - 30px - var(--scrollbar-width)) !important;
        }

        .RadGridResults2 {
            max-width: calc(100vw - 30px - var(--scrollbar-width)) !important;
        }

        .RadGridResults3 {
            max-width: calc(100vw - 30px - var(--scrollbar-width)) !important;
        }
    }

    .ScoreIncluded {
        text-align: center !important;
    }

        .ScoreIncluded span:not(.nocircle):not(.nocircleH) {
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            height: 32px;
            width: 34px;
            line-height: 1.5em;
            display: block;
            -moz-border-radius: 50%; /* or 50% */
            border-radius: 50%; /* or 50% */

            background-color: limegreen;
            color: white;
            padding: 5px;
            text-align: center !important;
            font-size: 1em;
            vertical-align: middle;
            margin: auto;
        }

    .ScoreNotIncluded {
        text-align: center !important;
    }


        .ScoreNotIncluded span:not(.nocircle):not(.nocircleH) {
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            height: 32px;
            width: 34px;
            line-height: 1.5em;
            display: block;
            -moz-border-radius: 50%; /* or 50% */
            border-radius: 50%; /* or 50% */

            background-color: white;
            padding: 5px;
            text-align: center;
            font-size: 1em;
            vertical-align: middle;
            margin: auto;
            border: solid 1px #888;
        }

    .strikeout {
        text-decoration: line-through;
        color: red;
    }

    .nocircle {
        font-size: 0.8em !important;
        position: relative;
        top: 2px;
    }

    .nocircleH {
        font-size: 0.8em !important;
        position: relative;
        top: 0px;
    }

    .rcbRace, .rcbRaceSeries {
        width: 500px !important;
        max-width: 500px !important;
    }

    .crrib {
        margin-top: 4px;
        margin-left: 10px;
    }

    .card-titlemb-2 {
        margin-bottom: 0.5rem !important;
    }

    .SeriesTitle1 {
        font-size: 1.2em;
        font-weight: 600;
        line-height: 1.2em;
        display: block;
    }

    .SeriesTitle1B {
        font-size: 1.1em;
        font-weight: 600;
        line-height: 1.1em;
        display: block;
        margin-left: 30px;
    }

    .SeriesTitle2 {
        margin-left: 30px;
        display: block;
    }

    .SeriesTitle3 {
        margin-left: 30px;
        display: block;
    }

    .SeriesTitle4 {
        margin-left: 30px;
        display: block;
    }

    .SeriesTitle5 {
        margin-left: 30px;
        display: block;
    }

    .statusmargin {
        margin-bottom: 2em;
    }

    .mobilelineheight {
        line-height: 24px;
    }

    .SeriesPositionDisplay {
        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 1;
    }

    .seriesresultspositioncontainer {
        width: 80px;
        max-width: 80px;
        height: 70px;
        container-type: inline-size;
        container-name: seriesresultsposition;
    }

    .resultspositioncontainer {
        width: 80px;
        max-width: 80px;
        height: 70px;
        container-type: inline-size;
        container-name: resultsposition;
    }

    svg {
        width: 100%;
        height: 100%;
    }

    text {
        /**animation: 2s pulsate infinite;**/
    }

    .svgcontainer {
        position: relative;
        top: 0px;
    }

    .svgcontainer2 {
        position: relative;
        top: 0px;
    }

    svg text {
        text-anchor: middle;
        dominant-baseline: middle;
        fill: none;
        stroke: black;
        stroke-width: 1px;
        stroke-linejoin: round;
    }

    .digitwidth1 .svgcontainer {
        position: relative;
        top: 2px;
        left: -2px;
    }

    .digitwidth1 .svgcontainer2 {
        position: relative;
        top: 0px;
        left: -10px;
    }

    .digitwidth2 .svgcontainer {
        position: relative;
        top: -5px;
        left: -4px;
    }

    .digitwidth2 .svgcontainer2 {
        position: relative;
        top: -10px;
        left: -10px;
    }


    .digitwidth3 .svgcontainer {
        position: relative;
        top: -12px;
        left: -2px;
    }

    .digitwidth3 .svgcontainer2 {
        position: relative;
        top: -10px;
        left: -10px;
    }

    .digitwidth1 svg text {
        font-size: calc(100cqw) !important;
        font-family: "Roboto Mono";
        font-weight: 500;
        font-style: normal;
    }

    .digitwidth2 svg text {
        font-size: calc(70cqw) !important;
        font-family: "Roboto Mono";
        font-weight: 500;
        font-style: normal;
    }

    .digitwidth3 svg text {
        font-size: calc(52cqw) !important;
        font-family: "Roboto Mono";
        font-weight: 500;
        font-style: normal;
    }

    .LineSpacer {
        font-size: 1em;
    }

    @keyframes pulsate {
        50% {
            stroke-width: 2px;
            stroke: black;
        }
    }






    @media only screen and (max-width: 600px) {
        .rcbRace, .rcbRaceSeries {
            width: calc(100vw - 70px - var(--scrollbar-width)) !important;
        }

        .LineSpacer {
            font-size: 0.6em;
        }
    }

    @media only screen and (max-width: 575px) {
        .rcbRace, .rcbRaceSeries {
            width: calc(100vw - 70px - var(--scrollbar-width)) !important;
        }

        .rcbYear, .rcbRaceSeries, .rcbRace {
            font-size: 0.8em;
        }

        .LineSpacer {
            font-size: 0.4em;
        }
    }

    @media only screen and (max-width: 600px) {


        .RadGrid9Header {
            margin-left: 4px;
        }

        .mobilelineheight {
            line-height: 0px;
            top: 11px;
            position: relative;
        }

        .mobileshow {
            font-size: 0.9em;
        }

        .mobileshow2 {
            font-size: 0.9em;
        }

        .statusmargin {
            margin-bottom: 0em;
        }

        .accordion-body {
            padding: 5px !important;
        }

        .accordion-button {
            padding: 0px 5px 0px 5px !important;
        }



        .rcbRace, .rcbRaceSeries {
            width: calc(100vw - 30px - var(--scrollbar-width)) !important;
        }

        .ScoreIncluded {
            text-align: center !important;
        }

            .ScoreIncluded span:not(.nocircle):not(.nocircleH) {
                -webkit-box-sizing: border-box;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
                height: 32px;
                width: 34px;
                line-height: 1.5em;
                display: block;
                -moz-border-radius: 50%; /* or 50% */
                border-radius: 50%; /* or 50% */

                background-color: limegreen;
                color: white;
                padding: 5px;
                text-align: center !important;
                font-size: 1.1em;
                vertical-align: middle;
                margin: auto;
            }


        .ScoreNotIncluded {
            text-align: center !important;
        }


            .ScoreNotIncluded span:not(.nocircle):not(.nocircleH) {
                -webkit-box-sizing: border-box;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
                height: 32px;
                width: 34px;
                line-height: 1.5em;
                display: block;
                -moz-border-radius: 50%; /* or 50% */
                border-radius: 50%; /* or 50% */

                background-color: white;
                padding: 5px;
                text-align: center;
                font-size: 1.1em;
                vertical-align: middle;
                margin: auto;
                border: solid 1px #888;
            }

        .nocircleH {
            font-size: 0.8em !important;
            position: relative;
            top: 0px;
        }

        .nocircle {
            font-size: 0.8em !important;
            position: relative;
            top: -2px;
        }

        .crrib {
            margin-top: 5px;
            margin-left: 2px;
        }

        .card-titlemb-2 {
            margin-bottom: 0rem !important;
        }

        .SeriesTitle1 {
            font-size: 1em;
            font-weight: 600;
            line-height: 1.2em;
            display: block;
        }

        .SeriesTitle1B {
            font-size: 1em;
            font-weight: 600;
            line-height: 1.1em;
            display: block;
            margin-left: 10px;
        }

        .SeriesTitle2 {
            font-size: 0.8em;
            margin-left: 10px;
            display: block;
        }

        .SeriesTitle3 {
            font-size: 0.8em;
            margin-left: 10px;
            display: block;
        }

        .SeriesTitle4 {
            font-size: 0.8em;
            margin-left: 10px;
            display: block;
        }

        .SeriesTitle5 {
            font-size: 0.8em;
            margin-left: 10px;
            display: block;
        }
    }





    .myresultbackground {
        background-color: beige;
        color: black;
    }


    /** Upcoming Races ***********************************************************************/
    .RadGrid.UpcomingRaces .lbtnenterrace {
    }

    .RadGrid.UpcomingRaces .rgGroupCol .rgActionButton .rgIcon {
        display: none;
    }

    .UpcomingRaces {
        max-width: 800px;
        width: 100% !important;
    }


    .RadGrid.UpcomingRaces colgroup {
        display: none;
    }

    .RadGrid.UpcomingRaces table.rgMasterTable tr .rgGroupCol {
        padding: 0 !important;
        width: 0px;
    }


    .RadGrid.UpcomingRaces td.rgExpandCol {
        background-color: transparent !important;
        width: 10px;
    }

    .RadGrid.UpcomingRaces .rgGroupHeaderText {
        font-weight: 400;
        font-size: 1em;
        font-style: italic;
    }

    .RadGrid.UpcomingRaces .rgDetailTable,
    .RadGrid.UpcomingRaces .rgDetailTable tbody,
    .RadGrid.UpcomingRaces .rgDetailTable tr {
        border-top: none;
        border-left: none;
        border-right: none;
        border-bottom: none;
    }

        .RadGrid.UpcomingRaces .rgDetailTable,
        .RadGrid.UpcomingRaces .rgDetailTable tbody,
        .RadGrid.UpcomingRaces .rgDetailTable tr,
        .RadGrid.UpcomingRaces .rgDetailTable td {
            border-top: none;
            border-left: none;
            border-right: none;
        }


    @media only screen and (max-width: 400px) {
    }

    @media only screen and (max-width: 675px) {
        .row > * {
            padding-right: 0.1em !important;
            padding-left: 0.1em !important;
        }

        .modal-dialog {
            margin: 0.1em !important;
        }

        .RadGrid.UpcomingRaces .rgGroupHeader {
            box-shadow: unset;
            border: none;
        }

        .RadGrid.UpcomingRaces .lbtnenterrace {
            display: none;
        }

        .RadGrid.UpcomingRaces .lbtnenterrace3 {
            width: 100% !important;
            text-align: left;
        }

        .RadGrid.UpcomingRaces .lbtnenterrace4 {
            display: none;
        }

        .RadGrid.UpcomingRaces .rgDetailTable {
            margin-top: 0px;
            margin-bottom: 10px;
            margin-left: 10px;
        }
    }

    @media only screen and (min-width: 676px) {

        .RadGrid.UpcomingRaces .lbtnenterrace2 {
            display: none;
        }

        .RadGrid.UpcomingRaces .rgDetailTable {
            margin-top: 0px;
            margin-bottom: 10px;
        }
    }

    .RaceDateOutline {
        font-size: 40px !important;
        color: transparent;
        -webkit-text-stroke-width: 0.7px;
        -webkit-text-stroke-color: #000;
        font-family: "Roboto Mono";
        font-weight: 500;
        font-style: normal;
    }

    .RaceDateOutlinewhite, .rgHoveredRow .RaceDateOutline, .rgSelectedRow .RaceDateOutline {
        font-size: 40px !important;
        color: transparent;
        -webkit-text-stroke-width: 0.7px;
        -webkit-text-stroke-color: #fff;
        font-family: "Roboto Mono";
        font-weight: 500;
        font-style: normal;
    }

    /** Race Season Result *********************************************************************/


    .SeasonResults {
        max-width: 800px;
        width: 100% !important;
    }

        .SeasonResults .rgActionButton .rgIcon {
            display: none !important;
        }


    .RadGrid.SeasonResults .rgGroupHeaderText {
        font-weight: 600;
        font-size: 1.2em;
    }

    .RadGrid.SeasonResults .rgGroupHeaderText2 {
        font-weight: 600;
        font-size: 1.0em;
        display: block;
    }

    .RadGrid.SeasonResults .rgGroupHeaderText3 {
        font-style: italic;
        font-weight: 400;
        font-size: 0.8em !important;
    }

    .RadGrid.SeasonResults .SeasonResultsRow .seasonresultcontainer {
        position: relative;
        left: 0px;
        width: calc(100% - 0px);
    }



    .RadGrid.SeasonResults colgroup {
        display: none;
    }

    .RadGrid.SeasonResults table.rgMasterTable tr .rgGroupCol {
        padding: 0 !important;
        width: 10px;
    }

    .RadGrid.SeasonResults .SeasonResultsRow .seasonresultcontainer {
        position: relative;
        left: -20px;
        width: calc(100% + 25px);
    }

    .RadGrid.SeasonResults .seriesresultspositioncontainer {
        left: -20px;
        position: relative;
    }

    @media only screen and (max-width: 575px) {
    }

    @media only screen and (max-width: 575px) {

        .row > * {
            padding-right: 0.1em !important;
            padding-left: 0.1em !important;
        }

        .modal-dialog {
            margin: 0.1em !important;
        }

        .rgGroupCol {
        }

        .RadGrid.SeasonResults .rgRow > td, .RadGrid.SeasonResults .rgAltRow > td, .RadGrid.SeasonResults .rgEditRow > td, .RadGrid.SeasonResults .rgFooter > td,
        .RadGrid.SeasonResults .rgFilterRow > td, .RadGrid.SeasonResults .rgHeader, .RadGrid.SeasonResults .rgResizeCol, .RadGrid.SeasonResults .rgGroupHeader td {
            padding-left: 6px !important;
            padding-right: 6px !important;
        }

        .RadGrid.SeasonResults table.rgMasterTable tr .rgGroupCol {
            padding: 0 !important;
            width: 0px;
        }

        .RadGrid.SeasonResults .rgGroupHeader {
        }

        .RadGrid.SeasonResults .SeasonResultsRow {
            width: 100%;
        }

            .RadGrid.SeasonResults .SeasonResultsRow .seasonresultcontainer {
                position: relative;
                left: 0px;
                width: calc(100% - 0px);
            }


        .RadGrid.SeasonResults .rgGroupHeader td {
            border: none;
        }

        .RadGrid.SeasonResults .rgGroupHeader .rgGroupCol:first-child {
            margin-left: 0px;
        }

        .RadGrid.SeasonResults .rgGroupHeader .rgGroupCol:nth-of-type(2) {
            margin-left: 10px;
        }

        .RadGrid.SeasonResults .rgGroupHeader .rgGroupCol:nth-of-type(3) {
            margin-left: 20px;
        }

        .RadGrid.SeasonResults .rgGroupHeaderText {
            font-weight: 600;
            margin-left: 0px;
            font-size: 1.2em;
        }

        .RadGrid.SeasonResults .rgGroupHeaderText2 {
            margin-left: 0px;
            font-weight: 600;
            font-size: 1.0em;
        }

        .RadGrid.SeasonResults .rgGroupHeaderText3 {
            margin-left: 0px;
            font-style: italic;
            font-weight: 400;
            font-size: 0.8em !important;
        }

        .RadGrid.SeasonResults .helmimage.sr1 {
            position: absolute;
            top: 2px;
            right: 2px;
            left: unset;
            height: 50px;
            width: 50px;
        }

        .RadGrid.SeasonResults .SeasonResultsRow .seasonresultcontainer {
            position: relative;
            left: -30px;
            width: calc(100% + 35px);
        }

        .RadGrid.SeasonResults .seriesresultspositioncontainer {
            left: -20px;
            position: relative;
        }
    }

    @media only screen and (max-width: 400px) {

        .RadGrid.SeasonResults .rgGroupHeaderText {
            font-weight: 600;
            margin-left: 0px;
            font-size: 1em;
        }

        .RadGrid.SeasonResults .rgGroupHeaderText2 {
            margin-left: 0px;
            font-weight: 600;
            font-size: 0.8em;
        }

        .RadGrid.SeasonResults .rgGroupHeaderText3 {
            margin-left: 0px;
            font-style: italic;
            font-weight: 400;
            font-size: 0.6em !important;
        }

        .RadGrid.SeasonResults .SeasonResultsRow .seasonresultcontainer {
            position: relative;
            left: -30px;
            width: calc(100% + 35px);
            font-size: 0.9em;
        }

        .RadGrid.SeasonResults .seriesresultspositioncontainer {
            left: -20px;
            position: relative;
        }

        .RadGrid.SeasonResults .helmimage.sr1 {
            position: absolute;
            top: 2px;
            right: 2px;
            left: unset;
            height: 50px;
            width: 50px;
        }
    }

    /** HomePageResults *********************************************************************/



    .RadGrid2Header {
        color: #5f5f5f;
        border-bottom: none;
        width: 100%;
        border-radius: 5px 5px 0px 0px;
        overflow-x: auto;
    }

    .HomeRaceType, .HomeRaceHelmType, .HomeRaceDate, .HomeRaceStartTime, .HomeRaceOfficer, .HomeRaceSeries, .HomeRaceComments {
        font-weight: 600;
        display: block;
        font-size: 16.8px;
        line-height: 24px;
    }

    .HomeRaceComments {
        font-weight: 600;
        display: block;
        font-style: italic;
    }

    .HomeRaceTitle3 {
        font-size: 1.2em;
        font-weight: 600;
    }

    .HomeRaceTitle2 {
        font-size: 16.8px;
        font-weight: 600;
    }

    .HomeRaceTitle1 {
        font-size: 1.2em;
        font-weight: 600;
        line-height: 1em;
        color: forestgreen;
    }

    .HomeRaceLabel {
        font-size: 0.84em;
        line-height: 24px;
    }

    @media only screen and (max-width: 600px) {

        .HomeRaceTitle1 {
            font-size: 1.2em;
            font-weight: 600;
            line-height: 1em;
        }

        .HomeRaceTitle3 {
            font-size: 1.2em;
            font-weight: 600;
        }

        .HomeRaceType, .HomeRaceHelmType, .HomeRaceDate, .HomeRaceStartTime, .HomeRaceOfficer, .HomeRaceSeries, .HomeRaceComments {
            font-weight: 600;
            display: block;
            font-size: 1em;
            line-height: 24px;
        }
    }

    @media only screen and (max-width: 400px) {

        .HomeRaceTitle3 {
            font-size: 1em;
        }
    }

    .FinishFalse {
        color: orange !important;
    }

    .FinishTrue {
        color: forestgreen !important;
    }

    .FinishTrueRedress {
        color: purple !important;
    }

    .FinishTruePenalty {
        color: red !important;
    }


    @media only screen and (max-width: 975px) {

        .row > * {
            padding-right: 0.1em !important;
            padding-left: 0.1em !important;
        }

        .modal-dialog {
            margin: 0.1em !important;
        }

        .rgGroupCol {
        }
    }

    @media only screen and (min-width: 976px) {
    }

    /** MyRacingResults *********************************************************************/

    .myRaceResults {
        max-width: 1000px;
        width: 100% !important;
    }

        .myRaceResults .rgActionButton .rgIcon {
            display: none !important;
        }

    .rankimage {
        width: 100px;
    }


    .myRaceResults .rgMasterTable {
        width: 100%;
    }



    .RadGrid.myRaceResults .rgGroupHeaderText {
        font-weight: 400;
        font-size: 1em;
        font-style: italic;
    }

    .RadGrid.myRaceResults .myRaceResultsRow {
        border-left: none;
        border-right: none;
    }

    .RadGrid.myRaceResults .rgRow,
    .RadGrid.myRaceResults .rgGroupCol:not(.rgHeader),
    .RadGrid.myRaceResults .rgRow td:not(.rgHeader):not(.myRaceResultsRow):not(.lbtnenterrace) {
        border-top: none !important;
        border-bottom: none !important;
    }


    .RadGrid.myRaceResults colgroup {
        display: none;
    }

    .RadGrid.myRaceResults table.rgMasterTable tr .rgGroupCol {
        padding: 0 !important;
        width: 10px;
    }

    @media only screen and (max-width: 975px) {


        .RadGrid.myRaceResults .myRaceResultsRow {
            position: relative;
            width: 100%;
        }


        .RadGrid.myRaceResults .lbtnenterrace {
            display: none;
        }
    }

    @media only screen and (min-width: 976px) {

        .RadGrid.myRaceResults .lbtnenterrace2 {
            display: none;
        }

        .RadGrid.myRaceResults .myRaceResultsRow {
            position: relative;
            width: 300px;
        }
    }



    /** My Details Craft *********************************************************************/


    .CraftContainer {
        display: block;
    }



    /** RadgridRacingCalendar *********************************************************************/
    .RadgridRacingCalendar {
        max-width: 800px;
    }

    .RadGrid_Silk.RadgridRacingCalendar .rgActionButton {
        color: unset;
    }

    @media only screen and (max-width: 575px) {
        .RadgridRacingCalendar {
            max-width: 100%;
            width: 100% !important;
        }



        .card-title {
            font-size: 1.4em;
        }

        .MyRaceTitle1 {
            font-size: 1em;
        }
    }



    .sessionvalue {
        color: #b20000;
    }



    .display-none {
        display: none !important;
    }



    .homepagelink {
        text-decoration: underline;
        font-weight: 600;
        color: rgba(var(--bs-link-color-rgb), var(--bs-link-opacity, 1));
    }



    /** Scheduled Tasks *********************************************************************/


    .RadGrid.RadGridScheduledTaskDetail .rgDetailTable,
    .RadGrid.RadGridScheduledTaskDetail .rgDetailTable tbody,
    .RadGrid.RadGridScheduledTaskDetail .rgDetailTable tr {
        border-top: none;
        border-left: none;
        border-right: none;
        border-bottom: none;
    }

        .RadGrid.RadGridScheduledTaskDetail .rgDetailTable,
        .RadGrid.RadGridScheduledTaskDetail .rgDetailTable tbody,
        .RadGrid.RadGridScheduledTaskDetail .rgDetailTable tr,
        .RadGrid.RadGridScheduledTaskDetail .rgDetailTable td {
            border-top: none;
            border-left: none;
            border-right: none;
        }

    .RadGrid.RadGridScheduledTaskDetail .rgDetailTable {
        margin-top: 0px;
        margin-bottom: 10px;
        margin-left: 10px;
    }

    .RadGrid.RadGridScheduledTaskDetail td.rgExpandCol {
        background-color: transparent !important;
    }

    .RadGrid.RadGridScheduledTaskDetail td.rgExpandCol {
        background-color: transparent !important;
        width: 10px;
    }

    /** FAQ *********************************************************************/
    .faqimage {
        padding: 10px;
        border: solid 1px #44AEA6;
        margin-right: 10px;
    }

.faqlink {
    color: forestgreen !important;
    font-weight: 600;
}



    .bg-label-info .accordion-button-header, .card-header.bg-label-info .card-title {
        color: white !important;
    }

    .accordion-button-header .accordion-button:not(.collapsed)::after, .accordion-button-header .accordion-button::after {
        background-image: var(--bs-accordion-btn-active-icon2);
    }

    .modal-title {
        color: white !important
    }

    .modal-header {
        height: 60px;
        font-size: 1.4em !important;
    }

        .modal-header .btn-close {
            color: white !important;
        }

    .nav .nav-link:not(.active):hover {
        color: forestgreen !important;
    }

    .nav-pills .nav-item .nav-link:not(.active):hover {
        padding-bottom: 0.5435rem;
        background-color: transparent !important;
        box-shadow: 0 0.25rem 0.875rem 0 rgba(38, 43, 67, 0.16);
    }


