#login-v2
{
    background: url(../../images/backgrounds/dark-material-bg.jpg) no-repeat;
    background-size: 100% 100%;
}

.module-parent
{
    background-color: lightblue;
}

.ul-error
{
    list-style: none;
}

.min-w-200{
    min-width: 250px !important;
}

.max-w-300{
    max-width: 300px !important;
}

.label
{
    text-align: right;
    font-weight: bold;
    width: 100px;
    color: #303030;
}

.ui-autocomplete {
    position: absolute;
    cursor: default;
    z-index: 1060 !important;
}

.address td, .address th
{
    padding: .25rem !important;
    margin-bottom: .25rem !important;
}

.postal_address td, .postal_address th
{
    padding: .25rem !important;
    margin-bottom: .25rem !important;
}

input[type="text"]:disabled
{
    background-color: #e9ecef !important;
    border-radius: 0.25rem;
}

.typical-link
{
    color: blue !important;
    text-decoration: underline !important;
    cursor: pointer;
}

.text-danger
{
    color: red;
}

@media (min-width: 1200px)
{
    .container-list
    {
        max-width: 100% !important;
    }

    .table-responsive
    {
        display: inline-table !important;
    }
}

.filters
{
    margin: 10px 0 10px 0;
}

.filters div
{
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    margin-bottom: 0;
}

.content-heading
{
    line-height: 30px;
    font-weight: 400;
    margin-bottom: 20px;
    margin-top: 20px;
    position: relative;
}

.p-t-7
{
    padding-top: 7px;
}

.doc .example > .source-preview-wrapper
{
    overflow: visible;
}

#profile .page-header
{
    height: 12rem !important;
    min-height: 1rem !important;
}

.img-circle
{
    border-radius: 50% !important;
}

.update_button
{
    cursor: pointer;
    position: absolute;
    right: 33%;
    bottom: 30px;
    transition: .5s;
    font-size: 16px;
    background-color: white;
    color: black;
    padding: 2px;
    border-radius: 50%;
    z-index: 9;
}

.update_button:hover
{
    color: white;
    background-color: black;
}

.box-shadow
{
    box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2),
    0px 1px 1px 0px rgba(0, 0, 0, 0.14),
    0px 1px 3px 0px rgba(0, 0, 0, 0.12);

    -webkit-box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2),
    0px 1px 1px 0px rgba(0, 0, 0, 0.14),
    0px 1px 3px 0px rgba(0, 0, 0, 0.12);
}

.center-content
{
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

/*Change the popup notification*/
.ui-pnotify-icon > span
{
    padding-top: .3rem !important;
}

[ui-pnotify] .pnotify-material.ui-pnotify-container
{
    padding: 10px !important;
    width: 320px !important;
    min-height: 16px !important;
}

[ui-pnotify] .pnotify-material .ui-pnotify-title
{
    margin-bottom: 10px !important;
}

#footer
{
    height: 4.4rem !important;
    min-height: 4.4rem !important;
}

.doc > .page-header
{
    height: 6.5rem !important;
}

.p-s
{
    padding: 1.4rem 2.4rem 2.4rem 2.4rem !important;
}

.shortcut-icons
{
    font-size: 5.8rem !important;
    line-height: 6.2rem !important;
}

.link-primary
{
    cursor: pointer;
    text-decoration: none !important;
}

.p-shortcut-row
{
    padding: 1.2rem 3.2rem 1.2rem 3.2rem !important;
}

.delete-icon-rounded
{
    padding: 0px;
    background: #f44336;
    color: white !important;
    border-radius: 50%;
    font-size: 2rem !important;
    margin-left: 5px;
}

.add-icon-rounded
{
    background: #009688;
    color: white !important;
    border-radius: 50%;
    font-size: 2rem !important;
    height: 2rem !important;
    line-height: 2rem !important;
    width: 2rem !important;
}

.hover
{
    cursor: pointer;
}

.toggle-password
{
    position: fixed;
    bottom: 0;
    right: 0;
}

.dropdown-menu-scroll
{
    overflow-x: hidden;
    max-height: 100px;
}

.dropdown-item
{
    cursor: pointer !important;
}

.header-icon-padding
{
    padding: 0px !important;
}

.v-align-sub
{
    vertical-align: sub;
}

.typical-notification-link
{
    text-decoration: underline !important;
    cursor: pointer;
}

#reset-password .form-wrapper .logo
{
    margin: 1rem auto;
}

.h-400
{
    height: 400px;
}

.h-600
{
    height: 600px !important;
}

.border-bottom
{
    border-bottom: 1px solid rgba(0, 0, 0, 0.12) !important;
}

.news-fit-content
{
    height: fit-content;
}

.w-100px
{
    width: 100px;
}

.w-200px
{
    width: 200px;
}

.stat-title
{
    font-size: 3.5rem;
    line-height: 7.2rem
}

.text-purple
{
    color: #6F42C1 !important;
}

.bg-bluegray
{
    background-color: #595c65 !important;
}

.w-750px
{
    width: 750px;
}

.w-auto
{
    width: auto !important;
}

.notification-msg-avatar
{
    width: 40px;
    border-radius: 50%;
}

.font-15
{
    font-size: 15px !important;
}

.w-fit-content
{
    width: fit-content !important;
}

.album_img img
{
    /*width: 200px;
    margin-left: 25px;
    margin-top: 20px;*/
    /*width: 200px;
    height: 120px;
    margin-left: 25px;
    margin-top: 20px;
    object-fit: cover;*/
    width: 176px;
    height: 120px;
    margin-left: 18px;
    margin-top: 20px;
    object-fit: cover;
}

.delete-btn
{
    width: 2rem !important;
    min-width: 2rem !important;
    height: 2rem !important;
    min-height: 2rem !important;
}

.upload-btn-w
{
    min-width: 3.8rem !important;
}

.font-20
{
    font-size: 20px !important;
}

.font-25
{
    font-size: 25px !important;
}

@media (max-width: 576px)
{
    .d-test-env, .d-staff-class, .d-school-name
    {
        display: none !important;
    }
}

@media (min-width: 768px)
{
    #step-name
    {
        display: block !important;
        font-size: 15px !important;
    }

    #sm-address
    {
        visibility: hidden !important;
        display: none !important;
    }

    #lg-address
    {
        visibility: visible !important;
    }
}

@media (max-width: 768px)
{
    .d-test-env, .d-app-logo, #step-name
    {
        display: none !important;
    }

    #msform
    {
        width: 100% !important;
    }

    #msform fieldset,
    .fixed-progressbar
    {
        width: 95% !important;
    }

    .input-w-auto,
    .width-auto
    {
        width: auto !important;
    }

    #sm-address
    {
        visibility: visible !important;

    }

    #lg-address
    {
        visibility: hidden !important;
        display: none !important;
    }
}

.test-env
{
    font-size: 14px;
    margin-left: 1.2rem;
    margin-top: .25rem;
}

.shortcut-icon a:hover
{
    text-decoration: none;
}

.s-icon
{
    font-size: 20px;
    margin-right: .5rem !important;
    color: #bababa;
}

.text-image
{
    position: relative;
    text-align: center;
    color: #fff;
    width: 100%;
}

.bottom-left
{
    font-size: 18px;
    position: absolute;
    bottom: 5px;
    left: 17px;
}

.top-left
{
    position: absolute;;
    top: 5px;
    left: 17px;
    font-size: 15px;
}

.top-right
{
    position: absolute;
    top: 5px;
    right: 8px;
    font-size: 15px;
}

.card-bg
{
    background-color: lightgray;
    border-radius: 5px;
}

.comment-items
{
    margin-top: 30px;
}

.comment
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 20px;
}

.comment-wrap
{
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    font-size: 15px;
    padding-top: 4px;
}

.comment-name
{
    font-weight: 500;
    display: inline-block;
    margin-left: 6px;
    font-size: 15px !important;
}

.comment-date
{
    color: #939daa;
    margin-left: 3px;
    font-size: 13px;
}

.comment-text
{
    color: #000;
    margin-left: 6px;
    width: 19em;
}

.comment_img
{
    height: 3.0em;
    margin-top: 6px;
    margin-left: 7px;
}

.edit_button
{
    cursor: pointer;
    position: absolute;
    right: 25%;
    bottom: 1%;
    transition: .5s;
    font-size: 12px;
    background-color: white;
    color: black;
    padding: 1px 1px;
    border-radius: 50%;
    z-index: 9;
}

.edit_button:hover
{
    color: white;
    background-color: black;
}

.scroll
{
    height: 52vh;
    overflow-x: hidden;
    overflow-y: scroll;
}

/* width */
::-webkit-scrollbar
{
    width: 5px;
    height: 5px;
}

/* Track */
::-webkit-scrollbar-track
{
    box-shadow: inset 0 0 5px grey;
    border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb
{
    background: grey;
    border-radius: 20px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover
{
    background: darkgrey;
}

.calendar-btn
{
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.bg-old-content
{
    background-color: #ededed !important;
}

.bg-modal-title
{
    background-color: #f1f1f1 !important;
}

.font-10
{
    font-size: 10px
}

.badge-lightgrey
{
    color: #fff;
    background-color: #575b5f;
}

.font-18
{
    font-size: 18px !important;
}

.text-blue
{
    color: #0a6cb9 !important
}

@media only screen and (max-width: 768px)
{
    .small-profile-text
    {
        display: none;
    }

    .small-profile-pic
    {
        width: 70px !important;
    }

    .edit_button
    {
        right: 44%;
    }
}

@media only screen and (max-width: 1024px)
{
    .edit_button
    {
        right: 44%;
    }

    .small-profile-pic
    {
        width: 60px !important;
    }
}

@media only screen and (max-width: 425px)
{
    .edit_button
    {
        right: 39%;
    }
}

@media only screen and (max-width: 320px)
{
    .edit_button
    {
        right: 34%;
    }
}

.comment-heading
{
    color: #6C757D;
    margin-top: 10px;
    font-size: 14px !important;
}

.profile-class
{
    color: #009688;
    margin-left: 1.6em;
    font-weight: 500;
    margin-bottom: 0px;
}

.profile-class-span
{
    color: #3C4252;
    margin-left: 2px;
}

.staff-profile-heading
{
    margin-left: 1.6em;
    font-weight: 500;
    color: #212529;
}

.font-13
{
    font-size: 13px !important;
}

.p-section
{
    padding: 2.4rem 2.4rem 0rem 2.4rem !important;
}

.p-l-8
{
    padding-left: 8px !important;
}

.w-140
{
    width: 140px;
}

.album-name
{
    font-weight: 500;
    color: #393838 !important;
    margin-bottom: 0 !important;
    margin-top: .8rem !important;
}

.lp-subject
{
    font-size: 15px;
    color: #343A40;
    font-weight: bold;
    padding-left: 1.6rem;
    padding-top: 1.6rem;
}

.lp-desc
{
    padding-left: 1.6rem;
    padding-bottom: 1.6rem;
    padding-right: 1.6rem;
    color: #343A40
}

.lp-card-bg
{
    background-color: #f6f6f6;
}

.quiz-card-bg
{
    background-color: #343A40;
}

.quiz-card-text
{
    color: #EDE9E5;
}

.colored_box
{
    height: 20px;
    width: 20px;
    display: inline-block;
    margin: auto;
    border: 1px solid black;
}

.quiz_user_text
{
    text-decoration: none;
}

.quiz_question_mark
{
    float: right;
}

.quiz_card_width
{
    width: 350px;
}

#toggle-text
{
    max-width: 400px;
    margin: 50px auto;
    text-align: center;
}

.toggle-text-content.span
{
    display: none;
}

.toggle-text-link
{
    display: block;
    margin: 20px 0;
}

.quiz-card-width
{
    width: 500px !important;
}

.quiz_name_height
{
    height: 30px !important;
}

.quiz_span_font_size
{
    font-size: 12px;

    margin-top: 7px !important;
}

.quiz-card-description
{
    margin-top: 40px !important;
}

.timer_div
{
    z-index: 1;
}

.duration_format1
{
    box-shadow: 0 0 3px #000;
    color: #fff;
    background-color: #009688;
}

.duration_format2
{
    box-shadow: 0 0 3px #000;
    color: #fff;
    background-color: #ED443C;
}


.checkmark
{
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: block;
    stroke-width: 2;
    stroke: white;
    stroke-miterlimit: 10;
    box-shadow: inset 0px 0px 0px #29B678;
    animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}

.checkmark__circle
{
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke: #29B678;
    fill: none;
    animation: stroke .6s cubic-bezier(0.650, 0.000, 0.450, 1.000) forwards;
}

.checkmark__check
{
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke .3s cubic-bezier(0.650, 0.000, 0.450, 1.000) .8s forwards;
}

@keyframes stroke
{
    100%
    {
        stroke-dashoffset: 0;
    }
}

@keyframes scale
{
    0%, 100%
    {
        transform: none;
    }
    50%
    {
        transform: scale3d(1.1, 1.1, 1);
    }
}

@keyframes fill
{
    100%
    {
        box-shadow: inset 0px 0px 0px 30px #29B678;
    }
}

.modal_success_heading
{
    color: #29B678;
}

.question_track_answered
{
    background-color: green;
}

.question_track_not_answered
{
    background-color: red;
}

.foo
{
    width: 20px;
    height: 20px;
    margin: 5px;
    border: 1px solid rgba(0, 0, 0, .2);
}

/*Preloader*/
.preloader
{
    width: 100%;
    height: 100%;
    top: 0px;
    position: fixed;
    z-index: 99999;
    background: #fff;
}

.cssload-speeding-wheel
{
    position: absolute;
    top: calc(50% - 3.5px);
    left: calc(50% - 3.5px);
}

.loader,
.loader__figure
{
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.loader
{
    overflow: visible;
    padding-top: 2em;
    height: 0;
    width: 2em;
}

.loader__figure
{
    height: 0;
    width: 0;
    box-sizing: border-box;
    border: 0 solid #1976d2;
    border-radius: 50%;
    -webkit-animation: loader-figure 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
    -moz-animation: loader-figure 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
    animation: loader-figure 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
}

.loader__label
{
    float: left;
    margin-left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    margin: 0.5em 0 0 50%;
    font-size: 0.875em;
    letter-spacing: 0.1em;
    line-height: 1.5em;
    color: #1976d2;
    white-space: nowrap;
    -webkit-animation: loader-label 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
    -moz-animation: loader-label 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
    animation: loader-label 1.15s infinite cubic-bezier(0.215, 0.61, 0.355, 1);
}

.change_modal_body_layout
{
    position: relative;
    height: 250px;
}

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

@-webkit-keyframes loader-figure
{
    0%
    {
        height: 0;
        width: 0;
        background-color: #1976d2;
    }
    29%
    {
        background-color: #1976d2;
    }
    30%
    {
        height: 2em;
        width: 2em;
        background-color: transparent;
        border-width: 1em;
        opacity: 1;
    }
    100%
    {
        height: 2em;
        width: 2em;
        border-width: 0;
        opacity: 0;
        background-color: transparent;
    }
}

@-moz-keyframes loader-figure
{
    0%
    {
        height: 0;
        width: 0;
        background-color: #1976d2;
    }
    29%
    {
        background-color: #1976d2;
    }
    30%
    {
        height: 2em;
        width: 2em;
        background-color: transparent;
        border-width: 1em;
        opacity: 1;
    }
    100%
    {
        height: 2em;
        width: 2em;
        border-width: 0;
        opacity: 0;
        background-color: transparent;
    }
}

@keyframes loader-figure
{
    0%
    {
        height: 0;
        width: 0;
        background-color: #1976d2;
    }
    29%
    {
        background-color: #1976d2;
    }
    30%
    {
        height: 2em;
        width: 2em;
        background-color: transparent;
        border-width: 1em;
        opacity: 1;
    }
    100%
    {
        height: 2em;
        width: 2em;
        border-width: 0;
        opacity: 0;
        background-color: transparent;
    }
}

@-webkit-keyframes loader-label
{
    0%
    {
        opacity: 0.25;
    }
    30%
    {
        opacity: 1;
    }
    100%
    {
        opacity: 0.25;
    }
}

@-moz-keyframes loader-label
{
    0%
    {
        opacity: 0.25;
    }
    30%
    {
        opacity: 1;
    }
    100%
    {
        opacity: 0.25;
    }
}

@keyframes loader-label
{
    0%
    {
        opacity: 0.25;
    }
    30%
    {
        opacity: 1;
    }
    100%
    {
        opacity: 0.25;
    }
}

.update_button_square_camera
{
    cursor: pointer;
    position: absolute;
    /*right: -4%;*/
    right: 66%;
    bottom: 15px;
    transition: .5s;
    font-size: 20px;
    background-color: white;
    color: black;
    padding: 0px;
    border-radius: 50%;
    z-index: 9;
}

.update_button_square
{
    cursor: pointer;
    position: absolute;
    /*right: -4%;*/
    right: 25%;
    bottom: 17px;
    transition: .5s;
    font-size: 20px;
    background-color: white;
    color: black;
    padding: 2px;
    border-radius: 50%;
    z-index: 9;
}

.camera_margin
{
    margin-left: 9rem !important;
}

.comment_name
{
    font-weight: 600;
    display: inline-block;
    margin-left: 5px;
    font-size: 15px !important;
}

.comment_date
{
    color: #939daa;
    font-size: 13px;
}

.comment_text
{
    color: #000;
    margin-left: 5px !important;
    margin-right: 20px !important;
    text-align: justify !important;
}

.comment_like_dislike
{
    font-size: 1.8rem;
    cursor: pointer;
}

.like
{
    color: #3ac912;
}

.dislike
{
    color: #e41523;
}

.w-150px
{
    width: 150px;
}

.top-20px
{
    top: 20px;
}

.bottom-4px
{
    bottom: 4px;
}

.h-350px
{
    height: 350px;
}

@-webkit-keyframes loader-label
{
    0%
    {
        opacity: 0.25;
    }
    30%
    {
        opacity: 1;
    }
    100%
    {
        opacity: 0.25;
    }
}

@-moz-keyframes loader-label
{
    0%
    {
        opacity: 0.25;
    }
    30%
    {
        opacity: 1;
    }
    100%
    {
        opacity: 0.25;
    }
}

@keyframes loader-label
{
    0%
    {
        opacity: 0.25;
    }
    30%
    {
        opacity: 1;
    }
    100%
    {
        opacity: 0.25;
    }
}

.font-11
{
    font-size: 11px !important;
}

.w-600px
{
    width: 600px;
}

.font-12
{
    font-size: 12px
}

.thead--is-fixed{
    display: table;
    position: fixed;
    top: 150px;
  }

.table-y-scroll
{
    height: fit-content;
    overflow-y: scroll;
}

.table-x-scroll
{
    overflow-x: scroll;
}

.table-b
{
    border: 1px solid black;
}

.table-b tr th
{
    border: 1px solid black;
}

.table-b tr td
{
    border: 1px solid black;
}

.min-w-45
{
    min-width: 45px;
}

.font-weight-500
{
    font-weight: 500;
}

.custom-img
{
    opacity: 0.3;
}

.custom-selected-img
{
    opacity: 1;
}

#reset-password .form-wrapper
{
    width: 40rem;
    max-width: 40rem;
}

/*Show password icon styling*/
.show-hide-password
{
    float: right;
    margin-top: -25px;
    z-index: 2;
}

.table-border-bottom
{
    border-bottom: #d3d3d3 1px solid;
}

.goog-logo-link
{
    display: none !important;
}

.goog-te-gadget
{
    color: transparent !important;
}

.goog-te-banner-frame.skiptranslate
{
    display: none !important;
}

body
{
    top: 0 !important;
}

.numberCircle
{
    background: #e3e3e3;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    color: #6e6e6e;
    display: inline-block;
    line-height: 30px;
    margin: 2px;
    text-align: center;
    width: 30px;
}

.quiz-paginate-scrollable
{
    height: 22vh;
    overflow-y: scroll;
    overflow-x: hidden;

}

.quiz-paginate-scrollable::-webkit-scrollbar
{
    width: 5px;
}

.quiz-paginate-scrollable::-webkit-scrollbar-button
{
    width: 0;
    height: 0;
}

.quiz-paginate-scrollable::-webkit-scrollbar-track-piece
{
    color: transparent;
}

.quiz-paginate-scrollable::-webkit-scrollbar-thumb
{
    background-color: #888ea8;
}

.quiz-paginate-scrollable::-webkit-scrollbar-corner
{
    background-color: transparent;
}

.quiz-pointor
{
    cursor: pointer;
}

.card-quiz-height
{
    height: 80vh;
}

.bg-active
{
    background-color: #1b55e2;
}

.parentDiv
{
    width: 30%;
    height: 50%;
}

.videoInsert
{
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: inline-block;
}

.video_heading
{
    margin-bottom: -20px;
    height: 10px;
}

.table_border tr, .table_border th, .table_border td
{
    /*border: 1px solid #000;*/
    border: 1px solid rgb(0 0 0 / 54%);
}

.fc-left h2
{
    font-size: 18px;
}

@media (max-width: 539px)
{
    .s_class_section, .playstore, #content_text_size
    {
        display: none !important;
    }

    .dash-stud-info, .playstore-icon
    {
        display: block !important;
    }

    .footer-data
    {
        text-align: center !important;
    }

    .footer-data-p
    {
        margin-top: 0px !important;
    }

    .d-org-logo img
    {
        height: 30px !important;
    }

    .org-logo-div
    {
        justify-content: center !important;
        -webkit-justify-content: center !important;
    }

    .icon-small
    {
        font-size: 16px !important;
    }

    .org-logo-col
    {
        max-width: 105px !important;
    }

    #reset-password .form-wrapper
    {
        width: 30rem;
        max-width: 30rem;
    }

    .footer-data-p
    {
        font-size: 11px;
        padding-top: 5px !important;
    }
}

@media (min-width: 540px)
{
    .dash-stud-info, .playstore-icon
    {
        display: none !important;
    }
}

@media (max-width: 590px)
{
    .width-auto
    {
        width: auto !important;
    }
}

.tt-table th
{
    white-space: nowrap;
}

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

@media (max-width: 390px)
{
    .upload-photo
    {
        width: inherit !important;
    }
}

.avatar
{
    width: 3rem !important;
    min-width: 3rem !important;
    height: 3rem !important;
    line-height: 3rem !important;
}

@media (max-width: 767px)
{
    .news-content-w
    {
        width: 500px !important;
    }

    .leave-reason-w
    {
        width: 300px;
    }
    .leave-notes-w
    {
        width: 300px;
    }
}

/* Popup container - can be anything you want */
.popup
{
    position: relative;
    display: inline-block;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* The actual popup */
.popup .popuptext
{
    visibility: hidden;
    width: 350px;
    background-color: #555;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 8px 0;
    position: absolute;
    z-index: 1;
    top: 125%;
    left: -57px;
    margin-left: -80px;
}

/* Popup arrow */
.popup .popuptext::after
{
    content: "";
    position: absolute;
    bottom: 100%;
    left: 42%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #555 transparent;
}

/* Toggle this class - hide and show the popup */
.popup .show
{
    visibility: visible;
    -webkit-animation: fadeIn 1s;
    animation: fadeIn 1s;
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn
{
    from
    {
        opacity: 0;
    }
    to
    {
        opacity: 1;
    }
}

@keyframes fadeIn
{
    from
    {
        opacity: 0;
    }
    to
    {
        opacity: 1;
    }
}

/*feedback/report bug options*/
.icon-bar
{
    position: fixed;
    top: 80%;
    right: 0%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    margin-right: 23px;
    z-index: 99999;
}

.icon-bar a
{
    display: block;
    text-align: center;
    padding: 15px 35px 15px 10px;
    transition: all 0.3s ease;
    color: white;
    font-size: 20px;
}

.icon-bar a:hover
{
    background-color: #000;
}

.feedback
{
    background: #3B5998;
    color: white;
}

.report-bug
{
    background: #e40f19;
    color: white;
}

.modal.right.fade .modal-dialog
{
    right: -0px;
    -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
    -o-transition: opacity 0.3s linear, right 0.3s ease-out;
    transition: opacity 0.3s linear, right 0.3s ease-out;
}

.modal.right.fade.in .modal-dialog
{
    right: 0%;
}

.modal.right .modal-dialog
{
    position: fixed;
    margin: auto;
    width: 320px;
    height: 100%;
    -webkit-transform: translate3d(0%, 0, 0);
    -ms-transform: translate3d(0%, 0, 0);
    -o-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
    margin-top: 176px;
    margin-right: 13px;
}

.v-middle
{
    vertical-align: middle !important;
}

.pre-wrap
{
    white-space: pre-wrap !important
}

.h-30px
{
    height: 30px !important;
}

.h-3rem
{
    height: 3rem !important;
}

@media (max-width: 1159px)
{
    .shortcut-icon
    {
        display: none !important;
    }

    .mob-shortcut
    {
        display: block !important;
    }
}

@media (min-width: 1160px)
{
    .mob-shortcut
    {
        display: none !important;
    }
}

@media (max-width: 751px) and (min-width: 577px)
{
    .d-staff-class, .d-school-name
    {
        display: none !important;
    }
}

@media (max-width: 991px)
{
    .d-test-env, .d-app-logo
    {
        display: none !important;
    }

    .d-org-logo img
    {
        height: 35px;
        margin-top: 5px;
    }
}

@media (max-width: 355px)
{
    .left-icons
    {
        display: none !important;
    }
}

@media (min-width: 356px)
{
    .left-icons
    {
        display: block !important;
    }
}

/*Switch*/
.switch
{
    position: relative;
    display: inline-block;
    width: 40px;
    height: 20px;
}

.switch input
{
    opacity: 0;
    width: 0;
    height: 0;
}

.slider
{
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before
{
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 1px;
    bottom: 1px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .slider
{
    background-color: #2196F3;
}

input:focus + .slider
{
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before
{
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
}

.slider.round
{
    border-radius: 20px;
}

.slider.round:before
{
    border-radius: 50%;
}

/*End Switch*/

/*system message slider*/
.msg-slideshow-container
{
    max-width: 1000px;
    position: relative;
    margin: auto;
}

.arrow-prev, .arrow-next
{
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    margin-top: -22px;
    color: white;
    font-weight: bold;
    font-size: 18px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
}

.arrow-next
{
    right: 0;
    border-radius: 3px 0 0 3px;
}

.msg-dot
{
    height: 10px;
    width: 10px;
    margin: 0 2px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.active-dot, .msg-dot:hover
{
    background-color: #717171;
}

.msg-fade
{
    -webkit-animation-name: fade;
    -webkit-animation-duration: 1.5s;
    animation-name: fade;
    animation-duration: 1.5s;
}

@-webkit-keyframes msg-fade
{
    from
    {
        opacity: .4
    }
    to
    {
        opacity: 1
    }
}

@keyframes msg-fade
{
    from
    {
        opacity: .4
    }
    to
    {
        opacity: 1
    }
}

/*end system message slider*/

/*@media (max-width: 1550px)
{
    .tt-table
    {
        display: inline-block !important;
    }
}*/

.label-color
{
    color: rgba(0, 0, 0, 0.38);
}

@media (max-width: 1199px) and (min-width: 555px)
{
    .instance-table
    {
        display: inline-table !important;
    }
}

@media (max-width: 1215px)
{
    .easy-access-font
    {
        font-size: 1.6rem !important;
    }

    .easy-access-font i
    {
        font-size: 1.8rem !important;
        padding-right: .5rem !important;
    }

    .card-body-p2
    {
        padding: .9rem !important;
    }
}

@media (max-width: 1024px) and (min-width: 992px)
{
    .staff-attend-font
    {
        font-size: 1.4rem !important;
    }
}

.bg-usage-report
{
    background-color: #00cc7a !important;
}

.usage-report td
{
    padding: 0.7rem 1rem !important;
}

@media (max-width: 1452px)
{
    .lang-div
    {
        display: none !important;
    }
}

@media (min-width: 1453px)
{
    .lang-div
    {
        display: block !important;
    }
}

.faq
{
    padding: 0;
}

.faq .content
{
    padding: 60px 100px 0 100px;
}

.faq .content p
{
    font-size: 15px;
    color: #848484;
}

.faq .accordion-list ul
{
    padding: 0;
    list-style: none;
}

.faq .accordion-list li + li
{
    margin-top: 15px;
}

.faq .accordion-list li
{
    padding: 15px;
    background: #fefefe;
    box-shadow: 0px 5px 90px 0px rgba(110, 123, 131, 0.1);
    border-radius: 4px;
}

.faq .accordion-list a
{
    display: block;
    position: relative;
    outline: none;
    text-decoration: none;
}

.round-num
{
    line-height: 40px;
    width: 35px !important;
    height: 35px !important;
    line-height: 41px;
    color: #fff;
    width: 50px;
    height: 50px;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    border-radius: 100%;
    background: #01c0c8;
}

/*form styles*/
#msform
{
    width: 90%;
    margin: 10px auto;
    text-align: center;
    position: relative;
    height: 100%;

    /*overflow-y: auto;*/
}

#msform fieldset
{
    background: white;
    border: 0 none;
    border-radius: 3px;
    box-shadow: 0 0 15px 1px rgb(0 0 0 / 8%);
    padding: 20px;
    box-sizing: border-box;
    /*width: 90%;*/
    width: 60%;
    margin: 0 auto;

    /*stacking fieldsets above each other*/
    position: relative;
}

/*Hide all except first fieldset*/
#msform fieldset:not(:first-of-type)
{
    display: none;
}

/*inputs*/
#msform input, #msform textarea
{
    padding: 2px;
    /*border: 1px solid #ccc;*/
    border-radius: 3px;
    margin-bottom: 2px;
    width: 100%;
    box-sizing: border-box;
    font-family: montserrat;
    color: #2C3E50;
    font-size: 14px;
}

#msform .form-group
{
    margin-bottom: 1rem;
    padding-top: 2px;
}

#msform label
{
    font-size: 16px;
    margin-bottom: 0px;
}

#msform p
{
    font-size: 14px;
    margin-bottom: 0px;
}

#msform .guardian_table
{
    border-spacing: 10px;
    border-collapse: separate;
}

#msform .guardian_table th
{
    font-size: 13px;
}

/*buttons*/
#msform .action-button
{
    width: 100px;
    background: #27AE60;
    font-weight: bold;
    color: white;
    border: 0 none;
    border-radius: 1px;
    cursor: pointer;
    padding: 10px 5px;
    margin: 10px 5px;
}

#msform .action-button:hover, #msform .action-button:focus
{
    box-shadow: 0 0 0 2px white, 0 0 0 3px #27AE60;
}

/*headings*/
.fs-title
{
    font-size: 18px;
    text-transform: uppercase;
    color: #2C3E50;
    margin-bottom: 10px;
}

.fs-subtitle
{
    font-weight: normal;
    font-size: 15px;
    color: #666;
    margin-bottom: 10px;
}

/*progressbar*/
#progressbar
{
    overflow: hidden;
    /*CSS counters to number the steps*/
    counter-reset: step;
}

.fixed-progressbar
{
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    padding: 0 0 20px 0;
    font-size: 18px;
    width: 70%;
    margin: auto;
}

#progressbar li
{
    list-style-type: none;
    color: black;
    text-transform: uppercase;
    font-size: 20px;
    width: 25%;
    float: left;
    position: relative;
}

#progressbar li:before
{
    content: counter(step);
    counter-increment: step;
    width: 20px;
    line-height: 20px;
    display: block;
    font-size: 15px;
    color: #333;
    background: white;
    border-radius: 3px;
    margin: 0 auto 5px auto;
}

/*progressbar connectors*/
#progressbar li:after
{
    content: '';
    width: 100%;
    height: 2px;
    background: white;
    position: absolute;
    left: -50%;
    top: 9px;
    z-index: -1; /*put it behind the numbers*/
}

#progressbar li:first-child:after
{
    /*connector not needed before the first step*/
    content: none;
}

/*marking active/completed steps green*/
/*The number of the step and the connector before it = green*/
#progressbar li.active:before, #progressbar li.active:after
{
    background: #27AE60;
    color: white;
}

.faq .accordion-list i
{
    right: 0;
    top: 0;
}

.faq .accordion-list p
{
    margin-bottom: 0px;
    margin-top: 7px;
}

@media (max-width: 1024px)
{
    .faq .content, .faq .accordion-list
    {
        padding-left: 0;
        padding-right: 0;
    }
}

@media (max-width: 992px)
{
    .faq .content
    {
        padding-top: 30px;
    }

    .faq .accordion-list
    {
        padding-bottom: 30px;
    }
}

.tableFixHead
{
    overflow-y: auto;
    height: 100px;
}

.tableFixHead .fix_thead .fix_th
{
    position: sticky;
    top: 0;
    background-color: #0a0d26;
    color: white;
    z-index: 1;
}

.fix_thead
{
    position: sticky;
    top: -1px;
    z-index: 1;
    background-color: #F5F5F7;
}

.m-tb-5
{
    margin-top: 5rem;
    margin-bottom: 5rem;
}

@media (max-width: 320px)
{
    .faq .faq-padding
    {
        padding: 20px 0px 0px 25px;
    }

    .book-width
    {
        margin: 90px;
    }
}

.table-scroll
{
    display: block;
    width: 100%;
    overflow-x: auto;
    max-height: 590px  !important;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}

.section-table
{
    border: 1px solid #E9ECEF !important;
}

.enrol-table th,
.enrol-table td
{
    border: 1px solid #E9ECEF !important;
    padding: .8rem !important;
}

.section-table th,
.section-table td
{
    border: 1px solid #E9ECEF !important;
}

.section-table th
{
    padding: 0.8rem !important;
}

.font-small
{
    font-size: small;
}

.square
{
    width: 300px;
    height: 75px;
    border: 2px solid black;
}

.break_lines
{
    white-space: pre-line;
}

@media (min-width: 1400px)
{
    .d-xxl-block
    {
        display: block !important;
    }

    .d-xxl-none
    {
        display: none !important;
    }
}

.mw-250px
{
    min-width: 250px;
}

.table_icon_font
{
    font-size: 16px;
    color: #21252F;
}

@media (max-width: 320px)
{
    .btn
    {
        padding: 0 0.6rem;
    }
}

.table-attendance th, .table-attendance td
{
    padding: 5px !important;
}

.table-attendance .th-dates
{
    width: 15px !important;
    text-align: center;
}

.tableFixHead
{
    overflow: auto;
    height: 500px;
}

.tableFixHead thead th
{
    position: sticky;
    top: -1px;
    z-index: 1;
}

.tableFixHead th
{
    background: #eee;
}

.form-group > label
{
    color: black;
    font-size: 20px;
}

.w_get_btn
{
    width: 166px;
}

.remove_select_margin select.form-control
{
    max-width: 100% !important;
}

.remove_input_padding input.form-control
{
    padding-bottom: 0 !important;
}

.margin-level1 .form-group
{
    margin-bottom: 0px !important;
}

.margin-level2 .form-group
{
    margin-bottom: 15px !important;
}

.add_student_font label
{
    font-size: 12px;
}

.font-16
{
    font-size: 16px !important;
}

.table-sm td, .table-sm th
{
    padding: 0.5rem 0.7rem !important;
}

.table-sm-pdf td, .table-sm-pdf th
{
    padding: 0.1rem !important;
}

.custom-drop-down
{
    position: absolute;
    z-index: 100;
    height: 50vh;
    overflow-y: auto;
    min-width: 15%;
}

.row-4-tbody
{
    max-height: 212px;
    display: block;
    overflow-y: auto;
}

.sticky-thead th
{
    position: sticky;
    top: 0;
    background-color: white;
}

.no-padding td
{
    padding: 0 5px 0 10px !important;
}

.td-padding-5 td
{
    padding: 5px 5px 5px 10px !important;
}

.shortcut-btn
{
    padding: 15px;
    min-height: 60px;
    width: 200px;
}

.candidate_enrollment_page label
{
    font-size: 14px;
    margin-bottom: 0;
}

.font-14
{
    font-size: 14px !important;
}

#content_text_size
{
    margin: 0 0.5rem;
}

.text-normal
{
    white-space: normal !important;
}

.candidate_enrollment_page input[type='text']
{
    padding: 0 !important;
}

.candidate_enrollment_page .preview
{
    padding: 10px !important;
}

.candidate_enrollment_page p
{
    margin: 0;
}

.role_filter
{
    margin-top: 30px;
    padding-right: 38px;
    padding-left: 32px;
}

@media (max-width: 1300px)
{
    .fee-input
    {
        width: 80px !important;
    }
}

.remove_card_min_height
{
    min-height: auto !important;
}

.area
{
    border-style: none !important;
    border-color: Transparent;
    overflow: auto;
    outline: none;
    border: 0px;
    size: 20px !important;
    border-bottom: 1px solid #2b2b2b !important;
}

.choose_column_modal .col-12
{
    padding: 10px 10px;
}

.choose_column_modal .form-check
{
    display: block;
}

.z-1
{
    z-index: 1;
}

.courser-pointer
{
    cursor: pointer;
}


/*tooltip */
[data-tooltip]
{
    position: center;
    z-index: 10;
}

/* Positioning and visibility settings of the tooltip */
[data-tooltip]:before,
[data-tooltip]:after
{
    position: absolute;
    visibility: hidden;
    opacity: 0;
    left: 50%;
    bottom: calc(100% + 5px); /* 5px is the size of the arrow */
    pointer-events: none;
    transition: 0.2s;
    will-change: transform;
}

/* The actual tooltip with a dynamic width */
[data-tooltip]:before
{
    content: attr(data-tooltip);
    padding: 10px 18px;
    min-width: 50px;
    max-width: 300px;
    width: max-content;
    width: -moz-max-content;
    border-radius: 6px;
    font-size: 14px;
    background-color: #3c4252;
    background-image: linear-gradient(30deg,
    rgba(59, 72, 80, 0.44),
    rgba(59, 68, 75, 0.44),
    rgba(60, 82, 88, 0.44));
    box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.2);
    color: #fff;
    text-align: left;
    white-space: pre-wrap;
    transform: translate(-50%, -5px) scale(0.5);
}

/* Tooltip arrow */
[data-tooltip]:after
{
    content: '';
    border-style: solid;
    border-width: 5px 5px 0px 5px; /* CSS triangle */
    border-color: rgba(55, 64, 70, 0.9) transparent transparent transparent;
    transition-duration: 0s;
    /* If the mouse leaves the element,
                                 the transition effects for the
                                 tooltip arrow are "turned off" */
    transform-origin: top;
    /* Orientation setting for the
                               slide-down effect */
    transform: translateX(-50%) scaleY(0);
}

/* Tooltip becomes visible at hover */
[data-tooltip]:hover:before,
[data-tooltip]:hover:after
{
    visibility: visible;
    opacity: 1;
    z-index: 10000 !important;
}

/* Scales from 0.5 to 1 -> grow effect */
[data-tooltip]:hover:before
{
    transition-delay: 0.1s;
    transform: translate(-50%, -5px) scale(1);
}

/*
  Arrow slide down effect only on mouseenter (NOT on mouseleave)
*/
[data-tooltip]:hover:after
{
    transition-delay: 0.1s; /* Starting after the grow effect */
    transition-duration: 0.1s;
    transform: translateX(-50%) scaleY(1);
}


/* RIGHT */
[data-tooltip-location="right"]:before,
[data-tooltip-location="right"]:after
{
    left: calc(100% + 5px);
    bottom: 50%;
}

.mb-4, .my-4
{
    margin-bottom: 1.6rem !important;
    padding-right: 0px;
    padding-left: 2px;
}

.tb-m
{
    margin-top: -41px;
}

.sr-tb
{
    margin-left: 131px;
    margin-top: 1px;
    padding-bottom: 14px;
}

.top-m
{
    margin-top: -22px;
}

.color_width
{
    width: 65px !important;
}

[data-tooltip-location="right"]:before
{
    transform: translate(5px, 50%) scale(0.5);
}

[data-tooltip-location="right"]:hover:before
{
    transform: translate(5px, 50%) scale(1);
}

[data-tooltip-location="right"]:after
{
    border-width: 5px 5px 5px 0px;
    border-color: transparent rgba(55, 64, 70, 0.9) transparent transparent;
    transform-origin: right;
    transform: translateY(50%) scaleX(0);
}

[data-tooltip-location="right"]:hover:after
{
    transform: translateY(50%) scaleX(1);
}

tr#template_element:hover
{
    background-color: #2196f3;
    cursor: pointer;
}

.td-width-1
{
    width: 1%;
    white-space: nowrap;
}

.custom-bg-img-login
{
    position: absolute;
    object-fit: cover;
    height: 100%;
    width: calc(100% - 41.6rem);
    margin-left: auto;
    opacity: 0.6;
}

.break-word
{
    word-wrap: break-word;
}

/*file manager*/
div.show_on_file_folder
{
    position: relative;
}

div.show_on_file_folder button.delete_file_folder
{
    position: absolute;
    display: none;
}

div.show_on_file_folder:hover img
{
    opacity: 0.5;
}

div.show_on_file_folder:hover button.delete_file_folder
{
    display: block;
}

div.show_on_file_folder button.delete_file_folder
{
    top: 0;
    right: 0;
}

.btn-circle
{
    width: 30px;
    height: 30px;
    padding: 6px 0px;
    border-radius: 15px;
    text-align: center;
    font-size: 12px;
    line-height: 1.42857;
    min-width: auto;
}

.btn-folder
{
    text-transform: unset !important;
    min-width: auto;
}

.h-max-176
{
    max-height: 176px !important;
}

/*Start - Stacked table style*/
@media (max-width: 575px)
{
    .table-sm-stack table, .table-sm-stack tbody
    {
        display: contents !important;
    }

    .table-sm-stack thead
    {
        display: none !important;
    }

    .table-sm-stack table, .table-sm-stack tbody, .table-sm-stack tr
    {
        width: 100% !important;
    }

    .table-sm-stack tr
    {
        width: auto !important;
    }

    .table-sm-stack td
    {
        display: inline-block;
    }

    .table-sm-stack tr
    {
        display: block;
    }

    .table-sm-stack td:before
    {
        content: attr(data-title);
        font-weight: bold;
    }

    .table-sm-striped tr:nth-child(even)
    {
        /*background: rgba(0, 0, 0, 0.05);*/
        background: #ececec;
    }

    .table-sm-striped tr:nth-child(odd)
    {
        background: white;
    }

    .table-stack-td-100 td
    {
        width: 100% !important;
    }
}

.table-stack table, .table-stack tbody
{
    display: contents !important;
}

.table-stack thead
{
    display: none !important;
}

.table-stack table, .table-stack tbody, .table-stack tr
{
    width: 100% !important;
}

.table-stack tr
{
    width: auto !important;
}

.table-stack td
{
    display: inline-block;
}

.table-stack tr
{
    display: block;
}

.table-stack td:before
{
    content: attr(data-title);
    font-weight: bold;
}

.table-td-pb-0 td
{
    padding-bottom: 0 !important;
}

.table-th-py-0 th
{
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

.table-td-py-0 td
{
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

.table-th-border-0 th
{
    border: 0 !important;

    box-shadow: inset 0 -0.13px 0 #000000;
}

/*End - Stacked table style*/
.overflow-x-auto
{
    overflow-x: auto;
}

.header
{
    /* Background color */
    background-color: #F5F5F7;

    /* Stick to the left */
    left: -1px;
    position: sticky;

    /* Displayed on top of other rows when scrolling */
    z-index: 9999;
}

.table-bordered
{
    border: 1px solid #dee2e6;
}

.table-bordered th,
.table-bordered td
{
    border: 1px solid #dee2e6;
}

.table-bordered thead th,
.table-bordered thead td
{
    border-bottom-width: 2px;
}

.table-borderless th,
.table-borderless td,
.table-borderless thead th,
.table-borderless tbody + tbody
{
    border: 0;
}

/* #result-table td:nth-child(1),
#result-table th:nth-child(1) {
    position: sticky;
    left: 0;
    background: white;
}

#result-table td:nth-child(2),
#result-table th:nth-child(2)
{
    position: sticky;
    left: 205px;
    background: white;
} */

.tscroll
{
    width: 400px;
    overflow-x: scroll;
    opacity: 1;
}

.tscroll table td:last-child, .tscroll table th:last-child
{
    position: sticky;
    right: 0;
    background-color: #f0f0f0;
}

.tscroll table th:nth-last-child(2), .tscroll table td:nth-last-child(2)
{
    position: sticky;
    right: 96px;
    background-color: #f0f0f0;
}

.tscroll table th:nth-last-child(3), .tscroll table td:nth-last-child(3)
{
    position: sticky;
    right: 158px;
    background-color: #f0f0f0;
}

.library-fine-table-div
{
    max-height: 600px;
    overflow-y: auto;
    display: block;
}

.library-fine-table thead
{
    background: white;
    position: sticky;
    top: 0;
    z-index: 100;
}

.dropdown-on-hover:hover .dropdown-menu-on-hover
{
    display: block;
}

.dropdown-menu-on-hover a:hover
{
    color: royalblue !important;
    text-decoration: royalblue underline !important;
}

@media (min-width: 1200px)
{
    .table-responsive-1200
    {
        display: block !important;
    }
}

.below-input-link-margin-left
{
    margin-left: 10rem
}

.all-order-padding thead > tr > th .pt-1px
{
    padding-top: 1px !important;
}

.all-order-padding thead > tr > th,
.all-order-padding tbody > tr > td
{
    padding: 8px !important;
}

.paginate a
{
    height: 42px;
    display: inline-block;
    padding: 8px 16px;
    text-decoration: none;
    border: 1px solid white;
    transition: background-color .3s;
    margin: 0 2px;
}

.paginate a.disabled
{
    color: grey;
    cursor: pointer;
}

.paginate a:not(.disabled)
{
    color: black;
}

.paginate a.active:not(.disabled)
{
    color: black;
    border: 1px solid darkgrey;
    background: white linear-gradient(to bottom, white 0%, #dcdcdc 100%);
}

.paginate a:hover:not(.active):not(.disabled)
{
    color: white;
    border: 1px solid black;
    background: #585858 linear-gradient(to bottom, #585858 0%, #111 100%);
}

.paginate a:hover > i:not(.active):not(.disabled)
{
    color: white;
}

@media (min-width: 1600px)
{
    .ml-xxl-logo
    {
        margin-left: 36rem !important;
    }
}

.dropdown-item
{
    line-height: 3.5rem !important;
    height: auto;
}

.dropdown-item:hover, .dropdown-item:focus
{
    background-color: #c0c0c0;

}

.table-min-width-150 td
{
    white-space: nowrap;
    min-width: 150px;
}

.table-responsive-y
{
    overflow-y: auto !important;
    max-height: 57vh;
}

.select-grey-background
{
    background: rgba(33,150,243, 0.6);
}

.select-white-background
{
    background: white !important;
}

.select-hide-selected-option
{
    display: none !important;
}

@media (max-width: 1618px) and (min-width: 300px)
{
    .pre_ad_mt_bt_cus
    {
        margin-top: 5px;
    }
}

.ps__rail-y:hover > .ps__thumb-y, .ps__rail-y:focus > .ps__thumb-y{
    width: 20px;
}

.ps__thumb-y{
    background-color: #6f6f6f !important;
}

.scroll-200 {
    max-height: 200px;
    overflow:auto;
}

#default_student_id
{
    min-width: 250px;
}

@media (max-width: 991px) and (min-width: 576px)
{
    .container
    {
        max-width: 100% !important;
    }
}

@media (max-width: 940px) and (min-width: 752px)
{
    #default_student_id,
    #default_student_id .select2-container,
    #default_class_section
    {
        width: 100px !important;
        min-width: 100px !important;
    }
}

@media (max-width: 890px)
{
    #footer
    {
        height: 5rem !important;
        min-height: 5rem !important;
    }

    #footer .footer-data
    {
        padding: 0 !important;
        text-align: left !important;
    }

    .footer-data-p
    {
        margin-top: 0.5rem !important;
    }
}

@media (max-width: 890px) and (min-width: 805px)
{
    .footer-data-p
    {
        margin-top: 1.2rem !important;
    }
}

.sms-student-list{
    height: 36vh !important;
    overflow-y: scroll !important;
}

.ovaltoggle
{
    border-radius: 20px;
}

.scroll-modal{
    max-height:100vh; overflow-y:scroll
}

.tbl-container{
    max-width: fit-content;
    max-height: fit-content;
    min-width: 100%;
}

.tbl-fixed{
    overflow-x: scroll;
    overflow-y: scroll;
    height: fit-content;
}

.tbl-fixed table{
    min-width: 100%;
    border-collapse: collapse;
    border: 1px solid black;
}

.tbl-fixed .tbl-border th, .tbl-fixed .tbl-border td{
    border: 1px solid black;
    padding: 5px;
}

.tbl-fixed table th{
    position: sticky;
    top: -1px;
    background-color: #d4d4d4;
    z-index: 2;
    vertical-align: middle;
}

.tbl-fixed table td{
    background-color: #fff;
    vertical-align: middle;
}

.tbl-fixed table td:first-child, .tbl-fixed table th:first-child{
    position: sticky;
    left: -1px;
    z-index: 1;
    background-color: #d4d4d4;
}

.tbl-fixed table th:first-child{
    z-index: 3;
}