/* * Fonts */
    @import url("//cdn.web-fonts.ge/fonts/bpg-arial/css/bpg-arial.min.css");
    @import url("//cdn.web-fonts.ge/fonts/dejavu-sans-oblique/css/dejavu-sans-oblique.min.css");
    @import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;400;600;700&display=swap');
    @import url("//cdn.web-fonts.ge/fonts/dejavu-sans/css/dejavu-sans.min.css");
    @import url("//cdn.web-fonts.ge/fonts/bpg-web-001-caps/css/bpg-web-001-caps.min.css");
/* * Fonts */

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

    [data-icon]:before {
        font-family: "dripicons-v2" !important;
        content: attr(data-icon);
        font-style: normal !important;
        font-weight: normal !important;
        font-variant: normal !important;
        text-transform: none !important;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    [class^="dripicons-"]:before,
    [class*=" dripicons-"]:before {
        font-family: "dripicons-v2" !important;
        font-style: normal !important;
        font-weight: normal !important;
        font-variant: normal !important;
        text-transform: none !important;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    .dripicons-alarm:before {
    content: "\61";
    }
    .dripicons-align-center:before {
    content: "\62";
    }
    .dripicons-align-justify:before {
    content: "\63";
    }
    .dripicons-align-left:before {
    content: "\64";
    }
    .dripicons-align-right:before {
    content: "\65";
    }
    .dripicons-anchor:before {
    content: "\66";
    }
    .dripicons-archive:before {
    content: "\67";
    }
    .dripicons-arrow-down:before {
    content: "\68";
    }
    .dripicons-arrow-left:before {
    content: "\69";
    }
    .dripicons-arrow-right:before {
    content: "\6a";
    }
    .dripicons-arrow-thin-down:before {
    content: "\6b";
    }
    .dripicons-arrow-thin-left:before {
    content: "\6c";
    }
    .dripicons-arrow-thin-right:before {
    content: "\6d";
    }
    .dripicons-arrow-thin-up:before {
    content: "\6e";
    }
    .dripicons-arrow-up:before {
    content: "\6f";
    }
    .dripicons-article:before {
    content: "\70";
    }
    .dripicons-backspace:before {
    content: "\71";
    }
    .dripicons-basket:before {
    content: "\72";
    }
    .dripicons-basketball:before {
    content: "\73";
    }
    .dripicons-battery-empty:before {
    content: "\74";
    }
    .dripicons-battery-full:before {
    content: "\75";
    }
    .dripicons-battery-low:before {
    content: "\76";
    }
    .dripicons-battery-medium:before {
    content: "\77";
    }
    .dripicons-bell:before {
    content: "\78";
    }
    .dripicons-blog:before {
    content: "\79";
    }
    .dripicons-bluetooth:before {
    content: "\7a";
    }
    .dripicons-bold:before {
    content: "\41";
    }
    .dripicons-bookmark:before {
    content: "\42";
    }
    .dripicons-bookmarks:before {
    content: "\43";
    }
    .dripicons-box:before {
    content: "\44";
    }
    .dripicons-briefcase:before {
    content: "\45";
    }
    .dripicons-brightness-low:before {
    content: "\46";
    }
    .dripicons-brightness-max:before {
    content: "\47";
    }
    .dripicons-brightness-medium:before {
    content: "\48";
    }
    .dripicons-broadcast:before {
    content: "\49";
    }
    .dripicons-browser:before {
    content: "\4a";
    }
    .dripicons-browser-upload:before {
    content: "\4b";
    }
    .dripicons-brush:before {
    content: "\4c";
    }
    .dripicons-calendar:before {
    content: "\4d";
    }
    .dripicons-camcorder:before {
    content: "\4e";
    }
    .dripicons-camera:before {
    content: "\4f";
    }
    .dripicons-card:before {
    content: "\50";
    }
    .dripicons-cart:before {
    content: "\51";
    }
    .dripicons-checklist:before {
    content: "\52";
    }
    .dripicons-checkmark:before {
    content: "\53";
    }
    .dripicons-chevron-down:before {
    content: "\54";
    }
    .dripicons-chevron-left:before {
    content: "\55";
    }
    .dripicons-chevron-right:before {
    content: "\56";
    }
    .dripicons-chevron-up:before {
    content: "\57";
    }
    .dripicons-clipboard:before {
    content: "\58";
    }
    .dripicons-clock:before {
    content: "\59";
    }
    .dripicons-clockwise:before {
    content: "\5a";
    }
    .dripicons-cloud:before {
    content: "\30";
    }
    .dripicons-cloud-download:before {
    content: "\31";
    }
    .dripicons-cloud-upload:before {
    content: "\32";
    }
    .dripicons-code:before {
    content: "\33";
    }
    .dripicons-contract:before {
    content: "\34";
    }
    .dripicons-contract-2:before {
    content: "\35";
    }
    .dripicons-conversation:before {
    content: "\36";
    }
    .dripicons-copy:before {
    content: "\37";
    }
    .dripicons-crop:before {
    content: "\38";
    }
    .dripicons-cross:before {
    content: "\39";
    }
    .dripicons-crosshair:before {
    content: "\21";
    }
    .dripicons-cutlery:before {
    content: "\22";
    }
    .dripicons-device-desktop:before {
    content: "\23";
    }
    .dripicons-device-mobile:before {
    content: "\24";
    }
    .dripicons-device-tablet:before {
    content: "\25";
    }
    .dripicons-direction:before {
    content: "\26";
    }
    .dripicons-disc:before {
    content: "\27";
    }
    .dripicons-document:before {
    content: "\28";
    }
    .dripicons-document-delete:before {
    content: "\29";
    }
    .dripicons-document-edit:before {
    content: "\2a";
    }
    .dripicons-document-new:before {
    content: "\2b";
    }
    .dripicons-document-remove:before {
    content: "\2c";
    }
    .dripicons-dot:before {
    content: "\2d";
    }
    .dripicons-dots-2:before {
    content: "\2e";
    }
    .dripicons-dots-3:before {
    content: "\2f";
    }
    .dripicons-download:before {
    content: "\3a";
    }
    .dripicons-duplicate:before {
    content: "\3b";
    }
    .dripicons-enter:before {
    content: "\3c";
    }
    .dripicons-exit:before {
    content: "\3d";
    }
    .dripicons-expand:before {
    content: "\3e";
    }
    .dripicons-expand-2:before {
    content: "\3f";
    }
    .dripicons-experiment:before {
    content: "\40";
    }
    .dripicons-export:before {
    content: "\5b";
    }
    .dripicons-feed:before {
    content: "\5d";
    }
    .dripicons-flag:before {
    content: "\5e";
    }
    .dripicons-flashlight:before {
    content: "\5f";
    }
    .dripicons-folder:before {
    content: "\60";
    }
    .dripicons-folder-open:before {
    content: "\7b";
    }
    .dripicons-forward:before {
    content: "\7c";
    }
    .dripicons-gaming:before {
    content: "\7d";
    }
    .dripicons-gear:before {
    content: "\7e";
    }
    .dripicons-graduation:before {
    content: "\5c";
    }
    .dripicons-graph-bar:before {
    content: "\e000";
    }
    .dripicons-graph-line:before {
    content: "\e001";
    }
    .dripicons-graph-pie:before {
    content: "\e002";
    }
    .dripicons-headset:before {
    content: "\e003";
    }
    .dripicons-heart:before {
    content: "\e004";
    }
    .dripicons-help:before {
    content: "\e005";
    }
    .dripicons-home:before {
    content: "\e006";
    }
    .dripicons-hourglass:before {
    content: "\e007";
    }
    .dripicons-inbox:before {
    content: "\e008";
    }
    .dripicons-information:before {
    content: "\e009";
    }
    .dripicons-italic:before {
    content: "\e00a";
    }
    .dripicons-jewel:before {
    content: "\e00b";
    }
    .dripicons-lifting:before {
    content: "\e00c";
    }
    .dripicons-lightbulb:before {
    content: "\e00d";
    }
    .dripicons-link:before {
    content: "\e00e";
    }
    .dripicons-link-broken:before {
    content: "\e00f";
    }
    .dripicons-list:before {
    content: "\e010";
    }
    .dripicons-loading:before {
    content: "\e011";
    }
    .dripicons-location:before {
    content: "\e012";
    }
    .dripicons-lock:before {
    content: "\e013";
    }
    .dripicons-lock-open:before {
    content: "\e014";
    }
    .dripicons-mail:before {
    content: "\e015";
    }
    .dripicons-map:before {
    content: "\e016";
    }
    .dripicons-media-loop:before {
    content: "\e017";
    }
    .dripicons-media-next:before {
    content: "\e018";
    }
    .dripicons-media-pause:before {
    content: "\e019";
    }
    .dripicons-media-play:before {
    content: "\e01a";
    }
    .dripicons-media-previous:before {
    content: "\e01b";
    }
    .dripicons-media-record:before {
    content: "\e01c";
    }
    .dripicons-media-shuffle:before {
    content: "\e01d";
    }
    .dripicons-media-stop:before {
    content: "\e01e";
    }
    .dripicons-medical:before {
    content: "\e01f";
    }
    .dripicons-menu:before {
    content: "\e020";
    }
    .dripicons-message:before {
    content: "\e021";
    }
    .dripicons-meter:before {
    content: "\e022";
    }
    .dripicons-microphone:before {
    content: "\e023";
    }
    .dripicons-minus:before {
    content: "\e024";
    }
    .dripicons-monitor:before {
    content: "\e025";
    }
    .dripicons-move:before {
    content: "\e026";
    }
    .dripicons-music:before {
    content: "\e027";
    }
    .dripicons-network-1:before {
    content: "\e028";
    }
    .dripicons-network-2:before {
    content: "\e029";
    }
    .dripicons-network-3:before {
    content: "\e02a";
    }
    .dripicons-network-4:before {
    content: "\e02b";
    }
    .dripicons-network-5:before {
    content: "\e02c";
    }
    .dripicons-pamphlet:before {
    content: "\e02d";
    }
    .dripicons-paperclip:before {
    content: "\e02e";
    }
    .dripicons-pencil:before {
    content: "\e02f";
    }
    .dripicons-phone:before {
    content: "\e030";
    }
    .dripicons-photo:before {
    content: "\e031";
    }
    .dripicons-photo-group:before {
    content: "\e032";
    }
    .dripicons-pill:before {
    content: "\e033";
    }
    .dripicons-pin:before {
    content: "\e034";
    }
    .dripicons-plus:before {
    content: "\e035";
    }
    .dripicons-power:before {
    content: "\e036";
    }
    .dripicons-preview:before {
    content: "\e037";
    }
    .dripicons-print:before {
    content: "\e038";
    }
    .dripicons-pulse:before {
    content: "\e039";
    }
    .dripicons-question:before {
    content: "\e03a";
    }
    .dripicons-reply:before {
    content: "\e03b";
    }
    .dripicons-reply-all:before {
    content: "\e03c";
    }
    .dripicons-return:before {
    content: "\e03d";
    }
    .dripicons-retweet:before {
    content: "\e03e";
    }
    .dripicons-rocket:before {
    content: "\e03f";
    }
    .dripicons-scale:before {
    content: "\e040";
    }
    .dripicons-search:before {
    content: "\e041";
    }
    .dripicons-shopping-bag:before {
    content: "\e042";
    }
    .dripicons-skip:before {
    content: "\e043";
    }
    .dripicons-stack:before {
    content: "\e044";
    }
    .dripicons-star:before {
    content: "\e045";
    }
    .dripicons-stopwatch:before {
    content: "\e046";
    }
    .dripicons-store:before {
    content: "\e047";
    }
    .dripicons-suitcase:before {
    content: "\e048";
    }
    .dripicons-swap:before {
    content: "\e049";
    }
    .dripicons-tag:before {
    content: "\e04a";
    }
    .dripicons-tag-delete:before {
    content: "\e04b";
    }
    .dripicons-tags:before {
    content: "\e04c";
    }
    .dripicons-thumbs-down:before {
    content: "\e04d";
    }
    .dripicons-thumbs-up:before {
    content: "\e04e";
    }
    .dripicons-ticket:before {
    content: "\e04f";
    }
    .dripicons-time-reverse:before {
    content: "\e050";
    }
    .dripicons-to-do:before {
    content: "\e051";
    }
    .dripicons-toggles:before {
    content: "\e052";
    }
    .dripicons-trash:before {
    content: "\e053";
    }
    .dripicons-trophy:before {
    content: "\e054";
    }
    .dripicons-upload:before {
    content: "\e055";
    }
    .dripicons-user:before {
    content: "\e056";
    }
    .dripicons-user-group:before {
    content: "\e057";
    }
    .dripicons-user-id:before {
    content: "\e058";
    }
    .dripicons-vibrate:before {
    content: "\e059";
    }
    .dripicons-view-apps:before {
    content: "\e05a";
    }
    .dripicons-view-list:before {
    content: "\e05b";
    }
    .dripicons-view-list-large:before {
    content: "\e05c";
    }
    .dripicons-view-thumb:before {
    content: "\e05d";
    }
    .dripicons-volume-full:before {
    content: "\e05e";
    }
    .dripicons-volume-low:before {
    content: "\e05f";
    }
    .dripicons-volume-medium:before {
    content: "\e060";
    }
    .dripicons-volume-off:before {
    content: "\e061";
    }
    .dripicons-wallet:before {
    content: "\e062";
    }
    .dripicons-warning:before {
    content: "\e063";
    }
    .dripicons-web:before {
    content: "\e064";
    }
    .dripicons-weight:before {
    content: "\e065";
    }
    .dripicons-wifi:before {
    content: "\e066";
    }
    .dripicons-wrong:before {
    content: "\e067";
    }
    .dripicons-zoom-in:before {
    content: "\e068";
    }
    .dripicons-zoom-out:before {
    content: "\e069";
    }
/* * Dripicons */

/* * Config */
    :root {
        --dark-gray: 108,117,125;
        --light-gray: 152,166,173;
        --blue: 110,126,245;
        --deep-blue: 78,91,242;
        --dark-blue: 49,58,70;
        --light-blue: 60,70,85;
        --temo-blue: 45,135,204;
        --temo-blue-darker: 25,115,184;

        --k-white: 255,255,255;
        --k-black: 25,25,25;
    }

    body {
        font-size: 14px;
        color: rgb(var(--dark-gray));
        background-color: #fafbfe;
    }

    .close {
      color:red!important;
    }

    body button:focus {outline: none;}

    body.overflow-hidden {overflow: hidden;}

    .d-fc {
        display: flex;
        flex-direction: column;
    }

    .w-20 {width: 20% !important;}

a {

  color: #3b96de;

}

a:hover {

  color: #d81414;

}

    button {cursor: pointer;}
    button.fancy-btn:not(.dropdown-item) {
        width: 100%;
        height: 40px;
        border-radius: 1px;
        color: rgb(var(--k-white));
        background-color: rgb(var(--temo-blue));
        outline: none;
        border: none;
        box-shadow: 0 0 3px rgb(var(--temo-blue));
        transition: background-color .3s;
    }

    button.fancy-btn:not(.dropdown-item):hover {background-color: rgb(var(--temo-blue-darker));}

    .content-wrapper.container-fluid {
        max-width: 95%;
        min-height: 1000px;
        padding-top: 35px;
    }

    /* * Chrome, Safari, Edge, Opera */
    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
    -webkit-appearance: none;
        margin: 0;
    }

    /* * Firefox */
    input[type=number] {
        -moz-appearance:textfield;
    }

    .bg-transparent {
        background: transparent !important;
    }

    .alert {transition: opacity .3s;}
    .alert.hide {opacity: 0;}

    .page-item.active .page-link {
        border-color: rgb(var(--temo-blue));
        background-color: rgb(var(--temo-blue));
    }

    .form-control.validation-used {
        background-color: rgba(220,53,69,.8);
        box-shadow: 0 0 0 0.2rem rgba(220,53,69,.25);
        color: rgb(var(--k-white));
        border-color: rgba(220,53,69,.25);
    }

    /*
    *   Bootstrap Breakpoints : {
    *       1200px,
    *       992px,
    *       768px,
    *       576px,
    *   }
    *
    */
/* * Config */

/* * Navbar */




    .navbar-wrapper {
        height: 70px;
        background-color: #2d87cc;
    }

    .navbar-wrapper .navbar-inner {width: 95%; height: 100%;}

    .navbar-wrapper .navbar-inner .navbar-left {color: rgb(var(--k-white));}
    .navbar-wrapper .navbar-inner .navbar-left span {
        font-size: 16px;
    }
    .navbar-wrapper .navbar-inner .navbar-left a {
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(var(--k-white), .33);
        border-radius: 1px;
        height: 40px;
        padding: 0 20px;
        color: rgb(var(--k-white));
        text-decoration: none;
        transition: background-color .3s;
    }

    .navbar-wrapper .navbar-inner .navbar-left a:hover {
        background: rgba(var(--k-white), .1);
    }

body {

  font-family:"DejaVu Sans", sans-serif;
}

p {

  font-family:"DejaVu Sans", sans-serif;
}

    .navbar-wrapper .navbar-inner .navbar-right,
    .navbar-wrapper .navbar-inner .navbar-right .dropdown {height: 100%;}

    .navbar-wrapper .navbar-inner .navbar-right .dropdown button.navbar-user-dropdown {
        display: flex;
        align-items: center;
        height: 100%;
        border: none;
        outline: none;
        background-color: #f9fafd;
        color: rgb(var(--light-gray));
        text-align: left;
        font-family: "DejaVu Sans", sans-serif;
        font-weight: 600;
    }

    .navbar-wrapper .navbar-inner .navbar-right .dropdown button.navbar-user-dropdown img {
        width: 32px;
        height: 32px;
    }

    .navbar-wrapper .navbar-inner .navbar-right .dropdown button.navbar-user-dropdown span.name {font-size: 14px;}
    .navbar-wrapper .navbar-inner .navbar-right .dropdown button.navbar-user-dropdown span.tier {font-size: 12px;}

    .navbar-wrapper .navbar-inner .navbar-right .dropdown .dropdown-menu {min-width: 200px;}
    .navbar-wrapper .navbar-inner .navbar-right .dropdown .dropdown-menu span {
        display: flex;
        font-size: 12px;
        font-weight: 600;
        color: rgb(var(--dark-gray));
        padding: 15px 20px;
    }

    .navbar-wrapper .navbar-inner .navbar-right .dropdown .dropdown-menu button[type="submit"],
    .navbar-wrapper .navbar-inner .navbar-right .dropdown .dropdown-menu a {
        display: flex;
        align-items: center;
        font-size: 12px;
        font-weight: 600;
        color: rgb(var(--dark-blue));
    }
    .navbar-wrapper .navbar-inner .navbar-right .dropdown .dropdown-menu button[type="submit"] i,
    .navbar-wrapper .navbar-inner .navbar-right .dropdown .dropdown-menu a i {
        display: flex;
        align-items: center;
        font-size: 14px;
        margin-right: 10px;
    }
/* * Navbar */

/* * Sidebar */
    .sidebar-wrapper.d-fc {
        max-width: 250px;
        min-width: 250px;
        margin-bottom: 50px;
        background-color: rgb(var(--k-white));
        box-shadow: 0 0 35px 0 rgba(154,161,171,.15);
    }

    .sidebar-wrapper button,
    .sidebar-wrapper a {
        font-family: "DejaVu Sans", sans-serif;
        font-weight: 600;
    }

    .sidebar-wrapper .user-profile {
        padding: 30px 20px;
        background: url('http://ekattor-school-erp.com/demo/v7/assets/backend/images/waves.png') no-repeat;
    }

    .sidebar-wrapper .user-profile img {
        width: 42px;
        height: 42px;
    }

    .sidebar-wrapper .user-profile span {
        font-family: "DejaVu Sans", sans-serif;
        font-weight: 700;
        color: rgb(var(--dark-blue));
        margin-top: 10px;
    }

    .sidebar-wrapper .navigation {
        font-weight: 600;
        color: rgb(var(--dark-blue));
        padding: 12px 30px;
    }

    .sidebar-wrapper > button,
    .sidebar-wrapper > a {
        display: flex;
        align-items: center;
        padding: 0 30px;
        height: 60px;
        background-color: transparent;
        outline: none;
        border: none;
        font-size: 15px;
        color: rgb(var(--dark-gray));
        font-weight: 400;
        text-decoration: none;
        transition: color .3s;
    }

    .sidebar-wrapper > a i.material-icons.left,
    .sidebar-wrapper > button i.material-icons.left {
        width: 15px;
        margin: 3px 15px 0 0;
        font-size: 18px;
        color:#2f87cc;
    }

    .sidebar-wrapper > a i.material-icons:not(.left),
    .sidebar-wrapper > button i.material-icons:not(.left) {
        font-size: 18px;
        margin-left: auto;
        transition: transform .3s;
    }

    .sidebar-wrapper > button[aria-expanded="true"] i.material-icons:not(.left) {
        transform: rotate(90deg);
    }

    .sidebar-wrapper > button:hover,
    .sidebar-wrapper > button[aria-expanded="true"],
    .sidebar-wrapper > a:hover,
    .sidebar-wrapper > a.active {
        color: rgb(var(--temo-blue));
    }

    .sidebar-wrapper > div[data-parent=".sidebar-wrapper"] a {
        text-decoration: none;
        color: rgb(var(--dark-gray));
        padding: 8px 20px 8px 68px;
        font-weight: 400;
        transition: color .3s;
    }

    .sidebar-wrapper > div[data-parent=".sidebar-wrapper"] a.active,
    .sidebar-wrapper > div[data-parent=".sidebar-wrapper"] a:hover {
        color: rgb(var(--temo-blue));
    }
/* * Sidebar */

/* * Sidebar Popup */
    .sidebar-popup {
        display: none;
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        z-index: 1000;
    }
    .sidebar-popup.display {display: initial;}

    .sidebar-popup .darkener {
        position: relative;
        opacity: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(var(--dark-blue), .8);
        transition: opacity .3s;
    }
    .sidebar-popup.show .darkener {opacity: 1;}

    .sidebar-popup .data-field {
        position: fixed;
        top: 0;
        right: -450px;
        bottom: 0;
        width: 450px;
        opacity: 0;
        background-color: rgb(var(--k-white));
        z-index: 5;
        overflow-y: auto;
        transition: right .3s, opacity .3s;
    }
    .sidebar-popup.show .data-field {
        right: 0;
        opacity: 1;
    }

    .sidebar-popup .data-field::-webkit-scrollbar,
    .sidebar-popup .data-field::-webkit-scrollbar-corner,
    .sidebar-popup .data-field::-webkit-scrollbar-track-piece {background: rgb(var(--k-white));}
    .sidebar-popup .data-field::-webkit-scrollbar {width: 4px;}
    .sidebar-popup .data-field::-webkit-scrollbar-thumb {background: rgb(var(--dark-blue));}
    .sidebar-popup .data-field::-webkit-scrollbar-thumb:hover {background-color: rgb(var(--dark-gray));}
    .sidebar-popup .data-field::-webkit-scrollbar-thumb:active {background-color: rgb(var(--light-gray));}

    .sidebar-popup .data-field .modal-header span {
        font-size: 16px;
        font-weight: 600;
    }
    .sidebar-popup .data-field .modal-header i {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 20px;
        height: 20px;
        font-size: 20px;
        color: red;
    }
    .sidebar-popup .data-field .modal-header i:hover {color: rgb(var(--dark-blue));}

    .sidebar-popup .data-field input.bg-danger:focus {
        box-shadow: none;
        outline: none;
        border: none;
        color: var(--light);
    }

    .sidebar-popup .data-field button[type='submit']:disabled {
        background-color: var(--gray);
        cursor: not-allowed;
    }

    .sidebar-popup .groups option:disabled {
        background-color: rgba(220,53,69,.8);
        color: rgb(var(--k-white));
    }
/* * Sidebar Popup */

/* * Login */
    .login-wrapper {height: 100%;}
    .login-wrapper .login-column {
        max-width: 480px;
        justify-content: space-between;
        align-items: center;
        border-right: 2px solid rgba(var(--dark-gray), .3);
    }

    .login-wrapper .login-column .input-fields {
        justify-content: center;
        position: relative;
        top: -50px;
        padding: 0 32px;
    }

    .login-wrapper .login-column .input-fields .row {
        width: 100%;
        padding: 0 24px;
        margin-left: auto;
        margin-right: auto;
    }

    .login-wrapper .login-column .input-fields .row .login-header {
        font-size: 20px;
        font-weight: 600;
    }
    .login-wrapper .login-column .input-fields .row .input-header {font-weight: 600;}
    .login-wrapper .login-column .input-fields .row .password-recovery {color: rgb(var(--light-gray));}

    .login-wrapper .login-column .input-fields input {
        border-radius: 3px;
        padding: 7px 14px;
        border: 1px solid rgb(var(--light-gray));
        outline: none;
        transition: border-color .3s;
    }

    .login-wrapper .login-column .input-fields input::placeholder {color: rgb(var(--light-gray));}

    .login-wrapper .login-column .input-fields input:focus {border-color: rgb(var(--dark-gray));}

    .login-wrapper .image-column {
        width: calc(100% - 480px);
        height: 100%;
        background: no-repeat url('https://images.pexels.com/photos/7102/notes-macbook-study-conference.jpg?auto=compress&cs=tinysrgb&dpr=3&h=750&w=1260');
        background-size: cover;
    }
/* * Login */

/* * Dashboard */
    .universal-wrapper .card-body.dedicated {
        justify-content: center;
        max-height: 200px;
        min-height: 200px;
        padding-top: 0;
        padding-bottom: 0;
    }
/* * Dashboard */

/* * Profile */
    .profile-wrapper {
        width: 100%;
        padding: 0 15px 5px 30px;
    }

    .profile-wrapper .title-section,
    .profile-wrapper .data-section,
    .profile-wrapper .password-section {
        padding: 25px;
        background-color: rgb(var(--k-white));
        box-shadow: 0 0 35px rgba(154,161,171,.15);
    }

    .profile-wrapper .title-section {
        width: 100%;
        min-height: 100px;
    }

    .profile-wrapper .data-section,
    .profile-wrapper .password-section {width: 80%;}

    .profile-wrapper .data-section > span {
        font-weight: 600;
        font-size: 18px;
        margin-bottom: 15px;
    }

    .profile-wrapper .data-section .col-md-12.d-flex {
        min-height: 70px;
    }
/* * Profile */

/* * Universal */
    .universal-wrapper {
        width: 100%;
        padding: 0 15px 5px 30px;
    }
    .universal-wrapper .top-section,
    .universal-wrapper .bottom-section,
    .universal-wrapper .communication-section,
    .universal-wrapper .evaluation-section,
    .universal-wrapper .attendance-section,
    .universal-wrapper .finances-section,
    .universal-wrapper .card-body {
        width: 100%;
        height: 100px;
        padding: 25px;
        margin-bottom: 50px;
        background-color: rgb(var(--k-white));
        box-shadow: 0 0 35px rgba(154,161,171,.15);
    }

    .universal-wrapper .top-section .left span {
        font-weight: 600;
        margin-left: 5px;
        font-size: 18px;
    }

    .add-button:not(.dropdown-item) {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 40px;
        border-radius: 28px;
        padding: 0 20px;
        border: 1px solid rgb(var(--temo-blue));
        background-color: rgb(var(--k-white));
        font-size: 14px;
        color: rgb(var(--temo-blue));
    }

    .add-button:not(.dropdown-item) i {
        font-size: 16px;
        margin: 3px 5px 0 0;
    }

    .add-button:not(.dropdown-item):hover {
        color: rgb(var(--k-white));
        background-color: rgb(var(--temo-blue));
    }

    .universal-wrapper .bottom-section {
        margin-top: 30px;
        height: auto;
    }

    .universal-wrapper .bottom-section .universal-table .top-row {
        background-color: #2f87cc;
        color:#fff;
        margin-top: 20px;
    }


p.mt-3.mb-3 {
  font-size:16px!important;
}

    .universal-wrapper .bottom-section .universal-table .top-row span {
        display: flex;
        align-items: center;
        height: 55px;
        color: #fff;
        font-weight: 600;
    }

    .universal-wrapper .bottom-section .universal-table .info-row {
        max-height: 160px;
        min-height: 80px;
        align-items: center;
        background-color: #fff;
    }

    .universal-wrapper .bottom-section .universal-table .info-row:nth-of-type(odd) {background-color: #e8f1f9;}

    .universal-wrapper .bottom-section .universal-table .info-row .col-md-7 {font-size: 12px;}

    .universal-wrapper .bottom-section .universal-table .info-row .col-md-1 > button {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 60px;
        height: 30px;
        border: 1px solid #2f87cc;
        background-color: transparent;
        border-radius: 20px;
        transition: background-color .3s;
    }
    .universal-wrapper .bottom-section .universal-table .info-row .col-md-1 > button:hover {
        background-color: #2f87cc;
    }
    .universal-wrapper .bottom-section .universal-table .info-row .col-md-1 > button i {
        font-size: 20px;
        color: rgb(var(--dark-blue));
        transition: color .3s;
    }
    .universal-wrapper .bottom-section .universal-table .info-row .col-md-1 > button:hover i {color: #fff;}
/* * Universal */

/* * Communication */
    .universal-wrapper .communication-section,
    .universal-wrapper .attendance-section,
    .universal-wrapper .evaluation-section,
    .universal-wrapper .finances-section {
        height: auto;
    }
/* * Communication */

/* * Generator */
    .universal-wrapper .student-card {
        width: 100%;
        max-height: 400px;
    }
/* * Generator */

@media (min-width: 2560px) {
    .universal-wrapper .student-card {
        width: 60%;
    }
}

.col-md-6.d-flex.align-items-center {
    min-width: 450px;
}

.material-icons.menu {
    display: none;
}

.hide-non-mobo {
    display: none !important;
}

@media (max-width: 1000px) {
    body {
        margin-top: 70px;
        height: 100vh !important;
    }
    .login-column {
        max-width: 100% !important;
        width: 100% !important;
    }
    .login-wrapper {
        width: 100%;
    }
    .image-column {
        display: none;
    }
    .input-fields {
        top: unset !important;
        min-width: auto !important;
        padding: 0 !important;
        margin: auto;
    }

    .max-w-mob {
        width: 100%;
    }

    .hide-mobo {
        display: none !important;
    }

    .hide-non-mobo {
        display: flex !important;
    }

    .d-fc-mobo {
        display: flex !important;
        flex-direction: column !important;
    }

    .sidebar-wrapper.d-fc {
        position: fixed;
        left: 0;
        top: 70px;
        max-width: initial;
        width: 100vw;
        height: calc(100% - 70px);
        transform: translateX(-100%);
        transition: transform .5s;
        z-index: 1000;
        overflow: scroll;
    }

    .sidebar-wrapper.d-fc.mobo {
        transform: translateX(0);
    }

    .navbar-wrapper {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1000;
        padding: 6px;
    }

    .navbar-wrapper .navbar-inner .navbar-left h2 {
        margin: 0 !important;
        margin-left: auto;
    }
    
    .menu-button-wrapper {
        border: 1px solid white;
        border-radius: 3px;
        padding: 10px;
        cursor: pointer;
    }
    
    .material-icons.menu {
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        transition: transform .5s;
    }

    .material-icons.menu.active {
        transform: rotate(90deg);
    }

    .sidebar-wrapper form button,
    .sidebar-wrapper form a {
        display: flex;
        align-items: center;
        padding: 0 30px;
        height: 60px;
        background-color: transparent;
        outline: none;
        border: none;
        font-size: 15px;
        color: rgb(var(--dark-gray));
        font-weight: 400;
        text-decoration: none;
        transition: color .3s;
    }

    .sidebar-wrapper form a i.material-icons.left,
    .sidebar-wrapper form button i.material-icons.left {
        width: 15px;
        margin: 3px 15px 0 0;
        font-size: 18px;
        color:#2f87cc;
    }

    .sidebar-wrapper form a i.material-icons:not(.left),
    .sidebar-wrapper form button i.material-icons:not(.left) {
        font-size: 18px;
        margin-left: auto;
        transition: transform .3s;
    }

    .sidebar-wrapper form button[aria-expanded="true"] i.material-icons:not(.left) {
        transform: rotate(90deg);
    }

    .sidebar-wrapper form button:hover,
    .sidebar-wrapper form button[aria-expanded="true"],
    .sidebar-wrapper form a:hover,
    .sidebar-wrapper form a.active {
        color: rgb(var(--temo-blue));
    }

    .content-wrapper {
        max-width: 900px;
    }

    .universal-wrapper {
        padding: 0 !important;
    }

    .universal-wrapper .bottom-section {
        padding: 0 !important;
    }

    .universal-wrapper .bottom-section .universal-table .top-row {
        margin-top: 0;
    }

    .universal-wrapper .bottom-section .universal-table .top-row span {
        padding: 12px;
        height: auto;
    }

    .universal-table span.col-md-2 {
        padding: 12px;
    }

    .mobo-dashboard {
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        padding: 0 !important;
    }

    .mobo-dashboard .card-body.dedicated {
        width: 100% !important;
    }

    .profile-wrapper {
        padding: 0;
    }

    .profile-wrapper .data-section {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 0 !important;
        width: 100%;
    }

    .profile-wrapper .data-section > .col-md-12.d-flex {
        flex-direction: column;
        margin-bottom: 20px;
    }

    .profile-wrapper .data-section > span {
        margin: 12px;
    }

    .profile-wrapper .data-section .card {
        width: auto !important;
    }
    .profile-wrapper .data-section .card-text {
        padding: 6px !important;
    }

    .profile-wrapper .data-section .fancy-btn {
        margin-bottom: 20px;
    }

    .mobo-inner-generator {
        min-width: 800px;
        padding-right: 30px !important;
    }
}