/* Minification failed. Returning unminified contents.
(6610,26): run-time error CSS1030: Expected identifier, found '.'
(6610,41): run-time error CSS1031: Expected selector, found ')'
(6610,41): run-time error CSS1025: Expected comma or open brace, found ')'
(6749,29): run-time error CSS1030: Expected identifier, found '.'
(6749,46): run-time error CSS1031: Expected selector, found ')'
(6749,46): run-time error CSS1025: Expected comma or open brace, found ')'
(7638,28): run-time error CSS1030: Expected identifier, found '.'
(7638,42): run-time error CSS1031: Expected selector, found ')'
(7638,42): run-time error CSS1025: Expected comma or open brace, found ')'
(8705,24): run-time error CSS1030: Expected identifier, found '.'
(8705,74): run-time error CSS1031: Expected selector, found ')'
(8705,74): run-time error CSS1025: Expected comma or open brace, found ')'
(8868,24): run-time error CSS1030: Expected identifier, found '.'
(8868,74): run-time error CSS1031: Expected selector, found ')'
(8868,74): run-time error CSS1025: Expected comma or open brace, found ')'
(8872,24): run-time error CSS1030: Expected identifier, found '.'
(8872,74): run-time error CSS1031: Expected selector, found ')'
(8872,74): run-time error CSS1025: Expected comma or open brace, found ')'
 */
html, body, form {
    margin: 0px;
    padding: 0px;
    height: 100%;
}

html {
    overflow: -moz-scrollbars-vertical;
    overflow-y: scroll;
}

body, .bodyText {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10pt;
    color: #4E3328;
    line-height: 18px;
}

.bodyTextSmall {
    font: 14px 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    color: #4E3328;
    line-height: 20px;
    max-width: 586px;
}

.messageHeader {
    
    text-decoration: underline;
    text-decoration-color: #e0e0e0;    
    color: #707070;
}

.ddl {
    border: 1px solid #3385d6;
    height: 18px;
    line-height: 18px;
}

a, a:link, a:active {
    color: #2F3034;
    text-decoration: none !important;
    font-weight: 600;
}

    a:hover {
        text-decoration: none !important;
    }

table.formTable > tbody > tr > td {
    padding-top: 12px;
}

table.formTable > tbody > tr:first-child > td {
    padding-top: 0px !important;
}

.searchIcon {
    width: 40px;
    height: 40px;
    border: 2px solid #D1D1D6;
    border-radius: 8px;
    background-color: #FFFFFF;
    background-image: url('Master/search-normal.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 18px 18px;
    cursor: pointer;
    padding: 0;
}
.searchIconDistrict{
    background-image: url('Master/search-normal.png');
}

.formLabel {
    font-weight: 500;
    font-size: 15px;
    color: rgba(9, 9, 11, 1);
    line-height: 22px;
}

.formSubLabel {
    color: Gray;
    font-size: 10px;
    margin-top: -2px;
    margin-bottom: 4px;
    line-height: 12px;
}

.label {
    height: 20px;
    line-height: 20px;
    color: #4E3328;
}

p {
    margin: 0px 0px 0px 0px;
    padding-bottom: 10px;
}

.required {
    color: Red;
    font-weight: bold;
    font-size: 10pt;
}

.clear {
    clear: both;
}

.loginBox {
    width: 284px;
    margin: auto;
    position: relative;
    top: 280px;
}

.pageHeader, a.pageHeader, a.pageHeader:link {
    /* confirmed in use */
    padding-top: 8px;
    font-family: Verdana, Arial, Helvetica;
    font-size: 25pt;
    font-weight: normal;
    color: #9BA600;
    text-decoration: none;
    line-height: 36px;
    height: 36px;
}

.pageSubHeader, a.pageSubHeader, a.pageSubHeader:link {
    /* confirmed in use */
    font-family:'Poppins', Verdana, Arial, Helvetica;
    font-size: 19.5pt;
    font-weight: 500;
    text-decoration: none;
    line-height: 100%;
    margin-bottom: 4px;
    color: #2F3034;
}

.SNSWindowHeader {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #2F3034;
}

.pageSubHeader.colorPastelBlue {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #2F3034;
}

.colorMediumRed {
    color: #C02020;
}

.colorMediumGreen {
    color: #109010;
}

.colorPastelGreen {
    color: #9ca701;
}

.colorGrey {
    color: #727a86;
}

.colorPastelGold {
    color: #efab1f;
}

.colorPastelBlue {
    color: #5091cd;
}

.sectionBorder {
    border-bottom: 2px solid #4775a7;
    border-left: 2px solid #4775a7;
    border-right: 2px solid #4775a7;
}

.sectionButton {
    margin-top: 15px;
    text-align: right;
}

.sectionNote {
    color: #71717A;
    font-size: 12px;
    padding-top: 0px;
    padding-bottom: 5px;
    line-height: 15px;
}

.sectionWarning {
    color: #2b4a68;
    font-size: 12px;
    font-style: italic;
    padding-top: 0px;
    padding-bottom: 5px;
}

.reportParameter {
    float: left;
}

.hidden {
    visibility: hidden;
}

.siteMapPageDescription {
    font-size: 15px;
    margin-left: 10px;
}

.siteMapPage1 {
    font-size: 15px;
    padding: 3px;
}

.siteMapPage2 {
    margin-left: 20px;
    font-size: 13px;
    padding: 3px;
}

.siteMapPage3 {
    margin-left: 40px;
    font-size: 11px;
    padding: 3px;
}

.siteMapPage4 {
    margin-left: 60px;
    font-size: 9px;
    padding: 3px;
}

.modalWindow {
    z-index: 5000;
    position: fixed;
    top: 30%;
    margin-left: 40px;
    width: 900px;
    background-color: White;
}

.collapsePlus {
    border: 0 0 0 0;
    width: 11px;
    height: 11px;
    background-image: url('Images/plus.png');
    background-repeat: no-repeat;
}

.collapseMinus {
    border: 0 0 0 0;
    width: 11px;
    height: 11px;
    background-image: url('Images/minus.png');
    background-repeat: no-repeat;
}

.reportRadioButtonList {
    margin-bottom: 10px;
}

/* List items used by Terms of Use, etc. */
ol {
    list-style-type: decimal;
}

    ol ol {
        list-style-type: upper-alpha;
        color: Black;
        /* margin-bottom:10px; */
    }

.percentageBarOuter {
    margin-top: 6px;
    background-color: #E0E0E0;
    padding: 2px 2px 2px 2px;
    height: 20px;
    position: relative;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
}

.percentageBarInner {
    padding: 2px 2px 2px 2px;
    height: 16px;
    position: absolute;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -o-border-radius: 3px;
}

.percentageBarText {
    width: 100%;
    text-align: center;
    position: absolute;
    font-weight: bold;
}

.percentageLow {
    background-color: #FF0000;
}

.percentageMidLow {
    background-color: #FF7F00;
}

.percentageMid {
    background-color: #FFFF00;
}

.percentageMidHigh {
    background-color: #BFFF00;
}

.percentageHigh {
    background-color: #00FF00;
}

.passwordContainer {
    position: relative;
}

.passwordContainer.is-hidden {
    visibility: hidden;
}

.reveal-eye {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: absolute;
    right: -2px;
    top: 1px;
    bottom: 1px;
    z-index: 2;
    width: 30px;
    cursor: pointer;
    visibility: hidden;
    opacity: 0;
    transition: opacity .2s ease 0s,visibility 0s linear .2s;
}

.reveal-eye.unmask {
    background: transparent url('Images/eye.png') 50% 50% no-repeat;
}

.reveal-eye.mask {
    background: transparent url('Images/eyeOff.png') 50% 50% no-repeat;
}

.reveal-eye.is-visible {
    display: block;
    visibility: visible;
    opacity: 1;
    transition: opacity .2s ease 0s,visibility 0s linear 0s;
}

.autoLogo {
    background-image: url('Master/EzSchoolPayLogo2.png');
    width: 255px;
    height: 92px;
    background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
}

/* UserSetup page styles */
#pnlPage {
    background-color: #F9F9FA;
    padding: 20px;
}
/* Help page content width limit */
.help-content-wrapper {
    max-width: 620px;
}
.page-top-buttons {
    display: flex;
    gap: 12px;
    margin-bottom: 24px;
    justify-content: flex-end;
}

.page-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}

.page-section-title {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: 500;
    color: #2F3034;
}

.page-actions {
    display: flex;
    gap: 12px;
    align-items: center;
}

.history-note {
    font-size: 14px;
    max-width: 800px;
    margin-bottom: 16px;
    display:block;
}

.page-form {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.page-form-row {
    display: flex;
    gap: 20px;
}

.page-form-field {
    display: flex;
    flex-direction: column;
    position: relative;
    padding-bottom: 23px; /* Reserve space for validator */
}

/* Validator positioning only within usersetup form fields */
.page-form-field .validator {
    position: relative;
    max-width:200px;
    bottom: 0;
    left: 0;
}

.page-form-field-checkbox {
    align-self: flex-start;
    margin-top: 32px;
}

.page-form-field .RadComboBox {
    width: 250px;
}

.page-form-field-buttons {
    display: flex;
    gap: 8px;
    align-items: flex-end;
    padding-bottom: 23px; /* Aligns with inputs when validator space exists */
}


.radio-list {
    display: flex;
    gap: 10px;
    align-items: flex-end;
}

.checkbox-container label {
    font-weight: 500;
    font-size: 15px;
    color: rgba(9, 9, 11, 1);
    line-height: 22px;
}

/* Hide RadComboBox generated labels since we use our own visible labels */
.rcbLabel {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}
.riLabel {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* Tablet responsive styles for UserSetup */
@media (max-width: 1024px)
{
    .page-form-row {
        flex-direction: column;
        gap: 12px;
        align-items: stretch;
    }
    
    .page-form-field,
    .page-form-field-checkbox {
        width: 100%;
    }
    
    .page-form-field input[type="text"],
    .page-form-field .RadComboBox,
    .page-form-field .rcbInput,
    .page-form-field .RadMaskedTextBox {
        width: 300px !important;
        max-width: 300px;
    }
    
    /* Fix RadComboBox table layout overflow on mobile */
    .page-form-field .RadComboBox table {
        width: 300px !important;
        max-width: 300px !important;
        table-layout: fixed !important;
    }
    
    .page-form-field .rcbInputCell {
        width: calc(100% - 20px) !important;
    }
    
    .page-form-field .rcbArrowCell {
        width: 20px !important;
    }
    
    .page-header-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    
    .page-actions {
        width: 100%;
    }
    
    .formTable {
        width: 100% !important;
        overflow-x: auto;
    }
    
    .formTable td {
        padding: 8px 0;
    }
    
    .formTable td[align="left"],
    .formTable td[align="right"] {
        text-align: left !important;
    }
    
    .formTable input[type="text"],
    .formTable .RadComboBox,
    .formTable .RadMaskedTextBox {
        width: 240px !important;
        max-width: 240px;
    }
    
    

    /* Student page responsive styles */
    .student-form-row {
        flex-direction: column;
        gap: 12px;
        align-items: stretch;
    }

    .student-form-row > div {
        width: 100%;
    }

    .student-form-row input[type="text"],
    .student-form-row .RadNumericTextBox {
        width: 240px !important;
        max-width: 240px;
    }

    /* Move student photo to the left on tablet */
    .student-edit-container {
        flex-direction: column-reverse;
        overflow-y: auto
    }

    .student-edit-right {
        width: 100%;
        flex-direction: row;
        justify-content: flex-start;
    }

    /* Fix RadComboBox layout on tablet - keep table cells inline */
    .RadComboBox table td {
        display: table-cell !important;
    }
}

/* General checkbox styling for forms - consistent sizing and accent color */
input[type="checkbox"] {
    width: 20px;
    height: 20px;
    accent-color: #2F3034;
    cursor: pointer;
    vertical-align: middle;
}

/* Global checkbox container styling - proper alignment and spacing */
.checkbox-container, .address-checkbox {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 500;
    font-size: 15px;
    color: rgba(9, 9, 11, 1);
    line-height: 22px;
}

.checkbox-container input[type="checkbox"],
.address-checkbox input[type="checkbox"] {
    margin: 0;
    flex-shrink: 0;
}

.checkbox-container label,
.address-checkbox label {
    margin: 0;
    cursor: pointer;
}

.content-page {
    background-color: #F9F9FA;
    border-radius: 8px;
    min-height: auto;
    overflow-y: auto;
}


.store-item-detail-page {
    background-color: #F9F9FA;
    padding: 24px;
}

.cart-empty-message {
    text-align: center;
    padding: 80px 0;
}

.cart-grid {
    border: none !important;
    background: none !important;
}

.cart-grid .rgMasterTable {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: none !important;
}

.cart-grid .rgDataDiv {
    border-bottom: 1px solid #E5E7EB;
    background: none !important;
    overflow-y: auto !important;
}

.cart-grid .rgRow,
.cart-grid .rgAltRow {
    background: none !important;
    border: none !important;
}

.cart-grid .rgRow td,
.cart-grid .rgAltRow td {
    background: none !important;
    border: none !important;
    padding: 0 !important;
}

.cart-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 0;
}

.cart-item-left {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    flex: 1;
}

.cart-item-image {
    flex-shrink: 0;
    width: 80px !important;
    height: 80px !important;
}

.cart-item-image img {
    width: 80px !important;
    height: 80px !important;
    object-fit: contain;
    border-radius: 4px;
    background-color: white;
}

.cart-item-details {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.cart-item-name {
    font-size: 16px;
    font-weight: 500;
    color: #2F3034;
}

.cart-item-info {
    font-size: 14px;
    color: #09090B;
    display: block;
}

.cart-item-quantity {
    font-size: 14px;
    color: #09090B;
    margin-top: 4px;
}

.cart-item-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 16px;
}

.cart-item-amount {
    font-size: 18px;
    font-weight: 600;
    color: #2F3034;
    min-width: 80px;
    text-align: right;
}

.cart-totals {
    display: none;
}

.cart-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 16px;
    padding: 16px 0;
}

.cart-subtotal {
    display: flex;
    gap: 12px;
    align-items: center;
    font-size: 16px;
    font-weight: 600;
    color: #2F3034;
}

.cart-total-row {
    display: flex;
    gap: 12px;
    align-items: center;
    font-size: 14px;
}

.cart-grand-total {
    font-size: 16px;
    font-weight: 600;
    padding-top: 8px;
    border-top: 1px solid #E5E7EB;
}

.checkout-totals {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 8px;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid #E5E7EB;
}

.checkout-total-row {
    display: flex;
    gap: 12px;
    align-items: center;
    font-size: 14px;
}

.checkout-grand-total {
    font-size: 16px;
    font-weight: 600;
    padding-top: 8px;
    border-top: 1px solid #E5E7EB;
}

.students-top-buttons {
    display: flex;
    gap: 12px;
    margin-bottom: 24px;
    justify-content: flex-end;
}

.no-records-message {
    text-align: center;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #6a6a6a;
    padding: 40px;
    background-color: #F9F9FA;
}

/* Student Edit Layout */
#cphBody_spnlEdit .students-top-buttons,
#cphBody_spnlStudentLink .students-top-buttons{
    display: flex;
    justify-content: space-between !important;
    align-items: center;
    margin-bottom: 24px;
}

.store-top-content{
        display: flex;
    justify-content: space-between !important;
    align-items: center;
    margin-bottom: 24px;
}

.spending-limits-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}

.student-edit-container {
    display: flex;
    gap: 24px;
}

.student-edit-left {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.student-edit-right {
    width: 280px;
    display: flex;
    flex-direction: column;
    align-items: center;
    align-self: stretch;
}

.student-details-header {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: 500;
    color: #2F3034;
    margin-bottom: 8px;
}

.student-last-updated {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #2F3034;
    margin-bottom: 20px;
}

.student-photo-container {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    gap: 16px;
}

.student-photo-container a {
    display: flex;
    align-items: center;
    width: 100%;
}

.student-photo-container img {
    width: 240px !important;
    height: 280px !important;
    margin-top: 10% !important;
    object-fit: cover;
    border-radius: 8px;
}

.student-name-display {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: 500;
    color: #2F3034;
    text-align: center;
}

.student-form-section {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.student-tables-section {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.student-form-row {
    display: flex;
    gap: 16px;
    align-items: flex-end;
}

.no-fees-message {
    text-align: center;
    color: #71717A;
    font-size: 14px;
}

.student-form-row > div {
    flex: 1;
    min-width: 0;
}

/* General radio button styling */
input[type="radio"] {
    width: 20px;
    height: 20px;
    accent-color: #2F3034;
    vertical-align: middle;
}

input[type="radio"] + label {
    font-size: 14px;
    vertical-align: middle;
}

.info-circle {
    background-image: url('../../Style/Master/info-circle.png');
    width: 16px;
    height: 16px;
    border: none;
    cursor: pointer;
    background-repeat: no-repeat;
    background-position: center;
}

/* Help page styles */
.help-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}

.help-vote-panel {
    background-color: #F7F7F7;
    padding: 12px 16px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 14px;
}

.help-vote-options {
    display: flex;
    gap: 16px;
}

.help-vote-link {
    display: flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    color: #09090B;
}

.help-vote-icon {
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.help-like-icon {
    background-image: url('Master/like.png');
}

.help-dislike-icon {
    background-image: url('Master/dislike.png');
}

.help-vote-response {
    background-color: #F7F7F7;
    padding: 12px 16px;
    border-radius: 8px;
    font-size: 14px;
}

.help-choices-list {
    margin: 16px 0;
}

.help-choice-link {
    display: block;
    margin-bottom: 16px;
}

.help-links-table td {
    padding: 8px 0;
}

/* utility classes */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

.search-modal-background {
    background-color: #F9F9FA;
    padding: 20px;
    border-radius: 8px;
}

.dashboard-welcome-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

.dashboard-welcome-label {
    font-size: 14px;
    text-transform: uppercase;
    color: #000000;
    font-weight: 400;
    margin-bottom: 10px;
}

.dashboard-username {
    font-size: 30px;
    color: #444750;
    font-weight: 500;
}

.credit-detail-form-background {
    padding: 16px;
    border-radius: 8px;
    background-color: #f9f9f9;
}

.help-vote-links {
    background-color: #F7F7F7;
    padding: 12px 16px;
    border-radius: 8px;
    margin-top: 16px;
    font-size: 14px;
    color: #2F3034;
    max-width: 411px;
}

.help-vote-response {
    background-color: #F7F7F7;
    padding: 12px 16px;
    border-radius: 8px;
    margin-top: 16px;
    font-size: 14px;
    color: #2F3034;
    max-width: 221px;
}

.help-vote-yes {
    margin-left: 12px;
    padding-left: 26px;
    background: url('Master/like.png') left center no-repeat;
    background-size: 20px 20px;
}

.help-vote-no {
    margin-left: 16px;
    padding-left: 26px;
    background: url('Master/dislike.png') left center no-repeat;
    background-size: 20px 20px;
}

.transaction-filter-background {
    background-color: #F1F1F1;
    padding: 8px;
    border-radius: 8px;
}

.dashboard-user-icon {
    width: 50px;
    height: 50px;
}

.user-summary-header {
    padding-top: 0px;
}

.guest-message {
    max-width: 700px;
    line-height: 1.6;
    display: block;
}

.section-button-left {
    text-align: left;
}

.configure-overflow-hidden {
    overflow: hidden;
}

.billing-icon {
    width: 20px;
    height: 20px;
    display: block;
    margin: 0 auto;
}

.unlink-confirmation-message {
    margin-bottom: 20px;
}

.unlink-cancel-button {
    float: left;
}

.unlink-dialog-body {
    flex-grow: 1;
}

.inline-flex-center {
    display: inline-flex !important;
    align-items: center !important;
}

.margin-top-26 {
    margin-top: 26px;
}

.page-inline-group {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.page-inline-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.page-last-saved {
    display: flex;
    justify-content: space-between;
    margin-top: 12px;
}

.page-detail-summary {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
}
.page-form-field-spacer{
    display:none !important;
}

.disable-message {
    width: 620px;
    margin-top: 18px;
    display: block;
}

.block-margin-top-4 {
    display: block;
    margin-top: 4px;
}

.flex-2 {
    flex: 2;
}

.error-message-red {
    color: Red;
    display: block;
    margin-bottom: 12px;
}

.flex-space-between-margin-top-12 {
    display: flex;
    justify-content: space-between;
    margin-top: 12px;
}

.enrollment-message {
    display: block;
    margin-top: 12px;
    font-size: 14px;
    width: 620px;
    line-height: 1.5;
}

.validation-header {
    padding-left: 0px;
}

.flex-space-between {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.flex-gap-8 {
    display: flex;
    gap: 8px;
}

.flex-gap-8-center {
    display: flex;
    gap: 8px;
    align-items: center;
}

.flex-center-gap-16 {
    display: flex;
    align-items: center;
    gap: 16px;
}

.flex-gap-12 {
    display: flex;
    gap: 12px;
}

.flex-gap-30 {
    display: flex;
    gap: 30px;
}

.flex-center-gap-30 {
    display: flex;
    align-items: center;
    gap: 30px;
}

.view-icon {
    width: 20px;
    height: 20px;
    cursor: pointer;
}
@media  ( max-width: 1024px ) {
.content-page {
    background-color: #F9F9FA;
    border-radius: 8px;
    height: auto;
    overflow-y: auto;
}

}

#smartbanner { 
    position:absolute; 
    left:0; 
    top:-82px; 
    border-bottom:1px solid #e8e8e8; 
    width:100%; 
    height:78px; 
    font-family:'Helvetica Neue',sans-serif; 
    background:-webkit-linear-gradient(top, #f4f4f4 0%,#cdcdcd 100%); 
    box-shadow:0 1px 2px rgba(0,0,0,0.5); 
    z-index:9998; 
    -webkit-font-smoothing:antialiased; 
    overflow:hidden; 
    -webkit-text-size-adjust:none; 
}

/* Fix for scroll issue when smartbanner is shown */
html {
    overflow-y: auto !important;
}

body {
    min-height: 100vh;
    overflow-y: visible !important;
}

#smartbanner .sb-container { 
    margin: 0 auto;
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
}

#smartbanner .sb-close { 
    position: absolute; 
    right: 10px; 
    top: 50%;
    transform: translateY(-50%);
    display: block; 
    width: 30px; 
    height: 30px; 
    background: transparent;
    border: none;
    text-decoration: none; 
    cursor: pointer;
    font-size: 28px;
    line-height: 30px;
    color: #666;
    font-weight: 300;
    text-indent: 0;
    overflow: visible;
    z-index: 10;
    text-align: center;
}

#smartbanner .sb-close:active,
#smartbanner .sb-close:hover { 
    color: #333; 
}

#smartbanner .sb-icon { 
    position: absolute; 
    left: 30px; 
    top: 50%;
    transform: translateY(-50%);
    display: block; 
    width: 57px; 
    height: 57px; 
    background: rgba(0,0,0,0.6); 
    background-size: cover; 
    border-radius: 10px; 
    box-shadow: 0 1px 3px rgba(0,0,0,0.3); 
}

#smartbanner.no-icon .sb-icon { 
    display: none; 
}

#smartbanner .sb-info { 
    position: absolute; 
    left: 100px; 
    top: 50%;
    transform: translateY(-50%);
    width: auto; 
    font-size: 11px; 
    line-height: 1.2em; 
    font-weight: bold; 
    color: #6a6a6a; 
    text-shadow: 0 1px 0 rgba(255,255,255,0.8); 
}

#smartbanner.no-icon .sb-info { 
    left: 30px; 
}

#smartbanner .sb-info strong { 
    display: block; 
    font-size: 18px; 
    color: #4d4d4d; 
    line-height: 18px; 
    font-weight: 500 !important; 
    text-shadow: none !important;
    margin-bottom: 4px;
}

#smartbanner .sb-info > span { 
    display: block; 
    font-size: 14px; 
    color: #4d4d4d; 
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    line-height: 18px; 
    font-weight: 600 !important; 
    text-shadow: none !important;  
}

#smartbanner .sb-info em { 
    font-style: normal; 
    text-transform: uppercase; 
}

/* New price container positioned on the right */
#smartbanner .sb-price { 
    position: absolute; 
    right: 140px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14px;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-weight: 600;
    color: #2F3034;
    text-align: right;
    z-index: 5;
}

#smartbanner .sb-button { 
    position: absolute; 
    right: 50px; 
    top: 50%;
    transform: translateY(-50%);
    border: 1px solid #bbbdc0; 
    background: -webkit-linear-gradient(top, #efefef 0%,#ddd 100%); 
    color: #555; 
    text-transform: uppercase; 
    text-decoration: none; 
    text-shadow: 0 1px 0 rgba(255,255,255,0.8); 
    font-size: 9px; 
    font-weight: bold; 
    padding: 0;
    border-radius: 3px; 
    box-shadow: 0 1px 0 rgba(255,255,255,0.8), 0 1px 0 rgba(255,255,255,0.8) inset;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 5;
}

#smartbanner .sb-button span {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px; 
    font-weight: 600;
    color: #2F3034;
    text-transform: none;
    padding: 6px 10px;
    display: block;
}

#smartbanner .sb-button:active, 
#smartbanner .sb-button:hover { 
    background: -webkit-linear-gradient(top, #ddd 0%,#ccc 100%); 
}

#smartbanner .sb-icon.gloss:after { 
    content:''; 
    position:absolute; 
    left:0; 
    top:-1px; 
    border-top:1px solid rgba(255,255,255,0.8); 
    width:100%; 
    height:50%; 
    background:-webkit-linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,0.2) 100%); 
    border-radius:10px 10px 12px 12px; 
}

/* Android specific styles */
#smartbanner.android { 
    border-color: #E8E4FF; 
    background: #E8E4FF; 
    border-top: 5px solid #E8E4FF; 
    box-shadow: none; 
}

#smartbanner.android .sb-close { 
    border: 0; 
    width: 30px; 
    height: 30px; 
    line-height: 30px; 
    color: #2F3034; 
    background: transparent;
    text-shadow: none;
    box-shadow: none;
    font-size: 28px;
    font-weight: 300;
    z-index: 10;
}

#smartbanner.android .sb-close:active,
#smartbanner.android .sb-close:hover { 
    color: #000; 
}

#smartbanner.android .sb-info { 
    color: #2F3034; 
    text-shadow: none;
}

#smartbanner.android .sb-info strong { 
    color: #2F3034; 
    font-size: 18px; 
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif; 
}

#smartbanner.android .sb-price {
    color: #2F3034;
}

#smartbanner.android .sb-button { 
    width: 75px; 
    height: 45px; 
    border: 1px solid #2F3034; 
    border-radius: 8px !important; 
    padding: 0;
    color: #d1d1d1; 
    background: none;
    box-shadow: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

#smartbanner.android .sb-button span { 
    text-align: center; 
    display: block; 
    padding: 0 10px; 
    background-color: transparent; 
    font-size: 14px; 
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif; 
    font-weight: 600; 
    color: #2F3034; 
}

#smartbanner.android .sb-button:active, 
#smartbanner.android .sb-button:hover { 
    background: none;  
}

#smartbanner.android .sb-button:active span, 
#smartbanner.android .sb-button:hover span { 
    background: transparent; 
}
.validationGroup
{
     /* Top Right Bottom Left */
    padding: 0px;
    margin: 0px 0px 0px 0px;
}

.validationGroup ul
{
     /* Top Right Bottom Left */
    padding: 8px 6px 8px 36px;
    margin: 0px 0px 0px 0px;
    list-style: none;
    /* font-size: 11px; */
    color: #2F3034;
    background-color: #FFE7D7;
    background-image: url('Master/triangle-alert.png');
    background-repeat: no-repeat;
    background-position: 8px center;
    background-size: 24px 24px;
    min-height: 40px;
    vertical-align: top;
    display: flex;
    align-items: center;
    font-size: 14px;
    -webkit-border-radius: .4em; 
	-moz-border-radius: .4em;
	border-radius: .4em;
}

.validationGroup ul li
{
    /* Line item styling would go here. */
    margin-left: 4px;
}

.validationGroup ul li:before
{
    /* This appends the "dash" before each error line. */
    /* padding-left: 4px; */
    content: '';
}
/* ========================================
   LOADING PANEL FIX FOR DIALOGS
   ======================================== */

/* Make dialog content a positioning context for loading panel */
.SNSWindowTable {
    position: relative !important;
}

/* .SNSWindowContent {
    position: relative !important;
} */

/* Loading panel inside dialogs should cover just the dialog */
.SNSWindowContent .RadAjax,
.SNSWindowContent .RadAjax_SNS,
.SNSWindowTable .RadAjax,
.SNSWindowTable .RadAjax_SNS {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 1002 !important;
}

.SNSWindowContent .RadAjax_SNS .raDiv,
.SNSWindowTable .RadAjax_SNS .raDiv {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
}

.SNSWindowContent .RadAjax_SNS .raColor,
.SNSWindowTable .RadAjax_SNS .raColor {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

.SNSPanelHeader {
    height: 26px;
    color: #4B3327;
    font-size: 18px;
    line-height: 26px;
    font-weight: 500;
    padding-left: 20px;
    margin-top: 20px;
    padding-bottom: 8px;
    display: block;
}


.SNSFaded {
   
}

.SNSPanelContent
{
    padding:20px;
}

@media (max-width: 1024px) {
    .SNSPanelContent {
        padding: 10px;
    }
}

.SNSWindowOverlay
{
	z-index: 1000;
	filter: alpha(opacity=30); /*older IE*/
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=30); /* IE */
	-moz-opacity: .30; /*older Mozilla*/
	-khtml-opacity: 0.3;   /*older Safari*/
	opacity: 0.3;   /*supported by current Mozilla, Safari, and Opera*/
	background-color: black;
	position:fixed; top:0px; left:0px; width:100%; height:100%; color:#FFFFFF; text-align:center; vertical-align:middle;
}

.SNSWindowPositionNormal
{
    position: fixed;
    top: 10%;
    left: 0px;
    width: 100%;
    text-align: center;
    vertical-align: middle;
    z-index: 1001;
 }

.SNSWindowPositionElevated
{
    position: fixed;
    top: 5%;
    left: 0px;
    width: 100%;
    text-align: center;
    vertical-align: middle;
    z-index: 1001;
 }

.SNSWindowHeader
{
    font-size:18px !important;
    color: #141416 !important;
    font-weight: 600 !important;
    text-align: left;
    /* Top Right Bottom Left */
    margin: 25px 20px 0px 20px;
    /*
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 25px;
    */
}

.SNSWindowTable
{
    /*
    border: 1px solid #393939;
    background-color: #ededed;
    */
    background-color: #FFFFFF;
    border: none;
   	-webkit-border-radius: .3em;
	-moz-border-radius: .3em;
	border-radius: .3em;
}

.SNSWindowContent
{
    text-align: left;
    /*
    border: 1px solid #aeaeae;
    background-color: White;
    */
    /* padding: 5px; */
    border: none;
    /* Top Right Bottom Left */
    margin: 20px 20px 20px 20px;
    /*
    margin-top: 10px;
    margin-left: 20px;
    margin-right: 20px;
    margin-bottom: 20px;
    */
    /* Base responsive improvements */
    box-sizing: border-box;
    overflow-x: auto;
    overflow-y: auto;
    max-height: calc(80vh - 80px);
}

.SNSWindowPositionElevated .SNSWindowContent {
    max-height: calc(85vh - 80px);
}

.unlink-dialog .SNSWindowContent {
    display: flex;
    flex-direction: column;
}
    
/* Telerik RadAjaxLoadingPanel Skin */

.RadAjax_SNS .raDiv
{
	background-image:url('Ajax/spinner.gif');
	opacity:0.8;
	-moz-opacity:0.8;
	filter:alpha(opacity=80);
}

.RadAjax_SNS .raColor
{
	background-color:#fff;
}

.RadAjax_SNS .raTransp
{
	opacity:0.5;
	-moz-opacity:0.5;
	filter:alpha(opacity=50);
}
/*Telerik RadCalendar Web20 skin*/

table.RadCalendar_SNS
{
	background:#fff;
	font: 11px 'Poppins', Verdana, Arial, Helvetica, sans-serif;
	width: 280px;
	height: 320px;
}

/*titlebar*/

.RadCalendar_SNS .rcTitlebar
{
	border-color:#ffffff;
	background:#ffffff;
	color:#2F3034;
	padding-top: 15px !important;
}

.RadCalendar_SNS .rcTitlebar table
{
	font: 500 14px 'Poppins', Verdana, Arial, Helvetica, sans-serif;
}

.RadCalendar_SNS .rcTitlebar td
{
	padding:0 0 2px;
}

.RadCalendar_SNS .rcTitlebar .rcPrev,
.RadCalendar_SNS .rcTitlebar .rcNext,
.RadCalendar_SNS .rcTitlebar .rcFastPrev,
.RadCalendar_SNS .rcTitlebar .rcFastNext
{
	width:22px;
	height:20px;
	margin:2px 0 0;
	color:#2F3034;
}

.RadCalendar_SNS .rcTitlebar .rcFastPrev
{
	margin-left:2px;
	background-image:url('Master/doubleback_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendar_SNS .rcTitlebar .rcFastPrev:hover
{
	background-color: #F0F0F0;
}

.RadCalendar_SNS .rcTitlebar .rcPrev
{
	background-image:url('Master/back_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendar_SNS .rcTitlebar .rcPrev:hover
{
	background-color: #F0F0F0;
}

.RadCalendar_SNS .rcTitlebar .rcNext
{
	background-image:url('Master/forward_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendar_SNS .rcTitlebar .rcNext:hover
{
	background-color: #F0F0F0;
}

.RadCalendar_SNS .rcTitlebar .rcFastNext
{
	margin-right:2px;
	background-image:url('Master/doubleforward_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendar_SNS .rcTitlebar .rcFastNext:hover
{
	background-color: #F0F0F0;
}

.RadCalendar_SNS .rcMain
{
	border-color:#E4E4E7;
	padding: 10px 10px 10px 10px !important
}

.RadCalendar_SNS .rcMainTable
{
	color:#2F3034;
	font:11px/18px 'Poppins', Verdana, Arial, Helvetica, sans-serif;
	width: 100%;
	height: 280px;
}

/*header, footer*/

.RadCalendar_SNS .rcHeader,
.RadCalendar_SNS .rcFooter
{
	border-color:#E4E4E7;
}

/*week numbers and days*/

.RadCalendar_SNS .rcRow th,
.RadCalendar_SNS .rcWeek th
{
	background:#ffffff;
	font: 400 12px 'Poppins', Verdana, Arial, Helvetica, sans-serif;
	color: #71717A;
}

.RadCalendar_SNS .rcWeek th
{
	border-bottom:1px solid #E4E4E7;
	padding:2px 6px 3px 0;
	font: 400 12px 'Poppins', Verdana, Arial, Helvetica, sans-serif;
	color: #71717A;
	text-align: center !important;
}

.RadCalendar_SNS .rcWeek .rcViewSel,
.RadCalendar_SNS .rcRow th
{
	width:13px;
	border-right:1px solid #E4E4E7;
	padding:0 7px 0 9px;
}

.RadCalendar_SNS .rcWeek .rcViewSel
{
	border-right-color:#F5F5F5;
}

/*date cells*/

.RadCalendar_SNS .rcRow td
{
	border-color:#fff;
	text-align: center !important;
}

.RadCalendar_SNS .rcMain .rcRow a,
.RadCalendar_SNS .rcMain .rcRow span
{
	color:#2F3034;
	font-size: 14px;
	padding: 0 !important;
}

.RadCalendar_SNS .rcMain .rcWeekend a
{
	color:#2F3034;
	font-size: 14px;
}

.RadCalendar_SNS .rcRow .rcToday
{
	background-color: #F4F4F5;
	border: none !important;
}

.RadCalendar_SNS .rcMain .rcOtherMonth a
{
	color:#A0A0A0;
	font-size: 14px;
}

.RadCalendar_SNS .rcMain .rcOutOfRange span
{
	color:#A0A0A0;
	font-size: 14px;
}

.RadCalendar_SNS .rcRow .rcHover
{
	border-color:#E4E4E7;
	background:#F0F0F0;
}

.RadCalendar_SNS .rcRow .rcHover a
{
	color:#2F3034;
	font-size: 14px;
}

.RadCalendar_SNS .rcRow .rcSelected
{
	border-color:#D2DC11;
	background:#D2DC11;
}

.RadCalendar_SNS .rcRow .rcSelected a
{
	color:#2F3034;
	font-size: 14px;
}

/*multimonth view*/

.RadCalendarMultiView_SNS .rcTitlebar
{
	border-color:#E4E4E7;
	background:#ffffff 0 -1200px repeat-x url('Calendar/sprite.gif');
	padding-top: 8px;
}

.RadCalendarMultiView_SNS .rcTitlebar table
{
	line-height:28px;
	font: 500 14px 'Poppins', Verdana, Arial, Helvetica, sans-serif;
}

.RadCalendarMultiView_SNS .rcTitlebar .rcFastPrev:hover
{
	background-color: #F0F0F0;
}

.RadCalendarMultiView_SNS .rcTitlebar .rcFastPrev
{
	background-image:url('Master/doubleback_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarMultiView_SNS .rcTitlebar .rcPrev:hover
{
	background-color: #F0F0F0;
}

.RadCalendarMultiView_SNS .rcTitlebar .rcPrev
{
	background-image:url('Master/back_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarMultiView_SNS .rcTitlebar .rcNext:hover
{
	background-color: #F0F0F0;
}

.RadCalendarMultiView_SNS .rcTitlebar .rcNext
{
	background-image:url('Master/forward_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarMultiView_SNS .rcTitlebar .rcFastNext:hover
{
	background-color: #F0F0F0;
}

.RadCalendarMultiView_SNS .rcTitlebar .rcFastNext
{
	background-image:url('Master/doubleforward_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarMultiView_SNS .rcMain
{
	border-color:#E4E4E7;
	padding: 10px 10px 10px 10px !important
}

.RadCalendarMultiView_SNS .rcCalendar
{
	border-color:#E4E4E7;
}

.RadCalendarMultiView_SNS .rcMainTable .rcTitle
{
	border-bottom:1px solid #E4E4E7;
	background:#ffffff 0 -1000px repeat-x url('Calendar/sprite.gif');
	color:#2F3034;
	line-height:22px;
	font: 500 14px 'Poppins', Verdana, Arial, Helvetica, sans-serif;
}

/*month view*/

table.RadCalendarMonthView_SNS
{
	border-color:#E4E4E7;
	background:#fff;
	font:12px 'Poppins', 'segoe ui',arial,sans-serif;
	color:#2F3034;
	width: 240px;
	height: 220px;
}

.RadCalendarMonthView_SNS #rcMView_Feb,
.RadCalendarMonthView_SNS #rcMView_Apr,
.RadCalendarMonthView_SNS #rcMView_Jun,
.RadCalendarMonthView_SNS #rcMView_Aug,
.RadCalendarMonthView_SNS #rcMView_Oct,
.RadCalendarMonthView_SNS #rcMView_Dec
{
	border-right:1px solid #E4E4E7;
}

.RadCalendarMonthView_SNS a
{
	color:#2F3034;
}

.RadCalendarMonthView_SNS .rcSelected a
{
	border-color:#D2DC11;
	background:#D2DC11;
	color:#2F3034;
}

.RadCalendarMonthView_SNS #rcMView_PrevY a,
.RadCalendarMonthView_SNS #rcMView_NextY a
{
	width:16px;
	height:13px;
	color:#A0A0A0;
}

.RadCalendarMonthView_SNS #rcMView_PrevY a
{
	background-image:url('Master/doubleback_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarMonthView_SNS #rcMView_NextY a
{
	background-image:url('Master/doubleforward_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarMonthView_SNS .rcButtons
{
	padding:5px 7px 3px;
}

.RadCalendarMonthView_SNS input
{
	border-color:#E4E4E7;
	background:#F5F5F5;
	color:#2F3034;
	font:12px 'Poppins', 'segoe ui',arial,sans-serif;
}

.RadCalendarMonthView_SNS input:hover
{
	border-color:#D2DC11;
	background-color:#D2DC11;
	color:#2F3034;
}

.RadCalendarMonthView_SNS #rcMView_Today,
.RadCalendarMonthView_SNS #rcMView_Cancel
{
	background: #ffffff;
	border-radius: 8px;
	font-size: 14px;
}

.RadCalendarMonthView_SNS #rcMView_OK
{
	background: #D2DC11;
	border-radius: 8px;
	font-size: 14px;
}

/*time view*/

table.RadCalendarTimeView_SNS
{
	border-color:#E4E4E7;
	background:#fff;
	font:12px 'Poppins', 'segoe ui',arial,sans-serif;
	max-height: 300px;
	overflow-y: auto;
	display: block;
}

.RadCalendarTimeView_SNS th
{
	border-bottom:1px solid #E4E4E7;
	padding:4px 0;
	background:#D2DC11;
	color:#2F3034;
	line-height:24px;
	font: 500 14px 'Poppins', Verdana, Arial, Helvetica, sans-serif;
}

table.RadCalendarTimeView_SNS td
{
	border-color:#E4E4E7;
}

.RadCalendarTimeView_SNS a
{
	color:#2F3034;
	font-size: 13px;
}

.RadCalendarTimeView_SNS td.rcSelected a
{
	border-color:#D2DC11;
	background:#D2DC11;
	color:#2F3034;
}

.RadCalendarTimeView_SNS td.rcHover a
{
	border-color:#E4E4E7;
	background:#F0F0F0;
	color:#2F3034;
}

.RadCalendarTimeView_SNS .rcFooter
{
	border-color:#E4E4E7;
}

/*pickers - styled like searchIcon button*/

.RadPicker_SNS .rcCalPopup,
.RadPicker_SNS .rcTimePopup
{
	width: 40px !important;
	height: 40px !important;
	border: 2px solid #D1D1D6 !important;
	border-radius: 8px !important;
	background-color: #FFFFFF !important;
	background-image: url('Master/calendar.png') !important;
	background-position: center center !important;
	background-repeat: no-repeat !important;
	background-size: 18px 18px !important;
	cursor: pointer !important;
	padding: 0 !important;
	transition: background-color 0.2s ease, border-color 0.2s ease;
}

.RadPicker_SNS .rcCalPopup:hover,
.RadPicker_SNS .rcCalPopup:focus,
.RadPicker_SNS .rcCalPopup:active
{
	background-color: #F9FAFB !important;
	border-color: #A1A1AA !important;
}

.RadPicker_SNS .rcTimePopup
{
	background-image: url('Master/clock.png') !important;
}

.RadPicker_SNS .rcTimePopup:hover,
.RadPicker_SNS .rcTimePopup:focus,
.RadPicker_SNS .rcTimePopup:active
{
	background-color: #F9FAFB !important;
	border-color: #A1A1AA !important;
}

.RadPicker_SNS .rcDisabled.rcCalPopup,
.RadPicker_SNS .rcDisabled.rcTimePopup
{
	background-color: #FFFFFF !important;
	border-color: #D1D1D6 !important;
	cursor: not-allowed !important;
	opacity: 0.5;
}

.RadPicker_SNS .rcDisabled.rcCalPopup:hover,
.RadPicker_SNS .rcDisabled.rcTimePopup:hover
{
	background-color: #FFFFFF !important;
	border-color: #D1D1D6 !important;
}

/*rtl*/

.RadCalendarRTL_SNS .rcTitlebar .rcFastPrev
{
	background-image:url('Master/doubleback_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarRTL_SNS .rcTitlebar .rcFastPrev:hover
{
	background-color: #F0F0F0;
}

.RadCalendarRTL_SNS .rcTitlebar .rcPrev
{
	background-image:url('Master/back_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarRTL_SNS .rcTitlebar .rcPrev:hover
{
	background-color: #F0F0F0;
}

.RadCalendarRTL_SNS .rcTitlebar .rcNext
{
	background-image:url('Master/forward_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarRTL_SNS .rcTitlebar .rcNext:hover
{
	background-color: #F0F0F0;
}

.RadCalendarRTL_SNS .rcTitlebar .rcFastNext
{
	background-image:url('Master/doubleforward_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarRTL_SNS .rcTitlebar .rcFastNext:hover
{
	background-color: #F0F0F0;
}

.RadCalendarMultiViewRTL_SNS .rcTitlebar .rcFastPrev
{
	background-image:url('Master/doubleback_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarMultiViewRTL_SNS .rcTitlebar .rcFastPrev:hover
{
	background-color: #F0F0F0;
}

.RadCalendarMultiViewRTL_SNS .rcTitlebar .rcPrev
{
	background-image:url('Master/back_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarMultiViewRTL_SNS .rcTitlebar .rcPrev:hover
{
	background-color: #F0F0F0;
}

.RadCalendarMultiViewRTL_SNS .rcTitlebar .rcNext
{
	background-image:url('Master/forward_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarMultiViewRTL_SNS .rcTitlebar .rcNext:hover
{
	background-color: #F0F0F0;
}

.RadCalendarMultiViewRTL_SNS .rcTitlebar .rcFastNext
{
	background-image:url('Master/doubleforward_calendar.png');
	background-repeat: no-repeat;
	background-position: center;
}

.RadCalendarMultiViewRTL_SNS .rcTitlebar .rcFastNext:hover
{
	background-color: #F0F0F0;
}

/* Hide shadow elements */
.rcShadTR,
.rcShadBL
{
	display: none !important;
}
/*global*/

.RadComboBox_SNS,
.RadComboBox_SNS .rcbInput,
.RadComboBoxDropDown_SNS {
    font: 14px 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    color: #000;
}

/* Note: Border and shading for combo box is in TextBox.cs. */

/* combobox */

div.RadComboBox_SNS table td.rcbInputCell {
    /*
    height:24px;
    line-height:20px;
    */
    height: 35px;
    line-height: 18px;
    border-radius: 8px;
    background-color: white;
}

* html div.RadComboBox_SNS table td.rcbInputCell {
    height: 22px;
    line-height: 18px;
}

/* Commented out because it causes a black border around the input. */
/*
div.RadComboBox_SNS table td.rcbInputCellLeft { border-width: 1px 0 1px 1px; }
div.RadComboBox_SNS table td.rcbInputCellRight { border-width: 1px 1px 1px 0; }
*/

* html div.RadComboBox_SNS .rcbInputCell .rcbInput {
    height: 16px;
    /*
	padding: 0px 4px 0px 4px; */ /* This should fix the ajax introduced height in IE7 and not break IE6 */
}

.RadComboBox_SNS .rcbInputCell .rcbEmptyMessage {
    color: #000000;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif !important;
    font-size: 14px !important;
    font-style: normal !important
}
.RadComboBox .rcbEmptyMessage{
    font-style: normal !important;
}

.RadComboBox_SNS .rcbHovered .rcbInputCell .rcbInput,
.RadComboBox_SNS .rcbFocused .rcbInputCell .rcbInput {
    color: #000;
}

div.RadComboBox_SNS table td.rcbArrowCell {
    /* background: url('ComboBox/rcbSprite.png') no-repeat -1px 50%; */
    background-image: url('ComboBox/rcbSprite.png');
    background-color:transparent;
}

/* Commented out because it causes a black border around the arrow. */
/*
div.RadComboBox_SNS .rcbReadOnly .rcbArrowCellLeft,
div.RadComboBox_SNS .rcbArrowCellHidden.rcbArrowCellLeft { border-width: 1px 0 1px 1px; }
div.RadComboBox_SNS .rcbReadOnly .rcbArrowCellRight,
div.RadComboBox_SNS .rcbArrowCellHidden.rcbArrowCellRight { border-width: 1px 1px 1px 0; }
*/

.RadComboBox_SNS td.rcbArrowCell {
    background-position: -1px 50%;
}

.RadComboBox_SNS .rcbHovered td.rcbArrowCell {
    background-position: -21px 50%;
}

.RadComboBox_SNS .rcbFocused td.rcbArrowCell {
    background-position: -41px 50%;
}

.RadComboBox_SNS .rcbDisabled td.rcbArrowCell {
    background-position: -61px 50%;
}

.RadComboBox_SNS .rcbReadOnly td.rcbArrowCell {
    background-position: -2px 50%;
}

.RadComboBox_SNS .rcbHovered .rcbReadOnly td.rcbArrowCell {
    background-position: -22px 50%;
}

.RadComboBox_SNS .rcbFocused .rcbReadOnly td.rcbArrowCell {
    background-position: -42px 50%;
}

.RadComboBox_SNS .rcbDisabled .rcbReadOnly td.rcbArrowCell {
    background-position: -62px 50%;
}

.RadComboBox_SNS td.rcbArrowCellHidden,
.RadComboBox_SNS .rcbHovered td.rcbArrowCellHidden,
.RadComboBox_SNS .rcbFocused td.rcbArrowCellHidden,
.RadComboBox_SNS .rcbReadOnly td.rcbArrowCellHidden,
.RadComboBox_SNS .rcbHovered .rcbReadOnly .rcbArrowCellHidden,
.RadComboBox_SNS .rcbFocused .rcbReadOnly .rcbArrowCellHidden,
.RadComboBox_SNS .rcbDisabled .rcbReadOnly .rcbArrowCellHidden,
.RadComboBox_SNS table.rcbDisabled td.rcbArrowCellHidden {
    background: none;
}

.RadComboBox_SNS .rcbHovered .rcbArrowCell,
.RadComboBox_SNS .rcbHovered .rcbReadOnly .rcbInputCell,
.RadComboBox_SNS .rcbHovered .rcbReadOnly .rcbArrowCellHidden {
}

.RadComboBox_SNS .rcbFocused .rcbArrowCell,
.RadComboBox_SNS .rcbFocused .rcbReadOnly .rcbInputCell,
.RadComboBox_SNS .rcbFocused .rcbReadOnly .rcbArrowCellHidden {
}

div.RadComboBox_SNS .rcbHovered .rcbArrowCell,
div.RadComboBox_SNS .rcbHovered .rcbInputCell {
    border-color: #3385d6;
}

div.RadComboBox_SNS .rcbFocused .rcbArrowCell,
div.RadComboBox_SNS .rcbFocused .rcbInputCell {
    border-color: #3385d6;
}

div.RadComboBox_SNS .rcbDisabled .rcbArrowCell,
div.RadComboBox_SNS .rcbDisabled .rcbInputCell {
    border-color: White;
}

div.RadComboBox_SNS .rcbArrowCell a {
    height: 20px;
}

div.RadComboBox_SNS td.rcbArrowCellHidden,
div.RadComboBox_SNS .rcbArrowCellHidden a {
    width: 1px;
}

    div.RadComboBox_SNS td.rcbArrowCellHidden.rcbArrowCellRight {
        border-left: 0;
    }

/* Read-only styles */

/* dropdown */

div.RadComboBoxDropDown_SNS {
    background: #fff;
    border-color: #eae9e9;
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -o-border-radius: 6px;
}

    div.RadComboBoxDropDown_SNS .rcbHeader,
    div.RadComboBoxDropDown_SNS .rcbFooter {
        background: #e4e4e4;
        color: #000;
    }

    div.RadComboBoxDropDown_SNS .rcbHeader {
        border-bottom-color: #7c7c7c;
    }

    div.RadComboBoxDropDown_SNS .rcbFooter {
        border-top-color: #7c7c7c;
    }

    div.RadComboBoxDropDown_SNS .rcbItem em {
        background: #e5e5e5;
    }

    div.RadComboBoxDropDown_SNS .rcbHovered {
        background: #5091cd;
        color: White;
    }

.RadComboBoxDropDown_SNS .rcbSeparator {
    color: #fff;
    background: #8a8a8a;
}

div.RadComboBox_SNS .rcbDisabled .rcbInputCell .rcbInput,
div.RadComboBoxDropDown_SNS .rcbDisabled {
    color: #000;
    border: 1px solid White;
}

div.RadComboBoxDropDown_SNS .rcbLoading {
    background: #f0f0f0;
}

div.RadComboBoxDropDown_SNS .rcbMoreResults {
    border-top-color: #c3c3c3;
    background: #e4e4e4;
    color: #8a8a8a;
}

div.RadComboBoxDropDown_SNS .rcbMoreResults a {
    background: url('ComboBox/rcbSprite.png') no-repeat -1px -85px;
}

.RadComboBox_SNS:focus-within {
    border-color: #431EB7 !important;
    outline: 1px solid #431EB7 !important;
    outline-offset: 1px !important;
}

.rdLeft, .rdRight, .rdBottom
{
    
}

.RadDock_SNS .rdMiddle .rdLeft,
.RadDock_SNS .rdMiddle .rdRight
{
	background-image: url('Dock/VerticalSprite.gif');
}

.RadDock_SNS .rdTop .rdLeft,
.RadDock_SNS .rdTop .rdRight,
.RadDock_SNS .rdTop .rdCenter,
.RadDock_SNS .rdBottom .rdLeft,
.RadDock_SNS .rdBottom .rdRight,
.RadDock_SNS .rdBottom .rdCenter
{
	background-image: url('Dock/HorizontalSprite.gif');
}

.RadDock_SNS .rdCenter .rdCommands a span
{
	background-image: url('Dock/CommandSprite.gif');
}

.RadDock_SNS .rdMiddle .rdCenter,
.RadDock_SNS .rdBottom .rdCenter
{
	background-color:White;
}

.RadDock_SNS .rdContent
{
	font: 11px Verdana, Arial !important;
    background-color:White;
    font-weight:bold;
}

.rdTitleBar em
{
    color:White;
    font-weight:bold;
    
    
    font: 13px Verdana, Arial !important;
    font-weight:bold !important;
    line-height:26px !important;
}

/* Editor/ToolbarSprites.gif */
/* RadEditor for ASP.NET AJAX Base Stylesheet */

/* MVC overrides */
.RadEditor table,
.RadEditor.reWrapper table td
{
	border:0;
	padding:0;
}

/* RadFormDecorator integration */
* html .rfdTable .reWrapper table td
{
	padding: 0;
}

/* By default 'regular' background should be white*/
.reDropDownBody
{
    background-color: #fff;
    /* top-left / top-right / bottom-right / bottom-left */
    border-radius: 0px 0px 6px 6px;
	-moz-border-radius: 0px 0px 6px 6px;
    -o-border-raidus: 0px 0px 6px 6px;
    -webkit-border-top-left-radius: 0px;
    -webkit-border-top-right-radius: 0px;
    -webkit-border-bottom-right-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
}

/* In FireFox iframes have transparent background */
.reContentCell, .reContentCell iframe
{
    background-color: #fff;
    /* top-left / top-right / bottom-right / bottom-left */
    border-radius: 0px 0px 6px 6px;
	-moz-border-radius: 0px 0px 6px 6px;
    -o-border-raidus: 0px 0px 6px 6px;
    -webkit-border-top-left-radius: 0px;
    -webkit-border-top-right-radius: 0px;
    -webkit-border-bottom-right-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
}

/* Class for the toolbar holder */
.RadEditor.reWrapper .reToolCell
{
	vertical-align: top; /* Needed to position the toolbar wrapper at the top - and then set margin to it! */    
	padding-bottom: 1px;
}
/* this specifyes necessary padding for all browsers excepr IE6, IE7 */
*|html .RadEditor.reWrapper .reToolCell
{
	padding-bottom: 0;
}

/* Align the Bottom zone with the Statistics module to the right */
.reBottomZone
{     
    text-align: right;
    vertical-align: bottom;
}

.reToolbarWrapper
{
    margin-top: 0;
}

.reToolbar
{
	padding: 0 !important; /* Reset CSS */
	margin: 0 0 1px 0 !important; /* Reset CSS */
	list-style: none !important; /* Reset CSS */
	float: left;
}

.reToolbar li
{
    padding: 0 !important; /* Reset CSS */
	margin: 0 !important; /* Reset CSS */
	list-style: none !important; /* Reset CSS */
	float: left;
    background-repeat: repeat-x;
    height: 26px;
}

.reToolbar
{    
    margin-bottom: 2px;
}

.reToolbar a,
.reDropdown,
.reSpinBox input,
.RadEditor input,
.reModule,
.reModule td,
.reEditorModes a,
.reDropDownBody,
.reDropDownBody td,
.reAjaxspell_wrapper,
.reAjaxspell_button,
.reAjaxspell_addicon,
.reAjaxspell_ignoreicon,
.reAjaxspell_okicon,
.reInsertTable .reTlbVertical ul a.reTool_text span.reButton_text,
.reColorPicker .reCustomColor
{
    font: normal 12px "Segoe UI", Arial, Sans-serif;
    color: #000;
    text-decoration: none;
	cursor: default;
}

/* ajax spellcheck */
.reAjaxspell_button
{
    white-space: nowrap;
}

.reAjaxspell_addicon,
.reAjaxspell_ignoreicon,
.reAjaxspell_okicon
{
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 0;
    margin: 2px 4px 2px 2px;
    background-image: url('Common/CommonIcons.gif');
    background-repeat: no-repeat;
}

.reAjaxspell_ignoreicon
{
    background-position: center -103px;
}

.reAjaxspell_okicon
{
    background-position: center -134px;
}

.reAjaxspell_addicon
{
    background-position: center -166px;
}

.reAjaxSpellCheckSuggestions td
{
    width: 100%;
    padding-left: 4px;
}

.reAjaxSpellCheckSeparator
{
    font-size: 1px;
    height: 1px;
    margin: 2px 1px;
}

.reAjaxSpellCheck
{
    padding: 2px;
}
/* end of ajax spellcheck */

.RadEditor .reTextarea
{
    font-size: 11px;
}

/* separator */
.reToolbar .reSeparator
{
    width: 6px;
    height: 26px;
    font-size: 1px;
}
/* separator */

/* grip */
.reToolbar .reGrip
{
	height: 26px;
	width: 4px;
	font-size: 1px;
	background-repeat: no-repeat;
}

.reToolbar .grip_first
{
    background-position: 0 0;
}

.reToolbar .grip_last
{
    background-position: -4px 0;
}
/* end of grip grip */

.reAlignmentSelector div
{
    background-image: url('Common/CommandSpritesLight.png');
    height: 20px;
}

/* reTool */
.reTool,
.reTool:link,
.reTool:visited
{
    display: block;
    width: 24px;
    height: 24px;
    margin: 1px 0; /* was: margin: 1px; */
    text-decoration: none !important;
    cursor: default;
}

.reTool span
{
    display: block;
    float: left;
    width: 18px;
    height: 18px;
    line-height: 18px;
    margin: 3px;
    cursor: default;
    _display: inline;
    background-repeat: no-repeat;
}
/* end of reTool */

/* reTool_text */
.reToolbar .reTool_text
{
    height: 24px;
    width: auto;
    display: block;
    margin: 1px;
    text-decoration: none;
    cursor: default;
    float: left;
    _display: inline;
}

.reToolbar .reTool_text span
{
    background-repeat: no-repeat;
    display: block;
    float: left;
    width: 18px;
    height: 18px;
    line-height: 18px;
    margin: 3px;
    cursor: default;
    _display: inline;
}

.reToolbar .reTool_text .reButton_text
{
    width: auto;
    background-image: none;
    color: black;
}
/* end of reTool_text */

/* reSplitButton */
.reSplitButton,
.reSplitButton:link,
.reSplitButton:visited
{
    width: 34px; /* was: 36px */
    height: 24px;
    text-decoration: none !important;
}

* html .RadEditor .reSplitButton
{
    _display: inline-block;
}

.reTool .split_arrow
{
    width: 5px;
    height: 18px;
    margin-left: 1px;
}

.reSplitButton.reTool_text .split_arrow
{
    width: 5px;
    height: 18px;
}

* html .reToolbar .reTool_text .split_arrow
{
    width: 5px;
    height: 18px;
}

.reDialog .reTool.reSplitButton,
.reModule .reTool.reSplitButton
{
    background-repeat: no-repeat;
}
/* end of reSplitButton */

/* reDropdown */
.reToolbar a
{
    text-decoration: none !important;
}

.reDropdown,
.reTool_disabled.reDropdown:hover
{
    display: block;
    float: left;
    cursor: default;
    background-repeat: no-repeat !important;
    padding-left: 4px;
    padding-right: 10px;
    margin: 0; /* was: margin: 2px 1px 0 1px; */
    margin: 2px 0;
}

.reDropdown span
{
    display: block;
    width: 80px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 20px;
}
/* end of reDropdown */

/* vertical toolbar */
.reTlbVertical ul.reToolbar
{
    float: none;
    clear: both;
    width: 26px;
    height: auto;
}

.reTlbVertical li
{
    clear: both;
    float: none;
    margin: 0 !important; /* Reset CSS */
    font-size: 1px !important; /* Reset CSS */
    padding: 0 !important; /* Reset CSS */
    line-height: 1px !important; /* Reset CSS */
}

.reTlbVertical .reGrip
{
    width: 26px;
    height: 4px;
    font-size: 1px !important; /* Reset CSS */
    line-height: 1px !important; /* Reset CSS */
    background-repeat: no-repeat;
}

.reTlbVertical .reTool
{
    margin-top: 0;
    margin-bottom: 0;
}

.reTlbVertical .reSeparator
{
    width: 26px;
    height: 4px;
    line-height: 1px;
    font-size: 1px;
}

.reTlbVertical .reTool:hover,
.reTlbVertical .reTool_text.reSplitButton:hover,
.reTlbVertical .reTool_text:hover
{
    background-repeat: no-repeat;
}

.reTlbVertical .reTool.reTool_selected,
.reTlbVertical .reTool_text.reTool_selected,
.reTlbVertical .reTool_text.reTool_selected:hover
{
    background-repeat: no-repeat;
}

.reTlbVertical .reTool_text,
.reTlbVertical .reSplitButton
{
    width: 24px;
    height: 24px;
}

.reTlbVertical .reTool_text .reButton_text
{
	display: none;
}

.reTlbVertical .split_arrow,
.reTlbVertical .reDropdown span,
.reTlbVertical .reTool_text.reSplitButton .reButton_text,
.reTlbVertical .reTool_text.reSplitButton .split_arrow
{
    display: none;
}

/* add weight to the selector for IE6 so it is applied */
*html .reToolbar .reSplitButton.reTool_disabled:hover
{
    background-position: -999px 0;
}

.reTlbVertical .reDropdown,
.reTlbVertical .reDropdown:hover
{
    height: 20px;
    width: 22px;
    padding-right: 0;
    padding-left: 0;
    margin-right: 0;
}

* html .reTlbVertical .reDropdown,
* html .reTlbVertical .reDropdown:hover
{
    width: 21px;
}

.reTlbVertical .reTool,
.reTlbVertical .reDropdown
{
    margin-left: 1px;
}
/* end of vertical toolbar */

/* context menu and toolstrip */
.reDropDownBody
{
    float: left;
    /*_background: none;/* IE6 does not support transparent png and it looks ugly */
}

.reDropDownBody .reTlbVertical ul li
{
    clear: both;
    float: none;
    background: none;
}

/* reDropDownBody */
.reDropDownBody .reTlbVertical ul li a,
.reDropDownBody .reTlbVertical ul li .reTool_disabled:hover
{
    clear: both;
    float: none;
    width: 100%;
    display: block;
    border: 0;
    background: none;
}

.reDropDownBody .reTlbVertical ul li a:hover
{
    background-repeat: no-repeat;
    border: 0;
    margin-left: 1px;
    margin-right: 1px;
}

/* IE6 float and double margins fix */
* html .reDropDownBody .reTlbVertical ul li .reTool_disabled:hover
{
    margin-left: 0;
}

div.RadEditor td.reTlbVertical ul.reToolbar
{
    width: 26px !important;
}

.reDropDownBody .reTlbVertical ul li .reButton_text
{
    width: 156px !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-left: 8px;
    _zoom: 1;
	display: block;
}

.reDropDownBody div.reTlbVertical
{
    float: left;
    height: auto;
}

.reDropDownBody .reTlbVertical .reToolbar
{
    width: 206px;
    background-repeat: repeat-y;
}
/* reDropDownBody */

/* custom links */
.reCustomLinks,
.reCustomLinks ul,
.reCustomLinks li
{
	list-style: none !important; /* Reset CSS */
	padding: 0 !important; /* Reset CSS */
	margin: 0 !important; /* Reset CSS */
	cursor: default !important; /* Reset CSS */
}

ul.reCustomLinks
{
    margin-left: 3px !important; /* Reset CSS */
}

ul.reCustomLinks li ul
{
	margin-left: 12px !important; /* Reset CSS */
}

ul.reCustomLinks a
{
    text-decoration: undeline !important; /* Reset CSS */
}

ul.reCustomLinks a:hover
{
    cursor: pointer !important; /* Reset CSS */
}

ul.reCustomLinks li
{
	clear: both;
	float: none;
}

ul.reCustomLinks span,
ul.reCustomLinks a
{
	display: block;
	float: left;
	cursor: default;
	zoom: 1;
}

ul.reCustomLinks .reCustomLinksIcon
{
	font-size: 1px !important; /* Reset CSS */
}

ul.reCustomLinks .reCustomLinksIcon.reIcon_empty
{
	cursor: default;
}

ul.reCustomLinks li
{
	padding: 1px 0 !important; /* Reset CSS */
}

ul.reCustomLinks span,
ul.reCustomLinks a
{
	padding-left: 1px !important; /* Reset CSS */
	padding-right: 1px !important; /* Reset CSS */
	cursor: default;
}

ul.reCustomLinks .reCustomLinksIcon
{
	width: 9px;
	height: 9px;
	padding: 0 !important; /* Reset CSS */
	background-image: url('Common/CustomLinksSprites.gif');
	background-repeat: no-repeat;
	margin: 2px 4px 0 0 !important; /* Reset CSS */
}

ul.reCustomLinks span
{
    margin-top: 0;
}

ul.reCustomLinks .reCustomLinksIcon.reIcon_plus
{
	background-position: 0 0;
}

ul.reCustomLinks .reCustomLinksIcon.reIcon_minus
{
	background-position: -9px 0;
}

ul.reCustomLinks .reCustomLinksIcon.reIcon_empty
{
	background: none;
}
/* end of custom links */

/* spinbox */
table.reSpinBox
{
	border-collapse: collapse;
	cursor: text;
}

table.reSpinBox td
{
	padding: 0 !important; /* Reset CSS */
}

.reSpinBox input
{
	border: 0 !important;
	background: none transparent;
	width: 30px;
	height: 16px;
	text-align: right;
	cursor: text;
	padding: 0;
}

* html .reSpinBox input,
*+html .reSpinBox input
{
    width: 30px;
}

.reSpinBox a
{
	display: block;
	font-size: 1px !important; /* Reset CSS */
	text-indent: -9999px;
	width: 11px;
	height: 10px;
	cursor: default;
	background-repeat: no-repeat;
}
/* end of spinbox */

/* editor input elements */
.RadEditor input
{
	cursor: text;
}
/* editor input elements */

/* module */
.reModule
{
	border-collapse: collapse !important; /* Reset CSS */
}

td.reModuleLabel
{
    vertical-align: middle !important; /* Reset CSS */
    text-align: right !important; /* Reset CSS */
    padding-left: 6px !important; /* Reset CSS */
    padding-right: 3px !important; /* Reset CSS */
}

td.reModuleText .reEllipsisText
{
	max-width: 110px;
	_width: 110px;
	text-overflow: ellipsis;
	overflow: hidden;
	display: block;
	white-space: nowrap;
	float: right;
}

.reModule .reDropdown,
.reModule .reTool, 
.reModule .reSplitButton
{
    margin: 1px 0 0 0 !important; /* Reset CSS */
}
/* end of module */

/* editing modes */
.reEditorModes
{
    float: left;
    padding: 1px 0 1px 0 !important; /* Reset CSS */
}

.reEditorModes ul,
.reEditorModes li
{
    padding: 0 !important; /* Reset CSS */
    margin: 0 !important; /* Reset CSS */
    list-style: none !important; /* Reset CSS */
}

.reEditorModes li
{
    float: left !important; /* Reset CSS */
}

.reEditorModes a,
.reEditorModes span
{
    display: block;
    cursor: hand;
}

.reEditorModes a
{
    width: 76px;
}

.reEditorModes span
{
    line-height: 22px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 22px;
    margin: 0 3px;
    background-image: url('Common/CommonIcons.gif');
    background-repeat: no-repeat;
}

.reMode_selected
{
    background-repeat: no-repeat;
}

.reMode_design span,
.reMode_selected.reMode_design span
{
	background-position: -6px -5px;
}

.reMode_html span,
.reMode_selected.reMode_html span
{
	background-position: -6px -36px;
}

.reMode_preview span,
.reMode_selected.reMode_preview span
{
	background-position: -6px -69px;
}
/* end of editing modes */

/* reWrapper */
.reWrapper_corner,
.reWrapper_center,
.reLeftVerticalSide,
.reRightVerticalSide
{
    font-size: 1px;
    line-height: 1px;
}

/*.reWrapper_corner,-> do not set it, because this requires the layout paddings to be further adjusted in other elements*/
.reLeftVerticalSide,
.reRightVerticalSide
{
     padding: 1px; 
}

/* end of reWrapper */

/* DOM inspector */
.reModule_domlink
{
    text-decoration: none;
    font-size: 11px;
}
/* end of DOM inspector */

/* color picker */
.reColorPicker
{
	-moz-user-select: none;
	padding: 4px;
}

.reColorPicker table
{
	border-collapse: collapse;
	border: 0 !important;
	background: transparent !important;
}

.reColorPicker table td
{
	border: 0;
}

.reColorPicker .reColorPickerFooter
{
	overflow: hidden;
}

.reColorPicker span
{
	display: block;
	text-align: center;
	float: left;
	cursor: default;
}

.reColorPicker table div
{
	width: 11px; 
	height: 11px; 
	line-height: 11px; 
	font-size: 1px;
}

.reColorPicker table td
{
	padding: 2px;
	padding-bottom: 0;
	padding-top: 0;
}

.reDropDownBody.reColorPicker table td.reItemOver
{
	border: 0 !important;
	background: transparent !important;
}

.reColorPicker .reColorPickerFooter
{
	margin:0 auto;
	height: 22px;
	height: 18px;
	width: 166px;
	padding:4px 0;
}

.reColorPicker span
{
	width: 82px;
	height: 20px;
	line-height: 18px;
}

.reColorPicker .reColorPickerFooter .reDarkColor
{
	background: black;
	color: white;
	border-right:0;
}

.reColorPicker .reColorPickerFooter .reLightColor
{
	background: white;
	color: black;
	border-left:0;
}

.reColorPicker .reCustomColor:hover
{
    text-decoration: underline;
}
/* end of color picker */

/* insert symbol */
.reInsertSymbol td
{
    text-align: center;
    vertical-align: middle;
}
/* insert symbol */

/* insert table dropdown */
.reInsertTable
{
    padding: 1px !important; /* Reset CSS */
}

.reInsertTable table
{
    width: 120px;
    border: 0 !important;
    margin-left: 2px;
}

.reInsertTable table a span
{
    text-decoration: none;
}

.reInsertTable table td
{
   font-size: 1px;
}

.reInsertTable table td div
{
    height: 13px;
    width: 13px;
}

.reInsertTable .reTlbVertical
{
    border-width: 0 !important;
}

.reInsertTable .reTlbVertical ul
{
    padding: 0 !important; /* Reset CSS */
    margin: 0 !important; /* Reset CSS */
    list-style: none !important; /* Reset CSS */
    background-image: none !important; /* Reset CSS */
}

.reInsertTable div.reTlbVertical ul li a.reTool_text,
.reInsertTable div.reTlbVertical ul li a.reTool_text:hover
{
    background-image: url('Common/CommandSpritesLight.png');
    background-position: -3575 center;
    margin-top: 1px;  
    margin-left: 3px;  
}

.reInsertTable .reTlbVertical ul .reTool_text
{
    text-decoration: none;
    margin: 1px;
}

.reInsertTable .reTlbVertical ul .reTool_text:hover
{
    text-decoration: underline;
}

.reInsertTable .reTlbVertical ul .reTool_text span
{
    height: 18px !important;
    width: 18px !important;
    display: block;
    float: left;
    margin-top: 1px; 
}

.reInsertTable .reTlbVertical ul a.reTool_text span.reButton_text
{
    height: 18px;
    line-height: 18px;
    display: block;
    float: left;
    width: 100px !important;
    background-image: none;
    text-align: center;
}

.reInsertTable .reToolbar
{
    background-image: none !important;
}

.reInsertTable .reToolbar li
{
    clear: none !important;
    float: left !important;
    width: 24px;
}

.reInsertTable .reToolbar li .reTool
{
    width: 24px !important;
    height: 24px;
    margin: 0 !important;
}
/* end of insert table dropdown */

.reDropDownBody
{
    overflow-y: auto;
    overflow-x: hidden;
}

/* resize cell */
.reResizeCell div
{
    background-repeat: no-repeat;
    height: 17px;/*Helps align it with the statistics module*/
    width: 16px;
}

.reAccessibleTool
{
    background-image: url('Common/CommandSpritesLight.png');
    background-repeat: no-repeat;
    background-color: transparent !important;
    width: 22px;
    height: 22px;
    margin-top: 2px !important;
    margin: 1px;
    cursor:pointer !important;
    cursor:default !important;
}

/* editor commands begin */
.CustomDialog
{
	background-position: -1448px center;
}

.FormatCodeBlock
{
	background-position: -305px center;
}

.PageProperties
{
	background-position: -756px center;
}

.SetImageProperties
{
	background-position: -1116px center;
}

.BringToFront
{
	background-position: -1606px center;
}

.AlignmentSelector
{	
	background-position: -1647px center;
}

.Cancel
{
	background-position: -1265px center;
}

.Custom,
.ViewHtml
{
	background-position: -1296px center;
}

.DecreaseSize
{
	background-position: -1886px center;
}

.DeleteTable
{
	background-position: -1445px center;
}

.FileOpen
{
	background-position: -1967px center;
}

.IncreaseSize
{
	background-position: -2046px center;
}

.InsertAnchor
{
	background-position: -2086px center;
}

.InsertEmailLink
{
	background-position: -2246px center;
}

.InsertFormImageButton
{
	background-position: -2486px center;
}

.ModuleManager
{
	background-position: -2376px center;
}

.RepeatLastCommand
{
	background-position: -3248px center;
}

.SendToBack
{
	background-position: -3326px center;
}

.FormatStripper
{
	background-position: -2586px center;
}

.StyleBuilder
{
	background-position: -2946px center;
}

.ToggleFloatingToolbar
{
	background-position: -2974px center;
}

.XhtmlValidator
{
	background-position: -2526px center;
}

.TrackChangesDialog
{
	background-position: -2555px center;
}

.InsertSymbol
{
	background-position: -2196px center;
}

.InsertFormHidden
{
	background-position: -1836px center;
}

.InsertFormButton,
.InsertFormReset,
.InsertFormSubmit
{
	background-position: -1716px center;
}

.InsertFormCheckbox
{
	background-position: -1745px center;
}

.InsertFormPassword
{
	background-position: -1896px center;
}

.InsertFormRadio
{
	background-position: -1926px center;
}

.InsertFormSelect
{
	background-position: -3546px center;
}

.InsertFormTextarea
{
	background-position: -1986px center;
}

.InsertFormText
{
	background-position: -1956px center;
}

.StripAll
{
	background-position: -2585px center;
}

.StripCss
{
	background-position: -2644px center;
}

.StripFont
{
	background-position: -2675px center;
}

.StripSpan
{
	background-position: -2705px center;
}

.StripWord
{
	background-position: -2736px center;
}

.AjaxSpellCheck
{
	background-position: -66px center;
}

.Italic
{
	background-position: -486px center;
}

.ImageManager
{
	background-position: -366px center;
}

.ImageMapDialog
{
	background-position: -396px center;
}

.FlashManager,
.InsertFlash
{
	background-position: -246px center;
}

.MediaManager,
.InsertMedia
{
	background-position:  -696px center;
}

.DocumentManager,
.InsertDocument
{
	background-position: -185px center;
}

.TemplateManager
{
	background-position: -2765px center;
}

.InsertTable,
.TableWizard
{
	background-position: -3575px -5px;
}

.InsertRowAbove
{
	background-position: -1355px -7px;
}

.InsertRowBelow
{
	background-position: -1385px -4px;
}

.DeleteRow
{
	background-position: -3425px center;
}

.InsertColumnLeft
{
	background-position: -1626px center;
}

.InsertColumnRight
{
	background-position: -1592px center;
}

.DeleteColumn
{
	background-position: -3392px center;
}

.MergeColumns
{
	background-position: -2315px center;
}

.MergeRows
{
	background-position: -2345px center;
}

.SplitCell
{
	background-position: -3335px center;
}

.SplitCell
{
	background-position: -3335px center;
}

.SplitCellHorizontal
{
	background-position: -3606px center;
}

.DeleteCell
{
	background-position: -1325px center;
}

.SetCellProperties
{
	background-position: -2495px center;
}

.SetTableProperties
{
	background-position: -3365px center;
}

.Help
{
	background-position: -336px center;
}

.Undo
{
	background-position: -996px center;
}

.Redo
{
	background-position: -967px center;
}

.Cut
{
	background-position: -155px center;
}

.Copy
{
	background-position: -125px center;
}

.Paste,
.PasteStrip
{
	background-position: -785px center;
}

.PasteAsHtml
{
	background-position: -815px center;
}

.PasteHtml
{
	background-position: -3757px -6px;
}

.PasteFromWord
{
	background-position: -845px center;
}

.PasteFromWordNoFontsNoSizes
{
	background-position: -875px center;
}

.PastePlainText
{
	background-position: -905px center;
}

.Print
{
	background-position: -936px center;
}

.FindAndReplace
{
	background-position: -215px center;
}

.SelectAll
{
	background-position: -2435px center;
}

.InsertGroupbox
{
	background-position: -2015px -7px;
}

.InsertCodeSnippet,
.InsertSnippet
{
	background-position: -2164px center;
}

.InsertDate
{
	background-position: -1655px center;
}

.InsertTime
{
	background-position: -2256px center;
}

.AboutDialog
{
	background-position: -6px center;
}

.Bold
{
	background-position: -95px center;
}

.Underline
{
	background-position: -3275px center;
}

.StrikeThrough
{
	background-position: -3306px center;
}

.JustifyLeft
{
	background-position: -576px center;
}

.JustifyCenter
{
	background-position: -516px center;
}

.JustifyFull
{
	background-position: -546px center;
}

.JustifyNone
{
	background-position: -606px center;
}

.JustifyRight
{
	background-position: -636px center;
}

.InsertParagraph
{
	background-position: -454px center;
}

.InsertHorizontalRule
{
	background-position: -2045px center;
}

.Superscript
{
	background-position: -2796px center;
}

.Subscript
{
	background-position: -2826px center;
}

.ConvertToLower
{
	background-position: -1144px center;
}

.ConvertToUpper
{
	background-position: -1174px center;
}

.Indent
{
	background-position: -426px center;
}

.Outdent
{
	background-position: -726px center;
}

.InsertOrderedList
{
	background-position: -2076px center;
}

.InsertUnorderedList
{
	background-position: -2286px center;
}

.AbsolutePosition
{
	background-position: -36px center;
}

.Save,
.SaveAndClose,
.FileSave, 
.FileSaveAs,
.SaveLocal
{
    background-position: -1056px center;
}

.LinkManager,
.CreateLink,
.CustomLinkTool,
.SetLinkProperties
{
	background-position: -665px center;
}

.Unlink
{
	background-position: -2855px center;
}

.ToggleTableBorder
{
	background-position: -2885px center;
}

.ToggleScreenMode
{
	background-position: -2915px center;
}

.ForeColor
{
	background-position: -276px center;
}

.BackColor,
.borderColor,
.bgColor
{
	background-position: -1026px center;
}

.InsertFormElement
{
	background-position: -1774px center;
}

.InsertFormForm
{
	background-position: -1805px center;
}

.reTopCenter
{
    background-position: -3036px -6px;
}

.reMiddleLeft
{
    background-position: -3096px -6px;
}

.reMiddleCenter
{
    background-position: -1236px -6px;
}

.reMiddleRight
{
    background-position: -3155px -6px;
}

.reBottomCenter
{
    background-position: -3216px -6px;
}

.reNoAlignment
{
    background-position: -1266px -6px;
}

.reTopLeft
{
    background-position: -3006px -6px;
}

.reTopRight
{
    background-position: -3155px -6px;
}

.reBottomLeft
{
    background-position: -3186px -6px;
}

.reBottomRight
{
    background-position: -3245px -6px;
}

.SilverlightManager
{
    background-position: -3636px -6px;
}

.ExportToPdf
{
    background-position: -3666px -6px;
}

.InsertLink
{
    background-position: -3697px -6px;
}

.InsertImage
{
    background-position: -3727px -6px;
}

.InsertTableLight
{
    background-position: -3791px -5px;
}

/* alignment settings within the alignment dropdown */
.reAlignmentSelector .reTopRight
{
    background-position: -3062px -5px;
}

.reAlignmentSelector .reTopLeft
{
    background-position: -3004px -5px;
}

.reAlignmentSelector .reTopCenter
{
    background-position: -3033px -5px;
}

.reAlignmentSelector .reNoAlignment
{
    background-position: -1263px -5px;
}

.reAlignmentSelector .reMiddleLeft
{
    background-position: -3094px -5px;
}

.reAlignmentSelector .reMiddleCenter
{
    background-position: -1233px -5px;
}

.reAlignmentSelector .reMiddleRight
{
    background-position: -3151px -5px;
}

.reAlignmentSelector .reBottomCenter
{
    background-position: -3213px -5px;
}

.reAlignmentSelector .reBottomRight
{
    background-position: -3241px -5px;
}

.reAlignmentSelector .reBottomLeft
{
    background-position: -3184px -5px;
}
/* editor commands end */

/* apply css class dropdown */
.reApplyClass td
{
    vertical-align: middle;
    height: 22px;
    padding-left: 3px;
}


.reApplyClass .reClass_all
{
	background-position: 0 0;
}

.reApplyClass .reClass_img
{
	background-position: 0 -20px;
}

.reApplyClass .reClass_table
{
	background-position: 0 -40px;
}

.reApplyClass .reClass_ul
{
	background-position: 0 -60px;
}

.reApplyClass .reClass_ol
{
	background-position: 0 -80px;
}

.reApplyClass .reClass_p
{
	background-position: 0 -100px;
}

.reApplyClass .reClass_span
{
	background-position: 0 -120px;
}

.reApplyClass .reClass_a
{
	background-position: 0 -140px;
}

.reApplyClass .reClass_div
{
	background-position: 0 -160px;
}

.reApplyClass .reClass_h1
{
	background-position: 0 -180px;
}

.reApplyClass .reClass_h2
{
	background-position: 0 -200px;
}

.reApplyClass .reClass_h3
{
	background-position: 0 -220px;
}

.reApplyClass .reClass_h4
{
	background-position: 0 -240px;
}

.reApplyClass .reClass_h5
{
	background-position: 0 -260px;
}

.reApplyClass .reClass_h6
{
	background-position: 0 -280px;
}

.reApplyClass .reClass_td
{
	background-position: 0 -300px;
}
/* end of apply css class dropdown */

td.reTlbVertical
{
    vertical-align: top;
}

.reToolCell .reTool_text span
{
    text-indent: -9999px;    
}

.reToolCell .reTool_text.reSplitButton
{    
    width: auto;
}

.reToolCell .reTool_text.reSplitButton .reButton_text
{
    text-indent: 0;
}

.reTlbVertical li
{
    vertical-align: top;
}

.reTool_text span.reButton_text
{
    text-indent: 0;
}

/* this sets the correct background image to the selected items in the toolstrips */
.reTlbVertical .reTool_text.reTool_selected
{
    background-position: -602px 0 !important;
    border-color: transparent !important; 
}

.reTableWizardSelectAllBtn
{
	
}

/*Light dialogs CSS */
.reInsertImageWrapper, .reInsertLinkWrapper, .reInsertTableLightWrapper
{
    padding: 20px 0 0 0;
    font: 12px "segoe ui" ,arial,sans-serif;
}

.reControlsLayout
{
    width: 100%;
    height: 100%;
}
.reInsertLinkWrapper .reControlsLayout td
{
    padding: 3px 0 3px 3px;
}
.reInsertLinkWrapper .reControlsLayout td, .reInsertImageWrapper .reControlsLayout td, .reInsertTableLightWrapper .reControlsLayout td, .reControlsLayout .reImgPropertyControlCell td, .reImgPropertyControlCell span, .reImgPropertyControlCell input
{
    vertical-align: middle;
}
.reInsertImageWrapper .reControlsLayout td
{
    padding: 3px 0;
}
.reDialogLabelLight span
{
    width: 80px;
    display: block;
    text-overflow: ellipsis;
}
.reDialogLabelLight span, .reImgPropertyControlCell span, .reImgPropertyControlCell input
{
    text-align: right;
}
.reConfirmCancelButtonsTblLight button
{
    width: 75px;
}
.reConfirmCancelButtonsTblLight .reAllPropertiesLight button
{
    width: 126px;
}
.reControlsLayout
{
    width: 100%;
    height: 100%;
}
.reControlsLayout .reControlCellLight input
{
    width: 215px;
}
.reControlsLayout .reControlCellLight select
{
    width: 220px;
}
.reControlsLayout .reConfirmCancelButtonsTblLight
{
    height: auto;
    margin: 12px 0;
    text-align: center;
    width: 100%;
}
.reControlsLayout .reImgPropertyControlCell td, .reControlsLayout .reTablePropertyControlCell td
{
    padding: 3px 3px 3px 4px;
}
.reImgPropertyControlCell span, .reImgPropertyControlCell input, .reTablePropertyControlCell input
{
    width: 40px;
}
.reImgPropertyControlCell table
{
    width: 100%;
    height: 100%;
}
.reControlsLayout td.reImgPropertyControlCell
{
    padding: 0 22px 0 38px;
}
.reInsertImageWrapper .reControlsLayout .reControlCellLight input
{
    width: 190px;
}
.reTablePropertyControlCell .short
{
    width: 80px;
}
.reTablePropertyControlCell .lightTable
{
    margin: -10px 4px 0 4px;
}
* + html .reTablePropertyControlCell .lightTable
{
    margin-top: -3px;
}
*html .reTablePropertyControlCell .lightTable
{
    margin-top: -3px;
}

/* editor content area as div */
.RadEditor .reContentArea
{
	position:relative;
	overflow:auto;
	height: 100%;
	margin: 0px;
	padding:3px;
}

.RadEditor .reContentArea .RadEWrongWord
{
	background-color: yellow;
}
.RadEditor .reContentArea .RadEDomMouseOver
{
	background-color:#ffffcc;
}

.RadEditor .reContentArea body
{
	padding:3px;
	background-image: none;
	margin: 0px;
	text-align: left;
	word-wrap: break-word;
}
.RadEditor .reContentArea form
{
	background-color:#efefef;
	border:1px dashed #555555;
}
.RadEditor .reContentAreaToggle table
{
	BORDER-RIGHT: #999999 1px dashed;
	BORDER-BOTTOM: #999999 1px dashed;
}
.RadEditor .reContentAreaToggle table td
{
	PADDING: 1px;
	BORDER-TOP: #999999 1px dashed;
	BORDER-LEFT: #999999 1px dashed;
}
.RadEditor .reContentAreaToggle table th
{
	PADDING: 1px;
	BORDER-TOP: #000000 1px dashed;
	BORDER-LEFT: #000000 1px dashed;
}
/*===============================================================================================*/
/* RadEditor for ASP.NET AJAX Vista Skin */

.RadEditor
{
    /* background-color: #c2dcf0;  */
    background-color: #ffffff;
    -o-border-radius: 6px;
	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
	border-radius: 6px;
    /* top / right / bottom / left */
	padding: 1px 2px 1px 2px;
}

/* reWrapper */
.reWrapper
{
    border: solid 1px #9cb6c5;
}

.reContentCell
{
    border: solid 1px #9db6c5;
}

/* common settings for .reModule, .reEditorModes and .reWrapper */
.reColorPicker,
.reInsertTable,
.reDropDownBody,
.reCustomLinks a:hover
{
	border: solid 1px #979797;
}

.RadEditor_SNS .reDropDownBody table
{
    background: transparent;
}

.RadEditor_SNS  .reModule,
.RadEditor_SNS  .reEditorModes,
.RadEditor_SNS  .reWrapper
{
	background-color: #c2dcf0;
}

/*NEW: Only in the Bottom zone - where the Statistics module is commonly set, remove uppper border, because it looks ugly*/
.RadEditor_SNS  .reBottomZone .reModule
{
    border-top: 0;
}


.RadEditor_SNS  .reModule
{
    border-top: solid 1px #9cb6c5;  
}

.reCustomLinks a
{
    border: solid 1px #fff; /* should be the same as the background of the dropdown */
    color: black !important;
}

.reCustomLinks a:hover
{
    background-image: url('Editor/ToolbarSprites.gif');
    background-position: 0 -325px;
    background-repeat: repeat-x;
    border: solid 1px #a6d9f4;
}
/* end of module */
.reToolbar li
{
    background-image: url('Editor/ToolbarSprites.gif');
    background-position: 0 -26px;
    color: #000;
}

.RadEditor_SNS  .reSpinBox a
{
    background-image: url('Editor/ToolbarSprites.gif');
    -moz-user-select: none;
    outline: none;
}

/* separator */
.reToolbar.RadEditor_SNS  .reSeparator
{
    background-position: center -148px;
    background-image: url('Editor/ToolbarSprites.gif');
}

/* common settings for left and right grip */
.reToolbar.RadEditor_SNS  .reGrip
{
	background-image: url('Editor/ToolbarSprites.gif');
}

/* reTool */
.reTool span
{
    background-image: url('Common/CommandSpritesLight.png');
}

/* IE6 does not support PNG alpha channel, so we use gifs for the command sprites instead */
* html .reTool span,
* html .reTool_text span,
* html .reTlbVertical .reTool_text span,
* html .reToolbar .reSplitButton.reTool_text span
{
    _background-image: url('Common/CommandSpritesLightIE6.gif');
}

.reDialog .reTool,
.reModule .reTool
{
    background-image: url('Editor/ToolbarSprites.gif');
    background-position: 0 -242px;
}

.reDialog .reTool:hover,
.reToolbar .reTool:hover,
.reModule .reTool:hover
{
    background-image: url('Editor/ToolbarSprites.gif');
    background-position: 0 -52px;
}

.reToolbar .reTool.reTool_selected,
.reToolbar .reTool.reTool_selected:hover
{
    background-image: url('Editor/ToolbarSprites.gif');
    background-position: 0 -124px;
    background-repeat: no-repeat;
}

/* .reTool_text */
.reToolbar .reTool_text span
{
    background-image: url('Common/CommandSpritesLight.png');
}

.reToolbar .reTool_text:hover
{
    background-image: url('Editor/ToolbarSprites.gif');
    background-repeat: repeat-x;
    background-position: 0 -100px;
    margin-left: 0;
    margin-right: 0;
    border-left: solid 1px #3c7fb1;
    border-right: solid 1px #3c7fb1;
}

.reToolbar .reTool_text.reTool_selected,
.reToolbar .reTool_text.reTool_selected:hover
{
    background-image: url('Editor/ToolbarSprites.gif');
    background-repeat: repeat-x;
    background-position: 0 -174px;
    margin-left: 0;
    margin-right: 0;
    border-left: solid 1px #3c7fb1;
    border-right: solid 1px #3c7fb1;
}

/* these settings will not be included in the common CSS file of RadEditor */
.reToolbar .reTool_text.reTool_disabled,
.reToolbar .reTool_text.reTool_disabled:hover
{
    margin-left: 0;
    margin-right: 0;
    border: 0;
}
/* end of reTool_text */

.reTool.reSplitButton:hover
{
    background: url('Editor/ToolbarSprites.gif') no-repeat 0 -76px;
}

/* add weight to the selector for IE6 so it is applied */
* html .reToolbar .reTool.reSplitButton:hover
{
    background: url('Editor/ToolbarSprites.gif') no-repeat 0 -76px;
}

.RadEditor_SNS  .reTool .split_arrow
{
    background-image: url('Editor/ToolbarSprites.gif');
    background-position: -28px -362px;
}

.RadEditor_SNS  .reSplitButton.reTool_text .split_arrow
{
    background-image: url('Editor/ToolbarSprites.gif');
    background-position: -28px -362px;
}

/* add weight to the selector for IE6 so it is applied */
* html .RadEditor_SNS  .reToolbar .reTool_text .split_arrow
{
    background-image: url('Editor/ToolbarSprites.gif');
    background-position: -28px -362px;
}

/* add weight to the selector for IE6 so it is applied */
* html .reToolbar .reTool_text:hover
{
    background: url('Editor/ToolbarSprites.gif');
    background-position: 0 -100px;
}

.reDialog .reTool.reSplitButton,
.reModule .reTool.reSplitButton
{
    background-image: url('Editor/ToolbarSprites.gif');
    background-position: 0 -218px;
}

.reDialog .reTool.reSplitButton:hover,
.reModule .reTool.reSplitButton:hover
{
    background-position: 0 -76px;
}

/* add weight to the selector for IE6 so it is applied */
* html .reToolbar .reTool.reSplitButton.reTool_disabled:hover
{
    background: none;
}
/* end of reSplitButton */

/* reDropdown */
.reDropdown:link,
.reDropdown:visited
{
    color: black !important;
}

.reDropdown,
.reTool_disabled.reDropdown:hover
{
    border-top: solid 1px #abadb3;
    border-right: solid 1px #dbdfe6;
    border-bottom: solid 1px #e3e9ef;
    border-left: solid 1px #e2e3ea;
    background-color: #fff;
    background-image: url('Editor/ToolbarSprites.gif') !important;
    background-position: right -360px !important;
}

.reDropdown:hover
{
    border: solid 1px #3c7fb1;
    background-image: url('Editor/ToolbarVerticalSprites.gif') !important;
    background-position: right 0 !important;
}

/* add weight to the selector for IE6 so it is applied */
* html .reTool_disabled.reDropdown
{
    background-image: url('Editor/ToolbarSprites.gif')t;
    background-position: right -380px;
    background-repeat: no-repeat;
}
/* end of reDropdown */

/* vertical toolbar */
.RadEditor.RadEditor_SNS  .reTlbVertical li
{
    background-image: url('Editor/ToolbarVerticalSprites.gif');
    background-repeat: repeat-y;
    background-position: -26px 0;
}

.RadEditor.RadEditor_SNS  .reTlbVertical .reToolbar.Default .reGrip
{
    background-image: url('Editor/ToolbarVerticalSprites.gif');
}

.RadEditor.RadEditor_SNS  .reTlbVertical .reToolbar.RadEditor_SNS  .grip_first
{
    background-position: 0 0;
}

.RadEditor.RadEditor_SNS  .reTlbVertical .reToolbar.RadEditor_SNS  .grip_last
{
    background-position: 0 -4px;
}

.RadEditor.RadEditor_SNS  .reTlbVertical .reToolbar.RadEditor_SNS  .reSeparator
{
    background-image: url('Editor/ToolbarVerticalSprites.gif');
    background-position: -99px -12px;
}

.reTlbVertical .reTool:hover,
.reTlbVertical .reTool_text.reSplitButton:hover,
.reTlbVertical .reTool_text:hover
{
    background-image: url('Editor/ToolbarVerticalSprites.gif');
    background-position: -76px 0;
}

/* add weight to the selector for IE6 so it is applied */
* html .reTlbVertical .reTool_text:hover
{
	background-image: url('Editor/ToolbarVerticalSprites.gif');
    background-repeat: no-repeat;
    background-position: -76px 0;
}

.reTlbVertical .reTool.reTool_selected,
.reTlbVertical .reTool_text.reTool_selected,
.reTlbVertical .reTool_text.reTool_selected:hover
{
    background-image: url('Editor/ToolbarVerticalSprites.gif');
    background-position: -52px 0;
}

/* add weight to the selector for IE6 so it is applied */
* html .reTlbVertical .reSplitButton:hover
{
    background-image: url('Editor/ToolbarVerticalSprites.gif');
    background-position: -76px 0;
    background-repeat: no-repeat;
}
/* end of vertical toolbar */

.reDropDownBody .reTlbVertical ul li a:hover
{
    background-image: url('Editor/ToolbarVerticalSprites.gif');
    background-position: -602px 0;
}

/* InsertTable itself is a kind of tool strip, so it must be styled as a toolstrip */
.reInsertTable
{
    background-color: #f0f0f0;
}

.reDropDownBody .reTlbVertical .reToolbar
{
    background-image: url('Editor/ToolbarVerticalSprites.gif');
    background-color: #f0f0f0;
    background-position: -125px 0;
}
/* end of context menu and toolstrip */

/* spinbox */
.RadEditor_SNS  table.reSpinBox
{
	border-top: solid 1px #abadb3;
	border-right: solid 1px #dbdfe6;
	border-bottom: solid 1px #e3e9ef;
	border-left: solid 1px #e2e3ea;
	background: white;
}

.RadEditor_SNS  table.reSpinBox:hover
{
    border-top: solid 1px #5794bf;
	border-right: solid 1px #b7d5ea;
	border-bottom: solid 1px #c7e2f1;
	border-left: solid 1px #b7d5ea;
}

.RadEditor_SNS  .reSpinBoxIncrease
{
	background-position: 0 -198px;
}

.RadEditor_SNS  .reSpinBoxIncrease:hover
{
	background-position: 0 -208px;
}

.RadEditor_SNS  .reSpinBoxDecrease
{
	background-position: -11px -198px;
}

.RadEditor_SNS  .reSpinBoxDecrease:hover
{
	background-position: -11px -208px;
}
/* end of spinbox */

/* editor input elements */
.RadEditor_SNS .RadEditor input
{
	border-top: solid 1px #abadb3;
	border-right: solid 1px #dbdfe6;
	border-bottom: solid 1px #e3e9ef;
	border-left: solid 1px #e2e3ea;
	background-color: white;
}

.RadEditor input:hover
{
    border-top: solid 1px #5794bf;
	border-right: solid 1px #b7d5ea;
	border-bottom: solid 1px #c7e2f1;
	border-left: solid 1px #b7d5ea;
}
/* editor input elements */

/* editing modes */
.RadEditor_SNS  .reMode_selected
{
    background-image: url('Editor/ToolbarVerticalSprites.gif');
    background-position: -948px 0;
}

.RadEditor_SNS  .reEditorModes .reMode_design span,
.RadEditor_SNS  .reEditorModes .reMode_selected.reMode_design span
{
	background-position: -6px -5px;
}

.RadEditor_SNS  .reEditorModes .reMode_html span,
.RadEditor_SNS  .reEditorModes .reMode_selected.reMode_html span
{
	background-position: -6px -36px;
}

.RadEditor_SNS  .reEditorModes .reMode_preview span,
.RadEditor_SNS  .reEditorModes .reMode_selected.reMode_preview span
{
	background-position: -6px -69px;
}
/* end of editing modes */

/* DOM inspector */
.RadEditor_SNS  .reModule_domlink_selected,
.RadEditor_SNS  .reModule_domlink
{
    color: black;
}
/* end of DOM inspector */

.reDropDownBody .reItemOver
{
	background: #86c7e9;
	color: #000;
}
/* end of expanded dropdowns */

* html .reTool_selected.reTool
{
    border-left-width: 0 !important;
    border-right-width: 0 !important;
}

/* color picker */
.reColorPicker table div
{
	border: solid 1px #c5c5c5;
}

.reColorPicker table td.reItemOver div
{
	border-color: #000;
}

.reColorPicker span
{
	border: solid 1px #c5c5c5;
}
/* end of color picker */

/* ajax spellchecker */
.reAjaxspell_button
{
    border: solid 1px #3c7fb1;
    background: #c2dcf0;
    color: #3c7fb1;
}

.RadEditor_SNS  .reAjaxSpellCheckSuggestions table
{
    border-width: 0;
    width: 100%;
}

.RadEditor_SNS  .reAjaxSpellCheckSeparator
{
    background-color: #979797;
}
/* ajax spellchecker */

/* custom links */
.RadEditor_SNS .reCustomLinks,
.RadEditor_SNS .reCustomLinks ul
{
	color: #000;
}

.RadEditor_SNS .reCustomLinks a,
.RadEditor_SNS .reCustomLinks a:link,
.RadEditor_SNS .reCustomLinks a:visited
{
    background: none transparent;
    color: #000 !important;
	cursor: default !important;
}
/* end of custom links */

/* insert table dropdown */
.reInsertTable table
{
    background: #f0f0f0;
}

.reInsertTable table td
{
    border: solid 1px #9cb6c5;
    background: white;
}

.reInsertTable .reTlbVertical ul
{
    background-color: #f0f0f0;
}

.RadEditor_SNS .reDropDownBody.reInsertTable div.reTlbVertical a.reTool_text,
.RadEditor_SNS .reDropDownBody.reInsertTable div.reTlbVertical a.reTool_text:link
.RadEditor_SNS .reDropDownBody.reInsertTable div.reTlbVertical a.reTool_text:visited
{
    color: black !important;
    background: transparent none;
    _background: none !important;
}

.RadEditor_SNS .reDropDownBody.reInsertTable div.reTlbVertical a.reTool_text:hover
{
    background: url('Editor/ToolbarVerticalSprites.gif');
    background-position: -1403px 0;
}

.reInsertTable .reTlbVertical ul .reTool_text span
{
    background-image: url('Common/CommandSpritesLight.png');
    background-position: -3575 center;
}

.reInsertTable .reToolbar li .reTool:hover
{
    background-image: url('Editor/ToolbarSprites.gif');
    background-position: 0 -52px;
}
/* end of insert table dropdown */

/* modules selector */
.reModule_visible_icon,
.reModule_hidden_icon
{
	display: block;
	float: left;
	height: 18px;
	width: 18px;
	background-image: url('Common/CommonIcons.gif');
	background-repeat: no-repeat;
}

.reModule_visible_icon
{
	background-position: -8px -199px;
}

.reModule_hidden_icon
{
	background-position: -8px -103px;
	
}
/* end of modules selector */

/* resize cell */
.reResizeCell div
{
    background-image: url('Editor/ToolbarSprites.gif');
    background-position: center -301px;
}

/* reTool_disabled */
.reDialog .reTool_disabled,
.reDialog .reTool_disabled:hover,
.reToolbar .reTool_disabled,
.reToolbar .reTool_disabled:hover,
.reModule .reTool_disabled,
.reModule .reTool_disabled:hover
{
    filter: alpha(opacity=40);
    opacity: .4;
    -moz-opacity: .4;
    background-image: none;
}
/* reTool_disabled */

/* the rule below styles RadWindow's content cell, which is used in the floating and show on focus toolbar modes */
.RadWindow_SNS.reToolbarWindow td.rwWindowContent
{
    background-color: #c2dcf0;
}


/*Telerik RadGrid Default Skin*/

/*global*/

.RadGrid_SNS
{
    border: 1px solid #cdcbcb;
    border-radius: 6px;
	-moz-border-radius: 6px;
    -o-border-radius: 6px;
	-webkit-border-radius: 6px; 
    /* box-shadow: inset 0px 2px 5px 0px #eae9e9; */
    color: #4E3328;
    outline: none;
    /*
    background-color: White;
    */
    /* Blue background is so the top-right corner isn't white when there
        is a scrollbar. All other contents have their own colors, and only 
        that top coner gets the color of the body background. */
 	background-color: white;
}

.RadGrid_SNS,
.RadGrid_SNS .rgMasterTable,
.RadGrid_SNS .rgDetailTable,
.RadGrid_SNS .rgGroupPanel table,
.RadGrid_SNS .rgCommandRow table,
.RadGrid_SNS .rgEditForm table,
.RadGrid_SNS .rgPager table,
.GridToolTip_SNS
{
    font: 11px Verdana, Arial, Helvetica, sans-serif;
    background-color: White;
}

.RadGrid_SNS .rgHeader:first-child,
.RadGrid_SNS th.rgResizeCol:first-child,
.RadGrid_SNS .rgFilterRow>td:first-child,
.RadGrid_SNS .rgRow>td:first-child,
.RadGrid_SNS .rgAltRow>td:first-child
{
	border-left-width: 0;
	padding-left: 8px;
}

.RadGrid_SNS .rgAdd,
.RadGrid_SNS .rgRefresh,
.RadGrid_SNS .rgEdit,
.RadGrid_SNS .rgDel,
.RadGrid_SNS .rgFilter,
.RadGrid_SNS .rgPagePrev,
.RadGrid_SNS .rgPageNext,
.RadGrid_SNS .rgPageFirst,
.RadGrid_SNS .rgPageLast,
.RadGrid_SNS .rgExpand,
.RadGrid_SNS .rgCollapse,
.RadGrid_SNS .rgSortAsc,
.RadGrid_SNS .rgSortDesc,
.RadGrid_SNS .rgUpdate,
.RadGrid_SNS .rgCancel,
.RadGrid_SNS .rgUngroup,
.RadGrid_SNS .rgExpXLS,
.RadGrid_SNS .rgExpDOC,
.RadGrid_SNS .rgExpPDF,
.RadGrid_SNS .rgExpCSV
{
	background-image:url('Grid/sprite.gif');
}

/*header*/

.RadGrid_SNS .rgHeaderDiv
{
	/* box-shadow:inset 0px 2px 5px 0px #eae9e9; */
 	background-color: white;
    /* Controls top left/right rounding */
    /* top-left / top-right / bottom-right / bottom-left */
    border-radius: 6px 6px 0px 0px;
	-moz-border-radius: 6px 6px 0px 0px;
    -o-border-raidus: 6px 6px 0px 0px;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -webkit-border-bottom-right-radius: 0px;
    -webkit-border-bottom-left-radius: 0px;
}

.RadGrid_SNS .rgHeader,
.RadGrid_SNS th.rgResizeCol
{
    /* Header cell background */
	/* border: 0; */
	border-left: 1px solid #ffffff;
    border-right: 1px solid #ffffff;
    height: 25px;
 	background-color: white;
}

.RadGrid_SNS th.rgSorted
{
	background-color: #fffaeb;
}

.RadGrid_SNS .rgHeader,
.RadGrid_SNS .rgHeader a
{
    /* Header Text */
    color: #454546;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 400;
}

.RadGrid_SNS th.rgSorted,
.RadGrid_SNS th.rgSorted a
{
    color: #892500;
}

/*rows*/

.RadGrid_SNS .rgDataDiv
{
    /* So that odd number rows are white. Ordinarily they would take */
    /* on the color of .GradGrid_SNS itself, but since we have to make */
    /* that blue to avoid a white "box" above verticale scrollbar, we */
    /* have to do this to make sure our main row color is right. */
    /* Per 2013 Pair Design - off-white with texture now */    
	background-color: #FFFFFF;
    background-image: none;
    /* top-left / top-right / bottom-right / bottom-left */
    border-radius: 0px 0px 6px 6px;
	-moz-border-radius: 0px 0px 6px 6px;
    -o-border-raidus: 0px 0px 6px 6px;
    -webkit-border-top-left-radius: 0px;
    -webkit-border-top-right-radius: 0px;
    -webkit-border-bottom-right-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
	/* max-height: 250px !important; */
}

.RadGrid_SNS .rgRow td,
.RadGrid_SNS .rgAltRow td,
.RadGrid_SNS .rgEditRow td,
.RadGrid_SNS .rgFooter td
{
	border-left-width: 1px;
}

.RadGrid_SNS .rgRow
{
    /* Color of odd-numbered rows */
	/* Per 2013 Pair Design - off-white with texture now */
    background-color: #F9F9FA;
    background-image: none;
    height: 36px;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 500;
}

.RadGrid_SNS .rgRow td
{
	/* border-color: #fff #c3c3c3; */
    border-bottom: 1px solid #DEDEDE;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 500;
}

.RadGrid_SNS .rgAltRow
{
    /* Color of even-numbered rows */
	/* Per 2013 Pair Design - off-white with texture now */
	/* background-color: #ededed; */
    background-color: #FFFFFF;
    background-image: none;
    height: 36px;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 500;
}

.RadGrid_SNS .rgAltRow td
{
	/* border-color: #ededed #c3c3c3; */
    border-bottom: 1px solid #DEDEDE;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 500;
}

.RadGrid_SNS .rgRow:last-child td,
.RadGrid_SNS .rgAltRow:last-child td
{
    border-bottom: none;
}

.RadGrid_SNS .rgRow .rgSorted
{
	border-bottom-color:#fffaeb;
	background-color:#fffaeb;
}

.RadGrid_SNS .rgAltRow .rgSorted
{
	border-bottom-color:#f1ecdd;
	background-color:#f1ecdd;
}

.RadGrid_SNS .rgSelectedRow .rgSorted,
.RadGrid_SNS .rgActiveRow .rgSorted,
.RadGrid_SNS .rgHoveredRow .rgSorted,
.RadGrid_SNS .rgEditRow .rgSorted
{
	background-color: transparent;
}

.RadGrid_SNS .rgRow a,
.RadGrid_SNS .rgAltRow a,
.RadGrid_SNS tr.rgEditRow a,
.RadGrid_SNS .rgFooter a,
.RadGrid_SNS .rgEditForm a
{
	color: #431eb7;
	text-decoration: none;
	transition: color .15s ease, transform .12s ease;
}

.RadGrid_SNS .rgRow a:hover,
.RadGrid_SNS .rgAltRow a:hover,
.RadGrid_SNS tr.rgEditRow a:hover,
.RadGrid_SNS .rgFooter a:hover,
.RadGrid_SNS .rgEditForm a:hover
{
	color: #2f1496;
	text-decoration: underline;
	transform: translateY(-1px);
}

.RadGrid_SNS .rgSelectedRow
{
    /* Selected row color and background color. */
    background:#E8ED87;
    color:#09090B;
	font-weight: 500;
}

/* Selected Row BG Color (possible for MSIE older versions? */
*+html .RadGrid_SNS .rgSelectedRow .rgSorted{background-color:#FEEECC}
* html .RadGrid_SNS .rgSelectedRow .rgSorted{background-color:#FEEECC}

.RadGrid_SNS .rgSelectedRow a,
.RadGrid_SNS .rgHoveredRow a,
.RadGrid_SNS .rgActiveRow a
{
	color:#892500;
}

.RadGrid_SNS .rgActiveRow,
.RadGrid_SNS .rgHoveredRow
{
    background:#ffe79c 0 -2900px repeat-x url('Grid/sprite.gif');
    color:#892500;
}
*+html .RadGrid_SNS .rgActiveRow .rgSorted,
*+html .RadGrid_SNS .rgHoveredRow .rgSorted{background-color:#ffe79c}
* html .RadGrid_SNS .rgActiveRow .rgSorted,
* html .RadGrid_SNS .rgHoveredRow .rgSorted{background-color:#ffe79c}

.RadGrid_SNS .rgEditRow
{
	background:#fff 0 -4900px repeat-x url('Grid/sprite.gif');
}
*+html .RadGrid_SNS .rgEditRow .rgSorted{background-color:#fff}
* html .RadGrid_SNS .rgEditRow .rgSorted{background-color:#fff}

.RadGrid_SNS .rgSelectedRow td,
.RadGrid_SNS .rgSelectedRow td.rgSorted
{
    /* Selected row border color. */
	/* border-color:#ca4b0c #EEAB1F; */
    /*
    border-top: 1px solid #EEAB1F;
    border-bottom: 1px solid #EEAB1F;
    */
    /* border-color: #EEAB1F; */
}

.RadGrid_SNS .rgActiveRow td,
.RadGrid_SNS .rgActiveRow td.rgSorted,
.RadGrid_SNS .rgHoveredRow td,
.RadGrid_SNS .rgHoveredRow td.rgSorted
{
	border-color:#c98400 #ffe79c;
}

.RadGrid_SNS .rgEditRow td,
.RadGrid_SNS .rgEditRow td.rgSorted
{
	border-color:#616161 #c3c3c3;
}

/*footer*/

.RadGrid_SNS .rgFooterDiv,
.RadGrid_SNS .rgFooter
{
	background:white;
}

.RadGrid_SNS .rgFooter td
{
	border-top:1px solid;
	border-color:#999 #c3c3c3;
}

/*status*/

.RadGrid_SNS .rgPager .rgStatus
{
	border:1px solid;
	border-color:#999 #999 #e4e4e4 #e4e4e4;
	border-left:0;
}

.RadGrid_SNS .rgStatus div
{
	background-image:url('Common/loading_small.gif');
}

/*pager*/

.RadGrid_SNS .rgPager
{
	background:#e4e4e4;
}

.RadGrid_SNS td.rgPagerCell
{
	border:1px solid;
	border-color:#999 #e4e4e4 #e4e4e4;
	border-right:0;
}

.RadGrid_SNS .rgInfoPart
{
	color:#000000;
}

.RadGrid_SNS .rgInfoPart strong
{
	color:#4c4e54;
}

.RadGrid_SNS .rgPageFirst
{
	background-position:0 -550px;
}
.RadGrid_SNS .rgPageFirst:hover
{
	background-position:0 -600px;
}
.RadGrid_SNS .rgPagePrev
{
	background-position:0 -700px;
}
.RadGrid_SNS .rgPagePrev:hover
{
	background-position:0 -750px;
}
.RadGrid_SNS .rgPageNext
{
	background-position:0 -850px;
}
.RadGrid_SNS .rgPageNext:hover
{
	background-position:0 -900px;
}
.RadGrid_SNS .rgPageLast
{
	background-position:0 -1000px;
}
.RadGrid_SNS .rgPageLast:hover
{
	background-position:0 -1050px;
}

.RadGrid_SNS .rgPager .rgPagerButton
{
	border-color:#7e7e7e;
	background:#c6c6c6;
	color:#000;
	font:12px/12px "segoe ui",arial,sans-serif;
}

.RadGrid_SNS .rgNumPart a
{
	border: 1px solid #e4e4e4;
	line-height: 20px;
	color: #000;
}

.RadGrid_SNS .rgNumPart a:hover
{
	border-color: #c98400;
	background: #ffe79c;
	color: #892500;
}

.RadGrid_SNS .rgNumPart a.rgCurrentPage,
.RadGrid_SNS .rgNumPart a.rgCurrentPage:hover
{
	border-color: #ca4b0c;
	background: transparent;
	color: #892500;
}

/*sorting, reordering*/

.RadGrid_SNS .rgHeader .rgSortAsc
{
	background-position: 3px -248px;
	height: 10px;
}

.RadGrid_SNS .rgHeader .rgSortDesc
{
	background-position: 3px -198px;
	height: 10px;
}

.GridReorderTop_SNS,
.GridReorderBottom_SNS
{
	background: 0 0 no-repeat url('Grid/sprite.gif');
}

.GridReorderBottom_SNS
{
	background-position: 0 -50px;
}

/*filtering*/

.RadGrid_SNS .rgFilterRow
{
	background: #e4e4e4;
}

.RadGrid_SNS .rgFilterRow td
{
    border-bottom: 1px solid #999;
    border-left: 1px solid #e4e4e4;
}

.RadGrid_SNS .rgFilter
{
	background-position: 0 -300px;
}

.RadGrid_SNS .rgFilter:hover
{
	background-position: 0 -350px;
}

.RadGrid_SNS .rgFilterActive,
.RadGrid_SNS .rgFilterActive:hover
{
	background-position: 0 -400px;
}

.RadGrid_SNS .rgFilterBox
{
	border-color: #616161;
	font: 12px "segoe ui",arial,sans-serif;
	color: #000;
}

/*filter context menu*/

.RadMenu_SNS .rgHCMClear,
.RadMenu_SNS .rgHCMFilter
{
	border-color: #7e7e7e;
	background: #c6c6c6;
	color: #000;
	font-family: "segoe ui",arial,sans-serif;
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
}

.RadMenu_SNS .rgHCMClear:hover,
.RadMenu_SNS .rgHCMFilter:hover
{
	border-color: #c98400;
	background-color: #ffe79c;
	color: #882501;
}

/*grouping*/

.RadGrid_SNS .rgGroupPanel
{
	border: 0;
	border-bottom: 1px solid #7c7c7c;
	background: #c6c6c6;
}

.RadGrid_SNS .rgGroupPanel td
{
	border: 0;
	padding: 3px 4px;
}

.RadGrid_SNS .rgGroupPanel td td
{
	padding:0;
}

.RadGrid_SNS .rgGroupPanel .rgSortAsc
{
	background-position: 4px -144px;
}

.RadGrid_SNS .rgGroupPanel .rgSortDesc
{
	background-position: 4px -94px;
}

.RadGrid_SNS .rgUngroup
{
	background-position: 0 -6999px;
}

.RadGrid_SNS .rgGroupItem
{
	border: 1px solid #7e7e7e;
	background: #c6c6c6;
}

.RadGrid_SNS .rgMasterTable td.rgGroupCol,
.RadGrid_SNS .rgMasterTable td.rgExpandCol
{
	border-color: #c9c9c9;
	background: #c9c9c9 none;
}

.RadGrid_SNS .rgGroupHeader
{
    background: #c9c9c9;
    font-size: 1.1em;
    line-height: 22px;
	color: #000;
}

.RadGrid_SNS .rgGroupHeader td
{
	padding-left: 8px;
	padding-bottom: 2px;
}

.RadGrid_SNS .rgExpand
{
	background-position:5px -496px;
}

.RadGrid_SNS .rgCollapse
{
	background-position:3px -444px;
}

/*editing*/

.RadGrid_SNS .rgEditForm
{
	border-bottom:1px solid #999;
}

.RadGrid_SNS .rgUpdate
{
	background-position:0 -1800px;
}

.RadGrid_SNS .rgCancel
{
	background-position:0 -1850px;
}

/*hierarchy*/

.RadGrid_SNS .rgDetailTable
{
	border-color:#999;
}

/*command row*/

.RadGrid_SNS .rgCommandRow
{
	background:#c6c6c6;
	color:#000;
}

.RadGrid_SNS .rgCommandCell
{
	border:0;
	border-bottom:1px solid #7c7c7c;
	padding:0;
}

.RadGrid_SNS tfoot .rgCommandCell
{
	border-top: 1px solid #7c7c7c;
	border-bottom: 0;
}

.RadGrid_SNS .rgCommandTable td
{
	border: 0;
	padding: 3px 7px 4px;
}

.RadGrid_SNS .rgCommandTable
{
	border:0;
}

.RadGrid_SNS .rgCommandRow a
{
	color:#000;
	text-decoration:none;
}

.RadGrid_SNS .rgAdd
{
	margin-right:3px;
	background-position:0 -1650px;
}

.RadGrid_SNS .rgRefresh
{
	margin-right:3px;
	background-position:0 -1600px;
}

.RadGrid_SNS .rgEdit
{
	background-position:0 -1700px;
}

.RadGrid_SNS .rgDel
{
	background-position:0 -1750px;
}

.RadGrid_SNS .rgExpXLS,
.RadGrid_SNS .rgExpDOC,
.RadGrid_SNS .rgExpPDF,
.RadGrid_SNS .rgExpCSV
{
	background-image:url('../Common/Grid/export.gif');
}

.RadGrid_SNS .rgExpXLS
{
	background-position:0 0;
}
.RadGrid_SNS .rgExpDOC
{
	background-position:0 -50px;
}
.RadGrid_SNS .rgExpPDF
{
	background-position:0 -100px;
}
.RadGrid_SNS .rgExpCSV
{
	background-position:0 -150px;
}

/*multirow select*/

.GridRowSelector_SNS
{
	background:#4c4e54;
}

/*row drag n drop*/

.GridItemDropIndicator_SNS
{
    border-top:1px dashed #666;
}

/*tooltip*/

.GridToolTip_SNS
{
	border: 1px solid #c98400;
	padding: 3px;
	background: #ffefbd;
	color: #333;
}

/*rtl*/

.RadGridRTL_SNS .rgHeader:first-child,
.RadGridRTL_SNS th.rgResizeCol:first-child,
.RadGridRTL_SNS .rgFilterRow>td:first-child,
.RadGridRTL_SNS .rgRow>td:first-child,
.RadGridRTL_SNS .rgAltRow>td:first-child
{
	border-left-width: 1px;
	padding-left: 7px;
}

.RadGridRTL_SNS .rgPageFirst
{
	background-position: 0 -1000px;
}
.RadGridRTL_SNS .rgPageFirst:hover
{
	background-position: 0 -1050px;
}
.RadGridRTL_SNS .rgPagePrev
{
	background-position: 0 -850px;
}
.RadGridRTL_SNS .rgPagePrev:hover
{
	background-position :0 -900px;
}
.RadGridRTL_SNS .rgPageNext
{
	background-position: 0 -700px;
}
.RadGridRTL_SNS .rgPageNext:hover
{
	background-position: 0 -750px;
}
.RadGridRTL_SNS .rgPageLast
{
	background-position: 0 -550px;
}
.RadGridRTL_SNS .rgPageLast:hover
{
	background-position: 0 -600px;
}

.GridAutoHeight .rgDataDiv
 {
    height : auto !important;
 }

/* Messages Grid should not have fixed height or hidden overflow */
.MessagesGrid.GridAutoHeight .rgDataDiv {
    overflow: visible !important;
    height: auto !important;
}

/* Global checkbox styling for all grids */
.RadGrid_SNS input[type="checkbox"]
{
    width: 20px !important;
    height: 20px !important;
    cursor: pointer !important;
    vertical-align: middle;
    accent-color: #2F3034;
}

/* Specific styles for Messages Grid */
.MessagesGrid.RadGrid_SNS .bodyText,
.MessagesGrid.RadGrid_SNS .bodyText b,
.MessagesGrid.RadGrid_SNS .bodyText span
{
    font-size: 16px !important;
	font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif !important;
    color: #444750 !important;
	line-height:24px;
}

.MessagesGrid.RadGrid_SNS .bodyText b
{
    font-weight: 600 !important;
}

.MessagesGrid.RadGrid_SNS .bodyText span
{
    font-weight: 400 !important;
}

/* Add space between title and body in messages */
.MessagesGrid.RadGrid_SNS .bodyText p
{
    margin: 8px 0 !important;
}

.MessagesGrid.RadGrid_SNS .rgMasterTable td
{
    font-size: 16px !important;
    color: #444750 !important;
}

/* Hide header row for Messages Grid */
.MessagesGrid.RadGrid_SNS .rgHeader
{
    display: none !important;
}

/* Remove alternating row colors - all white background */
.MessagesGrid.RadGrid_SNS .rgRow,
.MessagesGrid.RadGrid_SNS .rgAltRow
{
    background-color: #FFFFFF !important;
}

/* Hide table borders */
.MessagesGrid.RadGrid_SNS .rgMasterTable,
.MessagesGrid.RadGrid_SNS .rgMasterTable td,
.MessagesGrid.RadGrid_SNS .rgRow td,
.MessagesGrid.RadGrid_SNS .rgAltRow td,
.MessagesGrid.RadGrid_SNS
{
    border-color: white !important;
}

/* Set table width to 620px */
.MessagesGrid.RadGrid_SNS .rgMasterTable
{
    width: 620px !important;
}

/* Add spacing between rows */
.MessagesGrid.RadGrid_SNS .rgRow td,
.MessagesGrid.RadGrid_SNS .rgAltRow td
{
    padding-top: 16px !important;
    padding-bottom: 16px !important;
}

/* Style for confirmed span */
.MessagesGrid.RadGrid_SNS .confirmed-badge
{
    display: inline-block;
    width: 108px;
    height: 40px;
    line-height: 40px;
    text-align: center;
	border-radius:8px;
    background-color: #FAFAFA !important;
    color: #000000 !important;
    border-radius: 4px;
	font-size:14px;
}

.MessagesGrid.RadGrid_SNS .read-badge
{
	text-decoration: none !important;
    display: inline-block;
    width: 108px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-radius: 4px;
    background-color: #E9E2FF !important;
    color: #431EB7 !important;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s;
}

.MessagesGrid.RadGrid_SNS .read-badge:hover
{
    background-color: #FAFAFA !important;
    color: #2F3034 !important;
}

@media (max-width: 1024px)
{
    .MessagesGrid.RadGrid_SNS .read-badge,
    .MessagesGrid.RadGrid_SNS .confirmed-badge
    {
        margin-right: 10%;
    }
}

/* UserSetup address grid header styling */
#rgAddresses.RadGrid_SNS .rgHeader th
{
    font-weight: 500;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
}

/* UserSetup address grid tighter spacing */
#rgAddresses.RadGrid_SNS .rgHeader,
#rgAddresses.RadGrid_SNS th.rgResizeCol
{
    height: 22px;
}

#rgAddresses.RadGrid_SNS .rgRow,
#rgAddresses.RadGrid_SNS .rgAltRow
{
    height: 26px;
}
/*global*/

.RadInput_SNS,
.RadInputMgr_SNS
{
    /* The skin is set up so sizing comes from the main .textBox class. */
}

/*textbox states*/

html body .RadInput_SNS .riTextBox,
html body .RadInputMgr_SNS
{
    /* The skin is set up so style attributes come from the main .textBox class. */
}

html body .RadInput_SNS .riEmpty,
html body .RadInput_Empty_SNS
{
	color: #777;
}

html body .RadInput_SNS .riHover,
html body .RadInput_Hover_SNS
{
	border-color: #b4b4b4;
}

html body .RadInput_SNS .riFocused:focus-visible,
html body .RadInput_Focused_SNS:focus-visible
{
	border-color: #431EB7;
	outline: 1px solid #431EB7;
	outline-offset: 1px;
}

html body .RadInput_SNS .riRead,
html body .RadInput_Read_SNS
{
	border-color: transparent;
	background-color: transparent;
	color: #000;
	cursor: default;
}

html body .RadInput_SNS .riDisabled,
html body .RadInput_Disabled_SNS
{
	/* border-color:transparent; */
	/* background-color:transparent; */
    border:1px solid #D0D0D0;
    background-color: #ffffff;
	color: #000000;
	cursor:default;
}

html body .RadInput_SNS .riError,
html body .RadInput_Error_SNS
{
	border-color:#ac3401;
	background:#fff 100% -298px no-repeat url('Input/sprite.gif');
	color:#b32d34;
}

.RadForm.rfdTextbox .RadInput_SNS .riError[type="text"],
.RadForm.rfdTextbox .RadInput_Error_SNS[type="text"]
{
	border-color: #ac3401;
	background: #fff 100% -298px no-repeat url('Input/sprite.gif');
	color: #b32d34;
}

html body .RadInput_SNS .riNegative,
html body .RadInput_Negative_SNS
{
	color:#444;
}

/*buttons*/

.RadInput_SNS a
{
	background: transparent no-repeat url('Input/sprite.gif');
}

/*go*/

.RadInput_SNS .riBtn a
{
	width:20px;
	height:18px;
	line-height:18px;
	background-position:3px 5px;
}

.RadInput_SNS .riBtn a:hover
{
	background-position:3px -45px;
}

/*spin*/

.RadInput_SNS .riSpin a
{
	width:15px;
	height:7px;
	line-height:7px;
}

.RadInput_SNS .riUp
{
	background-position:4px -98px;
}

.RadInput_SNS .riUp:hover
{
	background-position:4px -148px;
}

.RadInput_SNS a.riDown
{
	background-position:4px -199px;
}

.RadInput_SNS a.riDown:hover
{
	background-position:4px -249px;
}

/*label*/

.RadInput_SNS .riLabel
{
	color:#000;
}

.RadInput textarea.riTextBox {
    height: auto !important;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
    -webkit-text-fill-color: #000 !important;
	font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif !important;
    background-color: white !important;
}

input:-internal-autofill-selected {
    background-color: white !important;
    background-image: none !important;
    color: #000 !important;
}
.RadListBox_SNS .rlbGroup
{
    border: 1px solid #768ca5;
    background: #FFF;
}

.RadListBox_SNS .rlbText,
.RadListBox_SNS .rlbItem,
.RadListBox_SNS .rlbButtonText,
.RadListBox_SNS .rlbEmptyMessage
{
	font: 11px Verdana, Arial;
	color: #000;
}

.RadListBox_SNS .rlbText,
.RadListBox_SNS .rlbItem
{
	line-height: 18px;
}

.RadListBox_SNS .rlbGroup .rlbHovered
{
	background: #e9f8ff;
}

.RadListBox_SNS .rlbGroup .rlbSelected
{
	background: #9edaf2;
}

.RadListBox_SNS .rlbDisabled .rlbText
{
	color: #777;
}

.RadListBox_SNS .rlbDisabled .rlbImage
{
	opacity: 0.5;
	-moz-opacity: 0.5;
	filter:alpha(opacity=50);
}

.RadListBox_SNS .rlbDropClue
{
    background-image: url('ListBox/rlbDropClue.png');
    background-position: 0 0;
    background-repeat: no-repeat;
    background-color: transparent;
	left: -10px;
	width: 10px;
}

.RadListBox_SNS .rlbGroup .rlbDropClueAbove
{
	border-top-style: dotted;
	border-top-color: #8e8e8e;
}

.RadListBox_SNS .rlbGroup .rlbDropClueBelow
{
	border-bottom-style: dotted;
	border-bottom-color: #8e8e8e;
}

/* Buttons normal state vertical layout*/
.RadListBox_SNS .rlbButtonText
{
	background: transparent url('ListBox/rlbSprite.png') no-repeat;
}

.RadListBox_SNS .rlbButton:hover .rlbButtonTL,
.RadListBox_SNS .rlbButton:hover .rlbButtonTR,
.RadListBox_SNS .rlbButton:hover .rlbButtonBL,
.RadListBox_SNS .rlbButton:hover .rlbButtonBR
{
	background-image: url('ListBox/rlbButtonHover.png');
}

* html .RadListBox_SNS .rlbButton:hover .rlbButtonTL,
* html .RadListBox_SNS .rlbButton:hover .rlbButtonTR,
* html .RadListBox_SNS .rlbButton:hover .rlbButtonBL,
* html .RadListBox_SNS .rlbButton:hover .rlbButtonBR
{
	background-image: url('ListBox/rlbButtonHoverIE6.png');
}

.RadListBox_SNS .rlbButton .rlbButtonTL,
.RadListBox_SNS .rlbButton .rlbButtonTR,
.RadListBox_SNS .rlbButton .rlbButtonBL,
.RadListBox_SNS .rlbButton .rlbButtonBR
{
	background-image: url('ListBox/rlbButtonNormal.png');
}

* html .RadListBox_SNS .rlbButton .rlbButtonTL,
* html .RadListBox_SNS .rlbButton .rlbButtonTR,
* html .RadListBox_SNS .rlbButton .rlbButtonBL,
* html .RadListBox_SNS .rlbButton .rlbButtonBR
{
	background-image: url('ListBox/rlbButtonNormalIE6.png');
}

.RadListBox_SNS .rlbDisabled .rlbButtonTL,
.RadListBox_SNS .rlbDisabled .rlbButtonTR,
.RadListBox_SNS .rlbDisabled .rlbButtonBL,
.RadListBox_SNS .rlbDisabled .rlbButtonBR,
.RadListBox_SNS .rlbDisabled:hover .rlbButtonTL,
.RadListBox_SNS .rlbDisabled:hover .rlbButtonTR,
.RadListBox_SNS .rlbDisabled:hover .rlbButtonBL,
.RadListBox_SNS .rlbDisabled:hover .rlbButtonBR
{
	background-image: url('ListBox/rlbButtonDisabled.png');
}

* html .RadListBox_SNS .rlbDisabled .rlbButtonTL,
* html .RadListBox_SNS .rlbDisabled .rlbButtonTR,
* html .RadListBox_SNS .rlbDisabled .rlbButtonBL,
* html .RadListBox_SNS .rlbDisabled .rlbButtonBR,
* html .RadListBox_SNS .rlbDisabled:hover .rlbButtonTL,
* html .RadListBox_SNS .rlbDisabled:hover .rlbButtonTR,
* html .RadListBox_SNS .rlbDisabled:hover .rlbButtonBL,
* html .RadListBox_SNS .rlbDisabled:hover .rlbButtonBR
{
	background-image: url('ListBox/rlbButtonDisabledIE6.png');
}

.RadListBox_SNS .rlbButton .rlbButtonText,
.RadListBox_SNS .rlbButton:hover .rlbButtonText
{
	color: #0d202b;
}

.RadListBox_SNS .rlbDisabled .rlbButtonText,
.RadListBox_SNS .rlbDisabled:hover .rlbButtonText
{
	color: #777;
}

.RadListBox_SNS .rlbMoveUp .rlbButtonText { background-position: 0 0; }
.RadListBox_SNS .rlbMoveUp:hover .rlbButtonText { background-position: -400px 0; }
.RadListBox_SNS .rlbMoveUpDisabled .rlbButtonText,
.RadListBox_SNS .rlbMoveUpDisabled:hover .rlbButtonText { background-position: -200px 0; }

.RadListBox_SNS .rlbMoveDown .rlbButtonText { background-position: 0 -25px; }
.RadListBox_SNS .rlbMoveDown:hover .rlbButtonText { background-position: -400px -25px; }
.RadListBox_SNS .rlbMoveDownDisabled .rlbButtonText,
.RadListBox_SNS .rlbMoveDownDisabled:hover .rlbButtonText { background-position: -200px -25px; }

.RadListBox_SNS .rlbDelete .rlbButtonText { background-position: 0 -50px; }
.RadListBox_SNS .rlbDelete:hover .rlbButtonText { background-position: -400px -50px; }
.RadListBox_SNS .rlbDeleteDisabled .rlbButtonText,
.RadListBox_SNS .rlbDeleteDisabled:hover .rlbButtonText { background-position: -200px -50px; }


.RadListBox_SNS .rlbButtonAreaRight .rlbTransferTo .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferFrom .rlbButtonText { background-position: 0 -100px; }
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferTo .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaRight .rlbTransferFrom .rlbButtonText { background-position: 0 -75px; }
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferFrom:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaRight .rlbTransferTo:hover .rlbButtonText { background-position: -400px -100px; }
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferTo:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaRight .rlbTransferFrom:hover .rlbButtonText { background-position: -400px -75px; }

.RadListBox_SNS .rlbButtonAreaRight .rlbTransferToDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferFromDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferFromDisabled:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaRight .rlbTransferToDisabled:hover .rlbButtonText { background-position: -200px -100px; }

.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferToDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaRight .rlbTransferFromDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferToDisabled:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaRight .rlbTransferFromDisabled:hover .rlbButtonText { background-position: -200px -75px; }


.RadListBox_SNS .rlbButtonAreaRight .rlbTransferAllTo .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferAllFrom .rlbButtonText { background-position: 0 -150px; }
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferAllTo .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaRight .rlbTransferAllFrom .rlbButtonText { background-position: 0 -125px; }
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferAllFrom:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaRight .rlbTransferAllTo:hover .rlbButtonText { background-position: -400px -150px; }
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferAllTo:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaRight .rlbTransferAllFrom:hover .rlbButtonText { background-position: -400px -125px; }

.RadListBox_SNS .rlbButtonAreaRight .rlbTransferAllToDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferAllFromDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferAllFromDisabled:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaRight .rlbTransferAllToDisabled:hover .rlbButtonText { background-position: -200px -150px; }

.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferAllToDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaRight .rlbTransferAllFromDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaLeft .rlbTransferAllToDisabled:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaRight .rlbTransferAllFromDisabled:hover .rlbButtonText { background-position: -200px -125px; }


.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferTo .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferFrom .rlbButtonText { background-position: 0 -200px; }
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferTo .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferFrom .rlbButtonText { background-position: 0 -175px; }
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferFrom:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferTo:hover .rlbButtonText { background-position: -400px -200px; }
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferTo:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferFrom:hover .rlbButtonText { background-position: -400px -175px; }

.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferToDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferFromDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferFromDisabled:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferToDisabled:hover .rlbButtonText { background-position: -200px -200px; }

.RadListBox_SNS .rlbButtonAreaTop .rlbTransferToDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferFromDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferToDisabled:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferFromDisabled:hover .rlbButtonText { background-position: -200px -175px; }


.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferAllTo .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferAllFrom .rlbButtonText { background-position: 0 -250px; }
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferAllTo .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferAllFrom .rlbButtonText { background-position: 0 -225px; }
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferAllFrom:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferAllTo:hover .rlbButtonText { background-position: -400px -250px; }
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferAllTo:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferAllFrom:hover .rlbButtonText { background-position: -400px -225px; }

.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferAllToDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferAllFromDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferAllFromDisabled:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferAllToDisabled:hover .rlbButtonText { background-position: -200px -250px; }

.RadListBox_SNS .rlbButtonAreaTop .rlbTransferAllToDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferAllFromDisabled .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaTop .rlbTransferAllToDisabled:hover .rlbButtonText,
.RadListBox_SNS .rlbButtonAreaBottom .rlbTransferAllFromDisabled:hover .rlbButtonText { background-position: -200px -225px; }


/* ========================================
   RadMenu SNS Skin - ACCORDION VERSION
   ======================================== */

.RadMenu_SNS {
    z-index: 100;
    width: 100%;
}

/* ========================================
   MENU ITEMS - BASE STYLES
   ======================================== */

.RadMenu_SNS .rmRootGroup {
    display: block;
}

.RadMenu_SNS .rmItem {
    display: block;
    margin-bottom: 8px;
    position: relative;
}

.RadMenu_SNS .rmLink {
    display: block;
    padding: 9px 7px !important;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: #2F3034;
    text-decoration: none;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.RadMenu_SNS .rmText {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: #2F3034;
}

.RadMenu_SNS .rmLink:hover,
.RadMenu_SNS .rmFocused,
.RadMenu_SNS .rmSelected {
    background: rgba(197, 208, 255, 1) !important;
}

/* ========================================
   MENU ICONS - ALWAYS KEEP MARGIN
   This overrides Telerik's rmImageOnly rule
   ======================================== */

.RadMenu_SNS img.rmLeftImage,
.RadMenu_SNS .rmLink img.rmLeftImage,
.RadMenu_SNS .rmLink.accordion-parent img.rmLeftImage,
.RadMenu_SNS .rmLink.rmImageOnly img.rmLeftImage,
.RadMenu_SNS .rmLink.accordion-parent.rmImageOnly img.rmLeftImage,
.RadMenu .rmRootGroup a.rmImageOnly .rmLeftImage,
.RadMenu a.rmImageOnly .rmLeftImage {
    margin-right: 12px !important;
    margin-left: 0 !important;
    padding: 0 !important;
    width: 18px;
    height: 18px;
    vertical-align: middle;
}

/* ========================================
   ACCORDION PARENT
   ======================================== */

/* Only hide .rmText when .accordion-text EXISTS
   This prevents the flash - rmText stays visible until JS creates accordion-text */
.RadMenu_SNS .rmLink:has(.accordion-text) .rmText {
    display: none !important;
}

.RadMenu_SNS .rmLink.accordion-parent {
    position: relative;
    padding: 9px 50px 9px 7px !important;
}

/* Our custom text element */
.accordion-text {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: #2F3034;
}

.accordion-text {
    display: inline !important;
}

/* Arrow indicator */
.accordion-arrow {
    position: absolute;
    right: 18px;
    top: 50%;
    width: 10px;
    height: 10px;
    border: solid #686D7B;
    border-width: 0 2px 2px 0;
    transform: translateY(-50%) rotate(45deg);
    transition: transform 0.2s ease;
    pointer-events: none;
}

.accordion-arrow.open {
    transform: translateY(-50%) rotate(-135deg);
}

/* ========================================
   ACCORDION SUBMENU
   ======================================== */

.accordion-submenu {
    display: none;
    margin: 9px 0 4px 21px;
    padding: 6px 0;
    border-left: 2px solid #E0E0E0;
}

.accordion-submenu.open {
    display: block;
}

.accordion-item {
    display: block;
    margin-bottom: 3px;
}

.accordion-link {
    display: block;
    padding: 9px 13px;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #2F3034;
    text-decoration: none;
    border-radius: 0 8px 8px 0;
    transition: background-color 0.2s ease;
}

.accordion-link:hover,
.accordion-link:focus {
    background: rgba(197, 208, 255, 0.6);
}

/* ========================================
   HIDE TELERIK FLYOUT ELEMENTS
   ======================================== */

.RadMenu_SNS .rmSlide,
.RadMenu_SNS .rmGroup:not(.rmRootGroup) {
    display: none !important;
    visibility: hidden !important;
    position: absolute !important;
    left: -99999px !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

.RadMenu_SNS .rmExpandRight,
.RadMenu_SNS .rmExpandDown,
.RadMenu_SNS .rmExpandLeft {
    display: none !important;
}

/* ========================================
   KEYBOARD FOCUS
   ======================================== */

.RadMenu_SNS .rmLink:focus,
.accordion-link:focus {
    outline: 2px solid #431EB7;
    outline-offset: 2px;
}

.RadMenu_SNS .rmLink:focus:not(:focus-visible),
.accordion-link:focus:not(:focus-visible) {
    outline: none;
}
/* ========================================
   ACTIVE MENU ITEM STYLING
   ======================================== */

/* Active link in submenu - the current page */
.accordion-link.accordion-active {
    background-color: #E9E2FF !important;
    color: #431EB7 !important;
    font-weight: 600 !important;
    border-radius: 6px;
}

.accordion-link.accordion-active::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 60%;
    background-color: #431EB7;
    border-radius: 0 2px 2px 0;
}

.accordion-item {
    position: relative;
}

.accordion-submenu.open:has(.accordion-active) + .accordion-parent,
.rmItem:has(.accordion-active) > .rmLink.accordion-parent {
    background-color: #F1EFFD !important;
}
.RadTabStrip .rtsLevel .rtsIn, .RadTabStrip .rtsLevel .rtsTxt
{
    padding: 0 !important;
}

.RadTabStrip_SNS .rtsLI,
.RadTabStrip_SNS .rtsLink
{
	color: #000;
	font: 12px/26px Verdana, Arial;
}

.RadTabStripLeft_SNS .rtsSeparator,
.RadTabStripRight_SNS .rtsSeparator
{
	background: #898C95;
}

/* <disabled tabs> */
.RadTabStrip_SNS .rtsDisabled
{
	color: #aaa;
}
/* </disabled tabs> */

/* <scrolling arrows> */
.RadTabStrip_SNS .rtsNextArrow,
.RadTabStrip_SNS .rtsPrevArrow,
.RadTabStrip_SNS .rtsPrevArrowDisabled,
.RadTabStrip_SNS .rtsNextArrowDisabled
{
	background-image: url('TabStrip/TabStripStates.png');
}
/* </scrolling arrows> */

/* <tab backgrounds> */

.RadTabStripTop_SNS .rtsLevel { background-color: transparent; }

.RadTabStripTop_SNS .rtsLevel .rtsLink,
.RadTabStripTop_SNS .rtsLevel .rtsOut,
.RadTabStripBottom_SNS .rtsLevel .rtsLink,
.RadTabStripBottom_SNS .rtsLevel .rtsOut,
.RadTabStripTop_SNS_Baseline .rtsLevel,
.RadTabStripBottom_SNS_Baseline .rtsLevel { background-image: url('TabStrip/TabStripStates.png'); }

.RadTabStripLeft_SNS .rtsLink,
.RadTabStripRight_SNS .rtsLink { background-image: url('TabStrip/TabStripVStates.png'); }

.RadTabStripLeft_SNS .rtsLast .rtsLink,
.RadTabStripRight_SNS .rtsLast .rtsLink
{
	border-bottom: 1px solid #898C95;
}

.RadTabStripRight_SNS .rtsLink,
.RadTabStripRight_SNS .rtsLI .rtsDisabled:hover { background-position: 100% 0; }
.RadTabStripRight_SNS .rtsLink:hover { background-position: 100% -200px; }
.RadTabStripRight_SNS .rtsSelected,
.RadTabStripRight_SNS .rtsSelected:hover { background-position: 100% -400px; }
/* </tab backgrounds> */


/* <background positioning: tabs with hovers> */

/* <orientation: top> */

.RadTabStripTop_SNS .rtsLink { background-position: 0 0; }
.RadTabStripTop_SNS .rtsOut { background-position: 100% 0; }

.RadTabStripTop_SNS .rtsLink:hover { background-position: 0 -52px; }
.RadTabStripTop_SNS .rtsLink:hover .rtsOut { background-position: 100% -52px; }

.RadTabStripTop_SNS .rtsSelected,
.RadTabStripTop_SNS .rtsSelected:hover { background-position: 0 -26px; }
.RadTabStripTop_SNS .rtsSelected .rtsOut,
.RadTabStripTop_SNS .rtsSelected:hover .rtsOut { background-position: 100% -26px; }

.RadTabStripTop_SNS .rtsDisabled:hover { background-position: 0 0; }
.RadTabStripTop_SNS .rtsDisabled:hover .rtsOut { background-position: 100% 0; }

.RadTabStripTop_SNS_Baseline .rtsLevel { background-position: 0 100%; background-repeat: repeat-x; }

/* </orientation: top> */

/* <orientation: bottom> */

.RadTabStripBottom_SNS .rtsLink { background-position: 0 -182px; }
.RadTabStripBottom_SNS .rtsOut { background-position: 100% -182px; }

.RadTabStripBottom_SNS .rtsLink:hover { background-position: 0 -130px; }
.RadTabStripBottom_SNS .rtsLink:hover .rtsOut { background-position: 100% -130px; }

.RadTabStripBottom_SNS .rtsSelected,
.RadTabStripBottom_SNS .rtsSelected:hover { background-position: 0 -156px; }
.RadTabStripBottom_SNS .rtsSelected .rtsOut,
.RadTabStripBottom_SNS .rtsSelected:hover .rtsOut { background-position: 100% -156px; }

.RadTabStripBottom_SNS .rtsDisabled:hover { background-position: 0 -182px; }
.RadTabStripBottom_SNS .rtsDisabled:hover .rtsOut { background-position: 100% -182px; }

.RadTabStripBottom_SNS_Baseline .rtsLevel { background-position: 0 -599px; background-repeat: repeat-x; }

/* </orientation: bottom> */

/* <orientation: right> */

.RadTabStripRight_SNS .rtsUL .rtsLink,
.RadTabStripRight_SNS .rtsUL .rtsLI .rtsDisabled:hover { background-position: 100% 0; text-align: left; }
.RadTabStripRight_SNS .rtsUL .rtsLink:hover { background-position: 100% -200px; }
.RadTabStripRight_SNS .rtsUL .rtsSelected,
.RadTabStripRight_SNS .rtsUL .rtsSelected:hover { background-position: 100% -400px; }

/* </orientation: right> */

/* </background positioning: tabs with hovers> */

/* <simplistic sub-item styles> */

.RadTabStrip_SNS_SimpleSubItems .rtsLevel2,
.RadTabStrip_SNS_SimpleSubItems .rtsLevel3,
.RadTabStrip_SNS_SimpleSubItems .rtsLevel4 { background: #fff; }

.RadTabStrip_SNS_SimpleSubItems .rtsLevel2 .rtsSelected,
.RadTabStrip_SNS_SimpleSubItems .rtsLevel3 .rtsSelected,
.RadTabStrip_SNS_SimpleSubItems .rtsLevel4 .rtsSelected
{
	text-decoration: underline;
}

.RadTabStrip_SNS_SimpleSubItems .rtsLevel2 .rtsLink,
.RadTabStrip_SNS_SimpleSubItems .rtsLevel2 .rtsOut,
.RadTabStrip_SNS_SimpleSubItems .rtsLevel2 .rtsIn,
.RadTabStrip_SNS_SimpleSubItems .rtsLevel3 .rtsLink,
.RadTabStrip_SNS_SimpleSubItems .rtsLevel3 .rtsOut,
.RadTabStrip_SNS_SimpleSubItems .rtsLevel3 .rtsIn,
.RadTabStrip_SNS_SimpleSubItems .rtsLevel4 .rtsLink,
.RadTabStrip_SNS_SimpleSubItems .rtsLevel4 .rtsOut,
.RadTabStrip_SNS_SimpleSubItems .rtsLevel4 .rtsIn
{
	background: none;
}

/* </simplistic sub-item styles> */
.RadTreeView_SNS .rtTemplate
{
    font: 12px/15px Verdana, Arial;
    }

.RadTreeView_SNS,
.RadTreeView_SNS a.rtIn,
.RadTreeView_SNS .rtEdit .rtIn input
{
	color: #000;
	font: 12px/26px Verdana, Arial;
}

.RadTreeView_SNS .rtPlus, 
.RadTreeView_SNS .rtMinus
{
	background-image: url('TreeView/PlusMinus.png');
}

.RadTreeView_SNS .rtLI .rtPlus, 
.RadTreeView_SNS .rtLI .rtPlus:hover
{ background-position: 0 0; }

.RadTreeView_SNS .rtLI .rtMinus, 
.RadTreeView_SNS .rtLI .rtMinus:hover
{ background-position: 0 -11px; }

.RadTreeView_SNS .rtChecked,
.RadTreeView_SNS .rtUnchecked,
.RadTreeView_SNS .rtIndeterminate
{
	background-image: url('TreeView/TriState.png');
}

.RadTreeView_SNS .rtHover .rtIn
{
	color: #882501;
	border-color: #c98400;
	background-color: #ffe79c;
}

.RadTreeView_SNS .rtSelected .rtIn
{
	color: #882501;
	border-color: #ca4b0c;
	background-color: #ffa517;
}

.RadTreeView_SNS .rtSelected .rtLoadingBefore,
.RadTreeView_SNS .rtSelected .rtLoadingAfter,
.RadTreeView_SNS .rtSelected .rtLoadingBelow
{
	color: #333;
}

.RadTreeView_SNS .rtLoadingIcon
{
	background-image: url('TreeView/LoadingIcon.gif');
}

.RadTreeView_SNS .rtLI .rtEdit .rtIn
{
	border-color: #6c6c6c;
	background: #fff;
}

.RadTreeView_SNS_disabled .rtIn,
.RadTreeView_SNS .rtDisabled .rtIn
{
	color: #ccc;
}


/* <node lines> */

.RadTreeView_SNS .rtLines .rtLI,
.RadTreeView_SNS .rtLines .rtFirst .rtUL { background-image: url('TreeView/NodeSpan.png'); }
.RadTreeView_SNS_rtl .rtLines .rtLI,
.RadTreeView_SNS_rtl .rtLines .rtFirst .rtUL { background-image:url('TreeView/NodeSpan_rtl.png'); }

.RadTreeView_SNS .rtLines .rtFirst,
.RadTreeView_SNS .rtLines .rtFirst .rtUL { background-image: url('TreeView/FirstNodeSpan.png'); }
.RadTreeView_SNS_rtl .rtLines .rtFirst,
.RadTreeView_SNS_rtl .rtLines .rtFirst .rtUL { background-image: url('TreeView/FirstNodeSpan_rtl.png'); }
.RadTreeView_SNS .rtLines .rtLast,
.RadTreeView_SNS .rtLines .rtLast .rtUL { background-image: none; }

.RadTreeView_SNS .rtLines .rtTop { background-image:url('TreeView/TopLine.png'); }
.RadTreeView_SNS_rtl .rtLines .rtTop { background-image:url('TreeView/TopLine_rtl.png'); }
.RadTreeView_SNS .rtLines .rtMid { background-image:url('TreeView/MiddleLine.png'); }
.RadTreeView_SNS_rtl .rtLines .rtMid { background-image:url('TreeView/MiddleLine_rtl.png'); }
.RadTreeView_SNS .rtLines .rtBot { background-image:url('TreeView/BottomLine.png'); }
.RadTreeView_SNS_rtl .rtLines .rtBot { background-image: url('TreeView/BottomLine_rtl.png'); }
.RadTreeView_SNS .rtLines .rtLast .rtTop { background-image:url('TreeView/SingleLine.png'); }
.RadTreeView_SNS_rtl .rtLines .rtLast .rtTop { background-image:url('TreeView/SingleLine_rtl.png'); }

/* </node lines> */

/* RadUpload */

/* <general styles> */

.RadUpload_SNS,
.RadUpload_SNS .ruInputs
{
    overflow: hidden;
}

div.RadUpload_SNS,
div.RadUpload_SNS a,
div.RadUpload_SNS input,
div.RadUploadProgressArea_SNS,
div.RadUploadProgressArea_SNS input
{
    /*
    width: 150px !important;
    height: 36px !important;
    */
}

/* </general styles> */


.RadUpload_SNS .ruStyled
{
    /* This is needed to fix button height from being chopped short. */
    height: 36px !important;
}

.RadUpload_SNS .ruStyled .ruFileInput
{
}

/* <file inputs> */

div.RadUpload_SNS .ruFileInput,
div.RadUpload_SNS input.ruFileInput,
div.RadUpload_SNS button.ruFileInput
{
    /* This is supposed to apply to the underlying upload control. */
    width: 150px !important;
    height: 36px !important;
	cursor: pointer;
}

div.RadUpload_SNS .ruFakeInput
{
    /* This applies to the visible "text box" */
    /*
    border-color: #616161;
    color: #4b4b4b;
    */
    /*
    width: 0px;
    height: 0px;
    */
    display: none;
}

* html .RadUpload_SNS .ruFileWrap .ruInputHover { border-color: #333; }
*+html .RadUpload_SNS .ruFileWrap .ruInputHover { border-color: #333; }

div.RadUpload_SNS .ruReadOnly .ruFakeInput
{
    /*
    width: 0px;
    height: 0px;
    */
    display: none;
}

/* </file inputs> */

/* <buttons> */

.RadUpload .ruFileWrap{
     display: inline !important;
} 

div.RadUpload_SNS .ruButton,
div.RadUploadProgressArea_SNS .ruButton
{
    /* Should match .button class */
    /* text-transform: uppercase; */
    display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	color: #2f3034;
	font-size: 14px;
	font-weight: bold;
	-webkit-border-radius: .4em; 
	-moz-border-radius: .4em;
	border-radius: 8px;
    font-family: 'Poppins';
	/* text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2); */
    /* top / right / bottom / left */
	padding: 8px 16px 8px 40px;
    height: 40px;
    font-weight: 500;

    /* Should match .buttonCamera class */
    background-image: url(Master/camera.png);
    background-position: 15px center;
    background-repeat: no-repeat;

    /* Should match .blue class */
	background-color: #D2DC11;

    /*
    width: 124px;
        */
}

div.RadUpload_SNS .ruBrowse
{
    width: 150px !important;
}

/* div.RadUpload_SNS .ruButton, */
/* div.RadUpload_SNS .ruBrowse, */
div.RadUpload_SNS .ruCancel,
div.RadUpload_SNS .ruCheck,
div.RadUpload_SNS .ruRemove,
div.RadUpload_SNS .ruAdd,
div.RadUpload_SNS .ruDelete
{
    display:none !important;
    /*
	color: #6e6e6e;
	background-color: transparent;
    background-image: url('Upload/ruSprite.png');
	border: 0;
    */
}

div.RadUploadSubmit_SNS,
div.RadUploadProgressArea_SNS .ruButton
{
}

div.RadUpload_SNS .ruActions .ruButton
{
    /* For "Add" and "Delete" buttons? */
}

div.RadUpload_SNS .ruInputs .ruButtonHover,
div.RadUpload_SNS .ruActions .ruButtonHover,
div.RadUpload_SNS .ruFileWrap .ruButtonHover,
div.RadUploadProgressArea_SNS .ruActions .ruButtonHover
{
    /* background-color: #c1c1c1; */
}

/* </buttons> */

/* <progress area> */

.RadUploadProgressArea_SNS .ruProgress
.RadUpload_SNS .ruProgress
{
    /*
    border-color: #616161;
    background-image: url('Upload/ruSprite.png');
    background-color: #fff;
    */
    display: none;
}

.RadUploadProgressArea_SNS .ruProgress li
{
    color: #000;
}

.RadUploadProgressArea_SNS li.ruProgressHeader
{
    color: #000;
}

.RadUploadProgressArea_SNS .ruProgress li.ruCurrentFile
{
    color: #000;
}

.RadUploadProgressArea_SNS .ruProgress li.ruCurrentFile span
{
    color: #ca250c;
}

.RadUploadProgressArea_SNS .ruProgress .ruBar
{
    border-color: #999;
}
 
.RadUploadProgressArea_SNS .ruProgress .ruBar div
{
    background-image: url('Upload/ruProgress.gif');
	border-right: 1px solid #ca250c;
}

.RadUploadProgressArea_SNS_rtl .ruProgress .ruBar div
{
	border-right: 0;
	border-left: 1px solid #ca250c;
    background-image: url('Upload/ruProgress.gif');
}
 
.RadUploadProgressArea_SNS .ruProgress .ruActions
{
	border-top-color: #616161;
	background: #e4e4e4;
}

/* </progress area> */

/* <RadAsyncUpload> */

.RadUpload_SNS .ruUploadInvalid
{
    background-repeat: no-repeat;
    background-position: 100% -297px;
    background-image: url('Input/sprite.gif');
}

.RadUpload_SNS_rtl .ruUploadInvalid
{
    background-position: 3px -297px;
}

.RadUpload_SNS span.ruFileProgressWrap
{
    background: #dcdcdc;
    display: none;
}

.RadUpload_SNS span.ruFileProgress,
.RadUpload_SNS span.ruProgressComplete
{
    background: #ffa517;
}

/* </RadAsyncUpload> */

.RadWindow_SNS .rwIcon {    
    display: none!important;    
}   
  

/* Window Background */

/* Horiznotal */
.RadWindow_SNS .rwTopLeft,
.RadWindow_SNS .rwTopRight,
.RadWindow_SNS .rwTitlebar,
.RadWindow_SNS .rwFooterLeft,
.RadWindow_SNS .rwFooterRight,
.RadWindow_SNS .rwFooterCenter,
.RadWindow_SNS .rwTopResize,
.RadWindow_SNS .rwStatusbar div,
.RadWindow_SNS .rwStatusbar,
.RadWindow_SNS .rwPopupButton,
.RadWindow_SNS .rwPopupButton span,
.RadWindow_SNS.rwMinimizedWindow .rwCorner
{
    background-image: url('Window/WindowHorizontalSprites.gif');
}

/* Vertical */
.RadWindow_SNS .rwBodyLeft,
.RadWindow_SNS .rwBodyRight,
.RadWindow_SNS .rwStatusbarRow .rwCorner
{
	background-image: url('Window/WindowVerticalSprites.gif');
}

/* Window Shadows */

/* Horiznotal */
.RadWindow_SNS .rwShadow .rwTopLeft,
.RadWindow_SNS .rwShadow .rwTopRight,
.RadWindow_SNS .rwShadow .rwTitlebar,
.RadWindow_SNS .rwShadow .rwFooterLeft,
.RadWindow_SNS .rwShadow .rwFooterRight,
.RadWindow_SNS .rwShadow .rwFooterCenter,
.RadWindow_SNS .rwShadow .rwTopResize,
.RadWindow_SNS .rwShadow .rwStatusbar div,
.RadWindow_SNS .rwShadow .rwStatusbar,
.RadWindow_SNS .rwShadow .rwPopupButton,
.RadWindow_SNS .rwShadow .rwPopupButton span,
.RadWindow_SNS .rwShadow .rwBodyLeft,
.RadWindow_SNS .rwShadow .rwBodyRight,
.RadWindow_SNS .rwShadow .rwStatusbarRow .rwBodyLeft,
.RadWindow_SNS .rwShadow .rwStatusbarRow .rwBodyRight
{
	background-image: url('Window/WindowHorizontalSprites.png');
}

/* Vertical */
.RadWindow_SNS .rwShadow .rwBodyLeft,
.RadWindow_SNS .rwShadow .rwBodyRight,
.RadWindow_SNS .rwShadow .rwStatusbarRow .rwBodyLeft,
.RadWindow_SNS .rwShadow .rwStatusbarRow .rwBodyRight
{
	background-image: url('Window/WindowVerticalSprites.png');
}

/* Shadows End */

.RadWindow_SNS .rwStatusbar input
{
    background-color: #f7f3e9;
}

.RadWindow_SNS .rwControlButtons
{
    margin-top: 1px;
}

.RadWindow_SNS .rwControlButtons a
{
    background-image: url('Window/CommandButtonSprites.gif');
}

.RadWindow_SNS a.rwIcon
{
	background-image: url('Window/WindowHorizontalSprites.gif');
}

div.RadWindow_SNS .rwTitlebarControls em
{
	color: white;
}

div.RadWindow_SNS .rwDialogInput
{
	border: solid 1px #6788be;
}

div.RadWindow_SNS .rwDialogInput:hover
{
	border-color: #3f5f94;
}

div.RadWindow_SNS td.rwWindowContent
{
    background-color: #fff;
}

/* Loading Indicators */
div.RadWindow_SNS tr td.rwLoading
{
    background-color: #e6edf7;
}

/* When ShowContentDuringLoad="true" */
div.RadWindow_SNS td.rwWindowContent.rwLoading
{
    background-image: url('Common/loading.gif');
}

/* When ShowContentDuringLoad="false" */
div.RadWindow_SNS input.rwLoading
{
    background-image: url('Common/loading_small.gif');
}

.RadWindow_SNS a.rwCancel,
.RadWindow_SNS a.rwCancel span
{
    background: none;
    cursor: pointer;
    cursor: hand;
}

.RadWindow_SNS a.rwCancel span span
{
    color: #395ba0;
}

.RadWindow_SNS a.rwCancel:hover span span
{
    color: #002bb8;
    text-decoration: underline;
}

/* Shadow Control Buttons */

.RadWindow_SNS .rwShadow .rwControlButtons 
{
	margin: 5px -2px 0 0;
}

.RadWindow_SNS .rwShadow .rwControlButtons 
{
	margin: 5px -1px 0 0\9;
}

/* ctrl buttons when winodw is minimized */
.RadWindow_SNS.rwMinimizedWindowShadow .rwShadow .rwControlButtons 
{
	margin: 9px -8px 0 0;
}

.RadWindow_SNS .rwShadow .rwControlButtons li
{
	float: left;
	padding: 0;
}

.RadWindow_SNS .rwShadow .rwControlButtons a
{
	width: 30px; 
}

.rwInactiveWindow .rwShadow .rwTopLeft,
.rwInactiveWindow .rwShadow .rwTopRight,
.rwInactiveWindow .rwShadow .rwTitlebar,
.rwInactiveWindow .rwShadow .rwFooterLeft,
.rwInactiveWindow .rwShadow .rwFooterRight,
.rwInactiveWindow .rwShadow .rwFooterCenter,
.rwInactiveWindow .rwShadow .rwTopResize,
.rwInactiveWindow .rwShadow .rwStatusbar div,
.rwInactiveWindow .rwShadow .rwStatusbar,
.rwInactiveWindow .rwShadow .rwPopupButton,
.rwInactiveWindow .rwShadow .rwPopupButton span,
.rwInactiveWindow .rwShadow.rwMinimizedWindow .rwCorner
{
    background-image: url('Window/WindowHorizontalSprites.gif') !important;
}

.rwInactiveWindow .rwShadow .rwBodyLeft,
.rwInactiveWindow .rwShadow .rwBodyRight,
.rwInactiveWindow .rwShadow .rwStatusbarRow .rwCorner
{
	background-image: url('Window/WindowVerticalSprites.gif') !important;
}

/* Hide the page information label in the store pager */
#ctl00_cphBody_dlpStorePager_lblPageInformation {
    display: none !important;
}

/* Force DataList to display 5 items per row */
#ctl00_cphBody_dlAvailableItems {
    width: 100% !important;
}

/* Add margin bottom to validators in item settings for proper spacing */
#ctl00_cphBody_divItemSettings .validator {
    margin-bottom: -20px;
}

#ctl00_cphBody_divItemSettings .input-container .validator {
    bottom: auto;
}

#ctl00_cphBody_dlAvailableItems td {
    width: 20% !important;
}

.shop-page {
    background-color: #F9F9FA;
    border-radius: 8px;
}

/* Store items container with padding */
.store-items-container {
    overflow-y: auto;
}

/* Content wrapper - single column by default */
.item-content-wrapper {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Two-column layout when has custom image */
.item-content-wrapper.has-custom-image {
    flex-direction: row;
    gap: 32px;
}

/* Large image column (300x300) - hidden by default */
.item-large-image-column {
    display: none;
    flex-shrink: 0;
    width: 300px;
}

.item-content-wrapper.has-custom-image .item-large-image-column {
    display: block;
}

.item-large-image-column a {
    display: block;
}

.item-large-image {
    width: 300px;
    height: 300px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid #E0E0E0;
    cursor: pointer;
}

/* Options column */
.item-options-column {
    flex: 1;
    min-width: 0;
    min-height: 200px;
}


.single-item-container {
    height: auto;
    overflow-y: auto;
}

/* Store search component styling */
.store-search-container {
    display: flex;
    align-items: center;
    gap: 16px;
    width: 100%;
}

.store-search-filters {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.store-search-input-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.store-search-input-wrapper .riTextBox {
    border: 1px solid #E4E4E7 !important;
    background: white !important;
    border-radius: 8px !important;
    height: 40px !important;
    padding: 0 12px !important;
    box-sizing: border-box !important;
}

.store-search-button {
    width: 40px !important;
    height: 40px !important;
    border: 2px solid #D1D1D6 !important;
    border-radius: 8px !important;
    background-color: #FFFFFF !important;
    background-position: center center !important;
    background-size: 18px 18px !important;
    background-repeat: no-repeat !important;
    padding: 0 !important;
    cursor: pointer !important;
    flex-shrink: 0;
    min-width: 40px !important;
    box-sizing: border-box !important;
}

.store-item-header {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 16px;
}

.item-header-buttons {
    flex-shrink: 0;
    display: flex;
    gap: 8px;
}

.item-small-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
}

.item-small-icon img {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.item-header-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.item-detail-container {
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
}

.item-detail-header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.item-detail-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.item-detail-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
    color: #09090B;
}

.item-detail-title {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: 500;
    color: #09090B;
}

/* ===================================
   CHECKOUT PAGE STYLES
   =================================== */

/* Ensure checkout page fills full viewport */
.main-layout-container:has(.checkout-page) {
    min-height: 100vh;
    height: auto !important;
}

/* Checkout page container styling */
#ctl00_cphBody_spnlCheckoutAndResults {
    display: flex;
    flex-direction: column;
    min-height: 500px;
    max-height: calc(100vh - 200px);
    background-color: #F9F9FA;
    border-radius: 8px;
}
.checkout-page{
    background-color: #F9F9FA;
    border-radius: 8px;
    max-height: auto;
}
/* Scrollable content area for checkout */
.checkout-scrollable-content {
    height: auto;
}

/* Fixed button section at bottom */
.checkout-button-section {
    background-color: #f9f9f9;
    flex-shrink: 0;

}


/* Ensure panels inside scrollable area don't have excess spacing */
.checkout-scrollable-content .SNSPanelHeader {
    margin-top: 24px;
    margin-bottom: 12px;
}


/* ===================================
   END CHECKOUT PAGE STYLES
   =================================== */

.seatMapContainer {
    background-color: #F9F9FA;
    border-radius: 8px;
    padding: 15px;
}

.seatMapRowTable {
    border-spacing: 4px;
}

.seatMapSectionHeaderCell {
    background-color: transparent;
    width: 100%;
}

.seatMapSectionHeaderText {
    color: #141416;
    font-size: 18px;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-weight: 400;
}

.seatCell {
    /* padding: 4px 8px 4px 8px; */
    /* margin: 4px 8px 4px 8px; */
    white-space: nowrap;
    -webkit-hyphens: none;
    -moz-hyphens: none;
    hyphens: none;
    border: 1px solid #E4E4E7;
    border-radius: 8px;
    text-align: center;
    width: 38px;
    height: 32px;
}

.seatText {
    font-size: 14px;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    line-height: 16px;
    font-weight: 500;
    padding: 8px;
}

.seatUnavailableCell {
    background-color: #686868;
}

.seatUnavailableText {
    color: #fffdfd;
}

.seatSelectedCell {
    background-color: #D2DC11;
}

.seatSelectedText {
    color: black;
}

.seatAvailableCell {
    background-color: whitesmoke;
}

.seatAvailableText {
    color: black;
}

.seat-selection-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 16px;
}

.seat-selection-key {
    display: flex;
    align-items: center;
    gap: 24px;
}

.seat-key-divider {
    width: 1px;
    height: 32px;
    background-color: #D1D1D6;
}

.seat-key-legend {
    display: flex;
    gap: 24px;
}

.seat-key-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #09090B;
}

.seat-color-box {
    width: 24px;
    height: 24px;
    border-radius: 8px;
}

.seat-available-box {
    background-color: whitesmoke;
    border: 1px solid #D1D1D6;
}

.seat-unavailable-box {
    background-color: #686868;
    border: 1px solid #686868;
}

.seat-selected-box {
    background-color: #D2DC11;
    border: 1px solid #D2DC11;
}

.storeItemImageCell {
    position: relative;
    width: 108px;
    height: 138px;
    text-align: center;
    /* Top Right Bottom Left */
    margin: 5px 5px 0px 0px;
    padding: 5px 3px 1px 3px;
    border: 1px solid #C0C0C0;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
}

.storeItemImageCellCatalogImageBackColor {
    background-color: #F8F662;
}

.storeItemImageCellNormalBackColor {
    background-color: #e8e4ff;
}

.storeItemImageDelete {
    background-color: white;
    border: 1px solid red;
    position: absolute;
    width: 18px;
    height: 16px;
    left: -3px;
    top: -3px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}

.cartPriceTextInList {
    font-weight: 600;
    font-size: 17px;
}

.cartPriceTextInGrid {
    font-weight: 600;
    font-size: 14px;
    color: #09090B;
}

/* Grid item link wrapper */
.cartItemGridLink {
    text-decoration: none !important;
    display: block;
}

/* Card container */
.cartItemGridTable {
    width: 182px !important;
    height: 182px !important;
    margin: 0 16px 16px 0;
    background-color: white;
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    padding: 8px;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

/* Image container */
.cartItemGridImage {
    width: 100%;
    height: 111px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}

/* Default/icon images - 60x60 centered */
.cartItemGridImage img.icon-image {
    width: 60px !important;
    height: 60px !important;
    object-fit: contain;
}

/* Custom images - fill container with cover */
.cartItemGridImage img.custom-image {
    height: 100%;
    object-fit: cover;
}

/* Title section - fixed height for 2 lines */
.cartItemGridTitle {
    width: 100%;
    height: 2.6em;
    flex-shrink: 0;
    padding-top: 4px;
}

.cartItemGridTitle .formLabel {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
    font-weight: 400;
    text-transform: uppercase;
    line-height: 1.3em;
    color: #09090B;
    margin: 0;
    text-align: left;
}

/* Price row - sticks to bottom */
.cartItemPriceRow {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
}

.cartItemGridCart {
    display: inline-block;
    vertical-align: middle;
}

.cartItemGridCart img.cart-icon {
    width: 16px;
    height: 16px;
    vertical-align: middle;
}

.storeItemUnavailableText {
    font-weight: 600;
    font-size: 16px;
    color: red;
}

.cartHorizontalSepBar {
    background-color: #D9D9D9;
    color: #D9D9D9;
    height: 1px;
    width: 100%;
    display: none;
    border: 0px;
}

.cartCallbackSpinner {
    width: 21px;
    height: 20px;
    background-image: url('Ajax/spinner.gif');
    background-position: top center;
    background-repeat: no-repeat;
    background-color: transparent;
    border-width: 0px;
}

.cartItemName {
    color: #4E3328;
}

.cartStatisticsLabel {
    /* color: #5070A8; */
    font-size: 11px;
}

.cartStatisticsLabelSelected {
    /* color: #FFFFFF; */
    font-size: 11px;
}

.cartGrandTotal {
    padding: 4px 0px;
}

.storeListItemName {
    color: #4A3728;
    font-size: 16px;
}

.storeNote {
    font-weight: normal;
    font-size: 11px;
    color: #4E3328;
    line-height: 14px;
}

.store-image-viewer {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    width: 450px;
    height: 400px;
}

.store-image-viewer-list {
    flex-shrink: 0;
}

.store-image-viewer-main {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.store-image-viewer-main img {
    max-width: 100% !important;
    max-height: 400px;
    width: auto !important;
    height: auto !important;
    object-fit: contain;
}

.storeItemImagePreviewList {
    position: relative;
    border: 1px solid #C0C0C0;
    /* Top Right Bottom Left */
    padding: 5px 3px 1px 3px;
    border-radius: 10px 0px 0px 10px;
    -webkit-border-radius: 10px 0px 0px 10px;
    -moz-border-radius: 10px 0px 0px 10px;
    width: 75px !important;
    height: 390px !important;
}

.storeItemImagePreviewList img {
    object-fit: contain;
}

.cvvPhoto, .bankCheckPhoto, .masterCard, .amex, .discover, .visa, .eCheck {
    background: url('Images/billingBundle.png') no-repeat;
    /* background-image: url('Images/billingBundle.png'); */
    background-color: transparent;
    /* background-repeat: no-repeat; */
    border: none;
    /* border-width: 0px; */
}

.cvvPhoto {
    width: 310px;
    height: 164px;
    background-position: -446px -61px;
}

.bankCheckPhoto {
    width: 446px;
    height: 225px;
    background-position: 0 0;
}

.masterCard {
    background-position: -593px -9px;
    width: 71px;
    height: 50px;
}

.amex {
    background-position: -520px -9px;
    width: 71px;
    height: 50px;
}

.discover {
    background-position: -739px -9px;
    width: 70px;
    height: 50px;
}

.visa {
    background-position: -447px -9px;
    width: 71px;
    height: 50px;
}

.eCheck {
    background-position: -665px -9px;
    width: 71px;
    height: 50px;
}

/* ===================================
   ATTRIBUTES CONTAINER - DESKTOP LAYOUT
   =================================== */
.attributes-container {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.attribute-row {
    display: grid;
    grid-template-columns: 24px auto 1fr;
    gap: 8px;
    align-items: center;
    padding: 4px 0;
}

.attribute-icon {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.attribute-icon input[type="image"] {
    width: 20px;
    height: 20px;
}

.attribute-name {
    white-space: nowrap;
}

.attribute-value {
    min-width: 250px;
}

.attribute-value input[type="text"],
.attribute-value .RadComboBox {
    max-width: 250px;
}

/* ===================================
   END ATTRIBUTES CONTAINER
   =================================== */

/* Meal Account Credits Grid Styling */
#ctl00_cphBody_rgMealAccountCredits {
    border: none !important;
}

#ctl00_cphBody_rgMealAccountCredits .rgHeaderDiv {
    border: none !important;
}

#ctl00_cphBody_rgMealAccountCredits .rgHeader {
    background-color: #F9F9F9 !important;
    background-image: none !important;
    border: none !important;
}

#ctl00_cphBody_rgMealAccountCredits .rgMasterTable {
    border: none !important;
}

#ctl00_cphBody_rgMealAccountCredits .rgDataDiv {
    background-color: #F9F9F9 !important;
}

#ctl00_cphBody_rgMealAccountCredits .rgRow,
#ctl00_cphBody_rgMealAccountCredits .rgAltRow {
    border: none !important;
    background-color: #F9F9F9 !important;
}

#ctl00_cphBody_rgMealAccountCredits .rgMasterTable td,
#ctl00_cphBody_rgMealAccountCredits .rgMasterTable th {
    border: none !important;
}

#ctl00_cphBody_rgMealAccountCredits colgroup {
    border: none !important;
}

/* Attributes Grid Styling */
#ctl00_cphBody_rgAttributes {
    border: none !important;
}

#ctl00_cphBody_rgAttributes .rgHeaderDiv {
    border: none !important;
}

#ctl00_cphBody_rgAttributes .rgHeader {
    background-color: #F9F9F9 !important;
    background-image: none !important;
    border: none !important;
}

#ctl00_cphBody_rgAttributes .rgMasterTable {
    border: none !important;
}

#ctl00_cphBody_rgAttributes .rgRow,
#ctl00_cphBody_rgAttributes .rgAltRow {
    border: none !important;
}

#ctl00_cphBody_rgAttributes .rgMasterTable td,
#ctl00_cphBody_rgAttributes .rgMasterTable th {
    border: none !important;
}

#ctl00_cphBody_rgAttributes thead {
    display: none !important;
}

#ctl00_cphBody_rgAttributes a.formLabel {
    display: inline-block;
    padding: 8px 16px;
    border: 1px solid #E4E4E7;
    border-radius: 8px;
    text-decoration: none;
    background-color: #F9F9F9;
    cursor: pointer;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #09090B;
}

#ctl00_cphBody_clCartList_rgShoppingCart_GridData {
    height: 100% !important;
    overflow-y: auto !important;
}




 /* Tablet Styles - max-width 1024px */
@media (max-width: 1024px) {
    /* Force 2 columns by adjusting the existing 4-column layout */
    #ctl00_cphBody_dlAvailableItems td {
        width: 50% !important;
        display: inline-block !important;
        vertical-align: top !important;
        box-sizing: border-box !important;
        padding: 0 8px !important;
    }

    #ctl00_cphBody_dlAvailableItems tr {
        display: block !important;
    }

    #ctl00_cphBody_dlAvailableItems tbody {
        display: block !important;
    }

    #ctl00_cphBody_dlAvailableItems table {
        display: block !important;
    }

    /* Adjust the item cards to fit in 50% width */
    .cartItemGridTable {
        width: 100% !important;
        max-width: 182px !important;
        margin: 0 0 16px 0 !important;
    }

    /* Stack buttons vertically and position near pagination */
    #ctl00_cphBody_tdStoreButtonsBottom {
        display: flex !important;
        flex-direction: column-reverse !important;
        align-items: center !important;
        gap: 16px !important;
    }

    #ctl00_cphBody_tdStoreButtonsBottom .sectionButton {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        width: 100% !important;
        max-width: 400px !important;
        text-align: center !important;
    }

    #ctl00_cphBody_btnViewCartBottom,
    #ctl00_cphBody_btnProceedToCheckoutFromItems {
        width: 100% !important;
    }
    .store-items-container {
        padding: 0 !important;
    }
    .single-item-container {
        height: auto !important;
        max-height: none !important;
    }
    .checkout-scrollable-content{
        max-height: none !important;
        overflow-x: visible !important;
    }

    /* Tablet: Icon + Name on same line, Value below */
    .attribute-row {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        gap: 8px !important;
        padding: 8px 0 !important;
    }

    .attribute-icon {
        width: 24px !important;
        height: 24px !important;
        flex-shrink: 0 !important;
    }

    .attribute-name {
        flex: 0 0 auto !important;
    }

    .attribute-value {
        flex: 0 0 100% !important;
        padding-left: 32px !important; /* Align with name (24px icon + 8px gap) */
    }

    .attribute-value input[type="text"],
    .attribute-value .RadComboBox {
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* Mobile Styles - max-width 768px */
@media (max-width: 768px) {
    /* Mobile: Icon + Name on same line, Value below */
    .attribute-row {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        gap: 8px !important;
        padding: 12px !important;
        border-radius: 8px !important;
    }

    .attribute-icon {
        width: 24px !important;
        height: 24px !important;
        flex-shrink: 0 !important;
        order: 1 !important;
    }

    .attribute-name {
        flex: 1 1 auto !important;
        order: 2 !important;
        font-size: 16px !important;
        font-weight: 500 !important;
    }

    .attribute-value {
        flex: 0 0 100% !important;
        order: 3 !important;
        padding-left: 32px !important; /* Align with name (24px icon + 8px gap) */
        margin-top: 4px !important;
    }

    .attribute-value input[type="text"],
    .attribute-value .RadComboBox {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Force 1 column - 100% width for single card per row */
    #ctl00_cphBody_dlAvailableItems td {
        width: 100% !important;
        display: block !important;
        box-sizing: border-box !important;
        padding: 0 !important;
    }

    #ctl00_cphBody_dlAvailableItems tr {
        display: block !important;
    }

    #ctl00_cphBody_dlAvailableItems tbody {
        display: block !important;
    }

    #ctl00_cphBody_dlAvailableItems table {
        display: block !important;
        width: 100% !important;
    }

    /* Style the grid card for mobile - image left, details right */
    .cartItemGridLink {
        width: 100% !important;
        display: block !important;
    }

    .cartItemGridTable {
        display: grid !important;
        grid-template-columns: 100px 1fr !important;
        grid-template-rows: auto auto !important;
        column-gap: 16px !important;
        row-gap: 4px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 16px 0 !important;
        padding: 12px !important;
        box-sizing: border-box !important;
        align-items: start !important;
    }

    .cartItemGridImage {
        grid-row: 1 / 3 !important;
        grid-column: 1 !important;
        width: 100px !important;
        height: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .cartItemGridImage img {
        width: 100px !important;
        height: 100px !important;
        object-fit: cover !important;
        border-radius: 8px !important;
    }

    /* Ensure icon-image class also gets mobile styles */
    .cartItemGridImage img.icon-image {
        width: 100px !important;
        height: 100px !important;
        object-fit: cover !important;
        border-radius: 8px !important;
    }

    .cartItemGridTitle {
        grid-row: 1 !important;
        grid-column: 2 !important;
        width: 100% !important;
        text-align: left !important;
    }

    .cartItemGridTitle .formLabel {
        font-size: 16px !important;
        font-weight: 500 !important;
        line-height: 1.3 !important;
        display: block !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    .cartItemPriceRow {
        grid-row: 2 !important;
        grid-column: 2 !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        overflow: hidden !important;
    }

    .cartPriceTextInGrid {
        font-size: 18px !important;
        font-weight: 600 !important;
    }

    /* Ensure container doesn't overflow */
    .store-items-container {
        padding: 0 !important;
        overflow-x: hidden !important;
    }

    /* Single item detail view - mobile adaptations */
    .single-item-container {
        height: auto !important;
        max-height: none !important;
        overflow-y: visible !important;
    }

    .store-item-header {
        flex-wrap: wrap !important;
        gap: 12px !important;
    }

    /* Make the small icon bigger on mobile */
    .item-small-icon {
        width: 60px !important;
        height: 60px !important;
    }

    .item-small-icon img {
        width: 60px !important;
        height: 60px !important;
        object-fit: contain !important;
    }

    .store-item-header .sectionButton {
        width: 100% !important;
        order: 4 !important;
    }

    .store-item-header .sectionButton button,
    .store-item-header .sectionButton input[type="submit"] {
        width: 100% !important;
    }

    /* Item content layout - stack vertically on mobile */
    .item-content-wrapper,
    .item-content-wrapper.has-custom-image {
        flex-direction: column !important;
        gap: 16px !important;
    }

    .item-large-image-column {
        width: 100% !important;
        max-width: 100% !important;
    }

    .item-large-image {
        width: 100% !important;
        max-width: 300px !important;
        height: auto !important;
        margin: 0 auto !important;
        display: block !important;
    }

    .item-options-column {
        width: 100% !important;
    }

    /* Percentage bars - responsive width */
    .item-options-column .SNSPercentageBar {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Ensure text doesn't overflow */
    .item-detail-title {
        font-size: 18px !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    .item-detail-content {
        font-size: 14px !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    /* Stack pagination and buttons vertically on mobile */
    #ctl00_cphBody_tdStoreButtonsBottom {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 16px !important;
        width: 100% !important;
    }

    /* Buttons container - stack vertically */
    #ctl00_cphBody_tdStoreButtonsBottom + td {
        display: block !important;
        width: 100% !important;
        text-align: center !important;
    }

    #ctl00_cphBody_tdStoreButtonsBottom + td .sectionButton {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        width: 100% !important;
        text-align: center !important;
    }

    #ctl00_cphBody_btnViewCartBottom,
    #ctl00_cphBody_btnProceedToCheckoutFromItems {
        width: 100% !important;
    }

    /* Make the bottom table layout stack vertically */
    #ctl00_cphBody_pnlAvailableItems > table > tbody > tr:last-child > td > table {
        display: block !important;
        width: 100% !important;
    }

    #ctl00_cphBody_pnlAvailableItems > table > tbody > tr:last-child > td > table > tbody {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
    }

    #ctl00_cphBody_pnlAvailableItems > table > tbody > tr:last-child > td > table > tbody > tr {
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
    }

    #ctl00_cphBody_pnlAvailableItems > table > tbody > tr:last-child > td > table > tbody > tr > td {
        width: 100% !important;
        text-align: center !important;
    }

    /* List view - also adapt for mobile if shown */
    .pnlAvailableItemsList table {
        display: flex !important;
        flex-direction: row !important;
        gap: 12px !important;
    }

    .pnlAvailableItemsList table td {
        display: block !important;
    }
}
/* Reset and Base Styles */
html, body {
    margin: 0;
    padding: 0;
    height: 100vh;
    overflow: hidden;
    background-color: rgba(248, 247, 255, 1);
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
}

/* ========================================
   SKIP LINK - Hidden until focused
   ======================================== */
.skip-to-main {
    position: absolute;
    top: -100px;
    left: 0;
    background: #431EB7;
    color: white;
    padding: 12px 20px;
    text-decoration: none;
    z-index: 10000;
    font-weight: 500;
    border-radius: 0 0 8px 0;
}

.skip-to-main:focus {
    top: 0;
}

/* ========================================
   MAIN LAYOUT - 2x2 GRID
   Columns: Sidebar (320px) | Content (1fr)
   Rows: Main content (1fr) | Footer (auto)
   Footer spans both columns
   ======================================== */
.main-layout-container {
    display: grid;
    grid-template-columns: 280px 1fr;
    grid-template-rows: 1fr auto;
    height: 100vh;
    width: 100%;
}

/* ========================================
   SIDEBAR - TOP LEFT (Column 1, Row 1)
   ======================================== */
.sidebar-container {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    background-color: rgba(248, 247, 255, 1);
    z-index: 100;
    position: relative;
    /* CRITICAL: Enable scrolling */
    overflow-y: auto !important;
    overflow-x: hidden !important;
    /* For momentum scrolling on touch */
    -webkit-overflow-scrolling: touch;
}

/* Logo */
.ezschoolpaylogo {
    background: url('Master/EzSchoolPayLogo2.png') no-repeat;
    background-position: 0 20px;
    width: 255px;
    height: 92px;
    flex-shrink: 0;
}

/* Menu Container */
.menuContainer {
    background-color: transparent;
    border-radius: 15px;
    width: 100%;
    box-sizing: border-box;
    flex-shrink: 0;
}

.menu-spacer-top {
    height: 16px;
    flex-shrink: 0;
}

.menu-spacer-bottom {
    height: 16px;
    flex-shrink: 0;
}

.menu-sub-container {
    margin: 0px 8px;
}

.menu-logout-buttons {
    text-align: center;
    margin: 16px 16px 0 16px;
    flex-shrink: 0;
}

.sidebar-container:has(.menu-logout-buttons:not([style*="display: none"])) .session-timer-panel {
    margin-bottom: 16px !important;
}

/* Login Form Styles */
.login-form-inner {
    margin: 0px 16px;
}

.login-form-fields {
    width: 100%;
}

.login-field-group {
    margin-bottom: 10px;
}

.login-field-label,
.login-password-label {
    margin-bottom: 2px;
}

.login-field-input {
    margin-top: 2px;
}

.login-forgot-password {
    margin-top: 10px;
    margin-bottom: 16px;
}

.login-button-container {
    margin: 16px 0;
}

/* Email and Password Input Wrappers */
.emailInputWrapper,
.passwordInputWrapper {
    position: relative;
    display: inline-block;
    width: 250px;
}

.emailInputWrapper input[type="text"],
.passwordInputWrapper input[type="password"] {
    padding-left: 35px;
    width: 100%;
    box-sizing: border-box;
}

.emailInputIcon {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background: url('Master/emailIcon.png') no-repeat center;
    background-size: contain;
    pointer-events: none;
}

.passwordInputIcon {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background: url('Master/passwordIcon.png') no-repeat center;
    background-size: contain;
    pointer-events: none;
}

.login-remember-help input[type="checkbox"] {
    width: 20px;
    height: 20px;
    cursor: pointer;
    vertical-align: middle;
    margin-right: 6px;
    accent-color: #2F3034;
}

.login-remember-help label {
    font-size: 14px;
    vertical-align: middle;
    line-height: 20px;
    color: #2F3034 !important;
}

/* Login Sign-In Button States */
.login-signin-button {
    background-color: #D2DC11 !important;
    cursor: pointer !important;
    border: none !important;
    height: 40px !important;
    width: 100%;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif !important;
    font-size: 14px;
    font-weight: 500;
    border-radius: 8px;
    background-image: url('Master/signInIcon.png') !important;
    background-repeat: no-repeat !important;
    background-position: right 90px center !important;
    padding-right: 45px !important;
}

.login-signin-button:hover {
    background-color: #D2DC11 !important;
}

.loginFailedCell {
    margin-top: 8px;
    font: 11px Verdana, Arial, Helvetica, sans-serif;
    color: Red;
}

/* Bottom Sidebar Spacing */
.left-sidebar-spacing {
    margin-top: auto;
    width: 100%;
    flex-shrink: 0;
}

.panel-spacer {
    height: 26px;
}

.signup-inner {
    margin: 0px 16px;
    padding: 10px 0;
}

.signup-button-wrapper,
.guest-button-wrapper {
    margin: 0px 16px;
    text-align: center;
}

.divider-image {
    display: block;
    margin: 10px auto;
}

/* ========================================
   SESSION TIMER (Guest Users - Original Style)
   ======================================== */
.session-timer-panel {
    border-radius: 8px;
    width: 250px;
    height: 40px;
    background-color: #F1EFFD;
    color: #686D7B;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 16px 16px 0 16px;
    box-sizing: border-box;
    font-weight: 500;
    flex-shrink: 0;
}

/* Add margin when sidebar has a visible session timer */
.sidebar-container:has(.session-timer-panel:not([style*="display: none"])) .menuContainer {
    margin-top: 20px !important;
}

.sidebar-container:has(.session-timer-panel:not([style*="display: none"])) #pnlSignupContainer {
    margin-bottom: 30px !important;
}

.session-timer-content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.sessionTimerArea {
    font-size: 15px;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-weight: 500;
    color: #686D7B;
    text-align: center;
}

/* ========================================
   UNIFIED LOGOUT BUTTON
   ======================================== */
.unified-logout-container {
    margin: 16px;
    flex-shrink: 0;
}

.unified-logout-button {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
    max-width: 300px;
    height: 64px;
    border-radius: 8px;
    background-color: #F1EFFD;
    background-image: url('Master/logout.png');
    background-repeat: no-repeat;
    background-position: 20px center;
    background-size: 20px 20px;
    border: none;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.2s ease;
    box-sizing: border-box;
    padding: 12px 20px 8px 50px;
}

.unified-logout-button:hover {
    background-color: #E9E2FF;
}

.logout-text {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #2F3034;
    line-height: 1.2;
}

.logout-timer {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #686D7B;
    line-height: 1.2;
}

/* ========================================
   CONTENT COLUMN - TOP RIGHT (Column 2, Row 1)
   Contains banner and scrollable content
   ======================================== */
.content-column {
    grid-column: 2;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    overflow-x: hidden;
    min-height: 0;
    margin: 24px;
    margin-bottom: 0 !important;
}

/* Banner */
.homepagebanner,
.loggedinbanner {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border-radius: 12px 12px 0 0;
    margin: 5px 5px 0 0;
    overflow: hidden;
    flex-shrink: 0;
}

.homepagebanner {
    background-image: url('Master/banner.png');
    height: 200px;
}

.loggedinbanner {
    background-image: url('Master/banner.png');
    height: 200px;
}

/* Content Wrapper - White box with scrollable content */
/* Content Wrapper - White box - SCROLL ENABLED */
.content-wrapper {
    flex: 1;
    background-color: #FFFFFF;
    margin: 0 5px 5px 0;
    overflow: visible;
    display: flex;
    flex-direction: column;
    border-radius: 0 0 12px 12px;
    min-height: auto;
    position: relative;
}

/* Body Container - SCROLL ENABLED */
.bodyContainer {
    flex: 1;
    padding: 16px 20px;
    box-sizing: border-box;
    background-color: #FFFFFF;
    overflow: visible;
    min-height: 0;
    display: flex;
    flex-direction: column;
    border-radius:8px;
}

/* SNSPanelContent - THIS IS WHERE THE SCROLL HAPPENS */
.SNSPanelContent {
    flex: 1;
    overflow-y: auto;
}

/* ========================================
   FOOTER - BOTTOM, SPANS FULL WIDTH (Both columns, Row 2)
   ======================================== */
.footer-container {
    grid-column: 1 / 3;
    grid-row: 2;
    background-color: rgba(248, 247, 255, 1);
    height: 80px;
    overflow: hidden;
}

.masterFooterLine {
    height: 1px;
    background-color: #DBDBDB;
    margin: 15px 90px;
    margin-top: 15px;
}

.masterFooter {
    display: flex;
    align-items: center;
    padding: 0 35px;
}

.footer-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 20px;
}

.footer-left {
    flex: 0 0 auto;
}

.footer-seal {
    flex: 0 0 auto;
}

.footer-links {
    flex: 1;
    text-align: right;
    white-space: nowrap;
}

/* ========================================
   TEXT STYLES
   ======================================== */
.menuSideLabelHeader {
    display: inline-block;
    color: #2F3034;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 16px;
}

.menuSideLabelSubHeader {
    font: 14px 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-weight: 500;
    color: #09090B;
}

.forgotPassword {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #2F3034 !important;
    float: none;
    text-decoration: none !important;
}

.forgotPassword:hover {
    text-decoration: underline !important;
}

.masterFooterText,
a.masterFooterText {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #444750;
    text-decoration: none;
    font-weight: 500;
    margin-left: 10px;
}

a.masterFooterText:hover {
    text-decoration: none;
}

.masterFooterTextDim {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 13px;
    color: #444750;
    font-weight: 400;
    line-height: 1.4;
}

.masterFooterTextlblSystemInformation {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    color: #707070;
    font-size: 12px;
    font-weight: 400;
}

/* ========================================
   IMAGE ASSETS
   ======================================== */
.masterFooterAppleStore {
    background: url('Master/masterFooterAppStore.png') no-repeat;
    width: 121px;
    height: 35px;
    display: inline-block;
}

.masterFooterGooglePlay {
    background: url('Master/masterFooterGooglePlay.png') no-repeat;
    width: 121px;
    height: 35px;
    display: inline-block;
}

.iconEasy {
    background: url('Master/iconEasy.png') no-repeat;
    width: 54px;
    height: 54px;
    background-size: contain;
}

.iconConvenient {
    background: url('Master/iconConvenient.png') no-repeat;
    width: 54px;
    height: 54px;
    background-size: contain;
}

.iconSecure {
    background: url('Master/iconSecure.png') no-repeat;
    width: 54px;
    height: 54px;
    background-size: contain;
}

.iconFAQ {
    background: url('Master/iconFAQs.png') no-repeat;
    width: 55px;
    height: 55px;
    background-size: contain;
}

.guestText {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #141416;
    max-width: 600px;
    line-height: 1.6;
}

.guestText a {
    color: #141416 !important;
    text-decoration: none;
}

/* ========================================
   ACCESSIBILITY
   ======================================== */
/* Hide focus outline on mouse clicks, show only for keyboard navigation */
a:focus:not(:focus-visible),
input:focus:not(:focus-visible),
select:focus:not(:focus-visible),
textarea:focus:not(:focus-visible),
button:focus:not(:focus-visible) {
    outline: none;
}

/* Show focus outline for keyboard navigation (accessibility) */
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
button:focus-visible {
    outline: 2px solid #431EB7;
    outline-offset: 2px;
}

.skip-to-main {
    position: absolute;
    top: -40px;
    left: 0;
    background: #431EB7;
    color: white;
    padding: 8px;
    text-decoration: none;
    z-index: 100;
}

.skip-to-main:focus {
    top: 0;
}

@media (prefers-contrast: high) {
    a:focus,
    button:focus,
    input:focus,
    select:focus,
    textarea:focus {
        outline: 3px solid currentColor;
        outline-offset: 3px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* ========================================
   GUEST SETTINGS CONTAINER
   ======================================== */
.guest-settings-container {
    background-color: rgba(249, 249, 250, 1);
    padding: 20px;
    border-radius: 8px;
    display: block;
    max-width: 700px;
    box-sizing: border-box;
}

.guest-settings-button {
    text-align: right;
    margin-top: 12px;
}

/* ========================================
   MESSAGES CONTAINER
   ======================================== */
.messagesHeader {
    color: #444750 !important;
    font-size: 14px;
    text-transform: uppercase;
}

/* Override disabled background for DistrictSearch */
.guest-settings-container input.textBoxDisabled {
    background-color: transparent !important;
}

.guest-settings-container input.textBoxWatermark {
    font-style: normal !important;
    color: #09090B !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

/* ========================================
   UTILITY CLASSES
   ======================================== */
.hidden {
    display: none !important;
}

.pageHeader {
    display: inline-block;
    width: fit-content;
    text-transform: uppercase;
    height: 30px;
    border-radius: 5px;
    padding: 7px 16px;
    background-color: #E9E2FF;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #431EB7;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    white-space: nowrap;
    top: 0;
    left: 0;
    margin: 20px 0 12px 0;
    z-index: 10;
}

.required {
    color: red;
    font-weight: bold;
}

.accordion-hidden {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* ========================================
   RESPONSIVE ADJUSTMENTS
   ======================================== */
@media (max-width: 1024px) {
    .main-layout-container {
        grid-template-columns: 320px 1fr;
    }

    .sidebar-container {
        width: 300px;
    }

    .homepagebanner,
    .loggedinbanner {
        height: 180px;
    }

    .footer-content {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .footer-links {
        text-align: left;
        white-space: normal;
    }

    .masterFooter {
        height: auto;
        padding: 15px 20px;
    }

    .footer-container {
        height: auto;
        min-height: 65px;
    }

    .masterFooterLine {
        margin: 0 20px;
        margin-top: 15px;
    }
}

@media (max-width: 768px) {
    .main-layout-container {
        display: flex;
        flex-direction: column;
        min-height: 100vh;
    }

    .sidebar-container {
        width: 100%;
        height: auto;
        max-height: none;
        overflow-y: visible;
    }

    .content-column {
        flex: 1;
        min-height: 0;
    }

    .homepagebanner,
    .loggedinbanner {
        height: 150px;
        margin: 5px;
    }

    .content-wrapper {
        margin: 0 5px 5px 5px;
    }

    .footer-container {
        width: 100%;
        height: auto; /* Allow footer to expand */
        min-height: 65px;
    }

    .footer-content {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .footer-links {
        text-align: left;
    }

    .masterFooter {
        height: auto;
        padding: 15px 20px;
    }

    .unified-logout-button {
        width: 100%;
    }
}

/* ========================================
   FOOTER SYSTEM INFO ICON + TOOLTIP
   ======================================== */
.footer-system-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.footer-sysinfo-icon {
    position: relative;
    display: inline-flex;
    cursor: pointer;
}

.footer-cpu-icon {
    width: 16px;
    height: 16px;
    opacity: 0.6;
}

.footer-sysinfo-icon:hover .footer-cpu-icon {
    opacity: 1;
}

.footer-sysinfo-tooltip {
    display: none;
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background-color: #431EB7;
    color: #e9e2ff;
    font-size: 11px;
    padding: 6px 10px;
    border-radius: 4px;
    white-space: nowrap;
    margin-bottom: 6px;
    z-index: 100;
}

.footer-sysinfo-icon:hover .footer-sysinfo-tooltip {
    display: block;
}

/* ========================================
   LEGACY COMPATIBILITY
   ======================================== */
.masterContentTablePC,
.masterContentTableTablet {
    width: 100% !important;
}

.iconText {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 16px;
    padding-bottom: 35px;
    font-weight: 500;
    color: #2F3034;
}

.contentTopMargin {
    height: 20px;
}
/* Icons for grid link buttons */

.userIcon, .selectIcon, .editIcon, .deleteIcon, .detailsIcon, .schoolIcon,
.districtIcon, .parentIcon, .trashIcon, .questionIcon, .questionLgIcon,
.questionSmallIcon
{
    background: url('Images/IconBundle.png') no-repeat;
}

.userIcon
{
    background-position: -299px -20px;
	width: 19px;
	height: 17px;
}

.selectIcon
{
    background-position: -337px 0;
    width: 17px;
    height: 17px;
}

.notebookIcon
{
    background: url('Master/notepad-icon.png') no-repeat center;
    background-size: 20px 20px;
    border: none;
    width: 20px;
    height: 20px;
}

.editIcon
{
    background-position: -355px 0;
	width: 17px;
	height: 17px;
}

.deleteIcon
{
    background-position: -355px -36px;
	width: 17px;
	height: 17px;
}

.detailsIcon
{
    background-position: -279px -20px;
	width: 19px;
	height: 19px;
}

.districtIcon
{
	background-position: -337px -36px;
	width: 17px;
	height: 17px;
}

.schoolIcon
{
	background-position: -337px -18px;
	width: 17px;
	height: 17px;
}

.parentIcon{
	background-position: -355px -18px ;
	width: 17px;
	height: 17px;
}

.trashIcon{
	background: url('../Style/Master/trash.png') no-repeat center;
	background-size: 20px 20px;
	border: none;
	width: 24px;
	height: 24px;
}

.questionIcon
{
	background-position: -373px 0;
	width: 17px;
	height: 17px;
}

.questionLgIcon
{
    background-image: url('Master/info-circle.png');
	width: 30px;
	height: 30px;
	vertical-align: middle;
	display: inline-block;
    background-position: 50%;
}

.questionSmallIcon
{
	background: url('Master/info-circle.png') no-repeat center;
	background-size: 16px 16px;
	border: none;
	width: 16px;
	height: 16px;
}

/* New table action icons */
.table-edit-icon
{
    background-image: url('Master/table-edit-icon.png');
    background-repeat: no-repeat;
    background-position: center;
    width: 17px;
    height: 17px;
}

.credit-icon
{
    background-image: url('Master/credit-icon.png');
    background-repeat: no-repeat;
    background-position: center;
    width: 17px;
    height: 17px;
}

.table-remove-icon
{
    background-image: url('Master/table-remove-icon.png');
    background-repeat: no-repeat;
    background-position: center;
    width: 17px;
    height: 17px;
}

/* Icons and styles for Image Buttons (that include text) */

.blue 
{
    border: solid 1px #2F3034;
}

.clear
{
    border: none;
    background-color: transparent;
}

.green
{
    border: solid 1px #a7b539;
	background-color: #a7b539;
}

.red
{
    border: solid 1px #F35555;
    background-color: #F86060;
}

.gray
{
    border: solid 1px #D9D9D9;
    background-color: #F5F5F5;
}

.buttonClose
{
    background-image: url(Images/IconBundle_Originals/close.png);
    background-position: 2px 7px;
    background-repeat: no-repeat;
}

.buttonCopy 
{
    background-image: url(Images/IconBundle_Originals/copy.png);
    background-position: 0px 8px;
    background-repeat: no-repeat;
}

.buttonDelete 
{
    background-image: url(Images/IconBundle_Originals/delete.png);
    background-position: 2px 8px;
    background-repeat: no-repeat;
}

.buttonDetails 
{
    background-image:url(Images/IconBundle_Originals/details.png);
    background-position: 2px 8px;
    background-repeat: no-repeat;
}

.buttonEdit 
{
    background-image:url(Images/IconBundle_Originals/edit.png);
    background-position: 6px 5px;
    background-repeat: no-repeat;
}

.buttonLogin 
{
    width: 250px;
    height: 40px;
    background-repeat: no-repeat;
    background-color: transparent;
}

.buttonNext 
{
    background-image: url(Images/IconBundle_Originals/next.png);
    background-position: 2px 8px;
    background-repeat: no-repeat;
}

.buttonPrint 
{
    background-image: url(Images/IconBundle_Originals/print.png);
    background-position: 2px 8px;
    background-repeat: no-repeat;
}

.buttonRestart 
{
    background-image:url(Images/IconBundle_Originals/Restart.png);
    background-position: 2px 8px;
    background-repeat:no-repeat;
}

.buttonProcessing 
{
    background-image:url(Images/IconBundle_Originals/processing.png);
    background-position: 2px 8px;
    background-repeat:no-repeat;
}

.saveButtonShadow
{
    position:relative; 
    left:-8px;
}

.button
{
    font-family: 'Poppins',Verdana, Arial, Helvetica, sans-serif;
    display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	color: #2F3034;
	font-size: 14px;
	font-weight: 500;
    line-height: 20px;
    -o-border-radius: .4em;
	-webkit-border-radius: .4em; 
	-moz-border-radius: .4em;
	border-radius: .4em;
	/* text-shadow: 0 1px 1px rgba(0,0,0,.3); */
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
    /* top / right / bottom / left */
	padding: 5px 8px 7px 8px;
    height: 40px;
}

.buttonBlank
{
    font-family: Verdana, Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	color: White;
	font-size: 14px;
	font-weight: bold;
	-webkit-border-radius: .4em; 
	-moz-border-radius: .4em;
	border-radius: .4em;
	/* text-shadow: 0 1px 1px rgba(0,0,0,.3); */
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
    /* top / right / bottom / left */
    padding: 5px 10px 5px 10px;
    height: 40px;
}

.buttonClear
{
    font-family: Verdana, Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	color: #6AA8DB;
	font-size: 14px;
	font-weight: bold;
	/* text-shadow: 0 1px 1px rgba(0,0,0,.3); */
    /* top / right / bottom / left */
    padding: 0px 8px 0px 34px;
}

.buttonNavigation
{
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font-size: 14px;
	font-weight: 500;
	-webkit-border-radius: .4em; 
	-moz-border-radius: .4em;
	border-radius: .4em;
	/*
        text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
    	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
	    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
	    box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
    */
    /* top / right / bottom / left */
    padding: 6px 0px 4px 0px;
    margin-left: 4px;
    width: 35px;
    height: 35px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 16px 16px;
}

.buttonNavigationEnabled
{
    color: #080606;
}

.buttonNavigationDisabled
{
    color: #DFDFDF;
}

.buttonNavigationSelected
{
    background-color: #D2DC11 !important;
    color: #000000 !important;
    border: none !important;
}

/* Navigation arrow icons */
.buttonNavigation[value="<<"] {
    background-image: url(Master/darrowleft.png) !important;
    text-indent: -9999px;
    overflow: hidden;
    color: transparent !important;
}

.buttonNavigation[value="<"] {
    background-image: url(Master/arrow-left.png) !important;
    text-indent: -9999px;
    overflow: hidden;
    color: transparent !important;
}

.buttonNavigation[value=">"] {
    background-image: url(Master/arrow-right.png) !important;
    text-indent: -9999px;
    overflow: hidden;
    color: transparent !important;
}

.buttonNavigation[value=">>"] {
    background-image: url(Master/darrowright.png) !important;
    text-indent: -9999px;
    overflow: hidden;
    color: transparent !important;
}

.buttonNavigation.buttonNavigationDisabled[value="<<"],
.buttonNavigation.buttonNavigationDisabled[value="<"],
.buttonNavigation.buttonNavigationDisabled[value=">"],
.buttonNavigation.buttonNavigationDisabled[value=">>"] {
    opacity: 0.3;
}

.buttonNavigationElipsis
{
    font-size: 16px;
    padding-top: 3px;
    margin-left: 4px;
    margin-right: 2px;
}

.buttonYellow,
.buttonSave,
.buttonSearch,
.buttonShowMessages,
.buttonContinue,
.buttonContinueStudents,
.buttonAddStudent,
.buttonAddCreditCard,
.buttonAddRecurringPayment,
.buttonMakePayment,
.buttonViewCartStore,
.buttonCheckoutStore,
.buttonAddToCartStore,
.buttonShopNow,
.buttonCheckoutCart,
.buttonViewReceipt,
.buttonHandleDispute,
.buttonMarkChargebacks,
.buttonExportReport,
.buttonQueueReport,
.buttonAboutTransactions,
.buttonConfigure,
.useSelected,
.buttonCopyReplace
{
    border: 1px solid #D2DC11;
    border-radius: 8px;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 500;
    height: 40px;
    padding: 8px 16px 8px 40px;
    background-color: #D2DC11;
    background-repeat: no-repeat;
    background-position: 12px center;
    cursor: pointer;
    color: #2F3034;
    white-space: nowrap;
    box-shadow: none !important;
}

.buttonTransparent,
.buttonCancel,
.buttonStartOver,
.buttonCalculate,
.buttonSetSpendingLimits,
.buttonDistrictSearch,
.buttonChangeSecurity,
.buttonChangePassword,
.buttonAddAddress,
.buttonEditAddress,
.buttonContactSchool,
.buttonRefreshTransparent,
.buttonSwitchTransparent
{
    border: 1px solid #E4E4E7;
    border-radius: 8px;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 500;
    height: 40px;
    padding: 8px 16px 8px 40px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: 12px center;
    cursor: pointer;
    color: #2F3034;
    white-space: nowrap;
    box-shadow: none !important;
}

.buttonGhost,
.buttonBack,
.buttonCancelAccount,
.buttonCloseAccount
{
    border: none;
    border-radius: 8px;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 500;
    height: 40px;
    padding: 8px 16px 8px 40px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: 12px center;
    cursor: pointer;
    color: #2F3034;
    white-space: nowrap;
    box-shadow: none !important;
}

.buttonDanger,
.buttonUnlinkStudent,
.buttonRemoveItem,
.buttonRemoveBillingMethod
{
    border: 1px solid #E4E4E7;
    border-radius: 8px;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 500;
    height: 40px;
    padding: 8px 16px 8px 40px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: 12px center;
    cursor: pointer;
    color: #DC2626;
    white-space: nowrap;
    box-shadow: none !important;
}

.buttonBackIconOnly
{
    background-image: url(Master/back-students-icon.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 20px;
    height: 20px;
    border: none;
    cursor: pointer;
    padding: 0;
    margin: 0;
    background-color: transparent;
}

.buttonSave { background-image: url(Master/tick-circle.png); }
.buttonSearch { background-image: url(Master/search-normal.png); }
.buttonShowMessages { background-image: url(Master/eye-icon.png); }
.buttonContinue { background-image: url(Master/signInIcon.png); }
.buttonContinueStudents { background-image: url(Master/signInIcon.png); }
.buttonAddStudent { background-image: url(Master/add-student-icon.png); }
.buttonAddCreditCard { background-image: url(Master/add-credit-card-icon.png); }
.buttonAddRecurringPayment { background-image: url(Master/recurring-icon.png); }
.buttonMakePayment { background-image: url(Master/shopping-bag.png); }
.buttonViewCartStore { background-image: url(Master/cart-icon.png); }
.buttonCheckoutStore { background-image: url(Master/proceed-checkout.png); }
.buttonAddToCartStore { background-image: url(Master/cart-icon.png); }
.buttonShopNow { background-image: url(Master/cart-icon.png); }
.buttonCheckoutCart { background-image: url(Master/dollar-square.png); }
.buttonViewReceipt { background-image: url(Master/view-receipt-icon.png); }
.buttonHandleDispute { background-image: url(Master/arrow-right.png); }
.buttonMarkChargebacks { background-image: url(Master/recurring-icon.png); }
.buttonExportReport { background-image: url(Master/export-icon.png); }
.buttonQueueReport { background-image: url(Master/queue-icon.png); }
.buttonAboutTransactions { background-image: url(Master/about-transactions.png); }
.buttonConfigure { background-image: url(Master/table-edit-icon.png); }
.useSelected { background-image: url(Master/tick-circle.png); }
.buttonCopyReplace { background-image: url(Master/copy.png); }

.buttonCancel { background-image: url(Master/Close.png); }
.buttonStartOver { background-image: url(Master/refresh-2.png); }
.buttonCalculate { background-image: url(Master/view-transactions-icon.png); }
.buttonSetSpendingLimits { background-image: url(Master/set-spending-limit-icon.png); }
.buttonDistrictSearch { background-image: url(Master/search-normal.png); }
.buttonChangeSecurity { background-image: url(Master/security-question-icon.png); }
.buttonChangePassword { background-image: url(Master/change-password-icon.png); }
.buttonAddAddress { background-image: url(Master/add-address-icon.png); }
.buttonEditAddress { background-image: url(Master/table-edit-icon.png); }
.buttonContactSchool { background-image: url(Master/search-normal.png); }
.buttonRefreshTransparent { background-image: url(Master/refresh-2.png); }
.buttonSwitchTransparent { background-image: url(Master/switch-icon.png); }

.buttonBack { background-image: url(Master/back-students-icon.png); }
.buttonCancelAccount { background-image: url(Master/cancel-account-icon.png); }
.buttonCloseAccount { background-image: url(Master/close-account-icon.png); color: #ac3401; border: 1px solid #ac3401}

.buttonUnlinkStudent { background-image: url(Master/close-account-icon.png); }
.buttonRemoveItem { background-image: url(Master/trash.png); }
.buttonRemoveBillingMethod { background-image: url(Master/table-remove-icon.png); }
input.textBox,
select.textBox,
textarea.textBox
.RadComboBox_SNS.textBox,
.RadPicker_SNS.textBox .riTextBox,
.RadPicker_SNS.textBox .RadInput .riTextBox 
{
    font: 14px 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    height: 40px !important;
}
/* Show focus border only on keyboard navigation */
input.textBox:focus-visible,
select.textBox:focus-visible,
textarea.textBox:focus-visible,
.RadComboBox_SNS.textBox:focus-visible,
.RadPicker_SNS.textBox .riFocused:focus-visible,
.RadPicker_SNS.textBox .RadInput .riFocused:focus-visible,
.RadMaskedTextBox_SNS .riTextBox:focus-visible,
.riTextBox.riEnabled.textBox:focus-visible,
html body .riSingle:focus-visible,
html body .RadComboBox_SNS:focus-visible {
    border-color: #431EB7;
    outline: 1px solid #431EB7;
    outline-offset: 1px;
}

input.textBox:focus,
select.textBox:focus,
textarea.textBox:focus,
.RadComboBox_SNS.textBox:focus,
.RadPicker_SNS.textBox .riFocused,
.RadPicker_SNS.textBox .RadInput .riFocused,
.RadMaskedTextBox_SNS .riTextBox:focus,
.riTextBox.riEnabled.textBox:focus,
html body .riSingle:focus,
html body .RadComboBox_SNS:focus {
    outline: none;
}

input.textBox,
select.textBox,
textarea.textBox
{
    /* top / right / bottom / left */
    padding: 0px 4px 0px 4px;
}

input.textBox,
select.textBox,
textarea.textBox,
.RadComboBox_SNS.textBox,
.RadPicker_SNS.textBox .riTextBox,
.RadPicker_SNS.textBox .RadInput .riTextBox,
.riTextBox.riEnabled.textBox
{
    border: 1px solid #cdcbcb;
    border-radius: 6px;
   	-webkit-border-radius: 6px; 
	-moz-border-radius: 6px;
    -o-border-radius: 6px;
    /* box-shadow: inset 0px 2px 5px 0px #eae9e9; */
    /* background-color: White; */
    color: Black;
    font: 14px 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-style: normal;
    height: 40px;
    background-color: #FFFFFF;
}

input.textBoxDisabled
{
    min-width:250px;
    background: none !important;
    background-color: #e8e8e8 !important;
    border: 1px solid #d8d8d8;
}

input.textBoxSoftDisabled
{
    background: none !important;
    background-color: #f2f2f2 !important;
    border: 1px solid #d8d8d8;
    min-width:250px;
}

input.textBoxDisabled:focus-visible,
input.textBoxSoftDisabled:focus-visible
{
    border: 1px solid #431EB7;
    cursor: default;
}

input.textBoxWatermark 
{
    color: #27272b;
    font-style: normal !important;
}

.validator {
    color: #ac3401;
    font-size: 12px;
    display: block;
    margin-top: 5px;
    min-height: 18px;
    line-height: 1.2em;
}

/* Error state - red border and light red background highlight */
input[aria-invalid="true"],
select[aria-invalid="true"],
textarea[aria-invalid="true"],
.RadComboBox_SNS[aria-invalid="true"] .rcbInner, 
div.RadComboBox_SNS[aria-invalid="true"] table td.rcbInputCell,
.RadMaskedTextBox_SNS[aria-invalid="true"] .riTextBox,
html body .RadInput_SNS[aria-invalid="true"] .riTextBox,
.error-field {
    border-color: #ac3401 !important;
    background-color: #fef2f2 !important;
}

/* Error state focus */
input[aria-invalid="true"]:focus-visible,
select[aria-invalid="true"]:focus-visible,
textarea[aria-invalid="true"]:focus-visible,
.RadComboBox_SNS[aria-invalid="true"]:focus-within .rcbInner {
    border-color: #ac3401 !important;
    outline: 1px solid #ac3401;
    outline-offset: 1px;
}


.autoSideMargin {
    width: 18%;
}

.autoTopMargin {
    height: 32px;
}

.autoRed {
    color: red !important;
}

.autoGray {
    color: #B8B8B8;
}

input.autoTextBox {
    font-size: 30px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    height: 38px;
    padding-left: 5px;
    width: 100%;
}

.autoText, a.autoText, a.autoText:link {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 30px;
    font-weight: normal;
    color: #4E3328;
    text-decoration: none;
    line-height: 34px;
}

.autoLabel, a.autoLabel, a.autoLabel:link {
    color: #9BA600;
    line-height: 45px;
}

.autoButton {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    display: inline-block;
    outline: none;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    color: White;
    font-size: 24px;
    font-weight: bold;
    -o-border-radius: .4em;
    -webkit-border-radius: .4em;
    -moz-border-radius: .4em;
    border-radius: .4em;
    text-shadow: 0 1px 1px rgba(0,0,0,.3);
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
    /* top / right / bottom / left */
    padding: 5px 20px 5px 20px;
    height: 52px;
}

.autoButtonBlue {
    border: solid 1px #6DABDC;
    background-color: #5091cd;
}

.autoButtonGray {
    border: solid 1px #D9D9D9;
    background-color: #F5F5F5;
}

.autoButtonRed {
    border: solid 1px #F35555;
    background-color: #F86060;
}

@media (max-width: 980px) {
    input.autoTextBox {
        font-size: 24px;
        height: 30px;
    }

    .autoSideMargin {
        width: 15%;
    }

    .autoTopMargin {
        height: 12px;
    }

    .autoText, a.autoText, a.autoText:link {
        font-size: 24px;
        line-height: 28px;
    }

    .autoLabel, a.autoLabel, a.autoLabel:link {
        font-weight: bold;
        line-height: 32px;
    }

    .autoButton {
        font-size: 20px;
        /* top / right / bottom / left */
        padding: 4px 15px 4px 15px;
        height: 44px;
    }
}



.SNSWindowContent {
    overflow-x: auto !important;
    box-sizing: border-box !important;
}

/* Hide empty spacer cells */
.formTable td:empty {
    display: none !important;
}

/* Basic input responsiveness */
.formTable input[type="text"],
.formTable .RadComboBox,
.formTable .RadMaskedTextBox {
    max-width: 100% !important;
    box-sizing: border-box !important;
    font-size: 14px !important;
}

/* Remove border from RadComboBox inner elements */
.RadComboBox .rcbInner {
    border: none !important;
    padding-top: 10px !important;
}

/* Fix RadComboBox button alignment */
.RadComboBox .rcbActionButton,
.RadComboBox .rcbArrowCell {
    padding-top: 10px !important;
}
.SNSWindowTable{
    width: 300px;
}
/* Tablet responsiveness */
@media (max-width: 1024px) and (min-width: 768px) {
    
    .SNSWindowTable {
        width: 400px !important;
    }
    .SNSWindowContent {
        padding: 12px !important;
    }
    
    /* Allow table cells to wrap content better */

    div.RadComboBox_SNS table td.rcbInputCell {
        height: 20px; 
   }
    .formTable td {
        padding: 8px 4px !important;
        vertical-align: top !important;
        white-space: normal !important;
    }
    
    /* Responsive input sizing */
    .formTable input[type="text"] {
        min-width: 120px !important;
        width: 100% !important;
    }
    
    .formTable .RadComboBox {
        min-width: 120px !important;
        max-width: 200px !important;
    }
    
    .formTable .RadComboBox table {
        width: 100% !important;
        max-width: 200px !important;
    }
    
    /* Form labels */
    .formLabel {
        font-size: 14px !important;
        line-height: 1.2 !important;
    }
    
    /* Checkboxes */
    .checkbox-container {
        white-space: nowrap !important;
        margin: 8px 0 !important;
    }
    
    /* Dialog buttons */
    .sectionButton input[type="button"] {
        font-size: 15px !important;
        margin: 8px 6px !important;
        min-width: 80px !important;
    }
}

/* Mobile responsiveness */
@media (max-width: 767px) {
    .bodyContainer{
        padding: 0 !important
    }
    
    .SNSWindowTable {
        width: 95vw !important;
        max-width: none !important;
        max-height: 90vh !important;
        margin: 5px auto !important;
        overflow: hidden !important;
    }
    
    .SNSWindowContent {
        padding: 10px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        flex: 1 !important;
        max-height: calc(90vh - 120px) !important;
    }
    
    /* Stack form elements vertically */
    .formTable tr {
        display: block !important;
        margin-bottom: 15px !important;
        border-bottom: 1px solid #eee !important;
        padding-bottom: 10px !important;
    }
    
    .formTable td {
        display: block !important;
        padding: 5px 0 !important;
        border: none !important;
    }
    
    /* Keep search controls inline (textbox + search icon) */
    table[cellpadding="0"][cellspacing="0"] tr,
    table[cellpadding="0"][cellspacing="0"] td {
        display: table-row !important;
    }
    
    table[cellpadding="0"][cellspacing="0"] td {
        display: table-cell !important;
        padding: 0 !important;
        vertical-align: bottom !important;
    }
    
    /* Full width inputs on mobile */
    .formTable input[type="text"],
    .formTable .RadComboBox,
    .formTable .RadMaskedTextBox {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        font-size: 16px !important;
    }
    
    .formTable .RadComboBox table {
        width: 100% !important;
        max-width: none !important;
    }
    
    /* Mobile form labels */
    .formLabel {
        font-size: 15px !important;
        display: block !important;
        margin-bottom: 5px !important;
    }
    
    /* Mobile checkboxes */
    .checkbox-container {
        display: block !important;
        margin: 15px 0 !important;
        padding: 5px 0 !important;
    }
    
    .checkbox-container input[type="checkbox"] {
        margin-right: 8px !important;
        transform: scale(1.2) !important;
    }
    
    .checkbox-container label {
        font-size: 16px !important;
        line-height: 1.4 !important;
    }
    
    /* Mobile dialog header */
    .SNSWindowHeader {
        font-size: 16px !important;
        padding: 10px !important;
        text-align: center !important;
    }
    
    /* Mobile buttons - stack vertically */
    .sectionButton {
        text-align: center !important;
        padding: 20px 0 !important;
    }
    
    .sectionButton input[type="button"] {
        display: block !important;
        width: 100% !important;
        max-width: 280px !important;
        margin: 10px auto !important;
        /* padding: 14px 20px !important; */
        font-size: 16px !important;
        min-height: 44px !important;
    }
}

@media (max-width: 600px) {
    input.autoTextBox {
        font-size: 16px;
        height: 24px;
    }

    .autoSideMargin {
        width: 10%;
    }

    .autoTopMargin {
        height: 4px;
    }

    .autoText, a.autoText, a.autoText:link {
        font-size: 16px;
        line-height: 18px;
    }

    .autoLabel, a.autoLabel, a.autoLabel:link {
        font-weight: bold;
        line-height: 24px;
    }

    .autoButton {
        font-size: 16px;
        /* top / right / bottom / left */
        padding: 3px 10px 3px 10px;
        height: 32px;
    }
}

/* Additional responsive improvements for dialog elements */
@media (max-width: 1024px) {
    /* Checkbox container improvements */
    .checkbox-container {
        display: block !important;
        margin: 10px 0 !important;
        white-space: nowrap;
    }
    
    .checkbox-container label {
        padding-left: 5px;
        font-size: 14px;
    }
    
    /* Dialog header responsiveness */
    .SNSWindowHeader {
        font-size: 16px !important;
        padding: 10px 15px !important;
        text-align: center;
    }
    
    /* Section button improvements */
    .sectionButton {
        margin-top: 20px !important;
        text-align: center !important;
    }
    
    .sectionButton input[type="button"] {
        margin: 5px 10px !important;
        min-width: 80px;
        font-size: 14px !important;
    }
}

@media (max-width: 767px) {
    /* Mobile-specific dialog improvements */
    .checkbox-container {
        display: block !important;
        margin: 15px 0 !important;
        padding: 5px 0;
    }
    
    .checkbox-container input[type="checkbox"] {
        margin-right: 8px;
        transform: scale(1.2);
    }
    
    .checkbox-container label {
        font-size: 16px !important;
        line-height: 1.4;
    }
    
    /* Button stacking for mobile */
    .sectionButton input[type="button"] {
        display: block !important;
        width: 100% !important;
        margin: 10px 0 !important;
        max-width: 300px;
        margin-left: auto !important;
        margin-right: auto !important;
    }
}

/* ========================================
   MOBILE SIDEBAR TOGGLE
   Collapsible sidebar for mobile devices
   ======================================== */

/* Mobile menu toggle button */
.mobile-menu-toggle {
    display: none;
    position: fixed;
    top: 20px;
    left: 20px;
    z-index: 1000;
    width: 48px;
    height: 48px;
    background-color: #FFFFFF;
    border: 2px solid #D1D1D6;
    border-radius: 8px;
    cursor: pointer;
    padding: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.mobile-menu-toggle:hover {
    background-color: #F9F9FA;
}

/* Hamburger icon */
.mobile-menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    background-color: #2F3034;
    margin: 5px auto;
    transition: all 0.3s ease;
}

@media (max-width: 768px) {
    /* Show the toggle button on mobile */
    .mobile-menu-toggle {
        display: block;
    }
    
    /* Hide sidebar by default on mobile */
    .sidebar-container {
        position: fixed;
        left: -320px;
        top: 0;
        width: 320px;
        height: 100vh;
        z-index: 999;
        background-color: rgba(248, 247, 255, 1);
        transition: left 0.3s ease;
        overflow: visible; /* No clipping - let submenus overflow like desktop */
        box-shadow: 2px 0 8px rgba(0, 0, 0, 0.1);
        padding-bottom: 100px;
    }
    
    /* Make sidebar scrollable without clipping submenus */
    .sidebar-container > * {
        overflow: visible;
    }
    
    /* Prevent menu from overlapping logout button */
    .sidebar-container .menuContainer {
        max-height: none;
        overflow: visible;
        margin-bottom: 20px;
    }
    
    /* Ensure logout buttons stay at bottom and don't get overlapped */
    .menu-logout-buttons,
    .unified-logout-container {
        position: relative;
        z-index: 100 !important;
        margin-top: 160px;
    }
    
    /* Show sidebar when toggle is active */
    body.sidebar-visible .sidebar-container {
        left: 0;
    }
    
    /* Animate hamburger to X when open */
    body.sidebar-visible .mobile-menu-toggle span:nth-child(1) {
        transform: rotate(45deg) translate(5px, 5px);
    }
    
    body.sidebar-visible .mobile-menu-toggle span:nth-child(2) {
        opacity: 0;
    }
    
    body.sidebar-visible .mobile-menu-toggle span:nth-child(3) {
        transform: rotate(-45deg) translate(7px, -7px);
    }
    
    /* Overlay backdrop when sidebar is open */
    .sidebar-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.5);
        z-index: 998;
    }
    
    body.sidebar-visible .sidebar-overlay {
        display: block;
    }
    
    /* Content stays on the right, full width */
    .content-column {
        margin-left: 0 !important;
        width: 100% !important;
        min-height: 80vh; /* Ensure content takes up at least 70% of viewport height */
    }
    
    /* Adjust main layout for mobile */
    .main-layout-container {
        display: block;
        min-height: 100vh; /* Ensure full page height */
    }
    
    /* Footer stays at bottom */
    .footer-container {
        width: 100%;
        margin-left: 0;
    }
    
    /* Messages - align "Mark as Read" to left on mobile */
    #ctl00_cphBody_umUserMessages_rgMessages div[style*="text-align: right"] {
        text-align: left !important;
    }
    
    /* Keep label and required asterisk on same line */
    .formLabel,
    .required {
        display: inline !important;
    }
    
    /* Stack usersetup action buttons vertically on mobile */
    .page-actions {
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
    }
    
    .page-actions input[type="button"] {
        width: 100% !important;
    }
    
    /* Fix RadComboBox responsive issues */
    .RadComboBox {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .RadComboBox table {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .rcbInputCell {
        width: calc(100% - 25px) !important;
    }
    
    .rcbInput {
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    /* Fix usersetup form fields on mobile */
    .page-form-field {
        width: 100% !important;
    }
    
    .page-form-field .RadComboBox {
        width: 100% !important;
    }
    
    /* Fix content page height on mobile */
    .content-page {
        height: auto !important;
    }
    
    /* School Search Window - set width for mobile */
    #cphBody_ssSchoolSearch_swSearchWindow {
        width: 300px !important;
    }
    
    /* Flex containers - stack vertically on mobile */
    .flex-center-gap-30 {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 15px !important;
    }
    
    .flex-center-gap-30 > div {
        width: 100% !important;
    }
    
    .flex-center-gap-30 input[type="text"],
    .flex-center-gap-30 .RadComboBox {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .flex-center-gap-30 .RadComboBox table {
        width: 100% !important;
    }
    
    /* Store top content - stack buttons vertically on mobile */
    .store-top-content > div[style*="display: flex"] {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    
    .store-top-content > div[style*="display: flex"] input[type="button"] {
        width: 100% !important;
    }
    
    /* Store search container - stack dropdowns and search vertically on mobile */
    .store-search-container {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    
    .store-search-filters,
    .store-search-input-wrapper {
        width: 100% !important;
        margin-bottom: 10px !important;
    }
    
    .store-search-filters .RadComboBox {
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 10px !important;
    }
    
    .store-search-input-wrapper {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        width: 100% !important;
    }
    
    .store-search-input-wrapper .RadInput {
        flex: 1 !important;
        width: auto !important;
        max-width: none !important;
        margin-right: 10px !important;
    }
}
#cphBody_pnlWelcome {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.login-page-spacer-top {
    height: 16px;
    flex-shrink: 0;
}

/* About EZSchoolPay Badge */
.about-badge-container {
    margin-left: 20px;
    flex-shrink: 0;
}

.about-badge {
    width: 167px;
    height: 30px;
    border-radius: 5px;
    padding: 7px 16px;
    background-color: #E9E2FF;
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #431EB7;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    white-space: nowrap;
}

/* Features Grid Layout */
.features-container {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
    max-width: 1200px;
    margin: 0 auto;
    margin-top: 40px;
    margin-left: 20px;
    flex-shrink: 0;
}

.feature-item {
    flex: 1 1 48%;
    min-width: 400px;
}

.feature-header {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    gap: 12px;
}

.feature-icon {
    flex-shrink: 0;
}

.pageSubHeader {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 26px;
    font-weight: 500;
    color: #2F3034;
}

.iconText {
    font-family: 'Poppins', Verdana, Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #2F3034;
    line-height: 1.5;
    padding-bottom: 8px;
}

/* Hide the empty paragraph between features and app downloads */
#cphBody_pnlWelcome > p {
    display: none;
}

/* Mobile App Downloads Section */
.app-downloads-container {
    text-align: right;
    margin-top: auto;
    padding-right: 40px;
    flex-shrink: 0;
}

.app-downloads-table {
    display: inline-block;
}

.app-downloads-table tr {
    display: flex;
    gap: 10px;
}

.app-downloads-cell-google,
.app-downloads-cell-apple {
    display: inline-block;
}

.app-downloads-cell-google {
    width: 150px;
}

.app-downloads-cell-apple {
    width: 121px;
}

/* Responsive Design for Features */
@media (max-width: 900px) {
    .feature-item {
        flex: 1 1 100%;
        min-width: 300px;
    }
    
    .app-downloads-container {
        text-align: center;
        padding-right: 0;
        margin-top: 40px;
    }
}

@media (max-width: 600px) {
    .feature-item {
        min-width: 250px;
    }
    
    .about-badge {
        width: auto;
        max-width: 200px;
    }
}