html {
     width: 100%;
}
 body {
     overflow-x: hidden !important;
}
 body.show-spinner>main {
     overflow: hidden !important;
}
/* Hide everything under body tag */
 body.show-spinner>* {
     opacity: 0;
}
/* Spinner */
 body.show-spinner::after {
     content: " ";
     display: inline-block;
     width: 30px;
     height: 30px;
     border: 2px solid rgba(0, 0, 0, 0.2);
     border-radius: 50%;
     border-top-color: rgba(0, 0, 0, 0.3);
     animation: spin 1s ease-in-out infinite;
     -webkit-animation: spin 1s ease-in-out infinite;
     left: calc(50% - 15px);
     top: calc(50% - 15px);
     position: fixed;
     z-index: 1;
}
 @keyframes spin {
     to {
         transform: rotate(360deg);
    }
}
 @-webkit-keyframes spin {
     to {
         -webkit-transform: rotate(360deg);
    }
}
 .db_profile_image{
     max-width: 50px;
     margin-right: 5px;
}
 @media (max-width:1439px) {
     .menu .main-menu {
         width: 110px;
         height: calc(100% - 90px);
    }
     .navbar .menu-button {
         width: 110px;
    }
     .navbar .navbar-right .user {
         margin-right: 50px;
    }
     .navbar {
         height: 90px;
    }
     .menu .sub-menu {
         left: 110px;
         width: 230px;
         height: calc(100% - 90px);
    }
     .menu {
         padding-top: 90px;
         height: calc(100% - 90px);
    }
     #app-container.menu-hidden main, #app-container.menu-sub-hidden main, #app-container.sub-hidden main {
         margin-left: 160px;
    }
     #app-container.main-hidden main, #app-container.menu-hidden main {
         margin-left: 50px;
    }
     #app-container.menu-main-hidden main {
         margin-left: 280px;
    }
     #app-container.menu-main-hidden.menu-hidden main {
         margin-left: 50px;
    }
     #app-container.menu-hidden .sub-menu, #app-container.menu-sub-hidden .sub-menu, #app-container.sub-hidden .sub-menu {
         transform: translateX(-370px);
    }
     #app-container.main-hidden .main-menu, #app-container.menu-hidden .main-menu {
         transform: translateX(-110px);
    }
     #app-container.main-hidden.sub-hidden .sub-menu, #app-container.menu-hidden .sub-menu {
         transform: translateX(-340px);
    }
     #app-container.main-show-temporary .main-menu {
         transform: translateX(0);
    }
     #app-container.main-show-temporary .sub-menu {
         transform: translateX(-230px);
    }
     #app-container.sub-show-temporary .sub-menu{
         transform: translateX(0);
     }
     .app-menu {
         top: 90px;
         height: calc(100% - 90px);
    }
     .app-menu .app-menu-button {
         top: 36px;
    }
     .chat-input-container {
         padding-left: 160px;
         padding-right: 330px;
    }
     .menu-sub-hidden .chat-input-container, .sub-hidden .chat-input-container {
         padding-left: 160px;
    }
     .main-hidden .chat-input-container, .menu-hidden .chat-input-container, .menu-main-hidden .chat-input-container {
         padding-left: 50px;
    }
     main {
         margin-left: 390px;
         margin-right: 50px;
         margin-top: 130px;
         margin-bottom: 30px;
    }
     .modal-left .modal-header {
         flex: 0 0 90px;
    }
     .dashboard-search .card-body {
         padding: 80px 30px 30px 30px;
    }
     .icon-cards-row .card-text {
         height: 48px;
         line-height: 18px;
    }
     .icon-cards-row .lead {
         font-size: 1.6rem;
    }
     .icon-cards-row i {
         font-size: 32px;
         line-height: 47px;
    }
     .datepicker-dropdown {
         transform: translateY(-130px);
    }
     .popover, .tooltip {
         top: -130px!important;
    }
     .modal-right .modal-header {
         flex: 0 0 90px;
    }
}
 @media (max-width:1199px) {
     .navbar .menu-button {
         width: 100px;
    }
     .navbar .navbar-right .user {
         margin-right: 40px;
    }
     .listing-card-container .listing-desc {
         height: 60px;
    }
     .menu {
         padding-top: 80px;
         height: calc(100% - 80px);
    }
     .menu .sub-menu {
         left: 100px;
         width: 230px;
         height: calc(100% - 80px);
    }
     .menu .main-menu {
         width: 100px;
         height: calc(100% - 80px);
    }
     .navbar {
         height: 80px;
         padding: 12px 0;
    }
     .library-app .drop-area .dropzone .dz-preview.dz-image-preview, .select-from-library-container .drop-area .dropzone .dz-preview.dz-image-preview {
         width: calc(50% - 32px);
    }
     .library-app .drop-area, .select-from-library-container .drop-area {
         min-height: 220px;
         height: 100%
    }
     .library-app .drop-area-container, .select-from-library-container .drop-area-container {
         margin-bottom: 1.5rem;
    }
     .mind-icons .glyph, .simple-line-icons .glyph {
         width: 16.66%
    }
     .modal-left .modal-header {
         flex: 0 0 80px;
    }
     .modal-right .modal-header {
         flex: 0 0 80px;
    }
     .progress-banner .progress-bar-banner .progressbar-text {
         font-size: 1.2rem;
         margin-bottom: .2rem;
    }
     .progress-banner .progress-bar-circle.progress-bar-banner {
         width: 80px;
         height: 80px;
    }
     .progress-banner i {
         font-size: 2rem;
         margin-bottom: .2rem;
    }
     .progress-banner .lead {
         font-size: 1.2rem;
         margin-bottom: .2rem;
    }
     .popover, .tooltip {
         top: -110px!important;
    }
     .datepicker-dropdown {
         transform: translateY(-110px);
    }
     #app-container.menu-hidden main, #app-container.menu-sub-hidden main, #app-container.sub-hidden main {
         margin-left: 140px;
    }
     #app-container.main-hidden main, #app-container.menu-hidden main {
         margin-left: 40px;
    }
     #app-container.menu-main-hidden main {
         margin-left: 270px;
    }
     #app-container.menu-main-hidden.menu-hidden main {
         margin-left: 40px;
    }
     main {
         margin-left: 370px;
         margin-right: 40px;
         margin-top: 110px;
         margin-bottom: 20px;
    }
     .main-hidden .chat-input-container, .menu-hidden .chat-input-container, .menu-main-hidden .chat-input-container {
         padding-left: 40px;
    }
     .menu-sub-hidden .chat-input-container, .sub-hidden .chat-input-container {
         padding-left: 140px;
    }
     .chat-input-container {
         padding-left: 140px;
         padding-right: 40px;
    }
     .app-row {
         padding-right: 0;
    }
     .app-menu .app-menu-button {
         top: 27px;
    }
     .app-menu {
         top: 80px;
         transform: translateX(280px);
         height: calc(100% - 80px);
    }
     #app-container.main-show-temporary .main-menu {
         transform: translateX(0);
    }
     #app-container.main-show-temporary .sub-menu {
         transform: translateX(-230px);
    }
     #app-container.main-hidden.sub-hidden .sub-menu, #app-container.menu-hidden .sub-menu {
         transform: translateX(-330px);
    }
     #app-container.main-hidden .main-menu, #app-container.menu-hidden .main-menu {
         transform: translateX(-100px);
    }
     #app-container.menu-hidden .sub-menu, #app-container.menu-sub-hidden .sub-menu, #app-container.sub-hidden .sub-menu {
         transform: translateX(-370px);
    }
     #app-container.sub-show-temporary .sub-menu{
         transform: translateX(0);
     }
    .navbar-logo img {
  	max-height: 40px;
  }
    #settings-form img {
  	max-width: 300px !important;
  }
}
 @media (max-width:991px) {
     .top-right-button-single {
         width: calc(100%);
    }
     .separator-tabs.mb-5, .separator.mb-5 {
         margin-bottom: 1rem!important;
    }
     .w-sm-100 {
         width: 100%!important;
    }
     .breadcrumb-container .breadcrumb {
         padding: 0;
    }
     .carousel-center-col {
         padding-left: 0;
         padding-right: 0;
    }
     .navbar .search {
         width: 115px;
    }
     .navbar .search input {
         width: 85%
    }
     .navbar .user .name {
         display: none;
    }
     .chat-app .scroll>div>div.card {
         float: initial!important;
         clear: both!important;
    }
     .chat-input-container .send-button {
         padding-left: .7rem;
         padding-right: .7rem;
    }
     .chat-input-container {
         height: 80px;
    }
     .chat-input-container input {
         height: 80px;
    }
     .chat-input-container .icon-button.large {
         width: 36px;
         height: 36px;
         font-size: 15px;
    }
     .list-thumbnail {
         height: 80px;
    }
     .list-thumbnail.responsive {
         width: unset;
         height: 135px;
    }
     .list-thumbnail.small {
         height: 55px;
    }
     .list-thumbnail.xsmall {
         height: 40px;
    }
     .list-thumbnail-letters {
         width: 80px;
         height: 80px;
    }
     .list-thumbnail-letters.small {
         width: 55px;
         height: 55px;
    }
     .dashboard-top-rated {
         height: unset;
    }
     .auth-card {
         flex-direction: column;
    }
     .auth-card .image-side {
         width: 100%;
         padding: 60px;
    }
     .auth-card .form-side {
         width: 100%;
         padding: 60px;
    }
     .index-card .card-body {
         padding: 60px;
    }
     .mind-icons .glyph, .simple-line-icons .glyph {
         width: 20%
    }
     .library-app .drop-area .dropzone .dz-preview.dz-image-preview, .select-from-library-container .drop-area .dropzone .dz-preview.dz-image-preview {
         width: calc(100% - 32px);
    }
     .equal-height-container .col-item .card-body {
         text-align: left;
    }
     .equal-height-container .col-item .price-top-part {
         padding-left: 0;
         padding-right: 0;
         width: 40%
    }
     .col-left {
         padding-right: 15px;
    }
     .col-right {
         padding-left: 15px;
    }
     .rounded .auth-card .image-side {
         border-bottom-right-radius: initial;
         border-bottom-left-radius: initial;
         border-top-left-radius: .75rem;
         border-top-right-radius: .75rem;
    }
     .rounded .card.auth-card {
         border-top-left-radius: 1.25rem;
         border-top-right-radius: 1.25rem;
         border-bottom-right-radius: .75rem;
         border-bottom-left-radius: .75rem;
    }
    .mind-icons .glyph,
    .simple-line-icons .glyph {
        width: 20%;
    }
    .auth-card {
        flex-direction: column;
    }
    .auth-card .image-side {
        width: 100%;
        padding: 60px;
    }
    .auth-card .form-side {
        width: 100%;
        padding: 60px;
    }
}
 @media only screen and (max-width: 767px) {
     .navbar-logo img {
         max-height: 20px !important;
    }
     .navbar .navbar-right {
         flex-basis: 20%;
         text-align: right;
    }
     #settings-form img {
         max-width: 270px !important;
    }
     h1 {
         font-size: 1.3rem;
         padding-top: .25rem;
         margin-bottom: 0;
    }
     h2 {
         font-size: 1.1rem;
    }
     h3 {
         font-size: 1rem;
    }
     h4 {
         font-size: .9rem;
    }
     h5 {
         font-size: .9rem;
    }
     h6 {
         font-size: .85rem;
    }
     .display-1 {
         font-size: 2.8rem;
    }
     .display-2 {
         font-size: 2.6rem;
    }
     .display-3 {
         font-size: 2.4rem;
    }
     .display-4 {
         font-size: 2.2rem;
    }
     .lead {
         font-size: 1.1rem;
         line-height: 1.6rem;
    }
     .float-none-xs {
         float: initial!important;
    }
     .collapse.dont-collapse-sm {
         display: block;
         height: auto!important;
         visibility: visible;
    }
     .w-xs-100 {
         width: 100%!important;
    }
     .navbar .search {
         width: 30px;
         height: 30px;
         background: initial;
         margin-left: .6rem;
         color: #878787;
    }
     .navbar .search input {
         display: none;
    }
     .navbar .search .search-icon {
         font-size: 17px;
         width: 30px;
         height: 30px;
         bottom: -3px;
         right: 0;
         color: inherit;
    }
     .navbar .search.mobile-view {
         display: block;
         width: 100%;
         position: fixed;
         z-index: 2;
         background: #fff;
         left: 0;
         top: 0;
         height: 70px;
         margin-left: 15px;
    }
     .navbar .search.mobile-view input {
         display: block;
         width: 100%;
         height: 70px;
         padding-left: 0;
    }
     .navbar .search.mobile-view span {
         top: 50%;
         transform: translateY(-50%);
         right: 25px;
    }
     .newsletter-input-container button {
         padding: 1rem 1.5rem .9rem;
    }
     .navbar .menu-button-mobile {
         width: 20px;
    }
     .navbar .menu-button {
         width: 60px;
    }
     .navbar .navbar-right .user {
         margin-right: 15px;
    }
     .navbar .user {
         margin-left: initial;
    }
     .navbar .user img {
         width: 30px;
    }
     .navbar .user:after {
         font-size: 11px;
         width: 14px;
         height: 14px;
         bottom: -3px;
         right: -3px;
    }
     .navbar {
         height: 70px;
    }
     .logo {
         width: 80px;
    }
     .menu .main-menu {
         width: 90px;
         height: calc(100% - 70px);
    }
     .menu .main-menu ul li i {
         font-size: 26px;
         line-height: 30px;
    }
     .menu .main-menu ul li a {
         height: 90px;
         text-align: center;
    }
     .menu .main-menu ul li.active:after {
         width: 3px;
         height: 60px;
    }
     .menu .sub-menu {
         left: 90px;
         width: 230px;
         height: calc(100% - 70px);
    }
     .menu {
         padding-top: 70px;
         height: calc(100% - 70px);
         box-shadow: 0 1px 15px rgba(0, 0, 0, .04), 0 1px 6px rgba(0, 0, 0, .04);
    }
     #app-container.menu-hidden .sub-menu, #app-container.menu-sub-hidden .sub-menu, #app-container.sub-hidden .sub-menu {
         transform: translateX(-370px);
    }
     #app-container.main-hidden .main-menu, #app-container.menu-hidden .main-menu {
         transform: translateX(-90px);
    }
     #app-container.main-hidden.sub-hidden .sub-menu, #app-container.menu-hidden .sub-menu {
         transform: translateX(-320px);
    }
     #app-container.main-show-temporary .sub-menu {
         transform: translateX(-230px);
    }
     #app-container.sub-show-temporary .sub-menu{
         transform: translateX(0);
     }
     .app-menu {
         top: 70px;
         height: calc(100% - 70px);
    }
     .app-menu .app-menu-button {
         top: 13px;
    }
     .app-menu ul li i {
         font-size: 20px;
    }
     .chat-app .scroll>div>div.card {
         margin-right: initial!important;
    }
     .chat-app .list-item-heading {
         font-size: .9rem;
    }
     .chat-app .card .card-body {
         padding: .75rem;
    }
     .chat-heading .card-body {
         padding: .5rem!important;
    }
     .chat-input-container {
         padding-right: 15px;
         padding-left: 15px;
    }
     .chat-input-container {
         height: 60px;
    }
     .chat-input-container input {
         height: 60px;
    }
     .chat-input-container .icon-button.large {
         width: 32px;
         height: 32px;
         font-size: 13px;
    }
     .menu-sub-hidden .chat-input-container, .sub-hidden .chat-input-container {
         padding-right: 15px;
         padding-left: 15px;
    }
     .main-hidden .chat-input-container, .menu-hidden .chat-input-container, .menu-main-hidden .chat-input-container {
         padding-right: 15px;
         padding-left: 15px;
    }
     main {
         margin-left: 15px!important;
         margin-right: 15px!important;
         margin-top: 80px!important;
         margin-bottom: 0;
    }
     .datepicker-dropdown {
         transform: translateY(-85px);
    }
     .page-item {
         padding: 3px;
    }
     .pagination-lg .page-item {
         padding: 3px;
    }
     .pagination-lg .page-item .page-link {
         min-width: 38px;
         height: 38px;
         padding: .55rem 0;
         line-height: 1.5;
         font-size: .8rem;
    }
     .pagination-sm .page-item {
         padding: 3px;
    }
     .popover, .tooltip {
         top: -80px!important;
    }
     .modal-right .modal-header {
         flex: 0 0 70px;
    }
     .modal-left .modal-header {
         flex: 0 0 70px;
    }
     .auth-card p.h2 {
         font-size: 1.6rem;
    }
     .mind-icons .glyph, .simple-line-icons .glyph {
         width: 25%
    }
     i.large-icon {
         line-height: 70px;
    }
     .large-icon.initial-height {
         line-height: initial;
    }
     .feature-row {
         margin-top: 40px;
    }
     .glide.thumbs {
         width: 300px;
    }
     .glide.details img {
         max-height: 400px;
    }
    .components-image {
        width: 1200px;
    }
    .mind-icons .glyph,
    .simple-line-icons .glyph {
        width: 25%;
    }
    .menu {
        padding-top: 70px;
        height: calc(100% - 70px);
        box-shadow: 0 1px 15px rgba(0, 0, 0, 0.04), 0 1px 6px rgba(0, 0, 0, 0.04);
    }
}
 @media (max-width:575px) {
     .dataTables_wrapper .paginate_button.page-item {
         padding-left: 0 !important;
         padding-right: 0 !important;
     }
     .page-item .page-link {
         padding: 9px 10px !important;
         margin-right: 3px !important;
     }
     .dt-page-jump .dt-page-jump-select{
         float: none !important;
         margin-bottom: 10px;
     }
     .top-right-button-container {
         float: initial;
         display: flex;
         justify-content: space-between;
    }
     .top-right-button-container .top-right-button {
         display: flex;
         flex-grow: 1;
         justify-content: center;
         align-items: center;
    }
     .navbar .header-icons {
         margin-right: 0;
    }
     .navbar .header-icon {
         padding-left: .3rem;
         padding-right: .3rem;
    }
     .navbar .header-icon#notificationButton .count {
         right: -1px;
    }
     main {
         margin-bottom: 0;
    }
     .card .card-body {
         padding: 1.5rem;
    }
     .card-img-overlay {
         padding: 1rem;
    }
     .card-top-buttons {
         padding: .35rem;
    }
     .list-thumbnail {
         height: 70px;
    }
     .list-thumbnail.responsive {
         width: 110px!important;
         height: 100%
    }
     .list-thumbnail.small {
         height: 50px;
    }
     .list-thumbnail.xsmall {
         height: 40px;
    }
     .list-thumbnail-letters {
         width: 70px;
         height: 70px;
    }
     .list-thumbnail-letters.small {
         width: 50px;
         height: 50px;
    }
     .fc-basic-view .fc-body .fc-row {
         min-height: 3em;
    }
     .sw-main>.btn-toolbar.sw-toolbar.sw-toolbar-bottom {
         padding: 1.5rem;
    }
     .page-item .page-link {
         min-width: 30px;
         height: 30px;
         line-height: .9;
         font-size: .76rem;
    }
     .auth-card {
         flex-direction: column;
    }
     .auth-card .image-side {
         padding: 35px 30px;
    }
     .auth-card .form-side {
         padding: 35px 30px;
    }
     .auth-card .logo-single {
         margin-bottom: 20px;
    }
     .auth-card p.h2 {
         font-size: 1.4rem;
    }
     .index-card .card-body {
         padding: 35px 30px;
    }
     .pagination-lg .page-item .page-link {
         min-width: 30px;
         height: 30px;
         line-height: .9;
         font-size: .76rem;
    }
     .mind-icons .glyph, .simple-line-icons .glyph {
         width: 50%
    }
     .library-app .preview-area, .select-from-library-container .preview-area {
         height: auto;
    }
     .library-app .preview-area .card-img-top, .select-from-library-container .preview-area .card-img-top {
         height: 180px;
         width: 100%;
         object-fit: cover;
    }
     .library-app .preview-area .video-view, .select-from-library-container .preview-area .video-view {
         height: 180px;
         width: 100%
    }
     .library-app .media-thumb-container, .select-from-library-container .media-thumb-container {
         padding: 1.5rem;
    }
     .equal-height-container .col-item .card-body {
         text-align: center;
    }
     .equal-height-container .col-item .price-top-part {
         width: initial;
    }
     .glide.thumbs {
         width: calc(100% - 80px);
    }
     .glide.details img {
         max-height: 300px;
    }
    .auth-card {
        flex-direction: column;
    }
    .auth-card .image-side {
        padding: 35px 30px;
    }
    .auth-card .form-side {
        padding: 35px 30px;
    }
    .auth-card .logo-single {
        margin-bottom: 20px;
    }
    .auth-card p.h2 {
        font-size: 1.4rem;
    }
    .list-thumbnail.responsive {
        width: 110px !important;
        height: 100%;
    }
}
 @media (max-width:419px) {
     .list-thumbnail.responsive {
         width: 90px!important;
         height: 100%
    }
     .glide.details img {
         max-height: 200px;
    }
    .navbar-logo img {
  	max-height: 20px !important;
  }
  .list-thumbnail.responsive {
      width: 90px !important;
      height: 100%;
  }
}

.menu-default.sub-hidden{

}
table tr.student_evaluation{
    background: #f3f3f3;
    position: relative;
}
table tr.student_evaluation td:before{
    content: "\e04a";
    font-family: 'simple-line-icons';
    position: absolute;
    font-size: 29px;
    color: #9d9d9d;
    left: 15px;
}
table tr.student_evaluation td{
    padding-left: 60px;
}
.modal .modal-body, .modal .modal-footer, .modal .modal-header{
    padding: 1rem 1rem;
}
table tr.student_evaluation p{
    word-break: break-word;
}
@media (max-width: 1560px){
    .navbar-logo img {
        max-height: 30px !important;
    }
}
@media (max-width: 767px){
    .navbar-logo img {
        max-height: 20px !important;
    }
}

.navbar-logo img{
    max-height: 50px;
}
@media (max-width: 1260px) {
    .overflow-x {
        overflow-x: auto;
    }
}
.form-control.bs-timepicker{
    min-width: 65px;
}