@media (max-width: 981px) {
    body, a {
        font-size: .8rem !important;
    }
    .form-control {
        border-radius: 4px;
        height: calc(.8em + .75rem + 7px);
    }
    .sidebar.toggled .nav-item .nav-link[data-toggle=collapse]::after {
        width: 0 !important;
    }
    .select2-container{
        width: 100%;
    }

    .sidebar.toggled .nav-item {
        margin-left: 0;
        position: relative;
        margin-bottom: -15px;
    }

    .sidebar.toggled .nav-item .nav-link {
        font-size: .8rem;
        padding: 1.2rem 1.5rem 1.2rem .9rem;
        padding: 1.4rem .5rem 1.3rem .5rem;
        border-bottom: 1px solid #e9e9e9;
        margin-bottom: 12px;
    }

    /*.sidebar.toggled .nav-item .nav-link:first-child{*/
    /*    border-bottom: none;*/
    /*}*/
    .sidebar-light .nav-item .nav-link svg {
        stroke: var(--primary-blue);
        width: 30px;
        height: 30px;
        stroke-width: 1px;
        transition: .3s;
        margin-right: 5px;
    }

    .sidebar.toggled .nav-item .nav-link i {
        font-size: .85rem;
        margin-top: .3rem;
        margin-right: .5rem;
        margin-left: 0;
    }

    .sidebar.toggled .nav-item .collapse, .sidebar.toggled .nav-item .collapsing {
        margin: 0;
        padding-left: 11px;
        margin-top: -16px;
    }

    .sidebar.toggled .nav-item .collapse .collapse-inner {
        border-radius: .35rem;
        -webkit-box-shadow: 0 .15rem 1.75rem 0 rgba(58, 59, 69, .15);
        box-shadow: none !important;
    }

    .card {
        padding: 12px !important;
    }

    .std__form form .form__head {
        padding-left: 0px;
        font-size: .9rem;
    }

    .std__form form .btn-submit {
        margin-right: 12px;
    }

    .topbar .dropdown .dropdown-menu {
        width: calc(50% - 1.5rem);
        right: 0;
        margin-top: -2px;
    }

    .topbar .nav-item svg {
        color: var(--white);
    }

    .topbar .nav-item .nav-link .img-profile {
        border: 1px solid var(--primary-blue);
    }

    .card.item .h4 {
        font-weight: 500;
        font-size: 1.1rem;
    }

    .main__dashboard .item .bi {
        font-size: 2rem;
    }

    .btn, .btn-sm, .card__head .btn {
        border-radius: 4px;
        padding: .35rem .5rem;
        font-size: .8rem;
    }

    .dataTables_wrapper.dt-bootstrap4 .col-md-6, .dataTables_wrapper.dt-bootstrap4 .col-sm-12 {
        width: 50% !important;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    div.dataTables_wrapper div.dataTables_filter input {
        margin-left: 0.5em;
        display: inline-block;
        width: 120px;
    }

    .table td, .table th {
        padding: 0.5rem .5rem !important;
    }

    .std__attn .table th:first-child, .std__attn .table td:first-child, .marks__entry__body .table th:first-child, .marks__entry__body .table td:first-child {
        width: 50px !important;
    }

    .std__attn .attn__note {
        display: none;
    }

    .std__attn table svg {
        display: block;
        margin-top: 5px;
    }

    .std__attn .form-check-inline {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding-left: 0;
        margin-right: 0;
        display: block;
        margin-bottom: 4px;
    }

    .std__attn .form-check-label {
        margin-bottom: 0;
        font-size: .9rem;
        justify-content: start;
    }

    .attn__header h4 {
        font-size: .9rem;
        font-weight: 700;
    }

    .std__card .card {
        margin-bottom: .6rem !important;
        height: auto;
    }

    /*================
    Marks Entry Page
    ================================*/
    .marks__entry__body .th__marks__entry {
        width: 90px !important;
    }

    .btn__search {
        text-align: center;
    }

    .marks__entry__body .th__name {
        min-width: 130px !important;
    }

    /*======================
    Admin Dashboard
    =================================*/
    .topbar {
        background: var(--primary-blue);
        border-bottom: none;
        padding-bottom: 20px;
        height: 6rem;
        border-radius: 0 0 14px 14px;
        border-top: 21px solid #0e7bb7;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 9999;
    }

    .main__dashboard {
        position: relative;
        top: 8rem;
    }

    .sidebar.toggled {
        top: 1.3rem;
        position: relative;
        width: 95vw !important;
    }

    .sidebar .nav-item .nav-link[data-toggle=collapse].collapsed::after {
        content: "\F285" !important;
        display: none;
    }

    .sidebar .nav-item .nav-link[data-toggle=collapse]::after {
        content: "\F282" !important;
        display: none;
    }

    .sidebar-light .nav-item .nav-link svg {
        margin-top: -4px;
    }

    .sidebar-light .nav-item .nav-link svg {
        stroke: var(--primary-blue);
        width: 30px;
        height: 30px;
        stroke-width: 1px;
        transition: .3s;
        margin-right: 5px;
    }

    .quick__link span {
        display: none;
    }

    .user__mbl {
        color: var(--white);
        font-size: 1.1rem !important;
        margin-left: -31px;
        display: flex;
    }

    .topbar .topbar-divider {
        width: 0;
        border-right: none;
        height: calc(4.375rem - 2rem);
        margin: auto .5rem;
    }


    /*================
    Footer Mobile
    =================================*/
    footer.sticky-footer {
        padding: .6rem 0;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        -webkit-box-shadow: 0px -5px 15px rgb(131 131 131 / 15%);
        box-shadow: 0px -5px 15px rgb(131 131 131 / 15%);
        position: fixed;
        bottom: 0;
        right: 0;
        left: 0;
    }

    footer.sticky-footer .item svg {
        color: var(--primary-blue);
        stroke: var(--primary-blue);
    }

    /*==================
    Mobile Dashboard
    ==============================*/
    .dash__block {
        background: var(--white);
        border-radius: 9px !important;
        box-shadow: 0px 3px 4px 0px rgba(0, 0, 0, 0.04) !important;
        margin-bottom: 28px;
        padding: 12px !important;
    }

    .dash__block .item {
        margin-bottom: 2rem;
    }

    .dash__block .dash__title h6 {
        font-size: .95rem !important;
        font-weight: 500;
        margin-bottom: 1.2rem;
    }

    .dash__block .item .icon {
        width: 43px;
        height: 43px;
        text-align: center;
        margin: 0 auto;
        border-radius: 50%;
        padding-top: 8px;
        box-shadow: 0px 1px 4px #dddddd;
        margin-bottom: 7px;
    }

    .dash__block .item .icon svg {
        stroke: var(--primary-blue);
        width: 30px;
        height: 30px;
        margin-bottom: 10px;
        stroke-width: 1.2;
    }

    .dash__block .item .title span {
        color: var(--gray-800);
        font-size: .75rem;
        line-height: 1.3em;
        display: block;
    }

    .ads__thumb, .notice__block {
        padding: 0 0 0px 0 !important;
    }

    .ads__thumb .dash__title, .notice__block .dash__title {
        padding: 12px 12px 0px 12px !important;
    }

    .notice__body {
        position: absolute;
        top: 33px;
        left: 20%;
        right: 10%;
    }

    .ads__thumb img {
        border-radius: 9px !important;
    }

    .dash__block .link a {
        font-size: 1rem !important;
    }

    .notice__body h6 {
        color: #000000;
        font-size: 1.3rem !important;
        margin-bottom: 20px;
    }

    /*==================
    Pages
    ==============================*/

    .table__top__txt {
        font-size: .95rem !important;
    }
    .table th, table td{
        font-size: .8rem !important;
    }

    .nav-tabs .nav-link.active {
        border-bottom: 1px solid var(--danger-red);
    }
    .nav-tabs .nav-item {
        margin: 8px 6px -1px;
    }
    .table .thead-light th:first-child, .card .table td:first-child {
        max-width: 80px;
        width: 80px;
        text-align: center;
    }
    .container, .container-fluid, .container-login {
        padding-left: 1.0rem;
        padding-right: 1.0rem;
    }
    tbody td .btn i {
        font-size: .6rem;
    }
    .btn-soft-info, .btn-soft-danger, .btn-soft-success, .btn-soft-secondary {
        border-radius: 50%;
        width: 23px;
        height: 23px;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        padding-top: 4px;
    }

}