@charset "UTF-8";

@font-face {
    font-family: "Cairo";
    src: url(../../fonts/Cairo-Regular.woff2) format("woff2"), url(../../fonts/Cairo-Regular.eot?#iefix) format("embedded-opentype"), url(../../fonts/Cairo-Regular.ttf) format("truetype");
    font-weight: normal;
    font-display: swap;
    font-smooth: always;
    -webkit-font-smoothing: antialiased;
}

@font-face {
    font-family: "Cairo";
    src: url(../../fonts/Cairo-Bold.woff2) format("woff2"),  url(../../fonts/Cairo-Bold.eot?#iefix) format("embedded-opentype"), url(../../fonts/Cairo-Bold.ttf) format("truetype");
    font-weight: bold;
    font-display: swap;
    font-smooth: always;
    -webkit-font-smoothing: antialiased;
}

@font-face {
    font-family: "Cairo";
    src: url(../../fonts/Cairo-SemiBold.woff2) format("woff2"),  url(../../fonts/Cairo-SemiBold.eot?#iefix) format("embedded-opentype"), url(../../fonts/Cairo-SemiBold.ttf) format("truetype");
    font-weight: 600;
    font-display: swap;
    font-smooth: always;
    -webkit-font-smoothing: antialiased;
}

@font-face {
    font-family: "FontAwesome";
    src: url("../../Fonts/fontawesome-webfont.eot?v=4.7.0");
    src: url("../../Fonts/fontawesome-webfont.eot?#iefix&v=4.7.0") format("embedded-opentype"), url("../../Fonts/fontawesome-webfont.woff2?v=4.7.0") format("woff2"), url("../../fonts/fontawesome-webfont.woff?v=4.7.0") format("woff"), url("../../Fonts/fontawesome-webfont.ttf?v=4.7.0") format("truetype"), url("../../Fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "icomoon";
    src: url("../../fonts/icomoon.eot?-axqy5f");
    src: url("../../fonts/icomoon.eot?#iefix-axqy5f") format("embedded-opentype"), url("../../fonts/icomoon.ttf?-axqy5f") format("truetype"), url("../../fonts/icomoon.woff?-axqy5f") format("woff"), url("../../fonts/icomoon.svg?-axqy5f#icomoon") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

.e31_sidebar .link-loading {
    pointer-events: none;
    opacity: 0.75;
}

    .e31_sidebar .link-loading:focus-within {
        box-shadow: none !important;
    }

    .e31_sidebar .link-loading i:after,
    .e31_sidebar .link-loading i:before {
        display: none;
    }

    .e31_sidebar .link-loading i {
        --loading-size: 0.9rem;
        width: var(--loading-size) !important;
        min-width: var(--loading-size) !important;
        height: var(--loading-size) !important;
        min-height: var(--loading-size) !important;
        border: 2px solid var(--main-text, #535353) !important;
        border-right-color: transparent !important;
        border-radius: 50%;
        margin: 0 12px 0 25.5px;
        animation: ew-spinner-spin 0.75s linear infinite;
    }

@keyframes ew-spinner-spin {
    to {
        transform: rotate(360deg);
    }
}

* {
    box-sizing: border-box;
    outline: 0;
}

input,
a,
button,
input:focus,
a:focus,
button:focus,
.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
    outline: 0;
}

input,
button,
a {
    -webkit-tap-highlight-color: transparent;
}

body {
    -ms-overflow-style: -ms-autohiding-scrollbar;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

:root {
    --controls-active-border-clr: #d0d5dd;
    --controls-text-clr: #344054;
    --controls-width: 340px;
    --controls-max-width: 380px;
    --controls-height: 40px;
    --border-radius-sm: 9px;
    --border-radius-md: 16px;
    --border-radius-lg: 24px;
    --light-primary-color2: #3da5c7;
    --border-light: #eee;
    --border: #ddd;
    --tw-shadow: 0 1px 2px 0 #0000000d;
    --tw-inset-shadow: 0 0 #000000;
    --tw-inset-ring-shadow: 0 0 #000000;
    --tw-ring-offset-shadow: 0 0 #000000;
    --tw-ring-shadow: 0 0 #000000;
    --bs-btn-active-border-color: var(--active-primary-color);
}

body {
    --primary-color: hsl(195, 62%, 33%);
    --primary-color-Opacity-20: rgba(25, 38, 85, 0.2);
    --light-primary-color: hsl(195, 57%, 43%);
    --hover-primary-color: #206e87;
    --active-primary-color: #206e87;
    --focus-primary-color: #206e87;
    --calendar-primary-color: #206e87;
    --calendar-active-color: #206e87;
    --primary-opacaty-color: 17, 92, 116;
    --dark-primary-color: #115c74;
    --dark-bright-color: #206e87;
    --darkmode-primary-color: hsl(195, 62%, 44%);
    --bs-primary: var(--primary-color);
    --bs-primary-rgb: var(--primary-opacaty-color);
}

html,
body {
    margin: 0;
    background-color: var(--light-gray, var(--light-black, #f5f5f5));
    height: 100%;
    top: 0;
    left: 0;
    padding: 0;
    letter-spacing: 0 !important;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-tap-highlight-color: var(--primary-color, rgb(1, 128, 117));
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align: right;
    scrollbar-width: thin;
    -ms-overflow-style: scrollbar;
}

    body .btn-primary {
        --bs-btn-hover-border-color: var(--active-primary-color) !important;
        --bs-btn-hover-bg: var(--light-primary-color) !important;
        --bs-btn-active-bg: var(--active-primary-color) !important;
    }

.shimmer {
    position: relative;
    z-index: 1;
}

.d-contents {
    display: contents !important;
}

.shimmer:after {
    content: "";
    position: absolute;
    z-index: 2;
    top: -1px;
    right: -1px;
    border-radius: inherit;
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    background: linear-gradient( 90deg, var(--light-gray, var(--light-black, #fff)) 30%, var(--border-light) 50%, var(--light-gray, var(--light-black, #fff)) 70% ) padding-box;
    background-size: 400%;
    animation: shimmer 1.5s infinite linear;
}

@keyframes shimmer {
    0% {
        background-position: 100% 100%;
    }

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

::-webkit-scrollbar,
::-webkit-scrollbar-corner {
    background: hsla(0, 0%, 31%, 0.03);
    height: 12px;
    width: 12px;
    border-radius: 13px;
}

::-webkit-scrollbar-thumb {
    background: content-box transparent;
    border: 0px solid transparent;
    border-radius: 9999px;
    min-height: 48px;
    min-width: 48px;
}

@supports not (scrollbar-color: auto) {
    :hover {
        will-change: scrollbar-color;
    }
}

:hover::-webkit-scrollbar-thumb {
    background: content-box var(--border, #ccc);
}

::-webkit-scrollbar-thumb:active,
::-webkit-scrollbar-thumb:hover {
    background: content-box var(--border, #ccc);
}

::-webkit-scrollbar-button {
    height: 0;
    width: 0;
}

@supports not (selector(::-webkit-scrollbar)) {
    * {
        scrollbar-color: var(--border, #ccc) transparent;
        scrollbar-gutter: auto;
        scrollbar-width: auto;
    }

        *:hover {
            scrollbar-color: var(--border, #ccc) transparent;
        }
}

.select2-results__options::-webkit-scrollbar,
.select2-results__options::-webkit-scrollbar-corner {
    display: none !important;
}

.select2-results__options::-webkit-scrollbar-thumb {
    display: none !important;
}

.itg-icons.bullet:before {
    content: "\e921";
}

.form-table-print .itg-icons.bullet:before {
    color: var(--primary-color);
}
/*Utility classes*/
.text-clr-primary {
    color: var(--primary-color) !important;
}

.text-18 {
    font-size: var(--font-18, 18px);
}

.text-bold {
    font-weight: bold;
}

/*end Utility classes*/

/*open side menu svg*/
.MenuHamButt #hamburger-state {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}

.MenuHamButt #close-state {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}

.MenuHamButt.hideMenu #hamburger-state {
    opacity: 0;
    visibility: hidden;
}

.container.col-md-12.content.coursepagecontent {
    min-height: 100% !important;
}

.MenuHamButt.hideMenu #close-state {
    opacity: 1;
    visibility: visible;
}

.MenuHamButt {
    cursor: pointer;
    display: inline-block;
}

    .MenuHamButt span svg {
        display: block;
        width: 24px;
        height: auto;
        color: var(--main-text, var(--primary-color));
    }
/*transperant header*/
.user-info-panel {
    position: relative;
    display: inline-block;
}

.user-info-trigger {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 2px 0px 0px 14px !important;
    margin-right: 12px !important;
    border-radius: var(--border-radius-sm);
    font-size: var(--font-15, 15px);
    font-weight: 500;
    transition: all 0.2s ease-in-out;
    min-width: 160px;
    text-align: right;
    border: none !important;
}

    .user-info-trigger:focus-within,
    .user-info-trigger:active,
    .user-info-trigger:focus {
        outline: none !important;
        border: none !important;
    }

.empty-profiles .dropdown-arrow {
    display: none;
}

.user-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 50px;
    color: var(--main-text, var(--primary-color));
    border-radius: var(--border-radius-sm);
    display: none;
}

    .user-avatar > span {
        color: #fff;
        font-size: 32px;
    }

.user-details {
    font-family: "Cairo";
    font-weight: 400;
    padding-bottom: 8px !important;
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
    text-align: right;
}

.username {
    font-weight: bold;
    color: var(--main-text, #444);
}

.user-role {
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--font-12, 12px);
    color: var(--main-text, #ddd);
}

.dropdown-arrow {
    font-size: var(--font-22, 22px);
    color: var(--main-text, #fff);
    transition: transform 0.2s ease-in-out;
}

.user-info-trigger[aria-expanded="true"] .dropdown-arrow {
    transform: rotate(180deg);
}

.user-info-panel .dropdown-header {
    background-color: unset;
    display: flex;
    gap: 4px;
    align-items: center;
    padding: 12px 16px;
}

    .user-info-panel .dropdown-header * {
        font-family: "Cairo";
        font-weight: bold;
        font-size: var(--font-15, 15px);
        color: #333;
    }

#quickActionsDropdown .dropdown-menu,
.user-dropdown-menu {
    width: 100%;
    min-width: 240px;
    border: 1px solid transparent;
    border-radius: var(--border-radius-sm);
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    padding: 0;
    margin-top: 0.25rem;
    background-color: var(--dark-gray, var(--dark-black, #fff)) !important;
    box-shadow: 0 16px 15px rgba(0, 0, 0, 0.19);
}

    .user-dropdown-menu:has(li:nth-child(6)) .search-section {
        padding-top: 8px !important;
        display: block !important;
    }

.search-section {
    padding: 0px 16px 0px 16px !important;
    margin: 0;
}

    .search-section .input-group-text {
        background-color: transparent;
        border: none !important;
        color: rgba(var(--primary-opacaty-color, 0, 0, 0), 0.6);
        font-size: var(--font-20, 20px) !important;
        top: 9px;
        right: 8px;
        position: absolute;
    }

        .search-section .input-group-text .material-icons {
            font-size: var(--font-20, 20px) !important;
        }

    .search-section .form-control {
        background-color: rgba(var(--primary-opacaty-color, 0, 0, 0), 0.03);
        border-radius: var(--border-radius-sm) !important;
        padding-right: 32px;
        min-height: 38px;
    }

        .search-section .form-control::placeholder {
            font-size: var(--font-14, 14px);
        }

.profiles-section {
    max-height: 260px;
    overflow-y: auto;
}

    .profiles-section:has(li:nth-child(6)) {
        margin-left: 6px;
    }

    .profiles-section ul:has(li:nth-child(6)) {
        margin-left: 2px !important;
    }

@-moz-document url-prefix() {
    .profiles-section:has(li:nth-child(6)) {
        margin-left: 8px;
    }

    .profiles-section ul:has(li:nth-child(6)) {
        max-width: calc(100% - 26px);
        margin-left: 12px !important;
    }
}

#quickActionsDropdown .dropdown-menu ul,
.profiles-section ul {
    max-width: calc(100% - 16px);
    margin-left: auto !important;
    margin-right: auto !important;
    border-radius: var(--border-radius-sm);
    margin-bottom: 12px !important;
    margin-top: 12px !important;
    overflow: hidden !important;
}

.dropdown-menu li.qa-item,
.profiles-section li {
    background-color: var(--light-gray, var(--light-black, #f7f7f7));
}

    .dropdown-menu li.qa-item:first-child a,
    .profiles-section li:first-child a {
        padding-top: 10px;
    }

    .dropdown-menu li.qa-item a[disabled="disabled"] {
        cursor: not-allowed !important;
    }

    .dropdown-menu li.qa-item a,
    .profiles-section li a {
        color: var(--main-text, #333);
        display: inline-block;
        width: 100%;
        padding: 8px;
        text-decoration: none !important;
        max-width: 280px;
        font-size: var(--font-13, 13px) !important;
        overflow: hidden !important;
        white-space: nowrap !important;
        text-overflow: ellipsis !important;
        transition: all 0.2s ease-in-out;
        border: none;
        text-align: right;
    }

    .dropdown-menu li.qa-item:hover,
    .profiles-section li:hover {
        background: rgba(var(--primary-opacaty-color, 0, 0, 0), 0.1);
    }

        .dropdown-menu li.qa-item:hover a,
        .profiles-section li:hover a {
            color: var(--primary-color);
        }

    .dropdown-menu li.qa-item:focus,
    .profiles-section li:focus {
        background: rgba(var(--primary-opacaty-color, 0, 0, 0), 0.2);
    }

        .dropdown-menu li.qa-item:focus a,
        .profiles-section li:focus a {
            color: var(--primary-color);
        }

@media (max-width: 768px) {
    .user-info-trigger {
        min-width: 200px;
        padding: 0.5rem 0.75rem;
    }

    .user-dropdown-menu {
        min-width: 280px;
    }

    .username {
        font-size: 0.875rem;
    }

    .user-role {
        font-size: 0.6875rem;
    }
}

@media (max-width: 440px) {
    .user-info-trigger {
        width: 170px !important;
        padding: 0.5rem 0.75rem;
    }

    .user-details span {
        max-width: 120px;
        text-align: right;
    }
}

.profile-item:focus-visible {
    outline: 2px solid hsl(var(--ring));
    outline-offset: -2px;
}

.user-info-trigger:focus-visible {
    outline: 2px solid hsl(var(--ring));
    outline-offset: 2px;
}
/*end transperant header*/
/*custom pages layout*/
.pagesectioncontent:has(.dashboard-theme) {
    background-color: transparent;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
}

.box:not(.box .box) {
    background-color: var(--dark-gray, var(--dark-black, #fff));
    border-radius: var(--border-radius-sm);
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 8px;
    padding-bottom: 8px;
    flex: 1 1 calc(50% - 16px);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
    border: 1px solid rgba(var(--primary-opacaty-color), 0.25) !important;
    margin-bottom: 16px;
}

.dashboard-theme > span:empty {
    display: none;
}

.dashboard-theme {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: flex-start;
    align-content: center;
    align-items: flex-start;
}

@media (max-width: 635px) {
    .e31_header > .e31_headerinfo {
        max-height: 70px !important;
        padding-top: 12px !important;
    }

    .e31_header .user-info-panel .user-details {
        display: none !important;
    }

    .user-details + .dropdown-arrow {
        display: none;
    }

    .user-info-trigger {
        min-width: unset !important;
        width: 48px !important;
        height: 48px !important;
        padding: 0 !important;
        justify-content: center;
        margin-left: 10px !important;
        text-align: center !important;
        background-color: rgba(255, 255, 255, 0.035);
        border-radius: var(--border-radius-sm);
        border: 1px solid rgba(255, 255, 255, 0.065) !important;
    }

    .e31_header .user-info-panel .user-avatar {
        display: flex;
    }

    .user-info-table > tbody:has(tr > td.editble-cell) {
        display: flex;
        flex-direction: column;
    }

        .user-info-table > tbody:has(tr > td.editble-cell) td.dot-cell {
            display: none;
        }

    .user-info-table > tbody > tr > td.editble-cell *,
    .user-info-table > tbody > tr > td.editble-cell {
        width: unset !important;
        max-width: unset !important;
        min-width: unset !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

        .user-info-table > tbody > tr > td.editble-cell input {
            width: 70% !important;
            min-width: 30% !important;
            padding-left: 5px !important;
            padding-right: 5px !important;
        }

        .user-info-table > tbody > tr > td.editble-cell
        .ValidationClass[style="visibility: visible;"] {
            display: inline !important;
            max-width: 240px !important;
        }

        .user-info-table > tbody > tr > td.editble-cell input[maxlength="9"] {
            width: calc(70% - 42px) !important;
            min-width: 30% !important;
        }

        .user-info-table > tbody > tr > td.editble-cell input[maxlength="3"] {
            width: 36px !important;
            max-width: 36px !important;
            min-width: 36px !important;
        }

    .user-info-table td.value-cell .StandardFont {
        line-height: 24px;
        padding-top: 8px;
    }

    .user-info-table .notifyjs-wrapper.notifyjs-hidable {
        left: unset !important;
        right: -60% !important;
        top: -30px;
    }

        .user-info-table .notifyjs-wrapper.notifyjs-hidable .notifyjs-container {
            min-width: 200px !important;
            text-align: right;
        }

            .user-info-table
            .notifyjs-wrapper.notifyjs-hidable
            .notifyjs-container > div {
                padding-right: 8px !important;
            }

        .user-info-table .notifyjs-wrapper.notifyjs-hidable .notifyjs-arrow {
            display: none;
        }
}

@media (max-width: 380px) {
    .user-info-table .notifyjs-wrapper.notifyjs-hidable .notifyjs-container {
        min-width: 180px !important;
    }
}

.dashboard-theme div.instructions-box {
    background-color: #fdebc3;
    flex: 1 1 380px !important;
    padding-bottom: 7px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    padding-top: 8px;
    padding-bottom: 8px;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
    border-bottom: 1px solid rgba(var(--primary-opacaty-color), 0.25) !important;
}

.dashboard-theme .instructions-box .form-operation-links-body {
    margin-left: -6px;
    margin-right: -6px;
}

    .dashboard-theme .instructions-box .form-operation-links-body table + table {
        margin-bottom: 16px;
    }

    .dashboard-theme
    .instructions-box
    .form-operation-links-body
    table:has(> tbody > tr > td > i) {
        width: 100% !important;
        min-width: unset !important;
        max-width: unset;
    }

/*end custom pages layout*/
/*information viewer style*/
.user-info-table {
    width: 100%;
    border-collapse: collapse;
    font-family: inherit;
    color: var(--main-text, var(--controls-text-clr));
    font-size: var(--font-14, 14px);
}

    .user-info-table tbody tr:first-child {
        border-bottom: none;
    }

    .user-info-table tbody .table-header {
        padding-right: 8px;
        display: flex;
    }

        .user-info-table tbody .table-header > span {
            height: unset !important;
            display: inline-block !important;
            margin-top: -2px;
            margin-right: 6px;
            font-size: var(--font-18, 18px) !important;
            font-weight: 400 !important;
            color: var(--primary-color);
            font-family: "Cairo";
        }

        .user-info-table tbody .table-header > i:after,
        .user-info-table tbody .table-header > i:before {
            font-size: var(--font-22, 22px);
        }

        .user-info-table tbody .table-header > i {
            color: var(--primary-color);
        }

    .user-info-table tbody tr {
        border-bottom: 1px solid var(--border);
        transition: background-color 0.15s ease-in-out;
    }

        .user-info-table tbody tr:last-child {
            border-bottom: none;
        }

        .user-info-table tbody tr:not(tr:first-child):hover {
            background-color: rgba(var(--primary-opacaty-color), 0.025);
        }

    .user-info-table td {
        padding: 12px 16px;
        vertical-align: middle;
        text-align: right;
    }

        .user-info-table td.user-info-title {
            color: var(--main-text, #64748b);
            font-weight: 500;
            white-space: nowrap;
        }

        .user-info-table td.dot-cell {
            width: auto;
            padding: 12px 8px;
            color: var(--main-text, #64748b);
        }

        .user-info-table td.value-cell {
            font-weight: 500;
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 8px;
        }

        .user-info-table td.editble-cell {
            position: relative;
            min-width: 424px;
            padding-left: 68px !important;
        }

            .user-info-table td.editble-cell span:empty {
                width: auto !important;
                max-width: 240px !important;
                min-width: auto !important;
            }

    .user-info-table tr:has(td.view-cell, .ClientID) td {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .user-info-table td.ClientID a {
        color: var(--primary-color);
        text-decoration: none;
        font-weight: 500;
    }

        .user-info-table td.ClientID a:hover {
            text-decoration: underline;
            color: var(--hover-primary-color);
        }

    .user-info-table .editble-cell .StandardFont[onclick] {
        cursor: pointer;
        min-width: 150px;
        display: inline-block;
        transition: color 0.15s ease-in-out;
    }

.user-informations-viewer > .form-controls:nth-child(3)
td.value-cell.view-cell
span.StandardFont:only-child {
    line-height: 26px;
    padding-top: 4px;
    padding-bottom: 4px;
}

.user-info-table .editble-cell .StandardFont[onclick]:hover {
    color: var(--hover-primary-color);
}

.user-info-table .editble-cell input.StandardFontPlain {
    border: 1px solid var(--controls-active-border-clr);
    border-radius: var(--border-radius-sm);
    padding: 6px 10px;
    font-family: inherit;
    font-size: inherit;
    color: var(--controls-text-clr);
    background-color: var(--dark-gray, var(--dark-black, #fff));
    height: var(--controls-height);
    box-sizing: border-box;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

    .user-info-table .editble-cell input.StandardFontPlain[type="text"] {
        line-height: normal;
    }

    .user-info-table .editble-cell input.StandardFontPlain:focus {
        outline: none;
        border-color: var(--focus-primary-color);
        box-shadow: 0 0 0 1px var(--focus-primary-color);
    }

.user-info-table .editble-cell .material-icons-outlined {
    font-size: var(--font-18, 18px);
    vertical-align: middle;
    color: #94a3b8;
}

.user-info-table .editble-cell .DataEditButton,
.user-info-table .editble-cell .btn-save,
.user-info-table .editble-cell .btn-cancel {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: color 0.15s ease-in-out;
    position: absolute;
}

.user-info-table .editble-cell .DataEditButton {
    left: 16px !important;
}

.user-info-table .editble-cell .btn-save {
    left: 50px !important;
}

.user-info-table .editble-cell .btn-cancel {
    left: 22px !important;
}

.user-info-table .editble-cell .DataEditButton:hover .material-icons-outlined {
    color: var(--primary-color);
}

.user-info-table .editble-cell .btn-save .material-icons-outlined {
    color: #16a34a;
}

.user-info-table .editble-cell .btn-save:hover .material-icons-outlined {
    color: #15803d;
}

.user-info-table .editble-cell .btn-cancel .material-icons-outlined {
    color: #dc2626;
}

.user-info-table .editble-cell .btn-cancel:hover .material-icons-outlined {
    color: #b91c1c;
}

.user-info-table .ValidationClass {
    color: #ef4444;
    font-size: var(--font-12, 12px);
    flex-basis: 100%;
    margin-top: 4px;
    display: none;
}

    .user-info-table .ValidationClass[style*="visibility: visible"] {
        display: block !important;
        visibility: visible !important;
        max-width: 182px;
    }

.user-info-table .StandardFont {
    line-height: var(--controls-height);
    display: inline-block;
    min-height: var(--controls-height);
}

.user-info-table td.editble-cell > span[id*="lbl"] {
    min-height: var(--controls-height);
    display: inline-flex;
    align-items: center;
}

.user-info-table td.label-ltr span.StandardFont {
    direction: ltr;
}

.user-informations-viewer:empty {
    display: none;
}

.user-informations-viewer {
    display: flex;
    gap: 16px;
    justify-content: center;
    align-content: center;
    align-self: center;
    flex-wrap: wrap;
    flex-grow: 1;
    flex-shrink: 1;
}

    .user-informations-viewer > .box {
        flex: 1 1 380px;
        margin: 0 !important;
    }

/*end information viewer style*/

td,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Cairo";
}

    span.shimmer,
    label.shimmer,
    p.shimmer,
    td.shimmer,
    .h1.shimmer,
    .h2.shimmer,
    .h3.shimmer,
    .h4.shimmer,
    .h5.shimmer,
    .h6.shimmer,
    h1.shimmer,
    h2.shimmer,
    h3.shimmer,
    h4.shimmer,
    h5.shimmer,
    h6.shimmer {
        max-width: fit-content;
        padding: 2px 4px;
        overflow: hidden !important;
        box-sizing: content-box;
        border-radius: var(--border-radius-sm, 13px);
    }

.sidebar_header {
    display: flex;
    color: var(--main-text, #0a0d10);
    text-decoration: none;
    align-content: center;
    align-items: center;
    background-color: var(--dark-gray, var(--dark-black, #fff));
    gap: 0px;
    margin-top: 14px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
    overflow: hidden;
    transition: gap linear 0.2s;
}

body.Menuhidden .sidebar_header {
    gap: 16px;
}

.sidebar_footer {
    z-index: 1;
    background-color: inherit;
    position: relative;
    display: flex;
    flex-direction: column;
    bottom: 0;
    right: 0;
    justify-content: center;
    align-items: center;
    gap: 4px;
}

.sidebar_header .MenuHamButt {
    display: block;
    text-align: right;
}

    .sidebar_header .MenuHamButt span {
        display: flex;
        width: 38px;
        text-align: center;
        height: 38px;
        justify-content: center;
        align-items: center;
        border-radius: var(--border-radius-sm);
    }

        .sidebar_header .MenuHamButt span:hover {
            background-color: rgba(0, 0, 0, 0.03);
        }

        .sidebar_header .MenuHamButt span:active {
            background-color: rgba(0, 0, 0, 0.05);
        }

html:has(body.dark, body.darker) .sidebar_header .MenuHamButt span:hover {
    background-color: rgba(255, 255, 255, 0.03);
}

html:has(body.dark, body.darker) .sidebar_header .MenuHamButt span:active {
    background-color: rgba(255, 255, 255, 0.05);
}

.search2 {
    margin: 8px auto !important;
    position: relative;
    display: flex;
    z-index: 1;
    block-size: 38px;
    align-content: center;
    background-color: rgba(var(--primary-opacaty-color, 0, 0, 0), 0.03);
    border-radius: var(--border-radius-sm);
    border: 1px solid var(--border);
}

    .search2 input {
        height: 100%;
        outline: 3px solid transparent !important;
        background: transparent !important;
    }

        .search2 input:focus {
            outline-color: rgba(var(--primary-opacaty-color, 0, 0, 0), 0.1) !important;
        }

html:has(body.dark, body.darker) .search2 {
    background: rgba(var(--primary-opacaty-color, 0, 0, 0), 0.1) !important;
}

.search2:before {
    font-family: "ITG Material Icons";
    content: "search";
    position: absolute;
    font-size: var(--font-20, 20px);
    font-weight: normal;
    right: 8px;
    top: 3px;
    color: rgba(var(--primary-opacaty-color, 0, 0, 0), 0.6);
}

.search2 .input-search2 {
    cursor: pointer;
    border: none;
    padding-right: 32px;
    box-shadow: none;
    color: #555;
    width: 100%;
    align-self: center;
    outline: none;
    box-shadow: none;
}

.search2 .input-search2 {
    font-size: var(--font-16, 16px) !important;
    color: var(--primary-color) !important;
    opacity: 1;
    transition: opacity linear 0.2s;
}

body.Menuhidden .e31_sidebar .search2 .input-search2 {
    opacity: 0;
}

.search-profiles {
    margin-left: 16px !important;
    margin-right: 16px !important;
    background-color: var(--light-gray, var(--light-black, #f5f5f5));
    border: 1px solid var(--border);
}

    .search-profiles input {
        color: var(--main-text, #444) !important;
    }

.search2 .input-search2[placeholder] {
    color: #c5c5c5;
    font-size: var(--font-14, 14px);
}

.search2 .input-search2::-webkit-input-placeholder {
    color: #c5c5c5;
    font-size: var(--font-13, 13px);
}

.search2 .input-search2::-moz-placeholder {
    color: #898989;
    font-size: var(--font-13, 13px);
}

.search2 .input-search2:-ms-input-placeholder {
    color: #898989;
    font-size: var(--font-13, 13px);
}

.search2 .input-search2:-moz-placeholder {
    color: var(--main-text, #555);
    font-size: var(--font-13, 13px);
}

textarea {
    font-family: "Cairo";
    color: var(--main-text, #555);
    font-size: var(--font-13, 13px);
    font-weight: normal;
}

.header {
    font-weight: bold;
    font-size: var(--font-15, 15px);
    font-family: "Cairo";
}

.title {
    font-size: var(--font-15, 15px);
    background: #000;
    color: #fff;
    font-family: "Cairo";
    text-align: center;
    font-variant: normal;
}

.StandardFont {
    font-size: var(--font-14, 14px);
    font-family: "Cairo";
    font-weight: 400;
    font-size: var(--main-text, #344054);
}

table.StandardFont:has(font) {
    margin-top: 16px;
}

.StandardFontPlain {
    font-weight: normal;
    font-size: var(--font-16, 16px);
    color: var(--main-text, #555);
    margin-bottom: 5px;
    margin-left: 5px;
    font-family: "Cairo";
    padding-left: 16px;
    padding-right: 16px;
    min-height: var(--controls-height, 48px);
}

.edit-brifcase-table table,
.edit-brifcase-table .StandardFontPlain {
    width: 100% !important;
}

input[type="password"],
input[type="text"] {
    border-radius: var(--border-radius-sm, 8px);
    outline: 2px solid transparent;
    transition: 0.1s outline;
}

    .feild_data .StyleTimePicker:focus-within,
    .feild_data .StyleTimePicker:focus,
    input[type="password"]:not([disalbed="disabled"]):focus,
    input[type="text"]:not([disalbed="disabled"]):focus {
        outline-color: rgba(var(--primary-opacaty-color, 0, 0, 0), 0.2);
    }

    .feild_data .StyleTimePicker,
    input[type="password"].StandardFontPlain:not([disabled="disabled"]),
    input[type="text"].StandardFontPlain:not([disabled="disabled"]) {
        border: 1px solid var(--controls-active-border-clr, #e1e6ef);
        color: var(--main-text, #555);
    }

    input[type="text"].ltr {
        direction: ltr !important;
    }
/*Controls Fixes*/
div:has(> div > .feild_data) {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start !important;
    align-content: flex-start !important;
    align-items: flex-start !important;
    align-self: flex-start !important;
    max-width: 1920px;
}

div:not(.home-page-section div, .row_accordian div):has(> .col-12 + .col-12)
.col-12 {
    width: 100%;
}

    div:not(.home-page-section div, .row_accordian div):has(> .col-12 + .col-12)
    .col-12:not(:has(*)) {
        display: none;
    }

div:has(> div > .feild_data) div:has(> .feild_data) {
    width: calc(33.33333% - 60px);
    max-width: calc(33.33333% - 60px);
    position: relative;
    padding-left: 16px;
    padding-bottom: 24px;
}

.form-ModalPopup div:has(> div > .feild_data) div:has(> .feild_data) {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

    .form-ModalPopup
    div:has(> div > .feild_data)
    div:has(> .feild_data)
    div[style="max-width: 250px"] {
        max-width: 100% !important;
    }

div:has(> div > .feild_data)
div
.feild_data:has(.ValidationClass[style="display: inline;"]) {
    margin-bottom: -20px;
}

input[type="text"].StandardFontPlain[disabled="disabled"],
input[type="text"].StandardFontPlain[readonly="readonly"]:not( .select_date_table input ) {
    background-color: #eee !important;
    border: 1px solid #ddd;
}

table.table-Style input[type="text"],
.feild_data .StyleTimePicker,
.feild_data span.StandardFont,
.feild_data input[type="password"].StandardFontPlain,
.feild_data input[type="text"].StandardFontPlain {
    min-height: var(--controls-height, 48px);
}
/*StyleTimePicker*/
.feild_data .StyleTimePicker {
    --md-primary-color: var(--primary-color);
    --md-text-color: var(--controls-text-clr);
    --md-secondary-text-color: var(--primary-color);
    --md-border-color: var(--border);
    --md-background-color: var(--dark-gray, var(--dark-black, #fff));
    --md-background-focus-color: rgba(var(--primary-opacaty-color), 0.2);
    --md-border-radius: var(--border-radius-sm);
    --md-transition: all 0.2s ease-in-out;
    width: 100%;
    display: inline-flex;
    justify-content: flex-end;
    flex-wrap: nowrap;
    align-items: center;
    background-color: var(--md-background-color);
    border-radius: var(--md-border-radius);
    padding: 0;
    transition: var(--md-transition);
    border-color: var(--controls-active-border-clr) !important;
    outline: 2px solid transparent;
    border: 1px solid var(--controls-active-border-clr, #e1e6ef);
}

    .feild_data .StyleTimePicker table,
    .feild_data .StyleTimePicker tbody,
    .feild_data .StyleTimePicker tr {
        border: none !important;
        border-collapse: collapse !important;
        border-spacing: 0 !important;
        padding: 0 !important;
    }

    .feild_data .StyleTimePicker tr {
        display: flex;
        width: 100%;
        gap: 8px;
    }

    .feild_data .StyleTimePicker td {
        padding: 0 !important;
        vertical-align: middle !important;
    }

        .feild_data .StyleTimePicker td:first-child {
            display: flex;
            align-items: center;
        }

    .feild_data .StyleTimePicker input {
        background-color: transparent !important;
        border: none !important;
        box-shadow: none !important;
        outline: none;
        padding: 0;
        margin: 0 1px;
        height: var(--controls-height) !important;
        font-size: 16px !important;
        font-family: inherit !important;
        color: var(--md-text-color);
        text-align: center;
        width: 2ch !important;
    }

        .feild_data .StyleTimePicker input[value=":"] {
            width: 1ch !important;
            color: var(--md-secondary-text-color);
            cursor: default !important;
        }

        .feild_data .StyleTimePicker input[name*="txtAmPm"] {
            width: 2.5ch !important;
            font-weight: 500;
            text-transform: uppercase;
            color: var(--md-primary-color);
            cursor: pointer !important;
        }

    .feild_data .StyleTimePicker img {
        display: none !important;
    }

    .feild_data .StyleTimePicker td:last-child {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        margin-left: 8px;
    }

        .feild_data .StyleTimePicker td:last-child::before,
        .feild_data .StyleTimePicker td:last-child::after {
            content: "";
            display: block;
            width: 0;
            height: 0;
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
            cursor: pointer;
            opacity: 0.6;
            transition: var(--md-transition);
        }

        .feild_data .StyleTimePicker td:last-child::before {
            border-bottom: 5px solid var(--md-secondary-text-color);
            margin-bottom: 4px;
        }

        .feild_data .StyleTimePicker td:last-child::after {
            border-top: 5px solid var(--md-secondary-text-color);
        }

        .feild_data .StyleTimePicker td:last-child:hover::before {
            opacity: 1;
            border-bottom-color: var(--md-primary-color);
        }

        .feild_data .StyleTimePicker td:last-child:hover::after {
            opacity: 1;
            border-top-color: var(--md-primary-color);
        }
/*end StyleTimePicker*/
.feild_data:has(input[type="text"].StandardFontPlain + input[type="submit"])
input[type="text"].StandardFontPlain {
    width: calc(100% - 72px) !important;
    max-width: calc(var(--controls-max-width, 328px) - 72px);
}

.feild_data:has(> .textarea_counter) div {
    width: 100% !important;
    min-width: 100% !important;
    max-width: var(--controls-max-width, 328px);
}

    .feild_data:has(> .textarea_counter) div.textarea_counter {
        max-height: 20px;
        position: relative;
        width: fit-content;
    }

        .feild_data:has(> .textarea_counter) div.textarea_counter > div:has(> table) {
            height: 20px;
            position: relative;
            max-width: var(--controls-max-width) !important;
        }

.feild_data:has(> div > input[type="text"]):has(> div > input[type="submit"]) {
    display: flex;
    flex-direction: row;
    width: 100% !important;
    max-width: var(--controls-max-width, 428px) !important;
    align-content: start;
    align-items: start;
}

    .feild_data:has(> div > input[type="text"]):has(> div > input[type="submit"])
    div:has(input[type="submit"]) {
        width: 65px !important;
        max-width: 65px !important;
        min-width: 65px !important;
        margin-right: 4px;
    }

.feild_data:has(> div > input[type="text"]) input[type="submit"] {
    margin-top: 0;
    margin-bottom: 0;
}

.feild_data:has(> div > input[type="text"]):has(> div > input[type="submit"])
div:has(input[type="text"]) {
    width: 100% !important;
}

.feild_data
.select_date_table
input[type="text"].StandardFontPlain:not([disalbed="disabled"]) + div
i {
    cursor: pointer !important;
    transition: color 0.2s;
}

    .feild_data
    .select_date_table
    input[type="text"].StandardFontPlain:not([disalbed="disabled"]) + div
    i:hover {
        color: var(--light-primary-color);
    }

/*End Controls Fixes*/
/*New controls*/
.radio-button-list {
    border-collapse: separate;
    border-spacing: 0;
}

    .radio-button-list tr {
        display: flex;
        justify-content: flex-start;
        align-content: center;
        align-items: center;
        gap: 4px;
        flex-wrap: nowrap;
    }

    .radio-button-list input[type="radio"] {
        position: absolute;
        opacity: 0;
    }

    .radio-button-list label {
        position: relative;
        padding: 7px 40px 12px 22px;
        min-height: var(--controls-height);
        cursor: pointer !important;
        display: inline-block;
        font-size: var(--font-16, 16px);
        transition: all 0.3s ease;
        border-radius: var(--border-radius-sm);
        margin-bottom: 0px;
    }

    .radio-button-list span[disabled="disabled"] label {
        color: #bbb;
        cursor: default !important;
    }

.table-Style .radio-button-list span[disabled="disabled"] label {
    color: #888;
}

.radio-button-list label:before {
    content: "";
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid var(--border, #ccc);
    background: var(--dark-gray, var(--dark-black, #fff));
    transition: all 0.3s ease;
}

.radio-button-list input[type="radio"]:checked + label:before {
    border-color: var(--focus-primary-color, #3498db);
    background: var(--dark-gray, var(--dark-black, #fff));
}

.radio-button-list input[type="radio"]:checked + label:after {
    content: "";
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    width: 10px;
    height: 10px;
    border-radius: 50px;
    background: var(--focus-primary-color, #3498db);
    transition: all 0.3s ease;
}

.radio-button-list
span[disabled="disabled"]
input[type="radio"]:checked + label:after {
    background-color: #eee;
}

.radio-button-list
span[disabled="disabled"]
input[type="radio"]:checked + label::before {
    border-color: #ccc;
}

.table-Style
.radio-button-list
span[disabled="disabled"]
input[type="radio"]:checked + label:after {
    background-color: #ccc;
}

.table-Style
.radio-button-list
span[disabled="disabled"]
input[type="radio"]:checked + label::before {
    border-color: #bbb;
}

.radio-button-list input[type="radio"]:focus + label:before {
    box-shadow: 0 0 0 3px rgba(var(--primary-opacaty-color), 0.2);
}

.radio-button-list label:not(span[disabled="disabled"] label):hover {
    background-color: rgba(var(--primary-opacaty-color), 0.05);
}

/*End New controls*/
CODE {
    font-family: Arial;
}

A {
    text-decoration: none;
    font-family: "Cairo";
    color: var(--main-text, #555);
}

    A:active {
        color: var(--primary-color, #2986cc);
        text-decoration: none;
        font-family: "Cairo";
    }

    A:visited {
        color: #979797;
        text-decoration: none;
        font-family: "Cairo";
    }

    A:hover {
        color: var(--primary-color, #2986cc);
        text-decoration: underline;
        font-family: "Cairo";
    }

LI {
    font-size: var(--font-14, 14px);
    color: var(--main-text, #555);
    font-family: "Cairo";
    list-style: none;
}

.Footer {
    font-family: Arial;
    font-size: var(--font-12, 12px);
    font-weight: bold;
}

tr.tableHeaderCell th A,
tr.tableFooterCell td a {
    color: #fff;
    text-decoration: none;
    font-family: "Cairo";
    font-size: var(--font-16, 16px);
}

    tr.tableHeaderCell th span,
    tr.tableHeaderCell th A:link,
    tr.tableFooterCell td a:link {
        color: #fff !important;
        text-decoration: none;
        font-family: "Cairo";
        font-size: var(--font-15, 15px);
        font-weight: bold;
    }

    tr.tableHeaderCell th A:active,
    tr.tableFooterCell td a:active {
        color: #e0fffc;
        text-decoration: none;
        font-family: "Cairo";
        font-weight: normal;
    }

    tr.tableHeaderCell th A:visited,
    tr.tableFooterCell td a:visited {
        color: #979797;
        text-decoration: none;
        font-family: "Cairo";
        font-size: var(--font-16, 16px);
    }

    tr.tableHeaderCell th A:hover,
    tr.tableFooterCell td a:hover {
        color: #fff;
        text-decoration: none;
    }

tr.tableFooterCell td span.ValidationClass,
tr.tableFooterCell td td.ValidationClass {
    color: #dc3545;
}

table.standerdfont td {
    height: 24px;
    max-height: 24px !important;
    min-height: 24px !important;
    vertical-align: middle;
    margin: 0px;
}

    table.standerdfont td input[maxlength="3"] {
        padding: 0 2px 0 0;
        margin-right: 2px !important;
    }

.TabTitle {
    color: var(--primary-color, #2986cc);
    text-decoration: none;
    font-family: "Cairo";
    font-weight: bold;
    font-size: var(--font-17, 17px);
    padding-top: 2pt;
}

fieldset legend {
    border-bottom: none;
    width: auto;
}

.SearchTitle,
.PageTitle {
    color: var(--main-text, #171717);
    text-decoration: none;
    font-family: "Cairo";
    font-weight: bold;
    font-size: var(--font-20, 20px);
}

.pagebreadcrumbs {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
    width: 100%;
    padding: 6px 16px;
    background-color: var(--dark-gray, var(--dark-black, #fff));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
    border: 1px solid rgba(var(--primary-opacaty-color), 0.25) !important;
    border-radius: calc(var(--border-radius-sm) - 1px);
    min-block-size: 38px;
}

#lbtnGlobalBack {
    color: var(--primary-color);
    cursor: pointer;
    font-family: "Cairo";
    font-weight: bold;
    font-size: var(--font-14, 14px);
    border-right: 1px solid var(--border);
    justify-self: flex-end !important;
    padding-right: 4px;
    text-decoration: none !important;
}

    #lbtnGlobalBack div {
        display: flex;
    }

        #lbtnGlobalBack div span {
            color: var(--primary-color);
            margin-top: 0px;
        }

    #lbtnGlobalBack i {
        position: relative;
        transition: left ease 0.5s, color 0.2s ease-in-out;
        left: -2px;
        font-size: var(--font-12, 12px) !important;
    }

    #lbtnGlobalBack:hover span,
    #lbtnGlobalBack:hover {
        color: var(--hover-primary-color);
    }

        #lbtnGlobalBack:hover i {
            left: 1px;
        }

    #lbtnGlobalBack i:after {
        font-size: var(--font-23, 23px);
        font-weight: 700;
        line-height: 1;
    }

.breadcrumbs-content {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    align-items: center;
    align-content: center;
    min-height: 36px;
    overflow-x: auto;
    overflow-y: clip;
    box-sizing: content-box !important;
}

.Menuhidden .breadcrumbs-content {
}

.pagebreadcrumbs a {
    text-align: center;
    white-space: nowrap;
    cursor: pointer !important;
}

.pagebreadcrumbs .breadcrumbs-content a,
.pagebreadcrumbs .breadcrumbs-content .current-page {
    font-family: "Cairo";
    font-weight: bold !important;
    font-size: var(--font-14, 14px);
    color: var(--primary-color);
    line-height: inherit;
}

.pagebreadcrumbs .breadcrumbs-content .current-page {
    color: var(--main-text, #717171);
    white-space: nowrap;
}

.pagebreadcrumbs .breadcrumbs-content .material-icons {
    font-size: var(--font-20, 20px);
    line-height: 1.15;
}

    .pagebreadcrumbs .breadcrumbs-content .material-icons.breadcrumb-separator {
        font-size: var(--font-16, 16px);
        margin-left: 1px;
        margin-right: 1px;
        line-height: 1.4;
    }

    .pagebreadcrumbs .breadcrumbs-content .material-icons.breadcrumb-separator {
        color: #ccc;
    }

.pagebreadcrumbs {
    gap: 8px;
}

#quickActionsDropdown {
    border-right: 1px solid var(--border);
    padding-right: 8px;
}

    #quickActionsDropdown .dropdown-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        color: var(--primary-color);
        background: transparent;
        border: none;
        cursor: pointer;
        padding: 0;
        transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
    }

        #quickActionsDropdown .dropdown-toggle span {
            color: inherit;
            cursor: pointer;
            font-family: "Cairo";
            font-weight: bold;
            font-size: var(--font-14, 14px);
            justify-self: flex-end !important;
            margin-right: 6px;
            transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
            margin-top: -2px;
        }

        #quickActionsDropdown .dropdown-toggle .material-icons {
            font-size: var(--font-18, 18px);
            color: inherit !important;
            line-height: 1;
            transition: rotate 0.2s ease-in-out;
        }

        #quickActionsDropdown .dropdown-toggle:hover,
        #quickActionsDropdown .dropdown-toggle.show {
            color: var(--hover-primary-color);
            background-color: rgba(var(--primary-rgb-color), 0.1);
        }

            #quickActionsDropdown .dropdown-toggle:not(:disabled):hover .material-icons,
            #quickActionsDropdown .dropdown-toggle.show:not(:disabled) .material-icons {
                rotate: 30deg;
            }

        #quickActionsDropdown .dropdown-toggle:disabled {
            color: var(--border) !important;
            background-color: transparent !important;
        }

            #quickActionsDropdown .dropdown-toggle:disabled i {
                cursor: not-allowed !important;
            }

    #quickActionsDropdown .dropdown-menu {
        min-width: 260px;
        max-width: 300px;
        z-index: 2;
    }

        #quickActionsDropdown .dropdown-menu .search-section {
            position: relative;
            padding-top: 12px !important;
        }

            #quickActionsDropdown .dropdown-menu .search-section input {
                min-height: 38px;
            }

                #quickActionsDropdown .dropdown-menu .search-section input::placeholder {
                    font-size: var(--font-14, 14px);
                }

            #quickActionsDropdown .dropdown-menu .search-section span {
                display: flex;
                position: absolute;
                top: 4px;
                right: 3px;
                font-size: var(--font-22, 22px);
                line-height: 1;
            }

        #quickActionsDropdown .dropdown-menu ul {
            max-height: 200px;
            overflow-y: auto !important;
            box-sizing: content-box !important;
            max-width: calc(100% - 24px);
            margin-left: auto;
            margin-right: auto;
        }

            #quickActionsDropdown .dropdown-menu ul li:first-child {
                border-top-left-radius: var(--border-radius-sm) !important;
                border-top-right-radius: var(--border-radius-sm) !important;
                overflow: hidden !important;
            }

            #quickActionsDropdown .dropdown-menu ul li:last-child {
                border-bottom-left-radius: var(--border-radius-sm) !important;
                border-bottom-right-radius: var(--border-radius-sm) !important;
                overflow: hidden !important;
            }

.TableTitleHeader {
    color: #000;
    background-color: #e0e0e0;
    font-weight: 600;
    font-size: var(--font-16, 16px);
    font-family: "Cairo";
    border-bottom: #ccc 2px solid;
}

.tableHeaderCell {
    background-color: var(--primary-color, #2986cc);
    border-bottom: #ccc 2px solid !important;
    color: #fff;
    font-size: var(--font-15, 15px);
    font-weight: normal;
    font-family: "Cairo";
}

    .tableHeaderCell > th {
        text-align: right;
        padding: 4px;
        white-space: nowrap;
    }

.tableFooterCell {
    color: var(--main-text, #555);
    background-color: var(--primary-color, #2986cc);
    font-weight: bold;
    font-size: var(--font-12, 12px);
    font-family: Arial;
    border-top: #ccc 2px solid !important;
}

.tableFooterReportCell {
    color: #f90;
    background-color: #d3def1;
    font-weight: Bold;
    font-size: var(--font-17, 17px);
    font-family: Arial;
    font-weight: Bold;
    border-top: #ccc 2px solid;
}

TABLE A:link {
    color: var(--primary-color, #2986cc);
    text-decoration: none;
    font-family: "Cairo";
    font-size: var(--font-14, 14px);
}

TABLE A:active {
    color: var(--main-text, #555);
}

TABLE A:visited {
    color: var(--primary-color, #2986cc);
}

TABLE A:hover {
    color: var(--main-text, #555);
}

.TabTitle {
    color: var(--primary-color, #2986cc);
    text-decoration: none;
    font-family: "Cairo";
    font-weight: bold;
    font-size: var(--font-12, 12px);
    padding-top: 2pt;
}

label {
    font-family: "Cairo";
    font-weight: 400;
    color: var(--main-text, #555);
}

.feild_data + .ValidationClass {
    padding-right: 16px;
}

.ValidationClass {
    font-weight: normal;
    font-size: var(--font-14, 14px);
    color: #dc3545;
    font-family: "Cairo";
}

td.ValidationClass {
    padding: 0 !important;
    width: 2px !important;
    text-align: left !important;
}

    td.ValidationClass + td {
        padding-right: 2px !important;
    }

span.Success {
    font-weight: normal;
    font-size: var(--font-14, 14px);
    color: #2ba200;
    font-family: "Cairo";
}

.ValidationClass[style="visibility:hidden;"] {
    display: none;
}

.ValidationClass[style="display: inline;"] {
    display: inline-block !important;
    width: 100%;
}

.Instructions:not(th .Instructions) {
    font-size: 15px;
    font-weight: 400 !important;
    font-family: "Cairo";
    line-height: 1;
}

.Instructions:not(th .Instructions, .form-ModalPopup .Instructions) {
    font-size: var(--font-16, 16px);
    color: #dc3545;
    font-family: "Cairo";
}

.form-ModalPopup span.Instructions {
    color: #e83a3a !important;
    line-height: 1.4;
}

div.form-operation-message:has(> .Instructions) {
    background-color: #fdebc3;
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 8px;
    padding-bottom: 8px;
    border-radius: var(--border-radius-md);
    width: fit-content !important;
}

    .form-operation-links-body .itg-icons.bullet,
    div.form-operation-message:has(> .Instructions):before {
        font-family: "itg-icons";
        font-weight: normal;
        font-style: normal;
        font-size: var(--font-16, 16px);
        line-height: 1;
        letter-spacing: normal;
        text-transform: none;
        white-space: nowrap;
        word-wrap: normal;
        direction: ltr;
        font-feature-settings: "liga";
        -moz-font-feature-settings: "liga=1";
        content: "\e921";
        margin-left: 4px;
        position: relative;
        top: 2px;
        color: var(--primary-color);
    }

.InstructionsBold {
    font-size: 14px;
    font-family: "Cairo";
    font-weight: bold;
    color: #f5a224;
}

.InstructionsPopupTitle {
    font-size: 14pt;
    font-family: "Cairo";
    font-weight: bold;
    color: #000;
}

.MyPagerStyle {
    font-size: var(--font-17, 17px);
    font-family: "Cairo";
    font-weight: bold;
    color: #000;
}

#LoadBackGround,
#ConfirmBackGround,
#MessageBoxBackGround {
    display: none;
    height: 10px;
    width: 10px;
    top: 0;
    left: 0;
    background-color: rgba(var(--primary-opacaty-color), 0.4);
    backdrop-filter: blur(7px);
    border: 1px solid var(--primary-color, #2986cc);
    z-index: 900;
    cursor: wait;
}

#InstructionBackGround {
    display: none;
    height: 10px;
    width: 10px;
    top: 0;
    left: 0;
    background-color: rgba(var(--primary-opacaty-color), 0.8);
    border: 1px solid var(--primary-color, #2986cc);
    z-index: 900;
}

#ConfirmBox,
#MessageBox,
#NotificationBox {
    display: none;
    background-color: var(--dark-gray, var(--dark-black, #fff));
    border: 0;
    z-index: 1000;
    border-radius: var(--border-radius-sm) !important;
}

#ConfirmTitle,
#MessageBoxTitle,
#NotificationTitle {
    width: 100%;
    background-color: var(--primary-color, #2986cc);
    padding: 6px 6px 6px 30px;
    border-radius: var(--border-radius-sm) var(--border-radius-sm) 0 0 !important;
}

.ConfirmBox {
    position: relative;
}

.ConfirmXButton {
    border: 0;
    top: 5px;
    left: 4px;
    padding: 1px 6px 3px 6px;
    position: absolute;
    background: transparent;
    color: #fff;
    width: 35px;
    text-align: left;
    font-size: var(--font-20, 20px);
    font-weight: normal;
}

.ConfirmBox-body {
    padding: 10px 12px;
    text-align: center;
}

#ConfirmBox .form-actions input.btnstyle,
#MessageBox .form-actions input.btnstyle,
#NotificationBox .form-actions input.btnstyle {
    min-width: 60px;
    height: 36px;
}

#Loading {
    vertical-align: middle;
    width: 167px;
    height: 167px;
    z-index: 1000;
}

.MaskedEditFocus {
    background-color: #ffc;
    color: #000;
}

.MaskedEditMessage {
    color: #f00;
}

h3 {
    font-size: large;
    padding: 0 25px 0 0;
    margin: 0 0 0 0;
    height: 25px;
    background-position: right;
}

.MiddleH3 {
    font-size: var(--font-14, 14px);
    font-style: normal;
    font-weight: 600;
    white-space: nowrap;
    padding: 0 25px 0 0;
    margin: 0 0 0 0;
    height: 25px;
    background-position: right;
    border-top: 2px solid var(--border-light, #eee);
    font-family: "Cairo";
}

.H3Selected {
    font-size: var(--font-14, 14px);
    font-style: normal;
    font-weight: 600;
    white-space: nowrap;
    padding: 0 25px 0 0;
    margin: 0 0 0 0;
    height: 25px;
    background-position: right;
    background-color: #e9e9e9;
    font-family: "Cairo";
}

.MiddleH3 a {
    font-size: var(--font-12, 12px) !important;
    font-weight: bold;
    font-family: "Cairo";
}

h3 > A:link {
    text-decoration: none;
}

h3 > A:hover {
    text-decoration: none;
}

.InnerDiv {
    padding-right: 15px;
    font-family: "Cairo";
}

h4 {
    font-size: var(--font-18, 18px);
}

.MiddleH4 {
    font-size: large;
    padding: 0 25px 0 0;
    margin: 0 0 0 0;
    background-position: right top;
    border-top: 2px solid var(--border-light, #eee);
    display: table;
}

.H4Selected {
    font-size: large;
    padding: 0 25px 0 0;
    margin: 0 0 0 0;
    background-position: right top;
    background-color: #e9e9e9;
}

h4 > A:link {
    text-decoration: none;
}

h4 > A:hover {
    text-decoration: none;
}

.MenuHelp {
    list-style: none;
    margin: 0;
    padding: 0;
}

    .MenuHelp li {
        position: relative;
        height: 19px;
    }

        .MenuHelp li ul {
            list-style: none;
            margin: 0;
            background: #efefef;
            border: 1px solid #c6c6c6;
            display: none;
            position: absolute;
            top: 100%;
            right: 10px;
            width: 100px;
            padding-left: 5px;
            padding-right: 5px;
        }

        .MenuHelp li:hover ul {
            display: block;
        }

.ExtraMenuStyle {
    border-top: 1px solid #c6c6c6;
    text-decoration: none;
    font-family: "Cairo";
    font-weight: bold;
    font-size: var(--font-16, 16px);
}

.autosuggest-body {
    position: absolute;
    border: 1px solid #000;
    z-index: 100;
}

    .autosuggest-body iframe {
        display: block;
        position: absolute;
        z-index: 999;
        filter: alpha(opacity=0);
    }

    .autosuggest-body table {
        width: 100%;
        background-color: var(--dark-gray, var(--dark-black, #fff)) ff0;
    }

    .autosuggest-body tr {
        cursor: hand;
        cursor: pointer;
        color: #000;
        font-family: verdana, arial, helvetica;
        font-size: var(--font-10, 10px);
        text-align: left;
    }

        .autosuggest-body tr.up {
            height: 0;
            background: #656291 url("images/arrow-up.gif") center center no-repeat;
        }

        .autosuggest-body tr.down {
            height: 0;
            background: #656291 url("images/arrow-down.gif") center center no-repeat;
        }

        .autosuggest-body tr.up-disabled {
            height: 0;
            background: #656291 url("images/arrow-up-d.gif") center center no-repeat;
            cursor: default;
        }

        .autosuggest-body tr.down-disabled {
            height: 0;
            background: #656291 url("images/arrow-down-d.gif") center center no-repeat;
            cursor: default;
        }

        .autosuggest-body tr.selected {
            background-color: #d6d7e7;
            color: #f00;
        }

    .autosuggest-body td {
        white-space: nowrap;
    }

    .autosuggest-body span.match {
        text-decoration: underline;
    }

.PromptBoxBackGround {
    background-color: rgba(var(--primary-opacaty-color), 0.8);
    filter: alpha(opacity=70);
    opacity: 0.7;
}

.SecondMiddleH3 {
    font-size: large;
    padding: 0 25px 0 0;
    margin: 0 0 0 0;
    height: 25px;
    background: url(../../Images/Buttons/ButtonsA/Bullet.jpg) no-repeat;
    background-position: right;
    border-top: 0 solid var(--border-light, #eee);
}

.tree td div {
    height: 20px !important;
}

.tree td img {
    vertical-align: top;
}

.treeNodeStyle input {
    float: right;
}

.details-view-control td,
.details-view-control {
    border-color: #ddd !important;
}

    .details-view-control td {
        padding: 6px 12px;
        font-size: var(--font-13, 13px);
    }

@media (max-width: 430px) {
    div.form-ModalPopup:has(.col-12 .col-12:nth-child(2)) .form-ModalPopup-body {
        padding: 0 8px 0 8px !important;
    }

    div.ModalPopupExtender {
        padding: 20px 5% !important;
    }

    .details-view-control td {
        padding: 12px 4px;
        font-size: var(--font-13, 13px);
    }
}

.details-view-control .details-view-control-header {
    background-color: rgba(var(--primary-opacaty-color), 0.1);
    font-weight: 600;
}

.treeNodeStyle {
    font-size: 11.5pt !important;
    font-weight: bold;
}

    .treeNodeStyle a table {
        padding-top: 2px;
    }

.TreeOperations {
    text-align: left;
}

.TreeOperationsContent {
    text-align: left;
    width: 195px;
}

.OrderArrowsTable {
    padding: 2px 2px 0 2px;
}

.FulloptionsTD {
    border-right: 1px solid #b0c4de;
    padding-right: 10px;
}

.TreeSpacer {
    padding-left: 5px;
}

a.OrderArrowsUp {
    width: 10px;
    height: 6px;
    display: block;
    text-decoration: none;
    background: url(../../Images/Menu/menu_b_up.png);
}

    a.OrderArrowsUp:hover {
        text-decoration: none;
        background: url(../../Images/Menu/menu_o_up.png);
    }

a.OrderArrowsDown {
    width: 10px;
    height: 6px;
    display: block;
    text-decoration: none;
    background: url(../../Images/Menu/menu_b_down.png);
}

    a.OrderArrowsDown:hover {
        text-decoration: none;
        background: url(../../Images/Menu/menu_o_down.png);
    }

a.OrderArrowsUpDisabled {
    width: 10px;
    height: 6px;
    display: block;
    text-decoration: none;
    background: url(../../Images/Menu/menu_g_up.png);
}

    a.OrderArrowsUpDisabled:hover {
        text-decoration: none;
        background: url(../../Images/Menu/menu_g_up.png);
    }

a.OrderArrowsDownDisabled {
    width: 10px;
    height: 6px;
    display: block;
    text-decoration: none;
    background: url(../../Images/Menu/menu_g_down.png);
}

    a.OrderArrowsDownDisabled:hover {
        text-decoration: none;
        background: url(../../Images/Menu/menu_g_down.png);
    }

.NodeOrderTxtBox {
    background-image: url(../../images/FormBG.jpg);
    border: 1px solid #b0c4de;
    font-size: 9pt;
    font-family: tahoma;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    vertical-align: text-top;
    text-align: center;
    color: #1d6db6;
    text-decoration: none;
    width: 10px;
    height: 13px;
    background-image: none;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 5px;
    padding-right: 1px;
}

.LoginTitle {
    height: 20px;
    font-weight: bold;
    font-size: var(--font-16, 16px);
    color: #f69e18;
    font-family: "Cairo";
}

.delete_courseImg {
    border-width: 0;
    display: block;
    float: right;
    margin: 0;
    width: 15px;
    height: auto;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
}

.ui-draggable.ui-droppable {
    position: relative;
}

.container-fluid .custom-tabs.nav-tabs {
    border-bottom: 2px solid var(--border-light);
    margin-bottom: 16px;
    margin-top: -12px;
}

.container-fluid .custom-tabs .nav-link {
    border: none;
    font-size: var(--font-16, 16px) !important;
    border-radius: 0;
    color: #6c757d;
    font-weight: 400;
    transition: color 0.3s ease;
    display: flex;
    align-items: center;
    line-height: 1.4 !important;
    gap: 0.5rem;
}

    .container-fluid .custom-tabs .nav-link:hover {
        border-color: transparent;
        color: var(--primary-color);
        background-color: #f8f9fa;
    }

.container-fluid .nav-item:first-child {
    border-top-right-radius: var(--border-radius-sm) !important;
    overflow: hidden;
}

.container-fluid .custom-tabs .nav-link.active {
    color: var(--primary-color);
    background-color: var(--dark-gray, var(--dark-black, #fff));
    border-bottom: 3px solid var(--primary-color);
}

.container-fluid .tab-icon {
    font-size: var(--font-20, 20px);
}

.e32_sidebar {
    background-color: var(--dark-gray, var(--dark-black, #fff));
    width: 236px;
    min-height: auto;
    height: auto;
    max-height: 300px;
    position: fixed;
    z-index: 2;
    top: 0;
    padding-top: 60px;
    padding-bottom: 38px;
    transition-duration: 0.25s;
    -webkit-transition-duration: 0.25s;
}

    .e32_sidebar .tab-content {
        display: none;
        height: 100%;
        position: relative;
        width: 100%;
        overflow: hidden !important;
        z-index: 0;
    }

        .e32_sidebar .tab-content .tabtitle {
            font-size: var(--font-14, 14px);
            padding: 5px 10px;
            font-weight: normal;
            text-transform: uppercase;
            color: rgba(97, 111, 119, 0.5);
            position: absolute;
            bottom: 111px;
            width: 100%;
            text-align: center;
            background-color: #ededed;
        }

        .e32_sidebar .tab-content.current {
            display: inherit;
        }

    .e32_sidebar > ul.menustabs {
        display: block;
        width: 100%;
        position: absolute;
        bottom: 0;
        height: 38px;
        text-align: center;
    }

        .e32_sidebar > ul.menustabs > [class|="tab"] {
            display: block;
            min-height: 100%;
            padding-bottom: 37px;
            position: absolute;
            border-right: 1px solid #d7d7d7;
            border-top: 1px solid #d7d7d7;
        }

            .e32_sidebar > ul.menustabs > [class|="tab"] a {
                position: absolute;
                border-bottom: 3px solid #ebf1f5;
                bottom: 0;
                width: 100%;
                height: 100%;
                background-color: #ebf1f5;
                display: block;
                color: #96b6cb;
                -webkit-transition: border 0.25s ease-in-out;
                -moz-transition: border 0.25s ease-in-out;
                -ms-transition: border 0.25s ease-in-out;
                -o-transition: border 0.25s ease-in-out;
                transition: border 0.25s ease-in-out;
            }

                .e32_sidebar > ul.menustabs > [class|="tab"] a:after {
                    font-family: "icomoon";
                    font-style: normal;
                    font-weight: normal;
                    -webkit-font-smoothing: antialiased;
                    -moz-osx-font-smoothing: grayscale;
                    content: "";
                    position: absolute;
                    font-size: var(--font-16, 16px);
                    right: 0;
                    width: 100%;
                    height: 100%;
                    -webkit-transition: all 0.25s ease-in-out;
                    -moz-transition: all 0.25s ease-in-out;
                    -ms-transition: all 0.25s ease-in-out;
                    -o-transition: all 0.25s ease-in-out;
                    transition: all 0.25s ease-in-out;
                }

                .e32_sidebar > ul.menustabs > [class|="tab"] a:hover {
                    border-bottom-color: var(--primary-color, #2986cc);
                }

                    .e32_sidebar > ul.menustabs > [class|="tab"] a:hover:after {
                        color: var(--primary-color, #2986cc);
                    }

        .e32_sidebar > ul.menustabs:last-child {
            border-left: 0 none;
        }

        .e32_sidebar > ul.menustabs > .current {
            border-top: 0 none;
        }

            .e32_sidebar > ul.menustabs > .current a {
                background-color: var(--dark-gray, var(--dark-black, #fff));
                border-bottom-color: var(--primary-color, #2986cc);
                color: var(--primary-color, #2986cc);
                cursor: pointer;
            }

                .e32_sidebar > ul.menustabs > .current a:hover {
                    background-color: var(--dark-gray, var(--dark-black, #fff));
                }

        .e32_sidebar > ul.menustabs .tab-2-1,
        .e32_sidebar > ul.menustabs .tab-2-2 {
            width: 50%;
        }

        .e32_sidebar > ul.menustabs .tab-3-1,
        .e32_sidebar > ul.menustabs .tab-3-2,
        .e32_sidebar > ul.menustabs .tab-3-3 {
            width: 33.3%;
        }

        .e32_sidebar > ul.menustabs .tab-2-1,
        .e32_sidebar > ul.menustabs .tab-3-1 {
            right: 0;
        }

        .e32_sidebar > ul.menustabs .tab-3-2 {
            right: 33.3%;
        }

        .e32_sidebar > ul.menustabs .tab-2-2,
        .e32_sidebar > ul.menustabs .tab-3-3 {
            left: 0;
        }

    .e32_sidebar .menu .dropdown > a:after {
        font-family: "icomoon";
        font-style: normal;
        font-weight: normal;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        content: "";
        position: absolute;
        left: 19px;
        top: 50%;
        margin-top: -5px;
        margin-left: 0;
        font-size: var(--font-9, 9px);
        color: var(--primary-color, #2986cc);
    }

    .e32_sidebar .menu .dropdown .active:after {
        content: "";
        top: 18px;
    }

    .e32_sidebar .menu > li {
        font-size: var(--font-14, 14px);
    }

        .e32_sidebar .menu > li:hover {
            background: #f9f9f9;
        }

        .e32_sidebar .menu > li a {
            display: block;
            padding: 9px;
            color: var(--main-text, #555);
            font-size: var(--font-12, 12px);
            border-right: 4px solid var(--lighter-gray, var(--lighter-black, #ddd));
            font-family: "Cairo";
            text-overflow: ellipsis !important;
            white-space: nowrap;
            min-width: unset;
            max-width: calc(100% - 0px);
            overflow: hidden;
        }

        .e32_sidebar .menu > li:first-of-type a,
        .e32_sidebar .menu > li:first-of-type {
            border-top-left-radius: 8px;
            border-top-right-radius: 8px;
        }

            .e32_sidebar .menu > li:first-of-type a {
                border-top: 1px solid var(--border-light, #eee);
                padding-top: 16px;
                padding-bottom: 12px;
            }

        .e32_sidebar .menu > li:last-of-type,
        .e32_sidebar .menu > li:last-of-type a {
            border-bottom-left-radius: 17px;
            border-bottom-right-radius: 17px;
        }

            .e32_sidebar .menu > li:last-of-type a {
                padding-top: 12px;
                padding-bottom: 16px;
            }

        .e32_sidebar .menu > li a:hover {
            border-right-color: var(--primary-color, #2986cc);
        }

        .e32_sidebar .menu > li .active {
            background-color: var(--primary-color, #2986cc);
            border-right-color: var(--primary-color, #2986cc);
            color: #fff;
        }

            .e32_sidebar .menu > li .active:before {
                color: #fff;
            }

            .e32_sidebar .menu > li .active:after {
                color: #fff;
            }

            .e32_sidebar .menu > li .active:hover {
                border-right-color: var(--primary-color, #2986cc);
            }

        .e32_sidebar .menu > li .dropdown-menu {
            padding: 0;
            display: none;
            top: 0;
            list-style: none;
        }

            .e32_sidebar .menu > li .dropdown-menu > li {
                text-align: right;
                background-color: #f2f2f2;
            }

                .e32_sidebar .menu > li .dropdown-menu > li a {
                    background-color: #f7f7f7;
                    padding: 7px 10px;
                    margin-right: 12px;
                    border-right-color: #e6e6e6;
                    border-bottom: 1px solid var(--dark-gray, var(--dark-black, #fff));
                }

                    .e32_sidebar .menu > li .dropdown-menu > li a:hover,
                    .e32_sidebar .menu > li .dropdown-menu > li .active {
                        color: #616f77;
                        border-right-color: #ffd799;
                    }

                        .e32_sidebar .menu > li .dropdown-menu > li a:hover:after,
                        .e32_sidebar .menu > li .dropdown-menu > li .active:after {
                            color: var(--primary-color, #2986cc);
                        }

                .e32_sidebar .menu > li .dropdown-menu > li .active {
                    font-family: "Cairo";
                    border-right-color: var(--primary-color, #2986cc);
                }

                    .e32_sidebar .menu > li .dropdown-menu > li .active:hover {
                        border-right-color: var(--primary-color, #2986cc);
                    }

            .e32_sidebar .menu > li .dropdown-menu .dropdown-menu {
                margin-right: 10px;
                display: none;
                right: 195px;
            }

                .e32_sidebar .menu > li .dropdown-menu .dropdown-menu > li a {
                    background-color: #ebebeb;
                    border-right-color: #d9d9d9;
                }

                    .e32_sidebar .menu > li .dropdown-menu .dropdown-menu > li a:hover,
                    .e32_sidebar .menu > li .dropdown-menu .dropdown-menu > li .active {
                        border-right-color: #ffd799;
                    }

                        .e32_sidebar .menu > li .dropdown-menu .dropdown-menu > li a:hover:after,
                        .e32_sidebar .menu > li .dropdown-menu .dropdown-menu > li .active:after {
                            color: var(--primary-color, #2986cc);
                        }

                .e32_sidebar .menu > li .dropdown-menu .dropdown-menu > li .active {
                    border-right-color: var(--primary-color, #2986cc);
                }

                    .e32_sidebar .menu > li .dropdown-menu .dropdown-menu > li .active:hover {
                        border-right-color: var(--primary-color, #2986cc);
                    }

        .e32_sidebar .menu > li.MyProfile > a:before {
            content: "";
        }

        .e32_sidebar .menu > li.MyCalendar > a:before {
            content: "";
        }

        .e32_sidebar .menu > li.MyToDoList > a:before {
            content: "";
        }

        .e32_sidebar .menu > li.MyBlog > a:before {
            content: "";
        }

        .e32_sidebar .menu > li.MyForums > a:before {
            content: "";
        }

        .e32_sidebar .menu > li.MyStudyGroups > a:before {
            content: "";
        }

        .e32_sidebar .menu > li.AssignmentManagement > a:before {
            content: "";
        }

        .e32_sidebar .menu > li.LearningManagement > a:before {
            content: "";
        }

        .e32_sidebar .menu > li.SchoolSite > a:before {
            content: "";
        }

        .e32_sidebar .menu > li.MultimediaLibrary > a:before {
            content: "";
        }

        .e32_sidebar .menu > li.MyAssessment > a:before {
            content: "";
        }

        .e32_sidebar .menu > li.AssessmentManagement > a:before {
            content: "";
        }

        .e32_sidebar .menu > li.StaffDevelopment > a:before {
            content: "";
        }

        .e32_sidebar .menu > li > a:before {
            display: none;
        }

.tab-content .mCustomScrollBox .mCSB_container {
    direction: rtl !important;
}

.e31_rightfloatmenu *,
.e31_header *,
.e31_sidebar *,
.e32_sidebar *,
.glyphicon {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.TopUsers {
    overflow: hidden !important;
    border-radius: var(--border-radius-md) !important;
    padding: 8px 8px 2px 8px;
}

    .TopUsers:has(li:nth-child(6)) {
        padding: 0px 0px 0px 0px !important;
        margin-right: 16px !important;
    }

        .TopUsers:has(li:nth-child(6)) li {
            width: calc(100% - 16px) !important;
        }

    .TopUsers li {
        margin-right: 0 !important;
        overflow: clip !important;
    }

.userinfo {
    color: #fff;
    position: relative;
    z-index: 3;
    width: fit-content;
}

    .userinfo span {
        font-size: var(--font-13, 13px);
        font-weight: normal;
        font-family: "Cairo";
    }

    .userinfo a {
        font-size: var(--font-18, 18px);
        cursor: pointer;
        text-decoration: none;
        text-overflow: ellipsis;
        max-width: 240px;
    }

        .userinfo a:before {
            color: var(--main-text, #444) !important;
        }

.usersubinfo {
    display: block;
    color: var(--main-text, #444) !important;
    white-space: nowrap;
    overflow: hidden;
    cursor: pointer;
    padding-left: 1px;
    max-width: 240px;
    text-overflow: ellipsis;
    width: fit-content;
}

.switchUser > a:before {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
}

#ctl00_oHeader_divLoggedUser .StandardFont {
    font-size: var(--font-13, 13px);
    display: inline-block;
    margin-bottom: 5px;
}

#ctl00_oHeader_divLoggedUser .username {
    font-size: var(--font-14, 14px);
    font-weight: bold;
}

#ctl00_oHeader_divLoggedUser .usersubinfo {
    display: block;
    font-size: var(--font-11, 11px);
    color: #fff;
    white-space: nowrap;
}

.switchUser .profiles-holder {
    max-height: 400px;
    overflow-y: auto !important;
    background-color: var(--light-gray, var(--light-black, #fff)) !important;
    padding-bottom: 8px;
}

.switchUser ul li {
    list-style: none;
    overflow: hidden !important;
    background-color: var(--dark-gray, var(--dark-black, #f5f5f5)) !important;
    margin-right: 16px;
}

    .switchUser ul li:first-of-type,
    .switchUser ul li:first-of-type a {
        border-top-left-radius: 17px !important;
        border-top-right-radius: 17px !important;
        overflow: hidden !important;
    }

    .switchUser ul li a {
        display: block;
        padding: 2px 5px;
        font-size: var(--font-14, 14px);
        min-width: 300px;
        border-bottom: 1px var(--border-light) solid;
    }

        .switchUser ul li a:last-child a {
            border-bottom: 0 none;
        }

        .switchUser ul li a:hover {
            color: var(--primary-color, #2986cc);
        }

.UserType,
.username {
    display: inline-block !important;
    color: var(--main-text, #fff);
}

.username {
    font-size: var(--font-16, 16px);
    font-weight: bold;
    white-space: nowrap;
    overflow: hidden;
    vertical-align: sub;
    text-overflow: ellipsis;
    max-width: 220px;
}

.UserType {
    font-size: var(--font-12, 12px);
    padding-left: 20px;
}

.switchUser {
    position: relative;
    background-color: transparent;
    cursor: pointer;
    text-decoration: none;
    float: left;
    min-width: 90px;
}

    .switchUser .showmenu {
        top: 0;
        display: none;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
        position: absolute;
        background: var(--dark-gray, var(--dark-black, #fff));
        border: 1px #dfdfdf solid;
        -webkit-box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.11);
        -moz-box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.11);
        box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.11);
    }

        .switchUser .showmenu.open {
            opacity: 1;
            display: block;
            border: none;
            transition: 0.2s;
            box-shadow: none;
            transition: 0.2s;
            z-index: 1;
        }

@media screen and (min-width: 1025px) {
    div#ctl00_divUserMenu {
        display: block !important;
        overflow: hidden !important;
    }
}

.switchUser .showmenu.open .e32_sidebar {
    padding: 0;
    top: 40px;
    max-height: 300px;
    min-height: auto;
    width: 300px;
    box-shadow: 0 16px 15px rgba(0, 0, 0, 0.19);
    border-radius: 17px !important;
    background-color: var(--light-gray, var(--light-black, #fff)) !important;
}

.switchUser {
    background: transparent !important;
}

    .switchUser > a:before {
        position: relative;
        background: transparent !important;
        display: inline-block;
        font-family: "icomoon";
        font-style: normal;
        font-weight: normal;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        color: #fff;
        display: block;
        font-size: var(--font-14, 14px);
        content: "";
        top: 12px;
        left: -12px;
        background-color: var(--primary-color, #2986cc);
    }

#logo {
    border-bottom: 1px solid #ececec;
    display: block;
    padding: 5px;
    padding-bottom: 3px;
    text-align: center;
}

    #logo a {
        background: url(../../images/Logos/eduwave_logo.png) no-repeat;
        display: block;
        height: 50px;
        width: 110px;
        margin: 0 auto;
    }

.e31_header a.view_all {
    float: left;
    color: var(--primary-color, #2986cc);
}

.e31_header a.close_note_mobile {
    float: left;
    color: var(--primary-color, #2986cc);
    display: none;
}

.e31_header {
    position: fixed;
    background-color: var(--primary-color);
    width: calc(100% - 0px);
    padding-right: 2px;
    left: 0;
    top: 0;
    z-index: 3;
    transition: width 0.3s ease;
}

.e31_header {
    height: 70px;
}

body.darker .e31_header,
body.dark .e31_header {
    border: none;
}

.e31_header > .e31_headerinfo {
    padding-top: 12px !important;
    padding-bottom: 11px !important;
}

.e31_header .e31_headerinfo,
.e31_logo {
    float: right;
    display: flex;
    height: 100%;
}

.e31_logo {
    align-items: center;
    gap: 8px;
    padding-right: 12px;
    position: relative;
    border-left: 1px solid rgba(255, 255, 255, 0.18) !important;
    height: fit-content;
    margin-top: 8px;
}

    .e31_logo > a {
        position: relative;
    }

        .e31_logo > a:after {
            content: "";
            width: 1px;
            height: 24px;
            left: -8px;
            background-color: rgba(255, 255, 255, 0.18);
            position: absolute;
            display: block;
        }

.e31_headerinfo {
    display: flex !important;
    justify-content: center;
    align-content: center;
    align-items: center;
}

    .e31_headerinfo .userinfo {
        margin-right: 2px;
        padding-right: 16px;
        padding-left: 24px;
    }

.e31_logo > a {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    padding-right: 8px;
}

.e31_logo .logo_title {
    min-width: 122px;
    display: flex;
    height: 100%;
    gap: 3px;
    margin-top: auto;
    margin-bottom: auto;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    width: fit-content;
}

    .e31_logo .logo_title span.StandardFont:first-child {
        font-size: var(--font-16, 16px);
        font-weight: bold;
        white-space: nowrap;
        overflow: hidden;
        vertical-align: sub;
        text-overflow: ellipsis;
        color: #fff !important;
    }

    .e31_logo .logo_title span.StandardFont {
        display: block;
        width: 100%;
        text-align: center;
        text-wrap: nowrap;
        font-size: var(--font-12, 12px);
        color: var(--main-text, #ddd);
        text-align: right;
    }

.e31_header .clientlogo {
    background-color: #f1f1f1;
    height: 48px;
    width: 85px;
    color: #616f77;
    display: table;
    font-size: var(--font-12, 12px);
    text-align: right;
    float: left;
    position: relative;
    z-index: 10;
}

    .e31_header .clientlogo span {
        display: table-cell;
        vertical-align: middle;
        color: #616f77;
        text-align: right;
        max-width: 145px;
        font-size: var(--font-12, 12px);
        padding-right: 5px;
    }

    .e31_header .clientlogo img {
        width: auto;
        height: 32px;
        margin-top: 6px;
        position: absolute;
        left: 4px;
    }

.e31_header .mobile_button {
    display: none;
    margin: 20px 15px;
    cursor: pointer;
    color: #fff;
}

.e31_header .lftbtn,
.e31_header .rtbtn {
    position: absolute;
    top: 0;
}

.e31_header .lftbtn {
    right: 0;
}

.e31_header .rtbtn {
    left: 0;
}

@media screen and (max-width: 1220px) {
    div.form-ModalPopup:has(.col-12 .col-12:nth-child(2)) {
        width: 100% !important;
    }

    form.hdrsearch {
        display: none;
    }

    .topnav > ul > li {
        margin-left: 0;
    }

    .e31_header .clientlogo span {
        display: none;
    }

    .e31_header .clientlogo {
        width: 62px;
    }
}

.topnav {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
}

    .topnav > ul {
        list-style: none;
        height: 100%;
        gap: 20px;
        display: flex;
        padding-left: 32px;
        align-content: center;
    }

        .topnav > ul > li {
            position: relative;
            float: right;
            text-align: center;
            display: flex !important;
            align-content: center;
            justify-content: center;
            align-items: center;
            height: 100%;
        }

            .topnav > ul > li > a {
                min-width: 56px;
                height: 60px;
                border-radius: var(--border-radius-sm, 13px);
            }

                .topnav > ul > li > a span,
                .topnav > ul > li > a {
                    display: block;
                    text-decoration: none;
                    font-family: "Cairo";
                    font-size: var(--font-12, 12px) !important;
                    align-content: center;
                    color: #fff;
                    margin-bottom: 0;
                    font-weight: normal;
                }

                    .topnav > ul > li > a span:hover {
                        text-decoration: none;
                    }

                    .topnav > ul > li > a:before {
                        position: relative;
                        display: inline-block;
                        font-family: "icomoon";
                        font-style: normal;
                        font-weight: normal;
                        -webkit-font-smoothing: antialiased;
                        -moz-osx-font-smoothing: grayscale;
                        color: #fff;
                        display: block;
                        font-size: var(--font-20, 20px);
                    }

                    .topnav > ul > li > a:hover {
                        background: rgba(0, 0, 0, 0.1);
                        text-decoration: none !important;
                    }

.mobile_button.lftbtn.glyphicon.glyphicon-menu-home {
    display: none;
}

    .topnav > ul > li.home > a:before,
    .mobile_button.lftbtn.glyphicon.glyphicon-menu-home:before {
        content: "";
    }

.topnav > ul > li.notification span {
    font-size: var(--font-11, 11px);
}

.topnav > ul > li.notification > a:before {
    content: "";
    margin-right: -2px;
}

.topnav > ul .languageicon:hover {
    background: rgba(0, 0, 0, 0.5);
}

    .topnav > ul .languageicon:hover i {
        color: #fff;
    }

.topnav > ul .languageicon.on i {
    color: #ddd;
}

.topnav > ul > li.settings .SettingsList a {
    font-size: var(--font-12, 12px);
}

.topnav > ul > li.settings .SettingsList ul:hover {
    text-decoration: none !important;
    color: var(--primary-color, #2986cc);
}

.topnav > ul > li.language > a:before {
    content: "";
}

.topnav > ul > li.settings .SettingsList {
    width: 100px;
    top: 52px;
    display: none;
    left: -17px;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    position: absolute;
    background: var(--dark-gray, var(--dark-black, #fff));
    border: 1px #dfdfdf solid;
    -webkit-box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.11);
    -moz-box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.11);
    box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.11);
}

    .topnav > ul > li.settings .SettingsList:before {
        content: "";
        height: 0;
        width: 0;
        display: block;
        position: absolute;
        top: -12px;
        right: 50%;
        margin-right: -3px;
        border: 6px solid #f1f1f1;
        border-color: transparent transparent #f1f1f1 transparent;
    }

    .topnav > ul > li.settings .SettingsList.open {
        opacity: 1;
        display: block;
        border: 1px solid #e8e8e8;
        transition: 0.2s;
        box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.11);
        transition: 0.2s;
    }

    .topnav > ul > li.settings .SettingsList ul {
        list-style: none;
    }

        .topnav > ul > li.settings .SettingsList ul span {
            color: var(--controls-text-clr, #555) !important;
            border: 0 !important;
            font-size: var(--font-10, 10px) !important;
        }

            .topnav > ul > li.settings .SettingsList ul span:hover,
            .topnav > ul > li.settings .SettingsList ul a:hover {
                color: var(--primary-color, #2986cc) !important;
                text-decoration: underline;
            }

        .topnav > ul > li.settings .SettingsList ul li:hover {
            background-color: #f9f9f9;
        }

.topnav > ul > li.settings > a:before {
    content: "";
}

.topnav > ul > li.settings .SettingsList .jqTransformCheckboxWrapper {
    margin: 4px 3px 0 5px !important;
}

.topnav > ul > li.logout > a:before {
    content: "";
}

.topnav > ul > li.settings .SettingsList {
    padding: 7px;
}

.e31_sidebar > .tab-content > ul.menu {
    overflow-x: hidden;
    overflow-y: auto;
    margin-left: auto;
    margin-right: auto;
    height: 100%;
}

.e31_sidebar > .tab-content > ul.menu,
.e31_sidebar > .pinned-links {
    inline-size: calc(100% - 16px);
}

.e31_sidebar > .pinned-links {
    margin-left: auto;
    margin-right: auto;
    margin-top: 16px;
}

.e31_sidebar > .tab-content > ul.menu > li > section > button {
    width: 100%;
    padding: 0;
    margin: 0;
}

.e31_sidebar > .pinned-links > li,
.e31_sidebar > .tab-content > ul.menu > li {
    list-style: none;
    inline-size: calc(100% - 18px);
    margin-left: auto;
    margin-right: auto;
}

    .e31_sidebar > .tab-content > ul.menu > li > section > button span,
    .e31_sidebar > .tab-content > ul.menu > li > section > button i,
    .e31_sidebar > .tab-content > ul.menu > li > section > button {
        transition: color 0.3s ease;
    }

        .e31_sidebar > .tab-content > ul.menu > li > section > button[aria-expanded="true"]
        span,
        .e31_sidebar > .tab-content > ul.menu > li > section > button[aria-expanded="true"]
        i,
        .e31_sidebar > .tab-content > ul.menu > li > section > button[aria-expanded="true"] {
            color: var(--active-primary-color, #333) !important;
        }

@media screen and (max-width: 1220px) {
    .e31_header .clientlogo img {
        left: 15px;
    }
}

@media screen and (max-width: 1024px) {
    .topnav,
    .userinfo {
        display: none;
    }

    .topnav {
        display: flex;
        right: 52px;
        top: 10px;
        height: fit-content !important;
        width: fit-content;
    }

    .topnav-mobile ul {
        border-right: 1px solid rgba(255, 255, 255, 0.18) !important;
    }

    .topnav-mobile ul {
        scale: 0.75;
    }

        .topnav-mobile ul li a span {
            display: none;
        }

    .hdrsearch {
        display: none;
    }

    .e31_header a.close_note_mobile {
        display: block;
        color: var(--primary-color, #2986cc);
    }

    .e31_header a.view_all {
        display: none;
    }

    .e31_header .logo {
        position: absolute;
        left: auto;
        right: 100px;
        margin-right: -100px;
        padding: 0;
        z-index: 2;
        background-color: transparent;
        width: 111px;
        background-position: -4px 4px;
    }

    .e31_header .clientlogo {
        position: absolute;
        left: 10px;
        margin-left: -82px;
        padding-right: 15px;
        border-right: none;
        height: 44px;
        z-index: 2;
        background-color: transparent;
        padding-left: 0;
    }

    .e31_header .mobile_button {
        display: block;
    }

    .e31_header .open {
        z-index: 9999;
        top: -12px;
        color: #d7d7d7;
        background: var(--dark-gray, var(--dark-black, #fff));
        padding: 10px;
    }

        .e31_header .open:hover {
            color: var(--primary-color, #2986cc);
        }

    .e31_header .e31_notifications {
        max-width: 100%;
        width: 100%;
        padding: 0;
        position: fixed;
        top: 0;
        right: auto;
        left: 0;
        height: 100%;
    }

        .e31_header .e31_notifications .notifbox {
            padding-bottom: 20px;
            max-height: 100%;
        }

    #footer {
        text-align: center;
    }

        #footer .E_Footer {
            display: none;
        }

    body.Menuhidden .search2 .input-search2,
    body.Menuhidden .sidebar_footer a span,
    body .search2 .input-search2,
    body .sidebar_footer a span {
        opacity: 0 !important;
    }

    .e31_sidebar {
        min-height: calc(100% - 0px) !important;
        height: calc(100% - 0px) !important;
        position: fixed;
        bottom: unset !important;
        border-radius: 0 !important;
        top: 0 !important;
        right: 0 !important;
    }

    body .e31_sidebar,
    body.Menuhidden .e31_sidebar {
        width: 0 !important;
        border: none !important;
    }

        body .e31_sidebar .menu,
        body.Menuhidden .e31_sidebar .menu {
            opacity: 0 !important;
            pointer-events: all !important;
        }

    .e31_sidebar {
        z-index: 7 !important;
    }

    html:has(.CloseButt-SideBar) body .e31_sidebar,
    html:has(.CloseButt-SideBar) body.Menuhidden .e31_sidebar {
        width: min(80%, 262px) !important;
        box-shadow: -5px 0px 15px -1px rgba(0, 0, 0, 0.17) !important;
    }

    html:has(.CloseButt-SideBar) body.Menuhidden .search2 .input-search2,
    html:has(.CloseButt-SideBar) body.Menuhidden .sidebar_footer a span,
    html:has(.CloseButt-SideBar) body .search2 .input-search2,
    html:has(.CloseButt-SideBar) body .sidebar_footer a span {
        opacity: 1 !important;
    }

    html:has(.CloseButt-SideBar) body .e31_sidebar .menu,
    html:has(.CloseButt-SideBar) body.Menuhidden .e31_sidebar .menu {
        opacity: 1 !important;
        pointer-events: all !important;
    }

    @supports not selector(:has(div)) {
        body .e31_sidebar {
            width: min(80%, 262px) !important;
            z-index: 7;
        }

        body.Menuhidden .e31_sidebar {
            width: 72px !important;
        }

        body .e31_sidebar .search2 .input-search2,
        body .e31_sidebar .sidebar_footer a span {
            opacity: 1 !important;
        }

        body.Menuhidden .e31_sidebar .search2 .input-search2,
        body.Menuhidden .e31_sidebar .sidebar_footer a span {
            opacity: 0 !important;
        }

        body .e31_sidebar .menu {
            opacity: 1 !important;
            pointer-events: all !important;
        }

        body.Menuhidden .e31_sidebar .menu {
            opacity: 0 !important;
            pointer-events: none !important;
        }
    }

    .sidebar_header {
        margin-top: 0 !important;
        gap: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

        .sidebar_header .search2 {
            overflow: hidden !important;
            inline-size: calc(100% - 32px);
        }

    .switchUser .showmenu.open .e32_sidebar {
        display: block;
    }

    .e31_sidebar,
    .e32_sidebar,
    .sidebar_touch,
    .sidebar {
        width: 90%;
    }

        .e31_sidebar .menu,
        .e32_sidebar .menu,
        .sidebar_touch .menu,
        .sidebar .menu {
            width: 100%;
            min-width: auto;
        }

        .e31_sidebar > .menu > li {
            text-align: right;
        }

            .e31_sidebar > .menu > li .dropdown-menu {
                position: initial;
                width: 100%;
            }

            .e31_sidebar > .menu > li a {
                display: block;
                padding: 10px;
                color: #5d5d5d;
                position: relative;
            }

                .e31_sidebar > .menu > li a > i {
                    margin-left: 5px;
                    font-size: var(--font-14, 14px);
                    color: var(--primary-color, #2986cc);
                    display: inline-block;
                }

        .e32_sidebar > .menu > li {
            text-align: right;
        }

            .e32_sidebar > .menu > li .dropdown-menu {
                position: initial;
                width: 100%;
            }

            .e32_sidebar > .menu > li a {
                display: block;
                padding: 10px;
                color: #5d5d5d;
                position: relative;
            }

                .e32_sidebar > .menu > li a > i {
                    margin-left: 5px;
                    font-size: var(--font-14, 14px);
                    color: var(--primary-color, #2986cc);
                    display: inline-block;
                }

        .sidebar_touch > .menu .dropdown,
        .sidebar > .menu .dropdown {
            position: inherit;
            height: auto;
        }

    body:has(.e31_sidebar) .NewsContainer .news,
    body:has(.e31_sidebar) .contentContainer,
    body:has(.e31_sidebar).Menuhidden .NewsContainer .news,
    body:has(.e31_sidebar).Menuhidden .contentContainer {
        margin-right: 0 !important;
    }
}

@media screen and (max-width: 1221px) and (min-width: 1025px) {
    .e31_header .clientlogo {
        padding-left: 0;
    }
}

@media screen and (max-width: 350px) {
    .e31_header {
        min-width: 320px;
    }
}

.SafariOnly {
    font-size: var(--font-16, 16px);
}

@media screen and (max-width: 1220px) and (min-width: 1025px) {
    .usersubinfo {
        max-width: 100%;
        overflow: hidden;
        white-space: nowrap;
    }

    .username {
        max-width: 85%;
        overflow: hidden;
        white-space: nowrap;
    }

    .UserType {
        max-width: 260px;
        overflow: hidden;
        white-space: nowrap;
    }
}

.Clear {
    padding: 20px 0;
}

.FieldsetContainer fieldset {
    border: 1px solid #c7c7c7;
}

    .FieldsetContainer fieldset legend {
        width: 100%;
        background-color: var(--primary-color, #2986cc);
        position: relative;
        top: 14px;
        border-top: 1px solid #c7c7c7;
        border-bottom: 1px solid #c7c7c7;
        margin-bottom: 16px;
    }

        .FieldsetContainer fieldset legend span {
            margin: 0;
            padding: 5px;
            color: #fff;
        }

.OperationsLinks span,
.OperationsLinks a {
    margin: 0;
}

.MandatoryField .StandardFont .ValidationClass {
    vertical-align: top;
}

.gridheader table:nth-child(2) {
    width: 100% !important;
}

.GridViewPrint > div > table {
    width: 100% !important;
}

.GridViewPrint input {
    float: left;
}

@media screen and (max-width: 600px) {
    .scrollable {
        overflow: auto;
    }
}

.e31_sidebar {
    width: 232px;
    min-height: calc(100% - 98px);
    height: calc(100% - 98px);
    position: fixed;
    z-index: 2;
    bottom: 16px;
    right: 12px;
    background-color: var(--dark-gray, var(--dark-black, #fff));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
    border: 1px solid rgba(var(--primary-opacaty-color), 0.25) !important;
    border-radius: calc(var(--border-radius-sm) - 1px);
    transition: width ease 0.3s;
}

    .e31_sidebar #accordionExample {
        height: calc(100vh - 245px);
    }

        .e31_sidebar #accordionExample #collapseThree {
            height: calc(100vh - 285px);
            overflow: auto;
            background: #f0f0f0;
            /*            scrollbar-color: #115C74 transparent;*/
        }

            .e31_sidebar #accordionExample #collapseThree:hover::-webkit-scrollbar-thumb {
                background: content-box var(--primary-color);
            }

            .e31_sidebar #accordionExample #collapseThree::-webkit-scrollbar-thumb:active,
            .e31_sidebar #accordionExample #collapseThree::-webkit-scrollbar-thumb:hover {
                background: content-box var(--primary-color);
            }

    .e31_sidebar .tab-content {
        display: none;
        height: calc(100% - 192px);
        position: relative;
        width: 100%;
        margin-bottom: 16px;
    }

        .e31_sidebar .tab-content .tabtitle {
            font-size: var(--font-14, 14px);
            padding: 5px 10px;
            font-weight: normal;
            text-transform: uppercase;
            color: rgba(97, 111, 119, 0.5);
            position: absolute;
            bottom: 111px;
            width: 100%;
            text-align: center;
            background-color: #ededed;
        }

        .e31_sidebar .tab-content.current {
            display: inherit;
        }

    .e31_sidebar > ul.menustabs {
        display: block;
        width: 100%;
        position: absolute;
        bottom: 0;
        height: 38px;
        text-align: center;
    }

        .e31_sidebar > ul.menustabs > [class|="tab"] {
            display: block;
            min-height: 100%;
            padding-bottom: 37px;
            position: absolute;
            border-right: 1px solid #d7d7d7;
            border-top: 1px solid #d7d7d7;
        }

            .e31_sidebar > ul.menustabs > [class|="tab"] a {
                position: absolute;
                border-bottom: 3px solid #ebf1f5;
                bottom: 0;
                width: 100%;
                height: 100%;
                background-color: #ebf1f5;
                display: block;
                color: #96b6cb;
            }

                .e31_sidebar > ul.menustabs > [class|="tab"] a:after {
                    font-family: "icomoon";
                    font-style: normal;
                    font-weight: normal;
                    -webkit-font-smoothing: antialiased;
                    -moz-osx-font-smoothing: grayscale;
                    content: "";
                    position: absolute;
                    font-size: var(--font-16, 16px);
                    right: 0;
                    width: 100%;
                    height: 100%;
                }

                .e31_sidebar > ul.menustabs > [class|="tab"] a:hover {
                    border-bottom-color: var(--primary-color, #2986cc);
                }

                    .e31_sidebar > ul.menustabs > [class|="tab"] a:hover:after {
                        color: var(--primary-color, #2986cc);
                    }

        .e31_sidebar > ul.menustabs:last-child {
            border-left: 0 none;
        }

        .e31_sidebar > ul.menustabs > .current {
            border-top: 0 none;
        }

            .e31_sidebar > ul.menustabs > .current a {
                background-color: var(--dark-gray, var(--dark-black, #fff));
                border-bottom-color: var(--primary-color, #2986cc);
                color: var(--primary-color, #2986cc);
                cursor: pointer;
            }

                .e31_sidebar > ul.menustabs > .current a:hover {
                    background-color: var(--dark-gray, var(--dark-black, #fff));
                }

        .e31_sidebar > ul.menustabs .tab-2-1,
        .e31_sidebar > ul.menustabs .tab-2-2 {
            width: 50%;
        }

        .e31_sidebar > ul.menustabs .tab-3-1,
        .e31_sidebar > ul.menustabs .tab-3-2,
        .e31_sidebar > ul.menustabs .tab-3-3 {
            width: 33.3%;
        }

        .e31_sidebar > ul.menustabs .tab-2-1,
        .e31_sidebar > ul.menustabs .tab-3-1 {
            right: 0;
        }

        .e31_sidebar > ul.menustabs .tab-3-2 {
            right: 33.3%;
        }

        .e31_sidebar > ul.menustabs .tab-2-2,
        .e31_sidebar > ul.menustabs .tab-3-3 {
            left: 0;
        }

    .e31_sidebar .menu .dropdown > a:after {
        font-family: "icomoon";
        font-style: normal;
        font-weight: normal;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        content: "";
        position: absolute;
        left: 19px;
        top: 50%;
        margin-top: -5px;
        margin-left: 0;
        font-size: var(--font-9, 9px);
        color: var(--primary-color, #2986cc);
    }

    .e31_sidebar .menu .dropdown .active:after {
        content: "";
        top: 18px;
    }

    .e31_sidebar > .pinned-links > li,
    .e31_sidebar .menu > li {
        font-size: var(--font-14, 14px);
    }

        .e31_sidebar > .pinned-links > li a,
        .e31_sidebar > .tab-content > ul.menu > li button,
        .sidebar_footer a,
        .e31_sidebar .menu > li a {
            display: block;
            border-radius: var(--border-radius-sm);
            font-size: var(--font-13, 13px);
            font-weight: 600;
            position: relative;
            text-decoration: none;
            display: flex;
            block-size: 36px;
            align-content: center;
            align-items: center;
            background-color: transparent;
            gap: 0;
            overflow: hidden;
        }

            .e31_sidebar .menu > li a i:after,
            .e31_sidebar .menu > li a i,
            .e31_sidebar .menu > li ul a span,
            .e31_sidebar .menu > li a {
                color: var(--main-text, #535353) !important;
            }

html:has(body.dark, body.darker) .e31_sidebar .menu > li a i,
html:has(body.dark, body.darker) .e31_sidebar .menu > li a {
    color: var(--border-light);
}

@supports not selector(:has(div)) {
    body.dark .e31_sidebar .menu > li a i,
    body.darker .e31_sidebar .menu > li a i,
    body.dark .e31_sidebar .menu > li a,
    body.darker .e31_sidebar .menu > li a {
        color: var(--border-light);
    }
}

.sidebar_footer a {
    inline-size: calc(100% - 34px);
    margin-left: auto;
    margin-right: auto;
}

    .sidebar_footer a#lbtnSidebarLogout span,
    .sidebar_footer a#lbtnSidebarLogout i:after,
    .sidebar_footer a#lbtnSidebarLogout {
        color: hsl(346, 100%, 45%) !important;
    }

        .sidebar_footer a#lbtnSidebarLogout span {
            padding-bottom: 3px;
        }

    .sidebar_footer a span {
        opacity: 1;
        transition: opacity linear 0.3s;
    }

body.Menuhidden .sidebar_footer a span {
    opacity: 0;
}

.e31_sidebar > .pinned-links > li a span,
.e31_sidebar > .tab-content > ul.menu > li button span,
.sidebar_footer a span,
.e31_sidebar .menu > li a span {
    white-space: nowrap;
    color: var(--primary-color) !important;
    display: block;
    width: 100%;
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: right;
}

.e31_sidebar > .tab-content > ul.menu > li button span {
    min-width: 95px;
}

.e31_sidebar > .pinned-links > li a i,
.e31_sidebar > .tab-content > ul.menu > li button i,
.sidebar_footer a i,
.e31_sidebar .menu > li a i {
    display: block;
    min-width: 52px;
    text-align: center;
    color: var(--main-text, var(--primary-color, #828282));
}

    .e31_sidebar > .pinned-links > li a i:after,
    .e31_sidebar > .tab-content > ul.menu > li button i:after,
    .e31_sidebar .menu > li a i:after {
        position: relative;
        right: -6px;
    }

    .e31_sidebar > .pinned-links > li a span,
    .e31_sidebar > .pinned-links > li a i,
    .e31_sidebar > .pinned-links > li a i:before,
    .e31_sidebar > .pinned-links > li a i:after,
    .e31_sidebar > .tab-content > ul.menu > li button span,
    .e31_sidebar > .tab-content > ul.menu > li button i,
    .e31_sidebar > .tab-content > ul.menu > li button i:before,
    .e31_sidebar > .tab-content > ul.menu > li button i:after,
    .sidebar_footer a i,
    .sidebar_footer a span,
    .sidebar_footer a i:after,
    .sidebar_footer a i:before .e31_sidebar .menu > li a i,
    .e31_sidebar .menu > li a span,
    .e31_sidebar .menu > li a i:after,
    .e31_sidebar .menu > li a i:before {
        color: inherit;
    }

    .e31_sidebar .menu > li a i:after,
    .e31_sidebar .menu > li a i:before {
        font-size: var(--font-14, 14px);
    }

    .e31_sidebar > .pinned-links > li a i:after,
    .e31_sidebar > .pinned-links > li a i:before,
    .e31_sidebar > .tab-content > ul.menu > li button i:before,
    .e31_sidebar > .tab-content > ul.menu > li button i:after,
    .sidebar_footer a i:after,
    .sidebar_footer a i:before {
        font-size: var(--font-20, 20px);
        position: relative;
        right: -7px;
    }

    .e31_sidebar > .tab-content > ul.menu > li
    button
    i[data-icon="keyboard_arrow_down"]:after {
        right: 0;
        font-size: var(--font-16, 16px);
    }

    .e31_sidebar > .tab-content > ul.menu > li
    button
    i[data-icon="keyboard_arrow_down"] {
        transition: transform 0.3s ease;
    }

.e31_sidebar > .tab-content > ul.menu > li
button[aria-expanded="true"]
i[data-icon="keyboard_arrow_down"] {
    transform: rotateX(180deg);
}

.e31_sidebar > .pinned-links > li a:hover,
.e31_sidebar > .tab-content > ul.menu > li button:hover,
.sidebar_footer a:hover,
.e31_sidebar .menu > li a:not(.active):hover {
    background-color: rgba(0, 0, 0, 0.03);
    color: var(--main-text, #333);
}

.e31_sidebar > .pinned-links > li a:active,
.e31_sidebar > .tab-content > ul.menu > li button:active,
.sidebar_footer a:active,
.e31_sidebar .menu > li a:not(.active):active {
    background-color: rgba(0, 0, 0, 0.05);
    box-shadow: none;
}

.e31_sidebar .sidebar_footer a#lbtnSidebarLogout:hover {
    background-color: hsl(346, 100%, 45%, 0.05) !important;
}

.e31_sidebar .sidebar_footer a#lbtnSidebarLogout:active {
    background-color: hsl(346, 100%, 45%, 0.06) !important;
}

html:has(body.dark, body.darker) .e31_sidebar > .pinned-links > li a:hover,
html:has(body.dark, body.darker)
.e31_sidebar > .tab-content > ul.menu > li
button:hover,
html:has(body.dark, body.darker) .sidebar_footer a:hover,
html:has(body.dark, body.darker) .e31_sidebar .menu > li a:not(.active):hover {
    background-color: rgba(255, 255, 255, 0.03);
}

html:has(body.dark, body.darker) .e31_sidebar > .pinned-links > li a:active,
html:has(body.dark, body.darker)
.e31_sidebar > .tab-content > ul.menu > li
button:active,
html:has(body.dark, body.darker) .sidebar_footer a:active,
html:has(body.dark, body.darker) .e31_sidebar .menu > li a:not(.active):active {
    background-color: rgba(255, 255, 255, 0.05);
    box-shadow: none;
}

@supports not selector(:has(div)) {
    body.dark .e31_sidebar > .pinned-links > li a:hover,
    body.dark .e31_sidebar > .tab-content > ul.menu > li button:hover,
    body.dark .sidebar_footer a:hover,
    body.dark .e31_sidebar .menu > li a:not(.active):hover,
    body.darker .e31_sidebar > .pinned-links > li a:hover,
    body.darker .e31_sidebar > .tab-content > ul.menu > li button:hover,
    body.darker .sidebar_footer a:hover,
    body.darker .e31_sidebar .menu > li a:not(.active):hover {
        background-color: rgba(255, 255, 255, 0.03);
    }

    body.dark .e31_sidebar > .pinned-links > li a:active,
    body.dark .e31_sidebar > .tab-content > ul.menu > li button:active,
    body.dark .sidebar_footer a:active,
    body.dark .e31_sidebar .menu > li a:not(.active):active,
    body.darker .e31_sidebar > .pinned-links > li a:active,
    body.darker .e31_sidebar > .tab-content > ul.menu > li button:active,
    body.darker .sidebar_footer a:active,
    body.darker .e31_sidebar .menu > li a:not(.active):active {
        background-color: rgba(255, 255, 255, 0.05);
        box-shadow: none;
    }
}

.e31_sidebar .menu > li ul li a.active {
    background-color: rgba(var(--primary-opacaty-color), 0.1);
    color: rgba(var(--primary-opacaty-color), 1) !important;
}

    .e31_sidebar .menu > li ul li a.active i:after,
    .e31_sidebar .menu > li ul li a.active span {
        color: rgba(var(--primary-opacaty-color), 1) !important;
    }

.e31_sidebar .menu > li .dropdown-menu {
    padding: 0;
    display: none;
    top: 0;
    list-style: none;
}

    .e31_sidebar .menu > li .dropdown-menu > li {
        text-align: right;
        background-color: #f2f2f2;
    }

        .e31_sidebar .menu > li .dropdown-menu > li a {
            background-color: #f7f7f7;
            padding: 7px 10px;
            margin-right: 12px;
            border-right-color: #e6e6e6;
            border-bottom: 1px solid var(--dark-gray, var(--dark-black, #fff));
        }

            .e31_sidebar .menu > li .dropdown-menu > li a:hover,
            .e31_sidebar .menu > li .dropdown-menu > li .active {
                color: #616f77;
                border-right-color: #ffd799;
            }

                .e31_sidebar .menu > li .dropdown-menu > li a:hover:after,
                .e31_sidebar .menu > li .dropdown-menu > li .active:after {
                    color: var(--primary-color, #2986cc);
                }

        .e31_sidebar .menu > li .dropdown-menu > li .active {
            font-family: "Cairo";
            border-right-color: var(--primary-color, #2986cc);
        }

            .e31_sidebar .menu > li .dropdown-menu > li .active:hover {
                border-right-color: var(--primary-color, #2986cc);
            }

    .e31_sidebar .menu > li .dropdown-menu .dropdown-menu {
        margin-right: 10px;
        display: none;
        right: 195px;
    }

        .e31_sidebar .menu > li .dropdown-menu .dropdown-menu > li a {
            background-color: #ebebeb;
            border-right-color: #d9d9d9;
        }

            .e31_sidebar .menu > li .dropdown-menu .dropdown-menu > li a:hover,
            .e31_sidebar .menu > li .dropdown-menu .dropdown-menu > li .active {
                border-right-color: #ffd799;
            }

                .e31_sidebar .menu > li .dropdown-menu .dropdown-menu > li a:hover:after,
                .e31_sidebar .menu > li .dropdown-menu .dropdown-menu > li .active:after {
                    color: var(--primary-color, #2986cc);
                }

        .e31_sidebar .menu > li .dropdown-menu .dropdown-menu > li .active {
            border-right-color: var(--primary-color, #2986cc);
        }

            .e31_sidebar .menu > li .dropdown-menu .dropdown-menu > li .active:hover {
                border-right-color: var(--primary-color, #2986cc);
            }

.e31_sidebar .menu > li.MyProfile > a:before {
    content: "";
}

.e31_sidebar .menu > li.MyCalendar > a:before {
    content: "";
}

.e31_sidebar .menu > li.MyToDoList > a:before {
    content: "";
}

.e31_sidebar .menu > li.MyBlog > a:before {
    content: "";
}

.e31_sidebar .menu > li.MyForums > a:before {
    content: "";
}

.e31_sidebar .menu > li.MyStudyGroups > a:before {
    content: "";
}

.e31_sidebar .menu > li.AssignmentManagement > a:before {
    content: "";
}

.e31_sidebar .menu > li.LearningManagement > a:before {
    content: "";
}

.e31_sidebar .menu > li.SchoolSite > a:before {
    content: "";
}

.e31_sidebar .menu > li.MultimediaLibrary > a:before {
    content: "";
}

.e31_sidebar .menu > li.MyAssessment > a:before {
    content: "";
}

.e31_sidebar .menu > li.AssessmentManagement > a:before {
    content: "";
}

.e31_sidebar .menu > li.StaffDevelopment > a:before {
    content: "";
}

.sidebar_touch {
    width: 130px;
}

    .sidebar_touch > h3 {
        display: none;
    }

    .sidebar_touch > .menu .dropdown {
        position: relative;
    }

    .sidebar_touch > .menu > li {
        text-align: center;
    }

        .sidebar_touch > .menu > li a:before {
            display: block;
            font-size: var(--font-20, 20px);
            color: rgba(0, 124, 195, 0.4);
            margin: 0;
        }

        .sidebar_touch > .menu > li a:hover:before,
        .sidebar_touch > .menu > li .active:before {
            color: rgba(255, 255, 255, 0.4);
        }

        .sidebar_touch > .menu > li .dropdown-menu {
            right: 130px;
        }

.ui-menu {
    list-style: none;
    padding: 2px;
    margin: 0;
    display: block;
}

    .ui-menu .ui-menu {
        margin-top: -3px;
    }

    .ui-menu .ui-menu-item {
        margin: 0;
        padding: 2px;
        zoom: 1;
        float: left;
        clear: left;
        width: 100%;
    }

        .ui-menu .ui-menu-item a {
            text-decoration: none;
            display: block;
            padding: 0.2em 0.4em;
            zoom: 1;
        }

            .ui-menu .ui-menu-item a.ui-state-hover,
            .ui-menu .ui-menu-item a.ui-state-active {
                font-weight: normal;
                margin: -1px;
            }

.NewsContainer .news .newsTitle {
    font-family: "Cairo";
}

.NewsContainer {
    width: calc(100% - 12px);
    margin-bottom: 12px;
    background-color: var(--dark-gray, var(--dark-black, #fff));
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
    border: 1px solid rgba(var(--primary-opacaty-color), 0.25) !important;
    border-radius: calc(var(--border-radius-sm) - 1px);
}

    .NewsContainer .news {
        overflow: hidden;
        border-radius: calc(var(--border-radius-sm) + 1px);
        background-color: var(--dark-gray, var(--dark-black, #fff));
        height: 38px;
        transition: margin-right ease 0.3s;
        display: flex;
    }

        .NewsContainer .news .newsTitle {
            text-transform: uppercase;
            text-align: center;
            width: 140px;
            font-size: var(--font-14, 14px);
            font-family: "Cairo";
            font-weight: bold;
            color: var(--main-text, var(--primary-color, #94c2e5));
            border-left: 1px solid var(--border-light);
            height: 100%;
            display: flex;
            justify-content: center;
            gap: 0.75rem;
            align-items: center;
        }

            .NewsContainer .news .newsTitle i {
                background: rgba(var(--primary-opacaty-color), 0.1);
                border-radius: 50%;
                width: calc(34px * 0.85);
                height: calc(34px * 0.85);
            }

                .NewsContainer .news .newsTitle i:after {
                    position: relative;
                    top: 4px;
                    font-size: var(--font-20, 20px);
                }

.marquee-container {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    box-sizing: border-box;
    padding: 8px 0 10px 0;
}

.marquee-text {
    padding-left: 100%;
    animation: marquee-scroll 30s linear infinite;
    direction: rtl;
    font-family: inherit;
}

.marquee-container:hover .marquee-text {
    animation-play-state: paused;
}

@keyframes marquee-scroll {
    0% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(100%);
    }
}

.NewsContainer .news .marquee a,
.NewsContainer .news .marquee span {
    display: inline-block;
    padding-top: 6px;
    text-decoration: none;
    color: var(--primary-color, #2986cc);
    padding-right: 50px;
    font-family: "Cairo";
}

.NewsContainer .news .marquee a {
    color: var(--primary-color, #2986cc);
}

.NewsContainer .news .marquee marquee {
    color: var(--primary-color, #2986cc) !important;
}

#footerContainer {
    position: relative;
    width: 100%;
    bottom: 10px;
    clear: both;
    color: #616f77;
    font-size: var(--font-12, 12px);
    z-index: 1;
    right: 0;
    margin: 0;
    font-family: "Cairo";
    display: block;
}

    #footerContainer a {
        color: var(--primary-color, #2986cc);
        font-family: "Cairo";
    }

#footer {
    border-top: 1px #d7d7d7 solid;
    margin: 0 5px;
    padding: 10px 3px 11px;
    font-family: "Cairo";
}

    #footer > .col-12 {
        padding: 0;
    }

@media screen and (max-width: 300px) {
    #footer > .col-12 {
        font-size: var(--font-10, 10px);
    }
}

.E_Footer {
    position: absolute;
    background: url(../../images/NewDesign/e_footer.png) no-repeat top center;
    width: 111px;
    height: 77px;
    top: -58px;
    left: 0;
    background-size: 100%;
}

.contentContainer {
    padding-top: 72px;
    position: relative;
    min-height: 100%;
    background-color: var(--light-gray, var(--light-black, #f5f5f5));
    overflow: hidden;
    transition-property: padding-top, margin-right;
    transition-duration: 0.3s;
    transition-timing-function: ease;
}

body:has(.e31_sidebar) .contentContainer {
    margin-right: 244px;
}

body:has(.e31_sidebar).Menuhidden .contentContainer {
    margin-right: 84px;
}

@supports not selector(:has(div)) {
    body.contentContainer {
        margin-right: 244px;
    }

    body.Menuhidden .contentContainer {
        margin-right: 84px;
    }
}

.contentContainer .pagesection {
    position: relative;
    padding: 10px 9px 10px 10px;
}

.page-header {
    border-radius: var(--border-radius-sm, 13px);
}

    .page-header .StandardFont {
        color: var(--main-text, #555);
        font-size: var(--font-16, 16px);
        font-weight: 600;
    }

.pagesectioncontent {
    padding: 12px 24px;
    border-radius: var(--border-radius-sm, 13px);
    background-color: var(--dark-gray, var(--dark-black, #fff));
    font-size: var(--font-14, 14px);
    color: var(--main-text, #555);
    font-family: "Cairo";
    margin-bottom: 16px;
    height: 100%;
    min-height: calc(100vh - 226px);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
    border: 1px solid rgba(var(--primary-opacaty-color), 0.25) !important;
}

    .pagesectioncontent > .nav.nav-tabs {
        border: none;
    }

        .pagesectioncontent > .nav.nav-tabs > .nav-link {
            border: none;
            border-bottom: 2px solid transparent;
        }

            .pagesectioncontent > .nav.nav-tabs > .nav-link:hover {
                color: var(--active-primary-color);
            }

            .pagesectioncontent > .nav.nav-tabs > .nav-link.active {
                border-color: var(--primary-color);
                color: var(--primary-color);
            }

.pagesectionheader + .pagesectioncontent {
    min-height: calc(100vh - 306px);
    padding: 12px 18px;
}

.contentContainer .pagesection a.StandardFont[title="انقر هنا."] {
    margin-right: 1px;
}

.contentContainer .sectionHeaderTitle .StandardFont {
    font-size: var(--font-18, 18px);
    font-size: var(--main-text, #344054) !important;
    font-weight: bold !important;
    display: inline-block !important;
    padding-top: 12px !important;
    padding-bottom: 16px !important;
}

.divcentered {
    float: none !important;
    margin: auto !important;
}

.new_accordiand_header {
    text-align: right;
    color: #fff;
    cursor: pointer;
    font-size: 15px;
    margin-bottom: 0px !important;
    margin-top: 15px;
    font-family: "Cairo";
    font-weight: 400;
    height: 42px;
    padding-right: 16px;
    display: flex;
    align-items: center;
}

    .new_accordiand_header:before {
        font-family: "ITG Material Icons";
        content: "folder_open";
        position: absolute;
        left: 16px;
        top: 4px;
        font-size: 24px;
        color: #fff;
        font-weight: normal;
    }

    .new_accordiand_header.collapsed:before {
        font-family: "ITG Material Icons Outlined";
        content: "folder";
        color: #fff;
    }

.row_accordian {
    margin: -10px;
}

.float_right {
    float: right;
}

.new_accordian_header_option {
    color: #fff;
}

.search_accordian {
    width: 100%;
    border: 1px solid var(--border) !important;
    cursor: pointer;
    padding: 8px 42px 8px 6px !important;
    font-size: var(--font-14, 14px);
    border-radius: var(--border-radius-sm) !important;
    margin-bottom: 8px;
}

ul:has(.accordian_child_list) {
    border: 1px solid var(--border-light, #eee);
    border-radius: var(--border-radius-sm, 13px);
    box-shadow: 4px 3px 0 rgba(0, 0, 0, 0.05);
    padding: 0 !important;
}

@supports not selector(:has(div)) {
    ul.panel-collapse {
        border: 1px solid var(--border-light, #eee);
        border-radius: var(--border-radius-sm, 13px);
        box-shadow: 4px 3px 0 rgba(0, 0, 0, 0.05);
        padding: 0 !important;
    }
}

.accordian_child_list {
    padding: 5px 0px 5px 0px;
    border-top: 0;
    width: 100%;
    display: block;
    cursor: pointer;
    position: relative;
    width: calc(100% - 32px) !important;
    margin-left: auto;
    margin-right: auto;
    border-bottom: 1px dashed #ddd;
}

    .accordian_child_list:first-child {
        padding-top: 12px;
    }

    .accordian_child_list:last-child {
        border-bottom: none;
        padding-bottom: 12px;
    }

    .accordian_child_list:before {
        font-family: "ITG Material Icons";
        content: "link";
        position: absolute;
        left: 3px;
        top: 8px;
        font-size: var(--font-21, 21px);
        color: #ccc;
    }

    .accordian_child_list:hover:before {
        color: var(--primary-color);
    }

    .accordian_child_list:first-child:before {
        top: 14px;
    }

    .accordian_child_list a {
        font-size: 14px !important;
        width: 100%;
        display: block;
        color: var(--main-text, #344054);
        padding: 5px 2px;
        padding-left: 28px;
    }

        .accordian_child_list a:hover {
            color: var(--primary-color, #115c74) !important;
            text-decoration: underline;
            font-family: "Cairo" !important;
        }

.accordian_child {
    margin-top: 15px;
}

.search_accordian_icon {
    position: relative;
    margin-bottom: 8px;
}

    .search_accordian_icon input {
        background-color: rgba(var(--primary-opacaty-color, 0, 0, 0), 0.03);
    }

    .search_accordian_icon:before {
        font-family: "ITG Material Icons";
        content: "search";
        position: absolute;
        font-size: 25px;
        font-weight: normal;
        right: 12px;
        top: 2px;
        color: rgba(var(--primary-opacaty-color, 0, 0, 0), 0.6);
        background: transparent;
    }

.view_grid:before {
    font-family: "ITG Material Icons";
    content: "visibility";
    font-size: var(--font-15, 15px);
    font-weight: normal;
}

.edit_grid:before {
    font-family: "ITG Material Icons";
    content: "edit";
    font-size: var(--font-15, 15px);
    font-weight: normal;
}

.delete_grid:before {
    font-family: "ITG Material Icons Outlined";
    content: "delete";
    font-size: var(--font-15, 15px);
    font-weight: normal;
}

.TableGrid tbody > tr > td {
    padding: 2px 5px !important;
}

    .TableGrid tbody > tr > td .labelsStyle {
        margin: 0;
    }

.grid_li {
    display: inline;
    margin: 0 5px;
    padding-top: 4px;
    position: relative;
}

.TableGrid tbody > tr > th {
    padding: 3px 5px;
}

.grid_icons:before {
    color: var(--primary-color, #2986cc);
    font-size: var(--font-15, 15px);
    cursor: pointer;
}

.ul_datatoggle {
    display: none;
    background-color: var(--dark-gray, var(--dark-black, #fff));
    padding: 5px;
    border-radius: 3px;
    border: 1px solid var(--primary-color, #2986cc);
    list-style: none;
    position: absolute;
    right: -105px;
    width: 130px;
    z-index: 1;
    list-style: outside none none;
    padding: 5px;
    position: absolute;
    z-index: 2;
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #e0e0e0;
    box-shadow: 2px 2px 2px #cdcdcd;
}

    .ul_datatoggle a {
        display: block;
        font-size: var(--font-13, 13px);
        max-width: 200px;
        padding: 2px 5px;
        white-space: nowrap;
        border-bottom: 1px solid #e0e0e0;
    }

        .ul_datatoggle a:hover {
            background-color: #f9f9f9;
        }

.grid_items {
    margin: 0;
    text-align: right;
}

ul.row.nav-tabs.accordiant {
    border: 0;
    margin: 0;
    margin-left: 14px;
    background-color: var(--dark-gray, var(--dark-black, #fff)) !important;
}

    ul.row.nav-tabs.accordiant > li {
        padding: 0;
    }

.accordiant_taps {
    text-align: center;
}

li.accordiant_taps.float_right:last-of-type {
    margin-left: 6px;
    border-left: 1px solid #ddd;
    padding-left: 8px !important;
}

li.accordiant_taps.float_right a {
    border-radius: 16px !important;
    background-color: #f4f4f4;
}

li.accordiant_taps.float_right.active a {
    background-color: var(--light-primary-color);
    color: #fff;
    border: none;
}

    li.accordiant_taps.float_right.active a i:before {
        color: #fff !important;
    }

li.accordiant_taps.float_right a > i.fa {
    color: var(--primary-color, #2986cc) !important;
    font-size: var(--font-16, 16px);
    cursor: pointer;
}

li.accordiant_taps.float_right.active a > i.fa {
    color: var(--primary-color, #2986cc) !important;
    cursor: pointer;
}

.taps_empty {
    height: 10px;
}

.search_list_items {
    margin-bottom: 0;
}

.search_item_header {
    font-size: var(--font-16, 16px);
    padding: 8px 24px;
    background-color: var(--light-primary-color, #115c74);
    color: #fff;
    margin: 0;
    width: 100%;
    font-family: "Cairo";
    font-weight: bold;
    border-radius: var(--border-radius-sm);
    margin-top: 16px;
}

.main_ul_links:first-of-type .search_item_header {
    margin-top: 0;
}

.accordian_child_list_search {
    padding: 7px 7px;
    background: var(--dark-gray, var(--dark-black, #fff));
    border-bottom: 1px dashed #ddd;
    border-top: 0;
    width: 100%;
    display: block;
    cursor: pointer;
    position: relative;
    font-size: var(--font-14, 14px);
    padding-left: 25px;
}

    .accordian_child_list_search a {
        color: var(--main-text, #344054);
        font-family: "Cairo";
        padding-right: 10px;
    }

        .accordian_child_list_search a:hover {
            color: var(--primary-color, #2986cc);
        }

    .accordian_child_list_search:last-child {
        border-bottom: 0;
    }

    .accordian_child_list_search:before {
        font-family: "ITG Material Icons";
        content: "link";
        position: absolute;
        left: 10px;
        top: 6px;
        font-size: var(--font-18, 18px);
        color: var(--primary-color, #2986cc);
    }

    .accordian_child_list_search:hover {
        background: #f9f9f9;
    }

div.links_list:empty {
    display: none;
}

.nav > li > a:hover,
.nav > li > a:focus,
.nav > li > a {
    border: 0;
    font-size: var(--font-14, 14px);
    font-weight: normal;
    border-radius: 4px;
}

.accordian_child_list span {
    font-size: var(--font-13, 13px);
    width: 100%;
    cursor: no-drop;
    display: block;
    font-family: "Cairo";
}

ul.panel-collapse li.accordian_child_list:last-child {
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

i.fa:before,
i.fa:after {
    font-family: fontAwesome;
}

.Menuhidden .news {
    margin-right: 0;
}

.Menuhidden .contentContainer {
    margin-right: 0;
}

.Menuhidden .e31_sidebar {
    width: 72px;
}

.switchUser .showmenu.open .e32_sidebar {
    max-height: 300px;
    min-height: auto;
}

.switchUser .showmenu.open .e32_sidebar {
    overflow: inherit;
    border-radius: var(--border-radius-sm, 13px);
    overflow-x: hidden;
}

.hidden_user_info {
    display: none;
}

    .hidden_user_info:before {
        content: "";
        height: 0;
        width: 0;
        display: block;
        position: absolute;
        top: -12px;
        right: 50%;
        margin-right: -3px;
        border: 6px solid #f1f1f1;
        border-color: transparent transparent #f1f1f1 transparent;
    }

    .hidden_user_info.open {
        display: block;
        position: absolute;
        background: var(--dark-gray, var(--dark-black, #fff));
        z-index: 10000000;
        color: var(--main-text, #555);
        font-weight: 600;
        padding: 10px;
        border: solid 1px #e8e8e8;
        -webkit-box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.12);
        -moz-box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.12);
        box-shadow: 3px 3px 0 rgba(0, 0, 0, 0.12);
        opacity: 1;
        top: 45px;
    }

#oHeader_lblWelcomeUser {
    float: right;
    margin-left: 3px;
}

.NewsContainer .news .marquee a,
.NewsContainer .news .marquee span {
    padding: 0;
}

.marquee_section {
    height: 100%;
}

.e31_headerinfo #ctl00_oHeader_divSwitchUser.switchUser {
    color: var(--primary-color, #2986cc) !important;
    font-family: "Cairo";
}

@media screen and (max-width: 1024px) {
    .MenuHamButt {
        display: none;
    }

    .NewsContainer .news {
        margin-right: 0;
    }

    .userinfo .StandardFont {
        color: var(--primary-color, #2986cc) !important;
    }

    .MenuHamButt {
        display: none !important;
    }

    .e31_header .mobile_button {
        margin: 0;
    }

    .e32_sidebar {
        max-width: 300px;
    }

    .e31_header {
        display: flex;
    }

    .e31_logo {
        margin-right: auto;
    }

    .mobile_button.lftbtn.glyphicon.glyphicon-menu-hamburger {
        position: absolute;
        right: 12px;
        top: 10px;
        width: 48px;
        height: 48px;
        text-align: center;
        border-radius: 50%;
        border-radius: var(--border-radius-lg);
        transition: right ease 0.3s;
    }

        .mobile_button.lftbtn.glyphicon.glyphicon-menu-hamburger:before {
            position: absolute;
            font-family: "itg material icons outlined";
            content: "\e5d2";
            font-size: var(--font-42, 42px);
            font-weight: 400;
            top: -5px;
            right: 8px;
        }

    html:has(.CloseButt-SideBar)
    body
    .mobile_button.lftbtn.glyphicon.glyphicon-menu-hamburger {
        right: min(84%, 272px) !important;
    }

    @supports not selector(:has(div)) {
        body .mobile_button.lftbtn.glyphicon.glyphicon-menu-hamburger {
            right: min(84%, 272px) !important;
        }

        body.Menuhidden .mobile_button.lftbtn.glyphicon.glyphicon-menu-hamburger {
            right: 82px;
        }
    }

    .mobile_button.lftbtn.glyphicon.glyphicon-menu-hamburger.CloseButt-SideBar:before {
        content: "\e5cd";
        font-size: var(--font-32, 32px);
        top: 0px;
    }

    .mobile_button.lftbtn.glyphicon.glyphicon-menu-hamburger.CloseButt-SideBar {
        backdrop-filter: blur(3px);
        box-shadow: -2px 0px 5px -1px rgba(0, 0, 0, 0.37) !important;
    }

    .topnav-mobile > a.closeButt-Menu {
        display: none !important;
    }

    a.closeButt-Menu:before {
        top: 0 !important;
    }

    .topnav-mobile ul {
        display: flex;
        flex-direction: row;
        gap: 12px;
        justify-content: center;
        align-content: center;
        align-items: center;
    }

        .topnav-mobile ul li {
            width: 100%;
            display: flex;
        }

    .topnav ul a {
        border-radius: var(--border-radius-sm) !important;
    }

    .topnav-mobile ul li:first-child {
        margin-right: 20px;
    }

    .topnav > ul > li:hover,
    .topnav > ul > li > a:hover,
    .topnav > ul .languageicon:hover {
        background: rgba(183, 183, 183, 0.5);
    }

    .topnav > ul > li > a {
        width: 100%;
        padding-right: 14px !important;
        box-sizing: border-box;
    }

        .topnav > ul > li > a span,
        .topnav > ul > li > a {
            display: inline-block;
            padding: 8px 4px 6px 5px;
            text-decoration: none;
            font-family: "Cairo";
            font-size: var(--font-11, 11px) !important;
            color: var(--primary-color, #2986cc) !important;
            margin-bottom: 0;
        }

    .e31_header .rtbtn.open:before {
        content: "" !important;
        color: var(--primary-color, #2986cc) !important;
    }

    .topnav > ul > li > a:before,
    .topnav > ul > li > a:visited:before {
        display: inline-block;
        margin-left: 10px;
        color: var(--primary-color, #2986cc);
    }

    .switchUser ul {
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .ReportContainer {
        width: 100% !important;
    }
}

@media screen and (max-width: 1024px) {
    .contentContainer {
        margin-right: 0;
    }

    .contentContainer_touch {
        margin-right: 0;
    }

    .contentContainer .pagesection .searcharia .searchariabody table {
        display: block;
    }

        .contentContainer .pagesection .searcharia .searchariabody table table {
            width: auto !important;
        }
}

div:has(> table.table-Style) {
    overflow-x: auto !important;
    overflow-y: clip !important;
    position: relative !important;
    padding-bottom: 12px;
    max-width: calc(100vw - 63px) !important;
}

.table-Style .input-with-btn {
    padding-bottom: 0;
    margin-bottom: 0;
}

.table-Style td .col {
    min-width: 300px;
}

.col .radioButtonList td .radio-input-container {
    justify-content: start;
}

.col .radioButtonList {
    margin-right: -4px !important;
}

table.table-Style .radioButtonList .radio-input-container {
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 0;
}

table.table-Style .row-cols-1,
table.table-Style .col,
table.table-Style .form-group {
    margin-bottom: 0 !important;
}

table.table-Style .multiselect-native-select,
table.table-Style .select2-container {
    margin: 0 !important;
}

table.table-Style .form-control:not(textarea) {
    box-shadow: none;
    border: 1px solid #171717;
    border-radius: 9px;
    height: 37px;
}

.form-group.form-with-btn {
    min-width: 390px !important;
}

.table-Style div[id*="_dragger_horizontal"] {
    margin-top: 8px;
}

table:has(table.table-Style) {
    border-spacing: 0 0px;
    border-collapse: separate !important;
    border: none;
}

table.table-Style {
    width: 100%;
    border-spacing: 0 10px;
    border-collapse: separate !important;
    border: none;
}

.table:not(.table-responsive .table, .table .table-responsive) > tbody > tr {
    display: table-row;
    width: auto;
    clear: both;
    box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.08);
    border-radius: 4px;
    overflow: hidden;
    border: none;
}

.table-Style > tbody > tr:hover {
    background-color: transparent !important;
}

.table-Style > tbody > tr:not(.pagination-container) > th {
    border: none;
    padding-right: 24px;
    vertical-align: middle !important;
    font-weight: normal;
    color: var(--primary-color);
    position: relative;
    font-size: var(--font-16, 16px);
    display: table-cell;
    text-align: start;
    white-space: nowrap;
    font-family: "Cairo";
    overflow: hidden;
}

    .table-Style > tbody > tr:not(.pagination-container) > th .sort-icon:after {
        position: relative;
        top: 2px;
        font-family: "ITG Material Icons" !important;
        content: "\e5db";
        font-size: 14px;
        color: #000 !important;
    }

    .table-Style > tbody > tr:not(.pagination-container) > th
    .sort-icon.descending:after {
        content: "\e5d8";
    }

.table-Style caption {
    color: var(--controls-text-clr) !important;
    font-size: var(--font-14, 14px) !important;
    padding: 0 4px !important;
}

#ctl00_PlaceHolderMain_gvDynamicStudentsMark.table-Style > tbody > tr:not(.pagination-container) > th {
    vertical-align: top !important;
}

.table-Style > tbody > tr:not(.pagination-container) > th:first-of-type {
    padding-right: 22px;
}

.table-Style > tbody > tr:not(.pagination-container) > th a {
    font-size: var(--font-16, 16px);
    font-family: "Cairo";
}

.table-custom > tbody > tr:not(.pagination-container) > th span.form-label {
    font-size: var(--font-16, 16px) !important;
    font-family: "Cairo";
    color: var(--primary-color);
}

.table-Style > tbody > tr:not(.pagination-container) > th:before {
    content: "";
    display: block;
    position: absolute;
    height: 100%;
    border-left: 1px solid var(--border-light, #c4c4c4);
}

.table-Style > tbody > tr:not(.pagination-container) > th:first-of-type:before {
    right: 18px;
}

.table-Style > tbody > tr:not(.pagination-container) > th:first-of-type label {
    margin-right: 8px;
    margin-bottom: -4px;
}

.table-Style > tbody > tr:not(.pagination-container) th.noBorder:before,
.table-Style > tbody > tr:not(.pagination-container)
th.wizardGridtoolsTd:before {
    display: none;
}

.table-Style > tbody > tr:not(.pagination-container) th.noBorder,
.table-Style > tbody > tr:not(.pagination-container) th.wizardGridtoolsTd {
    padding: 15px 20px 4px 20px;
}

.table-Style > tbody > tr:not(.pagination-container) > .wizardGridtoolsTd {
    text-align: right;
}

.table-Style > tbody > tr:not(.pagination-container) > td {
    display: table-cell;
    padding: 16px 24px 16px 13px;
    background-color: #f8f8f8;
    border: none;
    text-align: right;
}

.table-Style > tbody > tr.RowRedStyle:not(.pagination-container) > td {
    background: #f2dede;
}

    .table-Style > tbody > tr.RowRedStyle:not(.pagination-container) > td:first-child:before {
        background: #a94442;
    }

.table-Style > tbody > tr:not(.pagination-container) > td:first-child {
    border-radius: 0 13px 13px 0;
    position: relative;
}

    .table-Style > tbody > tr:not(.pagination-container) > td:first-child:before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        height: 100%;
        width: 6px;
        background: var(--_bg-color, var(--primary-color));
        border-radius: 13px 0 0 13px;
    }

.table-Style.table-custom > tbody > tr:not(.pagination-container):nth-of-type(2n + 1)
td:first-child:before {
    background: var(--secondary-color);
}

.table-Style > tbody > tr:not(.pagination-container) > td[rowspan]:first-child + td {
    position: relative;
}

.table-Style > tbody > tr:not(.pagination-container) > td.RowMerge:first-child:before {
    display: none !important;
}

.table-Style > tbody > tr:not(.pagination-container) > td:last-child {
    border-radius: 0 4px 4px 0;
    box-shadow: inset 1px 0px 0px #fff;
}

.table-Style .material-icons-outlined::after,
.table-Style .material-icons::after {
    font-size: var(--font-18, 18px);
}

.table-Style > tbody > tr:not(.pagination-container) > td:first-child:before {
    right: 0;
    left: auto;
    border-radius: 0 8px 8px 0;
}

.table-Style > tbody > tr:not(.pagination-container) th::before {
    right: 18px;
    top: 0;
}

.table-Style > tbody > tr:not(.pagination-container) > td:last-child {
    border-radius: 8px 0 0 8px;
    box-shadow: inset 1px 0px 0px #fff;
}

body.dark .table-Style > tbody > tr:not(.pagination-container) > td:last-child,
body.darker
.table-Style > tbody > tr:not(.pagination-container) > td:last-child {
    box-shadow: inset 1px 0px 0px #333;
}

.table-Style > tbody > tr:not(:first-of-type) th {
    padding: 0 18px 0 0;
    text-align: right !important;
}

    .table-Style > tbody > tr:not(:first-of-type) th:before {
        right: 12px;
        top: 4px;
        height: 100%;
    }

.table-Style th[colspan="3"] {
    text-align: center !important;
    border: none !important;
    padding: 0 0 8px 0 !important;
    border-bottom: 1px solid var(--border-light, #c4c4c4) !important;
}

    .table-Style th[colspan="3"]:before {
        display: none !important;
    }

.table-Style
table.table-Style:has(td[rowspan]) > tbody > tr:not(tr:last-of-type) > td:not(td[rowspan]):before {
    display: none;
}

.pagination-container {
    text-align: center;
    border: none !important;
}

    .pagination-container td {
        border: none !important;
    }

    .pagination-container table {
        margin: auto;
    }

    .pagination-container tr {
        margin: 0 auto;
        padding: 0;
        list-style: none;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

        .pagination-container tr td {
            display: inline-block;
        }

            .pagination-container tr td span,
            .pagination-container tr td a {
                display: inline-block;
                padding: 10px;
                color: #777777;
            }

                .pagination-container tr td a:hover {
                    color: var(--primary-color);
                }

                .pagination-container tr td a.kabab-menu {
                    -webkit-transform: rotate(90deg);
                    transform: rotate(90deg);
                }

            .pagination-container tr td span,
            .pagination-container tr td a {
                width: 28px;
                height: 28px;
                font-size: var(--font-13, 13px);
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                -webkit-box-pack: center;
                -ms-flex-pack: center;
                justify-content: center;
                -webkit-box-align: center;
                -ms-flex-align: center;
                align-items: center;
                margin: 0 4px;
            }

            .pagination-container tr td span {
                background-color: var(--primary-color);
                border-radius: 50%;
                -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
                box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
                color: #fff;
            }

            .pagination-container tr td a[class*="material-icons"] {
                color: var(--primary-color);
                text-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
            }

                .pagination-container tr td a[class*="material-icons"]::after {
                    font-size: var(--font-27, 27px);
                }

            .pagination-container tr td a[class*="material-icons"] {
                font-family: "ITG Material Icons" !important;
                text-decoration: none;
            }

            .pagination-container tr td .material-icons[data-icon="more_horiz"]::after {
                font-size: var(--font-18, 18px) !important;
            }

.table-Style.GradeView th .form-label {
    color: var(--primary-color) !important;
    font-family: "Cairo";
    color: var(--controls-text-clr, #555) !important;
}

.table-Style.GradeView th .LabelHeaderCell {
    font-family: "Cairo";
    font-size: var(--font-12, 12px);
    position: relative;
}

.table-Style.GradeView th:before {
    display: none !important;
}

.table-Style.GradeView th td:first-child .LabelHeaderCell::before {
    display: none !important;
}

.table-Style.GradeView th .LabelHeaderCell::before {
    content: "";
    display: block;
    position: absolute;
    right: -3px;
    top: 2px;
    height: 18px;
    width: 1px;
    border-left: 1px solid var(--border-light, #c4c4c4);
}

.GridClass th {
    color: #fff;
    border-color: #1e756d;
    font-size: var(--font-15, 15px);
    font-weight: bold;
}

.GridClass td span {
    white-space: pre-line !important;
}

.GridClass td a {
    white-space: pre-line !important;
}

.tableHeaderCell > th:last-child {
    color: #fff;
    text-align: center;
}

    .tableHeaderCell > th:last-child .Instructions {
        color: #fff;
        text-align: center;
        font-size: var(--font-15, 15px);
    }

.GridClass td {
    padding: 4px 3px;
    border-color: #ccc;
}

.tableFooterCell td {
    border-color: #1f9086;
}

    .tableFooterCell td:last-child {
        text-align: center;
    }

table.tblOptions {
    margin: 0 auto;
}

    table.tblOptions tr td {
        padding: 0 8px 0 8px;
        min-width: 70px;
        text-align: center;
        vertical-align: middle;
        position: relative;
    }

        table.tblOptions tr td:not(:has(*)) {
            display: none !important;
        }

        table.tblOptions tr td:after {
            content: "";
            width: 1px;
            height: 24px;
            position: absolute;
            left: 0;
            top: calc(50% - 12px);
            background-color: #ddd;
        }

        table.tblOptions tr td:last-child {
            padding: 0 8px 0 8px;
        }

            table.tblOptions tr td:last-child:after {
                content: unset;
            }

.GridClass .MyPagerStyle a {
    color: #fff !important;
    display: inline-block;
    padding: 3px 9px;
    background-color: var(--primary-color, #2986cc);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
}

.GridClass .MyPagerStyle span {
    color: var(--controls-text-clr, #555) !important;
    display: inline-block;
    padding: 3px 9px;
    background-color: #d7d7d7;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    -ms-border-radius: 3px;
    border-radius: 3px;
}

.btnstyle {
    border-width: 0;
    background: var(--primary-color, #2986cc);
    color: #fff;
    padding: 0 12px;
    margin: 10px 6px;
    font-family: "Cairo";
    height: var(--controls-height, 48px);
    font-weight: bold;
    border-radius: var(--border-radius-sm, 13px);
    transition: background 0.3s ease-in-out;
}

    .btnstyle[disabled="disabled"] {
        background-color: rgba(var(--primary-opacaty-color), 0.5);
        cursor: not-allowed;
    }

    .btnstyle:has(i) {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 4px;
        padding-left: 28px;
        padding-right: 28px;
    }

    .btnstyle i:after,
    .btnstyle i:before {
        font-size: 20px !important;
    }

    .btnstyle span {
        height: unset !important;
        min-height: unset !important;
        font-weight: bold;
    }

    .btnstyle:not([disabled="disabled"]):hover {
        background: var(--light-primary-color, #1e6bb8);
        text-decoration: none;
        color: #fff;
        cursor: pointer;
    }

.feild_data .btnstyle[title="تدقيق"] {
    height: var(--controls-height, 48px);
    border: none;
    margin: 0;
    max-width: 80px;
}

.btnCloseX {
    background: none;
    border: 0;
    position: absolute;
    width: 35px;
    height: 30px;
    left: 0;
}

#ConfirmTitle span,
#NotificationTitle span {
    color: #fff;
    font-weight: normal;
}

.PrintStyle {
    margin-bottom: 5px;
    float: left;
    filter: hue-rotate(30deg);
}

fieldset {
    border: 1px solid rgba(var(--primary-opacaty-color), 20%);
    padding: 10px;
}

.dvfHeaderStyle {
    background: rgba(var(--primary-opacaty-color), 0.25);
}

.fileStyle {
    position: relative;
    display: table-cell;
    background: var(--primary-color, #2986cc);
    color: #fff;
    border-radius: var(--border-radius-sm, 13px);
    cursor: pointer;
    text-align: center !important;
}

    .fileStyle label {
        color: #fff;
        font-weight: bold;
        font-size: var(--font-12, 12px);
        font-weight: normal;
        padding: unset;
        margin: unset;
        vertical-align: middle;
        cursor: pointer;
        text-align: center !important;
    }

span.fileStyle label span {
    cursor: pointer;
    font-family: "Cairo";
    display: block;
    font-size: var(--font-12, 12px);
    font-weight: bold;
    width: 100% !important;
    min-width: 70px;
    text-align: center;
    padding-bottom: 4px !important;
}

@media (max-width: 650px) {
    .inputFileStyle {
        width: 9% !important;
    }
}

.ajax__tab_xp.ajax__tab_container {
    padding: 0 6px;
}

.ajax__tab_xp .ajax__tab_tab {
    background: none !important;
    height: auto !important;
    width: 100%;
}

.ajax__tab_xp .ajax__tab_body {
    font-family: "Cairo";
    font-size: var(--font-20, 20px);
}

.ajax__tab_xp .ajax__tab_header {
    align-items: center;
    background: var(--dark-gray, var(--dark-black, #fff)) !important;
    border-bottom: 0;
    border-radius: var(--border-radius-sm);
    display: flex;
    margin-bottom: 16px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    width: calc(100% - 32px) !important;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
    border: 1px solid rgba(var(--primary-opacaty-color), 0.25) !important;
}

    .ajax__tab_xp .ajax__tab_header .ajax__tab_inner,
    .ajax__tab_xp .ajax__tab_header .ajax__tab_inner span span,
    .ajax__tab_xp .ajax__tab_header .ajax__tab_inner span {
        display: inline-block;
        height: 100%;
        width: 100% !important;
    }

    .ajax__tab_xp .ajax__tab_header span {
        font-family: "Cairo" !important;
        font-weight: 900 !important;
        font-size: var(--font-15, 15px) !important;
    }

        .ajax__tab_xp .ajax__tab_header span > span {
            padding-bottom: 3px;
        }

    .ajax__tab_xp .ajax__tab_header .ajax__tab_active span {
        color: #fff !important;
    }

    .ajax__tab_xp .ajax__tab_header > span:has(span:empty) {
        display: none !important;
    }

    .ajax__tab_xp .ajax__tab_header > * {
        flex: 1;
        display: flex;
        justify-content: center;
        padding-top: 0px;
        align-items: center;
        align-content: center;
        flex-direction: row;
        height: var(--controls-height, 40px);
        overflow: hidden;
        position: relative;
        text-align: center;
    }

        .ajax__tab_xp .ajax__tab_header > *::before {
            background: #bbbbbb;
            content: "";
            display: block;
            height: 64%;
            left: 0;
            position: absolute;
            top: 18%;
            width: 1px;
        }

        .ajax__tab_xp .ajax__tab_header > *.ajax__tab_active::before,
        .ajax__tab_xp .ajax__tab_header > *:last-child::before {
            display: none;
        }

.dark .ajax__tab_xp .ajax__tab_active,
.darker .ajax__tab_xp .ajax__tab_active,
.dark .ajax__tab_xp .ajax__tab_active > *,
.darker .ajax__tab_xp .ajax__tab_active > *,
.dark .ajax__tab_xp .ajax__tab_active .ajax__tab_tab,
.darker .ajax__tab_xp .ajax__tab_active .ajax__tab_tab {
    background: var(--primary-color) !important;
    overflow: hidden !important;
}

.ajax__tab_xp .ajax__tab_active .ajax__tab_tab .TabTitle {
    background: var(--primary-color);
    color: #fff !important;
}

.ajax__tab_xp .ajax__tab_active .ajax__tab_outer {
    background: none !important;
    border-bottom-color: transparent;
    border-top: 0;
}

.ajax__tab_xp .ajax__tab_outer {
    background: none !important;
    border: none;
    border-bottom-color: transparent;
    height: auto !important;
    margin-left: 2px;
    margin-right: 0;
}

.ajax__tab_xp .ajax__tab_active .ajax__tab_inner {
    background: none !important;
    width: 100%;
}

.ajax__tab_xp .ajax__tab_active {
    background: var(--primary-color) !important;
    border-radius: 0;
}

.ajax__tab_xp .ajax__tab_hover .ajax__tab_inner {
    background: none !important;
}

.ajax__tab_xp .ajax__tab_inner {
    background: none !important;
    padding: 0 !important;
}

.ajax__tab_xp .ajax__tab_hover .ajax__tab_outer {
    border-bottom-color: transparent;
    /* padding: 0; */
}

.ajax__tab_xp .ajax__tab_outer {
    padding: 0 !important;
    width: 100%;
}

.ajax__tab_xp .ajax__tab_body {
    border: 0 !important;
    padding: 0 !important;
    /* border:0px solid #999999 !important;*/
    padding-top: 20px;
}

@media screen and (min-width: 1025px) {
    .showmenu.open {
        right: 20px;
    }

    .userinfo {
        top: 0 !important;
        right: 0;
        display: inline-block !important;
        background-color: var(--dark-gray, var(--dark-black, #fff));
        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
        border: 1px solid rgba(var(--primary-opacaty-color), 0.25) !important;
        backdrop-filter: blur(3px);
        border-radius: var(--border-radius-sm);
        padding: 3px;
    }

    .topnav {
        display: block !important;
        min-width: 300px;
        padding-top: 8.5px !important;
    }

        .topnav ul {
            display: flex;
            justify-content: flex-end;
            gap: 16px;
            margin-left: 16px;
        }
}

.topnav ul a {
    display: block;
    min-width: 50px;
    text-align: center;
    height: 50px;
    background-color: rgba(255, 255, 255, 0.035);
    border-radius: var(--border-radius-lg);
    border: 1px solid rgba(255, 255, 255, 0.065) !important;
}

    .topnav ul a span {
        display: none;
    }

.topnav ul > li > a {
    color: var(--main-text, #fff) !important;
}

    .topnav ul > li > a:before {
        position: relative;
        display: inline-block;
        font-family: "icomoon";
        font-style: normal;
        font-weight: normal;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        color: inherit !important;
        display: block;
        font-size: var(--font-20, 20px);
        padding-top: 8px;
    }

    .topnav ul > li > a.floating-button .material-icons-outlined {
        color: inherit !important;
    }

        .topnav ul > li > a.floating-button .material-icons-outlined:after {
            font-size: var(--font-26, 26px);
            color: inherit !important;
        }

    .topnav ul > li > a:hover {
        background-color: rgba(var(--primary-opacaty-color), 0.05);
        text-decoration: none !important;
    }

.topnav ul > li.home > a::before,
.mobile_button.lftbtn.glyphicon.glyphicon-menu-home::before {
    content: "";
}

.topnav ul > li.notification > a:before {
    content: "";
}

.topnav ul > li.logout > a:before {
    content: "";
}
.topnav ul > li.language > a:before {
    content: "";
}
@media screen and (max-width: 1024px) {
    .userinfo {
        display: none;
    }
}

@media screen and (min-width: 634px) {
    .user-info-table td.editble-cell {
        position: relative;
        min-width: 424px;
        padding-left: 68px !important;
    }
}

.showmenu.open {
    right: 20px;
}

input[type="checkbox"] {
    width: 15px;
    margin: 4px !important;
}

.StyleReportViewer {
    height: 400px;
    width: 100%;
    overflow: auto;
}

    .StyleReportViewer > table {
        min-width: 100%;
    }

.divreportscroll {
    overflow: auto;
    position: relative;
}

.StyleReportViewer table[id$="_fixedTable"] div[id$="_oReportDiv"] {
    padding: 0 20px;
    overflow: auto;
}

.MSRS-RVC.rsRtl {
    height: 500px;
    max-height: 500px;
    width: 100%;
    overflow: auto;
}

    .MSRS-RVC.rsRtl div[id$="_oReportDiv"] {
        padding: 0 20px;
    }

.MSRS-RVC TABLE,
.MSRS-RVC BODY,
.MSRS-RVC FRAMESET {
    font-size: var(--font-15, 15px);
    width: 100%;
}

.MSRS-RVC > table > tbody > tr > td > div > div > div > table {
    width: auto;
}

table.ReportViewerContainer {
    table-layout: fixed;
    width: 100%;
}

.form-reportviewer div[id*="_AsyncWait"],
.form-reportviewer .WaitControlBackground {
    display: none !important
}

a[disabled="disabled"] {
    cursor: default !important;
    color: #bbb !important;
    text-decoration: none !important;
}

.tbltaptitle {
    border-bottom: 1px solid var(--border-light, #eee);
    color: var(--primary-color);
    padding: 12px 0px;
    width: 100%;
}

    .tbltaptitle * {
        color: var(--primary-color);
    }

.form-operation-links {
    display: none;
}

@supports not selector(:has(div)) {
    .form-operation-links {
        display: block;
    }
}

.form-operation-links:has(span:not(:empty)),
.form-operation-links:has(tr) {
    display: block;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
}

.form-operation-links:has(.form-operation-links-header) {
    border-bottom: 1px solid var(--border-light, #eee) !important;
    margin-bottom: 16px;
    padding-bottom: 22px;
}

.form-controls-header:has(button) {
    padding: 0 !important;
    margin-left: -16px !important;
    margin-right: -16px !important;
}

.form-controls-header button {
    display: flex;
    align-items: center;
    width: 100%;
    cursor: pointer;
    outline: none !important;
    border: none !important;
    justify-content: space-between;
}

    .form-controls-header button span {
        display: flex;
        font-size: var(--font-20, 20px);
        justify-content: flex-start;
        align-items: center;
        gap: 4px;
    }

.form-controls-header:has(button) button > i {
    transition: transform 0.3s ease;
}

.form-controls-header:has(button) button[aria-expanded="true"] > i {
    transform: rotate(-180deg);
}

.form-controls-header,
.form-operation-links-header {
    block-size: var(--controls-height) !important;
    display: flex !important;
    align-content: center !important;
    align-items: center !important;
    margin-right: 4px !important;
    margin-bottom: 8px !important;
}

    .form-controls-header + .form-controls-body {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    .form-controls-header:not(:has(*)),
    .form-operation-links-header:not(:has(*)) {
        display: none !important;
    }

    .form-controls-header i:after,
    .form-controls-header::before,
    .form-operation-links-header::before {
        font-family: "ITG Material Icons Outlined" !important;
        font-size: var(--font-22, 22px);
        margin-left: 4px;
        color: var(--light-primary-color) !important;
    }

    .form-controls-header:has(i):before {
        display: none;
    }

    .form-operation-links-header::before {
        content: "\e8b8";
    }

    .form-controls-header::before {
        content: "\ef4f";
    }

.details-icon-header::before {
    font-family: "ITG Material Icons Outlined" !important;
    transform: rotateY(180deg);
    content: "\e05f";
}

.form-controls-header button span,
.form-controls-header > span,
.form-operation-links-header > span {
    font-size: var(--font-18, 18px) !important;
    font-weight: 400 !important;
    color: var(--light-primary-color) !important;
}

.container-fluid .form-controls-header button span,
.container-fluid .form-controls-header > span,
.container-fluid .form-operation-links-header > span {
    font-size: var(--font-14, 14px) !important;
    font-weight: 900 !important;
    color: var(--light-primary-color) !important;
}

.border-bottom-header {
    border-bottom: 1px solid var(--border);
    margin-bottom: 24px !important;
}

.form-operation-links-body tr td:has(.itg-icons.bullet) {
    width: 24px !important;
    padding-right: 8px;
    padding-bottom: 2px;
}

.form-operation-links-body tr:has(> td > .itg-icons.bullet) td a.StandardFont,
.form-operation-links-body tr:has(> td > .itg-icons.bullet) td .StandardFont {
    font-size: 15px !important;
    font-weight: 400 !important;
    padding: 4px 0;
}

.form-operation-links-body tr:has(> td > .itg-icons.bullet) td a.StandardFont {
    font-weight: 400 !important;
    white-space: nowrap;
    padding-right: 2px;
    text-align: right;
}

.form-operation-links-body table:has(> tbody > tr > td > .itg-icons.bullet) {
    width: 100% !important;
    min-width: 200px !important;
    max-width: fit-content;
}

.form-operation-links-body table:has(> tbody > tr > td > span.Instructions) {
    max-width: fit-content !important;
}

.form-operation-links-body
table:has(> tbody > tr > td > .itg-icons.bullet)
tr:has(> td > .itg-icons.bullet):first-of-type {
    border-top-right-radius: var(--border-radius-md, 13px);
    border-top-left-radius: var(--border-radius-md, 13px);
}

.form-operation-links-body
table:has(> tbody > tr > td > .itg-icons.bullet)
tr:has(i):nth-last-child(1 of tr:has(i)) {
    border-bottom-right-radius: var(--border-radius-md, 13px);
    border-bottom-left-radius: var(--border-radius-md, 13px);
}

.form-operation-links-body tr:has(> td > .itg-icons.bullet) {
    display: flex !important;
    background-color: #fdebc3;
    min-height: 42px;
    padding: 0px 6px 2px 24px;
    align-items: center !important;
    width: 100% !important;
}

    .form-operation-links-body tr:has(> td > .itg-icons.bullet) + tr {
        margin-top: -4px;
        padding-top: 0px;
    }

    .form-operation-links-body tr:has(> td > .itg-icons.bullet):has(.Instructions) {
        background-color: #f2dede;
        color: #680000;
    }

        .form-operation-links-body
        tr:has(> td > .itg-icons.bullet):has(.Instructions)
        img {
            filter: hue-rotate(190deg);
        }

        .form-operation-links-body
        tr:has(> td > .itg-icons.bullet):has(.Instructions)
        span.Instructions {
            color: #680000;
        }

.form-operation-links-body
table:has(> tbody > tr > td > .itg-icons.bullet)
tr:has(> td > .itg-icons.bullet):only-of-type {
    margin-bottom: 8px;
}

@supports not selector( .form-operation-links-body > table:has(i) > tbody > tr:has(i):nth-last-child(1 of tr:has(i)) ) {
    .form-operation-links-body > table:has(i) > tbody > tr:has(i) {
        border-radius: 13px !important;
        margin-bottom: 8px !important;
    }
}

.form-controls {
    border-radius: var(--border-radius-sm, 7px);
    width: 100%;
    overflow: visible;
}

.form-controls-body {
    padding: 10px 0;
}

    .form-controls-body div.row {
        margin-left: 0;
        margin-right: 0;
    }

.contentContainer .pagesection .form-mandatory-field table.StandardFont {
    width: auto !important;
    font-size: var(--font-16, 16px);
}

.form-mandatory-field {
    width: 100%;
}

    .form-mandatory-field table td {
        background: #ffe5e5;
        padding: 6px 12px;
        border-radius: var(--border-radius-sm, 7px);
        vertical-align: middle;
        min-width: 150px;
    }

        .form-mandatory-field table td font.ValidationClass {
            font-size: var(--font-16, 16px) !important;
            font-weight: bold;
        }

div .form-mandatory-field:empty {
    display: none !important;
}

.form-operation-message {
    padding: 0 0;
    text-align: center;
    margin: 0 0;
}

    .form-operation-message * {
        text-align: center;
    }

.pagesectioncontent:has(.container-fluid) > .form-operation-message:has(*:not(:empty)) {
    margin-top: -8px !important;
    padding-bottom: 12px !important;
}

.form-actions {
    padding: 10px 0;
    text-align: center;
    margin: 0;
    width: 100%;
}

@media (max-width: 600px) {
    .form-actions ul {
        display: flex !important;
        flex-wrap: wrap !important;
    }
}

.inner-form-actions a,
.inner-form-actions input {
    min-width: 120px;
    max-width: 300px;
}

a i[data-icon="published_with_changes"] {
    transition: rotate 0.3s ease;
}

a:hover i[data-icon="published_with_changes"] {
    rotate: 30deg;
}

.inner-form-actions {
    display: flex;
    text-align: center !important;
    align-content: center;
    align-items: center;
    justify-content: center;
}

.form-actions ul {
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    list-style: none;
    margin: 0;
    padding: 0;
}

    .form-actions ul li {
        display: inline-block;
        vertical-align: bottom;
    }

        .form-actions ul li button.btnstyle {
            padding: 0 8px;
        }

            .form-actions ul li button.btnstyle i {
                font-size: 16px;
            }

        .form-actions ul li input.btnstyle {
            font-size: var(--font-14, 14px);
            min-width: 120px;
        }

.form-ModalPopup .form-actions ul li input.btnstyle {
    font-size: var(--font-14, 14px);
    min-width: 100px;
}

.form-table-print {
    padding: 8px 0;
}

    .form-table-print td span,
    .form-table-print td a {
        font-weight: 400;
        font-size: var(--font-16, 16px);
    }

    .form-table-print input[type="image"],
    .form-table-print img {
        filter: hue-rotate(25deg) !important;
    }

.form-table-body {
    padding: 5px 0;
}

.form-reportviewer {
    padding: 10px 0;
}

    .form-reportviewer > div > div {
        width: 100% !important;
    }

    .form-reportviewer img.resize100Width.resize100Height {
        width: unset !important;
        height: 100% !important;
    }

    .form-reportviewer td:has(div.resize100Width.resize100Height) {
        width: 105px !important;
        min-width: 105px !important;
        text-align: center !important;
    }

        .form-reportviewer td:has(div.resize100Width.resize100Height) * {
            overflow: visible !important;
        }

.divscrollbar-horizontal {
    overflow-y: hidden;
    overflow-x: auto;
}

.divscrollbar-horizontal-vertical {
    overflow: auto;
}

.ModalPopupExtender {
    overflow: auto;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    top: 0 !important;
    padding: 20px 10%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.form-ModalPopup {
    width: auto;
    height: auto;
    background: var(--dark-gray, var(--dark-black, #fff));
    border-radius: var(--border-radius-sm);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
    border: 1px solid rgba(var(--primary-opacaty-color), 0.25) !important;
}

.form-ModalPopup-header {
    min-height: 48px;
    overflow-y: hidden;
    overflow-x: auto;
    position: relative;
    border-radius: var(--border-radius-lg) var(--border-radius-lg) 0 0;
}

    .form-ModalPopup-header span {
        color: var(--main-text, #444);
        white-space: pre-line !important;
        position: relative;
        top: 13px;
        right: 20px;
        font-size: var(--font-20, 20px) !important;
        font-weight: 400;
    }

    .form-ModalPopup-header button {
        top: 12px;
        left: 12px;
        font-size: var(--font-20, 20px);
        color: var(--main-text, #444);
        background: var(--dark-gray, var(--dark-black, #fff));
    }

.form-ModalPopup-Background {
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0.6;
    cursor: alias;
}

.btnCloseModalPopup {
    border: 0;
    top: 0;
    left: 0;
    position: absolute;
    background: var(--primary-color, #2986cc);
    color: #fff;
    width: 35px;
    height: 30px;
    font-size: var(--font-22, 22px);
}

.form-ModalPopup-body {
    padding: 0 42px 0 42px;
}

.form-ConfirmBox-header {
    position: relative;
}

.form-ConfirmBox-body {
    padding: 10px;
}

.feild_title {
    padding-top: 4px;
    padding-bottom: 6px;
    max-width: 200px;
}

.form-ModalPopup-body div:has(> .feild_data) {
    min-width: 50%;
    min-height: 100px;
}

.feild_data,
.feild_title {
    width: 100% !important;
    min-width: 100% !important;
}

    .feild_data > span.StandardFont:only-child {
        display: block;
        padding-left: 8px;
        padding-right: 20px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap !important;
        font-family: "Cairo" !important;
        font-size: var(--font-16, 16px) !important;
        padding-top: 10px;
        color: var(--main-text, #555);
    }

    .feild_data:has(> span.ValidationClass) {
        display: flex;
        flex-direction: column;
    }

.manditory {
    color: #dc3545;
    font-family: "Cairo";
    font-size: 16px;
    line-height: 0.8 !important;
}

.textarea_counter {
    position: relative;
    height: 100px;
}

    .textarea_counter table {
        position: absolute;
        width: 100% !important;
        text-align: left;
        bottom: 0;
        left: 0;
    }

        .textarea_counter table tr {
            display: flex;
            justify-content: flex-end;
        }

    .textarea_counter span.StandardFont {
        font-weight: normal;
        color: var(--main-text, #555);
    }

.contentContainer
.pagesection
.feild_data > .StandardFont:not(.textarea_counter .StandardFont) {
    white-space: pre-wrap;
    font-weight: normal;
    font-size: var(--font-16, 16px);
    display: inline-block;
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 12px;
    max-width: 100% !important;
}

@media (max-width: 1024px) {
    .contentContainer
    .pagesection
    .feild_data > .StandardFont:not(.textarea_counter .StandardFont) {
        white-space: pre-wrap !important;
    }
}

.contentContainer .pagesection .feild_data .StandardFont:empty {
    display: none !important;
}

div[id*="_oReportDiv"] {
    display: flex;
    justify-content: space-evenly;
}

@media (max-width: 767px) {
    .textarea_counter {
        height: auto !important;
    }

        .textarea_counter table {
            position: relative;
        }
}

.feild_data .StyleTimePicker,
div.row .multiselect-native-select,
div.row .input-group,
div.row .StandardFontPlain,
div.row .select_date_table,
div.row .control-dropdownlist,
div.row .select2-container {
    max-width: var(--controls-max-width, 328px);
    margin: 0 !important;
}

.feild_data .StyleTimePicker,
div.row input[type="password"],
div.row textarea,
div.row input[type="text"] {
    padding-left: 16px;
    padding-right: 16px;
    /*! min-width: var(--controls-width); */
    min-height: var(--controls-height);
}

table.table-Style input[type="text"] {
    padding-left: 16px;
    padding-right: 16px;
}

.feild_data .StyleTimePicker,
table.table-Style .multiselect-native-select,
table.table-Style input[type="text"],
table.table-Style .select2.select2-container {
    min-width: 220px;
}

div > table.table-Style:has(.multiselect-native-select) {
    overflow-y: visible;
}

div.row
.feild_data:has(div:nth-child(2) input[type="passowrd"])
input[type="passowrd"],
div.row
.feild_data:has(div:nth-child(2) input[type="text"])
input[type="text"] {
    min-width: unset;
}

textarea {
    border: 1px solid var(--controls-active-border-clr);
    border-radius: var(--border-radius-sm);
    padding-top: 8px;
    padding-bottom: 8px;
    border-bottom-left-radius: 0 !important;
}

    textarea[readonly="readonly"] {
        background-color: #eee;
        cursor: default;
    }

.no_padding {
    padding: 0;
}

.feild_row {
    margin: 0;
}

.feild_data {
    padding-top: 4px;
    padding-bottom: 6px;
}

.feild_title .StandardFont {
    white-space: pre-wrap !important;
    min-width: 100%;
    color: var(--primary-color) !important;
}

html:has(body.dark, body.darker) .feild_title .StandardFont {
    color: #fff !important;
}

select.control-dropdownlist:not(.select2-hidden-accessible) {
    display: block !important;
    width: 100% !important;
    height: 40px !important;
    padding: 6px 12px;
    background-color: var(--light-gray, var(--light-black, #f0f0f0)) !important;
    border: 1px solid var(--border-light, #ddd) !important;
    border-radius: 4px;
    color: transparent !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3CradialGradient id='a12' cx='.66' cy='.3125' fx='.66' fy='.3125' gradientTransform='scale(1.5)'%3E%3Cstop offset='0' stop-color='%23555'%3E%3C/stop%3E%3Cstop offset='.3' stop-color='%23555' stop-opacity='.9'%3E%3C/stop%3E%3Cstop offset='.6' stop-color='%23555' stop-opacity='.6'%3E%3C/stop%3E%3Cstop offset='.8' stop-color='%23555' stop-opacity='.3'%3E%3C/stop%3E%3Cstop offset='1' stop-color='%23555' stop-opacity='0'%3E%3C/stop%3E%3C/radialGradient%3E%3Ccircle transform-origin='center' fill='none' stroke='url(%23a12)' stroke-width='15' stroke-linecap='round' stroke-dasharray='200 1000' stroke-dashoffset='0' cx='100' cy='100' r='70'%3E%3CanimateTransform type='rotate' attributeName='transform' calcMode='spline' dur='2s' values='360;0' keyTimes='0;1' keySplines='0 0 1 1' repeatCount='indefinite'%3E%3C/animateTransform%3E%3C/circle%3E%3Ccircle transform-origin='center' fill='none' opacity='.2' stroke='%23555' stroke-width='15' stroke-linecap='round' cx='100' cy='100' r='70'%3E%3C/circle%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 25px 25px;
    cursor: wait !important;
    pointer-events: none;
    opacity: 0.7;
}

.table-control-dropdownlist {
    font-weight: normal;
    font-size: var(--font-13, 13px);
    color: var(--main-text, #555);
    margin-bottom: 5px;
    margin-left: 5px;
}

.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"] {
    position: relative;
    margin-left: auto;
}

input[type="checkbox"] {
    font-size: var(--font-16, 16px);
    cursor: pointer;
    accent-color: var(--primary-color);
}

    input[type="checkbox"] + Label {
        block-size: var(--controls-height);
        cursor: pointer;
        display: inline-block;
        font-size: var(--font-16, 16px);
    }

.checkbox,
.radio {
    margin-top: unset;
    margin-bottom: unset;
}

@-webkit-keyframes rotate {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(-360deg);
    }
}

@keyframes rotate {
    0% {
        transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
        -ms-transform: rotate(-360deg);
        -webkit-transform: rotate(-360deg);
    }
}

#refresh {
    width: 124px;
    animation: rotate 2s linear infinite;
    border-bottom: 62px solid var(--dark-gray, var(--dark-black, #fff));
    border-top: 62px solid #efefef;
    border-radius: 50%;
    position: absolute;
    top: 22px;
    left: 22px;
    z-index: 1;
}

.main {
    background-image: url("../../images/LoadingIogo/1-01.png");
    width: 168px;
    height: 168px;
    position: absolute;
    top: 50%;
    margin-top: -84px;
    left: 50%;
    margin-left: -84px;
}

@-webkit-keyframes rotate2 {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes rotate2 {
    0% {
        transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
    }
}

#refresh2 {
    width: 168px;
    height: 168px;
    background-image: url("../../images/LoadingIogo/2-01.png");
    background-repeat: no-repeat;
    -webkit-animation: rotate2 2s linear infinite;
    -ms-animation: rotate2 2s linear infinite;
    animation: rotate2 2s linear infinite;
}

#divLoadingFlash,
#ctl00_imgLoadinglogo {
    width: 168px;
    height: 168px;
    position: absolute;
    top: 50%;
    margin-top: -84px;
    left: 50%;
    margin-left: -84px;
}

.loadingGif {
    width: 160px;
    height: 160px;
    border-radius: 50%;
    position: absolute;
    background-color: rgba(var(--primary-opacaty-color), 0.51);
    padding: 0px;
    left: calc(50% - 89px);
    top: calc(50% - 89px);
    display: flex;
    align-items: center;
    justify-content: center;
    background-repeat: no-repeat;
    background-position: center;
    backdrop-filter: blur(1.5px);
}

    .loadingGif:before {
        position: relative;
        z-index: 2;
        content: "";
        width: 159.5px;
        height: 159.5px;
        margin: 0;
        background: transparent;
        border-top: 3px solid #fff;
        border-right: 2px solid transparent;
        border-radius: 60%;
        -webkit-animation: 1s spin linear infinite;
        animation: 1.5s spin linear infinite;
    }

@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.loadingGif:after {
    z-index: 0;
    content: "";
    width: 100%;
    position: absolute;
    background-image: url(../../Images/AjyalLogoWhite.png);
    background-position: center;
    background-repeat: no-repeat;
    display: block;
    height: 100%;
    background-size: 72px;
}

.noor_img {
    position: absolute;
    top: 61px;
    z-index: 2;
    left: 29px;
}

span.checkbox_feild label {
    display: inline;
}

select.multiple_select option {
    border-bottom: 1px solid var(--border-light, #eee);
    white-space: pre-wrap;
    color: var(--main-text, #555);
    font-size: var(--font-13, 13px);
    max-width: var(--controls-max-width, 428px);
}

@media (max-width: 800px) {
    .ModalPopupExtender {
        display: block;
    }
}

.box-faq {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    margin-bottom: 20px;
    border-radius: 2px;
    font-family: "Cairo";
}

.box-faq-title {
    background-color: #206e88;
    color: #fff;
    display: flex;
    align-items: center;
    padding: 8px;
    border-radius: 4px 7px 0 0;
    cursor: pointer;
    font-weight: bold;
    position: relative;
}

    .box-faq-title.collapsed {
        border-radius: 2px;
    }

.box-faq-body {
    border: 2px solid var(--primary-color, #2986cc);
    border-top: 0;
    border-radius: 0 0 2px 2px;
    background: var(--dark-gray, var(--dark-black, #fff));
    padding: 10px;
    color: var(--main-text, #555);
    font-family: "Cairo";
    font-size: var(--font-11, 14px);
    font-weight: bold;
}

    .box-faq-body a {
        color: var(--main-text, #555);
        font-family: "Cairo";
    }

        .box-faq-body a:hover {
            color: var(--primary-color, #2986cc);
        }

.box-faq-icon {
    text-align: center;
    background-color: rgba(0, 0, 0, 0.12);
    min-width: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .box-faq-icon i {
        font-size: var(--font-19, 19px);
        position: absolute;
    }

.box-faq-title span.faq-title {
    color: #fff;
    white-space: pre-line;
    padding: 6px;
    font-weight: bold;
    font-size: var(--font-11, 15px);
    font-family: "Cairo";
}

#tdPageContent {
    position: relative;
}

div[id$="tblSchoolAdminAlerts"] .col-sm-6.col-12 a {
    border: 0 !important;
    color: #fff;
}

div[id$="tblSchoolAdminAlerts"] a:hover {
    text-decoration: none;
}

.new_accordiand_header,
.operation-links {
    background-color: var(--primary-color, #115c74) !important;
    color: #fff;
    display: flex;
    position: relative;
    overflow: hidden;
    margin-bottom: 20px;
    border-radius: 2px;
    min-height: 42px;
    align-items: center;
    border-radius: var(--border-radius-sm);
    transition: 0.35s;
    box-shadow: 0.2em 0.2em 0 0 var(--light-primary-color), inset 0.4em 0.3em 0 0 var(--light-primary-color);
    border: 1px solid var(--dark-gray, var(--dark-black, #fff));
}

.home-page-section .operation-links {
    margin-right: 3px;
}

.operation-links:after {
    content: "";
    display: block;
    position: absolute;
    top: -1px;
    bottom: -1px;
    left: -1px;
    right: -1px;
    border-radius: var(--border-radius-sm, 13px);
    border: 1pt solid var(--light-gray, var(--light-black, #f5f5f5));
}

.new_accordiand_header:hover,
.new_accordiand_header:focus,
.operation-links:hover,
.operation-links:focus {
    box-shadow: 0 0 0 0 var(--light-primary-color), inset 6em 3.5em 0 0 var(--light-primary-color);
}

.logger-info,
.quick-access {
    margin-bottom: 77px;
}

@media (min-width: 700px) {
    .max-width-55-vw {
        max-width: 55vw;
        width: calc(100%);
        --bs-gutter-x: 12px;
    }
}

.links-card-holder:not(:has(a)) {
    display: none !important;
}

.links-card-holder-title {
    grid-column: 1 / -1;
}

.links-card-holder-title,
.logger-info-header {
    color: var(--primary-color, #2986cc) !important;
    display: flex;
    position: relative;
    overflow: hidden;
    border-radius: 2px 2px 0 0;
    font-family: "Cairo";
    font-size: var(--font-12, 12px);
    height: 58px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 32px;
}

.links-card-holder-title {
    margin-bottom: 0px;
}

.logger-info-body .col-md-4 {
    border-left: 1px solid var(--border);
}

@media (max-width: 768px) {
    .logger-info-body .col-md-4 {
        border-left: none;
        padding-bottom: 32px;
        margin-bottom: 8px;
    }

    .home-page-section {
        padding-right: 16px !important;
        background-size: 50% !important;
        background-position: 20px 70px !important;
    }
}

.logger-info-body .col-md-4:last-child {
    border-left: none;
}

.links-card-holder-title i,
.operation-links-icon,
.logger-info-header-icon {
    text-align: center;
    padding-right: 8px;
    padding-left: 8px;
}

    .operation-links-icon i {
        font-size: var(--font-19, 19px);
    }

    .links-card-holder-title i,
    .logger-info-header-icon i {
        font-size: var(--font-24, 24px);
        color: var(--primary-color, #171717);
    }

.links-card-holder-title,
.logger-info-header-icon,
.logger-info-header-title {
    display: flex;
    align-items: center;
}

    .links-card-holder-title span,
    .operation-links-title span,
    .logger-info-header-title span {
        color: var(--primary-color, #333) !important;
        border: none;
        white-space: pre-line !important;
        font-family: "Cairo";
        font-size: var(--font-18, 18px);
        font-weight: 800;
        color: var(--primary-color, #333) !important;
        font-family: "Cairo";
    }

        .operation-links-title span.ValidationClass {
            display: block;
            color: #dc3545 !important;
        }

.logger-info-body-title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
}

    .logger-info-body-title + div {
        display: flex;
        flex-direction: row;
        gap: 24px;
        align-items: right;
    }

    .logger-info-body-title span {
        font-weight: 300 !important;
        font-size: var(--font-18, 18px);
        line-height: 25.71px !important;
        letter-spacing: 0%;
        text-align: right;
        vertical-align: middle;
        color: #8d8d8d !important;
    }

.dark .logger-info-body-title span,
.darker .logger-info-body-title span {
    color: #ccc !important;
}

.logger-info-body-Date,
.logger-info-body-time {
    color: var(--main-text, #767676) !important;
    font-weight: 400 !important;
    font-size: var(font-17, 17px) !important;
    line-height: 25.71px !important;
    letter-spacing: 0%;
    text-align: right;
    vertical-align: middle;
    font-size: var(--font-16, 16px);
}

    .logger-info-body-Date:before {
        padding-right: 3px;
        color: var(--primary-color);
        font-size: var(--font-18, 18px);
        content: "work";
        font-family: "ITG Material Icons";
        float: right;
        padding-left: 10px;
    }

    .logger-info-body-time:before {
        color: var(--primary-color);
        font-size: var(--font-18, 18px);
        content: "access_time_filled";
        font-family: "ITG Material Icons";
        float: right;
        padding-left: 10px;
    }

.logger-info-bodyEmpty {
    color: var(--main-text, #767676) !important;
    font-weight: 400 !important;
    font-size: var(--font-16, 16px) !important;
}

.advertisements {
    margin: auto;
    float: none;
    color: var(--primary-color, #2986cc);
    font-size: var(--font-14, 14px);
    font-weight: bold;
    text-shadow: 0 0.1px var(--primary-color, #2986cc);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    border: 2px solid var(--primary-color, #2986cc);
    margin-bottom: 20px;
    border-radius: 2px;
    background: var(--dark-gray, var(--dark-black, #fff));
    padding: 24px;
    padding-bottom: 0;
}

img[id$="imgSystemNoor"] {
    width: 160px;
    margin-bottom: 25px;
}

img[id$="imgAdvertisements"] {
    height: 150px;
    padding: 15px 0;
}

.advertisements div {
    margin: auto;
    clear: both;
    text-align: center;
    float: none;
}

@media (max-width: 300px) {
    img[id$="imgAdvertisements"] {
        width: 150px;
    }
}

.select_date_table input.StandardFontPlain {
    font-size: var(--font-16, 16px);
    letter-spacing: 1.5px;
}

.select_date_table:not(:has(i)) input.StandardFontPlain {
    background-color: #eee;
    cursor: default;
}

.select_date_table:not(:has(i)) input[type="text"]:focus {
    outline-color: transparent !important;
}

.select_date_table > div {
    position: relative;
}

    .select_date_table > div > input {
        width: 100% !important;
        min-width: 100% !important;
    }

    .select_date_table > div > div {
        position: absolute;
        left: 16px;
    }

        .select_date_table > div > div i {
            font-size: var(--font-20, 20px);
            margin-top: -1px;
        }

    .select_date_table > div input[disabled="disabled"] + div {
        display: none !important;
    }

.calendar {
    overflow: visible;
}

    .calendar .combo {
        position: absolute;
        background-color: var(--dark-gray, var(--dark-black, #fff));
        border: 1px solid var(--border, #ddd) !important;
        overflow: hidden;
        width: 64px;
    }

        .calendar .combo .label:empty {
            display: none;
        }

        .calendar .combo .label {
            color: #444;
            padding: 4px 1px;
            width: 100%;
            display: inline-block;
            font-size: var(--font-10, 10px) !important;
            text-align: center !important;
        }

            .calendar .combo .label:hover {
                background-color: #eee;
            }

    .calendar table {
        border-collapse: collapse !important;
    }

    .calendar .nav {
        display: table-cell !important;
        padding: 0 !important;
        cursor: pointer;
        font-size: var(--font-14, 14px) !important;
    }

        .calendar .nav[colspan="1"] {
            font-size: var(--font-18, 18px) !important;
        }

.calendar {
    border-radius: 13px !important;
    border: none !important;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2) !important;
    font-family: "Cairo" !important;
    font-weight: normal !important;
    min-width: 300px;
    overflow: visible;
}

    .calendar table {
        border-radius: 10px;
        width: 330.3px !important;
        height: 272px !important;
    }

    .calendar thead .title {
        color: #fff !important;
        font-size: var(--font-17, 17px) !important;
        font-family: "Cairo" !important;
        font-weight: bold !important;
    }

    .calendar > table > thead > tr:first-child > td.button {
        color: #fff !important;
        font-size: var(--font-18, 18px) !important;
        font-weight: normal !important;
    }

    .calendar table td {
        background: var(--dark-gray, var(--dark-black, #fff)) !important;
        color: #000 !important;
        font-weight: normal !important;
    }

    .calendar table {
        font-family: "Cairo" !important;
        font-weight: normal !important;
        border: none !important;
        background-color: var(--light-gray, var(--light-black, #f5f5f5));
    }

.dark .calendar,
.dark .calendar *,
.dark .calendar table * {
    background-color: var(--dark-gray) !important;
    border-color: var(--border) !important;
    color: #fff !important;
}

.darker .calendar,
.darker .calendar * {
    background-color: var(--dark-black) !important;
    border-color: var(--border) !important;
    color: #fff !important;
}

    .darker .calendar table {
        background-color: var(--light-black) !important;
    }

.calendar table .headrow td {
    border-top: none !important;
}

.calendar table td.emptycell:last-of-type,
.calendar table thead td:last-of-type,
.calendar table tfoot td:last-of-type,
.calendar table tbody td:last-of-type {
    border-left: none !important;
}

.calendar table td.emptycell:first-of-type,
.calendar table thead td:first-of-type,
.calendar table tfoot td:first-of-type,
.calendar table tbody td:first-of-type {
    border-right: none !important;
}

.calendar table tbody td.day {
    cursor: pointer;
}

    .calendar table tbody td.day.disabled {
        cursor: default;
        background-color: var(--light-gray, var(--light-black, #f5f5f5)) !important;
        color: #ccc !important;
    }

.calendar tbody tr:nth-last-child(2) td.emptycell,
.calendar tbody tr:nth-last-child(2) td {
    border-bottom: none !important;
}

.calendar thead .name {
    color: #92989b !important;
    font-size: var(--font-11, 11px) !important;
    padding: 2px 4px !important;
}

    .calendar thead .name:hover {
        padding: 2px 4px !important;
    }

.calendar > table > thead > tr:first-child > td {
    border: none !important;
    padding: 0px !important;
    vertical-align: middle;
    background: var(--calendar-primary-color) !important;
}

    .calendar > table > thead > tr:first-child > td.title {
        cursor: default !important;
    }

    .calendar > table > thead > tr:first-child > td:first-child {
        text-indent: -999999px;
        vertical-align: top;
        font-size: var(--font-24, 24px) !important;
        background: #f5a224;
        border-radius: 0 10px 0 0;
        pointer-events: none !important;
        padding: 0 !important;
    }

    .calendar > table > thead > tr:first-child > td:last-child {
        display: table-cell;
        font-size: var(--font-28, 28px) !important;
        line-height: 0;
        vertical-align: middle !important;
        font-weight: normal !important;
        border-radius: 10px 0 0 0;
        padding: 0 !important;
        padding-bottom: 4px !important;
        cursor: pointer;
    }

.calendar tbody .daysrow td.selected {
    background-color: var(--calendar-active-color) !important;
    font-family: "Cairo" !important;
    font-weight: normal !important;
    color: #fff !important;
    border: none !important;
}

.calendar thead .weekend {
    color: #92989b !important;
}

.calendar tbody .emptyrow td,
.calendar tbody .daysrow .emptycell {
    background: #f9f9f9 !important;
    height: 30px;
    min-height: 0 !important;
}

.calendar tbody .daysrow td {
    height: 30px !important;
}

.calendar table td {
    border: 1px solid var(--border-light, #eee) !important;
    text-align: center !important;
}

.calendar table td {
    transition: 0.15s;
    font-size: var(--font-12, 12px) !important;
    font-family: "Cairo" !important;
    font-weight: normal !important;
}

.calendar tbody .day:not(.selected, .emptycell, .disabled):hover {
    background: var(--primary-color) !important;
    color: #fff !important;
}

.dark .calendar table td.emptycell {
    background-color: var(--light-gray) !important;
    border-color: var(--border) !important;
}

.darker .calendar table td.emptycell {
    background-color: #71829c !important;
    border-color: var(--border) !important;
}

.calendar tfoot .ttip {
    padding: 5px !important;
    font-family: "Cairo" !important;
    font-weight: normal !important;
    background: var(--calendar-primary-color) !important;
    color: #fff !important;
    border-radius: 0 0 10px 10px;
    border: none !important;
}

.quick-access .logger-info-body {
    padding-bottom: 0;
}

.logger-info-header-title .material-icons {
    color: var(--primary-color, #2986cc);
    background: var(--dark-gray, var(--dark-black, #fff));
    border-radius: 50%;
    width: 25px;
    height: 25px;
    text-align: center;
    line-height: 25px;
    font-size: 18px;
    vertical-align: middle;
    padding: 0;
}

.logger-info-header-title {
    width: 100%;
}

.logger-info-search,
.logger-info-folders {
    padding: 20px 15px;
}

    .logger-info-search .btn,
    .logger-info-folders .btn {
        padding: 9px 12px;
        margin-right: -1px;
        margin-left: inherit;
        border-right: none;
        border-color: #adadab;
    }

    .logger-info-search .btn,
    .logger-info-search input,
    .logger-info-folders .btn,
    .logger-info-folders input {
        display: table-cell;
        box-shadow: none;
    }

.logger-info-body-ul {
    padding: 0;
    margin: 0;
    list-style: none;
    clear: both;
}

    .logger-info-body-ul li {
        position: relative;
    }

        .logger-info-body-ul li:last-child {
            border-bottom: none;
        }

        .logger-info-body-ul li .tools {
            position: absolute;
            left: 10px;
            top: 9px;
        }

            .logger-info-header-title button:before,
            .logger-info-body-ul li .tools a.material-icons:before,
            .logger-info-body-ul li .tools a.material-icons:after {
                font-family: "ITG Material Icons";
            }

            .logger-info-body-ul li .tools a {
                font-size: var(--font-16, 16px);
                color: var(--primary-color, #2986cc);
                margin: 0 4px;
            }

                .logger-info-body-ul li .tools a:focus {
                    text-decoration: none;
                }

                .logger-info-body-ul li .tools a:hover {
                    text-decoration: none;
                    color: #19bcac;
                }

.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:first-child > .btn-group:not(:first-child) > .btn,
.input-group-btn:first-child > .btn:not(:first-child),
.input-group-btn:last-child > .btn,
.input-group-btn:last-child > .btn-group > .btn,
.input-group-btn:last-child > .dropdown-toggle {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

    .input-group .form-control:first-child,
    .input-group-addon:first-child,
    .input-group-btn:first-child > .btn,
    .input-group-btn:first-child > .btn-group > .btn,
    .input-group-btn:first-child > .dropdown-toggle,
    .input-group-btn:last-child > .btn-group:not(:last-child) > .btn,
    .input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

.logger-info-body-ul li:hover {
    background: #eee;
}

.logger-info-body-link:before {
    content: "link";
    font-family: "ITG Material Icons";
    padding-left: 6px;
    color: var(--primary-color, #2986cc);
    float: right;
    font-size: var(--font-15, 15px);
    margin-top: -3px;
}

.logger-info-body-folder {
    font-weight: bold;
    color: var(--primary-color, #2986cc);
}

    .logger-info-body-folder:before {
        content: "folder";
        font-family: "ITG Material Icons";
        padding-left: 6px;
        color: var(--primary-color, #2986cc);
        float: right;
        font-size: var(--font-15, 15px);
        margin-top: -3px;
        font-weight: normal;
    }

.sectionHeaderTitle {
    float: right;
    font-weight: bold;
}

.pagesectionheader {
    padding: 0 18px;
    border-radius: var(--border-radius-sm, 13px);
    background-color: var(--dark-gray, var(--dark-black, #fff));
    margin-top: 0px;
    margin-bottom: 16px;
    font-size: var(--font-13, 13px);
    font-family: "Cairo";
    min-height: 60px;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: space-between;
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
    border: 1px solid rgba(var(--primary-opacaty-color), 0.25) !important;
}

.sectionHeaderTools {
    float: left;
    font-family: "Cairo";
}

.dropdown-header {
    background: #009d8e;
    color: #fff;
    width: 100%;
    padding: 8px 10px;
    text-align: right;
    position: relative;
    font-family: "Cairo";
}

.dropdown ul {
    padding: 0;
    margin: 0;
    list-style: none;
    font-family: "Cairo";
}

.pagesectionheader .dropdown-menu {
    min-width: 400px;
    padding: 0;
    text-align: right;
    font-family: "Cairo";
}

.dropdown li,
ul.logger-info-body-ul li {
    border-bottom: 1px solid var(--border-light, #eee);
    font-family: "Cairo";
}

    .dropdown li div,
    ul.logger-info-body-ul li div {
        position: relative;
        text-align: right;
        font-family: "Cairo";
        font-size: var(--font-12, 12px);
    }

.dropdown-link:before {
    content: "link";
    font-family: "ITG Material Icons";
    padding-left: 6px;
    color: var(--primary-color, #2986cc);
    font-size: var(--font-15, 15px);
    margin-top: -3px;
}

.header-tools-item .material-icons {
    font-size: var(--font-26, 26px);
    color: var(--primary-color, #2986cc);
    transition: color 0.3s ease-in-out;
    cursor: pointer;
}

.header-tools-item .dropdown-toggle::after {
    display: none;
}

.header-tools-item .fa:hover {
    color: var(--light-primary-color, #2986cc);
}

.dropdown-header .fa-close {
    position: absolute;
    left: 10px;
    color: #fff;
}

    .dropdown-header .fa-close:hover {
        opacity: 0.7;
        color: #fff;
    }

.dropdown-body {
    padding: 10px;
    font-family: "Cairo";
}

    .dropdown-body label {
        color: var(--primary-color, #2986cc);
        font-family: "Cairo";
    }

    .dropdown-body .form-control {
        margin-bottom: 10px;
        border-radius: 0;
        font-size: var(--font-13, 13px);
        height: var(--controls-height, 48px);
        padding: 0 10px;
        font-family: "Cairo";
    }

    .dropdown-body .add-folder-box {
        height: 150px;
        border: 1px solid var(--controls-active-border-clr, #e1e6ef);
        border-radius: var(--border-radius-sm, 13px);
        margin-bottom: 15px;
        overflow: auto;
        font-family: "Cairo";
    }

.add-folder-box .folder {
    padding: 5px 12px;
    font-family: "Cairo";
}

    .add-folder-box .folder:before {
        content: "folder";
        font-family: "ITG Material Icons";
        padding-left: 6px;
        color: var(--primary-color, #2986cc);
        float: right;
        font-size: var(--font-15, 15px);
    }

.pagesectionheader .dropdown-menu {
    z-index: 1;
    font-family: "Cairo";
}

.dropdown-menu .btn.btn-flat {
    color: #fff;
    border-radius: 0;
    padding: 2px 10px;
    font-size: var(--font-13, 13px);
    min-width: 80px;
}

.dropdown-menu .btn.btn-flat {
    border: 1px solid var(--primary-color, #2986cc);
    color: var(--primary-color, #2986cc);
    background: var(--dark-gray, var(--dark-black, #fff));
    margin: 0 3px;
}

.dropdown-menu .logger-info-body-ul li {
    font-weight: normal;
    font-family: "Cairo";
}

.dropdown-menu .mCSB_container {
    margin-right: 0;
    margin-left: 0 !important;
}

.dropdown-menu .logger-info-body-ul .logger-info-body-link,
.quick-access .logger-info-body-ul .logger-info-body-link,
.quick-access .logger-info-body-ul .logger-info-body-folder {
    position: relative;
    padding: 8px 15px;
    padding-left: 56px;
}

    .dropdown-menu .logger-info-body-ul .logger-info-body-link .form-control,
    .quick-access .logger-info-body-ul .logger-info-body-link .form-control,
    .quick-access .logger-info-body-ul .logger-info-body-folder .form-control {
        height: 25px;
        width: calc(100% - 40px);
        margin: -4px 0;
        font-size: var(--font-13, 13px);
        font-family: "Cairo";
    }

.dropdown-menu .btn.btn-flat.active {
    background: var(--primary-color, #2986cc);
    box-shadow: none;
    color: #fff;
}

.hide-item {
    display: none;
}

.add-bookmark .status {
    text-align: right;
}

.add-bookmark .dropdown-menu .btn.btn-flat.plus-btn {
    min-width: 25px;
    width: 25px;
    border: 2px solid var(--primary-color, #2986cc);
    height: 25px;
    margin-right: -6px;
    padding: 0;
    font-family: "Cairo";
}

.add-bookmark .dropdown-menu .btn.btn-flat .fa {
    font-size: var(--font-12, 12px);
}

.add-bookmark .status {
    font-weight: normal;
    margin-bottom: 11px;
    font-family: "Cairo";
}

.add-bookmark .btn.btn-flat.active {
    margin: 0;
}

.add-bookmark .fa-bookmark-o {
    position: relative;
}

.add-folder:after,
.add-bookmark:after,
.add-schedulemessagesrep:after {
    content: "add";
    font-family: "ITG Material Icons";
    display: inline-block;
    background: var(--dark-gray, var(--dark-black, #fff));
    position: absolute;
    top: -3px;
    right: -4px;
    font-size: var(--font-9, 9px);
    padding: 1px 2px;
    font-weight: bold;
    border-radius: 50%;
}

.add-folder .fa-folder-o:after {
    top: -1px;
    right: -5px;
}

.view-bookmark .dropdown-menu,
.view-schedulemessagesrep .dropdown-menu {
    min-width: 600px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    border: 1px solid var(--border, #ccc);
    border-radius: 0;
    border-bottom: 2px solid var(--primary-color, #2986cc);
}

.add-bookmark .dropdown-menu,
.add-schedulemessagesrep .dropdown-menu {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    border: 1px solid var(--border, #ccc);
    border-radius: 0;
    border-bottom: 2px solid var(--primary-color, #2986cc);
    font-size: var(--font-12, 12px);
}

.view-bookmark-container {
    max-height: 190px;
    overflow: auto;
}

.open .dropdown-toggle i {
    color: #888;
}

@media (max-width: 768px) {
    .view-bookmark .dropdown-menu {
        min-width: 400px;
    }
}

@media (max-width: 480px) {
    .add-folder-box {
        width: 100%;
    }

    .add-folder .col-md-12 {
        float: none;
    }

    .dropdown-menu .btn.btn-flat {
        min-width: 20px;
    }

    .pagesectionheader .dropdown-menu,
    .view-bookmark .dropdown-menu {
        min-width: 230px;
        font-family: "Cairo";
    }

    .sectionHeaderTitle {
        display: table-cell;
        width: 90%;
    }

    .sectionHeaderTools {
        display: table-cell;
    }

    .sectionHeaderTools,
    .sectionHeaderTitle {
        float: none;
        font-family: "Cairo";
    }
}

.item-selected {
    font-size: var(--font-13, 13px);
    margin: 4px 0;
    font-family: "Cairo";
}

.span-item-selected:after {
    content: ":";
    padding: 0 4px;
}

ul[id*="ulViewAllFolders"] li div.logger-info-body-folder {
    color: var(--main-text, #555);
    font-size: var(--font-13, 13px);
    font-weight: normal;
}

.notifyjs-wrapper.notifyjs-hidable {
    left: -2px !important;
}

div[id*="divManageBookMarks"],
div[id*="divManageFolders"] {
    min-height: 33px;
}

ul.links-folder {
    padding: 0 0 0 20px;
    margin: 0;
}

    ul.links-folder li {
        list-style: none;
    }

ul.links-folder {
    background: #f4f4f4a3;
    font-family: "Cairo";
}

    ul.links-folder li .logger-info-body-link.clearfix .tools a {
        color: #979797;
        font-family: "Cairo";
    }

    ul.links-folder li .logger-info-body-link.clearfix .tools a {
        color: #979797;
        font-family: "Cairo";
    }

.logger-info-body-ul
li.logger-info-linkwithfolder
div.logger-info-body-folder[data-bs-toggle="collapse"] {
    cursor: pointer;
}

    .logger-info-body-ul
    li.logger-info-linkwithfolder
    div.logger-info-body-folder[data-bs-toggle="collapse"][aria-expanded="true"] {
        background: #f1f1f1;
    }

        .logger-info-body-ul
        li.logger-info-linkwithfolder
        div.logger-info-body-folder[data-bs-toggle="collapse"][aria-expanded="true"]:before {
            content: "";
        }

.logger-info-body-ul li.logger-info-linkwithfolder:hover {
    background: unset;
}

span.nodatabookmarks.ValidationClass,
.nodataviewallbookmarks.ValidationClass,
.nodataviewallfolders.ValidationClass {
    display: table;
    padding: 8px 15px;
    width: 100%;
}

    span.nodatabookmarks.ValidationClass:empty,
    .nodataviewallbookmarks.ValidationClass:empty,
    .nodataviewallfolders.ValidationClass:empty {
        display: none;
    }

input[id*="tbSearchBookMarks"].form-control,
input[id*="tbNewNameFolder"].form-control {
    font-size: var(--font-12, 12px);
}

.scrollbookmarks {
    float: right;
    width: 100%;
    max-height: 300px;
}

.input-group .form-control,
.input-group-btn:last-child > .btn,
.input-group-btn:last-child > .btn-group {
    z-index: 0;
}

div[id*="divViewAllFolders"],
div[id*="divViewAllBookMarks"] {
    position: relative;
    clear: both;
    width: 100%;
    float: right;
}

[placeholder] {
    text-overflow: ellipsis;
    font-size: var(--font-16, 16px);
    font-family: "Cairo";
    color: #98a2b3;
    letter-spacing: 0 !important;
}

::-webkit-input-placeholder {
    text-overflow: ellipsis;
    font-size: var(--font-16, 16px);
    font-family: "Cairo";
    color: #98a2b3;
    text-align: right;
}

::-moz-placeholder {
    text-overflow: ellipsis;
    font-size: var(--font-16, 16px);
    font-family: "Cairo";
    color: #98a2b3;
    text-align: right;
    color-scheme: dark;
    color-adjust: economy;
    color-interpolation: auto;
    color-scheme: revert;
}

:-ms-input-placeholder {
    text-overflow: ellipsis;
    font-size: var(--font-16, 16px);
    font-family: "Cairo";
    color: #98a2b3;
    text-align: right;
}

:-moz-placeholder {
    text-overflow: ellipsis;
    font-size: var(--font-16, 16px);
    font-family: "Cairo";
    color: #98a2b3;
    text-align: right;
}

[data-notify-text],
[data-notify-html] {
    font-family: "Cairo";
    font-size: var(--font-12, 12px);
}

div[id*="_divPasswordDesc"] {
    font-family: "Cairo";
}

td.menu div {
    font-size: var(--font-16, 16px);
    font-family: Arial (Arabic);
    font-weight: bold;
    height: 18px;
    color: #36c;
    padding-top: 9px;
    background-position: right;
    cursor: hand;
    cursor: pointer;
    vertical-align: bottom;
}

td.menu_a {
    width: 15px;
    background-repeat: no-repeat;
    background-position: right;
    background-image: url("../../Images/Menu/AR/up_row.gif");
}

td.menu_b {
    background-image: url("../../Images/Menu/AR/up_bg.gif");
}

.menu_isovera {
    background-repeat: no-repeat;
    background-image: url("../../Images/Menu/AR/over_row.gif");
}

.menu_isoverb {
    background-image: url("../../Images/Menu/AR/over_bg.gif");
    background-repeat: repeat-x;
    background-position: left;
}

.menu_isouta {
    background-repeat: no-repeat;
    background-image: url("../../Images/Menu/AR/up_row.gif");
}

.menu_isoutb {
    width: 100%;
    background-image: url("../../Images/Menu/AR/up_bg.gif");
}

.menu_presseda {
    background-repeat: no-repeat;
    background-image: url("../../Images/Menu/AR/prsd_row.gif");
}

.menu_pressedb {
    width: 100%;
    background-image: url("../../Images/Menu/AR/prsd_bg.gif");
}

td.menu {
    height: 27px;
    padding: 0;
}

.multiselect-native-select,
.select2-container {
    box-sizing: border-box;
    display: inline-block;
    margin: 0;
    position: relative;
    vertical-align: middle;
    margin: 2px 0;
}

    .ms-parent .multiselect.dropdown-toggle,
    .select2-container .select2-selection--single {
        display: flex !important;
        align-items: center !important;
        box-sizing: border-box;
        cursor: pointer;
        display: block;
        height: auto;
        user-select: none;
        -webkit-user-select: none;
    }

        .select2-container .select2-selection--single .select2-selection__rendered {
            display: block;
            padding-left: 33px;
            padding-right: 20px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap !important;
            font-family: "Cairo" !important;
            font-size: var(--font-16, 16px);
        }

        .select2-container .select2-selection--single .select2-selection__clear {
            position: relative;
        }

    .select2-container .select2-selection--multiple {
        box-sizing: border-box;
        cursor: pointer;
        display: block;
        min-height: var(--controls-height, 48px);
        user-select: none;
        -webkit-user-select: none;
    }

        .select2-container .select2-selection--multiple .select2-selection__rendered {
            display: inline-block;
            overflow: hidden;
            padding-left: 8px;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

    .select2-container .select2-search--inline {
        float: left;
    }

        .select2-container .select2-search--inline .select2-search__field {
            box-sizing: border-box;
            border: none;
            font-size: 100%;
            margin-top: 5px;
            padding: 0;
        }

            .select2-container
            .select2-search--inline
            .select2-search__field::-webkit-search-cancel-button {
                -webkit-appearance: none;
            }

.select2-dropdown {
    background-color: var(--dark-gray, var(--dark-black, #fff));
    border: 1px solid var(--controls-active-border-clr, #e1e6ef);
    border-radius: var(--border-radius-sm, 13px);
    box-sizing: border-box;
    display: block;
    position: absolute;
    left: -100000px;
    width: 100%;
    z-index: 1051;
}

.select2-results {
    display: block;
}

.ms-parent .multiselect-container.dropdown-menu li,
.select2-results__options {
    list-style: none;
    margin: 0;
    padding: 3px 8px;
    user-select: none;
    -webkit-user-select: none;
}

    .ms-parent .multiselect-container.dropdown-menu li a,
    .select2-results__options li {
        min-height: 38px;
        justify-content: center;
        align-content: center;
        margin-bottom: 1px;
        padding: 8px;
        border-radius: var(--border-radius-sm, 13px) !important;
        position: relative;
    }

        .select2-results__options li:after {
            content: "";
            width: calc(100% - 16px);
            height: 1px;
            background-color: #eee;
            display: inline-block;
            position: absolute;
            bottom: -1px;
            left: 10px;
        }

.select2-results__option[aria-selected] {
    cursor: pointer;
}

.select2-container--open .select2-dropdown {
    left: 0;
}

.select2-container--open .select2-dropdown--above {
    transform: translate3d(0px, -4px, 0px);
}

.select2-container--open .select2-dropdown--below {
    transform: translate3d(0px, 0, 0px);
}

.select2-search--dropdown {
    display: block;
    padding: 4px;
}

    .select2-search--dropdown .select2-search__field {
        height: 23px;
        padding-right: 16px;
        width: 100%;
        box-sizing: border-box;
    }

        .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {
            -webkit-appearance: none;
        }

    .select2-search--dropdown.select2-search--hide {
        display: none;
    }

.select2-close-mask {
    border: 0;
    margin: 0;
    padding: 0;
    display: block;
    position: fixed;
    left: 0;
    top: 0;
    min-height: 100%;
    min-width: 100%;
    height: auto;
    width: auto;
    opacity: 0;
    z-index: 99;
    background-color: var(--dark-gray, var(--dark-black, #fff));
    filter: alpha(opacity=0);
}

.select2-hidden-accessible {
    border: 0 !important;
    clip: rect(0 0 0 0) !important;
    height: 1px !important;
    margin: -1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
}

.select2-container--default .select2-selection--single {
    background-color: var(--dark-gray, var(--dark-black, #fff));
    border: 1px solid var(--controls-active-border-clr, #e1e6ef);
    border-radius: var(--border-radius-sm, 8px);
    min-height: var(--controls-height, 48px);
}

    .select2-container--default
    .select2-selection--single
    .select2-selection__rendered {
        color: var(--main-text, #555);
    }

    .select2-container--default
    .select2-selection--single
    .select2-selection__clear {
        cursor: pointer;
        float: right;
        font-weight: bold;
    }

    .select2-container--default
    .select2-selection--single
    .select2-selection__placeholder {
        color: #999;
    }

    .select2-container--default
    .select2-selection--single
    .select2-selection__arrow {
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        width: 30px;
    }

        .select2-container--default
        .select2-selection--single
        .select2-selection__arrow
        b:after {
            font-family: "icomoon";
            position: absolute;
            font-style: normal;
            font-weight: normal;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            transform: rotate(90deg);
            left: 18px;
            top: 9px;
            color: #98a2b3;
            display: block;
            font-size: var(--font-16, 16px);
            content: "";
        }

.select2-container--default[dir="rtl"]
.select2-selection--single
.select2-selection__clear {
    float: left;
}

.select2-container--default.select2-container--disabled
.select2-selection--single {
    background-color: #eee;
    cursor: default;
}

    .select2-container--default.select2-container--disabled
    .select2-selection--single
    .select2-selection__clear {
        display: none;
    }

.select2-container--default.select2-container--open
.select2-selection--single
.select2-selection__arrow
b {
    border-color: transparent transparent #888 transparent;
    border-width: 0 4px 5px 4px;
}

.select2-container--default .select2-selection--multiple {
    background-color: var(--dark-gray, var(--dark-black, #fff));
    border: 1px solid var(--controls-active-border-clr, #e1e6ef);
    border-radius: var(--border-radius-sm, 13px);
    cursor: text;
}

    .select2-container--default
    .select2-selection--multiple
    .select2-selection__rendered {
        box-sizing: border-box;
        list-style: none;
        margin: 0;
        padding: 0 5px;
        width: 100%;
    }

        .select2-container--default
        .select2-selection--multiple
        .select2-selection__rendered
        li {
            list-style: none;
        }

    .select2-container--default
    .select2-selection--multiple
    .select2-selection__placeholder {
        color: #999;
        margin-top: 5px;
        float: left;
    }

    .select2-container--default
    .select2-selection--multiple
    .select2-selection__clear {
        cursor: pointer;
        float: right;
        font-weight: bold;
        margin-top: 5px;
        margin-right: 10px;
    }

    .select2-container--default
    .select2-selection--multiple
    .select2-selection__choice {
        background-color: #e4e4e4;
        border: 1px solid var(--controls-active-border-clr, #e1e6ef);
        border-radius: var(--border-radius-sm, 13px);
        cursor: default;
        float: left;
        margin-right: 5px;
        margin-top: 5px;
        padding: 0 5px;
    }

    .select2-container--default
    .select2-selection--multiple
    .select2-selection__choice__remove {
        color: #999;
        cursor: pointer;
        display: inline-block;
        font-weight: bold;
        margin-right: 2px;
    }

        .select2-container--default
        .select2-selection--multiple
        .select2-selection__choice__remove:hover {
            color: #333;
        }

.select2-container--default[dir="rtl"]
.select2-selection--multiple
.select2-selection__choice,
.select2-container--default[dir="rtl"]
.select2-selection--multiple
.select2-selection__placeholder,
.select2-container--default[dir="rtl"]
.select2-selection--multiple
.select2-search--inline {
    float: right;
}

.select2-container--default[dir="rtl"]
.select2-selection--multiple
.select2-selection__choice {
    margin-left: 5px;
    margin-right: auto;
}

.select2-container--default[dir="rtl"]
.select2-selection--multiple
.select2-selection__choice__remove {
    margin-left: 2px;
    margin-right: auto;
}

.select2-container--default.select2-container--focus
.select2-selection--multiple {
    border: solid #000 1px;
    outline: 0;
}

.select2-container--default.select2-container--disabled
.select2-selection--multiple {
    background-color: #eee;
    cursor: default;
}

.select2-container--default.select2-container--disabled
.select2-selection__choice__remove {
    display: none;
}

.select2-container--default.select2-container--open.select2-container--above
.select2-selection--single,
.select2-container--default.select2-container--open.select2-container--above
.select2-selection--multiple {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.select2-container--default.select2-container--open.select2-container--below
.select2-selection--single,
.select2-container--default.select2-container--open.select2-container--below
.select2-selection--multiple {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.select2-search.select2-search--dropdown {
    padding: 8px !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid #ddd;
    border-radius: var(--border-radius-sm, 7px);
    min-height: 36px;
    font-family: "Cairo";
}

.select2-container--default .select2-search--inline .select2-search__field {
    background: transparent;
    border: none;
    outline: 0;
    box-shadow: none;
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    appearance: textfield;
}

.select2-container--default .select2-results > .select2-results__options {
    max-height: 200px;
    overflow-y: auto;
}

.select2-container--default .select2-results__option[role="group"] {
    padding: 0;
}

.select2-container--default .select2-results__option[aria-disabled="true"] {
    color: #999;
}

.select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: #ddd;
}

.select2-container--default .select2-results__option .select2-results__option {
    padding-left: 1em;
}

    .select2-container--default
    .select2-results__option
    .select2-results__option
    .select2-results__group {
        padding-left: 0;
    }

    .select2-container--default
    .select2-results__option
    .select2-results__option
    .select2-results__option {
        margin-left: -1em;
        padding-left: 2em;
    }

        .select2-container--default
        .select2-results__option
        .select2-results__option
        .select2-results__option
        .select2-results__option {
            margin-left: -2em;
            padding-left: 3em;
        }

            .select2-container--default
            .select2-results__option
            .select2-results__option
            .select2-results__option
            .select2-results__option
            .select2-results__option {
                margin-left: -3em;
                padding-left: 4em;
            }

                .select2-container--default
                .select2-results__option
                .select2-results__option
                .select2-results__option
                .select2-results__option
                .select2-results__option
                .select2-results__option {
                    margin-left: -4em;
                    padding-left: 5em;
                }

                    .select2-container--default
                    .select2-results__option
                    .select2-results__option
                    .select2-results__option
                    .select2-results__option
                    .select2-results__option
                    .select2-results__option
                    .select2-results__option {
                        margin-left: -5em;
                        padding-left: 6em;
                    }

.select2-container--default
.select2-results__option--highlighted[aria-selected] {
    background-color: var(--primary-color, #2986cc) !important;
    color: #fff;
}

.select2-container--default .select2-results__group {
    cursor: default;
    display: block;
    padding: 6px;
}

.select2-container--classic .select2-selection--single {
    background-color: #f7f7f7;
    border: 1px solid var(--controls-active-border-clr, #e1e6ef);
    border-radius: var(--border-radius-sm, 13px);
    outline: 0;
    background-image: -webkit-linear-gradient(top, white 50%, #eee 100%);
    background-image: -o-linear-gradient(top, white 50%, #eee 100%);
    background-image: linear-gradient(to bottom, white 50%, #eee 100%);
    background-repeat: repeat-x;
}

    .select2-container--classic .select2-selection--single:focus {
        border: 1px solid #5897fb;
    }

    .select2-container--classic
    .select2-selection--single
    .select2-selection__rendered {
        color: var(--main-text, #555);
    }

    .select2-container--classic
    .select2-selection--single
    .select2-selection__clear {
        cursor: pointer;
        float: right;
        font-weight: bold;
        margin-right: 10px;
    }

    .select2-container--classic
    .select2-selection--single
    .select2-selection__placeholder {
        color: #999;
    }

    .select2-container--classic
    .select2-selection--single
    .select2-selection__arrow {
        background-color: #ddd;
        border: none;
        border-left: 1px solid var(--controls-active-border-clr, #e1e6ef);
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
        height: 26px;
        position: absolute;
        top: 1px;
        right: 1px;
        width: 20px;
        background-image: -webkit-linear-gradient(top, #eee 50%, #ccc 100%);
        background-image: -o-linear-gradient(top, #eee 50%, #ccc 100%);
        background-image: linear-gradient(to bottom, #eee 50%, #ccc 100%);
        background-repeat: repeat-x;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0);
    }

        .select2-container--classic
        .select2-selection--single
        .select2-selection__arrow
        b {
            border-color: #888 transparent transparent transparent;
            border-style: solid;
            border-width: 5px 4px 0 4px;
            height: 0;
            left: 50%;
            margin-left: -4px;
            margin-top: -2px;
            position: absolute;
            top: 50%;
            width: 0;
        }

.select2-container--classic[dir="rtl"]
.select2-selection--single
.select2-selection__clear {
    float: left;
}

.select2-container--classic[dir="rtl"]
.select2-selection--single
.select2-selection__arrow {
    border: none;
    border-right: 1px solid var(--controls-active-border-clr, #e1e6ef);
    border-radius: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    left: 1px;
    right: auto;
}

.select2-container--classic.select2-container--open .select2-selection--single {
    border: 1px solid #5897fb;
}

    .select2-container--classic.select2-container--open
    .select2-selection--single
    .select2-selection__arrow {
        background: transparent;
        border: none;
    }

        .select2-container--classic.select2-container--open
        .select2-selection--single
        .select2-selection__arrow
        b {
            border-color: transparent transparent #888 transparent;
            border-width: 0 4px 5px 4px;
        }

.select2-container--classic.select2-container--open.select2-container--above
.select2-selection--single {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    background-image: -webkit-linear-gradient(top, white 0%, #eee 50%);
    background-image: -o-linear-gradient(top, white 0%, #eee 50%);
    background-image: linear-gradient(to bottom, white 0%, #eee 50%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0);
}

.select2-container--classic.select2-container--open.select2-container--below
.select2-selection--single {
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background-image: -webkit-linear-gradient(top, #eee 50%, white 100%);
    background-image: -o-linear-gradient(top, #eee 50%, white 100%);
    background-image: linear-gradient(to bottom, #eee 50%, white 100%);
    background-repeat: repeat-x;
}

.select2-container--classic .select2-selection--multiple {
    background-color: var(--dark-gray, var(--dark-black, #fff));
    border: 1px solid var(--controls-active-border-clr, #e1e6ef);
    border-radius: var(--border-radius-sm, 13px);
    cursor: text;
    outline: 0;
}

    .select2-container--classic .select2-selection--multiple:focus {
        border: 1px solid #5897fb;
    }

    .select2-container--classic
    .select2-selection--multiple
    .select2-selection__rendered {
        list-style: none;
        margin: 0;
        padding: 0 5px;
    }

    .select2-container--classic
    .select2-selection--multiple
    .select2-selection__clear {
        display: none;
    }

    .select2-container--classic
    .select2-selection--multiple
    .select2-selection__choice {
        background-color: #e4e4e4;
        border: 1px solid var(--controls-active-border-clr, #e1e6ef);
        border-radius: var(--border-radius-sm, 13px);
        cursor: default;
        float: left;
        margin-right: 5px;
        margin-top: 5px;
        padding: 0 5px;
    }

    .select2-container--classic
    .select2-selection--multiple
    .select2-selection__choice__remove {
        color: #888;
        cursor: pointer;
        display: inline-block;
        font-weight: bold;
        margin-right: 2px;
    }

        .select2-container--classic
        .select2-selection--multiple
        .select2-selection__choice__remove:hover {
            color: var(--main-text, #555);
        }

.select2-container--classic[dir="rtl"]
.select2-selection--multiple
.select2-selection__choice {
    float: right;
}

.select2-container--classic[dir="rtl"]
.select2-selection--multiple
.select2-selection__choice {
    margin-left: 5px;
    margin-right: auto;
}

.select2-container--classic[dir="rtl"]
.select2-selection--multiple
.select2-selection__choice__remove {
    margin-left: 2px;
    margin-right: auto;
}

.select2-container--classic.select2-container--open
.select2-selection--multiple {
    border: 1px solid #5897fb;
}

.select2-container--classic.select2-container--open.select2-container--above
.select2-selection--multiple {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.select2-container--classic.select2-container--open.select2-container--below
.select2-selection--multiple {
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.select2-container--classic .select2-search--dropdown .select2-search__field {
    border: 1px solid var(--controls-active-border-clr, #e1e6ef);
    border-radius: var(--border-radius-sm, 13px);
    outline: 0;
}

.select2-container--classic .select2-search--inline .select2-search__field {
    outline: 0;
    box-shadow: none;
}

.select2-container--classic .select2-dropdown {
    background-color: var(--dark-gray, var(--dark-black, #fff));
    border: 1px solid transparent;
}

.select2-container--classic .select2-dropdown--above {
    border-bottom: none;
}

.select2-container--classic .select2-dropdown--below {
    border-top: none;
}

.select2-container--classic .select2-results > .select2-results__options {
    max-height: 200px;
    overflow-y: auto;
}

.select2-container--classic .select2-results__option[role="group"] {
    padding: 0;
}

.select2-container--classic .select2-results__option[aria-disabled="true"] {
    color: #808080;
}

.select2-container--classic
.select2-results__option--highlighted[aria-selected] {
    background-color: #3875d7;
    color: #fff;
}

.select2-container--classic .select2-results__group {
    cursor: default;
    display: block;
    padding: 6px;
}

.select2-container--classic.select2-container--open .select2-dropdown {
    border-color: #5897fb;
}

.select2-container.select2-container--default.select2-container--open {
    z-index: 2;
}

.fa {
    display: inline-block;
    font-style: normal;
    font-weight: normal;
    font-stretch: normal;
    font-size: var(--font-14, 14px);
    line-height: 1;
    font-family: FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.fa-lg {
    font-size: 1.33333333em;
    vertical-align: -15%;
}

.fa-2x {
    font-size: 2em;
}

.fa-3x {
    font-size: 3em;
}

.fa-4x {
    font-size: 4em;
}

.fa-5x {
    font-size: 5em;
}

.fa-fw {
    width: 1.28571429em;
    text-align: center;
}

.fa-ul {
    padding-left: 0;
    margin-left: 2.14285714em;
    list-style-type: none;
}

    .fa-ul > li {
        position: relative;
    }

.fa-li {
    position: absolute;
    left: -2.14285714em;
    width: 2.14285714em;
    top: 0.14285714em;
    text-align: center;
}

    .fa-li.fa-lg {
        left: -1.85714286em;
    }

.fa-border {
    padding: 0.2em 0.25em 0.15em;
    border: solid 0.08em #eee;
    border-radius: 0.1em;
}

.fa-pull-left {
    float: left;
}

.fa-pull-right {
    float: right;
}

.fa.fa-pull-left {
    margin-right: 0.3em;
}

.fa.fa-pull-right {
    margin-left: 0.3em;
}

.pull-right {
    float: right;
}

.pull-left {
    float: left;
}

.fa.pull-left {
    margin-right: 0.3em;
}

.fa.pull-right {
    margin-left: 0.3em;
}

.fa-spin {
    -webkit-animation: fa-spin 2s infinite linear;
    animation: fa-spin 2s infinite linear;
}

.fa-pulse {
    -webkit-animation: fa-spin 1s infinite steps(8);
    animation: fa-spin 1s infinite steps(8);
}

@-webkit-keyframes fa-spin {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

@keyframes fa-spin {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

.fa-rotate-90 {
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.fa-rotate-180 {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.fa-rotate-270 {
    -webkit-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
}

.fa-flip-horizontal {
    -webkit-transform: scale(-1, 1);
    -ms-transform: scale(-1, 1);
    transform: scale(-1, 1);
}

.fa-flip-vertical {
    -webkit-transform: scale(1, -1);
    -ms-transform: scale(1, -1);
    transform: scale(1, -1);
}

:root .fa-flip-horizontal,
:root .fa-flip-vertical,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-rotate-90 {
    filter: none;
}

.fa-stack {
    position: relative;
    display: inline-block;
    width: 2em;
    height: 2em;
    vertical-align: middle;
}

.fa-stack-1x,
.fa-stack-2x {
    position: absolute;
    left: 0;
    width: 100%;
    text-align: center;
}

.fa-stack-1x {
    line-height: inherit;
}

.fa-stack-2x {
    font-size: 2em;
}

.fa-inverse {
    color: #fff;
}

.fa-glass:before {
    content: "";
}

.fa-music:before {
    content: "";
}

.fa-search:before {
    content: "";
}

.fa-envelope-o:before {
    content: "";
}

.fa-heart:before {
    content: "";
}

.fa-star:before {
    content: "";
}

.fa-star-o:before {
    content: "";
}

.fa-user:before {
    content: "";
}

.fa-film:before {
    content: "";
}

.fa-th-large:before {
    content: "";
}

.fa-th:before {
    content: "";
}

.fa-th-list:before {
    content: "";
}

.fa-check:before {
    content: "";
}

.fa-close:before,
.fa-remove:before,
.fa-times:before {
    content: "";
}

.fa-search-plus:before {
    content: "";
}

.fa-search-minus:before {
    content: "";
}

.fa-power-off:before {
    content: "";
}

.fa-signal:before {
    content: "";
}

.fa-cog:before,
.fa-gear:before {
    content: "";
}

.fa-trash-o:before {
    content: "";
}

.fa-home:before {
    content: "";
}

.fa-file-o:before {
    content: "";
}

.fa-clock-o:before {
    content: "";
}

.fa-road:before {
    content: "";
}

.fa-download:before {
    content: "";
}

.fa-arrow-circle-o-down:before {
    content: "";
}

.fa-arrow-circle-o-up:before {
    content: "";
}

.fa-inbox:before {
    content: "";
}

.fa-play-circle-o:before {
    content: "";
}

.fa-repeat:before,
.fa-rotate-right:before {
    content: "";
}

.fa-refresh:before {
    content: "";
}

.fa-list-alt:before {
    content: "";
}

.fa-lock:before {
    content: "";
}

.fa-flag:before {
    content: "";
}

.fa-headphones:before {
    content: "";
}

.fa-volume-off:before {
    content: "";
}

.fa-volume-down:before {
    content: "";
}

.fa-volume-up:before {
    content: "";
}

.fa-qrcode:before {
    content: "";
}

.fa-barcode:before {
    content: "";
}

.fa-tag:before {
    content: "";
}

.fa-tags:before {
    content: "";
}

.fa-book:before {
    content: "";
}

.fa-bookmark:before {
    content: "";
}

.fa-print:before {
    content: "";
}

.fa-camera:before {
    content: "";
}

.fa-font:before {
    content: "";
}

.fa-bold:before {
    content: "";
}

.fa-italic:before {
    content: "";
}

.fa-text-height:before {
    content: "";
}

.fa-text-width:before {
    content: "";
}

.fa-align-left:before {
    content: "";
}

.fa-align-center:before {
    content: "";
}

.fa-align-right:before {
    content: "";
}

.fa-align-justify:before {
    content: "";
}

.fa-list:before {
    content: "";
}

.fa-dedent:before,
.fa-outdent:before {
    content: "";
}

.fa-indent:before {
    content: "";
}

.fa-video-camera:before {
    content: "";
}

.fa-image:before,
.fa-photo:before,
.fa-picture-o:before {
    content: "";
}

.fa-pencil:before {
    content: "";
}

.fa-map-marker:before {
    content: "";
}

.fa-adjust:before {
    content: "";
}

.fa-tint:before {
    content: "";
}

.fa-edit:before,
.fa-pencil-square-o:before {
    content: "";
}

.fa-share-square-o:before {
    content: "";
}

.fa-check-square-o:before {
    content: "";
}

.fa-arrows:before {
    content: "";
}

.fa-step-backward:before {
    content: "";
}

.fa-fast-backward:before {
    content: "";
}

.fa-backward:before {
    content: "";
}

.fa-play:before {
    content: "";
}

.fa-pause:before {
    content: "";
}

.fa-stop:before {
    content: "";
}

.fa-forward:before {
    content: "";
}

.fa-fast-forward:before {
    content: "";
}

.fa-step-forward:before {
    content: "";
}

.fa-eject:before {
    content: "";
}

.fa-chevron-left:before {
    content: "";
}

.fa-chevron-right:before {
    content: "";
}

.fa-plus-circle:before {
    content: "";
}

.fa-minus-circle:before {
    content: "";
}

.fa-times-circle:before {
    content: "";
}

.fa-check-circle:before {
    content: "";
}

.fa-question-circle:before {
    content: "";
}

.fa-info-circle:before {
    content: "";
}

.fa-crosshairs:before {
    content: "";
}

.fa-times-circle-o:before {
    content: "";
}

.fa-check-circle-o:before {
    content: "";
}

.fa-ban:before {
    content: "";
}

.fa-arrow-left:before {
    content: "";
}

.fa-arrow-right:before {
    content: "";
}

.fa-arrow-up:before {
    content: "";
}

.fa-arrow-down:before {
    content: "";
}

.fa-mail-forward:before,
.fa-share:before {
    content: "";
}

.fa-expand:before {
    content: "";
}

.fa-compress:before {
    content: "";
}

.fa-plus:before {
    content: "";
}

.fa-minus:before {
    content: "";
}

.fa-asterisk:before {
    content: "";
}

.fa-exclamation-circle:before {
    content: "";
}

.fa-gift:before {
    content: "";
}

.fa-leaf:before {
    content: "";
}

.fa-fire:before {
    content: "";
}

.fa-eye:before {
    content: "";
}

.fa-eye-slash:before {
    content: "";
}

.fa-exclamation-triangle:before,
.fa-warning:before {
    content: "";
}

.fa-plane:before {
    content: "";
}

.fa-calendar:before {
    content: "";
}

.fa-random:before {
    content: "";
}

.fa-comment:before {
    content: "";
}

.fa-magnet:before {
    content: "";
}

.fa-chevron-up:before {
    content: "";
}

.fa-chevron-down:before {
    content: "";
}

.fa-retweet:before {
    content: "";
}

.fa-shopping-cart:before {
    content: "";
}

.fa-folder:before {
    content: "";
}

.fa-folder-open:before {
    content: "";
}

.fa-arrows-v:before {
    content: "";
}

.fa-arrows-h:before {
    content: "";
}

.fa-bar-chart-o:before,
.fa-bar-chart:before {
    content: "";
}

.fa-twitter-square:before {
    content: "";
}

.fa-facebook-square:before {
    content: "";
}

.fa-camera-retro:before {
    content: "";
}

.fa-key:before {
    content: "";
}

.fa-cogs:before,
.fa-gears:before {
    content: "";
}

.fa-comments:before {
    content: "";
}

.fa-thumbs-o-up:before {
    content: "";
}

.fa-thumbs-o-down:before {
    content: "";
}

.fa-star-half:before {
    content: "";
}

.fa-heart-o:before {
    content: "";
}

.fa-sign-out:before {
    content: "";
}

.fa-linkedin-square:before {
    content: "";
}

.fa-thumb-tack:before {
    content: "";
}

.fa-external-link:before {
    content: "";
}

.fa-sign-in:before {
    content: "";
}

.fa-trophy:before {
    content: "";
}

.fa-github-square:before {
    content: "";
}

.fa-upload:before {
    content: "";
}

.fa-lemon-o:before {
    content: "";
}

.fa-phone:before {
    content: "";
}

.fa-square-o:before {
    content: "";
}

.fa-bookmark-o:before {
    content: "";
}

.fa-phone-square:before {
    content: "";
}

.fa-twitter:before {
    content: "";
}

.fa-facebook-f:before,
.fa-facebook:before {
    content: "";
}

.fa-github:before {
    content: "";
}

.fa-unlock:before {
    content: "";
}

.fa-credit-card:before {
    content: "";
}

.fa-feed:before,
.fa-rss:before {
    content: "";
}

.fa-hdd-o:before {
    content: "";
}

.fa-bullhorn:before {
    content: "";
}

.fa-bell:before {
    content: "";
}

.fa-certificate:before {
    content: "";
}

.fa-hand-o-right:before {
    content: "";
}

.fa-hand-o-left:before {
    content: "";
}

.fa-hand-o-up:before {
    content: "";
}

.fa-hand-o-down:before {
    content: "";
}

.fa-arrow-circle-left:before {
    content: "";
}

.fa-arrow-circle-right:before {
    content: "";
}

.fa-arrow-circle-up:before {
    content: "";
}

.fa-arrow-circle-down:before {
    content: "";
}

.fa-globe:before {
    content: "";
}

.fa-wrench:before {
    content: "";
}

.fa-tasks:before {
    content: "";
}

.fa-filter:before {
    content: "";
}

.fa-briefcase:before {
    content: "";
}

.fa-arrows-alt:before {
    content: "";
}

.fa-group:before,
.fa-users:before {
    content: "";
}

.fa-chain:before,
.fa-link:before {
    content: "";
}

.fa-cloud:before {
    content: "";
}

.fa-flask:before {
    content: "";
}

.fa-cut:before,
.fa-scissors:before {
    content: "";
}

.fa-copy:before,
.fa-files-o:before {
    content: "";
}

.fa-paperclip:before {
    content: "";
}

.fa-floppy-o:before,
.fa-save:before {
    content: "";
}

.fa-square:before {
    content: "";
}

.fa-bars:before,
.fa-navicon:before,
.fa-reorder:before {
    content: "";
}

.fa-list-ul:before {
    content: "";
}

.fa-list-ol:before {
    content: "";
}

.fa-strikethrough:before {
    content: "";
}

.fa-underline:before {
    content: "";
}

.fa-table:before {
    content: "";
}

.fa-magic:before {
    content: "";
}

.fa-truck:before {
    content: "";
}

.fa-pinterest:before {
    content: "";
}

.fa-pinterest-square:before {
    content: "";
}

.fa-google-plus-square:before {
    content: "";
}

.fa-google-plus:before {
    content: "";
}

.fa-money:before {
    content: "";
}

.fa-caret-down:before {
    content: "";
}

.fa-caret-up:before {
    content: "";
}

.fa-caret-left:before {
    content: "";
}

.fa-caret-right:before {
    content: "";
}

.fa-columns:before {
    content: "";
}

.fa-sort:before,
.fa-unsorted:before {
    content: "";
}

.fa-sort-desc:before,
.fa-sort-down:before {
    content: "";
}

.fa-sort-asc:before,
.fa-sort-up:before {
    content: "";
}

.fa-envelope:before {
    content: "";
}

.fa-linkedin:before {
    content: "";
}

.fa-rotate-left:before,
.fa-undo:before {
    content: "";
}

.fa-gavel:before,
.fa-legal:before {
    content: "";
}

.fa-dashboard:before,
.fa-tachometer:before {
    content: "";
}

.fa-comment-o:before {
    content: "";
}

.fa-comments-o:before {
    content: "";
}

.fa-bolt:before,
.fa-flash:before {
    content: "";
}

.fa-sitemap:before {
    content: "";
}

.fa-umbrella:before {
    content: "";
}

.fa-clipboard:before,
.fa-paste:before {
    content: "";
}

.fa-lightbulb-o:before {
    content: "";
}

.fa-exchange:before {
    content: "";
}

.fa-cloud-download:before {
    content: "";
}

.fa-cloud-upload:before {
    content: "";
}

.fa-user-md:before {
    content: "";
}

.fa-stethoscope:before {
    content: "";
}

.fa-suitcase:before {
    content: "";
}

.fa-bell-o:before {
    content: "";
}

.fa-coffee:before {
    content: "";
}

.fa-cutlery:before {
    content: "";
}

.fa-file-text-o:before {
    content: "";
}

.fa-building-o:before {
    content: "";
}

.fa-hospital-o:before {
    content: "";
}

.fa-ambulance:before {
    content: "";
}

.fa-medkit:before {
    content: "";
}

.fa-fighter-jet:before {
    content: "";
}

.fa-beer:before {
    content: "";
}

.fa-h-square:before {
    content: "";
}

.fa-plus-square:before {
    content: "";
}

.fa-angle-double-left:before {
    content: "";
}

.fa-angle-double-right:before {
    content: "";
}

.fa-angle-double-up:before {
    content: "";
}

.fa-angle-double-down:before {
    content: "";
}

.fa-angle-left:before {
    content: "";
}

.fa-angle-right:before {
    content: "";
}

.fa-angle-up:before {
    content: "";
}

.fa-angle-down:before {
    content: "";
}

.fa-desktop:before {
    content: "";
}

.fa-laptop:before {
    content: "";
}

.fa-tablet:before {
    content: "";
}

.fa-mobile-phone:before,
.fa-mobile:before {
    content: "";
}

.fa-circle-o:before {
    content: "";
}

.fa-quote-left:before {
    content: "";
}

.fa-quote-right:before {
    content: "";
}

.fa-spinner:before {
    content: "";
}

.fa-circle:before {
    content: "";
}

.fa-mail-reply:before,
.fa-reply:before {
    content: "";
}

.fa-github-alt:before {
    content: "";
}

.fa-folder-o:before {
    content: "";
}

.fa-folder-open-o:before {
    content: "";
}

.fa-smile-o:before {
    content: "";
}

.fa-frown-o:before {
    content: "";
}

.fa-meh-o:before {
    content: "";
}

.fa-gamepad:before {
    content: "";
}

.fa-keyboard-o:before {
    content: "";
}

.fa-flag-o:before {
    content: "";
}

.fa-flag-checkered:before {
    content: "";
}

.fa-terminal:before {
    content: "";
}

.fa-code:before {
    content: "";
}

.fa-mail-reply-all:before,
.fa-reply-all:before {
    content: "";
}

.fa-star-half-empty:before,
.fa-star-half-full:before,
.fa-star-half-o:before {
    content: "";
}

.fa-location-arrow:before {
    content: "";
}

.fa-crop:before {
    content: "";
}

.fa-code-fork:before {
    content: "";
}

.fa-chain-broken:before,
.fa-unlink:before {
    content: "";
}

.fa-question:before {
    content: "";
}

.fa-info:before {
    content: "";
}

.fa-exclamation:before {
    content: "";
}

.fa-superscript:before {
    content: "";
}

.fa-subscript:before {
    content: "";
}

.fa-eraser:before {
    content: "";
}

.fa-puzzle-piece:before {
    content: "";
}

.fa-microphone:before {
    content: "";
}

.fa-microphone-slash:before {
    content: "";
}

.fa-shield:before {
    content: "";
}

.fa-calendar-o:before {
    content: "";
}

.fa-fire-extinguisher:before {
    content: "";
}

.fa-rocket:before {
    content: "";
}

.fa-maxcdn:before {
    content: "";
}

.fa-chevron-circle-left:before {
    content: "";
}

.fa-chevron-circle-right:before {
    content: "";
}

.fa-chevron-circle-up:before {
    content: "";
}

.fa-chevron-circle-down:before {
    content: "";
}

.fa-html5:before {
    content: "";
}

.fa-css3:before {
    content: "";
}

.fa-anchor:before {
    content: "";
}

.fa-unlock-alt:before {
    content: "";
}

.fa-bullseye:before {
    content: "";
}

.fa-ellipsis-h:before {
    content: "";
}

.fa-ellipsis-v:before {
    content: "";
}

.fa-rss-square:before {
    content: "";
}

.fa-play-circle:before {
    content: "";
}

.fa-ticket:before {
    content: "";
}

.fa-minus-square:before {
    content: "";
}

.fa-minus-square-o:before {
    content: "";
}

.fa-level-up:before {
    content: "";
}

.fa-level-down:before {
    content: "";
}

.fa-check-square:before {
    content: "";
}

.fa-pencil-square:before {
    content: "";
}

.fa-external-link-square:before {
    content: "";
}

.fa-share-square:before {
    content: "";
}

.fa-compass:before {
    content: "";
}

.fa-caret-square-o-down:before,
.fa-toggle-down:before {
    content: "";
}

.fa-caret-square-o-up:before,
.fa-toggle-up:before {
    content: "";
}

.fa-caret-square-o-right:before,
.fa-toggle-right:before {
    content: "";
}

.fa-eur:before,
.fa-euro:before {
    content: "";
}

.fa-gbp:before {
    content: "";
}

.fa-dollar:before,
.fa-usd:before {
    content: "";
}

.fa-inr:before,
.fa-rupee:before {
    content: "";
}

.fa-cny:before,
.fa-jpy:before,
.fa-rmb:before,
.fa-yen:before {
    content: "";
}

.fa-rouble:before,
.fa-rub:before,
.fa-ruble:before {
    content: "";
}

.fa-krw:before,
.fa-won:before {
    content: "";
}

.fa-bitcoin:before,
.fa-btc:before {
    content: "";
}

.fa-file:before {
    content: "";
}

.fa-file-text:before {
    content: "";
}

.fa-sort-alpha-asc:before {
    content: "";
}

.fa-sort-alpha-desc:before {
    content: "";
}

.fa-sort-amount-asc:before {
    content: "";
}

.fa-sort-amount-desc:before {
    content: "";
}

.fa-sort-numeric-asc:before {
    content: "";
}

.fa-sort-numeric-desc:before {
    content: "";
}

.fa-thumbs-up:before {
    content: "";
}

.fa-thumbs-down:before {
    content: "";
}

.fa-youtube-square:before {
    content: "";
}

.fa-youtube:before {
    content: "";
}

.fa-xing:before {
    content: "";
}

.fa-xing-square:before {
    content: "";
}

.fa-youtube-play:before {
    content: "";
}

.fa-dropbox:before {
    content: "";
}

.fa-stack-overflow:before {
    content: "";
}

.fa-instagram:before {
    content: "";
}

.fa-flickr:before {
    content: "";
}

.fa-adn:before {
    content: "";
}

.fa-bitbucket:before {
    content: "";
}

.fa-bitbucket-square:before {
    content: "";
}

.fa-tumblr:before {
    content: "";
}

.fa-tumblr-square:before {
    content: "";
}

.fa-long-arrow-down:before {
    content: "";
}

.fa-long-arrow-up:before {
    content: "";
}

.fa-long-arrow-left:before {
    content: "";
}

.fa-long-arrow-right:before {
    content: "";
}

.fa-apple:before {
    content: "";
}

.fa-windows:before {
    content: "";
}

.fa-android:before {
    content: "";
}

.fa-linux:before {
    content: "";
}

.fa-dribbble:before {
    content: "";
}

.fa-skype:before {
    content: "";
}

.fa-foursquare:before {
    content: "";
}

.fa-trello:before {
    content: "";
}

.fa-female:before {
    content: "";
}

.fa-male:before {
    content: "";
}

.fa-gittip:before,
.fa-gratipay:before {
    content: "";
}

.fa-sun-o:before {
    content: "";
}

.fa-moon-o:before {
    content: "";
}

.fa-archive:before {
    content: "";
}

.fa-bug:before {
    content: "";
}

.fa-vk:before {
    content: "";
}

.fa-weibo:before {
    content: "";
}

.fa-renren:before {
    content: "";
}

.fa-pagelines:before {
    content: "";
}

.fa-stack-exchange:before {
    content: "";
}

.fa-arrow-circle-o-right:before {
    content: "";
}

.fa-arrow-circle-o-left:before {
    content: "";
}

.fa-caret-square-o-left:before,
.fa-toggle-left:before {
    content: "";
}

.fa-dot-circle-o:before {
    content: "";
}

.fa-wheelchair:before {
    content: "";
}

.fa-vimeo-square:before {
    content: "";
}

.fa-try:before,
.fa-turkish-lira:before {
    content: "";
}

.fa-plus-square-o:before {
    content: "";
}

.fa-space-shuttle:before {
    content: "";
}

.fa-slack:before {
    content: "";
}

.fa-envelope-square:before {
    content: "";
}

.fa-wordpress:before {
    content: "";
}

.fa-openid:before {
    content: "";
}

.fa-bank:before,
.fa-institution:before,
.fa-university:before {
    content: "";
}

.fa-graduation-cap:before,
.fa-mortar-board:before {
    content: "";
}

.fa-yahoo:before {
    content: "";
}

.fa-google:before {
    content: "";
}

.fa-reddit:before {
    content: "";
}

.fa-reddit-square:before {
    content: "";
}

.fa-stumbleupon-circle:before {
    content: "";
}

.fa-stumbleupon:before {
    content: "";
}

.fa-delicious:before {
    content: "";
}

.fa-digg:before {
    content: "";
}

.fa-pied-piper-pp:before {
    content: "";
}

.fa-pied-piper-alt:before {
    content: "";
}

.fa-drupal:before {
    content: "";
}

.fa-joomla:before {
    content: "";
}

.fa-language:before {
    content: "";
}

.fa-fax:before {
    content: "";
}

.fa-building:before {
    content: "";
}

.fa-child:before {
    content: "";
}

.fa-paw:before {
    content: "";
}

.fa-spoon:before {
    content: "";
}

.fa-cube:before {
    content: "";
}

.fa-cubes:before {
    content: "";
}

.fa-behance:before {
    content: "";
}

.fa-behance-square:before {
    content: "";
}

.fa-steam:before {
    content: "";
}

.fa-steam-square:before {
    content: "";
}

.fa-recycle:before {
    content: "";
}

.fa-automobile:before,
.fa-car:before {
    content: "";
}

.fa-cab:before,
.fa-taxi:before {
    content: "";
}

.fa-tree:before {
    content: "";
}

.fa-spotify:before {
    content: "";
}

.fa-deviantart:before {
    content: "";
}

.fa-soundcloud:before {
    content: "";
}

.fa-database:before {
    content: "";
}

.fa-file-pdf-o:before {
    content: "";
}

.fa-file-word-o:before {
    content: "";
}

.fa-file-excel-o:before {
    content: "";
}

.fa-file-powerpoint-o:before {
    content: "";
}

.fa-file-image-o:before,
.fa-file-photo-o:before,
.fa-file-picture-o:before {
    content: "";
}

.fa-file-archive-o:before,
.fa-file-zip-o:before {
    content: "";
}

.fa-file-audio-o:before,
.fa-file-sound-o:before {
    content: "";
}

.fa-file-movie-o:before,
.fa-file-video-o:before {
    content: "";
}

.fa-file-code-o:before {
    content: "";
}

.fa-vine:before {
    content: "";
}

.fa-codepen:before {
    content: "";
}

.fa-jsfiddle:before {
    content: "";
}

.fa-life-bouy:before,
.fa-life-buoy:before,
.fa-life-ring:before,
.fa-life-saver:before,
.fa-support:before {
    content: "";
}

.fa-circle-o-notch:before {
    content: "";
}

.fa-ra:before,
.fa-rebel:before,
.fa-resistance:before {
    content: "";
}

.fa-empire:before,
.fa-ge:before {
    content: "";
}

.fa-git-square:before {
    content: "";
}

.fa-git:before {
    content: "";
}

.fa-hacker-news:before,
.fa-y-combinator-square:before,
.fa-yc-square:before {
    content: "";
}

.fa-tencent-weibo:before {
    content: "";
}

.fa-qq:before {
    content: "";
}

.fa-wechat:before,
.fa-weixin:before {
    content: "";
}

.fa-paper-plane:before,
.fa-send:before {
    content: "";
}

.fa-paper-plane-o:before,
.fa-send-o:before {
    content: "";
}

.fa-history:before {
    content: "";
}

.fa-circle-thin:before {
    content: "";
}

.fa-header:before {
    content: "";
}

.fa-paragraph:before {
    content: "";
}

.fa-sliders:before {
    content: "";
}

.fa-share-alt:before {
    content: "";
}

.fa-share-alt-square:before {
    content: "";
}

.fa-bomb:before {
    content: "";
}

.fa-futbol-o:before,
.fa-soccer-ball-o:before {
    content: "";
}

.fa-tty:before {
    content: "";
}

.fa-binoculars:before {
    content: "";
}

.fa-plug:before {
    content: "";
}

.fa-slideshare:before {
    content: "";
}

.fa-twitch:before {
    content: "";
}

.fa-yelp:before {
    content: "";
}

.fa-newspaper-o:before {
    content: "";
}

.fa-wifi:before {
    content: "";
}

.fa-calculator:before {
    content: "";
}

.fa-paypal:before {
    content: "";
}

.fa-google-wallet:before {
    content: "";
}

.fa-cc-visa:before {
    content: "";
}

.fa-cc-mastercard:before {
    content: "";
}

.fa-cc-discover:before {
    content: "";
}

.fa-cc-amex:before {
    content: "";
}

.fa-cc-paypal:before {
    content: "";
}

.fa-cc-stripe:before {
    content: "";
}

.fa-bell-slash:before {
    content: "";
}

.fa-bell-slash-o:before {
    content: "";
}

.fa-trash:before {
    content: "";
}

.fa-copyright:before {
    content: "";
}

.fa-at:before {
    content: "";
}

.fa-eyedropper:before {
    content: "";
}

.fa-paint-brush:before {
    content: "";
}

.fa-birthday-cake:before {
    content: "";
}

.fa-area-chart:before {
    content: "";
}

.fa-pie-chart:before {
    content: "";
}

.fa-line-chart:before {
    content: "";
}

.fa-lastfm:before {
    content: "";
}

.fa-lastfm-square:before {
    content: "";
}

.fa-toggle-off:before {
    content: "";
}

.fa-toggle-on:before {
    content: "";
}

.fa-bicycle:before {
    content: "";
}

.fa-bus:before {
    content: "";
}

.fa-ioxhost:before {
    content: "";
}

.fa-angellist:before {
    content: "";
}

.fa-cc:before {
    content: "";
}

.fa-ils:before,
.fa-shekel:before,
.fa-sheqel:before {
    content: "";
}

.fa-meanpath:before {
    content: "";
}

.fa-buysellads:before {
    content: "";
}

.fa-connectdevelop:before {
    content: "";
}

.fa-dashcube:before {
    content: "";
}

.fa-forumbee:before {
    content: "";
}

.fa-leanpub:before {
    content: "";
}

.fa-sellsy:before {
    content: "";
}

.fa-shirtsinbulk:before {
    content: "";
}

.fa-simplybuilt:before {
    content: "";
}

.fa-skyatlas:before {
    content: "";
}

.fa-cart-plus:before {
    content: "";
}

.fa-cart-arrow-down:before {
    content: "";
}

.fa-diamond:before {
    content: "";
}

.fa-ship:before {
    content: "";
}

.fa-user-secret:before {
    content: "";
}

.fa-motorcycle:before {
    content: "";
}

.fa-street-view:before {
    content: "";
}

.fa-heartbeat:before {
    content: "";
}

.fa-venus:before {
    content: "";
}

.fa-mars:before {
    content: "";
}

.fa-mercury:before {
    content: "";
}

.fa-intersex:before,
.fa-transgender:before {
    content: "";
}

.fa-transgender-alt:before {
    content: "";
}

.fa-venus-double:before {
    content: "";
}

.fa-mars-double:before {
    content: "";
}

.fa-venus-mars:before {
    content: "";
}

.fa-mars-stroke:before {
    content: "";
}

.fa-mars-stroke-v:before {
    content: "";
}

.fa-mars-stroke-h:before {
    content: "";
}

.fa-neuter:before {
    content: "";
}

.fa-genderless:before {
    content: "";
}

.fa-facebook-official:before {
    content: "";
}

.fa-pinterest-p:before {
    content: "";
}

.fa-whatsapp:before {
    content: "";
}

.fa-server:before {
    content: "";
}

.fa-user-plus:before {
    content: "";
}

.fa-user-times:before {
    content: "";
}

.fa-bed:before,
.fa-hotel:before {
    content: "";
}

.fa-viacoin:before {
    content: "";
}

.fa-train:before {
    content: "";
}

.fa-subway:before {
    content: "";
}

.fa-medium:before {
    content: "";
}

.fa-y-combinator:before,
.fa-yc:before {
    content: "";
}

.fa-optin-monster:before {
    content: "";
}

.fa-opencart:before {
    content: "";
}

.fa-expeditedssl:before {
    content: "";
}

.fa-battery-4:before,
.fa-battery-full:before,
.fa-battery:before {
    content: "";
}

.fa-battery-3:before,
.fa-battery-three-quarters:before {
    content: "";
}

.fa-battery-2:before,
.fa-battery-half:before {
    content: "";
}

.fa-battery-1:before,
.fa-battery-quarter:before {
    content: "";
}

.fa-battery-0:before,
.fa-battery-empty:before {
    content: "";
}

.fa-mouse-pointer:before {
    content: "";
}

.fa-i-cursor:before {
    content: "";
}

.fa-object-group:before {
    content: "";
}

.fa-object-ungroup:before {
    content: "";
}

.fa-sticky-note:before {
    content: "";
}

.fa-sticky-note-o:before {
    content: "";
}

.fa-cc-jcb:before {
    content: "";
}

.fa-cc-diners-club:before {
    content: "";
}

.fa-clone:before {
    content: "";
}

.fa-balance-scale:before {
    content: "";
}

.fa-hourglass-o:before {
    content: "";
}

.fa-hourglass-1:before,
.fa-hourglass-start:before {
    content: "";
}

.fa-hourglass-2:before,
.fa-hourglass-half:before {
    content: "";
}

.fa-hourglass-3:before,
.fa-hourglass-end:before {
    content: "";
}

.fa-hourglass:before {
    content: "";
}

.fa-hand-grab-o:before,
.fa-hand-rock-o:before {
    content: "";
}

.fa-hand-paper-o:before,
.fa-hand-stop-o:before {
    content: "";
}

.fa-hand-scissors-o:before {
    content: "";
}

.fa-hand-lizard-o:before {
    content: "";
}

.fa-hand-spock-o:before {
    content: "";
}

.fa-hand-pointer-o:before {
    content: "";
}

.fa-hand-peace-o:before {
    content: "";
}

.fa-trademark:before {
    content: "";
}

.fa-registered:before {
    content: "";
}

.fa-creative-commons:before {
    content: "";
}

.fa-gg:before {
    content: "";
}

.fa-gg-circle:before {
    content: "";
}

.fa-tripadvisor:before {
    content: "";
}

.fa-odnoklassniki:before {
    content: "";
}

.fa-odnoklassniki-square:before {
    content: "";
}

.fa-get-pocket:before {
    content: "";
}

.fa-wikipedia-w:before {
    content: "";
}

.fa-safari:before {
    content: "";
}

.fa-chrome:before {
    content: "";
}

.fa-firefox:before {
    content: "";
}

.fa-opera:before {
    content: "";
}

.fa-internet-explorer:before {
    content: "";
}

.fa-television:before,
.fa-tv:before {
    content: "";
}

.fa-contao:before {
    content: "";
}

.fa-500px:before {
    content: "";
}

.fa-amazon:before {
    content: "";
}

.fa-calendar-plus-o:before {
    content: "";
}

.fa-calendar-minus-o:before {
    content: "";
}

.fa-calendar-times-o:before {
    content: "";
}

.fa-calendar-check-o:before {
    content: "";
}

.fa-industry:before {
    content: "";
}

.fa-map-pin:before {
    content: "";
}

.fa-map-signs:before {
    content: "";
}

.fa-map-o:before {
    content: "";
}

.fa-map:before {
    content: "";
}

.fa-commenting:before {
    content: "";
}

.fa-commenting-o:before {
    content: "";
}

.fa-houzz:before {
    content: "";
}

.fa-vimeo:before {
    content: "";
}

.fa-black-tie:before {
    content: "";
}

.fa-fonticons:before {
    content: "";
}

.fa-reddit-alien:before {
    content: "";
}

.fa-edge:before {
    content: "";
}

.fa-credit-card-alt:before {
    content: "";
}

.fa-codiepie:before {
    content: "";
}

.fa-modx:before {
    content: "";
}

.fa-fort-awesome:before {
    content: "";
}

.fa-usb:before {
    content: "";
}

.fa-product-hunt:before {
    content: "";
}

.fa-mixcloud:before {
    content: "";
}

.fa-scribd:before {
    content: "";
}

.fa-pause-circle:before {
    content: "";
}

.fa-pause-circle-o:before {
    content: "";
}

.fa-stop-circle:before {
    content: "";
}

.fa-stop-circle-o:before {
    content: "";
}

.fa-shopping-bag:before {
    content: "";
}

.fa-shopping-basket:before {
    content: "";
}

.fa-hashtag:before {
    content: "";
}

.fa-bluetooth:before {
    content: "";
}

.fa-bluetooth-b:before {
    content: "";
}

.fa-percent:before {
    content: "";
}

.fa-gitlab:before {
    content: "";
}

.fa-wpbeginner:before {
    content: "";
}

.fa-wpforms:before {
    content: "";
}

.fa-envira:before {
    content: "";
}

.fa-universal-access:before {
    content: "";
}

.fa-wheelchair-alt:before {
    content: "";
}

.fa-question-circle-o:before {
    content: "";
}

.fa-blind:before {
    content: "";
}

.fa-audio-description:before {
    content: "";
}

.fa-volume-control-phone:before {
    content: "";
}

.fa-braille:before {
    content: "";
}

.fa-assistive-listening-systems:before {
    content: "";
}

.fa-american-sign-language-interpreting:before,
.fa-asl-interpreting:before {
    content: "";
}

.fa-deaf:before,
.fa-deafness:before,
.fa-hard-of-hearing:before {
    content: "";
}

.fa-glide:before {
    content: "";
}

.fa-glide-g:before {
    content: "";
}

.fa-sign-language:before,
.fa-signing:before {
    content: "";
}

.fa-low-vision:before {
    content: "";
}

.fa-viadeo:before {
    content: "";
}

.fa-viadeo-square:before {
    content: "";
}

.fa-snapchat:before {
    content: "";
}

.fa-snapchat-ghost:before {
    content: "";
}

.fa-snapchat-square:before {
    content: "";
}

.fa-pied-piper:before {
    content: "";
}

.fa-first-order:before {
    content: "";
}

.fa-yoast:before {
    content: "";
}

.fa-themeisle:before {
    content: "";
}

.fa-google-plus-circle:before,
.fa-google-plus-official:before {
    content: "";
}

.fa-fa:before,
.fa-font-awesome:before {
    content: "";
}

.fa-handshake-o:before {
    content: "";
}

.fa-envelope-open:before {
    content: "";
}

.fa-envelope-open-o:before {
    content: "";
}

.fa-linode:before {
    content: "";
}

.fa-address-book:before {
    content: "";
}

.fa-address-book-o:before {
    content: "";
}

.fa-address-card:before,
.fa-vcard:before {
    content: "";
}

.fa-address-card-o:before,
.fa-vcard-o:before {
    content: "";
}

.fa-user-circle:before {
    content: "";
}

.fa-user-circle-o:before {
    content: "";
}

.fa-user-o:before {
    content: "";
}

.fa-id-badge:before {
    content: "";
}

.fa-drivers-license:before,
.fa-id-card:before {
    content: "";
}

.fa-drivers-license-o:before,
.fa-id-card-o:before {
    content: "";
}

.fa-quora:before {
    content: "";
}

.fa-free-code-camp:before {
    content: "";
}

.fa-telegram:before {
    content: "";
}

.fa-thermometer-4:before,
.fa-thermometer-full:before,
.fa-thermometer:before {
    content: "";
}

.fa-thermometer-3:before,
.fa-thermometer-three-quarters:before {
    content: "";
}

.fa-thermometer-2:before,
.fa-thermometer-half:before {
    content: "";
}

.fa-thermometer-1:before,
.fa-thermometer-quarter:before {
    content: "";
}

.fa-thermometer-0:before,
.fa-thermometer-empty:before {
    content: "";
}

.fa-shower:before {
    content: "";
}

.fa-bath:before,
.fa-bathtub:before,
.fa-s15:before {
    content: "";
}

.fa-podcast:before {
    content: "";
}

.fa-window-maximize:before {
    content: "";
}

.fa-window-minimize:before {
    content: "";
}

.fa-window-restore:before {
    content: "";
}

.fa-times-rectangle:before,
.fa-window-close:before {
    content: "";
}

.fa-times-rectangle-o:before,
.fa-window-close-o:before {
    content: "";
}

.fa-bandcamp:before {
    content: "";
}

.fa-grav:before {
    content: "";
}

.fa-etsy:before {
    content: "";
}

.fa-imdb:before {
    content: "";
}

.fa-ravelry:before {
    content: "";
}

.fa-eercast:before {
    content: "";
}

.fa-microchip:before {
    content: "";
}

.fa-snowflake-o:before {
    content: "";
}

.fa-superpowers:before {
    content: "";
}

.fa-wpexplorer:before {
    content: "";
}

.fa-meetup:before {
    content: "";
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.ValidationSummary {
    background-color: #fbdada94;
    border-color: #ebccd1;
    color: #a94442;
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid #ffc4c3;
    border-radius: var(--border-radius-sm);
}

    .ValidationSummary ul {
        list-style-type: none;
        padding: 0;
    }

        .ValidationSummary ul li {
            margin-bottom: 8px;
        }

            .ValidationSummary ul li:before {
                content: "\e5cd";
                font-family: "ITG Material Icons";
                font-size: var(--font-16, 16px);
                color: #a94442;
                margin-right: 10px;
                position: relative;
                top: 3px;
                right: -4px;
            }

.SuperStudentNoData,
.ValidationClassNoData {
    padding: 30px;
    display: block;
    color: #777;
    max-width: 700px;
    margin: auto;
    text-align: center;
    border-radius: 5px;
    font-family: "Cairo";
    font-size: var(--font-16, 16px);
}

    .SuperStudentNoData::before,
    .ValidationClassNoData::before {
        content: "";
        width: 308px;
        height: 219px;
        display: block;
        background-image: url("../../material/Images/NoDataFound.png");
        background-size: contain;
        background-repeat: no-repeat;
        margin: auto;
        margin-bottom: 20px;
    }

    .SuperStudentNoData::before {
        width: 268px;
        background-image: url("../../material/Images/SuperStudent.png");
    }

    .SuperStudentNoData:empty,
    .ValidationClassNoData:empty {
        padding: 0px;
    }

        .SuperStudentNoData:empty::before,
        .ValidationClassNoData:empty::before {
            display: none;
            width: auto;
            height: auto;
        }

.sr-only-focusable:active,
.sr-only-focusable:focus {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto;
}

.two-factor-container {
    font-family: "Cairo";
}

.material-icons-outlined[data-icon]::after,
.material-icons[data-icon]::after {
    content: attr(data-icon);
    text-transform: none;
    font-style: normal !important;
}

.material-icons-outlined::after,
.material-icons::after {
    font-size: var(--font-24, 24px);
    font-size: inherit;
}

.Menuhidden .e31_sidebar .menu {
    opacity: 0;
    pointer-events: none;
}

.e31_sidebar .menu {
    opacity: 1;
    transition: opacity linear 0.3s;
    pointer-events: all;
}
/*Custom ToolTip*/
#itg-tooltip-container {
    position: absolute;
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    border-radius: 4px;
    font-size: var(--font-14, 14px);
    pointer-events: none;
    opacity: 0;
    z-index: 9999;
    max-width: 250px;
    transform: translateY(10px);
    transition: opacity 0.2s ease, transform 0.2s ease;
    font-family: "Cairo";
}

    #itg-tooltip-container.active {
        opacity: 1;
        transform: translateY(0);
    }

.tooltip-content {
    padding: 8px 12px;
}

    .tooltip-content:empty {
        padding: 0 0;
    }

.tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
}

#itg-tooltip-container[data-placement="top"] .tooltip-arrow {
    bottom: -8px;
    left: 50%;
    margin-left: -8px;
    border-width: 8px 8px 0;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.8) transparent transparent transparent;
}

#itg-tooltip-container[data-placement="bottom"] .tooltip-arrow {
    top: -8px;
    left: 50%;
    margin-left: -8px;
    border-width: 0 8px 8px;
    border-style: solid;
    border-color: transparent transparent rgba(0, 0, 0, 0.8) transparent;
}

#itg-tooltip-container[data-placement="left"] .tooltip-arrow {
    right: -8px;
    top: 50%;
    margin-top: -8px;
    border-width: 8px 0 8px 8px;
    border-style: solid;
    border-color: transparent transparent transparent rgba(0, 0, 0, 0.8);
}

#itg-tooltip-container[data-placement="right"] .tooltip-arrow {
    left: -8px;
    top: 50%;
    margin-top: -8px;
    border-width: 8px 8px 8px 0;
    border-style: solid;
    border-color: transparent rgba(0, 0, 0, 0.8) transparent transparent;
}
/*Media queries*/

@media screen and (max-width: 1400px) {
    div:has(> div > .feild_data) div:has(> .feild_data) {
        width: calc(33.33333% - 16px);
        max-width: calc(33.33333% - 16px);
    }
}

@media screen and (max-width: 918px) {
    div:has(> div > .feild_data) div:has(> .feild_data) {
        width: calc(50% - 0px);
        max-width: calc(50% - 0px);
    }
}

@media screen and (max-width: 500px) {
    .switchUser .showmenu.open .e32_sidebar {
        left: unset;
    }

    .userinfo {
        width: 100% !important;
        max-width: 240px !important;
    }

    div:has(> div > .feild_data) {
        padding-left: 0;
        padding-right: 0;
    }

        div:has(> div > .feild_data) div:has(> .feild_data) {
            width: 100%;
            max-width: 100%;
            padding-left: 0;
        }

    div.row .multiselect-native-select,
    div.row .input-group,
    div.row .StandardFontPlain,
    div.row .select_date_table,
    div.row .control-dropdownlist,
    div.row .select2-container {
        max-width: 100%;
        margin: 0 !important;
    }

    .calendar {
        position: absolute;
        left: 0 !important;
        right: 0 !important;
        top: 0 !important;
        bottom: 0 !important;
        margin: auto !important;
        width: 100vw !important;
        height: calc(100vh - 237px) !important;
        display: flex !important;
        justify-content: center;
        align-items: center;
        align-self: center;
        align-content: center;
        box-shadow: none !important;
        border-radius: 0 !important;
    }

        .calendar > table {
            width: 80% !important;
            height: 50% !important;
            max-height: 400px;
            box-shadow: 13px 13px 0 rgba(0, 0, 0, 0.11) !important;
        }

        .calendar > div {
            display: none;
        }
}
/*Height media queries*/
@media screen and (max-width: 496px) {
    .logo_title {
        display: none !important;
    }

    .e31_logo {
        border-left: unset !important;
        padding: 0 10px 0 0 !important;
        margin-left: 12px;
        border-right: 1px solid rgba(255, 255, 255, 0.065) !important;
    }

    .e31_header > .e31_headerinfo > .user-info-panel {
        position: absolute;
        margin: 0 !important;
        left: 68px;
    }
}

@media screen and (max-width: 395px) {
    .switchUser .showmenu.open .e32_sidebar {
        left: -40%;
    }
}

@media screen and (max-width: 370px) {
    .switchUser .showmenu.open .e32_sidebar {
        left: -30%;
    }
}

@media screen and (max-width: 340px) {
    .switchUser .showmenu.open .e32_sidebar {
        left: -20%;
    }
}

@media (max-height: 620px) {
    .sidebar_header {
        margin-top: 8px !important;
    }

    .pinned-links {
        margin-top: 8px !important;
    }

    .e31_sidebar .tab-content {
        height: calc(100% - 190px);
    }
}

@media (max-height: 560px) {
    .e31_sidebar .tab-content {
        height: calc(100% - 234px);
        margin-top: 16px;
        margin-bottom: 16px;
    }

    .pinned-links {
        margin-top: 0px !important;
    }
}

@media (max-height: 420px) {
    .sidebar_header {
        margin-top: -2px !important;
    }

    .e31_sidebar .tab-content {
        height: calc(100% - 160px);
        margin-bottom: 8px;
    }
}

.fancy-radio .radio-button-list {
    display: flex;
    gap: 10px;
    padding: 0;
    flex-flow: wrap;
}

    .fancy-radio .radio-button-list label {
        display: flex;
        justify-items: center;
        align-content: center;
        width: fit-content !important;
        padding: 6px 12px 0 12px;
        border: 1px solid var(--border);
        text-wrap: nowrap;
    }

    .fancy-radio .radio-button-list input[type="radio"]:checked + label {
        background: var(--primary-color);
        color: #fff;
        border: none;
    }

    .fancy-radio
    .radio-button-list
    input[type="radio"][disabled="disabled"]:checked + label {
        background: var(--border-light);
        border: 1px solid var(--border);
        color: #555;
    }

    .fancy-radio .radio-button-list label:after,
    .fancy-radio .radio-button-list label:before {
        content: none !important;
    }

div:has(> div > .fancy-radio) div:has(> .fancy-radio) {
    max-width: 800px;
    padding-bottom: 0;
    width: 100%;
}

.table-bordered > tbody > tr > td {
    background: none;
    padding: 0;
}

    .table-bordered > tbody > tr > td > .itg-icons.bullet {
        display: none;
    }

.table-bordered td,
.table-bordered th {
    text-align: right;
    padding: 0 2px;
}

.transperant-border > tbody > tr td {
    border-color: transparent !important;
}

.invalid-feedback[style="display: inline;"] {
    display: inline-block !important;
}
/*Accessiblty setting styles*/
#lbtnShowAccessiblty {
    color: inherit;
    display: flex;
    align-items: center;
    justify-content: center;
}

.settings-tools-container {
    background-color: var(--dark-gray, var(--dark-black, #fff)) !important;
    border-radius: var(--border-radius-sm) !important;
    box-shadow: 0 16px 15px rgba(0, 0, 0, 0.19);
    left: 140px;
    opacity: 1;
    overflow: hidden !important;
    position: fixed;
    top: 74px;
    transition-duration: 0.5s, 0.3s;
    transition-property: height, box-shadow;
    width: 380px;
    z-index: 9999;
}

@media (max-width: 546px) {
    .settings-tools-container {
        width: calc(100% - 32px);
        left: 16px;
    }
}

.settings-tools-container[style*="height: 0"] {
    transition-duration: 0.5s, 0.3s;
    transition-property: height, box-shadow;
}

.settings-tools-container[style*="height: 473px"] {
    transition-duration: 0.5s, 0.3s;
    transition-property: height, box-shadow;
}

.settings-tools-container .__container {
    border-bottom: 1px solid #d1d2d2;
    margin: 0 30px;
}

.settings-tools-buttons {
    align-content: center;
    align-items: center;
    display: flex;
    flex-direction: row;
    justify-content: end;
    margin: 0;
    padding-left: 0 !important;
    text-align: center;
    width: 72%;
    gap: 4px;
}

    .settings-tools-buttons a {
        background-color: #f7f7f7;
        border-radius: 8px;
        color: #606060;
        cursor: pointer;
        height: 32px;
        margin: 0 !important;
        padding: 0;
        text-decoration: none;
        width: 34px;
    }

        .settings-tools-buttons a:first-of-type {
            margin-left: 4px;
        }

        .settings-tools-buttons a i::after {
            font-size: var(--font-20, 20px);
            position: relative;
            top: 6px;
        }

        .settings-tools-buttons a:not([disabled]):hover {
            background: var(--light-primary-color);
            border-color: transparent;
            color: #fff;
            transition: 0.6s;
            border: none;
        }

    .settings-tools-buttons .close-button:not([disabled]):hover {
        background: darkred;
    }

.settings-item {
    background: #f7f7f7;
    border-bottom: 1px solid #d1d2d2;
    display: flex;
    justify-content: space-between;
    margin: 0 -17px;
    padding: 20px 24px;
    padding-left: 12px;
}

.settings-tools-container > .settings-item {
    background-color: transparent !important;
    border-bottom: none;
    margin: 0;
    padding: 14px;
}

.settings-tools-container .__container .settings-item:first-child {
    border-top-left-radius: var(--border-radius-sm);
    border-top-right-radius: var(--border-radius-sm);
    padding-bottom: 14px;
}

.settings-tools-container .__container .settings-item:last-of-type {
    border-bottom: none;
    border-bottom-left-radius: var(--border-radius-sm);
    border-bottom-right-radius: var(--border-radius-sm);
    flex-direction: column;
}

.setting-item {
    display: flex;
    justify-content: flex-end;
}

.setting-title {
    display: flex;
    font-family: "Cairo";
    font-weight: 400;
    font-size: var(--font-15, 15px);
    line-height: 1.4;
    gap: 6px;
    position: relative;
}

.settings-tools-container > .settings-item:first-of-type .setting-title {
    font-family: "Cairo";
    font-weight: bold;
    font-size: var(--font-15, 15px);
    color: #333;
    margin-top: 4px;
    width: 100%;
}

.settings-tools-container
.__container
.settings-item:first-child
.setting-title {
    top: 8px;
}

.setting-title i:after {
    color: var(--active-primary-color);
    font-size: var(--font-22, 22px);
    font-weight: normal;
}

.setting-title i:before {
    color: var(--active-primary-color);
    font-size: var(--font-28, 28px);
    font-weight: normal;
    margin-right: -3px;
}

#darkmode-toggle[type="checkbox"] {
    height: 0;
    visibility: hidden;
    width: 0;
}

    #darkmode-toggle[type="checkbox"] + label::before {
        display: none !important;
    }

    #darkmode-toggle[type="checkbox"] + label {
        align-items: center;
        display: inline-flex;
        justify-content: space-around;
        margin-bottom: 0;
        margin-left: 0;
        height: 30px;
    }

.darkmode-label {
    background: var(--dark-gray, var(--dark-black, #fff));
    border: 0.01rem solid #b9b9b9;
    border-radius: 100px;
    cursor: pointer;
    display: block;
    height: 30px;
    position: relative;
    width: 70px;
}

    .darkmode-label::after {
        background: #f7f7f7;
        border: 0.01rem solid #b9b9b9;
        border-radius: 50%;
        content: "";
        height: 22px;
        left: 3px;
        position: absolute;
        top: 3px;
        transition: 0.3s;
        width: 22px;
    }

#darkmode-toggle:checked + label::after {
    background: var(--dark-gray, var(--dark-black, #fff));
    border: none;
}

#darkmode-toggle:checked + label {
    background: var(--active-primary-color);
}

    #darkmode-toggle:checked + label:after {
        left: calc(100% - 3px);
        transform: translateX(-100%);
    }

#darkmode-toggle[type="checkbox"]:disabled + label::before {
    background: #f1f1f1 !important;
    color: #999 !important;
    cursor: not-allowed;
}

.darkmode-toggle-container {
    align-items: end;
    display: flex;
    justify-content: end;
    padding-bottom: 0;
    text-align: end;
}

.prevent-select {
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

#neverShowAgain {
    cursor: pointer;
    padding-right: 4px;
    color: var(--primary-color) !important;
}

.accessiblity {
    text-decoration: none !important;
    -ms-user-select: none;
    -webkit-user-select: none;
    background: transparent;
    border: 1px solid #ddd;
    border-radius: 30px;
    color: var(--active-primary-color);
    cursor: pointer;
    font-family: "Cairo";
    font-weight: 400;
    font-size: var(--font-12, 12px);
    padding-bottom: 4px;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 6px;
    padding-bottom: 7px;
    text-align: center;
    transition: background 0.3s ease-in-out;
    user-select: none;
    white-space: nowrap;
    width: 76px !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .accessiblity:last-of-type {
        margin-right: 2px;
    }

    .accessiblity[disabled="disabled"] {
        background: #f1f1f1 !important;
        color: #999 !important;
        cursor: not-allowed;
    }

    .accessiblity:first-child {
        margin-left: 2px;
    }

.font-size-xxl .accessiblity,
.font-size-xl .accessiblity,
.font-size-l .accessiblity {
    white-space: pre-line;
    padding: 4px 10px !important;
}

.accessiblity:hover {
    background: #f2f2f2;
    transition: background-color 0.3s ease-in-out;
}

.accessiblity[disabled="disabled"]:hover {
    background: #f1f1f1 !important;
    color: #999 !important;
}

.accessiblity.active {
    background: var(--active-primary-color);
    color: #ffffff;
}

.font-button {
    border: 0.04rem solid #dbdcdc;
    border-radius: 50%;
    cursor: pointer;
    height: 40px;
    width: 40px;
}

.tow-sides-form .form-group .form-label:not(.form-input-container .form-label) {
    padding-left: 8px;
}

.font-button:nth-of-type(2) {
    margin: 0 4px;
}

    .font-button:nth-of-type(2) i:after {
        font-size: var(--font-18, 18px);
        right: 10px;
        top: 9px;
    }

.font-button i:before,
.font-button i:after {
    color: #000;
    font-size: var(--font-20, 20px);
    position: relative;
    right: 9px;
    top: 9px;
}

.font-button:nth-child(2) i:after {
    font-size: var(--font-20, 20px);
    right: 9px;
    top: 8px;
}

.font-button:nth-child(2) i:before {
    font-size: var(--font-24, 24px);
    right: 7px;
    top: 7px;
}

.font-button.active {
    background: rgba(var(--primary-opacaty-color), 0.1);
    color: #fff;
}

.font-button:hover {
    background: #f2f2f2;
}

.font-button[disabled="disabled"] {
    background: #f1f1f1 !important;
    color: #999 !important;
    cursor: not-allowed;
}

.color-box {
    background-color: var(--primary-color);
    border-radius: 7px;
    cursor: pointer;
    display: inline-block;
    height: 28px;
    margin-left: 7px;
    margin-top: 16px;
    width: 28px;
}

    .color-box:last-of-type {
        margin-left: 0;
    }

    .color-box:hover,
    .color-box:focus {
        filter: brightness(0.8);
    }

    .color-box.selected {
        box-shadow: 0 0 0 2px orange;
    }

    .color-box.lightblue {
        background-image: linear-gradient(to right, #2986cc 50%, #94c2e5 50%);
    }

    .color-box.blue {
        background-image: linear-gradient(to right, #086271 50%, #40a4b9 50%);
    }

    .color-box.darkblue {
        background-image: linear-gradient(to right, #192655 50%, #58abff 50%);
    }

    .color-box.purple {
        background-image: linear-gradient(to right, #7846a8 50%, #a17db3 50%);
    }

    .color-box.pink {
        background-image: linear-gradient(to right, #d56073 50%, #eb7d8d 50%);
    }

    .color-box.caramel {
        background-image: linear-gradient(to right, #e69138 50%, #f0bd87 50%);
    }

    .color-box.darkred {
        background-image: linear-gradient(to right, #7a1322 50%, #bb4355 50%);
    }

    .color-box.darkyellow {
        background-image: linear-gradient(to right, #665628 50%, #ceb364 50%);
    }

    .color-box.green {
        background-image: linear-gradient(to right, #018075 50%, #bfe7e3 50%);
    }

.sticky-side-container {
    align-content: center;
    align-items: center;
    display: flex;
    flex-direction: row;
    left: -159px;
    position: fixed;
    text-align: center;
    top: 255px;
    transform: rotate(90deg);
    transition: all 0.3s ease-in-out;
    width: 275px;
    z-index: 43;
}

    .sticky-side-container a {
        -ms-user-select: none;
        -webkit-user-select: none;
        background-color: rgba(var(--primary-opacaty-color), 0.5);
        border-radius: 18px;
        bottom: 1px;
        color: #fff;
        cursor: pointer !important;
        font-family: "Cairo";
        font-weight: bold;
        font-size: var(--font-14, 14px);
        height: 100px;
        padding: 5px 6px;
        padding-top: 3px;
        position: relative;
        text-decoration: none;
        transition: all 0.1s ease-in;
        user-select: none;
        white-space: nowrap;
        width: 44%;
        z-index: 999;
    }

        .sticky-side-container a:first-child {
            margin-left: 3px;
        }

        .sticky-side-container a:hover,
        .sticky-side-container a:focus {
            background-color: var(--hover-primary-color);
            bottom: 11px;
            color: navajowhite;
            font-size: var(--font-16, 16px);
            padding-top: 9px;
            transition: all 0.1s ease-out;
        }

body:has( .ModalPopupExtender:not([hidden]):not([style*="display: none"]):not( [style*="display:none"] ) ) {
    overflow: hidden;
}

.bootstrap-filestyle {
    width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
}

    .bootstrap-filestyle input.StandardFontPlain.inputFileStyle[type="text"] {
        margin-left: 0 !important;
        width: calc(100% - 78px) !important;
        border-radius: var(--border-radius-sm) !important;
    }

    .bootstrap-filestyle input + .fileStyle {
        border-radius: var(--border-radius-sm) !important;
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0 8px 0 0 !important;
    }

.table-Style table td .inputFileStyle {
    margin-bottom: 0 !important;
}

.table-Style table td .fileStyle {
    margin: 0 4px 0 0 !important;
}

    .table-Style table td .fileStyle label {
        margin-bottom: -2px !important;
    }

input[type="image"] {
    padding: 4px;
    height: 24px;
    width: 24px;
}

.pagebreadcrumbs.shimmer:after {
    background: none;
}

img[src="../images/Common/False.png"] {
    border-radius: 50% !important;
    filter: hue-rotate(180deg) !important;
}

img[src="../images/Common/True.png"] {
    border-radius: 50% !important;
}

.table-bordered > tbody > tr > td.MailHeader {
    vertical-align: middle;
}

.flatpickr-calendar.open {
    z-index: 999999 !important;
}