﻿@charset "UTF-8";
/*@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic);*/
/*#72afd2*/
/*body {
    color: $primary-color;
}*/
/*@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic);*/
/*#72afd2*/
/*body {
    color: $primary-color;
}*/

:root {
    --primary-color: #206e87 ;
    --main-color: #206e87 ;
    --secondary-color: #206e87 ;
    --third-color: #24B0BF;
}


html {
    scrollbar-width: thin;
    scrollbar-color: #206e87  #f8f8f8;
}

@font-face {
    font-family: 'open_sansbold';
    src: url("../../EduDesignFiles/fonts/opensans-bold-webfont.eot");
    src: url("../../EduDesignFiles/fonts/opensans-bold-webfont.eot?#iefix") format("embedded-opentype"), url("../../EduDesignFiles/fonts/opensans-bold-webfont.woff") format("woff"), url("../../EduDesignFiles/fonts/opensans-bold-webfont.ttf") format("truetype"), url("../../EduDesignFiles/fonts/opensans-bold-webfont.svg#open_sansbold") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sanslight';
    src: url("../../EduDesignFiles/fonts/opensans-light-webfont.eot");
    src: url("../../EduDesignFiles/fonts/opensans-light-webfont.eot?#iefix") format("embedded-opentype"), url("../../EduDesignFiles/fonts/opensans-light-webfont.woff") format("woff"), url("../../EduDesignFiles/fonts/opensans-light-webfont.ttf") format("truetype"), url("../../EduDesignFiles/fonts/opensans-light-webfont.svg#open_sanslight") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sansregular';
    src: url("../../EduDesignFiles/fonts/opensans-regular-webfont.eot");
    src: url("../../EduDesignFiles/fonts/opensans-regular-webfont.eot?") format("embedded-opentype"), url("../../EduDesignFiles/fonts/opensans-regular-webfont.woff") format("woff"), url("../../EduDesignFiles/fonts/opensans-regular-webfont.ttf") format("truetype"), url("../../EduDesignFiles/fonts/opensans-regular-webfont.svg") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DroidArabicNaskh';
    src: url("../../EduDesignFiles/fonts/DroidArabicNaskh.eot") format("embedded-opentype");
    src: url("../../EduDesignFiles/fonts/DroidArabicNaskh.woff") format("woff"), url("../../EduDesignFiles/fonts/DroidArabicNaskh.ttf") format("truetype"), url("../../EduDesignFiles/fonts/DroidArabicNaskh.svg#DroidArabicNaskh") format("svg");
    font-weight: normal;
    font-style: normal;
    line-height: 1.4em;
}

@font-face {
    font-family: 'DroidNaskhBold';
    src: url("../../EduDesignFiles/fonts/DroidNaskhBold.eot");
    src: local("../../EduDesignFiles/fonts/DroidNaskhBold"), url("../../EduDesignFiles/fonts/DroidNaskhBold.woff") format("woff"), url("../../EduDesignFiles/fonts/DroidNaskhBold.ttf") format("truetype");
    line-height: 1.4em;
}

@font-face {
    font-family: 'itgIconsFont';
    src: url("../../EduWavek12Portal/Styles/fonts/itgicons-font.eot") format("embedded-opentype");
    src: url("../../EduWavek12Portal/Styles/fonts/itgicons-font.woff") format("woff"), url("../../EduWavek12Portal/Styles/fonts/itgicons-font.ttf") format("truetype"), url("../../EduWavek12Portal/Styles/fonts/itgicons-fonts.svg#itg-font") format("svg");
    font-weight: normal;
    font-style: normal;
}
@font-face {
   font-family: 'Cairo Regular';
    src: url("../../EduDesignFiles/fonts/Cairo-Regular.eot") format("embedded-opentype");
    src: url("../../EduDesignFiles/fonts/Cairo-Regular.woff") format("woff"), url("../../EduDesignFiles/fonts/Cairo-Regular.ttf") format("truetype"), url("../../EduDesignFiles/fonts/Cairo-Regular.svg") format("svg");
    font-weight: normal;
    font-style: normal;
}

html, body {
    min-height: 100%;
   font-family: 'Cairo Regular' !important;
}

.layout-boxed html,
.layout-boxed body {
    height: 100%;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
   font-family: 'Cairo Regular';
    font-weight: 400;
    overflow-x: hidden;
    overflow-y: auto;
    margin: 0 !important;
    padding: 0 !important;
}

.fa-time-in-alt::before {
    content: "\f252";
}

.wrapper {
    min-height: 100%;
    position: relative;
    overflow: hidden;
}

    .wrapper:before,
    .wrapper:after {
        content: " ";
        display: table;
    }

    .wrapper:after {
        clear: both;
    }

.layout-boxed .wrapper {
    max-width: 1250px;
    margin: 0 auto;
    min-height: 100%;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
    position: relative;
}

.layout-boxed {
    background: url("../img/boxed-bg.jpg") repeat fixed;
}

.content-wrapper,
.right-side,
.main-footer {
    -webkit-transition: -webkit-transform .3s ease-in-out, margin .3s ease-in-out;
    -moz-transition: -moz-transform .3s ease-in-out, margin .3s ease-in-out;
    -o-transition: -o-transform .3s ease-in-out, margin .3s ease-in-out;
    transition: transform .3s ease-in-out, margin .3s ease-in-out;
    margin-left: 230px;
    z-index: 820;
}

.layout-top-nav .content-wrapper,
.layout-top-nav .right-side,
.layout-top-nav .main-footer {
    margin-left: 0;
}

@media (max-width: 767px) {
    .content-wrapper,
    .right-side,
    .main-footer {
        margin-left: 0;
    }
}

@media (min-width: 768px) {
    .sidebar-collapse .content-wrapper,
    .sidebar-collapse .right-side,
    .sidebar-collapse .main-footer {
        margin-left: 0;
    }
}

@media (max-width: 767px) {
    .sidebar-open .content-wrapper,
    .sidebar-open .right-side,
    .sidebar-open .main-footer {
        -webkit-transform: translate(230px, 0);
        -ms-transform: translate(230px, 0);
        -o-transform: translate(230px, 0);
        transform: translate(230px, 0);
    }
}

.content-wrapper,
.right-side {
    min-height: 100%;
    background-color: #ecf0f5;
    z-index: 800;
}

.main-footer {
    background: #fff;
    padding: 15px;
    color: #444;
    border-top: 1px solid #d2d6de;
}

.fixed .eduwaveHeader,
.fixed .main-sidebar,
.fixed .left-side {
    position: fixed;
}

.fixed .eduwaveHeader {
    top: 0;
    right: 0;
    left: 0;
}

.fixed .content-wrapper,
.fixed .right-side {
    padding-top: 50px;
}

@media (max-width: 767px) {
    .fixed .content-wrapper,
    .fixed .right-side {
        padding-top: 100px;
    }
}

.fixed.layout-boxed .wrapper {
    max-width: 100%;
}

body.hold-transition .content-wrapper,
body.hold-transition .right-side,
body.hold-transition .main-footer,
body.hold-transition .main-sidebar,
body.hold-transition .left-side,
body.hold-transition .eduwaveHeader > .navbar,
body.hold-transition .eduwaveHeader .logo {
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
}

.content:not(.coursepagecontent) {
    min-height: 100%;
    padding: 0;
    padding-bottom: 0;
    margin-right: auto;
    margin-left: auto;
    padding-left: 0;
    padding-right: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
   font-family: 'Cairo Regular';
}

a {
    color: #206e87 ;
}

    a:hover,
    a:active,
    a:focus {
        outline: none;
        text-decoration: none;
        color: #206e87;
    }

.itg_dashboard_page-header {
    margin: 10px 0 20px 0;
    font-size: var(--font-22, 22px);
}

.page-header > small {
    color: #666;
    display: block;
    margin-top: 5px;
}

.content-header {
    position: relative;
    padding: 15px 15px 0 15px;
}

    .content-header > h1 {
        margin: 0;
        font-size: var(--font-24, 24px);
    }

        .content-header > h1 > small {
            font-size: var(--font-15, 15px);
            display: inline-block;
            padding-left: 4px;
            font-weight: 300;
        }

    .content-header > .breadcrumb {
        float: right;
        background: transparent;
        margin-top: 0;
        margin-bottom: 0;
        font-size: var(--font-12, 12px);
        padding: 7px 5px;
        position: absolute;
        top: 15px;
        right: 10px;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        -ms-border-radius: 2px;
        border-radius: 2px;
    }

        .content-header > .breadcrumb > li > a {
            color: #444;
            text-decoration: none;
            display: inline-block;
        }

            .content-header > .breadcrumb > li > a > .fa,
            .content-header > .breadcrumb > li > a > .glyphicon,
            .content-header > .breadcrumb > li > a > .ion {
                margin-right: 5px;
            }

        .content-header > .breadcrumb > li + li:before {
            content: '>\00a0';
        }
.box.box-warning .box-footer {
    display: flex;
    width: 100%;
}
.box-comments .fa-send:before {
    font-family: 'Font Awesome 5 Free', 'FontAwesome', 'Font Awesome 5 Regular' !important;
    content: "\f1d8" !important;
    font-size: 20px;
    color: #fff;
    position: relative;
    top: -2px;
}
.box-footer.send-comment .fa-send:before {
    font-family: 'Font Awesome 5 Free', 'FontAwesome', 'Font Awesome 5 Regular' !important;
    content: "\f1d8" !important;
    font-size: 20px;
    color: var(--primary-color);
    position: relative;
    top: -2px;
}
.image-upload{
    margin: 0 5px;
}
.post-options > div:nth-child(2):has(.btn-group):not(.float-end) {
    display: flex;
    justify-content: start !important;
}
#ctl00_ctl00_cphPageBody_cphPageBody_PostsWidget1_MyCourses {
    margin: 0 !important;
}
#ctl00_ctl00_cphPageBody_cphPageBody_MyCourses {
    margin: 0 !important;
}
.btn.btn-box-tool.btn-sm.dropdown-toggle {
    height: fit-content;
    padding: 3px 10px !important;
    margin: 0 !important;
}
@media (max-width: 991px) {
    .CreateResponsive.CreateImageHotspotQuestionsPadding table table tr input {
        width: 100% !important;
    }
    .widthResponsive .TabelGrid tbody {
        width: 100%;
        display: block;
    }
        .widthResponsive .TabelGrid tbody tr {
            display: table;
            width: 100%;
            table-layout: fixed;
        }
    .CreateResponsive.CreateImageHotspotQuestionsPadding table table tr {
        width: 100% !important;
        display: block !important;
    }
    .courseContentTabs .nav-tabs > li > a.nav-link.active::before {
        height: 2px !important;
        bottom: 0 !important;
        left: 0 !important;
    }
    #divCourseHomeContent .content.container.col-md-8.coursepage.coursepagecontent table {
        width: 100% !important;
    }
    .TitleWithButtons #buttons.bUttonCalender {
        display: flex !important;
    }
    /*    #divCourseHomeContent #FolderListContainer div {
        width: revert-rule !important;
    }*/
    .tableInputwidth #ctl00_ctl00_cphPageBody_cphMain_ddlEventTypeAdd_Input {
        width: inherit !important;
    }
    .tableInputwidth td{
        display: flex ; 
    }
    .tableInputwidth td .labelsStyle {
        width: fit-content;
    }
    .CreateImageHotspotQuestionsPadding .tableinputDate table tr {
        display: flex !important;
    }
    #ctl00_ctl00_cphPageBody_cphPageBody_ucCourseTemplate_rblCourseIcons,
    #ctl00_ctl00_cphPageBody_cphPageBody_ucCourseTemplate_rblCourseIcons tbody {
        display: flex !important;
        flex-wrap: wrap !important;
        width: 100% !important;
    }

        #ctl00_ctl00_cphPageBody_cphPageBody_ucCourseTemplate_rblCourseIcons td {
            display: inline-block !important;
            width: auto !important;
            min-width: 80px !important;
            flex: 0 1 auto !important;
            padding: 10px !important;
            border: none !important;
        }
    .info_postion .FileUploaderStyle {
        display: flex !important;
    }
        .info_postion .FileUploaderStyle .__fileupload-Aathar {
            display: inline !important;
            margin: 0 15px;
            top: -4px;
        }
    #ctl00_ctl00_cphPageBody_cphPageBody_ucCourseTemplate_imgCourseImage {
       top: 0 !important;
    }
    .WideGrid table {
        word-wrap: normal !important;
        width: auto !important;
        display: block;
        overflow-x: auto;
    }
    .FlexSetting {
        position: relative !important;
        top: -10px !important;
    }
    .tab-content{
        padding: 0  !important;
    }
    .writePostWarper .post-options {
        top: 0 !important;
    }
    .buttonSocial .btnLike, .btnLike:hover {
        padding: 2px 15px !important;
        font-size: 14px !important;
    }
    .buttonSocial > div{
        display: flex !important ;
    }
    .inputSocial .btn.btnComment:not(.circleBtn) > i::before {
        left: 15px !important;
    }
    #divCourseHomeContent table td:empty {
        display: none;
    }

    #trBadgesHeader .MH_badgeImageContainer {
        position: relative;
        left: 0 !important;
    }
 
    #calendar td.fc-header-right {
        display: flex !important;
        align-items: center;
        justify-content: flex-start;
    }
    .labelsStyle {
        width: 100%;
    }
    .section.wrapper.eduwaveContent .coursepagecontent td > div {
        max-width: 100% !important;
        text-align: center;
    }
    .PeopleCoursePeriod [id*="lblClassValue"] {
        word-wrap: break-word;
        display: block;
        max-width: 132px;
        text-align: center;
        margin: auto;
    }

    .CreateImageHotspotQuestionsPadding table table tr {
/*        display: flex !important;*/
    }
        .CreateImageHotspotQuestionsPadding table table tr input {
            width: auto !important;
        }
    .Notification-item-wrapper {
        min-width: 100% !important;
    }
    .Notification-item-close {
        left: 25px !important;
        right: auto !important;
    }
    .GridPagination.TableRowStyle tr{
        display: flex ;
    }

    .Notification-position-MiddleCenter {
        position: fixed;
        left: 0 !important;
        right: 0 !important;
    }
    .Notification-container {
        width: 100% !important;
    }
    .post-options.float-end {
        padding-right: 42px;
    }
    .tableHeaderCell #tblGridviewRow td {
        width: 100% !important;
    }
    .fa-send:before {
        font-family: 'Font Awesome 5 Free', 'FontAwesome', 'Font Awesome 5 Regular' !important;
        content: "\f1d8" !important;
        font-size: 20px;
        color: #fff;
        position: relative;
        top: -2px;
    }
    .btn.btn-primary.btn-flat.btnComment:hover .fa-send::before {
        color: var(--primary-color) !important;
    }
    .box-footer.send-comment .fa-send:before {
        font-family: 'Font Awesome 5 Free', 'FontAwesome', 'Font Awesome 5 Regular' !important;
        content: "\f1d8" !important;
        font-size: 20px;
        color: var(--primary-color);
        position: relative;
        top: -2px;
    }
    .content-header > .breadcrumb {
        position: relative;
        margin-top: 5px;
        top: 0;
        right: 0;
        float: none;
        background: #d2d6de;
        padding-left: 10px;
    }
    #ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin{
        overflow: auto;
    }
    #ctl00_ctl00_cphPageBody_UpdatePanel1 .bread-crumb-links {
        justify-content: center;
        align-items: center;
        flex-direction: column;
        display: flex;
    }
    #ctl00_ctl00_cphPageBody_cphPageBody_pnlContent{
        overflow: auto !important;
    }
    #ctl00_ctl00_cphPageBody_UpdatePanel1 .float-start {
        margin: 10px 0 5px;
    }
    #ctl00_ctl00_cphPageBody_UpdatePanel1 .bread-crumb-links .TitleWithButtons.float-end {
        margin: 10px 1px 24px;
    }
    .ContentLibraryMgtPadding .TabelGrid tr td #gvLibraryGrid {
        display: block !important;
    }
        .ContentLibraryMgtPadding .TabelGrid tr td #gvLibraryGrid .LibraryDiv {
            margin: 10px 0;
        }
        .ContentLibraryMgtPadding .TabelGrid tr td #gvLibraryGrid .TitleWithButtons #buttons input[type="submit"] {
            margin: 5px 0;
        }
    #ctl00_ctl00_cphPageBody_cphPageBody_pnlAddEditGroup  .__fileupload-Aathar {
        margin: 0 5px !important;
    }
    #ctl00_ctl00_cphPageBody_cphPageBody_pnlAddEditGroup .FileUploaderStyle {
        display: flex;
        justify-content: center;
        align-items: baseline;
        padding-top: 1px;
    }
    .Notification-position-MiddleCenter {
        margin-left: -120px !important;
    }
    #ctl00_ctl00_cphPageBody_cphPageBody_ucLearningStandardItem_ucLearningStandardDocuments_rblViewMode td {
        margin: 10px 0;
    }
    .CreateImageHotspotQuestionsPadding {
        margin: 15px 0;
        overflow: auto;
    }
    #tblLearnersBadges.TabelGrid .MH_badgeImageContainer {
        position: relative;
        left: 36%;
    }
    .wideGridInDiv .WideGrid .TabelGrid tr td span {
        width: 32px !important;
    }
        .PeopleCoursePeriod .userSmallInfo {
            margin-right: 0;
            margin-left: .3%;
            margin-top: 15px;
        }


        #ctl00_ctl00_cphPageBody_cphPageBody_divNewDesginContainer.CourseColumnContent {
            width: 100% !important
        }

        .show-settings.btn.btn-primary {
            margin: 20px 0;
        }

        .writePostWarper {
            background-color: #fff;
            padding: 15px;
            border-radius: 9px;
        }

        .wrapper .page-title {
            margin: 0px 0px 15px !important;
            padding: 0px 10px 0;
        }

        .userSmallInfo td {
            padding: 0 !important;
        }

        .modal-footer div {
            display: block;
            width: 100%;
        }

            .modal-footer div button {
                display: block;
                width: 100%;
                margin: 10px 0;
            }

        .navbar-header button {
            margin: 5px 16px 5px 0;
            background-color: #fff;
        }

        .content-header > .breadcrumb li:before {
            color: #97a0b3;
        }
    }

    .navbar-toggle {
        color: #fff;
        border: 0;
        margin: 0;
        padding: 15px 15px;
    }

    @media (max-width: 991px) {
        .navbar-custom-menu .navbar-nav > li {
            float: left;
        }

        .navbar-custom-menu .navbar-nav {
            margin: 0;
            float: left;
        }

            .navbar-custom-menu .navbar-nav > li > a {
                padding-top: 15px;
                padding-bottom: 15px;
                line-height: 20px;
            }
    }
.AudioStyle {
    display: block;
    margin: 35px auto;
    text-align: center;
}
.AudioStyle table {
    margin: auto;
}
.ModifySStyle{
    padding: 15px ;
}
.tableSttyle .TitleWithButtons {
    display: block !important;
}
.popUpLearing {
    display: flex !important;
}
    .popUpLearing a {
        background: var(--secondary-color) !important;
        width: 20px !important;
        height: 20px !important;
        display: flex !important;
        justify-content: center;
        align-items: center;
        color: #fff;
        font-size: 25px;
        border-radius: 8px;
        position: relative !important;
        top: 0 !important;
        right: 0 !important;
    }
.popUpLearing span{
    margin: 0 5px ; 
}
    .tableSttyle .textSttylee {
        display: flex !important;
    }
.tableSttyle .labelsStyle {

    width: fit-content;
}
.ButtonStudy .btnEdit {
    padding: 0px 40px;
    height: 40px;
    -webkit-transition: background-color 0.5s ease-in-out;
    -moz-transition: background-color 0.5s ease-in-out;
    -ms-transition: background-color 0.5s ease-in-out;
    -o-transition: background-color 0.5s ease-in-out;
    transition: background-color 0.5s ease-in-out;
    background-color: #206e87;
    color: #ffffff;
    border: 0 none;
    cursor: pointer;
    outline: 0;
    margin-bottom: 5px;
    font-size: var(--font-14, 14px);
    margin: 1px;
    background: var(--secondary-color);
    border-radius: 16px !important;
}
 
    .ButtonStudy .btnDelete {
        background: rgba(152, 27, 37, 0.04) !important;
        border: 1px solid rgba(152, 27, 37, 1);
        color: rgba(152, 27, 37, 1);
        padding: 0px 50px;
        height: 40px;
        -webkit-transition: background-color 0.5s ease-in-out;
        -moz-transition: background-color 0.5s ease-in-out;
        -ms-transition: background-color 0.5s ease-in-out;
        -o-transition: background-color 0.5s ease-in-out;
        transition: background-color 0.5s ease-in-out;
        background-color: #206e87;
        cursor: pointer;
        outline: 0;
        margin-bottom: 5px;
        font-size: var(--font-14, 14px);
        border-radius: 16px !important;
        margin: 1px;
    }
        .ButtonStudy .btnEdit input, .ButtonStudy .btnDelete input {
            background-color: transparent !important;
            border: 0 !important;
            padding: 0 !important ;
        }
@media (max-width: 767px) {
    #gvLibraryGrid #buttons.ButtonStudy {
            display: block !important;
        }
            #gvLibraryGrid #buttons.ButtonStudy div {
                position: relative;
                width: fit-content;
            }
        .ButtonStudy .btnEdit:before {
            color: #ffffff;
            position: absolute;
            right: 13px;
        }
        .ButtonStudy .btnBody:before {
            position: absolute;
            right: 13px;
        }
      
        .eduwaveHeader {
            position: relative;
        }
        .userSmallInfo table table tbody > tr {
            display: flex;
            justify-content: center;
            align-items: center;
            position: relative;
        }
        .ImsgButton.peoplelist-tools {
            text-align: right !important;
          
        }
       
        .userSmallInfo .text-end {
            width: 10px !important;
            position: absolute;
            left: 35%;
        }
        .userSmallInfo h2{
            text-align: center ;
        }
        .userSmallInfo td{
            width: 100% !important;
        }
        #ctl00_ctl00_cphPageBody_cphPageBody_rblCourseIcons tbody {
            display: flex;
            justify-content: space-between;
        }
            .eduwaveHeader .logo,
            .eduwaveHeader .navbar {
                width: 100%;
                float: none;
            }

            .eduwaveHeader .navbar {
                margin: 0;
            }

            .eduwaveHeader .navbar-custom-menu {
                float: right;
            }
    }

    @media (max-width: 991px) {
        .main-panel-noSideBar.MarginWrapper .section.wrapper.eduwaveContent .container-fluid {
            display: inline-block !important;
        }
            .main-panel-noSideBar.MarginWrapper .section.wrapper.eduwaveContent .container-fluid .product-title .Course-name {
                text-wrap: wrap !important;
            }
        .navbar-collapse.pull-left {
            float: none !important;
        }

            .navbar-collapse.pull-left + .navbar-custom-menu {
                display: block;
                position: absolute;
                top: 0;
                right: 40px;
            }
    }

    .main-sidebar,
    .left-side {
        /*position: absolute;
  top: 0;
  left: 0;
  padding-top: 50px;*/
        min-height: 100%;
        /*width: 230px;*/
        width: 100%;
        z-index: 810;
        -webkit-transition: -webkit-transform .3s ease-in-out, width .3s ease-in-out;
        -moz-transition: -moz-transform .3s ease-in-out, width .3s ease-in-out;
        -o-transition: -o-transform .3s ease-in-out, width .3s ease-in-out;
        transition: transform .3s ease-in-out, width .3s ease-in-out;
    }

    @media (max-width: 767px) {
        .main-sidebar,
        .left-side {
            padding-top: 100px;
        }
    }

    @media (max-width: 767px) {
        .main-sidebar,
        .left-side {
            -webkit-transform: translate(-230px, 0);
            -ms-transform: translate(-230px, 0);
            -o-transform: translate(-230px, 0);
            transform: translate(-230px, 0);
        }
    }

    @media (min-width: 768px) {
        .sidebar-collapse .main-sidebar,
        .sidebar-collapse .left-side {
            -webkit-transform: translate(-230px, 0);
            -ms-transform: translate(-230px, 0);
            -o-transform: translate(-230px, 0);
            transform: translate(-230px, 0);
        }
    }

    @media (max-width: 767px) {
        .sidebar-open .main-sidebar,
        .sidebar-open .left-side {
            -webkit-transform: translate(0, 0);
            -ms-transform: translate(0, 0);
            -o-transform: translate(0, 0);
            transform: translate(0, 0);
        }


        .row > * {
            flex-shrink: 0 !important;
            width: 100% !important;
            max-width: 100% !important;
            padding-left: calc(var(--bs-gutter-x) * .5) !important;
            padding-right: calc(var(--bs-gutter-x) * .5) !important;
            margin-top: var(--bs-gutter-y) !important;
        }
    }

    .sidebar {
        padding-bottom: 10px;
    }

    .sidebar-form input:focus {
        border-color: transparent;
    }

    .user-panel {
        position: relative;
        width: 100%;
        padding: 10px;
        overflow: hidden;
    }

        .user-panel:before,
        .user-panel:after {
            content: " ";
            display: table;
        }

        .user-panel:after {
            clear: both;
        }

        .user-panel > .image > img {
            width: 100%;
            max-width: 45px;
            height: auto;
        }

        .user-panel > .info {
            padding: 5px 5px 5px 15px;
            line-height: 1;
            position: absolute;
            left: 55px;
        }

            .user-panel > .info > p {
                font-weight: 600;
                margin-bottom: 9px;
            }

            .user-panel > .info > a {
                text-decoration: none;
                padding-right: 5px;
                margin-top: 3px;
                font-size: 11px;
            }

                .user-panel > .info > a > .fa,
                .user-panel > .info > a > .ion,
                .user-panel > .info > a > .glyphicon {
                    margin-right: 3px;
                }

    .sidebar-menu {
        list-style: none;
        margin: 0;
        padding: 0;
    }

        .sidebar-menu > li {
            position: relative;
            margin: 0;
            padding: 0;
        }

            .sidebar-menu > li > a {
                padding: 12px 5px 12px 15px;
                display: block;
            }

                .sidebar-menu > li > a > .fa,
                .sidebar-menu > li > a > .glyphicon,
                .sidebar-menu > li > a > .ion {
                    width: 20px;
                }

            .sidebar-menu > li .label,
            .sidebar-menu > li .badge {
                margin-top: 3px;
                margin-right: 5px;
            }

        .sidebar-menu li.header {
            padding: 10px 25px 10px 15px;
            font-size: var(--font-12, 12px);
        }

        .sidebar-menu li > a > .fa-angle-left {
            width: auto;
            height: auto;
            padding: 0;
            margin-right: 10px;
            margin-top: 3px;
        }

        .sidebar-menu li.active > a > .fa-angle-left {
            -webkit-transform: rotate(-90deg);
            -ms-transform: rotate(-90deg);
            -o-transform: rotate(-90deg);
            transform: rotate(-90deg);
        }

        .sidebar-menu li.active > .treeview-menu {
            display: block;
        }

        .sidebar-menu .treeview-menu {
            display: none;
            list-style: none;
            padding: 0;
            margin: 0;
            padding-left: 5px;
        }

            .sidebar-menu .treeview-menu .treeview-menu {
                padding-left: 20px;
            }

            .sidebar-menu .treeview-menu > li {
                margin: 0;
            }

                .sidebar-menu .treeview-menu > li > a {
                    padding: 5px 5px 5px 15px;
                    display: block;
                    font-size: var(--font-14, 14px);
                }

                    .sidebar-menu .treeview-menu > li > a > .fa,
                    .sidebar-menu .treeview-menu > li > a > .glyphicon,
                    .sidebar-menu .treeview-menu > li > a > .ion {
                        width: 20px;
                    }

                    .sidebar-menu .treeview-menu > li > a > .fa-angle-left,
                    .sidebar-menu .treeview-menu > li > a > .fa-angle-down {
                        width: auto;
                    }

    @media (min-width: 768px) {
        .sidebar-mini.sidebar-collapse .content-wrapper,
        .sidebar-mini.sidebar-collapse .right-side,
        .sidebar-mini.sidebar-collapse .main-footer {
            margin-left: 50px !important;
            z-index: 840;
        }

        .sidebar-mini.sidebar-collapse .main-sidebar {
            -webkit-transform: translate(0, 0);
            -ms-transform: translate(0, 0);
            -o-transform: translate(0, 0);
            transform: translate(0, 0);
            width: 50px !important;
            z-index: 850;
        }

        .sidebar-mini.sidebar-collapse .sidebar-menu > li {
            position: relative;
        }

            .sidebar-mini.sidebar-collapse .sidebar-menu > li > a {
                margin-right: 0;
            }

                .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span {
                    border-top-right-radius: 4px;
                }

            .sidebar-mini.sidebar-collapse .sidebar-menu > li:not(.treeview) > a > span {
                border-bottom-right-radius: 4px;
            }

            .sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu {
                padding-top: 5px;
                padding-bottom: 5px;
                border-bottom-right-radius: 4px;
            }

            .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right),
            .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
                display: block !important;
                position: absolute;
                width: 180px;
                left: 50px;
            }

            .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span {
                top: 0;
                margin-left: -3px;
                padding: 12px 5px 12px 20px;
                background-color: inherit;
            }

            .sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
                top: 44px;
                margin-left: 0;
            }

            .sidebar-mini.sidebar-collapse .main-sidebar .user-panel > .info,
            .sidebar-mini.sidebar-collapse .sidebar-form,
            .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > span,
            .sidebar-mini.sidebar-collapse .sidebar-menu > li > .treeview-menu,
            .sidebar-mini.sidebar-collapse .sidebar-menu > li > a > .pull-right,
            .sidebar-mini.sidebar-collapse .sidebar-menu li.header {
                display: none !important;
                -webkit-transform: translateZ(0);
            }

        .sidebar-mini.sidebar-collapse .eduwaveHeader .logo {
            width: 50px;
        }

            .sidebar-mini.sidebar-collapse .eduwaveHeader .logo > .logo-mini {
                display: block;
                margin-left: -15px;
                margin-right: -15px;
                font-size: var(--font-18, 18px);
            }

            .sidebar-mini.sidebar-collapse .eduwaveHeader .logo > .logo-lg {
                display: none;
            }

        .sidebar-mini.sidebar-collapse .eduwaveHeader .navbar {
            margin-left: 50px;
        }
    }

    .sidebar-menu,
    .main-sidebar .user-panel,
    .sidebar-menu > li.header {
        white-space: nowrap;
        overflow: hidden;
    }

        .sidebar-menu:hover {
            overflow: visible;
        }

        .sidebar-form,
        .sidebar-menu > li.header {
            overflow: hidden;
            text-overflow: clip;
        }

        .sidebar-menu li > a {
            position: relative;
        }

            .sidebar-menu li > a > .pull-right {
                position: absolute;
                right: 10px;
                top: 50%;
                margin-top: -7px;
            }

    .control-sidebar-bg {
        position: fixed;
        z-index: 1000;
        bottom: 0;
    }

    .control-sidebar-bg,
    .control-sidebar {
        top: 0;
        right: -230px;
        width: 230px;
        -webkit-transition: right .3s ease-in-out;
        -o-transition: right .3s ease-in-out;
        transition: right .3s ease-in-out;
    }

    .control-sidebar {
        position: absolute;
        padding-top: 50px;
        z-index: 1010;
    }

    @media (max-width: 768px) {
        .control-sidebar {
            padding-top: 100px;
        }
      .eduwaveWrapper .GridPagination.TableRowStyle td {
            width: fit-content !important;
        }
       
    }

    .control-sidebar > .tab-content {
        padding: 10px 15px;
    }

    .control-sidebar.control-sidebar-open,
    .control-sidebar.control-sidebar-open + .control-sidebar-bg {
        right: 0;
    }

    .control-sidebar-open .control-sidebar-bg,
    .control-sidebar-open .control-sidebar {
        right: 0;
    }

    @media (min-width: 768px) {
        .control-sidebar-open .content-wrapper,
        .control-sidebar-open .right-side,
        .control-sidebar-open .main-footer {
            margin-right: 230px;
        }
    }

    .itg_dashboard_nav-tabs.control-sidebar-tabs > li:first-of-type > a,
    .itg_dashboard_nav-tabs.control-sidebar-tabs > li:first-of-type > a:hover,
    .itg_dashboard_nav-tabs.control-sidebar-tabs > li:first-of-type > a:focus {
        border-left-width: 0;
    }

    .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
    }

        .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a,
        .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a:hover {
            border-top: none;
            border-right: none;
            border-left: 1px solid transparent;
            border-bottom: 1px solid transparent;
        }

            .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a .icon {
                font-size: 16px;
            }

    .itg_dashboard_nav-tabs.control-sidebar-tabs > li.active > a,
    .itg_dashboard_nav-tabs.control-sidebar-tabs > li.active > a:hover,
    .itg_dashboard_nav-tabs.control-sidebar-tabs > li.active > a:focus,
    .itg_dashboard_nav-tabs.control-sidebar-tabs > li.active > a:active {
        border-top: none;
        border-right: none;
        border-bottom: none;
    }

    @media (max-width: 768px) {
        .itg_dashboard_nav-tabs.control-sidebar-tabs {
            display: table;
        }

            .itg_dashboard_nav-tabs.control-sidebar-tabs > li {
                display: table-cell;
            }
    }

    .control-sidebar-heading {
        font-weight: 400;
        font-size: var(--font-16, 16px);
        padding: 10px 0;
        margin-bottom: 10px;
    }

    .control-sidebar-subheading {
        display: block;
        font-weight: 400;
        font-size: var(--font-14, 14px);
    }

    .control-sidebar-menu {
        list-style: none;
        padding: 0;
        margin: 0 -15px;
    }

        .control-sidebar-menu > li > a {
            display: block;
            padding: 10px 15px;
        }

            .control-sidebar-menu > li > a:before,
            .control-sidebar-menu > li > a:after {
                content: " ";
                display: table;
            }

            .control-sidebar-menu > li > a:after {
                clear: both;
            }

            .control-sidebar-menu > li > a > .control-sidebar-subheading {
                margin-top: 0;
            }

        .control-sidebar-menu .menu-icon {
            float: left;
            width: 35px;
            height: 35px;
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            -ms-border-radius: 50%;
            border-radius: 50%;
            text-align: center;
            line-height: 35px;
        }

        .control-sidebar-menu .menu-info {
            margin-left: 45px;
            margin-top: 3px;
        }

            .control-sidebar-menu .menu-info > .control-sidebar-subheading {
                margin: 0;
            }

            .control-sidebar-menu .menu-info > p {
                margin: 0;
                font-size: 11px;
            }

        .control-sidebar-menu .progress {
            margin: 0;
        }

    .control-sidebar-dark {
        color: #b8c7ce;
    }

        .control-sidebar-dark,
        .control-sidebar-dark + .control-sidebar-bg {
            background: #222d32;
        }

            .control-sidebar-dark .itg_dashboard_nav-tabs.control-sidebar-tabs {
                border-bottom: #1c2529;
            }

                .control-sidebar-dark .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a {
                    background: #181f23;
                    color: #b8c7ce;
                }

                    .control-sidebar-dark .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a,
                    .control-sidebar-dark .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a:hover,
                    .control-sidebar-dark .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a:focus {
                        border-left-color: #141a1d;
                        border-bottom-color: #141a1d;
                    }

                        .control-sidebar-dark .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a:hover,
                        .control-sidebar-dark .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a:focus,
                        .control-sidebar-dark .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a:active {
                            background: #1c2529;
                        }

                        .control-sidebar-dark .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a:hover {
                            color: #fff;
                        }

                .control-sidebar-dark .itg_dashboard_nav-tabs.control-sidebar-tabs > li.active > a,
                .control-sidebar-dark .itg_dashboard_nav-tabs.control-sidebar-tabs > li.active > a:hover,
                .control-sidebar-dark .itg_dashboard_nav-tabs.control-sidebar-tabs > li.active > a:focus,
                .control-sidebar-dark .itg_dashboard_nav-tabs.control-sidebar-tabs > li.active > a:active {
                    background: #222d32;
                    color: #fff;
                }

            .control-sidebar-dark .control-sidebar-heading,
            .control-sidebar-dark .control-sidebar-subheading {
                color: #fff;
            }

            .control-sidebar-dark .control-sidebar-menu > li > a:hover {
                background: #1e282c;
            }

            .control-sidebar-dark .control-sidebar-menu > li > a .menu-info > p {
                color: #b8c7ce;
            }

    .control-sidebar-light {
        color: #5e5e5e;
    }

        .control-sidebar-light,
        .control-sidebar-light + .control-sidebar-bg {
            background: #f9fafc;
            border-left: 1px solid #d2d6de;
        }

            .control-sidebar-light .itg_dashboard_nav-tabs.control-sidebar-tabs {
                border-bottom: #d2d6de;
            }

                .control-sidebar-light .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a {
                    background: #e8ecf4;
                    color: #444;
                }

                    .control-sidebar-light .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a,
                    .control-sidebar-light .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a:hover,
                    .control-sidebar-light .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a:focus {
                        border-left-color: #d2d6de;
                        border-bottom-color: #d2d6de;
                    }

                        .control-sidebar-light .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a:hover,
                        .control-sidebar-light .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a:focus,
                        .control-sidebar-light .itg_dashboard_nav-tabs.control-sidebar-tabs > li > a:active {
                            background: #eff1f7;
                        }

                .control-sidebar-light .itg_dashboard_nav-tabs.control-sidebar-tabs > li.active > a,
                .control-sidebar-light .itg_dashboard_nav-tabs.control-sidebar-tabs > li.active > a:hover,
                .control-sidebar-light .itg_dashboard_nav-tabs.control-sidebar-tabs > li.active > a:focus,
                .control-sidebar-light .itg_dashboard_nav-tabs.control-sidebar-tabs > li.active > a:active {
                    background: #f9fafc;
                    color: #111;
                }

            .control-sidebar-light .control-sidebar-heading,
            .control-sidebar-light .control-sidebar-subheading {
                color: #111;
            }

            .control-sidebar-light .control-sidebar-menu {
                margin-left: -14px;
            }

                .control-sidebar-light .control-sidebar-menu > li > a:hover {
                    background: #f4f4f5;
                }

                .control-sidebar-light .control-sidebar-menu > li > a .menu-info > p {
                    color: #5e5e5e;
                }

.dropdown-list {
    box-shadow: none;
    border-color: #eee;
}

    .dropdown-list > li > a {
        color: #777;
    }

        .dropdown-list > li > a > .glyphicon,
        .dropdown-list > li > a > .fa,
        .dropdown-list > li > a > .ion {
            margin-right: 10px;
        }

        .dropdown-list > li > a:hover {
            /*            background-color: #e1e3e9;*/
            color: #333;
        }

    .dropdown-list > .divider {
        background-color: #eee;
    }

.navbar-nav > .notifications-menu > .dropdown-list,
.navbar-nav > .messages-menu > .dropdown-list,
.navbar-nav > .tasks-menu > .dropdown-list {
    width: 280px;
    padding: 0 0 0 0;
    margin: 0;
    top: 100%;
}

    .navbar-nav > .notifications-menu > .dropdown-list > li,
    .navbar-nav > .messages-menu > .dropdown-list > li,
    .navbar-nav > .tasks-menu > .dropdown-list > li {
        position: relative;
    }

        .navbar-nav > .notifications-menu > .dropdown-list > li.header,
        .navbar-nav > .messages-menu > .dropdown-list > li.header,
        .navbar-nav > .tasks-menu > .dropdown-list > li.header {
            background-color: #ffffff;
            padding: 7px 10px;
            border-bottom: 1px solid #f4f4f4;
            color: #444444;
            font-size: var(--font-14, 14px);
        }

        .navbar-nav > .notifications-menu > .dropdown-list > li.footer > a,
        .navbar-nav > .messages-menu > .dropdown-list > li.footer > a,
        .navbar-nav > .tasks-menu > .dropdown-list > li.footer > a {
            font-size: var(--font-12, 12px);
            background-color: #fff;
            padding: 7px 10px;
            border-bottom: 1px solid #eeeeee;
            color: #444 !important;
            text-align: center;
        }

    @media (max-width: 991px) {
        .navbar-nav > .notifications-menu > .itg_dashboard_dropdown-menu > li.footer > a,
        .navbar-nav > .messages-menu > .itg_dashboard_dropdown-menu > li.footer > a,
        .navbar-nav > .tasks-menu > .itg_dashboard_dropdown-menu > li.footer > a {
            background: #fff !important;
            color: #444 !important;
        }
    }

    .navbar-nav > .notifications-menu > .itg_dashboard_dropdown-menu > li.footer > a:hover,
    .navbar-nav > .messages-menu > .itg_dashboard_dropdown-menu > li.footer > a:hover,
    .navbar-nav > .tasks-menu > .itg_dashboard_dropdown-menu > li.footer > a:hover {
        text-decoration: none;
        font-weight: normal;
    }

    .navbar-nav > .notifications-menu > .itg_dashboard_dropdown-menu > li .menu,
    .navbar-nav > .messages-menu > .itg_dashboard_dropdown-menu > li .menu,
    .navbar-nav > .tasks-menu > .itg_dashboard_dropdown-menu > li .menu {
        max-height: 200px;
        margin: 0;
        padding: 0;
        list-style: none;
        overflow-x: hidden;
    }

        .navbar-nav > .notifications-menu > .itg_dashboard_dropdown-menu > li .menu > li > a,
        .navbar-nav > .messages-menu > .itg_dashboard_dropdown-menu > li .menu > li > a,
        .navbar-nav > .tasks-menu > .itg_dashboard_dropdown-menu > li .menu > li > a {
            display: block;
            white-space: nowrap;
            border-bottom: 1px solid #f4f4f4;
        }

            .navbar-nav > .notifications-menu > .itg_dashboard_dropdown-menu > li .menu > li > a:hover,
            .navbar-nav > .messages-menu > .itg_dashboard_dropdown-menu > li .menu > li > a:hover,
            .navbar-nav > .tasks-menu > .itg_dashboard_dropdown-menu > li .menu > li > a:hover {
                background: #f4f4f4;
                text-decoration: none;
            }

        .navbar-nav > .notifications-menu > .itg_dashboard_dropdown-menu > li .menu > li > a {
            color: #444444;
            overflow: hidden;
            text-overflow: ellipsis;
            padding: 10px;
        }

            .navbar-nav > .notifications-menu > .itg_dashboard_dropdown-menu > li .menu > li > a > .glyphicon,
            .navbar-nav > .notifications-menu > .itg_dashboard_dropdown-menu > li .menu > li > a > .fa,
            .navbar-nav > .notifications-menu > .itg_dashboard_dropdown-menu > li .menu > li > a > .ion {
                width: 20px;
            }

        .navbar-nav > .messages-menu > .itg_dashboard_dropdown-menu > li .menu > li > a {
            margin: 0;
            padding: 10px 10px;
        }

            .navbar-nav > .messages-menu > .itg_dashboard_dropdown-menu > li .menu > li > a > div > img {
                margin: auto 10px auto auto;
                width: 40px;
                height: 40px;
            }

            .navbar-nav > .messages-menu > .itg_dashboard_dropdown-menu > li .menu > li > a > h4 {
                padding: 0;
                margin: 0 0 0 45px;
                color: #444444;
                font-size: var(--font-15, 15px);
                position: relative;
            }

                .navbar-nav > .messages-menu > .itg_dashboard_dropdown-menu > li .menu > li > a > h4 > small {
                    color: #999999;
                    font-size: 10px;
                    position: absolute;
                    top: 0;
                    right: 0;
                }

            .navbar-nav > .messages-menu > .itg_dashboard_dropdown-menu > li .menu > li > a > p {
                margin: 0 0 0 45px;
                font-size: var(--font-12, 12px);
                color: #888888;
            }

            .navbar-nav > .messages-menu > .itg_dashboard_dropdown-menu > li .menu > li > a:before,
            .navbar-nav > .messages-menu > .itg_dashboard_dropdown-menu > li .menu > li > a:after {
                content: " ";
                display: table;
            }

            .navbar-nav > .messages-menu > .itg_dashboard_dropdown-menu > li .menu > li > a:after {
                clear: both;
            }

        .navbar-nav > .tasks-menu > .itg_dashboard_dropdown-menu > li .menu > li > a {
            padding: 10px;
        }

            .navbar-nav > .tasks-menu > .itg_dashboard_dropdown-menu > li .menu > li > a > h3 {
                font-size: var(--font-14, 14px);
                padding: 0;
                margin: 0 0 10px 0;
                color: #666666;
            }

            .navbar-nav > .tasks-menu > .itg_dashboard_dropdown-menu > li .menu > li > a > .progress {
                padding: 0;
                margin: 0;
            }

    .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu {
        /*border-top-right-radius: 0;
  border-top-left-radius: 0;*/
        padding: 1px 0 0 0;
        border-top-width: 0;
        width: 280px;
    }

        /*.eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu,
.eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > .user-body {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}*/
        .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > li.user-header {
            height: 175px;
            padding: 10px;
            text-align: center;
            background: #206e87;
        }

            .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > li.user-header > img {
                z-index: 5;
                height: 90px;
                width: 90px;
                border: 3px solid;
                border-color: transparent;
                border-color: rgba(255, 255, 255, 0.2);
            }

            .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > li.user-header > p {
                z-index: 5;
                color: #fff;
                color: white;
                font-size: var(--font-17, 17px);
                margin-top: 10px;
            }

                .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > li.user-header > p > small {
                    display: block;
                    font-size: var(--font-12, 12px);
                }

        .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > .user-body {
            padding: 15px;
            border-bottom: 1px solid #f4f4f4;
            border-top: 1px solid #dddddd;
        }

            .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > .user-body:before,
            .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > .user-body:after {
                content: " ";
                display: table;
            }

            .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > .user-body:after {
                clear: both;
            }

            .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > .user-body a {
                color: #444 !important;
            }

    @media (max-width: 991px) {
        .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > .user-body a {
            background: #fff !important;
            color: #444 !important;
        }
    }

    .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > .user-footer {
        background-color: #f9f9f9;
        padding: 10px;
    }

        .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > .user-footer:before,
        .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > .user-footer:after {
            content: " ";
            display: table;
        }

        .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > .user-footer:after {
            clear: both;
        }

        .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > .user-footer .btn-default {
            color: #666666;
        }

    @media (max-width: 991px) {
        .eduwaveHeader .user-menu > .itg_dashboard_dropdown-menu > .user-footer .btn-default:hover {
            background-color: #f9f9f9;
        }
    }

    .navbar-nav > .user-menu .user-image {
        float: left;
        width: 25px;
        height: 25px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        margin-right: 10px;
        margin-top: -2px;
    }

    @media (max-width: 767px) {
        .navbar-nav > .user-menu .user-image {
            float: none;
            margin-right: 0;
            margin-top: -8px;
            line-height: 10px;
        }
    }

    .open:not(.dropup) > .animated-dropdown-menu {
        backface-visibility: visible !important;
        -webkit-animation: flipInX .7s both;
        -o-animation: flipInX .7s both;
        animation: flipInX .7s both;
    }

    @keyframes flipInX {
        0% {
            transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
            transition-timing-function: ease-in;
            opacity: 0;
        }

        40% {
            transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
            transition-timing-function: ease-in;
        }

        60% {
            transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
            opacity: 1;
        }

        80% {
            transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        }

        100% {
            transform: perspective(400px);
        }
    }

    @-webkit-keyframes flipInX {
        0% {
            -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
            -webkit-transition-timing-function: ease-in;
            opacity: 0;
        }

        40% {
            -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
            -webkit-transition-timing-function: ease-in;
        }

        60% {
            -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
            opacity: 1;
        }

        80% {
            -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        }

        100% {
            -webkit-transform: perspective(400px);
        }
    }

    .navbar-custom-menu > .navbar-nav > li {
        position: relative;
    }

        .navbar-custom-menu > .navbar-nav > li > .itg_dashboard_dropdown-menu {
            position: absolute;
            right: 0;
            left: auto;
        }

    @media (max-width: 991px) {
        .navbar-custom-menu > .navbar-nav {
            float: right;
        }

            .navbar-custom-menu > .navbar-nav > li {
                position: static;
            }

                .navbar-custom-menu > .navbar-nav > li > .itg_dashboard_dropdown-menu {
                    position: absolute;
                    right: 5%;
                    left: auto;
                    border: 1px solid #ddd;
                    background: #fff;
                }
    }

    .form-control {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
        box-shadow: none;
        border-color: #d2d6de;
    }

        .form-control:focus {
            border-color: #3c8dbc;
            box-shadow: none;
        }

        .form-control::-moz-placeholder,
        .form-control:-ms-input-placeholder,
        .form-control::-webkit-input-placeholder {
            color: #bbb;
            opacity: 1;
        }

        .form-control:not(select) {
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
        }

    .form-group.has-success label {
        color: #00a65a;
    }

    .form-group.has-success .form-control {
        border-color: #00a65a;
        box-shadow: none;
    }

    .form-group.has-warning label {
        color: #2e95b7;
    }

    .form-group.has-warning .form-control {
        border-color: #2e95b7;
        box-shadow: none;
    }

    .form-group.has-error label {
        color: #dd4b39;
    }

    .form-group.has-error .form-control {
        border-color: #dd4b39;
        box-shadow: none;
    }

    .input-group .input-group-addon {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
        border-color: #d2d6de;
        background-color: #fff;
    }

    .btn-group-vertical .btn.btn-flat:first-of-type,
    .btn-group-vertical .btn.btn-flat:last-of-type {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
    }

    .icheck > label {
        padding-left: 0;
    }

    .form-control-feedback.fa {
        line-height: 34px;
    }

    .input-lg + .form-control-feedback.fa,
    .input-group-lg + .form-control-feedback.fa,
    .form-group-lg .form-control + .form-control-feedback.fa {
        line-height: 46px;
    }

    .input-sm + .form-control-feedback.fa,
    .input-group-sm + .form-control-feedback.fa,
    .form-group-sm .form-control + .form-control-feedback.fa {
        line-height: 30px;
    }

    .progress,
    .progress > .progress-bar {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

        .progress,
        .progress > .progress-bar,
        .progress .progress-bar,
        .progress > .progress-bar .progress-bar {
            -webkit-border-radius: 1px;
            -moz-border-radius: 1px;
            -ms-border-radius: 1px;
            border-radius: 1px;
        }

            .progress.sm,
            .progress-sm {
                height: 10px;
            }

                .progress.sm,
                .progress-sm,
                .progress.sm .progress-bar,
                .progress-sm .progress-bar {
                    -webkit-border-radius: 1px;
                    -moz-border-radius: 1px;
                    -ms-border-radius: 1px;
                    border-radius: 1px;
                }

            .progress.xs,
            .progress-xs {
                height: 7px;
            }

                .progress.xs,
                .progress-xs,
                .progress.xs .progress-bar,
                .progress-xs .progress-bar {
                    -webkit-border-radius: 1px;
                    -moz-border-radius: 1px;
                    -ms-border-radius: 1px;
                    border-radius: 1px;
                }

            .progress.xxs,
            .progress-xxs {
                height: 3px;
            }

                .progress.xxs,
                .progress-xxs,
                .progress.xxs .progress-bar,
                .progress-xxs .progress-bar {
                    -webkit-border-radius: 1px;
                    -moz-border-radius: 1px;
                    -ms-border-radius: 1px;
                    border-radius: 1px;
                }

            .progress.vertical {
                position: relative;
                width: 30px;
                height: 200px;
                display: inline-block;
                margin-right: 10px;
            }

                .progress.vertical > .progress-bar {
                    width: 100%;
                    position: absolute;
                    bottom: 0;
                }

                .progress.vertical.sm,
                .progress.vertical.progress-sm {
                    width: 20px;
                }

                .progress.vertical.xs,
                .progress.vertical.progress-xs {
                    width: 10px;
                }

                .progress.vertical.xxs,
                .progress.vertical.progress-xxs {
                    width: 3px;
                }

    .progress-group .progress-text {
        font-weight: 600;
    }

    .progress-group .progress-number {
        float: right;
    }

    .table tr > td .progress {
        margin: 0;
    }

    .progress-bar-light-blue,
    .progress-bar-primary {
        background-color: #3c8dbc;
    }

    .progress-striped .progress-bar-light-blue,
    .progress-striped .progress-bar-primary {
        background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
        background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
        background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    }

    .progress-bar-green,
    .progress-bar-success {
        background-color: #00a65a;
    }

    .progress-striped .progress-bar-green,
    .progress-striped .progress-bar-success {
        background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
        background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
        background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    }

    .progress-bar-aqua,
    .progress-bar-info {
        background-color: #00c0ef;
    }

    .progress-striped .progress-bar-aqua,
    .progress-striped .progress-bar-info {
        background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
        background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
        background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    }

    .progress-bar-yellow,
    .progress-bar-warning {
        background-color: #2e95b7;
    }

    .progress-striped .progress-bar-yellow,
    .progress-striped .progress-bar-warning {
        background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
        background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
        background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    }

    .progress-bar-red,
    .progress-bar-danger {
        background-color: #dd4b39;
    }

    .progress-striped .progress-bar-red,
    .progress-striped .progress-bar-danger {
        background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
        background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
        background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    }

    .small-box {
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        -ms-border-radius: 2px;
        border-radius: 2px;
        position: relative;
        display: block;
        margin-bottom: 20px;
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    }

        .small-box > .inner {
            padding: 10px;
        }

        .small-box > .small-box-footer {
            position: relative;
            text-align: center;
            padding: 3px 0;
            color: #fff;
            color: rgba(255, 255, 255, 0.8);
            display: block;
            z-index: 10;
            background: rgba(0, 0, 0, 0.1);
            text-decoration: none;
        }

            .small-box > .small-box-footer:hover {
                color: #fff;
                background: rgba(0, 0, 0, 0.15);
            }

        .small-box h3 {
            font-size: 38px;
            font-weight: bold;
            margin: 0 0 10px 0;
            white-space: nowrap;
            padding: 0;
        }

        .small-box p {
            font-size: var(--font-15, 15px);
        }

            .small-box p > small {
                display: block;
                color: #f9f9f9;
                font-size: 13px;
                margin-top: 5px;
            }

        .small-box h3,
        .small-box p {
            z-index: 5px;
        }

        .small-box .icon {
            -webkit-transition: all .3s linear;
            -o-transition: all .3s linear;
            transition: all .3s linear;
            position: absolute;
            top: 0px;
            right: 10px;
            z-index: 0;
            font-size: 90px;
            color: rgba(0, 0, 0, 0.15);
        }

        .small-box:hover {
            text-decoration: none;
            color: #f9f9f9;
        }

            .small-box:hover .icon {
                font-size: 95px;
            }

    @media (max-width: 767px) {
        .small-box {
            text-align: center;
        }

            .small-box .icon {
                display: none;
            }

            .small-box p {
                font-size: var(--font-12, 12px);
            }
    }

    .box {
        position: relative;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        -ms-border-radius: 3px;
        border-radius: 3px;
        background: #ffffff;
        border-top: 3px solid #d2d6de;
        margin-bottom: 20px;
        width: 100%;
        box-shadow: 0 0px 2px #ccc;
        /*box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);*/
    }

        .box.box-primary {
            border-top-color: #3c8dbc;
        }

        .box.box-info {
            border-top-color: #00c0ef;
        }

        .box.box-danger {
            border-top-color: #dd4b39;
        }

        .box.box-warning {
            border-top-color: #2e95b7;
        }

        .box.box-success {
            border-top-color: #00a65a;
        }

        .box.box-default {
            border-top-color: #d2d6de;
        }

        .box.collapsed-box .box-body,
        .box.collapsed-box .box-footer {
            display: none;
        }

        .box .nav-stacked > li {
            border-bottom: 1px solid #f4f4f4;
            margin: 0;
        }

            .box .nav-stacked > li:last-of-type {
                border-bottom: none;
            }

        .box.height-control .box-body {
            max-height: 300px;
            overflow: auto;
        }

        .box .border-right {
            border-right: 1px solid #f4f4f4;
        }

        .box .border-left {
            border-left: 1px solid #f4f4f4;
        }

        .box.box-solid {
            border-top: 0;
        }

            .box.box-solid > .box-header .btn.btn-default {
                background: transparent;
            }

            .box.box-solid > .box-header .btn:hover,
            .box.box-solid > .box-header a:hover {
                background: rgba(0, 0, 0, 0.1);
            }

            .box.box-solid.box-default {
                border: 1px solid #d2d6de;
            }

                .box.box-solid.box-default > .box-header {
                    color: #444;
                    background: #d2d6de;
                    background-color: #d2d6de;
                }

                    .box.box-solid.box-default > .box-header a,
                    .box.box-solid.box-default > .box-header .btn {
                        color: #444;
                    }

            .box.box-solid.box-primary {
                border: 1px solid #3c8dbc;
            }

                .box.box-solid.box-primary > .box-header {
                    color: #fff;
                    background: #3c8dbc;
                    background-color: #3c8dbc;
                }

                    .box.box-solid.box-primary > .box-header a,
                    .box.box-solid.box-primary > .box-header .btn {
                        color: #fff;
                    }

            .box.box-solid.box-info {
                border: 1px solid #00c0ef;
            }

                .box.box-solid.box-info > .box-header {
                    color: #fff;
                    background: #00c0ef;
                    background-color: #00c0ef;
                }

                    .box.box-solid.box-info > .box-header a,
                    .box.box-solid.box-info > .box-header .btn {
                        color: #fff;
                    }

            .box.box-solid.box-danger {
                border: 1px solid #dd4b39;
            }

                .box.box-solid.box-danger > .box-header {
                    color: #fff;
                    background: #dd4b39;
                    background-color: #dd4b39;
                }

                    .box.box-solid.box-danger > .box-header a,
                    .box.box-solid.box-danger > .box-header .btn {
                        color: #fff;
                    }

            .box.box-solid.box-warning {
                border: 1px solid #2e95b7;
            }

                .box.box-solid.box-warning > .box-header {
                    color: #fff;
                    background: #2e95b7;
                    background-color: #2e95b7;
                }

                    .box.box-solid.box-warning > .box-header a,
                    .box.box-solid.box-warning > .box-header .btn {
                        color: #fff;
                    }

            .box.box-solid.box-success {
                border: 1px solid #00a65a;
            }

                .box.box-solid.box-success > .box-header {
                    color: #fff;
                    background: #00a65a;
                    background-color: #00a65a;
                }

                    .box.box-solid.box-success > .box-header a,
                    .box.box-solid.box-success > .box-header .btn {
                        color: #fff;
                    }

            .box.box-solid > .box-header > .box-tools .btn {
                border: 0;
                box-shadow: none;
            }

            .box.box-solid[class*='bg'] > .box-header {
                color: #fff;
            }

        .box .box-group > .box {
            margin-bottom: 5px;
        }

        .box .knob-label {
            text-align: center;
            color: #333;
            font-weight: 100;
            font-size: var(--font-12, 12px);
            margin-bottom: 0.3em;
        }

        .box > .overlay,
        .overlay-wrapper > .overlay,
        .box > .loading-img,
        .overlay-wrapper > .loading-img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

        .box .overlay,
        .overlay-wrapper .overlay {
            z-index: 50;
            background: rgba(255, 255, 255, 0.7);
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            -ms-border-radius: 3px;
            border-radius: 3px;
        }

            .box .overlay > .fa,
            .overlay-wrapper .overlay > .fa {
                position: absolute;
                top: 50%;
                left: 50%;
                margin-left: -15px;
                margin-top: -15px;
                color: #000;
                font-size: 30px;
            }

            .box .overlay.dark,
            .overlay-wrapper .overlay.dark {
                background: rgba(0, 0, 0, 0.5);
            }

    .box-header:before,
    .box-body:before,
    .box-footer:before,
    .box-header:after,
    .box-body:after,
    .box-footer:after {
        content: " ";
        display: table;
    }

    .box-header:after,
    .box-body:after,
    .box-footer:after {
        clear: both;
    }

    .box-header {
        color: #444;
        display: block;
        padding: 10px;
        position: relative;
    }

        .box-header.with-border {
            border-bottom: 1px solid #f4f4f4;
        }

    .collapsed-box .box-header.with-border {
        border-bottom: none;
    }

    .box-header > .fa,
    .box-header > .glyphicon,
    .box-header > .ion,
    .box-header .box-title {
        display: inline-block;
        font-size: 18px;
        margin: 0;
        line-height: 1;
    }

    .box-header > .fa,
    .box-header > .glyphicon,
    .box-header > .ion {
        margin-right: 5px;
    }

    .box-header > .box-tools {
        position: absolute;
        right: 10px;
        top: 11px;
    }

        .box-header > .box-tools [data-toggle="tooltip"] {
            position: relative;
        }

        .box-header > .box-tools.pull-right .itg_dashboard_dropdown-menu {
            right: 0;
            left: auto;
        }

    .btn-box-tool {
        padding: 5px;
        font-size: var(--font-12, 12px);
        background: transparent;
        color: #97a0b3;
    }

        .btn-box-tool .fa.fa-ellipsis-v {
            font-size: 14px;
        }

        .open .btn-box-tool,
        .btn-box-tool:hover {
            color: #606c84;
        }

        .btn-box-tool.btn:active {
            box-shadow: none;
        }

    .box-body {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        border-bottom-right-radius: 3px;
        border-bottom-left-radius: 3px;
        padding: 10px;
    }

    .no-header .box-body {
        border-top-right-radius: 3px;
        border-top-left-radius: 3px;
    }

    .box-body > .table {
        margin-bottom: 0;
    }

    .box-body .fc {
        margin-top: 5px;
    }

    .box-body .full-width-chart {
        margin: -19px;
    }

    .box-body.no-padding .full-width-chart {
        margin: -9px;
    }

    .box-body .box-pane {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 3px;
    }

    .box-body .box-pane-right {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        border-bottom-right-radius: 3px;
        border-bottom-left-radius: 0;
    }

    .box-footer {
        border-top-left-radius: 0;
        border-top-right-radius: 0;
        border-bottom-right-radius: 3px;
        border-bottom-left-radius: 3px;
        /*border-top: 1px solid #f4f4f4;*/
        padding: 10px;
        background-color: #fff;
    }

    .chart-legend {
        margin: 10px 0;
    }

    @media (max-width: 991px) {
        .chart-legend > li {
            float: left;
            margin-right: 10px;
        }
    }

    .box-comments {
        background: #f7f7f7;
    }

        .box-comments .box-comment {
            padding: 8px 0;
            border-top: 1px solid #eee;
        }

            .box-comments .box-comment:before,
            .box-comments .box-comment:after {
                content: " ";
                display: table;
            }

            .box-comments .box-comment:after {
                clear: both;
            }

            .box-comments .box-comment:first-of-type {
                border-top: 0;
            }

            .box-comments .box-comment:first-of-type {
                padding-top: 0;
            }

            .box-comments .box-comment img {
                float: left;
            }

        .box-comments .comment-text {
            margin-left: 40px;
            color: #555;
        }

        .box-comments .username {
            color: #444;
            display: block;
            font-weight: 600;
        }

        .box-comments .text-muted {
            font-weight: 400;
            font-size: var(--font-12, 12px);
        }

    .itg_dashboard_todo-list {
        margin: 0;
        padding: 0;
        list-style: none;
        overflow: auto;
    }

    #ctl00_ctl00_cphPageBody_cphMain_dlStudents > tr {
        border-bottom: 20px solid #fff;
    }

    .itg_dashboard_todo-list li {
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        border-radius: 5px;
        padding: 10px;
        background: #f4f4f4;
        margin-bottom: 2px;
        border-left: 2px solid #e6e7e8;
        color: #444;
    }

        .itg_dashboard_todo-list li:last-of-type {
            margin-bottom: 0;
        }

        .itg_dashboard_todo-list li > input[type='checkbox'] {
            margin: 0 10px 0 5px;
        }

        .itg_dashboard_todo-list li .text {
            display: inline-block;
            margin-left: 5px;
            font-weight: 600;
        }

        .itg_dashboard_todo-list li .label {
            margin-left: 10px;
            font-size: 9px;
        }

        .itg_dashboard_todo-list li .tools {
            display: none;
            float: right;
            /*color: #dd4b39;*/
            color: #fff;
        }

            .itg_dashboard_todo-list li .tools > .fa,
            .itg_dashboard_todo-list li .tools > .glyphicon,
            .itg_dashboard_todo-list li .tools > .ion {
                margin-right: 5px;
                cursor: pointer;
            }

        .itg_dashboard_todo-list li:hover .tools {
            display: inline-block;
        }

        .itg_dashboard_todo-list li.done {
            color: #999;
        }

            .itg_dashboard_todo-list li.done .text {
                text-decoration: line-through;
                font-weight: 500;
            }

            .itg_dashboard_todo-list li.done .label {
                background: #d2d6de !important;
            }

    .itg_dashboard_todo-list .danger {
        border-left-color: #dd4b39;
    }

    .itg_dashboard_todo-list .warning {
        border-left-color: #2e95b7;
    }

    .itg_dashboard_todo-list .info {
        border-left-color: #00c0ef;
    }

    .itg_dashboard_todo-list .success {
        border-left-color: #00a65a;
    }

    .itg_dashboard_todo-list .primary {
        border-left-color: #3c8dbc;
    }

    .itg_dashboard_todo-list .handle {
        display: inline-block;
        cursor: move;
        margin: 0 5px;
    }

    .chat {
        padding: 5px 20px 5px 10px;
    }

        .chat .item {
            margin-bottom: 10px;
        }

            .chat .item:before,
            .chat .item:after {
                content: " ";
                display: table;
            }

            .chat .item:after {
                clear: both;
            }

            .chat .item > img {
                width: 40px;
                height: 40px;
                border: 2px solid transparent;
                -webkit-border-radius: 50%;
                -moz-border-radius: 50%;
                -ms-border-radius: 50%;
                border-radius: 50%;
                text-indent: -9999px;
                overflow: hidden;
                background: white;
                color: white;
                background: url(path-to-file);
                -moz-force-broken-image-icon: 1;
            }

            .chat .item > .online {
                border: 2px solid #00a65a;
            }

            .chat .item > .offline {
                border: 2px solid #dd4b39;
            }

            .chat .item > .message {
                margin-left: 55px;
                margin-top: -40px;
            }

                .chat .item > .message > .name {
                    display: block;
                    font-weight: 600;
                }

            .chat .item > .attachment {
                -webkit-border-radius: 3px;
                -moz-border-radius: 3px;
                -ms-border-radius: 3px;
                border-radius: 3px;
                background: #f4f4f4;
                margin-left: 65px;
                margin-right: 15px;
                padding: 10px;
            }

                .chat .item > .attachment > h4 {
                    margin: 0 0 5px 0;
                    font-weight: 600;
                    font-size: var(--font-14, 14px);
                    color: #E68D07;
                }

                .chat .item > .attachment > p,
                .chat .item > .attachment > .filename {
                    font-weight: 600;
                    font-size: var(--font-13, 13px);
                    font-style: italic;
                    margin: 0;
                }

                .chat .item > .attachment:before,
                .chat .item > .attachment:after {
                    content: " ";
                    display: table;
                }

                .chat .item > .attachment:after {
                    clear: both;
                }

    .box-input {
        max-width: 200px;
    }

    .modal .panel-body {
        color: #444;
    }

    .info-box {
        display: block;
        min-height: 90px;
        background: #fff;
        width: 100%;
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        border-radius: 5px;
        margin-bottom: 15px;
    }

        .info-box small {
            font-size: var(--font-14, 14px);
        }

        .info-box .progress {
            background: rgba(0, 0, 0, 0.2);
            margin: 5px -10px 5px -10px;
            height: 2px;
        }

            .info-box .progress,
            .info-box .progress .progress-bar {
                -webkit-border-radius: 0px;
                -moz-border-radius: 0px;
                -ms-border-radius: 0px;
                border-radius: 0px;
            }

                .info-box .progress .progress-bar {
                    background: #fff;
                }

    .info-box-icon {
        border-top-left-radius: 2px;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 2px;
        display: block;
        float: left;
        height: 90px;
        width: 90px;
        text-align: center;
        font-size: 45px;
        line-height: 90px;
        background: rgba(0, 0, 0, 0.2);
    }

        .info-box-icon > img {
            max-width: 100%;
        }

    .info-box-content {
        padding: 5px 10px;
        margin-left: 90px;
    }

    .info-box-number {
        display: block;
        font-weight: bold;
        font-size: var(--font-18, 18px);
    }

    .progress-description,
    .info-box-text {
        display: block;
        font-size: var(--font-14, 14px);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .info-box-text {
        text-transform: uppercase;
    }

    .info-box-more {
        display: block;
    }

    .progress-description {
        margin: 0;
    }

    .timeline {
        position: relative;
        margin: 0 0 30px 0;
        padding: 0;
        list-style: none;
    }

        .timeline:before {
            content: '';
            position: absolute;
            top: 0;
            bottom: 0;
            width: 4px;
            background: #ddd;
            left: 31px;
            margin: 0;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            -ms-border-radius: 5px;
            border-radius: 5px;
        }

        .timeline > li {
            position: relative;
            margin-right: 10px;
            margin-bottom: 15px;
        }

            .timeline > li:before,
            .timeline > li:after {
                content: " ";
                display: table;
            }

            .timeline > li:after {
                clear: both;
            }

            .timeline > li > .timeline-item {
                -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
                box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
                -webkit-border-radius: 3px;
                -moz-border-radius: 3px;
                -ms-border-radius: 3px;
                border-radius: 3px;
                margin-top: 0;
                background: #fff;
                color: #444;
                margin-left: 60px;
                margin-right: 15px;
                padding: 0;
                position: relative;
            }

                .timeline > li > .timeline-item > .time {
                    color: #999;
                    float: right;
                    padding: 10px;
                    font-size: var(--font-12, 12px);
                }

                .timeline > li > .timeline-item > .timeline-header {
                    margin: 0;
                    color: #555;
                    border-bottom: 1px solid #f4f4f4;
                    padding: 10px;
                    font-size: var(--font-16, 16px);
                    line-height: 1.1;
                }

                    .timeline > li > .timeline-item > .timeline-header > a {
                        font-weight: 600;
                    }

                .timeline > li > .timeline-item > .timeline-body,
                .timeline > li > .timeline-item > .timeline-footer {
                    padding: 10px;
                }

            .timeline > li > .fa,
            .timeline > li > .glyphicon,
            .timeline > li > .ion {
                width: 30px;
                height: 30px;
                font-size: 15px;
                line-height: 30px;
                position: absolute;
                color: #666;
                background: #d2d6de;
                -webkit-border-radius: 50%;
                -moz-border-radius: 50%;
                -ms-border-radius: 50%;
                border-radius: 50%;
                text-align: center;
                left: 18px;
                top: 0;
            }

        .timeline > .time-label > span {
            font-weight: 600;
            padding: 5px;
            display: inline-block;
            background-color: #fff;
            -webkit-border-radius: 4px;
            -moz-border-radius: 4px;
            -ms-border-radius: 4px;
            border-radius: 4px;
        }

    .timeline-inverse > li > .timeline-item {
        background: #f0f0f0;
        border: 1px solid #ddd;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

        .timeline-inverse > li > .timeline-item > .timeline-header {
            border-bottom-color: #ddd;
        }

    .btn {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
        -webkit-box-shadow: none;
        box-shadow: none;
        border: 1px solid transparent;
    }

        .btn.uppercase {
            text-transform: uppercase;
        }

        .btn.btn-flat {
            -webkit-border-radius: 0px;
            -moz-border-radius: 0px;
            -ms-border-radius: 0px;
            border-radius: 0px;
            -webkit-box-shadow: none;
            -moz-box-shadow: none;
            box-shadow: none;
            border-width: 1px;
        }

        .btn:active {
            -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
            -moz-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
            box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
        }

        .btn:focus {
            outline: none;
        }

        .btn.btn-file {
            position: relative;
            overflow: hidden;
        }

            .btn.btn-file > input[type='file'] {
                position: absolute;
                top: 0;
                right: 0;
                min-width: 100%;
                min-height: 100%;
                font-size: 100px;
                text-align: right;
                opacity: 0;
                filter: alpha(opacity=0);
                outline: none;
                background: white;
                cursor: inherit;
                display: block;
            }

    .btn-default {
        background-color: #f4f4f4;
        color: #444;
        border-color: #ddd;
    }

        .btn-default:hover,
        .btn-default:active,
        .btn-default.hover {
            background-color: #e7e7e7;
        }

    .btn-primary {
        background-color: #206e87;
        border-color: #367fa9;
    }

        .btn-primary:hover,
        .btn-primary:active,
        .btn-primary.hover {
            background-color: #206e87;
            border-color: #206e87;
            /*background-color: #206e87;
      border-color: #488DC9;*/
        }

    .btn-success {
        background-color: #00a65a;
        border-color: #008d4c;
    }

        .btn-success:hover,
        .btn-success:active,
        .btn-success.hover {
            background-color: #008d4c;
        }

    .btn-info {
        background-color: #00c0ef;
        border-color: #00acd6;
    }

        .btn-info:hover,
        .btn-info:active,
        .btn-info.hover {
            background-color: #00acd6;
        }

    .btn-danger {
        background-color: #dd4b39;
        border-color: #d73925;
    }

        .btn-danger:hover,
        .btn-danger:active,
        .btn-danger.hover {
            background-color: #d73925;
        }

    .btn-warning {
        background-color: #2e95b7;
        /*border-color: #e08e0b;*/
    }

        .btn-warning:hover,
        .btn-warning:active,
        .btn-warning.hover {
            background-color: #e08e0b;
        }

    .btn-outline {
        border: 1px solid #fff;
        background: transparent;
        color: #fff;
    }

        .btn-outline:hover,
        .btn-outline:focus,
        .btn-outline:active {
            color: rgba(255, 255, 255, 0.7);
            border-color: rgba(255, 255, 255, 0.7);
        }

    .btn-link {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .btn[class*='bg-']:hover {
        -webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.2);
        box-shadow: inset 0 0 100px rgba(0, 0, 0, 0.2);
    }

    .btn-app {
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        -ms-border-radius: 3px;
        border-radius: 3px;
        position: relative;
        padding: 15px 5px;
        margin: 0 0 10px 10px;
        min-width: 80px;
        height: 60px;
        text-align: center;
        color: #666;
        border: 1px solid #ddd;
        background-color: #f4f4f4;
        font-size: var(--font-12, 12px);
    }

        .btn-app > .fa,
        .btn-app > .glyphicon,
        .btn-app > .ion {
            font-size: 20px;
            display: block;
        }

        .btn-app:hover {
            background: #f4f4f4;
            color: #444;
            border-color: #aaa;
        }

        .btn-app:active,
        .btn-app:focus {
            -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
            -moz-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
            box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
        }

        .btn-app > .badge {
            position: absolute;
            top: -3px;
            right: -10px;
            font-size: 10px;
            font-weight: 400;
        }

    .callout {
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        -ms-border-radius: 3px;
        border-radius: 3px;
        margin: 0 0 20px 0;
        padding: 15px 30px 15px 15px;
        border-left: 5px solid #eee;
    }

        .callout a {
            color: #fff;
            text-decoration: underline;
        }

            .callout a:hover {
                color: #eee;
            }

        .callout h4 {
            margin-top: 0;
            font-weight: 600;
        }

        .callout p:last-child {
            margin-bottom: 0;
        }

        .callout code,
        .callout .highlight {
            background-color: #fff;
        }

        .callout.callout-danger {
            border-color: #c23321;
        }

        .callout.callout-warning {
            border-color: #c87f0a;
        }

        .callout.callout-info {
            border-color: #0097bc;
        }

        .callout.callout-success {
            border-color: #00733e;
        }

    .alert {
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        -ms-border-radius: 3px;
        border-radius: 3px;
    }

        .alert h4 {
            font-weight: 600;
        }

        .alert .icon {
            margin-right: 10px;
        }

        .alert .close {
            color: #000;
            opacity: .2;
            filter: alpha(opacity=20);
        }

            .alert .close:hover {
                opacity: .5;
                filter: alpha(opacity=50);
            }

        .alert a {
            color: #fff;
            text-decoration: underline;
        }

    .alert-success {
        border-color: #008d4c;
    }

    .alert-danger,
    .alert-error {
        border-color: #d73925;
    }

    .alert-warning {
        border-color: #e08e0b;
    }

    .alert-info {
        border-color: #00acd6;
    }

    .nav > li > a:hover,
    .nav > li > a:active,
    .nav > li > a:focus {
        color: #444;
        background: #f7f7f7;
    }

    .nav-pills > li > a {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
        border-top: 3px solid transparent;
        color: #444;
    }

        .nav-pills > li > a > .fa,
        .nav-pills > li > a > .glyphicon,
        .nav-pills > li > a > .ion {
            margin-right: 5px;
        }

    .nav-pills > li.active > a,
    .nav-pills > li.active > a:hover,
    .nav-pills > li.active > a:focus {
        border-top-color: #3c8dbc;
    }

    .nav-pills > li.active > a {
        font-weight: 600;
    }

    .nav-stacked > li > a {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
        border-top: 0;
        border-left: 3px solid transparent;
        color: #444;
    }

    .nav-stacked > li.active > a,
    .nav-stacked > li.active > a:hover {
        background: transparent;
        color: #444;
        border-top: 0;
        border-left-color: #3c8dbc;
    }

    .nav-stacked > li.header {
        border-bottom: 1px solid #ddd;
        color: #777;
        margin-bottom: 10px;
        padding: 5px 10px;
        text-transform: uppercase;
    }

    .itg_dashboard_nav-tabs-custom {
        margin-bottom: 20px;
        background: #E4E9EC;
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    }

        .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs {
            margin: 0;
            border-bottom-color: #f4f4f4;
        }

            .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li {
                border-top: 0px solid transparent;
                margin-bottom: -2px;
                margin-right: 5px;
            }

                .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li > a {
                    color: #0073B7;
                    -webkit-border-radius: 0px;
                    -moz-border-radius: 0px;
                    -ms-border-radius: 0px;
                    border-radius: 0px;
                }

                    .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li > a.text-muted {
                        color: #999;
                    }

                    .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li > a,
                    .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li > a:hover {
                        background: transparent;
                        margin: 0;
                    }

                        .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li > a:hover {
                            color: #FF9A00;
                        }

                .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li:not(.active) > a:hover,
                .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li:not(.active) > a:focus,
                .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li:not(.active) > a:active {
                    border-color: transparent;
                }

                /*.itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li.itg_dashboard_active {
                border-top-color:; #3c8dbc*/
                /*#FF9A00;
            }*/
                .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li.itg_dashboard_active > a,
                .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li.itg_dashboard_active:hover > a {
                    background-color: #fff;
                    color: #0073B7;
                }

                .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li.active > a {
                    border-top-color: transparent;
                    border-left-color: #f4f4f4;
                    border-right-color: #f4f4f4;
                }

                .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li:first-of-type {
                    margin-left: 0;
                }

                    .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li:first-of-type.active > a {
                        border-left-color: transparent;
                    }

            .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs.pull-right {
                float: none !important;
            }

                .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs.pull-right > li {
                    float: right;
                }

                    .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs.pull-right > li:first-of-type {
                        margin-right: 0;
                    }

                        .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs.pull-right > li:first-of-type > a {
                            border-left-width: 1px;
                        }

                        .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs.pull-right > li:first-of-type.active > a {
                            border-left-color: #f4f4f4;
                            border-right-color: transparent;
                        }

            .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li.header {
                line-height: 35px;
                padding: 0 10px;
                font-size: var(--font-20, 20px);
                color: #fff;
            }

                .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li.header > .fa,
                .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li.header > .glyphicon,
                .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li.header > .ion {
                    margin-right: 5px;
                }

        .itg_dashboard_nav-tabs-custom > .itg_dashboard_tab-content {
            background: #fff;
            padding: 10px;
            border-bottom-right-radius: 3px;
            border-bottom-left-radius: 3px;
        }

        .itg_dashboard_nav-tabs-custom .dropdown.open > a:active,
        .itg_dashboard_nav-tabs-custom .dropdown.open > a:focus {
            background: transparent;
            color: #999;
        }

        .itg_dashboard_nav-tabs-custom.tab-primary > .itg_dashboard_nav-tabs > li.itg_dashboard_active {
            border-top-color: #3c8dbc;
        }

        .itg_dashboard_nav-tabs-custom.tab-info > .itg_dashboard_nav-tabs > li.itg_dashboard_active {
            border-top-color: #00c0ef;
        }

        .itg_dashboard_nav-tabs-custom.tab-danger > .itg_dashboard_nav-tabs > li.itg_dashboard_active {
            border-top-color: #dd4b39;
        }

        .itg_dashboard_nav-tabs-custom.tab-warning > .itg_dashboard_nav-tabs > li.itg_dashboard_active {
            border-top-color: #2e95b7;
        }

        .itg_dashboard_nav-tabs-custom.tab-success > .itg_dashboard_nav-tabs > li.itg_dashboard_activeactive {
            border-top-color: #00a65a;
        }

        .itg_dashboard_nav-tabs-custom.tab-default > .itg_dashboard_nav-tabs > li.itg_dashboard_active {
            border-top-color: #d2d6de;
        }

    .pagination > li > a {
        background: #fafafa;
        color: #666;
    }

    .pagination.pagination-flat > li > a {
        -webkit-border-radius: 0 !important;
        -moz-border-radius: 0 !important;
        -ms-border-radius: 0 !important;
        border-radius: 0 !important;
    }

    .products-list {
        list-style: none;
        margin: 0;
        padding: 0;
    }

        .products-list > .item {
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            -ms-border-radius: 3px;
            border-radius: 3px;
            -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
            box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
            padding: 10px 0;
            background: #fff;
        }

            .products-list > .item:before,
            .products-list > .item:after {
                content: " ";
                display: table;
            }

        .products-list .item:after {
            clear: both;
        }

        .products-list .product-img {
            float: left;
            max-width: 50px;
        }

            .products-list .product-img img {
                width: 50px;
                height: 50px;
            }

        .products-list .product-info {
            margin-left: 60px;
        }

        .products-list .product-title {
            font-weight: 600;
        }

        .products-list .product-description {
            display: block;
            color: #999;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

    .list-with-image {
        list-style: none;
        margin: 0;
        padding: 0;
    }

        .list-with-image > .item {
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            -ms-border-radius: 3px;
            border-radius: 3px;
            -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
            box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
            padding: 10px 0;
            background: #fff;
        }

            .list-with-image > .item:before,
            .list-with-image > .item:after {
                content: " ";
                display: table;
            }

        .list-with-image .item:after {
            clear: both;
        }

        .list-with-image .list-img {
            float: left;
            max-width: 50px;
        }

            .list-with-image .list-img img {
                width: 45px;
                height: 45px;
                max-width: 45px;
                -webkit-border-radius: 50%;
                -moz-border-radius: 50%;
                -ms-border-radius: 50%;
                border-radius: 50%;
                overflow: hidden;
            }

        .list-with-image .list-info {
            margin-left: 60px;
        }

        .list-with-image .list-title {
            font-weight: 600;
        }

        .list-with-image .list-description {
            display: block;
            color: #777;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .list-with-image .list-date {
            display: block;
            color: #999;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            font-size: 11px;
        }

    .product-img {
        float: left;
        max-width: 50px;
    }

    .product-list-in-box > .item {
        -webkit-box-shadow: none;
        box-shadow: none;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
        border-bottom: 1px solid #f4f4f4;
    }

        .product-list-in-box > .item:last-of-type {
            border-bottom-width: 0;
        }

    .table > thead > tr > th,
    .table > tbody > tr > th,
    .table > tfoot > tr > th,
    .table > thead > tr > td,
    .table > tbody > tr > td,
    .table > tfoot > tr > td {
        border-top: 1px solid #f4f4f4;
    }

    .table > thead > tr > th {
        border-bottom: 2px solid #f4f4f4;
    }

    .table tr td .progress {
        margin-top: 5px;
    }

    .table-bordered {
        border: 1px solid #f4f4f4;
    }

        .table-bordered > thead > tr > th,
        .table-bordered > tbody > tr > th,
        .table-bordered > tfoot > tr > th,
        .table-bordered > thead > tr > td,
        .table-bordered > tbody > tr > td,
        .table-bordered > tfoot > tr > td {
            border: 1px solid #f4f4f4;
        }

        .table-bordered > thead > tr > th,
        .table-bordered > thead > tr > td {
            border-bottom-width: 2px;
        }

    .table.no-border,
    .table.no-border td,
    .table.no-border th {
        border: 0;
    }

    table.text-center,
    table.text-center td,
    table.text-center th {
        text-align: center;
    }

    .table.align th {
        text-align: left;
    }

    .table.align td {
        text-align: right;
    }

    .label-default {
        background-color: #d2d6de;
        color: #444;
    }

    .direct-chat .box-body {
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
        position: relative;
        overflow-x: hidden;
        padding: 0;
    }

    .direct-chat.chat-pane-open .direct-chat-contacts {
        -webkit-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        transform: translate(0, 0);
    }

    .direct-chat-messages {
        -webkit-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        transform: translate(0, 0);
        padding: 10px;
        height: 250px;
        overflow: auto;
    }

    .direct-chat-msg,
    .direct-chat-text {
        display: block;
    }

    .direct-chat-msg {
        margin-bottom: 10px;
    }

        .direct-chat-msg:before,
        .direct-chat-msg:after {
            content: " ";
            display: table;
        }

        .direct-chat-msg:after {
            clear: both;
        }

    .direct-chat-messages,
    .direct-chat-contacts {
        -webkit-transition: -webkit-transform .5s ease-in-out;
        -moz-transition: -moz-transform .5s ease-in-out;
        -o-transition: -o-transform .5s ease-in-out;
        transition: transform .5s ease-in-out;
    }

    .direct-chat-text {
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        border-radius: 5px;
        position: relative;
        padding: 5px 10px;
        background: #d2d6de;
        border: 1px solid #d2d6de;
        margin: 5px 0 0 50px;
        color: #444;
    }

        .direct-chat-text:after,
        .direct-chat-text:before {
            position: absolute;
            right: 100%;
            top: 15px;
            border: solid transparent;
            border-right-color: #d2d6de;
            content: ' ';
            height: 0;
            width: 0;
            pointer-events: none;
        }

        .direct-chat-text:after {
            border-width: 5px;
            margin-top: -5px;
        }

        .direct-chat-text:before {
            border-width: 6px;
            margin-top: -6px;
        }

    .right .direct-chat-text {
        margin-right: 50px;
        margin-left: 0;
    }

        .right .direct-chat-text:after,
        .right .direct-chat-text:before {
            right: auto;
            left: 100%;
            border-right-color: transparent;
            border-left-color: #d2d6de;
        }

    .direct-chat-img {
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        float: left;
        width: 40px;
        height: 40px;
    }

    .right .direct-chat-img {
        float: right;
    }

    .direct-chat-info {
        display: block;
        margin-bottom: 2px;
        font-size: var(--font-12, 12px);
    }

    .direct-chat-name {
        font-weight: 600;
    }

    .direct-chat-timestamp {
        color: #999;
    }

    .direct-chat-contacts-open .direct-chat-contacts {
        -webkit-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        transform: translate(0, 0);
    }

    .direct-chat-contacts {
        -webkit-transform: translate(101%, 0);
        -ms-transform: translate(101%, 0);
        -o-transform: translate(101%, 0);
        transform: translate(101%, 0);
        position: absolute;
        top: 0;
        bottom: 0;
        height: 250px;
        width: 100%;
        background: #222d32;
        color: #fff;
        overflow: auto;
    }

    .contacts-list > li {
        border-bottom: 1px solid rgba(0, 0, 0, 0.2);
        padding: 10px;
        margin: 0;
    }

        .contacts-list > li:before,
        .contacts-list > li:after {
            content: " ";
            display: table;
        }

        .contacts-list > li:after {
            clear: both;
        }

        .contacts-list > li:last-of-type {
            border-bottom: none;
        }

    .contacts-list-img {
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        width: 40px;
        float: left;
    }

    .contacts-list-info {
        margin-left: 45px;
        color: #fff;
    }

    .contacts-list-name,
    .contacts-list-status {
        display: block;
    }

    .contacts-list-name {
        font-weight: 600;
    }

    .contacts-list-status {
        font-size: var(--font-12, 12px);
    }

    .contacts-list-date {
        color: #aaa;
        font-weight: normal;
    }

    .contacts-list-msg {
        color: #999;
    }

    .direct-chat-danger .right > .direct-chat-text {
        background: #dd4b39;
        border-color: #dd4b39;
        color: #fff;
    }

        .direct-chat-danger .right > .direct-chat-text:after,
        .direct-chat-danger .right > .direct-chat-text:before {
            border-left-color: #dd4b39;
        }

    .direct-chat-primary .right > .direct-chat-text {
        background: #3c8dbc;
        border-color: #3c8dbc;
        color: #fff;
    }

        .direct-chat-primary .right > .direct-chat-text:after,
        .direct-chat-primary .right > .direct-chat-text:before {
            border-left-color: #3c8dbc;
        }

    .direct-chat-warning .right > .direct-chat-text {
        background: #2e95b7;
        border-color: #2e95b7;
        color: #fff;
    }

        .direct-chat-warning .right > .direct-chat-text:after,
        .direct-chat-warning .right > .direct-chat-text:before {
            border-left-color: #2e95b7;
        }

    .direct-chat-info .right > .direct-chat-text {
        background: #00c0ef;
        border-color: #00c0ef;
        color: #fff;
    }

        .direct-chat-info .right > .direct-chat-text:after,
        .direct-chat-info .right > .direct-chat-text:before {
            border-left-color: #00c0ef;
        }

    .direct-chat-success .right > .direct-chat-text {
        background: #00a65a;
        border-color: #00a65a;
        color: #fff;
    }

        .direct-chat-success .right > .direct-chat-text:after,
        .direct-chat-success .right > .direct-chat-text:before {
            border-left-color: #00a65a;
        }

    .users-list > li {
        width: 25%;
        float: left;
        padding: 10px;
        text-align: center;
    }

        .users-list > li img {
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            -ms-border-radius: 50%;
            border-radius: 50%;
            max-width: 100%;
            height: auto;
        }

        .users-list > li > a:hover,
        .users-list > li > a:hover .users-list-name {
            color: #206e87;
        }

    .users-list-name,
    .users-list-date {
        display: block;
    }

    .users-list-name {
        font-weight: 600;
        color: #206e87;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .users-list-date {
        color: #999;
        font-size: var(--font-12, 12px);
    }

    .carousel-control.itg_dashboard_left,
    .carousel-control.itg_dashboard_right {
        background-image: none;
        color: #206e87;
        width: 10%;
    }

    .carousel-control {
        text-shadow: none;
    }

        .carousel-control > .fa {
            font-size: 40px;
            position: absolute;
            top: 50%;
            z-index: 5;
            display: inline-block;
            margin-top: -20px;
            left: 40%;
        }

    .modal {
        background: rgba(0, 0, 0, 0.3);
    }

    .modal-content {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
        -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125);
        box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125);
        border: 0;
    }

    @media (min-width: 768px) {
        .modal-content {
            -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125);
            box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125);
        }

        .eduwaveHeader .navbar-default .navbar-collapse {
            height: 52px !important;
        }
    }

    .modal-header {
        border-bottom-color: #f4f4f4;
    }

    .modal-footer {
        border-top-color: #f4f4f4;
        padding: 10px 15px;
    }

    .modal-primary .modal-header,
    .modal-primary .modal-footer {
        border-color: #307095;
    }

    .modal-warning .modal-header,
    .modal-warning .modal-footer {
        border-color: #c87f0a;
    }

    .modal-info .modal-header,
    .modal-info .modal-footer {
        border-color: #0097bc;
    }

    .modal-success .modal-header,
    .modal-success .modal-footer {
        border-color: #00733e;
    }

    .modal-danger .modal-header,
    .modal-danger .modal-footer {
        border-color: #c23321;
    }

    .box-widget {
        border: none;
        position: relative;
    }

    .widget-user .widget-user-header {
        padding: 20px;
        height: 120px;
        border-top-right-radius: 3px;
        border-top-left-radius: 3px;
    }

    .widget-user .widget-user-username {
        margin-top: 0;
        margin-bottom: 5px;
        font-size: var(--font-25, 25px);
        font-weight: 300;
        text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    }

    .widget-user .widget-user-desc {
        margin-top: 0;
    }

    .widget-user .widget-user-image {
        position: absolute;
        top: 65px;
        left: 50%;
        margin-left: -45px;
    }

        .widget-user .widget-user-image > img {
            width: 90px;
            height: auto;
            border: 3px solid #fff;
        }

    .widget-user .box-footer {
        padding-top: 30px;
    }

    .widget-user-2 .widget-user-header {
        padding: 20px;
        border-top-right-radius: 3px;
        border-top-left-radius: 3px;
    }

    .widget-user-2 .widget-user-username {
        margin-top: 5px;
        margin-bottom: 5px;
        font-size: var(--font-25, 25px);
        font-weight: 300;
    }

    .widget-user-2 .widget-user-desc {
        margin-top: 0;
    }

    .widget-user-2 .widget-user-username,
    .widget-user-2 .widget-user-desc {
        margin-left: 75px;
    }

    .widget-user-2 .widget-user-image > img {
        width: 65px;
        height: auto;
        float: left;
    }

    .mailbox-messages > .table {
        margin: 0;
    }

    .mailbox-controls {
        padding: 5px;
    }

        .mailbox-controls.with-border {
            border-bottom: 1px solid #f4f4f4;
        }

    .mailbox-read-info {
        border-bottom: 1px solid #f4f4f4;
        padding: 10px;
    }

        .mailbox-read-info h3 {
            font-size: var(--font-20, 20px);
            margin: 0;
        }

        .mailbox-read-info h5 {
            margin: 0;
            padding: 5px 0 0 0;
        }

    .mailbox-read-time {
        color: #999;
        font-size: var(--font-13, 13px);
    }

    .mailbox-read-message {
        padding: 10px;
    }

    .mailbox-attachments li {
        float: left;
        width: 200px;
        border: 1px solid #eee;
        margin-bottom: 10px;
        margin-right: 10px;
    }

    .mailbox-attachment-name {
        font-weight: bold;
        color: #666;
    }

    .mailbox-attachment-icon,
    .mailbox-attachment-info,
    .mailbox-attachment-size {
        display: block;
    }

    .mailbox-attachment-info {
        padding: 10px;
        background: #f4f4f4;
    }

    .mailbox-attachment-size {
        color: #999;
        font-size: var(--font-12, 12px);
    }

    .mailbox-attachment-icon {
        text-align: center;
        font-size: 65px;
        color: #666;
        padding: 20px 10px;
    }

        .mailbox-attachment-icon.has-img {
            padding: 0;
        }

            .mailbox-attachment-icon.has-img > img {
                max-width: 100%;
                height: auto;
            }

    .lockscreen {
        background: #d2d6de;
    }

    .lockscreen-logo {
        font-size: var(--font-35, 35px);
        text-align: center;
        margin-bottom: 25px;
        font-weight: 300;
    }

        .lockscreen-logo a {
            color: #444;
        }

    .lockscreen-wrapper {
        max-width: 400px;
        margin: 0 auto;
        margin-top: 10%;
    }

    .lockscreen .lockscreen-name {
        text-align: center;
        font-weight: 600;
    }

    .lockscreen-item {
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        -ms-border-radius: 4px;
        border-radius: 4px;
        padding: 0;
        background: #fff;
        position: relative;
        margin: 10px auto 30px auto;
        width: 290px;
    }

    .lockscreen-image {
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        position: absolute;
        left: -10px;
        top: -25px;
        background: #fff;
        padding: 5px;
        z-index: 10;
    }

        .lockscreen-image > img {
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            -ms-border-radius: 50%;
            border-radius: 50%;
            width: 70px;
            height: 70px;
        }

    .lockscreen-credentials {
        margin-left: 70px;
    }

        .lockscreen-credentials .form-control {
            border: 0;
        }

        .lockscreen-credentials .btn {
            background-color: #fff;
            border: 0;
            padding: 0 10px;
        }

    .lockscreen-footer {
        margin-top: 10px;
    }

    .login-logo,
    .register-logo {
        font-size: var(--font-35, 35px);
        text-align: center;
        margin-bottom: 25px;
        font-weight: 300;
    }

        .login-logo a,
        .register-logo a {
            color: #444;
        }

    .login-page,
    .register-page {
        background: #d2d6de;
    }

    .login-box,
    .register-box {
        width: 360px;
        margin: 7% auto;
    }

    @media (max-width: 768px) {
        .login-box,
        .register-box {
            width: 90%;
            margin-top: 20px;
        }
    }

    .login-box-body,
    .register-box-body {
        background: #fff;
        padding: 20px;
        border-top: 0;
        color: #666;
    }

        .login-box-body .form-control-feedback,
        .register-box-body .form-control-feedback {
            color: #777;
        }

    .login-box-msg,
    .register-box-msg {
        margin: 0;
        text-align: center;
        padding: 0 20px 20px 20px;
    }

    .social-auth-links {
        margin: 10px 0;
    }

    .error-page {
        width: 600px;
        margin: 20px auto 0 auto;
    }

    @media (max-width: 991px) {
        .error-page {
            width: 100%;
        }
    }

    .error-page > .headline {
        float: left;
        font-size: 100px;
        font-weight: 300;
    }

    @media (max-width: 991px) {
        .error-page > .headline {
            float: none;
            text-align: center;
        }
    }

    .error-page > .error-content {
        margin-left: 190px;
        display: block;
    }

    @media (max-width: 991px) {
        .error-page > .error-content {
            margin-left: 0;
        }
    }

    .error-page > .error-content > h3 {
        font-weight: 300;
        font-size: var(--font-25, 25px);
    }

    @media (max-width: 991px) {
        .error-page > .error-content > h3 {
            text-align: center;
        }
    }

    .invoice {
        position: relative;
        background: #fff;
        border: 1px solid #f4f4f4;
        padding: 20px;
        margin: 10px 25px;
    }

    .invoice-title {
        margin-top: 0;
    }

    .profile-user-img {
        margin: 0 auto;
        width: 100px;
        padding: 3px;
        border: 3px solid #d2d6de;
    }

    .profile-username {
        font-size: var(--font-21, 21px);
        margin-top: 5px;
    }

    .post {
        border-bottom: 1px solid #d2d6de;
        margin-bottom: 15px;
        padding-bottom: 15px;
        color: #666;
    }

        .post:last-of-type {
            border-bottom: 0;
            margin-bottom: 0;
            padding-bottom: 0;
        }

        .post .user-block {
            margin-bottom: 15px;
        }

    .btn-social {
        position: relative;
        padding-left: 44px;
        text-align: left;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

        .btn-social > :first-child {
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            width: 32px;
            line-height: 34px;
            font-size: var(--font-25, 25px);
            text-align: center;
            border-right: 1px solid rgba(0, 0, 0, 0.2);
        }

        .btn-social.btn-lg {
            padding-left: 61px;
        }

            .btn-social.btn-lg > :first-child {
                line-height: 45px;
                width: 45px;
                font-size: var(--font-28, 28px);
            }

        .btn-social.btn-sm {
            padding-left: 38px;
        }

            .btn-social.btn-sm > :first-child {
                line-height: 28px;
                width: 28px;
                font-size: var(--font-22, 22px);
            }

        .btn-social.btn-xs {
            padding-left: 30px;
        }

            .btn-social.btn-xs > :first-child {
                line-height: 20px;
                width: 20px;
                font-size: var(--font-20, 20px);
            }

    .btn-social-icon {
        position: relative;
        padding-left: 44px;
        text-align: left;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        height: 34px;
        width: 34px;
        padding: 0;
    }

        .btn-social-icon > :first-child {
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            width: 32px;
            line-height: 34px;
            font-size: var(--font-25, 25px);
            text-align: center;
            border-right: 1px solid rgba(0, 0, 0, 0.2);
        }

        .btn-social-icon.btn-lg {
            padding-left: 61px;
        }

            .btn-social-icon.btn-lg > :first-child {
                line-height: 45px;
                width: 45px;
                font-size: var(--font-28, 28px);
            }

        .btn-social-icon.btn-sm {
            padding-left: 38px;
        }

            .btn-social-icon.btn-sm > :first-child {
                line-height: 28px;
                width: 28px;
                font-size: var(--font-22, 22px);
            }

        .btn-social-icon.btn-xs {
            padding-left: 30px;
        }

            .btn-social-icon.btn-xs > :first-child {
                line-height: 20px;
                width: 20px;
                font-size: var(--font-19, 19px);
            }

        .btn-social-icon > :first-child {
            border: none;
            text-align: center;
            width: 100%;
        }

        .btn-social-icon.btn-lg {
            height: 45px;
            width: 45px;
            padding-left: 0;
            padding-right: 0;
        }

        .btn-social-icon.btn-sm {
            height: 30px;
            width: 30px;
            padding-left: 0;
            padding-right: 0;
        }

        .btn-social-icon.btn-xs {
            height: 22px;
            width: 22px;
            padding-left: 0;
            padding-right: 0;
        }

    .btn-adn {
        color: #fff;
        background-color: #d87a68;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-adn:focus,
        .btn-adn.focus {
            color: #fff;
            background-color: #ce563f;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-adn:hover {
            color: #fff;
            background-color: #ce563f;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-adn:active,
        .btn-adn.active,
        .open > .dropdown-toggle.btn-adn {
            color: #fff;
            background-color: #ce563f;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-adn:active,
        .btn-adn.active,
        .open > .dropdown-toggle.btn-adn {
            background-image: none;
        }

        .btn-adn .badge {
            color: #d87a68;
            background-color: #fff;
        }

    .btn-bitbucket {
        color: #fff;
        background-color: #205081;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-bitbucket:focus,
        .btn-bitbucket.focus {
            color: #fff;
            background-color: #163758;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-bitbucket:hover {
            color: #fff;
            background-color: #163758;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-bitbucket:active,
        .btn-bitbucket.active,
        .open > .dropdown-toggle.btn-bitbucket {
            color: #fff;
            background-color: #163758;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-bitbucket:active,
        .btn-bitbucket.active,
        .open > .dropdown-toggle.btn-bitbucket {
            background-image: none;
        }

        .btn-bitbucket .badge {
            color: #205081;
            background-color: #fff;
        }

    .btn-dropbox {
        color: #fff;
        background-color: #1087dd;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-dropbox:focus,
        .btn-dropbox.focus {
            color: #fff;
            background-color: #0d6aad;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-dropbox:hover {
            color: #fff;
            background-color: #0d6aad;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-dropbox:active,
        .btn-dropbox.active,
        .open > .dropdown-toggle.btn-dropbox {
            color: #fff;
            background-color: #0d6aad;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-dropbox:active,
        .btn-dropbox.active,
        .open > .dropdown-toggle.btn-dropbox {
            background-image: none;
        }

        .btn-dropbox .badge {
            color: #1087dd;
            background-color: #fff;
        }

    .btn-facebook {
        color: #fff;
        background-color: #3b5998;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-facebook:focus,
        .btn-facebook.focus {
            color: #fff;
            background-color: #2d4373;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-facebook:hover {
            color: #fff;
            background-color: #2d4373;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-facebook:active,
        .btn-facebook.active,
        .open > .dropdown-toggle.btn-facebook {
            color: #fff;
            background-color: #2d4373;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-facebook:active,
        .btn-facebook.active,
        .open > .dropdown-toggle.btn-facebook {
            background-image: none;
        }

        .btn-facebook .badge {
            color: #3b5998;
            background-color: #fff;
        }

    .btn-flickr {
        color: #fff;
        background-color: #ff0084;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-flickr:focus,
        .btn-flickr.focus {
            color: #fff;
            background-color: #cc006a;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-flickr:hover {
            color: #fff;
            background-color: #cc006a;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-flickr:active,
        .btn-flickr.active,
        .open > .dropdown-toggle.btn-flickr {
            color: #fff;
            background-color: #cc006a;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-flickr:active,
        .btn-flickr.active,
        .open > .dropdown-toggle.btn-flickr {
            background-image: none;
        }

        .btn-flickr .badge {
            color: #ff0084;
            background-color: #fff;
        }

    .btn-foursquare {
        color: #fff;
        background-color: #f94877;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-foursquare:focus,
        .btn-foursquare.focus {
            color: #fff;
            background-color: #f71752;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-foursquare:hover {
            color: #fff;
            background-color: #f71752;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-foursquare:active,
        .btn-foursquare.active,
        .open > .dropdown-toggle.btn-foursquare {
            color: #fff;
            background-color: #f71752;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-foursquare:active,
        .btn-foursquare.active,
        .open > .dropdown-toggle.btn-foursquare {
            background-image: none;
        }

        .btn-foursquare .badge {
            color: #f94877;
            background-color: #fff;
        }

    .btn-github {
        color: #fff;
        background-color: #444;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-github:focus,
        .btn-github.focus {
            color: #fff;
            background-color: #2b2b2b;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-github:hover {
            color: #fff;
            background-color: #2b2b2b;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-github:active,
        .btn-github.active,
        .open > .dropdown-toggle.btn-github {
            color: #fff;
            background-color: #2b2b2b;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-github:active,
        .btn-github.active,
        .open > .dropdown-toggle.btn-github {
            background-image: none;
        }

        .btn-github .badge {
            color: #444;
            background-color: #fff;
        }

    .btn-google {
        color: #fff;
        background-color: #dd4b39;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-google:focus,
        .btn-google.focus {
            color: #fff;
            background-color: #c23321;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-google:hover {
            color: #fff;
            background-color: #c23321;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-google:active,
        .btn-google.active,
        .open > .dropdown-toggle.btn-google {
            color: #fff;
            background-color: #c23321;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-google:active,
        .btn-google.active,
        .open > .dropdown-toggle.btn-google {
            background-image: none;
        }

        .btn-google .badge {
            color: #dd4b39;
            background-color: #fff;
        }

    .btn-instagram {
        color: #fff;
        background-color: #3f729b;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-instagram:focus,
        .btn-instagram.focus {
            color: #fff;
            background-color: #305777;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-instagram:hover {
            color: #fff;
            background-color: #305777;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-instagram:active,
        .btn-instagram.active,
        .open > .dropdown-toggle.btn-instagram {
            color: #fff;
            background-color: #305777;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-instagram:active,
        .btn-instagram.active,
        .open > .dropdown-toggle.btn-instagram {
            background-image: none;
        }

        .btn-instagram .badge {
            color: #3f729b;
            background-color: #fff;
        }

    .btn-linkedin {
        color: #fff;
        background-color: #007bb6;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-linkedin:focus,
        .btn-linkedin.focus {
            color: #fff;
            background-color: #005983;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-linkedin:hover {
            color: #fff;
            background-color: #005983;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-linkedin:active,
        .btn-linkedin.active,
        .open > .dropdown-toggle.btn-linkedin {
            color: #fff;
            background-color: #005983;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-linkedin:active,
        .btn-linkedin.active,
        .open > .dropdown-toggle.btn-linkedin {
            background-image: none;
        }

        .btn-linkedin .badge {
            color: #007bb6;
            background-color: #fff;
        }

    .btn-microsoft {
        color: #fff;
        background-color: #2672ec;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-microsoft:focus,
        .btn-microsoft.focus {
            color: #fff;
            background-color: #125acd;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-microsoft:hover {
            color: #fff;
            background-color: #125acd;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-microsoft:active,
        .btn-microsoft.active,
        .open > .dropdown-toggle.btn-microsoft {
            color: #fff;
            background-color: #125acd;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-microsoft:active,
        .btn-microsoft.active,
        .open > .dropdown-toggle.btn-microsoft {
            background-image: none;
        }

        .btn-microsoft .badge {
            color: #2672ec;
            background-color: #fff;
        }

    .btn-openid {
        color: #fff;
        background-color: #f7931e;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-openid:focus,
        .btn-openid.focus {
            color: #fff;
            background-color: #da7908;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-openid:hover {
            color: #fff;
            background-color: #da7908;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-openid:active,
        .btn-openid.active,
        .open > .dropdown-toggle.btn-openid {
            color: #fff;
            background-color: #da7908;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-openid:active,
        .btn-openid.active,
        .open > .dropdown-toggle.btn-openid {
            background-image: none;
        }

        .btn-openid .badge {
            color: #f7931e;
            background-color: #fff;
        }

    .btn-pinterest {
        color: #fff;
        background-color: #cb2027;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-pinterest:focus,
        .btn-pinterest.focus {
            color: #fff;
            background-color: #9f191f;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-pinterest:hover {
            color: #fff;
            background-color: #9f191f;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-pinterest:active,
        .btn-pinterest.active,
        .open > .dropdown-toggle.btn-pinterest {
            color: #fff;
            background-color: #9f191f;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-pinterest:active,
        .btn-pinterest.active,
        .open > .dropdown-toggle.btn-pinterest {
            background-image: none;
        }

        .btn-pinterest .badge {
            color: #cb2027;
            background-color: #fff;
        }

    .btn-reddit {
        color: #000;
        background-color: #eff7ff;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-reddit:focus,
        .btn-reddit.focus {
            color: #000;
            background-color: #bcddff;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-reddit:hover {
            color: #000;
            background-color: #bcddff;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-reddit:active,
        .btn-reddit.active,
        .open > .dropdown-toggle.btn-reddit {
            color: #000;
            background-color: #bcddff;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-reddit:active,
        .btn-reddit.active,
        .open > .dropdown-toggle.btn-reddit {
            background-image: none;
        }

        .btn-reddit .badge {
            color: #eff7ff;
            background-color: #000;
        }

    .btn-soundcloud {
        color: #fff;
        background-color: #f50;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-soundcloud:focus,
        .btn-soundcloud.focus {
            color: #fff;
            background-color: #c40;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-soundcloud:hover {
            color: #fff;
            background-color: #c40;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-soundcloud:active,
        .btn-soundcloud.active,
        .open > .dropdown-toggle.btn-soundcloud {
            color: #fff;
            background-color: #c40;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-soundcloud:active,
        .btn-soundcloud.active,
        .open > .dropdown-toggle.btn-soundcloud {
            background-image: none;
        }

        .btn-soundcloud .badge {
            color: #f50;
            background-color: #fff;
        }

    .btn-tumblr {
        color: #fff;
        background-color: #2c4762;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-tumblr:focus,
        .btn-tumblr.focus {
            color: #fff;
            background-color: #1c2d3f;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-tumblr:hover {
            color: #fff;
            background-color: #1c2d3f;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-tumblr:active,
        .btn-tumblr.active,
        .open > .dropdown-toggle.btn-tumblr {
            color: #fff;
            background-color: #1c2d3f;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-tumblr:active,
        .btn-tumblr.active,
        .open > .dropdown-toggle.btn-tumblr {
            background-image: none;
        }

        .btn-tumblr .badge {
            color: #2c4762;
            background-color: #fff;
        }

    .btn-twitter {
        color: #fff;
        background-color: #55acee;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-twitter:focus,
        .btn-twitter.focus {
            color: #fff;
            background-color: #2795e9;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-twitter:hover {
            color: #fff;
            background-color: #2795e9;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-twitter:active,
        .btn-twitter.active,
        .open > .dropdown-toggle.btn-twitter {
            color: #fff;
            background-color: #2795e9;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-twitter:active,
        .btn-twitter.active,
        .open > .dropdown-toggle.btn-twitter {
            background-image: none;
        }

        .btn-twitter .badge {
            color: #55acee;
            background-color: #fff;
        }

    .btn-vimeo {
        color: #fff;
        background-color: #1ab7ea;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-vimeo:focus,
        .btn-vimeo.focus {
            color: #fff;
            background-color: #1295bf;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-vimeo:hover {
            color: #fff;
            background-color: #1295bf;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-vimeo:active,
        .btn-vimeo.active,
        .open > .dropdown-toggle.btn-vimeo {
            color: #fff;
            background-color: #1295bf;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-vimeo:active,
        .btn-vimeo.active,
        .open > .dropdown-toggle.btn-vimeo {
            background-image: none;
        }

        .btn-vimeo .badge {
            color: #1ab7ea;
            background-color: #fff;
        }

    .btn-vk {
        color: #fff;
        background-color: #587ea3;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-vk:focus,
        .btn-vk.focus {
            color: #fff;
            background-color: #466482;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-vk:hover {
            color: #fff;
            background-color: #466482;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-vk:active,
        .btn-vk.active,
        .open > .dropdown-toggle.btn-vk {
            color: #fff;
            background-color: #466482;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-vk:active,
        .btn-vk.active,
        .open > .dropdown-toggle.btn-vk {
            background-image: none;
        }

        .btn-vk .badge {
            color: #587ea3;
            background-color: #fff;
        }

    .btn-yahoo {
        color: #fff;
        background-color: #720e9e;
        border-color: rgba(0, 0, 0, 0.2);
    }

        .btn-yahoo:focus,
        .btn-yahoo.focus {
            color: #fff;
            background-color: #500a6f;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-yahoo:hover {
            color: #fff;
            background-color: #500a6f;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-yahoo:active,
        .btn-yahoo.active,
        .open > .dropdown-toggle.btn-yahoo {
            color: #fff;
            background-color: #500a6f;
            border-color: rgba(0, 0, 0, 0.2);
        }

        .btn-yahoo:active,
        .btn-yahoo.active,
        .open > .dropdown-toggle.btn-yahoo {
            background-image: none;
        }

        .btn-yahoo .badge {
            color: #720e9e;
            background-color: #fff;
        }

    .fc-button {
        background: #f4f4f4;
        background-image: none;
        color: #444;
        border-color: #ddd;
        border-bottom-color: #ddd;
    }

        .fc-button:hover,
        .fc-button:active,
        .fc-button.hover {
            background-color: #e9e9e9;
        }

    .fc-header-title h2 {
        font-size: var(--font-15, 15px);
        line-height: 1.6em;
        color: #666;
        margin-left: 10px;
    }

    .steps-list li::before {
        background: #206e87 !important;
    }

    .fc-header-right {
        padding-right: 10px;
    }

    .fc-header-left {
        padding-left: 10px;
    }

    .fullSearchAreaBottom .footer {
        min-height: auto;
    }

    .jqTransformRadio {
        top: 2px;
    }

    .eduwaveWrapper .jqTransformRadioWrapper .jqTransformRadio {
        top: auto;
    }
    /*.table_radio_button .jqTransformRadioWrapper {
    padding: 0 5px;
}*/
    .table_radio_button label {
        padding: 0 10px;
    }

    .fc-widget-header {
        background: #fafafa;
    }

    .fc-grid {
        width: 100%;
        border: 0;
    }

    .fc-widget-header:first-of-type,
    .fc-widget-content:first-of-type {
        border-left: 0;
        border-right: 0;
    }

    .fc-widget-header:last-of-type,
    .fc-widget-content:last-of-type {
        border-right: 0;
    }

    .fc-toolbar {
        padding: 10px;
        margin: 0;
    }

    .fc-day-number {
        font-size: var(--font-20, 20px);
        font-weight: 300;
        padding-right: 10px;
    }

    .fc-color-picker {
        list-style: none;
        margin: 0;
        padding: 0;
    }

        .fc-color-picker > li {
            float: left;
            font-size: var(--font-30, 30px);
            margin-right: 5px;
            line-height: 30px;
        }

            .fc-color-picker > li .fa {
                -webkit-transition: -webkit-transform linear .3s;
                -moz-transition: -moz-transform linear .3s;
                -o-transition: -o-transform linear .3s;
                transition: transform linear .3s;
            }

                .fc-color-picker > li .fa:hover {
                    -webkit-transform: rotate(30deg);
                    -ms-transform: rotate(30deg);
                    -o-transform: rotate(30deg);
                    transform: rotate(30deg);
                }

    #add-new-event {
        -webkit-transition: all linear .3s;
        -o-transition: all linear .3s;
        transition: all linear .3s;
    }

    .external-event {
        padding: 5px 10px;
        font-weight: bold;
        margin-bottom: 4px;
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
        text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        -ms-border-radius: 3px;
        border-radius: 3px;
        cursor: move;
    }

        .external-event:hover {
            box-shadow: inset 0 0 90px rgba(0, 0, 0, 0.2);
        }

    .select2-container--default.select2-container--focus,
    .select2-selection.select2-container--focus,
    .select2-container--default:focus,
    .select2-selection:focus,
    .select2-container--default:active,
    .select2-selection:active {
        outline: none;
    }

    .select2-container--default .select2-selection--single,
    .select2-selection .select2-selection--single {
        border: 1px solid #d2d6de;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
        padding: 6px 12px;
        height: 34px;
    }

    .select2-container--default.select2-container--open {
        border-color: #3c8dbc;
    }

    .select2-dropdown {
        border: 1px solid #d2d6de;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
    }

    .select2-container--default .select2-results__option--highlighted[aria-selected] {
        background-color: #3c8dbc;
        color: white;
    }

    .select2-results__option {
        padding: 6px 12px;
        user-select: none;
        -webkit-user-select: none;
    }

    .select2-container .select2-selection--single .select2-selection__rendered {
        padding-left: 0;
        padding-right: 0;
        height: auto;
        margin-top: -4px;
    }

    .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
        padding-right: 6px;
        padding-left: 20px;
    }

    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 28px;
        right: 3px;
    }

        .select2-container--default .select2-selection--single .select2-selection__arrow b {
            margin-top: 0;
        }

    .select2-dropdown .select2-search__field,
    .select2-search--inline .select2-search__field {
        border: 1px solid #d2d6de;
    }

        .select2-dropdown .select2-search__field:focus,
        .select2-search--inline .select2-search__field:focus {
            outline: none;
            border: 1px solid #3c8dbc;
        }

    .select2-container--default .select2-results__option[aria-disabled=true] {
        color: #999;
    }

    .select2-container--default .select2-results__option[aria-selected=true] {
        background-color: #ddd;
    }

        .select2-container--default .select2-results__option[aria-selected=true],
        .select2-container--default .select2-results__option[aria-selected=true]:hover {
            color: #444;
        }

    .select2-container--default .select2-selection--multiple {
        border: 1px solid #d2d6de;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
    }

        .select2-container--default .select2-selection--multiple:focus {
            border-color: #3c8dbc;
        }

    .select2-container--default.select2-container--focus .select2-selection--multiple {
        border-color: #d2d6de;
    }

    .select2-container--default .select2-selection--multiple .select2-selection__choice {
        background-color: #3c8dbc;
        border-color: #367fa9;
        padding: 1px 10px;
        color: #fff;
    }

    .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
        margin-right: 5px;
        color: rgba(255, 255, 255, 0.7);
    }

        .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
            color: #fff;
        }

    .select2-container .select2-selection--single .select2-selection__rendered {
        padding-right: 10px;
    }

    .pad {
        padding: 10px;
    }

    .margin {
        margin: 10px;
    }

    .margin-bottom {
        margin-bottom: 20px;
    }

    .margin-bottom-none {
        margin-bottom: 0;
    }

    .margin-r-5 {
        margin-right: 5px;
    }

    .inline {
        display: inline;
    }

    .description-block {
        display: block;
        margin: 10px 0;
        text-align: center;
    }

        .description-block.margin-bottom {
            margin-bottom: 25px;
        }

        .description-block > .description-header {
            margin: 0;
            padding: 0;
            font-weight: 600;
            font-size: var(--font-16, 16px);
        }

        .description-block > .description-text {
            text-transform: uppercase;
        }

    .bg-red,
    .bg-yellow,
    .bg-aqua,
    .bg-blue,
    .bg-light-blue,
    .bg-green,
    .bg-navy,
    .bg-teal,
    .bg-olive,
    .bg-lime,
    .bg-orange,
    .bg-fuchsia,
    .bg-purple,
    .bg-maroon,
    .bg-black,
    .bg-red-active,
    .bg-yellow-active,
    .bg-aqua-active,
    .bg-blue-active,
    .bg-light-blue-active,
    .bg-green-active,
    .bg-navy-active,
    .bg-teal-active,
    .bg-olive-active,
    .bg-lime-active,
    .bg-orange-active,
    .bg-fuchsia-active,
    .bg-purple-active,
    .bg-maroon-active,
    .bg-black-active,
    .callout.callout-danger,
    .callout.callout-warning,
    .callout.callout-info,
    .callout.callout-success,
    .alert-success,
    .alert-danger,
    .alert-error,
    .alert-warning,
    .alert-info,
    .label-danger,
    .label-info,
    .label-warning,
    .label-primary,
    .label-success,
    .modal-primary .modal-body,
    .modal-primary .modal-header,
    .modal-primary .modal-footer,
    .modal-warning .modal-body,
    .modal-warning .modal-header,
    .modal-warning .modal-footer,
    .modal-info .modal-body,
    .modal-info .modal-header,
    .modal-info .modal-footer,
    .modal-success .modal-body,
    .modal-success .modal-header,
    .modal-success .modal-footer,
    .modal-danger .modal-body,
    .modal-danger .modal-header,
    .modal-danger .modal-footer {
        color: #fff !important;
    }

    .bg-gray {
        color: #000;
        background-color: #d2d6de !important;
    }

    .bg-gray-light {
        background-color: #f7f7f7;
    }

    .bg-black {
        background-color: #111 !important;
    }

    .bg-red,
    .callout.callout-danger,
    .alert-danger,
    .alert-error,
    .label-danger,
    .modal-danger .modal-body {
        background-color: #dd4b39 !important;
    }

    .bg-yellow,
    .callout.callout-warning,
    .alert-warning,
    .label-warning,
    .modal-warning .modal-body {
        background-color: #2e95b7 !important;
    }

    .bg-aqua,
    .callout.callout-info,
    .alert-info,
    .label-info,
    .modal-info .modal-body {
        background-color: #00c0ef !important;
    }

    .bg-blue {
        background-color: #206e87 !important;
    }

    .bg-light-blue,
    .label-primary,
    .modal-primary .modal-body {
        background-color: #206e87 !important;
    }

    .bg-green,
    .callout.callout-success,
    .alert-success,
    .label-success,
    .modal-success .modal-body {
        background-color: #00a65a !important;
    }

    .bg-navy {
        background-color: #001f3f !important;
    }

    .bg-teal {
        background-color: #39cccc !important;
    }

    .bg-olive {
        background-color: #3d9970 !important;
    }

    .bg-lime {
        background-color: #01ff70 !important;
    }

    .bg-orange {
        background-color: #ff851b !important;
    }

    .bg-fuchsia {
        background-color: #f012be !important;
    }

    .bg-purple {
        background-color: #605ca8 !important;
    }

    .bg-maroon {
        background-color: #d81b60 !important;
    }

    .bg-gray-active {
        color: #000;
        background-color: #b5bbc8 !important;
    }

    .bg-black-active {
        background-color: #000 !important;
    }

    .bg-red-active,
    .modal-danger .modal-header,
    .modal-danger .modal-footer {
        background-color: #d33724 !important;
    }

    .bg-yellow-active,
    .modal-warning .modal-header,
    .modal-warning .modal-footer {
        background-color: #db8b0b !important;
    }

    .bg-aqua-active,
    .modal-info .modal-header,
    .modal-info .modal-footer {
        background-color: #00a7d0 !important;
    }

    .bg-blue-active {
        background-color: #005384 !important;
    }

    .bg-light-blue-active,
    .modal-primary .modal-header,
    .modal-primary .modal-footer {
        background-color: #357ca5 !important;
    }

    .bg-green-active,
    .modal-success .modal-header,
    .modal-success .modal-footer {
        background-color: #008d4c !important;
    }

    .bg-navy-active {
        background-color: #001a35 !important;
    }

    .bg-teal-active {
        background-color: #30bbbb !important;
    }

    .bg-olive-active {
        background-color: #368763 !important;
    }

    .bg-lime-active {
        background-color: #00e765 !important;
    }

    .bg-orange-active {
        background-color: #ff7701 !important;
    }

    .bg-fuchsia-active {
        background-color: #db0ead !important;
    }

    .bg-purple-active {
        background-color: #555299 !important;
    }

    .bg-maroon-active {
        background-color: #ca195a !important;
    }

    [class^="bg-"].disabled {
        opacity: .65;
        filter: alpha(opacity=65);
    }

    .text-red {
        color: #dd4b39 !important;
    }

    .text-yellow {
        color: #2e95b7 !important;
    }

    .text-aqua {
        color: #00c0ef !important;
    }

    .text-blue {
        color: #206e87 !important;
    }

    .text-black {
        color: #111 !important;
    }

    .text-light-blue {
        color: #3c8dbc !important;
    }

    .text-green {
        color: #00a65a !important;
    }

    .text-gray {
        color: #d2d6de !important;
    }

    .text-navy {
        color: #001f3f !important;
    }

    .text-teal {
        color: #39cccc !important;
    }

    .text-olive {
        color: #3d9970 !important;
    }

    .text-lime {
        color: #01ff70 !important;
    }

    .text-orange {
        color: #ff851b !important;
    }

    .text-fuchsia {
        color: #f012be !important;
    }

    .text-purple {
        color: #605ca8 !important;
    }

    .text-maroon {
        color: #d81b60 !important;
    }

    .link-muted {
        color: #7a869d;
    }

        .link-muted:hover,
        .link-muted:focus {
            color: #606c84;
        }

    .link-black {
        color: #666;
    }

        .link-black:hover,
        .link-black:focus {
            color: #999;
        }

    .hide {
        display: none !important;
    }

    .no-border {
        border: 0 !important;
    }

    .no-padding {
        padding: 0 !important;
    }

    .no-margin {
        margin: 0 !important;
    }

    .no-shadow {
        box-shadow: none !important;
    }

    .list-unstyled,
    .chart-legend,
    .contacts-list,
    .users-list,
    .mailbox-attachments {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .list-group-unbordered > .list-group-item {
        border-left: 0;
        border-right: 0;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
        padding-left: 0;
        padding-right: 0;
    }

    .flat {
        -webkit-border-radius: 0 !important;
        -moz-border-radius: 0 !important;
        -ms-border-radius: 0 !important;
        border-radius: 0 !important;
    }

    .text-bold,
    .text-bold.table td,
    .text-bold.table th {
        font-weight: 700;
    }

    .text-sm {
        font-size: var(--font-12, 12px);
    }

    .jqstooltip {
        padding: 5px !important;
        width: auto !important;
        height: auto !important;
    }

    /*.bg-teal-gradient {
    background: #39cccc !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #39cccc), color-stop(1, #7adddd)) !important;
    background: -ms-linear-gradient(bottom, #39cccc, #7adddd) !important;
    background: -moz-linear-gradient(center bottom, #39cccc 0, #7adddd 100%) !important;
    background: -o-linear-gradient(#7adddd, #39cccc) !important;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#7adddd', endColorstr='#39cccc', GradientType=0) !important;
    color: #fff;
}

.bg-light-blue-gradient {
    background: #3c8dbc !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #3c8dbc), color-stop(1, #67a8ce)) !important;
    background: -ms-linear-gradient(bottom, #3c8dbc, #67a8ce) !important;
    background: -moz-linear-gradient(center bottom, #3c8dbc 0, #67a8ce 100%) !important;
    background: -o-linear-gradient(#67a8ce, #3c8dbc) !important;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#67a8ce', endColorstr='#3c8dbc', GradientType=0) !important;
    color: #fff;
}

.bg-blue-gradient {
    background: $primary-background !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #0073b7), color-stop(1, #0089db)) !important;
    background: -ms-linear-gradient(bottom, #0073b7, #0089db) !important;
    background: -moz-linear-gradient(center bottom, $primary-background 0, #0089db 100%) !important;
    background: -o-linear-gradient(#0089db, #0073b7) !important;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#0089db', endColorstr='#0073b7', GradientType=0) !important;
    color: #fff;
}

.bg-aqua-gradient {
    background: #00c0ef !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #00c0ef), color-stop(1, #14d1ff)) !important;
    background: -ms-linear-gradient(bottom, #00c0ef, #14d1ff) !important;
    background: -moz-linear-gradient(center bottom, #00c0ef 0, #14d1ff 100%) !important;
    background: -o-linear-gradient(#14d1ff, #00c0ef) !important;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#14d1ff', endColorstr='#00c0ef', GradientType=0) !important;
    color: #fff;
}

.bg-yellow-gradient {
    background: $secondary-background !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, $secondary-background), color-stop(1, #f7bc60)) !important;
    background: -ms-linear-gradient(bottom, $secondary-background, #f7bc60) !important;
    background: -moz-linear-gradient(center bottom, $secondary-background 0, #f7bc60 100%) !important;
    background: -o-linear-gradient(#f7bc60, $secondary-background) !important;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#f7bc60', endColorstr='$secondary-background', GradientType=0) !important;
    color: #fff;
}

.bg-purple-gradient {
    background: #605ca8 !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #605ca8), color-stop(1, #9491c4)) !important;
    background: -ms-linear-gradient(bottom, #605ca8, #9491c4) !important;
    background: -moz-linear-gradient(center bottom, #605ca8 0, #9491c4 100%) !important;
    background: -o-linear-gradient(#9491c4, #605ca8) !important;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#9491c4', endColorstr='#605ca8', GradientType=0) !important;
    color: #fff;
}

.bg-green-gradient {
    background: #00a65a !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #00a65a), color-stop(1, #00ca6d)) !important;
    background: -ms-linear-gradient(bottom, #00a65a, #00ca6d) !important;
    background: -moz-linear-gradient(center bottom, #00a65a 0, #00ca6d 100%) !important;
    background: -o-linear-gradient(#00ca6d, #00a65a) !important;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#00ca6d', endColorstr='#00a65a', GradientType=0) !important;
    color: #fff;
}

.bg-blue2-gradient {
    background: #206e87 ;
    background: -moz-linear-gradient(top, #206e87  0%, #00c0ef 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #206e87 ), color-stop(100%, #00c0ef));
    background: -webkit-linear-gradient(top, #206e87  0%, #00c0ef 100%);
    background: -o-linear-gradient(top, #206e87  0%, #00c0ef 100%);
    background: -ms-linear-gradient(top, #206e87  0%, #00c0ef 100%);
    background: linear-gradient(to bottom, #206e87  0%, #00c0ef 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#206e87 ', endColorstr='#00c0ef', GradientType=0);
}

.bg-red-gradient {
    background: #dd4b39 !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #dd4b39), color-stop(1, #e47365)) !important;
    background: -ms-linear-gradient(bottom, #dd4b39, #e47365) !important;
    background: -moz-linear-gradient(center bottom, #dd4b39 0, #e47365 100%) !important;
    background: -o-linear-gradient(#e47365, #dd4b39) !important;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#e47365', endColorstr='#dd4b39', GradientType=0) !important;
    color: #fff;
}

.bg-black-gradient {
    background: #111 !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #111), color-stop(1, #2b2b2b)) !important;
    background: -ms-linear-gradient(bottom, #111, #2b2b2b) !important;
    background: -moz-linear-gradient(center bottom, #111 0, #2b2b2b 100%) !important;
    background: -o-linear-gradient(#2b2b2b, #111) !important;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#2b2b2b', endColorstr='#111111', GradientType=0) !important;
    color: #fff;
}

.bg-maroon-gradient {
    background: #d81b60 !important;
    background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #d81b60), color-stop(1, #e73f7c)) !important;
    background: -ms-linear-gradient(bottom, #d81b60, #e73f7c) !important;
    background: -moz-linear-gradient(center bottom, #d81b60 0, #e73f7c 100%) !important;
    background: -o-linear-gradient(#e73f7c, #d81b60) !important;
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#e73f7c', endColorstr='#d81b60', GradientType=0) !important;
    color: #fff;
}*/
    .description-block .description-icon {
        font-size: 16px;
    }

    .no-pad-top {
        padding-top: 0;
    }

    .position-static {
        position: static !important;
    }

    .list-header {
        font-size: var(--font-15, 15px);
        padding: 10px 4px;
        font-weight: bold;
        color: #666;
    }

    .list-seperator {
        height: 1px;
        background: #f4f4f4;
        margin: 15px 0 9px 0;
    }

    .list-link > a {
        padding: 4px;
        color: #777;
    }

        .list-link > a:hover {
            color: #222;
        }

    .font-light {
        font-weight: 300;
    }

    .user-block:before,
    .user-block:after {
        content: " ";
        display: table;
    }

    .user-block:after {
        clear: both;
    }

    .user-block img {
        width: 40px;
        height: 40px;
        float: left;
    }

    .user-block .username,
    .user-block .description,
    .user-block .comment {
        display: block;
        margin-left: 50px;
    }

    .user-block .username {
        font-size: var(--font-16, 16px);
        font-weight: 600;
    }

    .user-block .description {
        color: #999;
        font-size: var(--font-13, 13px);
    }

    .user-block.user-block-sm .username,
    .user-block.user-block-sm .description,
    .user-block.user-block-sm .comment {
        margin-left: 40px;
    }

    .user-block.user-block-sm .username {
        font-size: var(--font-14, 14px);
    }

    .img-sm,
    .img-md,
    .img-lg,
    .box-comments .box-comment img,
    .user-block.user-block-sm img {
        float: left;
    }

        .img-sm,
        .img-sm img,
        .box-comments .box-comment img,
        .user-block.user-block-sm img {
            width: 30px !important;
            height: 30px !important;
        }

            .img-sm + .img-push {
                margin-left: 40px;
            }

    .img-md {
        width: 60px;
        height: 60px;
    }

        .img-md + .img-push {
            margin-left: 70px;
        }

    .img-lg {
        width: 100px;
        height: 100px;
    }

        .img-lg + .img-push {
            margin-left: 110px;
        }

    .img-bordered {
        border: 3px solid #d2d6de;
        padding: 3px;
    }

    .img-bordered-sm {
        border: 2px solid #d2d6de;
        padding: 2px;
    }

    .attachment-block {
        border: 1px solid #f4f4f4;
        padding: 5px;
        margin-bottom: 10px;
        background: #f7f7f7;
    }

        .attachment-block .attachment-img {
            max-width: 100px;
            max-height: 100px;
            height: auto;
            float: left;
            text-align: center;
            vertical-align: middle;
        }

        .attachment-block .attachment-pushed {
            margin-left: 110px;
        }

        .attachment-block .attachment-heading {
            margin: 0;
        }

        .attachment-block .attachment-text {
            color: #555;
        }

    .itg_dashboard_connectedSortable {
        min-height: 100px;
    }

    .ui-helper-hidden-accessible {
        border: 0;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }

    .sort-highlight {
        background: #f4f4f4;
        border: 1px dashed #ddd;
        margin-bottom: 10px;
        position: relative;
    }

    .full-opacity-hover {
        opacity: .65;
        filter: alpha(opacity=65);
    }

        .full-opacity-hover:hover {
            opacity: 1;
            filter: alpha(opacity=100);
        }

    .chart {
        position: relative;
        overflow: hidden;
        width: 100%;
    }

        .chart svg,
        .chart canvas {
            width: 100% !important;
        }

    @media print {
        .no-print,
        .main-sidebar,
        .left-side,
        .eduwaveHeader,
        .content-header {
            display: none !important;
        }

        .content-wrapper,
        .right-side,
        .main-footer {
            margin-left: 0 !important;
            min-height: 0 !important;
            -webkit-transform: translate(0, 0) !important;
            -ms-transform: translate(0, 0) !important;
            -o-transform: translate(0, 0) !important;
            transform: translate(0, 0) !important;
        }

        .fixed .content-wrapper,
        .fixed .right-side {
            padding-top: 0 !important;
        }

        .invoice {
            width: 100%;
            border: 0;
            margin: 0;
            padding: 0;
        }

        .invoice-col {
            float: left;
            width: 33.3333333%;
        }

        .table-responsive {
            overflow: auto;
        }

            .table-responsive > .table tr th,
            .table-responsive > .table tr td {
                white-space: normal !important;
            }
    }
    /*additional styles*/
    .k-mask {
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter: alpha(opacity=100);
        -moz-opacity: 1;
        -khtml-opacity: 1;
        opacity: 1;
    }

    .fa {
        font-family: FontAwesome !important;
    }

    #itg_dashboard_fullscreen {
        padding: 0 !important;
    }

        #itg_dashboard_fullscreen .modal-dialog {
            width: 100% !important;
        }

    .expand-button {
        cursor: pointer;
    }

        .expand-button .fa-th,
        .expand-button .fa-th-list {
            font-size: 21px;
            -webkit-transition: all 2s ease 0s;
            -moz-transition: all 2s ease 0s;
            -o-transition: all 2s ease 0s;
            transition: all 2s ease 0s;
            -ms-transition: all 2s ease 0s;
        }

    .input-group-btn:last-child > .btn .fa,
    .input-group-btn:last-child > .btn-group .fa {
        line-height: 1.42857 !important;
    }

    input.form-control[type="text"],
    input.form-control[type="password"] {
        padding: 6px 12px;
    }

    .glyphicon-fullscreen::before {
        display: none;
    }

    /*----------  side-drag-widget  -----------*/
    #side-drag-widget {
        padding-bottom: 15px;
        position: fixed;
        width: 200px;
        right: 29px;
        bottom: 65px;
        /*z-index: 1000;*/
        z-index: 990;
        /*for posetion of tooltip*/
        background: #fff;
        border: 1px solid #ddd;
    }

        #side-drag-widget .box-header .widget-description,
        #side-drag-widget .box-header + div,
        #side-drag-widget .box-footer,
        #side-drag-widget .itg_dashboard_tab-content,
        #side-drag-widget .box-tools,
        .side-drag-widget .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li {
            display: none !important;
        }

    .side-drag-widget {
        min-height: 270px;
    }

    .side-drag-widget {
        min-height: 270px;
    }

        .side-drag-widget .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li.header {
            display: block;
        }

        .side-drag-widget .itg_dashboard_nav-tabs-custom {
            margin-bottom: 10px;
        }

    .multiEvents,
    .calendarEvent {
        font-weight: bold;
        color: #fff;
    }

    .calendarEvent {
        background-color: #FF9A00;
        border-color: #FF9A00;
        color: #fff;
    }

    .multiEvents {
        background-color: #ff4081 !important;
        border-color: #ff4081 !important;
    }

    #itg_dashboard_Multi_Events .bg-maroon {
        background-color: #FF4B8D !important;
    }

    .k-calendar .tooltip {
        word-wrap: break-word;
    }

    /*.k-calendar .k-header .k-icon {
    margin-top: 5px;
}*/
    /*birthday { background-color:#00C0EF;border-color:#00ACD6;}
.meeting {background-color: #605CA8 ;border-color:#605CA8}*/
    #side-drag-widget .box {
        margin-top: 15px;
        margin-bottom: 0px;
        height: auto !important;
    }

    /*---------------------*/
    #side-drag-widget .box-header {
        padding: 5px 7px;
        cursor: pointer;
        color: #fff;
    }

        #side-drag-widget .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li.header,
        #side-drag-widget .box-header > .fa {
            font-size: 14px;
        }

    .side-drag-widget .box-header .img-circle .fa {
        font-size: 13px;
        margin-top: -3px;
    }

    .side-drag-widget .sort-highlight {
        max-height: 40px;
    }

    /*.side-drag-widget .box-header .widget-title,*/
    .side-drag-widget .box-header .box-title,
    .side-drag-widget .box-header .widget-block {
        font-size: var(--font-14, 14px);
        /*overflow: ellipsis;*/
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .side-drag-widget .box-header .widget-title {
        font-size: var(--font-12, 12px);
        color: #fff;
    }

        .side-drag-widget .box-header .widget-title a,
        .side-drag-widget .box-header .widget-title,
        .side-drag-widget .box-header .img-circle .fa {
            color: #fff;
        }

    .side-drag-widget .box {
        background: #206e87 ;
        color: #fff;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
    }
        .side-drag-widget .box.box-widget.Library-Widget {
            background: #086271 !important;
        }
    .side-drag-widget .box-header .img-circle {
        float: left;
        margin-right: 5px;
        color: #fff;
    }

    .side-drag-widget .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li {
        margin-bottom: 0;
    }

    .itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs > li.header {
        line-height: 26px;
    }

    .box.box-success {
        border-top-color: #00A65A;
    }

    .box {
        margin-bottom: 10px;
    }

    .modal-contener {
        border: 1px solid #E4E4E4;
        padding: 15px 10px;
        -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125);
        -moz-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125);
        -o-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125);
        -ms-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125);
        box-shadow: 0 2px 3px rgba(0, 0, 0, 0.125);
    }

    #side-drag-widget {
        display: none;
    }

    .itg_dashboard_sidechatbox_button,
    .itg_dashboard_sidewidget_button,
    .itg_dashboard_addwidget_button,
    .itg_dashboard_Writepost_button,
    .itg_dashboard_Edit_button {
        position: fixed;
        bottom: 58px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        color: #fff;
        width: 40px;
        height: 40px;
        text-align: center;
        cursor: pointer;
        z-index: 999;
        opacity: 0.6;
        right: 29px;
    }

    .itg_dashboard_addwidget_button {
        right: 29px;
        background: #206e87;
        padding: 11px 0;
        font-size: var(--font-18, 18px);
    }

    .itg_dashboard_sidewidget_button {
        bottom: 20px;
        background: #FF9A00;
        font-size: var(--font-18, 18px);
        padding: 8px 0;
        display: none;
    }

    .itg_dashboard_Edit_button {
        right: 29px;
        background: #2e95b7;
        padding: 7px 0;
        font-size: var(--font-18, 18px);
        bottom: 20px;
    }

        .itg_dashboard_Edit_button a {
            color: #fff;
        }

    .itg_dashboard_sidewidget_button .tooltip.fade.top.in {
        z-index: 1100000;
    }

    .itg_dashboard_sidechatbox_button:hover,
    .itg_dashboard_sidewidget_button:hover,
    .itg_dashboard_addwidget_button:hover,
    .itg_dashboard_Edit_button:hover {
        opacity: 1;
        -webkit-transition: all .5s ease-in-out 0s;
        -moz-transition: all .5s ease-in-out 0s;
        -o-transition: all .5s ease-in-out 0s;
        transition: all .5s ease-in-out 0s;
        -ms-transition: all .5s ease-in-out 0s;
    }

    #itg_dashboard_world-map > div > svg {
        width: 100% !important;
    }

    /****************  drilldown  ****************/
    .drilldown {
        display: block;
    }

        .drilldown ul {
            margin: 0;
            display: block;
            /*background: #f8f8f8;
  border: 1px solid #eee;*/
            background: #206e87;
            border: 1px solid #3C8DBC;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            -ms-border-radius: 5px;
            border-radius: 5px;
            display: none;
            padding-left: 10px;
        }

    .back-drill {
        /*display:none; position:absolute; */
        top: 30px;
        right: 0;
    }

    .back-drill-btn {
        display: inline-block;
        list-style: none;
        position: relative;
        margin: 3px 15px 4px 5px;
        cursor: pointer;
        padding: 0 4px;
        font-size: var(--font-13, 13px);
        color: #fff;
        text-decoration: underline;
    }

        .back-drill-btn:hover {
            /*color:#F27926;*/
            text-decoration: none;
        }

        .back-drill-btn:after,
        .back-drill-btn:before {
            right: -19px;
            top: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
        }

        .back-drill-btn:last-of-type:after,
        .back-drill-btn:last-of-type:before {
            display: none;
        }

        .back-drill-btn:after {
            border-color: rgba(136, 183, 213, 0);
            border-left-color: #f8f8f8;
            border-width: 5px;
            margin-top: -5px;
            margin-right: 2px;
        }

        .back-drill-btn:before {
            border-color: rgba(136, 183, 213, 0);
            border-left-color: #88b7d5;
            border-width: 5px;
            margin-top: -5px;
        }

    /************ face-Style start *************/
    .direct-chat .badge {
        display: inline-block;
        min-width: 10px !important;
        padding: 3px 7px !important;
        font-size: var(--font-12, 12px);
        font-weight: 700;
        line-height: 1;
        color: #fff;
        text-align: center;
        white-space: nowrap;
        vertical-align: middle;
        background-color: #777;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        -ms-border-radius: 10px;
        border-radius: 10px;
        top: auto !important;
        left: auto !important;
    }

    .direct-chat *,
    #sideChatBox * {
        font-family: 'Cairo Regular';
        font-weight: 400;
    }

    /*section.content section * {
    font-family: $font-stack;
}*/
    .direct-chat .right:before {
        display: none;
    }

    .direct-chat .btn-box-tool {
        color: #fff;
    }

    .chat-box {
        position: fixed;
        z-index: 1000;
        right: 0;
        bottom: -10px;
        margin: 0 10px;
        width: 250px;
    }

    .direct-chat-text {
        font-size: var(--font-13, 13px);
    }

    .box-header .box-title {
        font-size: var(--font-16, 16px);
    }

    .direct-chat .box-body {
        /*display: none*/
    }

    .itg_dashboard_Writepost_button {
        right: 29px;
        background: #286090;
        padding: 11px 0;
        font-size: var(--font-18, 18px);
    }

    .chat-box-popup .box-tools .chat-options,
    .chat-box-popup .box-header .box-title:before {
        display: none;
    }

    .chat-box-popup .box-tools .btn:first-child {
        padding-top: 3px;
    }

    .chat-box-popup .box-header,
    .closeContactList {
        cursor: pointer;
    }

    .chat-box-popup .box-header {
        background-color: #0073b7;
        transition: all .5s;
        color: #fff;
    }

    .direct-chat-msg {
        width: 100%;
    }

    .right .direct-chat-text {
        display: inline-block;
    }

    .direct-chat-primary .right {
        text-align: right;
    }

        .direct-chat-primary .right .direct-chat-img {
            right: 10px;
        }

    .direct-chat-primary .direct-chat-img {
        position: absolute;
    }

    .hide-comments {
        display: none;
        padding: 0 10px;
    }

        .hide-comments .box-comment:first-of-type {
            padding-top: 8px;
            border-top: 1px solid #eee;
        }

    .box-comments .box-comment:last-of-type {
        padding-bottom: 0;
    }

    .box-comments .box-comment.replay-comment {
        padding-left: 50px;
        border-top: none;
    }

    .show-comments {
        margin-left: 10px;
    }

    .modal-header {
        background: #206e87;
        color: #fff;
        padding: 10px 15px;
    }

        .modal-header .close {
            margin-top: 0px;
            color: #fff;
            opacity: .8;
        }

    .modal-content .post-box .box-comments .box-comment:last-of-type {
        padding-bottom: 8px;
    }

    .modal-content .send-comment {
        /*position: fixed;*/
        margin-bottom: -65px;
        width: 100%;
        padding: 7px 20px;
        left: 0;
    }

        .modal-content .send-comment .btn {
            border-width: 0;
        }

        .modal-content .send-comment .img-sm {
            width: 32px !important;
            height: 32px !important;
            margin-top: 1px;
        }

    #read-post .wrapper {
        overflow: visible;
    }

    .commentsContainer {
        width:100%;
        max-height: 300px;
    }

    .modal-content .post-box .slimScrollDiv {
        margin-bottom: 24px;
        min-height: 100px;
        max-height: 300px;
        height: auto !important;
    }

    .modal-content .box-comments {
        background: transparent;
        padding: 0;
    }

    .modal-content .box-comment {
        background: #f7f7f7;
        padding: 10px;
    }

        .modal-content .box-comment:first-of-type {
            padding-top: 10px;
        }

    /*.modal-content .post-box .box-comments {
    min-height: 100px;
    max-height: 100%;
    height: 100% !important;
}*/
    #sideChatBox .slimScrollDiv,
    #sideChatBox .sideChatBox {
        min-height: 100px;
        max-height: 100%;
        height: 100% !important;
    }

    .direct-chat .box-tools {
        color: #fff;
        z-index: 100000;
        position: absolute;
        right: 4px;
        top: 6px;
    }

        .direct-chat .box-tools .badge {
            position: relative;
        }

    #sideChatBox {
        padding-bottom: 15px;
        position: fixed;
        width: 250px;
        display: block;
        height: 100%;
        top: 0;
        right: 0px;
        z-index: 1;
        margin-top: 56px;
        /*background: #333;*/
        background: #206e87;
        z-index: 10000;
        display: none;
        border-left: 3px solid #2e95b7;
    }

        #sideChatBox .contacts-list-msg {
            color: #ccc;
            width: 183px;
            overflow: hidden;
            display: inherit;
            height: 20px;
        }

    .itg_dashboard_sidechatbox_button {
        right: 75px;
        background: #FF9A00;
        padding: 12px 0;
        font-size: var(--font-16, 16px);
    }

    .contactListInfo {
        color: #fff;
        padding: 7px 10px;
        border-bottom: 1px solid #999;
    }

    .chat-box-popup .collapsed-box .box-header h3 {
        font-size: var(--font-12, 12px);
    }

    .chat-box-popup .collapsed-box .box-header {
        padding: 10px;
        background: #999;
    }

    /************ face-Style end *************/
    .eduwaveHeader a {
        color: #fff;
    }

    /*ar addtional*/
    .W-dimension {
        height: 250px;
        width: 100%;
    }

    .right-space {
        margin-right: 5px;
    }

    .itg_dashboard_sparkline_row .text-center,
    .itg_dashboard_knob_row .text-center {
        border-right: 1px solid #f4f4f4;
    }

        .itg_dashboard_sparkline_row .text-center:last-of-type,
        .itg_dashboard_knob_row .text-center:last-of-type {
            border-right: none;
        }

    .itg_dashboard_textarea {
        width: 100%;
        height: 125px;
        font-size: var(--font-14, 14px);
        line-height: 18px;
        border: 1px solid #dddddd;
        padding: 10px;
    }

    .eduwaveContent {
        padding: 0px 0;
        /*background: #f8f8f8;*/
        background: transparent;
    }

    img {
        color: transparent;
    }

    /***** dropdown-menu  *****/
    .itg_dashboard_dropdown-menu {
        visibility: hidden;
        margin: 0;
        padding: 0;
        /*@include border-radius(10px);*/
        display: block;
        z-index: 9000;
        position: absolute;
        opacity: 0;
        filter: alpha(opacity=0);
        -webkit-box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.125);
        box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.125);
    }

    .open .itg_dashboard_dropdown-menu {
        opacity: 1;
        filter: alpha(opacity=100);
        visibility: visible;
    }

    .select .itg_dashboard_dropdown-menu {
        -webkit-border-radius: 0 0 10px 10px;
        -moz-border-radius: 0 0 10px 10px;
        -ms-border-radius: 0 0 10px 10px;
        border-radius: 0 0 10px 10px;
        -webkit-box-shadow: none;
        box-shadow: none;
        -webkit-transform-origin: 50% -40px;
        -moz-transform-origin: 50% -40px;
        -o-transform-origin: 50% -40px;
        -ms-transform-origin: 50% -40px;
        transform-origin: 50% -40px;
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -o-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
        -webkit-transition: all 150ms linear;
        -moz-transition: all 150ms linear;
        -o-transition: all 150ms linear;
        -ms-transition: all 150ms linear;
        transition: all 150ms linear;
        margin-top: -20px;
    }

    .select.open .itg_dashboard_dropdown-menu {
        margin-top: -1px;
    }

    .itg_dashboard_dropdown-menu > li > a {
        padding: 8px 16px;
        color: #333333;
    }

        .itg_dashboard_dropdown-menu > li > a img {
            margin-top: -3px;
        }

        .itg_dashboard_dropdown-menu > li > a:focus {
            outline: 0 !important;
        }

    .btn-group.select .itg_dashboard_dropdown-menu {
        min-width: 100%;
    }

    .itg_dashboard_dropdown-menu > li:first-child > a {
        /*border-top-left-radius: 10px;
  border-top-right-radius: 10px;*/
    }

    .itg_dashboard_dropdown-menu > li:last-child > a {
        /*border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;*/
    }

    .itg_dashboard_dropdown-menu.navbar-options > li:first-child > a {
        border-top-left-radius: 0;
        border-top-right-radius: 0px;
    }

    .itg_dashboard_dropdown-menu.navbar-options > li:last-child > a {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0px;
    }

    .select .itg_dashboard_dropdown-menu > li:first-child > a {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
        border-bottom: 0 none;
    }

    .itg_dashboard_dropdown-menu > li > a:hover,
    .itg_dashboard_dropdown-menu > li > a:focus {
        /*    background-color: #F5F5F5;*/
        color: #206e87;
        opacity: 1;
        text-decoration: underline;
    }

    .itg_dashboard_dropdown-menu.dropdown-blue > li > a:hover,
    .itg_dashboard_dropdown-menu.dropdown-blue > li > a:focus {
        background-color: rgba(52, 114, 247, 0.2);
    }

    .itg_dashboard_dropdown-menu.dropdown-azure > li > a:hover,
    .itg_dashboard_dropdown-menu.dropdown-azure > li > a:focus {
        background-color: rgba(29, 199, 234, 0.2);
    }

    .itg_dashboard_dropdown-menu.ct-green > li > a:hover,
    .itg_dashboard_dropdown-menu.ct-green > li > a:focus {
        background-color: rgba(135, 203, 22, 0.2);
    }

    .itg_dashboard_dropdown-menu.dropdown-orange > li > a:hover,
    .itg_dashboard_dropdown-menu.dropdown-orange > li > a:focus {
        background-color: rgba(255, 149, 0, 0.2);
    }

    .itg_dashboard_dropdown-menu.dropdown-red > li > a:hover,
    .itg_dashboard_dropdown-menu.dropdown-red > li > a:focus {
        background-color: rgba(255, 74, 85, 0.2);
    }

    @media (min-width: 992px) {
/*        .navbar-nav > li > .itg_dashboard_dropdown-menu,
        .dropdown .itg_dashboard_dropdown-menu {
            -webkit-transform: scale(0);
            -moz-transform: scale(0);
            -o-transform: scale(0);
            -ms-transform: scale(0);
            transform: scale(0);
            -webkit-transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
            -moz-transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
            -o-transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
            -ms-transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
            transition: all 370ms cubic-bezier(0.34, 1.61, 0.7, 1);
        }

        .navbar-nav > li.open > .itg_dashboard_dropdown-menu,
        .dropdown.open .itg_dashboard_dropdown-menu {
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            -o-transform: scale(1);
            -ms-transform: scale(1);
            transform: scale(1);
            -webkit-transform-origin: 29px -50px;
            -moz-transform-origin: 29px -50px;
            -o-transform-origin: 29px -50px;
            -ms-transform-origin: 29px -50px;
            transform-origin: 29px -50px;
        }*/

        .itg_dashboard_dropdown-menu:before {
            border-bottom: 10px solid rgba(0, 0, 0, 0.2);
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            content: "";
            display: inline-block;
            position: absolute;
            right: 12px;
            top: -11px;
            left: auto;
        }

        .itg_dashboard_dropdown-menu:after {
            border-bottom: 10px solid #FFFFFF;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            content: "";
            display: inline-block;
            position: absolute;
            right: 12px;
            top: -11px;
            left: auto;
        }

        .navbar-collapse.has-image .navbar-nav > li > .itg_dashboard_dropdown-menu:before,
        .navbar-collapse.has-image .navbar-nav > li > .itg_dashboard_dropdown-menu:after {
            display: none;
        }

        .navbar-nav.navbar-right > li > .itg_dashboard_dropdown-menu:before {
            left: auto;
            right: 12px;
        }

        .navbar-nav.navbar-right > li > .itg_dashboard_dropdown-menu:after {
            left: auto;
            right: 12px;
        }
    }
    /*@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic);*/
    /*#72afd2*/
    /*body {
    color: $primary-color;
}*/
    /*********************************** coursepage ********************************************/
    .coursepagecontent {
        margin: 0;
        /*    background: #fff;*/
        /*    border: 1px solid #ddd;*/
        margin-bottom: 20px;
    }

        .coursepagecontent .TitleStyle, .coursepagecontent .TitleWithButtons {
            padding: 12px;
            border-bottom: 1px solid #CFDAE1;
            margin: 0 -15px 15px;
        }

            .coursepagecontent .TitleWithButtons .TitleStyle {
                border-bottom: 0;
                padding: 0;
                margin: 0;
                float: left;
            }

    .box .box-footer a.btn-default {
        color: #206e87;
        ;
    }

    .coursepagecontent.content {
        height: auto;
        /*    padding-top: 15px;*/
        text-align: inherit;
        /*    background-color: #fff;*/
        font-size: inherit;
       
    }

    .coursepage.coursepagecontent {
        background: transparent;
        border: none;
        padding: 0;
    }

    .coursepage .box-paragraph.row {
        border-bottom: none;
        margin: 0;
    }

    .coursepage .page-title-box {
        border: 1px solid #ddd;
        margin-bottom: 15px;
        background: #fff;
        border-radius: 8px;
    }

    .box-paragraph {
        margin-right: -15px;
        margin-left: -15px;
    }

    /*.coursepage #learningPlanWidget,.coursepage #latestPostsWidget,.coursepage #courseReportsWidget{
    padding: 0px;
}*/
    .coursepage .box {
        box-shadow: none;
        border: 1px solid #ddd;
        margin-bottom: 15px;
    }

        .coursepage .box .box-footer {
            margin-bottom: -10px;
            margin: 0;
        }

    .course-dashboard.coursepage .box .box-footer {
        margin: 0;
    }

    .coursepage .row:last-child .box-widget {
        border-bottom: none;
    }

    .coursepage .widget-block .img-circle i,
    .box-header .img-circle i {
        color: #fff;
        font-size: 14px;
        vertical-align: middle;
        margin-top: 3px;
        box-sizing: border-box !important;
        padding: 6px !important;
        border-radius: 3px;
        width: 26px;
        height: 26px;
        background: #206e87;
    }

        .box-header .img-circle i.fa-graduation-cap::before {
            margin-left: -2px;
        }

        .box-header .img-circle i.fa-line-chart::before {
            margin-left: -1px;
        }

    .coursepage .widget-block .img-circle,
    .coursepage .user-block .img-circle {
        float: left;
        text-align: center;
    }

    /*"widget-img" for widget-block with image */
    .widget-img .widget-block .img-circle {
        width: 45px;
        float: left;
        margin-right: 20px;
    }

        .widget-img .widget-block .img-circle img {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            overflow: hidden;
        }

    .coursepage .widget-block .widget-title,
    .coursepage .widget-block .widget-description,
    .coursepage .user-block .username,
    .coursepage .user-block .description,
    .coursepage .user-block .comment {
        display: block;
        margin-left: 35px;
    }

    .btn.btn-secondary:hover {
        color: #206e87 !important;
    }

    .TableGridstyle.table_text {
        /* width: 99%;
    overflow: hidden;
    overflow-x: scroll;*/
    }

    .coursepage .box-header.with-border {
        border-bottom: 1px solid #CFDAE1;
        padding: 8px 10px;
        border-radius: 8px;
    }

    #ctl00_ctl00_cphPageBody_cphMain_upnlGradeRangeMgt {
        padding: 15px 25px;
        border: 1px solid #206e87;
        border-radius: 8px;
    }

    #ctl00_ctl00_cphPageBody_cphMain_upnlGradeRangeMgt, #tblMainTable {
        padding: 15px 25px;
        border-radius: 8px;
    }

    .coursepage .col-md-6 .box-body {
        height: 260px;
    }

    .widgetrow .col-md-12 {
        width: 100% !important;
    }

    .widgetrow .box .box-footer a.btn-default {
        width: 100%;
    }

    .topImage {
        width: 70px;
        height: 70px;
        text-align: center;
        overflow: hidden;
        vertical-align: middle;
        margin: auto;
        line-height: 70px;
    }

        .topImage img {
            max-width: 100%;
            width: 100%;
        }

    .books .users-list-name {
        font-weight: normal;
        margin: 5px 0;
    }

    .books .users-list > li {
        padding: 10px 5px;
    }

        .books .users-list > li img {
            -webkit-border-radius: 0%;
            -moz-border-radius: 0%;
            -ms-border-radius: 0%;
            border-radius: 0%;
        }

    .ltiAppsWidget .nav > li > a {
        padding: 13px 5px;
        color: #206e87;
    }

    .ltiAppsWidget .nav li a .product-img {
        margin-right: 10px;
        display: inline-block;
        float: none;
    }

    .latestPostsWidget .products-list .product-title, .coursesAnouicmentWidget .products-list .product-title {
        font-weight: normal;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

    .latestPostsWidget .products-list > .item, .coursesAnouicmentWidget .products-list > .item {
        padding: 5px 0;
        /*font-size: 12px;*/
        border: none;
    }

    .latestPostsWidget .products-list .product-description, .coursesAnouicmentWidget .products-list .product-description {
        color: #777;
        font-size: var(--font-13, 13px);
        line-height: 15px;
        /*height: 32px;*/
        white-space: inherit;
        overflow: visible;
    }

    .latestPostsWidget .products-list .product-title, .coursesAnouicmentWidget .products-list .product-title {
        margin-right: 30px;
    }

    .products-list .product-date {
        display: block;
        color: #999;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        font-size: 11px;
    }

    /*.latestPostsWidget .products-list > .item:nth-child(3) .product-info ,
	.latestPostsWidget .products-list > .item:nth-child(4) .product-info {
    padding-top: 11px;	
}
.latestPostsWidget .products-list > .item:nth-child(3),
.latestPostsWidget .products-list > .item:nth-child(3){
	padding: 10px 0;
}*/
    .latestPostsWidget .products-list .product-info .box-footer {
        padding-left: 0;
    }

    .latestPostsWidget .box-body {
        overflow: visible;
        height: auto;
    }

        .latestPostsWidget .box-body .text-yellow {
            font-size: var(--font-12, 12px);
            margin-top: 5px;
            display: inline-block;
        }

        .latestPostsWidget .box-body .products-list {
            margin: 10px 11px;
        }

    .latestPostsWidget .writePostWarper {
        /*border: 1px solid #ddd;
  padding: 5px 10px;
  box-shadow: 0px 1px 5px rgba(0,0,0,0.39);*/
        margin: 5px 0px 20px;
    }

        .latestPostsWidget .writePostWarper .form-control {
            border: none;
            color: #999;
            padding: 11px 12px;
            width: inherit;
            cursor: pointer;
        }

        .latestPostsWidget .writePostWarper .img-sm {
            width: 40px !important;
            height: 40px !important;
        }

    #itg_dashboard_write_post .pull-right,
    .writePostWarper .pull-right {
        margin-top: 8px;
    }

        #itg_dashboard_write_post .pull-right a,
        .writePostWarper .pull-right a {
            padding: 6px 0 2px;
            color: #597a96;
            display: inline-block;
        }

        #itg_dashboard_write_post .pull-right button.browse-btn {
            margin: 0 2px;
            padding: 0;
            font-size: var(--font-16, 16px);
            color: #597a96;
            background: transparent;
            border: none;
        }

    .post-options input[type="file"] {
        display: none;
    }

    .post-options.pull-right i,
    #itg_dashboard_write_post_high .pull-right i,
    #itg_dashboard_write_post .pull-right i,
    .writePostWarper .pull-right i,
    .writePostWarper .pull-right a i {
        /*padding: 0 5px;
  margin-top: -3px;    
  background: #f8f8f8;
  border: 1px solid #eee;
  @include border-radius(5px);*/
        margin: 0 2px;
        padding: 3px 1px;
        font-size: 16px;
        color: #597a96;
    }

    #itg_dashboard_write_post_high .pull-right a span,
    #itg_dashboard_write_post .pull-right a span {
        color: #597a96;
    }

    .writePostWarper .pull-right i,
    .writePostWarper .pull-right i.fa.fa-link {
        cursor: pointer;
    }

    #itg_dashboard_write_post_high input[type="file"],
    #itg_dashboard_write_post input[type="file"],
    #itg_dashboard_post_link input[type="file"],
    .writePostWarper input {
        display: none;
    }

    #itg_dashboard_write_post_high .pull-right a i.fa-square-o,
    #itg_dashboard_write_post .pull-right a i.fa-square-o,
    .writePostWarper .pull-right a i.fa-square-o {
        padding: 3px 3px;
    }

    #itg_dashboard_write_post_high .pull-right a input,
    #itg_dashboard_write_post .pull-right a input,
    #itg_dashboard_post_link .pull-right a input {
        margin: 0 5px;
    }

    .courseReportsWidget .widget-title {
        padding-top: 10px;
    }

    .courseReportsWidget .box-footer {
        margin-bottom: -10px;
    }

    /*.books .users-list > li:nth-child(3n+0):after
,.navbar-Center .navbar-options li:nth-child(5n+0) {
    clear: both;
}*/
    .books .users-list > li:nth-child(4n+1) {
        clear: left;
    }

    /************************ coursepage right side ********************************/
    .courseRightSide .box-widget {
        margin-bottom: 15px;
    }

    #coursepeople .box-footer,
    .course-list .box-footer,
    .curseinvitation .box-footer {
        padding: 7px 10px;
    }

        #coursepeople .box-footer .btn,
        .course-list .box-footer .btn,
        .curseinvitation .box-footer .btn {
            /*color: $primary-color;*/
            padding: 1px 7px;
            font-size: var(--font-12, 12px);
        }

    .curseinvitation .box-body {
        color: #206e87;
        font-size: 10px;
    }

    .curseinvitation .widget-title {
        font-size: var(--font-15, 15px);
    }

    .courseRightSide .coursepeople .label.pull-right {
        font-size: var(--font-14, 14px);
        font-weight: normal;
        font-family: 'Cairo Regular';
    }

    .courseRightSide .widget-block .widget-title,
    .courseRightSide .widget-block .widget-description,
    .courseRightSide .user-block .username,
    .courseRightSide .user-block .description,
    .courseRightSide .user-block .comment {
        display: block;
        margin-left: 0px;
    }

    .courseRightSide .box-header.with-border {
        border-bottom: 1px solid #CFDAE1;
        margin: 0px 0px 0 0px;
        padding: 8px 12px;
    }

    .recentActivity .products-list .product-info {
        margin-left: 0px;
        position: relative;
    }

    .recentActivity .product-list-in-box > .item .product-info:after {
        display: none;
    }

    .recentActivity .product-list-in-box > .item:hover .product-info:after {
        /*border-left: 3px solid $primary-color;
	padding-left: 20px;
	margin-left: -20px;
	background-position: 17px bottom;*/
        display: block;
        content: "";
        position: absolute;
        top: 0;
        left: -20px;
        height: 100%;
        width: 3px;
        background: #206e87;
    }

    .recentActivity .products-list .product-title {
        font-weight: 600;
        font-size: var(--font-14, 14px);
        line-height: 15px;
        font-weight: normal;
        color: #777;
    }

    .recentActivity .text-yellow {
        padding-left: 0;
        white-space: inherit;
    }

    .recentActivity .product-date {
        font-size: 11px;
    }

    .coursepeople .product-info {
        margin-left: 50px;
        margin-top: 10px;
    }

    .coursepeople .products-list .product-title {
        font-weight: normal;
    }

    .product-img img,
    .latestPostsWidget .products-list .product-img img,
    .coursesAnouicmentWidget .products-list .product-img img,
    .coursepeople .products-list .product-img img {
        max-width: 40px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        overflow: hidden;
        width: 40px;
        height: 40px;
    }

    .coursepeople .products-list .product-img {
        float: left;
    }

    .recentActivity .product-list-in-box > .item,
    .coursepeople .product-list-in-box > .item {
        /*border-bottom: 3px dotted #c0c8d2;*/
        background-image: linear-gradient(to right, #4F6178 0%, #fff 10%);
        background-position: bottom;
        background-size: 9px 2px;
        background-repeat: repeat-x;
        border: none;
    }

        .recentActivity .product-list-in-box > .item:last-of-type,
        .coursepeople .product-list-in-box > .item:last-of-type {
            border-bottom-width: 0;
            background-image: none;
        }

    .recentActivity .item:first-child,
    .coursepeople .item:first-child {
        padding-top: 0;
    }

    .coursepeople .item a {
        display: block;
    }

    .online-peopel {
        position: absolute;
        top: -1px;
        left: 0;
        width: 12px;
        height: 12px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        background: #88d553;
        border: 2pt solid #fff;
        z-index: 10;
        box-shadow: 0px 0px 1px #B5B4B499;
    }

    .coursepeople ul li {
        vertical-align: middle;
    }

    .coursepeople .product-img {
        position: relative;
    }

    /************************************** general *******************************************/
    .itg_table .itg_dashboard_dropdown-menu,
    .box-header .itg_dashboard_dropdown-menu {
        left: auto;
        right: -16px;
    }

    .box-header .itg_dashboard_dropdown-menu {
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

        .itg_table .itg_dashboard_dropdown-menu:after,
        .itg_table .itg_dashboard_dropdown-menu:before,
        .box-header .itg_dashboard_dropdown-menu:after,
        .box-header .itg_dashboard_dropdown-menu:before {
            right: 12px;
            left: auto;
        }

        .box-header .itg_dashboard_dropdown-menu:after {
            top: -10px;
        }

    .widget-block .widget-title {
        font-size: var(--font-13, 13px);
        font-weight: 600;
        color: #206e87;
    }

    .widget-block .widget-description {
        color: #999;
        font-size: 11px;
        margin-top: -4px;
    }

    #itg_dashboard_scheduler .k-header.k-scheduler-toolbar {
        display: none;
    }

    .courseRightSide .Course-title {
        margin-bottom: 20px;
    }

    .courseRightSide .box-body {
        padding: 10px 20px;
    }

    .courseRightSide .box-widget {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
    }

    .modal-title {
        margin: 0;
        line-height: 1.42857143;
        font-size: var(--font-18, 18px);
        font-weight: 500;
        padding: 0;
    }

    .fa {
        text-align: center;
    }

    .label {
        font-family: 'Cairo Regular';
        font-weight: normal;
    }

    .largbtn {
        padding: 8px 16px;
        font-size: var(--font-15, 15px);
    }

    .box-header .box-tools .btn-box-tool .fa.fa-minus,
    .box-header .box-tools .btn-box-tool .fa.fa-plus {
        line-height: 1px;
    }

    /*********************************** courses page ***************************************************/
    .courses-content {
        margin: 15px;
        background-color: #fff;
        border: 1px solid #ddd;
        padding: 0;
        border-radius: 8px;
    }

        .courses-content .content.container {
            padding-top: 0;
        }

    .header-title-container,
    .courses-header-container {
        border-bottom: 1px solid #CFDAE1;
        margin: 0 -15px;
        padding: 0 15px;
    }

    .courses-content .Filter-bar .filter-butt {
        height: auto;
        padding: 7px 0;
    }

    .header-title-content,
    .course-content-header,
    .courses-content-header {
        margin: 0;
        padding: 12px 0 12px;
        color: #206e87;
        /*font-weight: 600;*/
        width: 50%;
        float: left;
        font-weight: 500;
        font-size: var(--font-18, 18px);
    }

    .Course-sorting,
    .header-sorting,
    .Courses-sorting {
        margin: 0;
        padding: 10px 0 10px;
        width: 50%;
        float: left;
        text-align: right;
        font-size: var(--font-12, 12px);
    }

        .Course-sorting .sorting-lable,
        .header-sorting .sorting-lable,
        .Courses-sorting .sorting-lable {
            vertical-align: text-bottom;
            color: #8a8a8a;
            font-weight: normal;
        }

        .Courses-sorting .sorting-lable {
            margin-right: 8px !important;
            display: inline-block;
        }

        .Course-sorting select,
        .header-sorting select,
        .Courses-sorting select {
            max-width: 200px;
            display: inline-block;
            margin-left: 10px;
            padding: 2px;
            /*border-color: #ddd;*/
            border: 1px solid #ddd;
            color: #206e87;
        }

        .Courses-sorting .RadComboBox {
            margin-bottom: 0;
        }

    .all-courses {
        /*    max-width: 1100px;*/
        margin: 0 auto;
        padding-top: 20px;
    }

    #ctl00_ctl00_cphPageBody_CourseDetails_ibtnCourse {
        width: 100% !important;
        height: 100% !important;
    }
    /*.coursepageMargin {
    margin: 0 28px 0 0 !important;
}*/
    .all-courses .box-widget-link-click {
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 1000;
    }

    .all-courses .box-widget {
        border: 1px solid #ddd;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
        margin-bottom: 50px;
    }

    .all-courses .widget-user .widget-user-image {
        position: absolute;
        top: 135px;
        left: 50%;
        margin-left: -28px;
        background-color: #4f99cd;
        width: 60px;
        height: 60px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        border: 3px solid #fff;
    }

    .all-courses .widget-user .widget-user-header {
        padding: 0;
        height: 165px;
        border-top-right-radius: 0;
        border-top-left-radius: 0;
        border-bottom: 1px solid #ddd;
        background-repeat: no-repeat !important;
        background-size: cover !important;
        position: relative;
        overflow: hidden;
        text-align: center;
    }

        .all-courses .widget-user .widget-user-header img {
            position: absolute;
            top: 0;
            left: 0;
            min-width: 100%;
            min-height: 100%;
            height: auto;
        }

        .all-courses .widget-user .widget-user-header.Mathmatic {
            background: url(../img/Mathmatic.jpg) center center;
        }

        .all-courses .widget-user .widget-user-header.Science {
            background: url(../img/science.jpg) center center;
        }

        .all-courses .widget-user .widget-user-header.History {
            background: url(../img/History.jpg) center center;
        }

        .all-courses .widget-user .widget-user-header.Arabic {
            background: url(../img/Arabic.jpg) center center;
        }

    .all-courses .description-block > .description-header {
        font-size: var(--font-13, 13px);
        color: #999999;
        margin-bottom: 5px;
    }

    .all-courses .description-block > .description-text {
        text-transform: capitalize;
        color: #206e87;
        font-weight: 600;
    }

    .all-courses .description-block > .course-section {
        color: #2e95b7;
        font-weight: 600;
    }

    .all-courses .widget-user-image .icon-bg {
        padding: 11px 16px;
        color: #fff;
        width: 40px;
        height: 40px;
        font-size: 30px;
        -webkit-border-radius: inherit;
        -moz-border-radius: inherit;
        -ms-border-radius: inherit;
        border-radius: inherit;
        background: transparent;
    }

    .all-courses .description-block {
        margin: 5px 0 0;
    }

    .all-courses .course-status.Online,
    .all-courses .course-status.Virtual {
        position: absolute;
        left: 0;
        top: 15px;
        padding: 0px 10px;
        background-color: #2ab426;
        box-shadow: 2px 4px 5px rgba(105, 105, 105, 0.5);
    }

    .all-courses .course-status.Virtual {
        background-color: #2d6e9b;
    }

    .all-courses .course-status span {
        font-style: italic;
        font-size: var(--font-13, 13px);
        color: #fff;
    }

    .row.all-courses-butt {
        max-width: 350px;
        margin: 0 auto;
        margin-bottom: 30px;
    }

        .row.all-courses-butt a {
            width: 100%;
        }

    .all-courses-butt .fa-spinner {
        margin-right: 5px;
        font-size: 17px;
    }

    .header-title-container:after,
    .Filter-bar:after,
    .courses-header-container:after {
        display: block;
        content: "";
        clear: both;
    }

    .sidebar-form input:focus {
        border-color: #206e87;
    }

    .all-courses .widget-user-image .product-img img {
        max-width: 60px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        overflow: hidden;
        width: 55px;
        height: 55px;
        margin: 0;
    }

    @media (max-width: 780px) {
        .Filter-bar .sidebar-form {
            width: 100%;
            margin-bottom: 20px;
        }

        .Filter-bar .filter-butt {
            width: 100%;
            text-align: left;
            height: auto;
        }
    }

    @media (max-width: 380px) {
        .Filter-bar .Filter-bar-butt {
            display: block;
            margin-bottom: 10px;
        }
    }
    /*********************************** Filter Bar *******************************************/
    .Filter-bar {
        padding: 10px;
        background-color: #fff;
        margin: 12px 15px 0;
        border: 1px solid #ddd;
        /*.Filter-bar .input-group,
  .Filter-bar .input-group .form-control,
  .Filter-bar .input-group-addon,
  .Filter-bar .input-group-btn {
  	display: block;
  }*/
        /*.control-label {text-align: left}*/
    }

        .Filter-bar .sidebar-form {
            width: 50%;
            float: left;
        }

        .Filter-bar .form-control {
            /*height: 30px !important;*/
            height: 34px !important;
            border-color: #e3e3e3;
            /* max-width: 600px;*/
        }

        .Filter-bar .btn-flat {
            padding: 4px 7px;
            background-color: #206e87;
            color: #fff;
        }

        .Filter-bar .filter-butt {
            width: 50%;
            float: left;
            text-align: right;
            height: 30px;
            padding: 4px 0;
        }

        .Filter-bar .filter-butt-label {
            color: #206e87;
            font-weight: normal;
        }

        .Filter-bar .Filter-bar-butt {
            padding: 0px 15px;
            border: 1px solid #206e87;
            margin-left: 10px;
            padding: 5px;
        }

    .input-group-btn {
        top: -6px;
    }

    #ctl00_ctl00_cphPageBody_cphPageBody_pnlSubjects, #ctl00_ctl00_cphPageBody_cphPageBody_pnlAddSubject {
        padding: 15px 25px;
        border: 1px solid #206e87;
        border-radius: 8px;
    }
    /*#ctl00_ctl00_cphPageBody_cphPageBody_ucButtonLazyLoading-content {
    max-width: 1100px;
    margin: 0 auto;
    padding-top: 50px;
    margin-right: -15px;
    margin-left: -15px;
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(var(--bs-gutter-y) * -1);
    margin-right: calc(var(--bs-gutter-x) * -.5);
    margin-left: calc(var(--bs-gutter-x) * -.5);
}*/
    #ctl00_ctl00_cphPageBody_cphPageBody_ucButtonLazyLoading-content .col-md-3.col-sm-6 div {
        /*    margin: 0 5px;*/
    }

    .leftSidecontent {
        position: relative;
    }

    #dvTotalPoints {
        position: relative;
        top: 38px;
    }

    .Filter-bar .Filter-bar-butt.active,
    .Filter-bar .Filter-bar-butt:hover {
        background-color: #206e87;
        color: #fff;
    }

    .Filter-bar label {
        color: #206e87;
    }

    .Filter-bar .input-group-addon i {
        color: #206e87;
    }

    .Filter-bar section.filter-butt {
        width: 100%;
        height: auto;
        padding: 4px 0;
        margin: 10px auto 0;
    }

        .Filter-bar section.filter-butt .Filter-bar-butt {
            margin-left: 0;
            display: block;
            text-align: center;
        }

        .Filter-bar section.filter-butt .form-group {
            margin-bottom: 0;
        }

    section.filter-butt:before,
    section.filter-butt:after {
        display: block;
        clear: both;
        content: " ";
    }

    .advancedsearchbtn {
        border-right: 1px solid #eee;
        margin-right: 1px;
    }

    .advancedsearchcontainer:after {
        clear: both;
        content: '';
        display: block;
    }

    .Filter-bar.advancedsearchcontainer {
        margin-bottom: -15px;
    }

    .advancedsearchcontainer {
        display: none;
        padding-top: 15px;
        border-top: 1px solid #eee;
    }

        .advancedsearchcontainer .control-label {
            color: #206e87;
            /*font-weight: 700;*/
        }

        .advancedsearchcontainer label {
            font-weight: normal;
        }

        .advancedsearchcontainer .form-control {
            height: auto !important;
        }

        .advancedsearchcontainer .checkbox, .advancedsearchcontainer .radio {
            display: inline-block;
        }

        .advancedsearchcontainer .form-horizontal .control-label {
            padding-top: 5px;
        }

        .advancedsearchcontainer .row {
            border-bottom: 1px solid #eee;
            margin-bottom: 15px;
        }

            .advancedsearchcontainer .row:last-child {
                border-bottom: none;
            }

    /*********************************** Popup chat style *******************************************/
    @media only screen and (max-width: 540px) {
        .chat-sidebar {
            display: none !important;
        }

        .chat-popup {
            display: none !important;
        }
    }

    .popup-box {
        display: none;
        position: fixed;
        bottom: 0px;
        right: 220px;
        width: 250px;
        z-index: 10000;
    }

        .popup-box .popup-messages {
            height: 100%;
        }

    .chat-popup .chat-box-popup {
        position: relative;
        width: auto;
        margin: 0;
        bottom: 0;
    }

    .chat-popup .box {
        margin-bottom: 0;
    }

    .direct-chat .btn-box-tool:hover {
        opacity: .7;
    }

    /*********** group chat **********/
    .selectedPepoleWarper {
        padding: 5px 10px;
    }

    .selectedPepole {
        border: 1px solid #eee;
        max-height: 85px;
        min-height: 30px;
    }

        .selectedPepole .mCSB_inside > .mCSB_container {
            margin-right: 15px;
        }

        .selectedPepole input {
            border: none;
            background: transparent;
            width: 120px;
            display: none;
        }

        .selectedPepole .product-list {
            background: #206e87;
            color: #fff;
        }

        .selectedPepole .products-list .product-img img {
            width: 20px;
            height: 20px;
        }

        .selectedPepole .products-list .product-title {
            font-weight: normal;
            font-size: 10px;
        }

        .selectedPepole .products-list .fa {
            font-size: 10px;
            vertical-align: top;
            margin-top: 6px;
        }

        .selectedPepole .slimScrollDiv {
            height: auto !important;
            min-height: 32px !important;
            /*padding-bottom: 34px !important;*/
        }

        .selectedPepole .products-list {
            background: #206e87;
            color: #fff;
            padding: 2px 5px;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            -ms-border-radius: 5px;
            border-radius: 5px;
            margin: 2px 0;
        }

        .selectedPepole .remove {
            cursor: pointer;
        }

    .selectedPepoleWarper {
        overflow: hidden;
        width: auto;
        height: auto !important;
        /*max-height: 50px !important;
  padding-bottom: 10px !important;*/
    }

    #coursepeople {
        /*.box-footer .btn.disabled {
  	opacity: 1;
  	background: #eee;
  	color: #999
  }*/
    }

        #coursepeople span.product-info {
            margin-left: 10px;
            margin-top: 9px;
            display: inline-block;
        }

        #coursepeople .jqTransformCheckboxWrapper {
            display: none !important;
        }

        #coursepeople .item {
            padding: 0;
        }

            #coursepeople .item label {
                width: 100%;
                /*background: $primary-background;*/
                padding: 5px;
                /*margin: -6px 0;*/
                cursor: pointer;
            }

                #coursepeople .item label.selected {
                    width: 100%;
                    color: #206e87;
                }

            #coursepeople .item input[type="checkbox"] {
                position: absolute;
                left: -9999px;
            }

            #coursepeople .item .fa.fa-square-o,
            #coursepeople .item .fa.fa-check-square-o {
                margin-top: 15px;
            }

        #coursepeople .selectedPepole span.product-info {
            margin-left: 3px;
            margin-top: 0;
        }

    #searchforpeople:focus {
        border: none !important;
    }

    #addPeople {
        max-height: 400px;
    }

    /********  course posts **********/
    .courseposts .latestPostsWidget .writePostWarper {
        margin: 20px 0;
    }

    .courseposts .box-tools.pull-right .itg_dashboard_dropdown-menu {
        right: -14px;
    }

    .box-footer.send-comment .icon-bg,
    .box-comment .icon-bg {
        width: 30px;
        height: 30px;
        padding: 7px;
        font-size: 15px;
    }

    .highPriority {
        display: inline-block;
        padding: 6px 6px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        width: 10px;
        height: 10px;
        top: 3px;
        background: #FE4444;
    }

    /******* books ********/
    .bookspage {
        padding: 0;
    }

        .bookspage .users-list .topImage {
            width: auto;
            max-width: 80%;
            height: auto;
        }

        .bookspage .users-list .users-list-name {
            font-weight: normal;
            margin-bottom: 20px;
        }

    .coursesearch .Filter-bar .sidebar-form {
        width: 100%;
        float: left;
    }

    .coursesearch .Filter-bar {
        margin: 0 0 20px 0;
    }

    .coursesearch .header-title-container {
        margin-top: -15px;
        border-bottom: 1px solid #bdbdbd;
        margin-bottom: 20px;
    }

    /******* Eduwave Pagination ********/
    .eduwavepagination {
        margin: 0 20px;
        /*li a:hover {
  	border-color: $primary-color;
  }*/
    }

        .eduwavepagination li {
            display: inline-block;
            vertical-align: middle;
            color: #206e87;
        }

            .eduwavepagination li.dots {
                font-size: 16px;
            }

            .eduwavepagination li a {
                background: #206e87;
                color: #fff;
                margin: 0 5px;
                display: inline-block;
                -webkit-border-radius: 50%;
                -moz-border-radius: 50%;
                -ms-border-radius: 50%;
                border-radius: 50%;
                border-color: #206e87;
            }

            .eduwavepagination li:first-child > a, .eduwavepagination li:last-child > a {
                -webkit-border-radius: 50%;
                -moz-border-radius: 50%;
                -ms-border-radius: 50%;
                border-radius: 50%;
            }

            .eduwavepagination li a:hover, .eduwavepagination li.active a {
                border-color: #2e95b7;
                background: #2e95b7;
                color: #fff;
            }

    /******* learn standard Page ********/
    .lstandard-item {
        margin-bottom: 20px;
    }

        .lstandard-item .lstandard-description {
            display: block;
            color: #777;
            font-size: var(--font-13, 13px);
        }

        .lstandard-item .lstandard-title {
            display: block;
        }

        .lstandard-item:nth-child(2n+1) {
            clear: left;
        }

    /*********** Teacher Comments Page *************/
    .teachercomments .product-list-in-box > .item {
        border-bottom: none;
    }

    .teachercomments .label {
        padding: 10px 0;
        font-family: 'Cairo Regular';
        white-space: inherit;
    }

    /************* Learnig Plan *************/
    .learningPlan {
        padding: 0;
        padding-bottom: 20px;
    }

        .learningPlan div > .row {
            margin: 0;
        }

    .k-scheduler .k-scheduler-toolbar > ul:first-child {
        float: right;
    }

    .k-scheduler .k-scheduler-toolbar > ul {
        float: left;
    }

    .k-scheduler .k-nav-current {
        display: none;
    }

    .k-scheduler .k-scheduler-toolbar .k-nav-prev,
    .k-scheduler .k-scheduler-toolbar .k-nav-next {
        margin: 0 10px 10px;
        background: #206e87;
        color: #fff;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        border: none;
        line-height: 12px;
        padding: 6px;
    }

        .k-scheduler .k-scheduler-toolbar .k-nav-prev .k-link,
        .k-scheduler .k-scheduler-toolbar .k-nav-next .k-link {
            padding-left: .0em !important;
            padding-right: .0em !important;
        }

        .k-scheduler .k-scheduler-toolbar .k-nav-next .k-link,
        .k-scheduler .k-scheduler-toolbar .k-nav-prev .k-link {
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            -ms-border-radius: 50%;
            border-radius: 50%;
            border-top-right-radius: 50%;
            border-bottom-right-radius: 50%;
        }

    .k-scheduler .k-scheduler-views .k-state-default {
        margin-right: 10px;
        border-width: 1px 1px 1px 1px;
        border-color: #206e87;
    }

    .k-scheduler .k-nav-prev .k-icon,
    .k-scheduler .k-nav-next .k-icon {
        background-image: url("../Plugins/kendo-ui/styles/Default/sprite-w.png");
        opacity: 1;
    }

    .k-scheduler .k-scheduler-toolbar > ul li:first-child,
    .k-scheduler .k-scheduler-toolbar > ul li:first-child .k-link {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
    }

    .k-scheduler .k-scheduler-toolbar ul + ul li:last-child {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    /*.durationDate {
	text-align: center;
	margin: 5px 0 5px; 
}*/
    .cduration {
        font-size: 10px;
    }

        .cduration span {
            color: #2e95b7;
            font-weight: bold;
            margin-right: 10px;
        }

    /*.cduration:hover{
	color: $secondary-color;
}*/
    li.weeknum {
        border: 0px solid transparent;
    }

    .k-scheduler .k-scheduler-views .k-state-default.durationDate {
        border-width: 0px;
    }

    /************ EduSessions invitations *************/
    .invitationcontent .product-img {
        margin: 3px;
        max-width: 30px;
        height: auto;
    }

    .invitationTitle {
        position: absolute;
        top: -27px;
        background: #206e87;
        padding: 3px 10px;
        color: #fff;
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
    }

    .invitationcontent {
        border-top: 4px solid #206e87;
        margin-top: 25px;
        position: relative;
        margin-bottom: 20px;
        font-size: var(--font-12, 12px);
    }

        .invitationcontent .product-title {
            /*font-weight: 700;*/
            font-size: var(--font-12, 12px);
            padding: 5px 0;
            display: block;
        }

    .expired {
        opacity: .6;
    }

        .expired .invitationTitle {
            background: #999;
        }

        .expired.invitationcontent {
            border-color: #999;
        }

    .invetiationbtns {
        margin: 5px 0;
    }

    .CourseColumnContent {
        /*    padding-left: 0;*/
    }

    .invetiationbtns .btn {
        padding: 2px 10px;
        margin-right: 6px;
        margin-left: 0;
    }

    .invitationmembers:before,
    .invitationmembers:after {
        content: "";
        clear: both;
        display: block;
    }

    .invitationcontent .product-description {
        font-size: 10px;
    }

    .invitationcontent .text-yellow {
        font-size: 9px;
        padding: .2em 0em .3em;
        white-space: normal;
    }

    .online.invitationcontent .invitationTitle {
        background: #2e95b7;
    }

    .online.invitationcontent {
        border-color: #2e95b7;
    }

    .invitationmembers .username {
        overflow: hidden;
        font-size: 8px;
        width: 100%;
        text-align: center;
        height: 11px;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .invitationmembers .icon-bg-sm {
        width: 30px !important;
        height: 30px !important;
    }

    .invetiationbtns .btn.disabled {
        background-color: #f4f4f4;
        color: #444;
    }

    /************************* wave button effect ****************************************/
    .waves-effect {
        position: relative;
        cursor: pointer;
        display: inline-block;
        overflow: hidden;
        user-select: none;
        -webkit-tap-highlight-color: transparent;
        vertical-align: middle;
        z-index: 1;
        transition: .3s ease-out;
        text-decoration: none;
        color: #fff;
        text-align: center;
        letter-spacing: .5px;
        cursor: pointer;
    }

        .waves-effect .waves-ripple {
            position: absolute;
            border-radius: 50%;
            width: 20px;
            height: 20px;
            margin-top: -10px;
            margin-left: -10px;
            opacity: 0;
            background: rgba(0, 0, 0, 0.2);
            transition: all 0.7s ease-out;
            transition-property: opacity, -webkit-transform;
            transition-property: transform, opacity;
            transition-property: transform, opacity, -webkit-transform;
            -webkit-transform: scale(0);
            transform: scale(0);
            pointer-events: none;
        }

        .waves-effect .waves-ripple {
            background-color: rgba(255, 255, 255, 0.45);
        }

    /**************************************course portfolio **********************************/
    .accordion .Filter-bar {
        background-color: transparent;
        border: none;
        margin-bottom: 0;
        border-bottom: 1px solid #ddd;
    }

    .accordion .learningstandard {
        margin: 0 -11px;
    }

    .coursepage .accordion .box {
        background: #fff;
        border-top: 3px solid #3c8dbc;
        border-radius: 3px;
        background: #ffffff;
        margin-bottom: 20px;
        width: 100%;
        box-shadow: 0 0px 2px #ccc;
    }

        .coursepage .accordion .box .page-title-box {
            border: none;
            margin-bottom: inherit;
            background: none;
        }

        .coursepage .accordion .box .no-border.box-header {
            border-bottom: 1px solid #eee !important;
        }

    /************************************** tables *******************************************/
    .itg_table {
        margin-bottom: 20px;
    }

        .itg_table th {
            background: #206e87;
            color: #fff;
            font-weight: normal;
        }

        .itg_table th, .itg_table td {
            padding: 10px 15px;
            display: table-cell;
        }

        .itg_table .itg_dashboard_dropdown-menu {
            -webkit-transition: all 0.3s ease-in-out;
            transition: all 0.3s ease-in-out;
            right: -11px;
            top: 24px;
        }

    .table.itg_table > tbody > tr > th,
    .table.itg_table > thead > tr > th {
        padding: 8px 10px;
        font-size: var(--font-13, 13px);
        font-weight: 600;
    }

    .table.itg_table > tbody > tr > th {
        background: #FEAF33;
    }

    .itg_table_options {
        padding: 0 5px;
    }

        .itg_table_options i {
            color: #206e87;
            cursor: pointer;
        }

    /******************* widgit Header colors ******************/
    .box-widget.latestPostsWidget > .box-header, .learningPlanWidget.box-widget > .box-header, .box-widget.coursepeople .box-header {
        background: #206e87;
        color: #fff;
    }

        .box-widget.latestPostsWidget > .box-header .img-circle i, .learningPlanWidget.box-widget > .box-header .img-circle i, .box-widget.coursepeople .box-header .img-circle i {
            background: #fff !important;
            color: #206e87 !important;
        }

        .box-widget.latestPostsWidget > .box-header .box-tools .btn-box-tool, .learningPlanWidget.box-widget > .box-header .box-tools .btn-box-tool, .box-widget.coursepeople .box-header .box-tools .btn-box-tool {
            color: #fff !important;
            border: 2px solid rgba(255, 255, 255, 0.4) !important;
            transition: all .3s ease-in-out;
            -webkit-transition: all .3s ease-in-out;
        }

        .box-widget.latestPostsWidget > .box-header .widget-title, .box-widget.latestPostsWidget > .box-header .widget-description, .box-widget.latestPostsWidget > .box-header .box-tools .btn-box-tool, .learningPlanWidget.box-widget > .box-header .widget-title, .learningPlanWidget.box-widget > .box-header .widget-description, .learningPlanWidget.box-widget > .box-header .box-tools .btn-box-tool, .box-widget.coursepeople .box-header .widget-title, .box-widget.coursepeople .box-header .widget-description, .box-widget.coursepeople .box-header .box-tools .btn-box-tool {
            color: #fff !important;
        }

            .box-widget.latestPostsWidget > .box-header .box-tools .btn-box-tool i, .learningPlanWidget.box-widget > .box-header .box-tools .btn-box-tool i, .box-widget.coursepeople .box-header .box-tools .btn-box-tool i {
                color: rgba(255, 255, 255, 0.4) !important;
                transition: all .3s ease-in-out;
                -webkit-transition: all .3s ease-in-out;
            }

            .box-widget.latestPostsWidget > .box-header .box-tools .btn-box-tool:hover, .learningPlanWidget.box-widget > .box-header .box-tools .btn-box-tool:hover, .box-widget.coursepeople .box-header .box-tools .btn-box-tool:hover {
                border: 2px solid white !important;
            }

                .box-widget.latestPostsWidget > .box-header .box-tools .btn-box-tool:hover i, .learningPlanWidget.box-widget > .box-header .box-tools .btn-box-tool:hover i, .box-widget.coursepeople .box-header .box-tools .btn-box-tool:hover i {
                    color: white !important;
                }

    .box-widget.coursepeople .box-header {
        background: #b4c836;
    }

        .box-widget.coursepeople .box-header .img-circle i {
            background: #fff !important;
            color: #b4c836 !important;
        }

    .box-widget.learningPlanWidget .box-header {
        background: #FFB43B;
    }

        .box-widget.learningPlanWidget .box-header .img-circle i {
            background: #fff !important;
            color: #FFB43B !important;
        }

    /*@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic);*/
    /*#72afd2*/
    /*body {
    color: $primary-color;
}*/
    @font-face {
        font-family: "Ionicons";
        src: url("../../ITGDashBoard/fonts/ionicons.eot?v=2.0.0");
        src: url("../../ITGDashBoard/fonts/ionicons.eot?v=2.0.0#iefix") format("embedded-opentype"), url("../../ITGDashBoard/fonts/ionicons.ttf?v=2.0.0") format("truetype"), url("../../ITGDashBoard/fonts/ionicons.woff?v=2.0.0") format("woff"), url("../../ITGDashBoard/fonts/ionicons.svg?v=2.0.0#Ionicons") format("svg");
        font-weight: normal;
        font-style: normal;
    }

    pr
    .eduwaveHeader {
        position: relative;
        max-height: 100px;
        z-index: 1030;
    }

    .eduwaveHeader > .navbar {
        -webkit-transition: margin-left .3s ease-in-out;
        -o-transition: margin-left .3s ease-in-out;
        transition: margin-left .3s ease-in-out;
        margin-bottom: 0;
        margin-left: 230px;
        border: none;
        min-height: 70px;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
    }

    .layout-top-nav .eduwaveHeader > .navbar {
        margin-left: 0;
    }

    .eduwaveHeader #navbar-search-input.form-control {
        background: rgba(255, 255, 255, 0.2);
        border-color: transparent;
    }

        .eduwaveHeader #navbar-search-input.form-control:focus,
        .eduwaveHeader #navbar-search-input.form-control:active {
            border-color: rgba(0, 0, 0, 0.1);
            background: rgba(255, 255, 255, 0.9);
        }

        .eduwaveHeader #navbar-search-input.form-control::-moz-placeholder {
            color: #ccc;
            opacity: 1;
        }

        .eduwaveHeader #navbar-search-input.form-control:-ms-input-placeholder {
            color: #ccc;
        }

        .eduwaveHeader #navbar-search-input.form-control::-webkit-input-placeholder {
            color: #ccc;
        }

    .eduwaveHeader .navbar-custom-menu,
    .eduwaveHeader .navbar-right {
        float: right;
    }

    @media (max-width: 991px) {
        .eduwaveHeader .navbar-custom-menu a,
        .eduwaveHeader .navbar-right a {
            color: inherit;
            background: transparent;
        }
    }

    @media (max-width: 767px) {
        .eduwaveHeader .navbar-right {
            float: none;
        }

        .navbar-collapse .eduwaveHeader .navbar-right {
            margin: 7.5px -15px;
        }

        .eduwaveHeader .navbar-right > li {
            color: inherit;
            border: 0;
        }
    }

    .eduwaveHeader .sidebar-toggle {
        float: left;
        background-color: transparent;
        background-image: none;
        padding: 15px 15px;
        font-family: 'FontAwesome';
    }

        .eduwaveHeader .sidebar-toggle:before {
            content: "\f0c9";
        }

        .eduwaveHeader .sidebar-toggle:hover {
            color: #fff;
        }

        .eduwaveHeader .sidebar-toggle:focus,
        .eduwaveHeader .sidebar-toggle:active {
            background: transparent;
        }

        .eduwaveHeader .sidebar-toggle .icon-bar {
            display: none;
        }

    .eduwaveHeader .navbar .nav > li.user > a > .fa,
    .eduwaveHeader .navbar .nav > li.user > a > .glyphicon,
    .eduwaveHeader .navbar .nav > li.user > a > .ion {
        margin-right: 5px;
    }

    .eduwaveHeader .navbar .nav > li > a > .label {
        position: absolute;
        top: 9px;
        right: 7px;
        text-align: center;
        font-size: 9px;
        padding: 2px 3px;
        line-height: .9;
    }

    .eduwaveHeader .logo {
        -webkit-transition: width .3s ease-in-out;
        -o-transition: width .3s ease-in-out;
        transition: width .3s ease-in-out;
        display: block;
        float: left;
        height: 52px;
        font-size: 20px;
        line-height: 52px;
        text-align: center;
        width: 230px;
        font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
        padding: 0 15px;
        font-weight: 300;
        overflow: hidden;
    }

    .eduwaveHeader .navbar-brand img {
        max-width: 100px;
        margin: auto;
        margin-top: -2px;
        width: 115%;
        padding-top: 0;
        position: relative;
        top: -6px;
        margin-left: 13px;
    }

    .headerLogoText {
        margin-top: 0px !important;
        text-align: center !important;
        margin-right: 0px !important;
    }

    .fade:not(.show) {
        /*display: none;*/
        opacity: 1;
    }

    .headerLogoText p {
        font-size: 11px;
        margin-bottom: 0px;
        margin-top: 4px;
        color: #ddd !important;
    }

    .navbar .headerLogoText::before {
        content: none !important;
    }

    .eduwaveHeader > .navbar {
        padding-bottom: 0px;
        height: inherit;
    }

    .navbar-header {
        display: flex;
    }

    .eduwaveHeader .navbar-brand {
        padding: 7px 10px 5px;
    }

    .eduwaveHeader .navbar .navbar-brand.client-logo {
        padding: 5px 10px;
    }

    .eduwaveHeader .logo .logo-lg {
        display: block;
    }

    .eduwaveHeader .logo .logo-mini {
        display: none;
    }

    .eduwaveHeader .navbar-brand {
        color: #fff;
    }

    /***********************************************  end of Admin.css Header ***********************************************/
    .eduwaveHeader .box {
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        -ms-border-radius: 10px;
        border-radius: 10px;
    }

    .eduwaveHeader {
        background: #206e87;
        height: 65px;
        color: #fff;
    }

        /*.eduwaveHeader .navbar-default .navbar-brand:focus, .eduwaveHeader .navbar-default .navbar-brand:hover {
        background-color: #206e87 ;
    }*/

        .eduwaveHeader .navbar-default .navbar-toggle:focus, .eduwaveHeader .navbar-default .navbar-toggle:hover {
            background: none !important;
        }

    .navbar .navbar-brand:before {
        content: "|";
        position: absolute;
        right: 238px;
        top: 5px;
        font-size: 30px;
        color: #ffffff36;
    }

    .has-popup.static > ul:before {
        display: none !important;
    }

    .eduwaveHeader:before,
    .eduwaveHeader:after {
        clear: both;
        content: "";
        display: block;
    }

    .eduwaveHeader > .navbar {
        margin-left: 0px !important;
    }

    .course-list .topImage {
        overflow: hidden;
        width: 62px;
        height: 62px;
        line-height: 0;
        border-radius: 50%;
    }

        .course-list .topImage img {
            height: 100%;
            width: 100%;
            border-radius: 0;
        }

    .course-list li a {
        padding: 10px;
    }

    .course-list li a {
        padding: 0px;
    }

    .nav-open .nav .caret {
        border-bottom-color: #FFFFFF;
        border-top-color: #FFFFFF;
    }

    .navbar-default {
        background-color: #206e87 !important;
        box-shadow: 0 2px 7px rgba(105, 105, 105, 0.3);
    }

        .navbar-default .navbar-nav > li > a:not(.btn) {
            color: #fff;
            font-size: var(--font-14, 14px);
        }

        .navbar-default .navbar-nav > .active > a,
        .navbar-default .navbar-nav > .active > a:not(.btn):hover,
        .navbar-default .navbar-nav > .active > a:not(.btn):focus {
            background-color: transparent;
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            -ms-border-radius: 3px;
            border-radius: 3px;
            color: #b5e0ff;
            opacity: 1;
            filter: alpha(opacity=100);
        }

        .navbar-default .navbar-nav.navbar-Center > li > a:not(.btn):hover,
        .navbar-default .navbar-nav.navbar-Center > li > a:not(.btn):focus {
            /*  color: #b5e0ff; */
            /*background-color: transparent;
  opacity: 1;
  filter: alpha(opacity=100);
  border-bottom: 2px solid #fff;*/
            /*        background: #206e87 ;*/
        }

        .navbar-default .navbar-nav > .active > a:after,
        .navbar-default .navbar-nav > .active > a:not(.btn):after,
        .navbar-default .navbar-nav.navbar-Center > li:hover > a:not(.btn):after {
            content: "";
            position: absolute;
            bottom: 0;
            display: block;
            left: 0;
            height: 3px;
            background: #fff;
            width: 100%;
        }

    .nav.navbar-nav.navbar-Center .active {
        border-bottom: 2px solid #fff;
        color: #fff;
    }

    .navbar-default .navbar-nav > .dropdown > a:hover .caret,
    .navbar-default .navbar-nav > .dropdown > a:focus .caret {
        border-bottom-color: #b5e0ff;
        border-top-color: #b5e0ff;
    }

    .navbar-default .navbar-nav > .open > a,
    .navbar-default .navbar-nav > .open > a:hover,
    .navbar-default .navbar-nav > .open > a:focus {
        background-color: transparent;
        /*color: #206e87 ;*/
        color: #fff;
    }

    .navbar-default .navbar-nav .navbar-toggle:hover,
    .navbar-default .navbar-nav .navbar-toggle:focus {
        background-color: transparent;
    }

    .navbar-default:not(.navbar-transparent) .btn-default:hover {
        color: #206e87;
        border-color: #206e87;
    }

    .navbar-default:not(.navbar-transparent) .btn-neutral,
    .navbar-default:not(.navbar-transparent) .btn-neutral:hover,
    .navbar-default:not(.navbar-transparent) .btn-neutral:active {
        color: #333;
    }

    .navbar-Center .navbar-options.course-list {
        padding: 10px;
    }

        .navbar-Center .navbar-options.course-list li {
            padding: 0;
        }

            .navbar-Center .navbar-options.course-list li a {
                padding: 10px 10px 0px;
                cursor: pointer;
            }

                .navbar-Center .navbar-options.course-list li a:hover {
                    background: #206e87;
                    text-decoration: none;
                }

            .navbar-Center .navbar-options.course-list li .users-list-name {
                margin: 5px 0;
                font-size: var(--font-12, 12px);
                font-weight: normal;
                line-height: 15px;
            }

            .navbar-Center .navbar-options.course-list li a:hover .users-list-name {
                color: #fff;
            }

    /*-----------------------------------------------*/
    .eduwaveHeader .nav > li > a:hover,
    .eduwaveHeader .nav > li > a:focus {
        background-color: transparent;
    }

    .navbar {
        border: 0;
        font-size: var(--font-16, 16px);
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
    }

        .navbar .navbar-brand {
            font-weight: 400;
            padding: 0px 10px;
            font-size: var(--font-20, 20px);
            /*background-image: url(../images/EduWave_logo.png);*/
            background-repeat: no-repeat;
            background-position: center !important;
            width: fit-content;
            background-color: #206e87;
            min-height: 52px;
            height: 52px;
            padding-right: 15px;
        }

        .navbar .navbar-brand {
            max-width: 100%;
        }

            .navbar .navbar-brand.client-logo {
                float: right;
                /*background-image: url(../images/client_logo.png);*/
                background-size: 35px;
                min-width: 75px;
                width: auto;
                margin-left: 0 !important;
                background-color: #206e87;
                margin: 0;
                min-height: auto;
                background-position: center !important;
                height: 52px;
                margin-right: -15px;
                text-align: center;
                vertical-align: middle;
                vertical-align: middle;
                line-height: 37px;
                /* aibrahim fix bug #6000 17/10/2017 */
                vertical-align: middle;
                /*#6000*/
                text-align: center;
                /*#6000*/
            }

                .navbar .navbar-brand.client-logo img {
                    margin: auto;
                    max-width: 45px;
                    max-height: 45px;
                    display: inline;
                }

    .navbar-collapse.has-image .navbar-brand.client-logo {
        background-image: url(../images/client_logo.png);
        background-repeat: no-repeat;
        width: 35px;
        height: 52px;
        padding: 13px 20px;
        line-height: 20px;
        float: none;
        font-size: inherit;
    }

    .container-fluid > .navbar-collapse,
    .container-fluid > .navbar-header,
    .container > .navbar-collapse,
    .container > .navbar-header {
        margin-right: -15px;
        margin-left: -15px;
    }

    .navbar-header {
        display: flex;
        width: 250px;
    }

    .navbar-collapse {
        position: relative;
    }

    .nav.navbar-nav.navbar-left {
        position: relative;
        margin-right: 10px;
        margin-top: -45px;
    }

        .nav.navbar-nav.navbar-left:hover {
            /*        background: #206e87;
        ;*/
        }

    /*.BreadCrumb {
    padding: 10px;
    background-color: #fff;
    margin: 0px 16px 10px;
    border: 1px solid #ddd;
}*/
    .navbar-default .navbar-toggle .icon-bar {
        background-color: #fff;
    }

    @media (min-width: 768px) {
        .navbar-right {
            margin-right: 0;
            float: left !important;
        }
    }

    .navbar > .container-fluid .navbar-brand {
        max-width: 65px;
        margin-right: 0px;
        margin-top: 1px;
        width: 100%;
        padding-top: 0;
        /*    position: relative;
*/ top: -2px;
    }

    .navbar .navbar-nav > li > a {
        /*    padding: 8px 15px 0;*/
        /*    margin: 4px 3px 0;*/
        position: relative;
    }

    .navbar .navbar-nav .userinfo .UserNameHeader {
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        max-width: 100%;
        color: #fff;
    }

        .navbar .navbar-nav .userinfo .UserNameHeader span {
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
            max-width: 210px;
            display: inline-block;
            margin-bottom: -6px;
            font-size: 14px;
            cursor: pointer;
            text-overflow: ellipsis;
            color: #fff;
        }

        .navbar .navbar-nav .userinfo .UserNameHeader:after {
            font-family: 'FontAwesome' !important;
            content: "\F107";
            font-size: 17px;
            padding: 0 5px;
            line-height: 20px;
            /*position: absolute;
  top: 4px;
  right: 5px;*/
            position: absolute;
            left: -23%;
            /*        transform: rotate(90deg);*/
            top: 35%;
        }

    .navbar .navbar-nav > li.userinfo:hover,
    .navbar .navbar-nav > li.userinfo:focus {
        color: #fff;
    }

    #tbInsertYouTubeVideo24265 {
        width: 300px !important;
    }

    .navbar .navbar-nav .UserType {
        color: #ccc;
        font-size: 11px;
        padding: 0 2px 0;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        max-width: 100%;
        color: #ddd;
        max-height: 230px;
        font-size: 11px;
        font-weight: normal;
    }

        .navbar .navbar-nav .UserType span {
            font-size: 11px !important;
        }

        .navbar .navbar-nav .UserType .fa {
            font-size: 14px;
        }

    .navbar .navbar-nav > li > a.btn {
        margin: 15px 3px;
        padding: 8px 16px;
    }

    .navbar .navbar-nav > li > a.btn-round {
        margin: 16px 3px;
    }

    .navbar .navbar-nav li a [class^="fa"],
    .navbar .navbar-nav > li > a.fa {
        font-size: 20px;
        position: relative;
        line-height: 12px;
        top: 2px;
    }

    .navbar-nav {
        margin-top: 1px;
    }

    .navbar .navbar-nav > li .fa-globe + .itg_dashboard_dropdown-menu {
        min-width: auto;
        text-align: center;
    }

    @media (min-width: 768px) {
        .navbar-right .itg_dashboard_dropdown-menu.navbar-options,
        .navbar-right .itg_dashboard_dropdown-menu {
            right: -5px;
            left: auto;
            top: 50px;
        }
    }

    .navbar-Center .navbar-options,
    .navbar-right .navbar-options {
        max-width: 400px;
        min-width: 350px;
        box-sizing: border-box;
        padding: 10px 0;
    }

        .navbar-right .navbar-options ul {
            padding: 0;
            margin: 0;
            list-style: none;
        }

        /*
.navbar-Center .navbar-options li,
.navbar-right .navbar-options li li {
    display: block;
    float: left;
    box-sizing: border-box;
    text-align: center;
}*/
        .navbar-Center .navbar-options li a,
        .navbar-right .navbar-options li a {
            font-family: 'Cairo Regular';
            font-weight: 400;
            font-size: var(--font-12, 12px);
            display: inline-block;
            position: relative;
            /*height: 50px;*/
            width: 100%;
            /*min-width: 130px;
  max-width: 130px;
  box-sizing: border-box;
  vertical-align: top;
  line-height: 58px;*/
            padding: 15px 0;
            text-align: center;
            color: #206e87;
            transition: all 400ms ease-in-out;
            -webkit-transition: all 400ms ease-in-out;
            -moz-transition: all 400ms ease-in-out;
            white-space: inherit;
            line-height: 1.1;
        }

            .navbar-Center .navbar-options li .fa,
            .navbar-right .navbar-options li a .fa {
                font-size: 23px;
                display: block;
                margin: auto;
                margin-bottom: 7px;
            }

        .navbar-right .navbar-options li:hover .fa:before {
            text-decoration: none;
        }

    .navbar-nav .navbar-options li a:hover:after {
        color: #fff !important;
        z-index: 2;
    }

    .navbar-right .navbar-options li a:hover {
        background: #206e87;
        color: #fff;
        /*    padding: 18px;*/
        height: 80px;
    }

    .navbar-nav > li .fa-bell-alt:before {
        content: "\F0F3";
    }

    .navbar-nav > li .fa-calendar:before {
        content: "\F073";
    }

    .navbar-nav > li .fa-question-sign:before {
        content: "\F059";
    }
    /*i {
    font-weight: 100 !important;
}*/
    .fa {
        font-family: 'FontAwesome' !important;
        font-weight: 100 !important;
    }

    .fas {
        font-family: 'FontAwesome' !important;
        font-weight: 100 !important;
    }

    #tdTTS .record-btns button::before {
        font-family: 'FontAwesome' !important;
        content: "\f04b" !important;
    }

    #divMCContainer .AssesBoxContent {
        display: flex;
        justify-content: start;
        align-items: center;
    }

    .box-body .assessment-details canvas {
        position: static;
        width: 30px;
        height: 30px !important;
    }

    fa-time-in-alt:before {
        content: "\f017";
        font-family: 'FontAwesome' !important;
    }

    #divValdtionMSGAddTitle .ValidationNote.marginBottom {
        display: flex;
        width: 100%;
    }

    #divValdtionMSGAddDescription .ValidationNote.marginBottom {
        display: flex;
        width: 100%;
    }

    .box.box-widget.LearningObjectFolderingWidget .box-header.with-border .widget-block .widget-title span {
        display: flex;
        justify-content: start;
        align-items: center;
        padding-top: 7px;
    }

    /*.noData-img-container .noDataImg.mCS_img_loaded {
    width: 13%;
}*/

    .img-circle .fas.fa-time-in-alt:before {
        content: "\f017" !important;
        font-family: 'FontAwesome' !important;
    }

    .fa-spell-check {
        --fa: "\f891";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav > li .fa-th:before {
        content: "\f0ca";
        /*background: #206e87;;*/
        padding: 5px 6px 3px;
        color: #ffffff;
        font-size: 18px;
        margin-top: 3px;
        /* display: block; */
    }

    .third-step-men i {
        position: relative;
        top: 2px;
    }

    .eduwaveHeader .navbar-right {
        position: relative;
        margin-right: 10px;
        margin-top: -15px;
        top: 0;
    }

    .headercentercontent {
        display: flex;
        position: absolute;
        top: 10px;
    }

    .coursepage:not(.leaderBoardWidget) {
        margin: 0 0px;
    }

    .header-top {
        width: Calc(100% - 0px);
        display: inline-block;
    }

    /********************** menu icons ************************/
    .navbar-nav .navbar-options li a:after {
        color: #206e87;
        transition: all 400ms ease-in-out;
        -webkit-transition: all 400ms ease-in-out;
        -moz-transition: all 400ms ease-in-out;
        position: absolute;
    }

    .navbar-nav .navbar-options li a:after,
    .navbar-nav .navbar-options li a:before {
        font-family: 'FontAwesome' !important;
        font-size: 23px;
        display: block;
        margin: auto;
        margin-bottom: 7px;
    }

    .navbar-nav .navbar-options li .fa-EduBriefcase:before {
        content: "\f0f2";
    }

    .navbar-nav .navbar-options li .fa-group:before {
        content: "\F0C0";
    }

    .navbar-nav .navbar-options li .fa-Forum:before {
        content: "\F0E6";
    }

    .navbar-nav .navbar-options li .fa-Library:before {
        /*content: "\F02D";*/
        content: "\F19c";
    }

    .navbar-nav .navbar-options li .fa-Blog:before {
        content: "\F086";
    }

    .navbar-nav .navbar-options li .fa-Gradebook:before {
        content: "\F02D";
    }

    .navbar-nav .navbar-options li .fa-Transcript:before {
        content: "\F0F6";
    }

    .navbar-nav .navbar-options li .fa-TeacherRemarks:before {
        content: "\F0E5";
    }

    .navbar-nav .navbar-options li .fa-EduSessions:before {
        content: "\F01D";
    }

    .navbar-nav .navbar-options li .fa-Personalized:before {
        content: "\f1b3";
    }

    .navbar-nav .navbar-options li .fa-booksnotes:before {
        content: "\f044";
    }

    .navbar-nav .navbar-options li .fa-MultimediaLibrary:before {
        content: "\F16A";
    }

    .navbar-nav .navbar-options li .fa-Attendance:before {
        content: "\F256";
    }

    .navbar-nav .navbar-options li .fa-Curricula:before {
        /*content: "\F12E";*/
        content: "\F02D";
    }

    .navbar-nav .navbar-options li .fa-Assessments:before {
        content: "\f295";
    }

    .navbar-nav .navbar-options li .fa-Assignment-Management:before,
    .navbar-nav .navbar-options li .fa-Assignments:before {
        content: "\f0c5";
    }

    .navbar-nav .navbar-options li .fa-calender:before {
        content: "\f073";
    }

    .navbar-nav .navbar-options li .fa-User-vote:before {
        /*content: "\f256";*/
        content: "\f187";
    }

    .navbar-nav .navbar-options li .fa-Books-Management:before {
        content: "\f02d";
    }

    .navbar-nav .navbar-options li .fa-Badges-Management:before {
        font-family: 'FontAwesome' !important;
        content: "\f559";
    }

    .fa-user-graduate {
        font-family: 'FontAwesome' !important;
        content: "\f501";
    }

    .navbar-nav .navbar-options li .fa-Health-Management::after,
    .navbar-nav .navbar-options li .fa-Badges-Management:after,
    .navbar-nav .navbar-options li .fa-ExtendedEssayForm:after,
    .navbar-nav .navbar-options li .fa-ibprogram:after,
    .navbar-nav .navbar-options li .fa-kwnoladge:after,
    .navbar-nav .navbar-options li .fa-Student-Affairs:after,
    .navbar-nav .navbar-options li .fa-Course-Management:after,
    .navbar-nav .navbar-options li .fa-Content-Management:after,
    .navbar-nav .navbar-options li .fa-Assessment-Management:after,
    .navbar-nav .navbar-options li .fa-Grades-Management:after,
    .navbar-nav .navbar-options li .fa-Attendance-Management:after,
    .navbar-nav .navbar-options li .fa-Assignment-Management:after,
    .navbar-nav .navbar-options li .fa-Books-Management:after {
        content: "\f013";
        font-size: 19px;
        margin: auto;
        margin-bottom: 7px;
        position: absolute;
        top: 8px;
        left: 52%;
        z-index: -2;
    }

    .navbar-nav .navbar-options li .fa-Bulletin-Board:before {
        content: "\f24a";
        font-size: 22px;
    }

    .navbar-nav .navbar-options li .fa-Bulletin-Board:after {
        content: "\f08d";
        font-size: 17px;
        margin: auto;
        margin-bottom: 7px;
        position: absolute;
        top: 8px;
        left: 47%;
        transform: rotate(30deg);
    }

    .navbar-nav .navbar-options li .fa-Reports:before {
        content: "\f080";
    }

    .navbar-nav .navbar-options li .fa-Attendance-Management:before {
        content: "\F256";
    }

    .navbar-nav .navbar-options li .fa-Grades-Management:before {
        content: "\f295";
        /*transform: rotate(30deg);*/
    }

    .navbar-nav .navbar-options li .fa-Grades-Management:after {
        top: 15px;
        left: 56%;
    }

    .navbar-nav .navbar-options li .fa-EduPedia:before {
        content: "\f0ac";
    }

    .navbar-nav .navbar-options li .fa-EduPedia:after {
        content: "\f0eb";
        font-size: 22px;
        margin: auto;
        margin-bottom: 7px;
        position: absolute;
        top: 8px;
        left: 31%;
    }

    .navbar-nav .navbar-options li .fa-Learning-Standards:before {
        content: "\f19d";
    }

    .navbar-nav .navbar-options li .fa-Power-Query:before {
        content: "\F0F6";
    }

    .navbar-nav .navbar-options li .fa-Power-Query:after {
        content: "\F1c0";
        font-size: 18px;
        margin: auto;
        position: absolute;
        top: 11px;
        left: 21%;
    }

    .navbar-nav .navbar-options li .fa-Course-Templates:before {
        content: "\F1b3";
    }

    .navbar-nav .navbar-options li .fa-Learning-Objects:before {
        content: "\f0c6";
    }

    .navbar-nav .navbar-options li .fa-Student-Affairs:before {
        content: "\f007";
    }

    .navbar-nav .navbar-options li .fa-Assessment-Management:before {
        /*content: "\f29c";*/
        content: "\f059";
    }

    .navbar-nav .navbar-options li .fa-Distance-Learning-Course:before {
        content: "\F02D";
    }

    .navbar-nav .navbar-options li .fa-Content-Management:before {
        content: "\f15c";
    }

    .navbar-nav .navbar-options li .fa-LeaderBoard::before {
        content: "\f344";
        font-family: "Ionicons" !important;
    }

    .navbar-nav .navbar-options li .fa-LeaderBoard::after {
        content: "\f091";
        font-size: 18px;
        margin: auto;
        margin-bottom: 7px;
        position: absolute;
        top: 3px;
        left: 40%;
        z-index: -2;
    }

    .navbar-nav .navbar-options li .fa-Course-Management:before {
        content: "\f02d";
    }

    .navbar-nav .navbar-options li .fa-Health-Management:before {
        content: "\f481";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li .fa-My-Portal:before {
        content: "\f2bd";
    }

    .navbar-nav .navbar-options li .fa-Progress:before {
        content: "\f201";
        font-size: 22px;
    }

    .navbar-nav .navbar-options li .fa-kwnoladge:before {
        content: "\f36c";
        font-size: 29px;
        font-family: "Ionicons" !important;
        font-weight: bold;
    }

    .navbar-nav .navbar-options li .fa-kwnoladge:after {
        content: "\f295";
        font-size: 19px !important;
        top: 6px;
        left: 53%;
        z-index: -2;
        transform: rotate(-60deg);
    }

    .navbar-nav .navbar-options li .fa-chart:before {
        content: "\f1fe";
        font-size: 22px;
    }

    .navbar-nav .navbar-options li .fa-recommendation:before {
        content: "\f2d4";
        font-family: "Ionicons" !important;
        font-size: 24px;
    }

    .navbar-nav .navbar-options li .fa-ibprogram:before {
        content: "\f276";
        font-size: 28px;
        font-family: "Ionicons" !important;
        margin-top: -2px;
    }

    .navbar-nav .navbar-options li .fa-ibprogram:after {
        content: "\f19d";
        font-size: 21px !important;
        top: 6px;
        left: 50%;
        z-index: 0;
        text-shadow: -2px 2px 0px #fff;
    }

    .navbar-nav .navbar-options li .fa-CAS:before {
        content: "\f12e";
        font-size: 29px;
        font-family: "Ionicons" !important;
        margin-top: -3px;
        transform: rotate(-25deg);
        margin-left: -13px;
    }

    .navbar-nav .navbar-options li .fa-CAS:after {
        content: "\f36c";
        font-size: 24px !important;
        top: 11px;
        left: 48%;
        z-index: 0;
        transform: rotate(7deg);
        font-family: "Ionicons" !important;
        position: absolute;
    }

    .navbar-nav .navbar-options li .fa-CASExperience:before {
        content: "\f12e";
        font-size: 29px;
        font-family: "Ionicons" !important;
        margin-top: -3px;
        transform: rotate(-25deg);
        margin-left: -13px;
    }

    .navbar-nav .navbar-options li .fa-CASExperience:after {
        content: "\f0f2";
        font-size: 19px !important;
        top: 21px;
        left: 48%;
        z-index: 0;
        text-shadow: -1px 1px 0px #fff;
        position: absolute;
    }

    .navbar-nav .navbar-options li .fa-ibprogram:hover:after {
        text-shadow: -2px 2px 0px #2e95b7;
    }

    .navbar-nav .navbar-options li .fa-Survey:before {
        content: "\f046";
        font-size: 22px;
    }

    .Books-and-Apps .Apps-RightSide .fa-Link:before {
        content: "\F0C1";
    }

    .eduwaveHeader .navbar-right .itg_dashboard_dropdown-menu a.selected.fa-ibprogram:after {
        text-shadow: -2px 2px 0px #206e87;
    }

    #ctl00_ctl00_cphPageBody_cphMain_dlStudents tbody {
        width: 100%;
        display: block;
    }

    #ctl00_ctl00_cphPageBody_cphMain_dlStudents {
        border: none !important;
        display: block;
        border-radius: 4px;
        position: relative;
    }

    .navbar-nav .navbar-options li .fa-My-EduWave:before {
        content: "\f2bd";
    }

    .navbar-nav .navbar-options li .fa-School-Information:before {
        content: "\f05a";
    }

    .navbar-nav .navbar-options li .fa-Express-Settings:before,
    .navbar-nav .navbar-options li .fa-Academic-Settings:before {
        content: "\f085";
    }

    .navbar-nav .navbar-options li .fa-Grades-Settings:before {
        content: "\f1de";
    }

    .navbar-nav .navbar-options li .fa-Grade-Level-Management:before {
        content: "\f1de";
    }

    .navbar-nav .navbar-options li .fa-School-Year-Closing:before {
        font-family: "Ionicons" !important;
        content: "\f349";
    }

    .navbar-nav .navbar-options li .fa-Policies-Incidents:before {
        content: "\f132";
    }

    .navbar-nav .navbar-options li .fa-incident:before {
        content: "\f2a2";
        font-family: "Ionicons" !important;
    }

    .navbar-nav .navbar-options li .fa-activities:before {
        content: "\f5c4";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li .fa-pointing-system::before {
        /* content: "\f5a2"; */
        /* font-family: "Font Awesome 5 Free" !important; */
        content: "\f5a2";
        font-family: 'FontAwesome' !important;
        font-size: 23px;
        margin: auto;
        margin-bottom: 7px;
        top: 23px;
        left: 36%;
        z-index: 1;
        width: 100%;
        height: 9px;
        overflow: hidden;
        border-radius: 50%;
        text-align: center;
        margin-bottom: 22px;
    }

    .navbar-nav .navbar-options li .fa-pointing-system::after {
        content: "\f5a2";
        font-family: 'FontAwesome' !important;
        font-size: 23px;
        margin: auto;
        margin-bottom: 7px;
        top: 22px;
        left: 0;
        z-index: 1;
        width: 100%;
        height: 18px;
        overflow: hidden;
        line-height: 10px;
        border-radius: 50%;
        text-align: center;
        position: absolute;
        width: 24px;
        border-radius: 50%;
        overflow: hidden;
        left: calc(50% - 12px);
    }

    .navbar-nav .navbar-options li .fa-ExtendedEssayForm:before {
        content: "\f472";
        font-size: 26px;
        font-family: "Ionicons" !important;
    }

    .navbar-nav .navbar-options li a.fa-Seat-Availability-Waiting-List:before {
        content: "\f0ae";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Seat-Availability-Waiting-List:after {
        content: "\f3b3";
        font-family: "Ionicons" !important;
        top: 6px;
        right: 20px;
        background: #fff;
        border-radius: 50%;
    }

    .navbar-nav .navbar-options li a.fa-Interview-Date:before {
        content: "\f783";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Admission:before {
        content: "\f46c";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Admission-Students-Report:before {
        content: "\f46c";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Admission-Students-Report:after {
        content: "\f15c";
        font-size: 17px !important;
        top: 7px;
        left: 56%;
        text-shadow: -2px 2px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-Pending-Admissions:before {
        content: "\f46c";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Pending-Admissions:after {
        content: "\f3b3";
        font-family: "Ionicons" !important;
        top: 6px;
        right: 20px;
        background: #fff;
        border-radius: 50%;
    }

    .navbar-nav .navbar-options li a.fa-Admission-Lookups:before {
        content: "\f46c";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Admission-Lookups:after {
        content: "\f002";
        font-family: 'FontAwesome' !important;
        font-size: 17px !important;
        top: 6px;
        right: 20px;
    }

    .navbar-nav .navbar-options li a.fa-Admission-Fees:before {
        content: "\f571";
        font-size: 25px;
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Statement-Account:before {
        content: "\f570";
        font-size: 25px;
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Final-Admitted-Students:before {
        content: "\f4fc";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-CommunicationSetup:before {
        content: "\f2d4";
        font-family: "Ionicons" !important;
        font-size: 30px;
    }

    .navbar-nav .navbar-options li a.fa-CommunicationSetup:after {
        content: "\f2f7";
        font-family: "Ionicons" !important;
        top: 6px;
        right: 20px;
        text-shadow: -2px 1px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-GeneralSetting:before {
        content: "\f2f7";
        font-family: "Ionicons" !important;
    }

    .navbar-nav .navbar-options li a.fa-Notification-Templates-Setup:before {
        content: "\F0F3";
    }

    .navbar-nav .navbar-options li a.fa-Notification-Templates-Setup:after {
        content: "\f2f7";
        font-family: "Ionicons" !important;
        top: 6px;
        right: 20px;
        text-shadow: -2px 1px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-IBDP-Application-Form:before {
        content: "\f558";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-IBDP-Application-Form:after {
        content: "\f46d";
        font-family: 'FontAwesome' !important;
        font-size: 21px !important;
        top: 3px;
        left: 61%;
        z-index: 0;
        text-shadow: -2px 1px 0px #fff;
    }

    .navbar-nav .navbar-options li .fa-IBDP-Lookups::before {
        content: "\f558";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li .fa-IBDP-Lookups::after {
        content: "\f002";
        font-size: 21px !important;
        top: 3px;
        left: 56%;
        z-index: 0;
        text-shadow: -2px 1px 0px #fff;
    }

    .navbar-nav .navbar-options li .fa-Teacher-Comment-Lookup:before {
        content: "\F0E5";
    }

    .navbar-nav .navbar-options li .fa-Teacher-Comment-Lookup:after {
        content: "\f002";
        font-size: 21px !important;
        top: 8px;
        left: 56%;
        z-index: 0;
        text-shadow: -2px 1px 0px #fff;
    }

    .navbar-nav .navbar-options li .fa-Course-Modifications-Form:before {
        content: "\f02d";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li .fa-Course-Modifications-Form:after {
        content: "\f0ec";
        font-size: 21px !important;
        top: 3px;
        left: 56%;
        z-index: 0;
        text-shadow: -2px 0px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-Blocks-Management:before {
        content: "\f1b3";
    }

    .navbar-nav .navbar-options li a.fa-Fees-Management:after,
    .navbar-nav .navbar-options li a.fa-Activities-Management:after,
    .navbar-nav .navbar-options li a.fa-Blocks-Management:after {
        content: "\f2f7";
        font-family: "Ionicons" !important;
        top: 6px;
        right: 20px;
        text-shadow: -2px 1px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-Extended-Essays-Management:before {
        content: "\f501";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Extended-Essays-Management:after {
        content: "\f70e";
        font-family: 'FontAwesome' !important;
        font-size: 16px;
        top: 9px;
        right: 20px;
        text-shadow: -2px 1px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-Entrance-Exam:before {
        content: "\f375";
        font-size: 28px;
        font-family: "Ionicons" !important;
    }

    .navbar-nav .navbar-options li a.fa-Entrance-Exam-Lookups:before {
        content: "\f375";
        font-size: 28px;
        font-family: "Ionicons" !important;
    }

    .navbar-nav .navbar-options li a.fa-Entrance-Exam-Lookups:after {
        content: "\f002";
        font-size: 17px !important;
        top: 5px;
        left: 56%;
        z-index: 0;
        text-shadow: -2px 1px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-Predicted-Grades-Report:before {
        content: "\f541";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Predicted-Grades-Report:after {
        content: "\f080";
        font-size: 17px;
        top: 10px;
        right: 12px;
    }

    .navbar-nav .navbar-options li a.fa-Predicted-Grades-Submission-Report:before {
        content: "\f541";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Predicted-Grades-Submission-Report:after {
        content: "\f274";
        font-size: 18px;
        top: 10px;
        right: 12px;
    }

    .navbar-nav .navbar-options li a.fa-Consent-Forms:before {
        content: "\f573";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Form-of-Integration:before {
        content: "\f413";
        font-size: 37px;
        font-family: "Ionicons" !important;
        margin-top: -8px;
        margin-bottom: 4px;
    }

    .navbar-nav .navbar-options li a.fa-Form-of-Integration:after {
        content: "\f46d";
        font-family: 'FontAwesome' !important;
        top: 3px;
        right: 9px;
        z-index: 0;
        text-shadow: -2px 0px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-Personal-Projects:before {
        content: "\f007";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Personal-Projects:after {
        content: "\f07c";
        font-family: 'FontAwesome' !important;
        font-size: 16px !important;
        top: 11px;
        left: 58%;
        position: absolute;
        text-shadow: -1px -1px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-Assign-CAS-Advisor:before,
    .navbar-nav .navbar-options li a.fa-CAS-Lookups:before,
    .navbar-nav .navbar-options li a.fa-CAS-Internship:before,
    .navbar-nav .navbar-options li a.fa-CAS-Experience-Management:before,
    .navbar-nav .navbar-options li a.fa-CAS-Project:before,
    .navbar-nav .navbar-options li a.fa-CAS-Bulletin-Board:before {
        content: "CAS";
        font-size: 29px;
        font-family: arial !important;
        font-family: "open_sansregular", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
        margin-top: -3px;
        transform: rotate(0deg);
        margin-left: 0px;
        font-size: 16px !important;
        font-weight: bold;
        vertical-align: middle;
        line-height: 30px;
    }

    .navbar-nav .navbar-options li a.fa-Assign-CAS-Advisor:after,
    .navbar-nav .navbar-options li a.fa-CAS-Lookups:after,
    .navbar-nav .navbar-options li a.fa-CAS-Internship:after,
    .navbar-nav .navbar-options li a.fa-CAS-Experience-Management:after,
    .navbar-nav .navbar-options li a.fa-CAS-Project:after,
    .navbar-nav .navbar-options li a.fa-CAS-Bulletin-Board:after {
        content: "\f36c";
        font-size: 19px !important;
        top: 10px;
        right: 7px;
        z-index: 0;
        transform: rotate(0deg);
        font-family: "Ionicons" !important;
        position: absolute;
        text-shadow: -2px 0px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-CAS-Lookups:after {
        content: "\f002";
        font-family: 'FontAwesome' !important;
        font-size: 17px !important;
        right: 11px;
    }

    .navbar-nav .navbar-options li a.fa-CAS-Internship:after {
        content: "\f47f";
        font-family: 'FontAwesome' !important;
        font-size: 21px !important;
        content: "\f2c1";
        transform: rotate(-21deg);
        right: 11px;
        font-size: 19px !important;
    }

    .navbar-nav .navbar-options li a.fa-CAS-Experience-Management:after {
        content: "\f0b1";
        font-family: 'FontAwesome' !important;
        font-size: 19px !important;
        right: 6px;
        top: 9px;
    }

    .navbar-nav .navbar-options li a.fa-CAS-Project:after {
        content: "\f07c";
        font-family: 'FontAwesome' !important;
        transform: inherit !important;
        font-size: 18px !important;
    }

    .navbar-nav .navbar-options li a.fa-CAS-Bulletin-Board:after {
        content: "\f51b";
        content: "\f328";
        content: "\f249";
        font-family: 'FontAwesome' !important;
        transform: rotate(-202deg);
    }

    .navbar-nav .navbar-options li a.fa-Assign-CAS-Advisor:after {
        content: "\f508";
        font-family: 'FontAwesome' !important;
        font-size: 19px !important;
    }

    .navbar-nav .navbar-options li a.fa-Incidents-Registration:before {
        content: "\f2a2";
        font-family: "Ionicons" !important;
        font-size: 25px;
        margin-top: -2px;
    }

    .navbar-nav .navbar-options li a.fa-Incidents-Registration:after {
        content: "\f2bb";
        font-family: 'FontAwesome' !important;
        top: 8px;
        right: 15px;
        text-shadow: -2px 2px 0px #fff;
        font-size: 15px;
    }

    .navbar-nav .navbar-options li a.fa-Discipline-Settings:before {
        content: "\f007";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Discipline-Settings:after {
        content: "\f1de";
        font-family: 'FontAwesome' !important;
        top: 4px;
        right: 15px;
        text-shadow: -2px 2px 0px #fff;
        font-size: 19px;
    }

    .navbar-nav .navbar-options li a.fa-Discipline-Policies-Setup:before {
        content: "\f007";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Discipline-Policies-Setup:after {
        content: "\f085";
        top: 3px;
        right: 11px;
        text-shadow: 1px 1px 0px #fff;
        transform: rotateY(180deg);
    }

    .navbar-nav .navbar-options li a.fa-Fees-Management:before {
        content: "\f155";
        font-size: 21px;
        position: relative;
        left: -1px;
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Activities-Management:before {
        content: "\f5c4";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Activities-Setup:before {
        content: "\f5c4";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Activities-Setup:after {
        content: "\f085";
        top: 3px;
        right: 11px;
        text-shadow: 1px 1px 0px #fff;
        transform: rotateY(180deg);
    }

    .navbar-nav .navbar-options li a.fa-Activities-Report:before {
        content: "\f5c4";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Activities-Report:after {
        content: "\f080";
        font-size: 17px;
        top: 10px;
        right: 12px;
    }

    .navbar-nav .navbar-options li a.fa-Exam-Centers-Dashboard:before,
    .navbar-nav .navbar-options li a.fa-Centers-Examinations:before,
    .navbar-nav .navbar-options li a.fa-Centers-Examinations-MGT:before {
        content: "\f1ad";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Centers-Examinations-MGT:after {
        content: "\f2f7";
        font-family: "Ionicons" !important;
        top: 3px;
        right: 17px;
        text-shadow: -2px 1px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-Exam-Centers-Dashboard:after {
        content: "\f0e4";
        top: 3px;
        right: 17px;
        text-shadow: -1px 1px 0px #fff;
        font-size: 18px;
    }

    .navbar-nav .navbar-options li a.fa-Centers-Examinations-MGT.selected:after {
        text-shadow: -2px 0px 0px #206e87;
    }

    .navbar-nav .navbar-options li a.fa-Centers-Examinations-MGT:hover:after {
        text-shadow: -2px 0px 0px #206e87;
    }

    .navbar-nav .navbar-options li a.fa-Exam-Centers-Dashboard.selected:after {
        text-shadow: -1px 1px 0px #206e87;
    }

    .navbar-nav .navbar-options li a.fa-Centers-Examinations-MGT:hover:after,
    .navbar-nav .navbar-options li a.fa-Exam-Centers-Dashboard:hover:after {
        text-shadow: -1px 1px 0px #206e87;
        transition: all 400ms ease-in-out;
    }

    .navbar-nav .navbar-options li a.fa-MYP-Setup:before {
        content: "\f276";
        font-size: 28px;
        font-family: "Ionicons" !important;
        margin-top: -2px;
    }

    .navbar-nav .navbar-options li a.fa-MYP-Setup:after {
        content: "\f19d";
        font-size: 21px !important;
        top: 6px;
        left: 50%;
        z-index: 0;
        text-shadow: -2px 2px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-DistrictManagement:before {
        content: "\f3c5";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-DistrictManagement:after {
        content: "\f2f7";
        font-family: "Ionicons" !important;
        top: 3px;
        right: 17px;
        text-shadow: -2px 1px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-SchoolsManagement:before {
        content: "\f549";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-SchoolsManagement:after {
        content: "\f2f7";
        font-family: "Ionicons" !important;
        top: 3px;
        right: 17px;
        text-shadow: -2px 1px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-FileUploader:before {
        content: "\f574";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Learning-Managment:before {
        content: "\f5da";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Learning-Managment:after {
        content: "\f2f7";
        font-family: "Ionicons" !important;
        top: 3px;
        right: 17px;
        text-shadow: -2px 1px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-Content-Library:before {
        content: "\f139";
        font-family: "Ionicons" !important;
        font-size: 32px;
        margin-top: -4px;
        text-shadow: 0px -1px 0 #fff;
    }

    .navbar-nav .navbar-options li a.fa-Content-Library:after {
        content: "\f0c5";
        font-family: 'FontAwesome' !important;
        top: 6px;
        right: 24px;
        text-shadow: -2px 1px 0px #fff;
        transform: rotate(17deg);
        font-size: 24px;
        z-index: -1;
    }

    .navbar-nav .navbar-options li a.fa-Content-Library.selected:before {
        text-shadow: 1px -1px 0 #206e87;
        z-index: 4;
        position: relative;
    }

    .navbar-nav .navbar-options li a.fa-Content-Library:hover:before {
        text-shadow: 1px -1px 0 #206e87;
        transition: all 400ms ease-in-out;
    }

    .navbar-nav .navbar-options li a.fa-Seat-Availability-Waiting-List:hover:after,
    .navbar-nav .navbar-options li a.fa-Pending-Admissions:hover:after {
        background: #206e87;
    }

    .navbar-nav .navbar-options li a.fa-Seat-Availability-Waiting-List.selected:after,
    .navbar-nav .navbar-options li a.fa-Pending-Admissions.selected:after {
        background: #206e87;
    }

    .navbar-nav .navbar-options li a.fa-Lead-Support-Mgt:before {
        content: "\f508";
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Lead-Support-Mgt:after {
        content: "\f2f7";
        font-family: "Ionicons" !important;
        top: 3px;
        right: 17px;
        text-shadow: -2px 1px 0px #fff;
    }

    .navbar-nav .navbar-options li a.fa-Report-Card:before {
        content: "\f56c";
        font-size: 25px;
        font-family: 'FontAwesome' !important;
    }

    .navbar-nav .navbar-options li a.fa-Error-Log::after,
    .navbar-nav .navbar-options li a.fa-Error-Log::before {
        content: "\f15c";
        font-family: 'FontAwesome' !important;
        font-size: 23px;
        display: block;
        margin: auto;
        margin-bottom: auto;
        margin-bottom: 7px;
    }

    .navbar-nav .navbar-options li a.fa-Error-Log::after {
        content: "\f06a";
        top: 6px;
        right: 47px;
        text-shadow: 2px 1px 0px #fff;
        font-size: 17px;
    }

    .navbar-nav .navbar-options li .navbar-nav .navbar-options li a.fa-Error-Log:hover::after {
        text-shadow: 2px 1px 0px #fbaa2a !important;
    }

    .navbar-nav .navbar-options li a.fa-Ministry::after,
    .navbar-nav .navbar-options li a.fa-Ministry::before {
        content: "\f19c";
        font-family: 'FontAwesome' !important;
        font-size: 23px;
        display: block;
        margin: auto;
        margin-bottom: auto;
        margin-bottom: 7px;
    }

    .navbar-nav .navbar-options li a.fa-Ministry::after {
        content: "\f024";
        top: 7px;
        right: 27px;
        text-shadow: 1px 1px 0px #fff;
        font-size: 11px;
    }

    .navbar-nav .navbar-options li a.fa-Privilege::before {
        content: "\f502";
        font-family: 'FontAwesome' !important;
    }

    .navbar-right .navbar-options li a {
        /*white-space: nowrap;*/
        /*font-size: 11px;*/
    }

    .navbar-right .navbar-options li:nth-child(3n + 1) {
        clear: left;
    }

    .TitleWithButtons #buttons, .TitleWithButtons .buttons {
        display: flex;
    }

    .course-dashboard.row.coursepage.clearfix {
        margin: 25px 15px;
    }
    /*#ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin {
    border: 1px solid #115c7440;
    border-radius: 8px;
    padding: 15px 25px;
    margin-top: 15px;
}*/

    .noData-img-container {
        width: 100%;
    }

    /**************************** teacher SubMenu ****************************/
    .Main-submenu {
        border: 0px solid transparent;
        background: #fff;
        margin-top: 15px;
        border-top: 0px solid transparent;
        margin-left: 10px;
        margin-right: 10px;
        border-radius: 8px;
        margin-bottom: 15px;
    }

        .Main-submenu ul {
            padding: 0 4px;
            margin: 0;
        }

            .Main-submenu ul li {
                display: inline-block;
                position: relative;
                margin-left: -4px;
                font-size: var(--font-16, 16px);
            }

                .Main-submenu ul li a {
                    display: block;
                    padding: 5px 15px 9px;
                    min-width: 170px;
                    text-align: center;
                    position: relative;
                    color: #206e87;
                    font-weight: bold;
                }

                .Main-submenu ul li:before {
                    content: '';
                    display: block;
                    background: #aaa;
                    position: absolute;
                    width: 1px;
                    height: 70%;
                    right: 0;
                    top: 15%;
                }

    .course-dashboard {
        padding: 0 !important;
    }

    .fa-comments:before {
        content: "\f086";
        color: #fff;
    }

    .navbar-nav > li .fa-bell-alt:before {
        content: "\F0F3";
        color: #fff;
    }

    .fa-search:before {
        content: "\f002";
        color: #fff;
    }

    .fa-question-circle:before {
        content: "\f059";
        color: #fff;
    }

    .Main-submenu ul li a.active {
        background: #206e87;
        color: #fff !important;
        margin-top: -3px;
        border-top: 3px solid #206e87;
        padding: 5px 15px 9px;
        margin-left: -1px;
    }

        .Main-submenu ul li a.active:after,
        .Main-submenu ul li a.active:before {
            bottom: -11px;
            left: 50%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none;
        }

        .Main-submenu ul li a.active:after {
            border-color: rgba(136, 183, 213, 0);
            border-bottom-color: #fff;
            border-width: 7px;
            margin-left: -10px;
            display: none;
        }

        .Main-submenu ul li a.active:before {
            border-color: rgba(194, 225, 245, 0);
            border-bottom-color: #e0e0e0;
            border-width: 9px;
            margin-left: -12px;
            display: none;
        }

    .Main-submenu ul li a:hover {
        background: #2e95b7;
        color: #fff !important;
        border-top-color: #2e95b7;
    }

    .RadTabStripTop_RadTabStripSkin .rtsLevel .rtsLink.rtsSelected {
        background: #2e95b7;
    }

    .Main-submenu-container .page-title {
        margin: 9px 0 -11px;
    }

    .borser_section {
        padding: 15px 25px;
        border: 1px solid #206e87;
        border-radius: 8px;
    }
    /*.Main-submenu-container .BreadCrumb {
    border: none;
    padding: 0;
    margin: 0;
}*/
    .main-menu-icon {
        font-size: 20px;
        position: relative;
        line-height: 12px;
        top: 5px;
    }

        .main-menu-icon:before {
            content: "\F00A";
            background: #206e87;
            padding: 5px 6px 3px;
            color: #ffffff;
            font-size: 18px;
            margin-top: 3px;
            font-family: FontAwesome;
        }

        .main-menu-icon.fa-Transcript:before {
            content: "\F0F6";
            padding: 5px;
        }

    .multilines.Main-submenu ul {
        position: relative;
    }

        .multilines.Main-submenu ul li {
            border-bottom: 1px solid #ddd;
            margin-right: 4px;
            margin-left: 0px;
        }

            .multilines.Main-submenu ul li:before {
                right: -4px;
            }

            .multilines.Main-submenu ul li a.active:after,
            .multilines.Main-submenu ul li a.active:before {
                display: none;
            }

            .multilines.Main-submenu ul li a.active {
                box-shadow: 8px 0px 0px #206e87;
                margin-left: -4px;
                margin-right: 4px;
            }

            .multilines.Main-submenu ul li a:hover {
                box-shadow: 8px 0px 0px #206e87;
                margin-left: -4px;
                margin-right: 4px;
            }

            .multilines.Main-submenu ul li:hover {
                border-bottom-color: #fff;
            }

    /**************************** End Teacher SubMenu ****************************/
    .navbar-collapse .navbar-nav .notification,
    .navbar .navbar-nav .notification {
        position: absolute;
        background-color: #FB404B;
        text-align: center;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        -ms-border-radius: 10px;
        border-radius: 10px;
        min-width: 17px;
        padding: 0 6px;
        height: 17px;
        font-size: var(--font-12, 12px);
        color: #FFF;
        font-weight: bold;
        line-height: 17px;
        top: -11px;
        left: -5px;
    }

    .navbar .btn {
        margin: 15px 3px;
        font-size: var(--font-14, 14px);
    }

    .navbar .btn-simple {
        font-size: var(--font-16, 16px);
    }

    .navbar.fixed {
        width: calc(100% - $sidebar-width);
        right: 0;
        left: auto;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0px;
    }

.navbar-nav > li > .dropdown-list {
    /*border-radius: 10px;*/
    margin-top: 0;
    border-bottom: 4px solid #206e87;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -ms-border-radius: 0px;
    border-radius: 0px;
}

    .navbar .navbar-nav > li.userinfo {
        margin-left: 0;
        font-size: var(--font-16, 16px);
        padding: 5px 0px 0 5px;
        margin-right: 5px;
        max-width: 230px;
    }

    .userphoto {
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        width: 35px;
        height: 35px;
        overflow: hidden;
        margin-left: 12px;
        -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
        -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
        box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
        margin: 8px 3px 8px;
        position: relative;
        border: 2px solid #fff;
    }

    .eduwaveHeader .userphoto {
        margin-left: 8px;
        display: none;
    }

    .userphoto img {
        width: 100%;
    }

    .navbar .navbar-nav.navbar-Center > li > a {
        /*    padding: 7px 15px 5px 15px;*/
        /*    top: 3px;*/
        /*    margin: 0 1px;*/
        background: transparent;
        font-size: var(--font-16, 16px);
        height: 52px !important;
    }

        body > .navbar-collapse .nav > li > a:before,
        .navbar .navbar-nav.navbar-Center > li > a:before {
            font-family: 'FontAwesome' !important;
            font-size: 18px;
            display: block;
            margin: auto;
            margin-bottom: 5px;
            text-align: center;
        }

    .fa-dashboard:before {
        content: "\f0e4";
    }

    .fa-courses:before {
        content: "\f02d";
    }

    .fa-badges {
        height: 52px !important;
    }

    .navbar-nav.navbar-Center > li > a.fa-badges:before {
        content: '';
        background-image: url("../../images/Badges/points.png");
        width: 25px;
        height: 25px;
        display: block;
        background-size: 25px;
        position: absolute;
        bottom: 0;
        background-repeat: no-repeat;
        left: calc(50% - 12px);
        background-position: 0;
    }

    .fa-schedule:before {
        content: "\f073";
    }

    .fa-UserGuide:before {
        content: "\f05a";
    }

    .fa-settings::before,
    .fa-Administration::before {
        content: "\f013";
    }

    .navbar .navbar-nav.navbar-Center > li:first-child:after {
        display: none;
    }

    .navbar .navbar-nav.navbar-right > li > a {
        padding: 0;
        margin: 0 !important;
        top: 0 !important;
        left: 0 !important
    }

    .navbar .navbar-nav.navbar-right > li {
        padding: 10px 7px;
        margin-top: 5px;
        width: 45px;
        height: 45px;
        background-color: #116876;
        margin: 5px;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .navbar .navbar-nav.navbar-right > li:hover {
            background-color: #ffffff21;
            margin-top: 5px;
        }

    .navbar .navbar-nav.navbar-Center > li:last-child > a {
        border-right: none;
    }

    .navbar .navbar-nav.navbar-right > li > a.fa-question-circle {
        cursor: pointer;
    }

    .navbar .navbar-nav.navbar-right > li a.homeIcon {
        max-width: calc(45px / 2) !important;
    }

        .navbar .navbar-nav.navbar-right > li a.homeIcon:before {
            top: 0;
            right: -2px;
        }
    /*      Navbar with icons            */
    .navbar-icons.navbar .navbar-brand {
        margin-top: 12px;
        margin-bottom: 12px;
    }

    .navbar-icons .navbar-nav > li > a {
        text-align: center;
        padding: 6px 15px;
        margin: 6px 3px;
    }

    .navbar-icons .navbar-nav [class^="pe"] {
        font-size: 30px;
        position: relative;
    }


    .navbar-icons .navbar-nav p {
        margin: 3px 0 0;
    }

    .navbar-form {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

        .navbar-form .form-control {
            -webkit-border-radius: 0px;
            -moz-border-radius: 0px;
            -ms-border-radius: 0px;
            border-radius: 0px;
            border: 0;
            padding: 0;
            background-color: transparent;
            height: 22px;
            font-size: var(--font-16, 16px);
            line-height: 1.5;
            color: #E3E3E3;
        }

    .navbar-transparent .navbar-form .form-control,
    [class*="navbar-ct"] .navbar-form .form-control {
        color: #FFFFFF;
        border: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.6);
    }

    .navbar-nav > li > a {
        line-height: 15px;
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center {
        margin-left: 70px;
        margin-top: 0px;
        /*    margin-top: -35px;*/
    }

    .dropdown-toggle::after {
        display: none;
    }

    .btn-check:active + .btn-secondary, .btn-check:checked + .btn-secondary, .btn-secondary.active, .btn-secondary:active, .show > .btn-secondary.dropdown-toggle {
        color: #fff;
        background-color: #f4f5f6 !important;
        border-color: #f5f5f5;
    }

    .fa-badges {
        position: relative;
        top: 40px;
    }

    .BadgesPoints {
        display: flex;
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center li {
        /*    float: left;*/
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center .itg_dashboard_dropdown-menu .box-footer a i {
        margin-right: 5px;
        top: 0;
        font-size: 14px;
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center .itg_dashboard_dropdown-menu.box-footer {
        background: none;
        position: relative;
        margin: 0px -11px 0;
        display: block;
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center #ulCourses.itg_dashboard_dropdown-menu {
        margin-top: 65px;
    }

    .additional-navbar-center {
        margin-right: -70px;
    }

    .nav.navbar-nav.navbar-Center .dropdown {
        /*    position: absolute;
    top: -15px;*/
    }

    .btn-check:checked + .btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check) + .btn:active {
        background-color: #ffffff;
        border-color: #206e87;
    }

    .nav.navbar-nav.navbar-Center .dropdown .fa-courses.dropdown-toggle {
        position: absolute;
    }
    /**/
    .eduwaveHeader .itg_dashboard_dropdown-menu .box-footer a:hover,
    .eduwaveHeader .itg_dashboard_dropdown-menu .box-footer div:hover {
        border-color: #d4d4d4 !important;
    }

    .eduwaveHeader .navbar-Center .itg_dashboard_dropdown-menu .headerscroll {
        max-height: 230px;
    }

    .collapse.navbar-collapse.has-image .box-footer div,
    .eduwaveHeader .box-footer div {
        color: #206e87;
        font-size: var(--font-12, 12px);
        margin: 0 0 -11px;
        /******* overwrite power query page style ******/
        background: none;
        font-weight: normal;
        text-shadow: none;
        padding: 10px 12px;
        border-color: #ddd;
    }

    .collapse.navbar-collapse.has-image .box-footer a,
    .eduwaveHeader .box-footer a {
        color: #206e87;
        margin: 0;
        /* fix powerquery page issue */
        background: #eee;
        font-weight: normal;
        text-shadow: none;
        padding: 10px 20px;
        border-color: #ddd;
        border-left: 0;
        border-right: 0;
    }

    .eduwaveHeader .navbar-right .itg_dashboard_dropdown-menu .box-footer {
        background: none;
        position: relative;
        margin: 10px -1px -13px;
        display: block;
        padding: 2px;
        text-align: right;
        padding: 7px 10px;
        cursor: pointer;
    }

    .navbar-collapse .navbar-right .itg_dashboard_dropdown-menu a.selected,
    .eduwaveHeader .navbar-right .itg_dashboard_dropdown-menu a.selected {
        background: #35abbf;
        color: #fff;
        /*    padding: 18px;*/
        height: 80px;
    }

        .navbar-collapse .navbar-right .itg_dashboard_dropdown-menu a.selected:after,
        .eduwaveHeader .navbar-right .itg_dashboard_dropdown-menu a.selected:after {
            z-index: 2;
            color: #ffffff;
        }

    .navbar-nav .navbar-options li a:hover:after,
    .navbar-nav .navbar-options li a.selected:after {
        text-shadow: none;
        color: #fff !important;
        z-index: 9;
    }

    .navbar-right .navbar-options .hideitems {
        display: none;
    }

    /**** notification ***/
    .navbar-right .itg_dashboard_dropdown-menu .titlebar {
        background: #eee;
        color: #888;
        text-align: center;
        display: block !important;
    }

    .navbar-right .itg_dashboard_dropdown-menu .titlebar {
        background: #eee;
        color: #888;
        text-align: center;
        display: block !important;
        position: absolute;
        bottom: 0;
        z-index: 1;
        width: 100%;
    }

    .lstUsers tr tr {
        border-bottom: 1px solid #ddd;
    }

    .e31_notifications .notifbox li .CloseNotifi:before {
        color: #989595;
        content: "\f00d";
        font: normal normal normal 14px/1 FontAwesome;
    }

    .e31_notifications .notifbox li .CloseNotifi:before {
        display: block;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        font-size: 10px;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    .e31_notifications .notifbox li .CloseNotifi {
        display: block;
        float: none;
    }

    .e31_notifications .notifbox li .CloseNotifi {
        position: absolute;
        right: 10px;
        top: 22px;
        width: 10px;
        height: 10px;
        z-index: 1;
        cursor: pointer;
    }

    .e31_notifications .notifbox li .inbox_ShortDetails:after {
        color: #206e87;
        content: "\2709";
    }

    .e31_notifications .notifbox li {
        color: #666;
        text-align: left;
        background: #ffffff;
        /*border-bottom: 1px solid #ccc;*/
        position: relative;
    }

        .e31_notifications .notifbox li a {
            color: #206e87;
            padding: 13px;
            display: block;
            position: relative;
            font-size: var(--font-13, 13px);
            line-height: 1.5em;
        }

            .e31_notifications .notifbox li a [class^="fa"] {
                top: 0px;
                color: #206e87;
                font-size: 13px;
            }

    .notifbox span.NotifiTime {
        display: table;
        color: #777;
        font-size: 11px !important;
        padding-left: 20px;
    }

    .e31_notifications .notifbox li a:after {
        display: block;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        position: absolute;
        left: 9px;
        font-family: 'icomoon';
        speak: none;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        bottom: 10px;
        padding: 6px;
        font-size: 13px;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    .navbar-right .itg_dashboard_dropdown-menu .product-img {
        width: 40px !important;
        hieght: 40px !important;
        border-radius: 50%;
        overflow: hidden;
        margin: 5px;
    }

    .notificationRow i {
        color: #206e87 !important;
    }

    .lstUsers .notificationRow {
        color: #206e87;
    }

        .lstUsers .notificationRow .fa {
            color: #FBB342;
        }

    .lstUsers {
        padding: 0 10px !important;
        border-bottom: 1px solid #ccc;
        position: relative;
        text-align: left !important;
    }

    .eduwaveHeader .navbar-right .itg_dashboard_dropdown-menu a {
        color: #206e87;
        ;
    }

    /***************** search *************/
    .SearchsideBarContainer .dropdown {
        right: 7px;
        min-width: 67px;
        bottom: 6px;
        color: #555;
        margin: 0;
        position: absolute;
        /*height: 100%;*/
        top: 7px;
        background-color: #eee;
        padding: 6px 20px 3px 8px;
        /*border-radius: 0 5px 5px 0;*/
        min-width: 120px;
        /*box-shadow: 1px -1px 2px rgba(0, 0, 0, 0.1) inset;*/
        border-left: 1px solid #cccccc;
        font-size: 8px;
        text-align: center;
        height: 27px;
    }

        .SearchsideBarContainer .dropdown > a {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            width: 100%;
            display: block;
            text-align: center;
            vertical-align: middle;
            line-height: 27px;
        }

    .Search-dropdown {
        width: 300px;
        padding: 6px;
    }

        .Search-dropdown input {
            width: 100%;
            color: #777;
            height: 29px !important;
        }

    .SelectedItem::after {
        content: "";
        width: 0;
        height: 0;
        position: absolute;
        top: 10px;
        right: 7px;
        border-width: 5px;
        border-style: solid;
        border-color: #206e87 transparent transparent;
    }

    .navbar-right .Search-dropdown .submenu {
        background: #fff;
        position: absolute;
        top: 24px;
        right: 0;
        z-index: 100;
        width: 150px;
        display: none;
        padding: 0px 0px 5px;
        border-radius: 5px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
    }

    .navbar-right .Search-dropdown .root {
        list-style: none;
        margin: 0px;
        padding: 0px;
        font-size: var(--font-13, 13px);
        padding: 0 0 0 0px;
        border-top: 1px solid #dedede;
    }

    .navbar-right .Search-dropdown .dropdown li a {
        color: #555555;
        display: block;
        font-family: 'Cairo Regular';
        font-weight: bold;
        padding: 6px 10px;
        cursor: pointer;
        text-decoration: none;
        text-align: center;
    }

    .headerscroll {
        max-height: 300px;
    }

    /********************** course-chat-menu **************************/
    .course-chat-menu, .e31_InstantMessages, .e31_notifications, .lstUsers {
        max-width: 300px;
        width: 300px;
    }

    .navbar-right .course-chat-menu .products-list .product-img img {
        width: 40px;
        height: 40px;
        max-width: 40px;
    }

    .navbar-right .course-chat-menu .products-list .product-title {
        font-weight: normal;
        font-size: 12px;
    }

    .navbar-right .course-chat-menu .products-list .product-img .fa {
        font-size: 18px;
        padding: 11px;
    }

    .navbar-right .course-chat-menu .products-list .product-description {
        font-size: 11px;
    }

        .navbar-right .course-chat-menu .products-list .product-description .fa {
            font-size: 12px;
            top: 0;
            margin-right: 5px;
        }

    .navbar-right .course-chat-menu .products-list .product-img {
        margin: 0 5px;
    }

    .navbar-right .course-chat-menu .products-list > .item {
        padding: 10px 5px;
    }

    .navbar-right .course-chat-menu .products-list > .item {
        padding: 10px 5px;
        background: #e1f3ff;
        border-top: 1px solid #d8d8d8;
        border-bottom: none;
    }

    /************************************************/
    .navbar-Center .itg_dashboard_dropdown-menu {
        /*** set width and height to laoader container ****/
        min-height: 245px;
        min-width: 350px;
    }

    /************************************* Switch Profile **********************************************/
    .switch-profile-container {
        float: left;
        margin-top: 10px;
        position: relative;
        cursor: pointer;
        width: 30px;
        /* fix hizitad of header before window loaded*/
    }

    .switch-profile-icon {
        width: 30px;
        position: absolute;
        display: none;
    }

    .switch-profile-container:hover {
        background: transparent;
    }

    .switch-profile-container ul {
        padding: 0;
        margin: 0;
        list-style: none;
        z-index: 10000;
        /*aibrahim fix bug no #22149 7/5/2019*/
    }

        .switch-profile-container ul.level2 {
            white-space: nowrap;
            background: #fff;
            display: none;
            /* fix display of Ul befor window loaded*/
        }

    .has-popup.static {
        width: 30px;
        height: 30px;
        display: block;
    }

        .has-popup.static li:last-child a {
            border-bottom: none;
            /*border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;*/
        }

        .has-popup.static li a:first-child {
            /*border-top-left-radius: 5px;
  border-top-right-radius: 5px;*/
        }

        .has-popup.static li a {
            padding: 7px 12px;
            color: #555;
            display: block;
            border-bottom: 1px solid #e8e8e8;
            font-size: var(--font-12, 12px);
            background-color: #fff;
            padding: 10px;
            border-right: 0px solid #206e87;
        }

            .has-popup.static li a:hover {
                border-right: 3px solid #206e87;
                color: #206e87;
                border-radius: 8px;
            }

        .has-popup.static li:hover {
            opacity: 1;
        }

        .has-popup.static > ul {
            top: 100% !important;
            left: 0% !important;
            box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.125);
            border-bottom: 3px solid #206e87;
        }

            .has-popup.static > ul:before {
                border-bottom: 10px solid #FFFFFF;
                border-left: 8px solid transparent;
                border-right: 8px solid transparent;
                content: "";
                display: inline-block;
                position: absolute;
                left: 10px;
                top: -7px;
            }

    .nav-open .has-popup.static > ul:before {
        left: calc(50% - 8px);
    }

    @media (max-width: 470px) {
        .switch-profile-container {
            float: none !important;
            width: 100%;
            margin: 0px;
            padding: 5px;
        }

        .Main-submenu ul li {
            display: block;
            border: none;
            border-bottom: 1px solid #dddddd;
        }

            .Main-submenu ul li:before,
            .Main-submenu ul li a.active:before {
                display: none;
            }

        .switch-profile-container > div {
            float: none !important;
            width: 100%;
        }

        .switch-profile-container ul {
            width: 100% !important;
        }

        .has-popup.static {
            width: 100%;
        }

        .switch-profile-container > a {
            height: 0;
            display: block;
        }

        .switch-profile-icon {
            left: calc(50% - 15px);
        }

        .multilines.Main-submenu ul {
            padding: 0;
        }

            .multilines.Main-submenu ul li {
                display: block;
                margin: 0;
            }

                .multilines.Main-submenu ul li a:hover,
                .multilines.Main-submenu ul li a.active {
                    box-shadow: none;
                    margin-left: 0;
                    margin-right: 0;
                }
    }
    /****************** user menu icons ***************/
    a[id*="lbtnMyAccount"]:before {
        content: '\f007';
        font-family: 'FontAwesome' !important;
        font-size: 13px;
        display: inline-block;
        margin-right: 7px;
    }

    a[id*="lbtnLogout"]:before {
        content: '\f08b';
        font-family: 'FontAwesome' !important;
        font-size: 13px;
        display: inline-block;
        margin-right: 7px;
    }

    .eduwaveHeader .navbar-left .itg_dashboard_dropdown-menu a {
        color: #206e87;
    }

    /*********** Home page icon for HE header ***************/
    .lbtn-course-home {
        margin: 4px 9px 0;
    }

        .lbtn-course-home a:before {
            content: "\f015";
            font-family: FontAwesome !important;
            display: inline-block;
            margin: 0 5px;
            font-size: 20px;
        }

    /**************************** All User header styles *********************************/
    .settings-menu .item.active,
    .settings-menu .item:hover,
    .users-menu .item.active,
    .users-menu .item:hover,
    .Schedule-menu .item.active,
    .Schedule-menu .item:hover {
        color: #fff !important;
        background: #206e87;
        transition: all .3s;
    }

        .settings-menu .item:hover,
        .settings-menu .item.active:hover,
        .users-menu .item:hover,
        .users-menu .item.active:hover,
        .Schedule-menu .item:hover,
        .Schedule-menu .item.active:hover {
            background: #206e87;
            ;
        }

            .settings-menu .item.active i,
            .settings-menu .item:hover i,
            .users-menu .item.active i,
            .users-menu .item:hover i,
            .Schedule-menu .item.active i,
            .Schedule-menu .item:hover i {
                color: #fff !important;
                transition: all .3s;
            }

    .settings-menu .products-list .product-info,
    .users-menu .products-list .product-info,
    .Schedule-menu .products-list .product-info {
        margin-left: 30px;
        margin-top: 0;
        font-weight: normal;
        font-size: var(--font-14, 14px);
    }

    .settings-menu .products-list > .item,
    .users-menu .products-list > .item,
    .Schedule-menu .products-list > .item {
        color: #206e87;
        ;
        width: 100%;
        display: block;
        padding: 12px 15px;
    }

    .navbar .navbar-nav .settings-menu li a [class^="ionicons"] li a [class^="ionicons"],
    .navbar .navbar-nav .settings-menu li a [class^="ionicons"] li a [class^="fa"],
    .navbar .navbar-nav.navbar-Center .users-menu li a [class^="ionicons"],
    .navbar .navbar-nav.navbar-Center .users-menu li a [class^="fa"],
    .navbar .navbar-nav.navbar-Center .Schedule-menu li a [class^="ionicons"],
    .navbar .navbar-nav.navbar-Center .Schedule-menu li a [class^="fa"] {
        top: 5px;
        font-weight: normal;
        font-size: 17px;
        float: left;
    }

    .navbar .navbar-nav.navbar-Center .fa.ion-ios-people {
        top: 0 !important;
    }

    .navbar .navbar-nav.navbar-Center .users-menu li a [class^="ionicons"].ion-images {
        font-size: 20px !important;
    }

    .navbar-Center .itg_dashboard_dropdown-menu.settings-menu,
    .navbar-Center .itg_dashboard_dropdown-menu.users-menu,
    .navbar-Center .itg_dashboard_dropdown-menu.Schedule-menu {
        min-height: inherit;
        min-width: 290px;
        border-bottom: 1px solid #ddd;
    }

    .navbar-Center .itg_dashboard_dropdown-menu {
        min-height: 225px;
    }

    .settings-menu {
        width: 250px;
    }

    .navbar .navbar-nav .ion-ios-people::before {
        font-size: 20px;
    }

    .navbar .navbar-nav .ion-android-chat::before {
        font-size: 19px;
    }

    .navbar .navbar-nav .settings-menu li a [class^="ionicons"] {
        top: 4px;
        font-size: 19px;
    }

    .navbar-nav .navbar-options li a[class*="ionicons"]::before {
        font-family: "Ionicons" !important;
    }

    .eduwaveHeader .navbar-Center .itg_dashboard_dropdown-menu.users-menu .headerscroll {
        width: 100%;
    }

    /**************** Users menu *************/
    .users-menu i.fa-SchoolPrincipals:before {
        content: "\f508";
    }

    .users-menu i.fa-Curricula:before {
        content: "\f007";
        font-size: 19px;
        margin-right: -2px;
    }

    .users-menu i.fa-Curricula:after {
        content: "\f02d";
        text-shadow: -2px 2px 0px #fff;
        font-size: 14px;
    }

    .users-menu .fa-Exam-Corrector:before {
        content: "\f4fc";
        font-size: 16px;
        margin-right: -2px;
        font-family: 'FontAwesome' !important;
    }

    .users-menu i.fa-DistrictAdmin:before {
        content: "\f007";
        font-size: 16px;
        margin-right: -2px;
    }

    .users-menu .fa-DistrictAdmin:after {
        content: "\f3c5";
        text-shadow: -2px 2px 0px #fff;
        font-size: 12px;
    }

    .users-menu a:hover i.fa-DistrictAdmin::after,
    .users-menu a:hover i.fa-Curricula::after {
        text-shadow: -2px 2px 0px #206e87;
    }

    .users-menu .fa-Ministry-Admins:before {
        content: "\f508";
        font-size: 16px;
        margin-right: -2px;
    }

    .users-menu .fa-Ministry-Admins:after {
        content: "\f66f";
        text-shadow: -1px 0px 0px #fff;
        font-size: 12px;
        position: relative;
        top: -4px;
        right: -1px;
    }

    .users-menu .fa-Notification-Settings:before {
        content: "";
        font-size: 16px;
        margin-right: -2px;
    }

    .users-menu .fa-Notification-Settings::after {
        content: "\f013";
        text-shadow: -2px 1px 0px #fff;
        font-size: 12px;
        position: relative;
        top: -6px;
        right: 1px;
    }

    .users-menu a:hover i:after {
        transition: all .3s;
    }

    .users-menu a.active i:after {
        text-shadow: -2px 2px 0px #206e87;
    }

    .users-menu .headerscroll {
        max-height: inherit !important;
    }

    .users-menu a:hover i.fa-Notification-Settings::after {
        text-shadow: -2px 1px 0px #206e87;
    }

.footer {
    background: #f6f6f6;
    padding: 20px;
    text-align: center;
    color: #363232;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    border-top: 1px solid #c3c3c3;
    font-size: 13px;
}

        .footer a {
            color: #206e87;
/*            text-decoration: underline;*/
        }

            .footer a:hover {
                text-decoration: none;
            }

    /*@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic);*/
    /*#72afd2*/
    /*body {
    color: $primary-color;
}*/
    body {
        font-family: "DroidArabicNaskh", "open_sansregular", "Helvetica Neue", "Helvetica,Arial", sans-serif;
        min-height: 100vh;
        position: relative;
        display: block;
        color: #555;
        /*background-color: transparent !important; */
        /*for iframes body background like iframe body of bug #7477*/
        /*background-color: #e9ebee !important;*/
    }

    .bodywrapper {
        /*min-height: 100%;*/
        min-height: 100vh;
        padding-bottom: 60px;
        height: 100%;
        background-color: #f5f5f5;
    }

    .image {
        width: 100%;
        overflow: hidden;
        position: relative;
        -webkit-transform-style: preserve-3d;
        -moz-transform-style: preserve-3d;
        transform-style: preserve-3d;
        text-align: center;
    }

        .image img {
            width: 100%;
            max-width: 100%;
        }

    .icon-bg {
        padding: 10px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        background: #206e87;
        color: #fff;
        width: 40px;
        height: 40px;
        font-size: 20px;
    }

    .icon-bg-sm {
        padding: 7px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        color: #fff;
        width: 33px;
        height: 33px;
        font-size: 15px;
        /*padding-top: 10px;*/
    }

    .icon-bg-lg {
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        background: #4f99cd;
        color: #fff;
        font-size: 22px;
        padding-top: 11px;
        width: 45px;
        height: 45px;
    }

    .icon-bg-orang {
        background: #206e87;
    }

    .icon-bg-orang-light {
        background: #F6B750;
    }

    #ctl00_ctl00_cphPageBody_cphPageBody_ucCoursePeriodReportsLinks_New_ucCPMainStatistics_rvMainStatistics_ctl09_NonReportContent ul {
        width: 100%;
        overflow: hidden;
    }

    .box-paragraph.row {
        padding: 15px;
        border: 1px solid #000000 !important;
        border-radius: 8px;
    }

    .page-title-box .parghraph-header {
        padding: 13px 10px 14px;
        border-bottom: 1px solid #CFDAE1;
        color: #206e87;
        font-weight: 500;
        margin-top: 0;
    }

    .box-paragraph p {
        font-size: var(--font-15, 15px);
    }

    .text-online {
        color: #6fae14;
    }

    .text-virtual {
        color: #597a96;
    }

    .coursepage .box-header > .box-tools > *:last-child {
        padding-left: 0;
        padding-right: 5px;
    }

    /*  #itg_dashboard_scheduler{
    margin-bottom: -20px;
}*/
    #itg_dashboard_scheduler .k-event {
        background-color: #4f99cd !important;
    }

    #itg_dashboard_scheduler .k-icon.k-i-refresh {
        color: #fff;
    }

    .course-content-header {
        margin: 0;
        padding: 12px 0;
    }

    .Course-sorting {
        margin: 0;
        padding: 10px 0 10px;
    }

    .k-scheduler-calendar,
    .k-scheduler-calendar .k-content {
        width: 300px !important;
    }

    .MarginWrapper .OptionsContextMenu {
        margin-top: -25px;
    }

    .eduwaveWrapper .MarginWrapper .OptionsContextMenu {
        margin-top: 0;
    }

    .eduwaveWrapper {
        background-color: #fff;
        border: 0px solid #ddd;
        margin: 10px 11px 50px;
        padding: 5px 10px 10px;
        border-radius: 8px;
    }

        .eduwaveWrapper:before, .eduwaveWrapper:after {
            clear: both;
            content: "";
            display: block;
        }

    .MarginWrapper {
        margin: -30px;
        background: #f5f5f5;
    }

    .box.box-widget.collapsed-box .box-header {
        border: none;
    }

    /*.k-scheduler .k-scheduler-times,
.k-scheduler .k-scheduler-content {
    height: auto !important;
}*/
    .btn-disable {
        /* for disabled Logo*/
        cursor: not-allowed;
        pointer-events: none;
        color: #c0c0c0;
        background-color: #ffffff;
    }

    .input-group-btn > .btn {
        height: 34px !important;
        /*aibrahim fix bug #7158 17-10-2017*/
        padding: 6px 12px !important;
    }

    .blue-header {
        background: #206e87;
        color: #fff;
    }

        .blue-header .img-circle i {
            background: #fff !important;
            color: #206e87 !important;
        }

        .blue-header .box-tools .btn-box-tool {
            color: #fff !important;
            border: 2px solid rgba(255, 255, 255, 0.4) !important;
            transition: all .3s ease-in-out;
            -webkit-transition: all .3s ease-in-out;
        }

        .blue-header .widget-title, .blue-header .widget-description, .blue-header .box-tools .btn-box-tool {
            color: #fff !important;
        }

            .blue-header .box-tools .btn-box-tool i {
                color: rgba(255, 255, 255, 0.4) !important;
                transition: all .3s ease-in-out;
                -webkit-transition: all .3s ease-in-out;
            }

            .blue-header .box-tools .btn-box-tool:hover {
                border: 2px solid white !important;
            }

                .blue-header .box-tools .btn-box-tool:hover i {
                    color: white !important;
                }

    .orang-header {
        background: #FFB43B;
        color: #fff;
    }

        .orang-header .img-circle i {
            background: #fff !important;
            color: #FFB43B !important;
        }

        .orang-header .box-tools .btn-box-tool {
            color: #fff !important;
            border: 2px solid rgba(255, 255, 255, 0.4) !important;
            transition: all .3s ease-in-out;
            -webkit-transition: all .3s ease-in-out;
        }

        .orang-header .widget-title, .orang-header .widget-description, .orang-header .box-tools .btn-box-tool {
            color: #fff !important;
        }

            .orang-header .box-tools .btn-box-tool i {
                color: rgba(255, 255, 255, 0.4) !important;
                transition: all .3s ease-in-out;
                -webkit-transition: all .3s ease-in-out;
            }

            .orang-header .box-tools .btn-box-tool:hover {
                border: 2px solid white !important;
            }

                .orang-header .box-tools .btn-box-tool:hover i {
                    color: white !important;
                }

    .course-myschedule-Widget .box-header, .coursesWidget .box-header {
        background: #206e87;
        color: #fff;
    }

        .course-myschedule-Widget .box-header .img-circle i, .coursesWidget .box-header .img-circle i {
            background: #fff !important;
            color: #206e87 !important;
        }

        .course-myschedule-Widget .box-header .box-tools .btn-box-tool, .coursesWidget .box-header .box-tools .btn-box-tool {
            color: #fff !important;
            border: 2px solid rgba(255, 255, 255, 0.4) !important;
            transition: all .3s ease-in-out;
            -webkit-transition: all .3s ease-in-out;
        }

        .course-myschedule-Widget .box-header .widget-title, .course-myschedule-Widget .box-header .widget-description, .course-myschedule-Widget .box-header .box-tools .btn-box-tool, .coursesWidget .box-header .widget-title, .coursesWidget .box-header .widget-description, .coursesWidget .box-header .box-tools .btn-box-tool {
            color: #fff !important;
        }

            .course-myschedule-Widget .box-header .box-tools .btn-box-tool i, .coursesWidget .box-header .box-tools .btn-box-tool i {
                color: rgba(255, 255, 255, 0.4) !important;
                transition: all .3s ease-in-out;
                -webkit-transition: all .3s ease-in-out;
            }

            .course-myschedule-Widget .box-header .box-tools .btn-box-tool:hover, .coursesWidget .box-header .box-tools .btn-box-tool:hover {
                border: 2px solid white !important;
            }

                .course-myschedule-Widget .box-header .box-tools .btn-box-tool:hover i, .coursesWidget .box-header .box-tools .btn-box-tool:hover i {
                    color: white !important;
                }

    .course-myschedule-Widget .box-header {
        background: #FFB43B;
    }

        .course-myschedule-Widget .box-header .img-circle i {
            background: #fff !important;
            color: #FFB43B !important;
        }

    .StudyCourseLink.item:hover {
        background: #eee;
        cursor: pointer;
        padding: 10px;
        margin: 0 -10px;
    }

    .mCSB_scrollTools .mCSB_draggerContainer {
        left: 1px !important;
    }

    .mCSB_scrollTools.mCSB_scrollTools_vertical {
        width: 6px !important;
    }

    .mCSB_scrollTools {
        opacity: .55 !important;
    }

    .mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
        background-color: rgba(0, 0, 0, 0.75) !important;
    }

    .coursepeople .box-body {
        max-height: 450px;
    }

    #accordion.course_gradebook,
    .course_gradebook_container {
        height: 300px;
    }

    .courseposts .postsMainContainer > div {
        width: 100% !important;
    }

    /******* BreadCrumb and pagetitle ********/
    /*.BreadCrumb {
    padding: 3px 13px 5px;
    background-color: #fff;
    margin: 12px 16px 0;
    margin: 12px 16px 10px;
    border: 1px solid #ddd;
}*/
    .bread-crumb-links {
        padding: 3px 5px 0 0;
        display: inline-block;
        color: #777;
        font-size: 18px;
    }

        .bread-crumb-links.active {
            color: #344054;
            font-size: 18px;
            font-weight: bold;
        }

    /*.bread-crumb-links:after {
    font-family: FontAwesome !important;
    content: "\F105";
    font-size: 17px;
    margin-left: 9px;
}

.bread-crumb-links:last-child:after {
    display: none;
}*/
    /****************** new page title *******************/
    .page-title-container {
        float: right;
        padding-left: 0;
    }

    .BreadCrumb {
        width: 100%;
        /*padding: 0;
  margin: 0;
  background: none;
  padding-top: 7px;
  margin-top: 10px;*/
        /*border: none;
  border-top: 1px solid #ddd;*/
    }

    #LearningObjectFolderingWidget {
        /*    margin: 0 15px;*/
    }

    .box.box-widget.LearningObjectFolderingWidget {
        border: 1px solid #115c7457;
    }
    /*.coursepagecontent {
    width: 98%;
}*/
    .courseleftSide.clearfix {
        margin: 20px 15px !important;
    }

    .page-title-container {
        padding: 0 0px !important;
    }

    .page-title {
        padding: 5px 10px 0;
        background: #fff;
        border: 1px solid #ddd;
        margin: 20px 0px 15px;
        border-radius: 8px;
        border: 1px solid #115c7440;
    }

    #LearningObjectFolderingWidget {
        /*    margin: 0;*/
    }

    .coursepagecontent {
        margin-top: 0 !important;
    }

    .row.removeRowMargin {
        /*    margin: 0 !important;*/
        --bs-gutter-x: 0;
        --bs-gutter-y: 0;
    }

    input[type="button"] {
        width: auto !important;
    }

    .coursepagecontent {
        margin: 0px 0 0 28px;
    }

    .CourseColumnContent {
        /*    margin: 0 30px;*/
    }

    .title-header {
        margin: 0;
        color: #206e87;
    }

    .page-title-container.col-md-12 {
        float: none;
        padding-left: 15px;
    }

    /****************** end new page title *******************/
    @media (max-width: 460px) {
        .users-list > li {
            width: 47.5%;
        }

        #ulCourses .box-footer .btn {
            display: block;
        }

        .page-title-container {
            float: none;
            padding-left: 15px;
        }
    }
    /*************************** Side drage qwidget ******************************************/
    .side-drag-widget .box-header .img-circle .fa {
        color: #206e87 !important;
        font-size: 13px !important;
        padding: 3px !important;
        border-radius: 3px;
        width: 18px;
        height: 18px;
        background: #fff;
    }

    .side-drag-widget .latestPostsWidget .box-header .img-circle .fa, .side-drag-widget .course-myschedule-Widget .box-header .img-circle .fa, .side-drag-widget .coursesWidget .box-header .img-circle .fa {
        color: #206e87 !important;
    }

    .side-drag-widget .course-myschedule-Widget .box-header .img-circle .fa {
        color: #FFB43B !important;
    }

    .side-drag-widget .courseGradebookWidget .box-body {
        display: none !important;
    }

    /*********************************** Effects *************************************************/
    /**** Opreations Actions alertes ****/
    .StatusBarError, .StatusBarSuccess {
        bottom: 50px;
        position: fixed;
        text-align: center;
        width: 500px !important;
        left: 50%;
        margin-left: -250px;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        -ms-border-radius: 3px;
        border-radius: 3px;
        z-index: 17;
        background-color: #F56954;
        -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
        -moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
        box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
        color: #ffffff;
        font-size: var(--font-14, 14px);
        padding: 10px !important;
        /*display: none !important;*/
    }

        .StatusBarError i, .StatusBarSuccess i {
            margin-right: 10px;
        }

    .StatusBarSuccess {
        background-color: #4DC28E !important;
    }

    /************ Loader overlay *************/
    /*.itg_loading_overlay {
        position: fixed;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.6);
        text-align: center;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        z-index: 1000000;
        display: none;
    }*/

    /******** loader ******/
    /*.itg_loader {
        border: 11px solid #f3f3f3;*/
        /* Light grey */
        /*border-top: 11px solid #206e87;*/
        /* Blue */
        /*border-radius: 50%;
        width: 90px;
        height: 90px;
        animation: spin 2s linear infinite;
        position: absolute;
        left: 45%;
        top: 42%;
    }*/

    @keyframes spin {
        0% {
            transform: rotate(0deg);
        }

        100% {
            transform: rotate(360deg);
        }
    }

    .eduwaveHeader .navbar-Center .itg_loader {
        width: 50px;
        height: 50px;
        border-width: 6px;
        top: 50%;
        margin-top: -30px;
    }

    .navbar-Center .navbar-options.course-list {
        min-height: 200px;
    }

    /****************************** Controls Style  *************************************/
    .TitleBarContentDiv div[style*="overflow"] .TabelGrid td {
        /*aibrahim 4/12/2019 fix bug no #33575*/
        position: inherit !important;
    }

    .TitleBarContentDiv, .ContainerDIV {
        border: 1px solid #206e87;
        font-size: var(--font-13, 13px);
        padding: 10px;
        margin-bottom: 10px !important;
    }

    .TitleBarContentDiv {
        margin-top: -10px !important;
    }

        .TitleBarContentDiv .ContainerDIV {
            border: none;
            padding: 0px;
            margin-bottom: 0px !important;
            box-shadow: none;
        }

    .ContainerDIV .TitleBarContentDiv .ContainerDIV > div {
        overflow-y: visible !important;
    }

    .TitleBarDiv {
        background-color: #206e87;
        padding: 5px 10px;
        font-size: var(--font-13, 13px);
        color: #ffffff;
        cursor: pointer;
        margin-bottom: 10px;
    }

        .TitleBarDiv::before {
            position: relative;
            top: 1px;
            display: inline-block;
            font-family: FontAwesome !important;
            font-style: normal;
            font-weight: normal;
            line-height: 1;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            content: "\f107";
            font-size: 16px;
        }

    /*----- Telerik ComboBox ------*/
    .RadComboBox {
        margin-bottom: 10px;
    }

        .RadComboBox .rcbInputCell .rcbInput {
            /*---- R5 Mod2 -----*/
            PADDING-LEFT: 2px !important;
            background-color: none;
            border: 1px solid #dfd7d7;
            background-color: #ffffff;
            line-height: 17px;
            display: inline-block;
        }

    #BorderTableWideTop .mCSB_scrollTools.mCSB_3_scrollbar.mCS-dark.mCSB_scrollTools_vertical {
        opacity: 0 !important;
    }

    .RadComboBox .rcbArrowCell:after {
        position: relative;
        top: 1px;
        display: inline-block;
        font-family: FontAwesome !important;
        font-style: normal;
        font-weight: normal;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        position: absolute;
        content: "\f0d7";
        right: 90%;
        margin-right: -5px;
        text-indent: 0;
        top: 9px;
        font-size: 12px;
        color: #c1baba;
    }

    .eduwaveWrapper {
        margin: 10px 11px 50px;
        padding: 5px 10px 10px;
    }

    .RadComboBox .rcbArrowCell a {
        position: absolute !important;
    }

    #tblMainTable .RadComboBox .rcbArrowCell a {
        position: relative !important;
        border-color: transparent;
    }
    /*.rcbArrowCellLeft a {
    position: initial !important;
}*/
    /*.RadComboBox_Default {
    width: 272px !important;
}*/
    /*---- Disabled drop down -------*/
    .RadComboBox_Default .rcbDisabled td.rcbArrowCellRight {
        /*------ R5 Mod3 ------*/
        cursor: default;
        /*display: block;*/
        font-size: 0;
        height: 22px;
        line-height: 1px;
        outline: 0 none;
        overflow: hidden;
        position: relative;
        text-decoration: none;
        text-indent: 9999px;
        width: 22px;
        border-width: 1px;
        border-style: solid;
        border-color: #005c90;
        background-color: #206e87;
    }

    /*.RadComboBox .rcbInputCell .rcbInput {
    text-shadow: 1px 1px #0a6ea6 !important;
}*/
    .RadComboBox .rcbReadOnly .rcbInputCellLeft {
        background: none;
    }

    .RadComboBox .rcbInputCell .rcbInput:focus {
        /*---- R5 Mod2 -----*/
        color: black !important;
        border: 1px solid #206e87;
        background-color: #ffffff;
    }

    /*.RadComboBox_Default .rcbInputCellLeft,*/
    .RadComboBox_Default .rcbInput {
        color: black;
        border: 1px solid #206e87;
        background-color: #ffffff;
        line-height: 16px;
        width: 100%;
    }

    .RadComboBox_Default .rcbInputCellRight {
        /*aibrahim fix bug #10404 25-2-2018*/
        cursor: default;
        display: table-cell;
        font-size: 0;
        height: 22px !important;
        line-height: 1px;
        outline: 0 none;
        overflow: hidden;
        position: relative;
        text-decoration: none;
        /*text-indent: -9999px;*/
        width: 22px;
        border-width: 1px;
        border-style: solid;
        border-color: #005c90;
    }

    .RadComboBox_Default .rcbArrowCellLeft {
        background: none;
    }

    .RadComboBox .rcbDisabled .rcbReadOnly .rcbArrowCellRight,
    .RadComboBox_Default .rcbArrowCellLeft,
    .RadComboBox_Default .rcbArrowCellRight,
    .RadComboBox .rcbArrowCell a {
        /*aibrahim fix bug #10404 25-2-2018*/
        cursor: default;
        display: table-cell;
        font-size: 0;
        height: 22px;
        line-height: 1px;
        outline: 0 none;
        overflow: hidden;
        position: relative;
        text-decoration: none;
        text-indent: -9999px;
        width: 22px !important;
        border-width: 1px;
        border-style: solid;
        z-index: 10px;
        border-color: #005c90;
        z-index: 2;
        /*aibrahim fix bug #6024 17-10-2017*/
    }

    .RadComboBox_Default .rcbInputCell,
    .RadComboBox_Default .rcbArrowCell {
        border-color: transparent !important;
        background: transparent !important;
    }

    .RadComboBox .rcbReadOnly .rcbInputCellLeft {
        padding: 0;
    }

    .RadComboBox table {
        position: relative;
    }

        .RadComboBox table td.rcbArrowCell {
            padding: 0;
            border-width: 0;
            position: absolute;
            left: 5px;
            top: 5px;
        }

            .RadComboBox table td.rcbArrowCell a {
                background-image: none !important;
                border: 0;
                /*            font-size: 9px !important;
            overflow: visible !important;
            z-index: 999 !important;
            position: relative;
            text-indent: 9999px;
            display: inline !important;*/
            }
        /*            .RadComboBox table td.rcbArrowCell a:before {
                content: "ttt ";
                font-size: 9px !important;
                overflow: visible !important;
                z-index: 999 !important;
                position: relative;
                text-indent: 9999px;
            }*/
        .RadComboBox table td.rcbInputCell,
        .RadComboBox_Default .rcbInputCellRight {
            /*aibrahim fix bug #10404 25-2-2018*/
            BACKGROUND: #fff !important;
            /*---- R5 Mod2 -----*/
            padding: 0 !important;
        }

    /*---- Disabled drop down -------*/
    .RadComboBox_Default .rcbDisabled .rcbInputCellLeft {
        /*------ R5 Mod3 ------*/
        background: #eee;
        padding: 0;
    }

    .RadComboBox .rcbDisabled .rcbInputCell .rcbInput {
        /*---- R5 Mod3 -----*/
        color: #999 !important;
        border: 0;
        background: #eee;
        border: 1px solid #cccccc;
        width: 100%;
        margin-top: -1px;
        line-height: 19px;
    }

    .RadComboBox .rcbDisabled .rcbArrowCell a {
        border: none;
    }

    .RadComboBox_Default .rcbDisabled .rcbArrowCellRight {
        background: none;
    }

    /*----- End Telerik ComboBox ------*/
    input[type="submit"], input[type="button"] {
        padding: 0px 40px;
        height: 40px;
        -webkit-transition: background-color 0.5s ease-in-out;
        -moz-transition: background-color 0.5s ease-in-out;
        -ms-transition: background-color 0.5s ease-in-out;
        -o-transition: background-color 0.5s ease-in-out;
        transition: background-color 0.5s ease-in-out;
        background-color: #206e87;
        color: #ffffff;
        border: 0 none;
        cursor: pointer;
        outline: 0;
        margin-bottom: 5px;
        font-size: var(--font-14, 14px);
        -webkit-border-radius: 8px;
        -moz-border-radius: 8px;
        -ms-border-radius: 8px;
        border-radius: 8px;
        margin: 1px;
        /* aibrahim fix bug #5855,#5863,#5864  24/9/2017 */
        background: var(--secondary-color);
    }

        input[type="submit"]:hover, input[type="button"]:hover {
            color: #ffffff;
        }

    .input-group-btn:first-child > .btn {
        margin: 0;
    }

    .btn.btn-primary:hover, input[type="submit"]:hover, input[type="button"]:hover,
    .btn.btn-primary:focus, input[type="submit"]:focus, input[type="button"]:focus {
        color: #ffffff;
        text-decoration: none;
    }

    input[type="text"]:focus, input[type="password"]:focus {
        border-color: #50aff1;
    }

    .jqTransformRadio:hover {
        border-color: #005c90 !important;
    }

    .jqTransformRadio:before {
        background-color: #206e87 !important;
    }

    input [type="text"], input[type="password"] {
        padding: 2px;
        border: 1px solid #D0D5DD;
        border-top-color: #D0D5DD;
        border-right-color: #D0D5DD;
        border-bottom-color: #D0D5DD;
        border-left-color: #D0D5DD;
        -webkit-transition: border-color 0.5s ease-in-out;
        -moz-transition: border-color 0.5s ease-in-out;
        -ms-transition: border-color 0.5s ease-in-out;
        -o-transition: border-color 0.5s ease-in-out;
        transition: border-color 0.5s ease-in-out;
        border-radius: 5px;
        height: 30px;
    }

    input {
        border-radius: 5px;
        height: 35px;
        /*    width: 100% !important;*/
        border: 1px solid #ddd;
        box-shadow: 0 0 0 0 transparent;
    }


        input[disabled="disabled"], input[type="button"][disabled="disabled"] {
            cursor: not-allowed !important;
            filter: alpha(opacity=65);
            opacity: .65;
        }

        input[type="file"]:focus {
            border-color: #2ab1ff;
        }

        input[type="file"] {
            border: 1px solid #cccccc;
            padding: 2px;
        }

    textarea {
        padding: 2px;
        border: 1px solid #cccccc;
        -webkit-transition: border-color 0.5s ease-in-out;
        -moz-transition: border-color 0.5s ease-in-out;
        -ms-transition: border-color 0.5s ease-in-out;
        -o-transition: border-color 0.5s ease-in-out;
        transition: border-color 0.5s ease-in-out;
        height: 100px;
        width: 300px;
        max-width: 100%;
        /*aibrahim fix bug #22549 24-3-2019*/
        min-width: 100px;
    }

    /********************/
    .TabelGrid {
        margin-bottom: 20px;
        min-width: 100%;
        /* for small tables from  the old design 24/4/2018*/
    }

        .TabelGrid tr td {
            /*border: 0 none;*/
            border-bottom: 1px solid #d7d7d7;
            border-right: 1px solid #d7d7d7;
            padding: 2px 10px;
            font-size: var(--font-13, 13px);
            border-color: #d7d7d7;
            position: relative;
            vertical-align: top;
        }

        .TabelGrid th {
            font-weight: normal;
        }

    /*.TabelGrid th a:hover{
    text-decoration: underline;
}*/
    .WideGridContainer {
        overflow-x: auto;
        padding-bottom: 20px;
        /*for x-scroll insde like grades table*/
    }

        .WideGridContainer .TabelGrid tr td {
            /*position: inherit;*/
            /*Commented to fix bug no 16677*/
        }

    .WideGrid {
        max-width: 100%;
        max-height: fit-content;
        overflow: auto;
        padding-bottom: 20px;
        display: block;
        /*for x-scroll insde like grades table*/
    }

    .divQuestionsTypes {
        display: flex;
    }

        .divQuestionsTypes label {
            position: relative;
            top: -3px;
        }

    .border_section .ddlQuestionBankContainer {
        width: auto !important;
    }

    .border_section .ddlQuestionBankContainer {
        width: auto !important;
    }

    .WideGrid table {
        width: 100%;
        table-layout: fixed;
        word-wrap: break-word;
    }

    .WideGrid .TabelGrid tr td {
        position: inherit;
    }

    .horizontalWideGrid .WideGrid {
        max-height: inherit;
    }

    /*.TabelGrid > tbody > tr > td:first-child {
    border-left: 0;
}*/
    .TabelGrid tr:nth-child(2n+1) {
        background-color: #f7f7f7 !important;
    }

    .TabelGrid > tbody > tr > th {
        background-color: #206e87 !important;
        /*14-2-2019 adding "!important" to fix bug No 22016 */
        color: #fff;
        font-size: var(--font-13, 13px);
        padding: 5px 10px;
        border: 1px solid #C7C7C7;
    }

    .TabelGrid tr th a {
        color: #fff;
        font-weight: normal;
    }

    .TabelGrid .GridPagination td {
        padding: 0;
        /*border: 0 none;*/
    }

    .TabelGrid td, .TabelGrid th {
        text-align: left;
        padding: 5px 10px;
    }

    .TabelGrid table td, .TabelGrid table th {
        border: 0;
        padding: 0;
    }

    .TabelGrid table tr:nth-child(2n+1) {
        background-color: transparent !important;
    }

    .ui-widget-content {
        padding: 0;
    }

    .DialogDesc {
        padding: 10px;
    }

    /*.TabelGrid tr [id*="btnOptions"]:before {
    content: "\f013";
    font-family: FontAwesome !important;
    color: #206e87 ;
    cursor: pointer;
    text-indent: 0;
    position: absolute;
    top: 0;
    right: 0;
    
}
.TabelGrid tr [id*="btnOptions"] {
    text-indent: -99999px;
    display: block;
    position: relative;
    width: 20px;
    margin: auto;
    
}*/
    /******************/
    .GridPagination a {
        color: #ffffff;
        display: inline-block;
        padding: 3px 9px;
        background-color: #206e87;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        -ms-border-radius: 3px;
        border-radius: 3px;
        margin: 3px;
    }

    .GridPagination span {
        color: #ffffff;
        display: inline-block;
        padding: 3px 9px;
        background-color: #d7d7d7;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        -ms-border-radius: 3px;
        border-radius: 3px;
        margin: 3px;
    }

    .GridPagination td td {
        border: none !important;
        padding: 0 !important;
    }

    .GridPagination td {
        /*border-bottom: none !important;
  border: none;*/
        padding: 2px 3px !important;
        border-top: 1px solid #ccc;
        vertical-align: middle !Important;
    }

    .bread-crumb-links .TitleWithButtons.float-end {
        background-color: #fff;
        color: #206e87;
        border: 1px solid #206e87;
    }

    .roundedRBContainer td {
        display: inline-block;
        width: fit-content;
        box-sizing: border-box;
        margin-bottom: 11px;
    }
    /*#ctl00_cphPageBody_divAddResource td{
    position: inherit ;
}*/

    .rtsLevel.rtsLevel1 {
        margin-top: 10px;
    }
    /****************************/
    .HelpImg::before {
        position: relative;
        top: 0px;
        display: inline-block;
        font-family: FontAwesome !important;
        font-style: normal;
        font-weight: normal;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        content: "\f05a";
        font-size: 23px;
        color: #949494;
        left: 0px;
        /*margin-right: 5px;*/
        margin: 0 5px;
    }

    /********************** label and text style *************************/
    .labelsStyle {
        /*font-size: 13px;*/
        /*disabled because validation star going down */
        font-size: var(--font-14, 14px);
        display: inline-block;
        margin-bottom: 10px;
        /*    color: #206e87;*/
        font-weight: normal;
    }

    .TextValueStyle {
        font-size: var(--font-13, 13px);
        display: inline-block;
        margin-bottom: 10px;
        color: #787878;
    }

    /*form.jqtransformdone label {
    color: #616f77;
    font-weight: normal;
}*/
    /*******************************************/
    .SearchDIV {
        background: #fff;
        padding-bottom: 15px;
        position: relative;
        padding: 10px 20px;
        margin: 20px 0px;
        /*    border: 1px solid #ddd;*/
    }

    /*****************  TitleWithButtons *********************/
    .TitleStyle,
    .TitleWithButtons {
        padding-bottom: 8px;
        border-bottom: 1px solid #bdbdbd;
        margin-bottom: 15px;
    }

        .TitleWithButtons:before,
        .TitleWithButtons:after {
            content: '';
            display: block;
            clear: both;
        }

        .TitleWithButtons #buttons,
        .TitleWithButtons .buttons {
            float: right;
        }

        .TitleStyle,
        .TitleWithButtons .TitleStyle {
            font-size: var(--font-16, 16px);
            font-weight: 700;
            color: #344054;
            display: block;
        }

        .TitleWithButtons .TitleStyle {
            border-bottom: 0;
            padding-bottom: 0;
            margin-bottom: 0;
            float: left;
        }

    .currentPageNav, .currentPageNav a {
        color: #555;
    }


    #btnMdlCommunicationTemplate_Close {
        height: 40px;
    }

    .userSmallInfo {
        padding: 10px;
        font-size: var(--font-14, 14px);
        margin-bottom: 30px;
        border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        line-height: 1.4em;
        background-color: #f7f7f7;
        border-left: 3px solid #cbcbcb;
    }

    /************************* OptionsContextMenu ********************************/
    .OptionsContextMenu {
        list-style: none;
        display: none;
        /*padding: 5px;*/
        position: absolute;
        z-index: 2;
        background: #fff;
        border-radius: 4px;
        -webkit-box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.125);
        box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.125);
        padding: 0;
        border: 1px solid #d8d8d8;
    }

    .TitleWithButtons .buttons .OptionsContextMenu {
        right: 0;
    }

    .OptionsContextMenu a {
        font-size: var(--font-12, 12px);
        padding: 5px 10px;
        /*max-width: 200px;*/
        /* white-space issue with long words*/
        max-width: 280px;
        display: block;
        white-space: nowrap;
        border-bottom: 1px #e0e0e0 solid;
        color: #888;
        /*min-width: 200px;*/
    }

    .OptionsContextMenu li a:hover {
        background: #e2f5ff;
        border-bottom-color: #c0e2f4;
    }

    .OptionsContextMenu li a:link {
        color: #206e87 !important;
    }

    .OptionMenuScroll {
        padding-bottom: 70px;
    }

    #mdlExitingBadges .modal-header .close {
        position: absolute;
        left: 17px;
        background-color: transparent;
        border: 0;
        font-size: 30px;
        top: -4px;
    }

    .filterDiv .radio-input-container.active {
        background-color: #206e87 !important;
    }

    .filterDiv .radio-input-container {
        color: #206e87 !important;
    }

    .modal-header .close {
        position: absolute;
        left: 17px;
        background-color: transparent;
        border: 0;
        font-size: 30px;
        top: -4px;
    }

    #mdlCommunicationTemplate .modal-header .close {
        position: absolute;
        left: 17px;
        background-color: transparent;
        border: 0;
        font-size: 30px;
        top: -4px;
    }

    #mdlBadgeCreator .FileUploaderStyle > div {
        width: 70px !important;
        left: 20px;
    }
    /************************ Notification-modal **********************/
    .Notification-modal {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;
        z-index: 10004;
        background: Black;
        opacity: .40;
    }

    .Notification-position-MiddleCenter {
        position: fixed;
        left: 50%;
        margin-left: -140px;
        margin-top: -40px;
        top: 50%;
        z-index: 10005;
        width: 320px;
    }

    .Notification-item-wrapper {
        min-height: 80px;
        min-width: 400px;
        padding: 20px;
        background: #fff;
        border: 2px solid #999;
    }

    .Notification-item {
        padding-top: 20px;
        padding-bottom: 40px;
        padding-left: 6px;
        padding-right: 6px;
        font-size: var(--font-14, 14px);
        display: block;
        position: relative;
        margin: 0;
        min-height: 20px;
        min-width: 375px;
        color: #555;
        background: #fff;
        opacity: 0.9;
    }

    .Notification-item-image {
        width: 32px;
        height: 32px;
        position: absolute;
        top: 50%;
        margin-top: -30px;
        left: 0;
    }

        .Notification-item-image:before {
            content: "\f071";
            top: 0px;
            display: inline-block;
            font-family: FontAwesome !important;
            font-size: 32px;
            color: #206e87;
            margin-right: 5px;
            position: absolute;
            top: -35px;
            right: 11rem;
            left: auto;
        }

    .Notification-item-btnNoContainer {
        position: absolute;
        right: 25%;
        top: 80%;
        right: 47%;
        margin-top: -10px;
    }

    .Notification-item-btnYesContainer {
        position: absolute;
        top: 80%;
        left: 32%;
        margin-top: -10px;
    }

    .Notification-item-close {
        width: 22px;
        height: 22px;
        position: absolute;
        top: -10px !important;
        right: 8px !important;
        background-position: top;
        cursor: pointer;
    }

        .Notification-item-close:before {
            content: "\f00d";
            font-family: FontAwesome !important;
            display: block;
            font-size: 14px;
            font-weight: 700;
            opacity: .5;
            color: #333;
            /*background: #333;*/
            border-radius: 50%;
            height: 20px;
            width: 20px;
            text-align: center;
            font-weight: normal;
        }

    .Notification-item p {
        text-align: center;
        margin: 0 50px;
    }

    /************************************* Notification *************************************/
    .Notification-container {
        width: 320px;
        z-index: 10005;
    }

    * html .Notification-container {
        position: absolute;
    }

    .Notification-item {
        padding-top: 20px;
        padding-bottom: 40px;
        padding-left: 6px;
        padding-right: 6px;
        font-size: 14px;
        display: block;
        position: relative;
        margin: 0;
        min-height: 20px;
        min-width: 375px;
    }

    .Notification-item-wrapper {
        min-height: 80px;
        min-width: 400px;
        padding: 20px;
        border-radius: 8px;
        padding: 37px 0 !important;
    }

    .Notification-item p {
        text-align: center;
        margin: 0 50px;
    }

    .Notification-item-btnYesContainer {
        /*BY KKHELAWY @21.09.2012*/
        position: absolute;
        top: 80%;
        left: 56%;
        margin-top: -10px;
    }

    .Notification-item-btnNoContainer {
        /*BY KKHELAWY @21.09.2012*/
        position: absolute;
        right: 25%;
        top: 80%;
        right: 50%;
        margin-top: -10px;
    }

    .Notification-item-btnOkContainer {
        /*BY KKHELAWY @21.09.2012*/
        position: absolute;
        right: 42%;
        top: 80%;
        margin-top: -10px;
    }

    .Notification-item-button {
        /*BY KKHELAWY @21.09.2012*/
        width: 65px;
        height: inherit !important;
    }

    .Notification-item-image {
        width: 32px;
        height: 32px;
        position: absolute;
        top: 50%;
        margin-top: -30px;
        left: 0;
    }

    /**
 * Notification types
 *
 * pattern: Notification-type-[value]
 * where 'value' is the real value of the plugin option 'type'
 *
 */
    /**
 * positions
 *
 * pattern: Notification-position-[value]
 * where 'value' is the real value of the plugin option 'position'
 *
 */
    .Notification-position-TopLeft {
        position: fixed;
        left: 20px;
        top: 20px;
    }

    .Notification-position-TopCenter {
        position: fixed;
        top: 20px;
        left: 50%;
        margin-left: -140px;
    }

    .Notification-position-TopRight {
        position: fixed;
        top: 135px;
        right: 20px;
    }

    .Notification-position-MiddleLeft {
        position: fixed;
        left: 20px;
        top: 50%;
        margin-top: -40px;
    }

    .Notification-position-MiddleCenter {
        position: fixed;
        left: 50%;
        margin-left: -140px;
        margin-top: -40px;
        top: 50%;
        z-index: 10005;
    }

    .Notification-position-MiddleRight {
        position: fixed;
        right: 20px;
        margin-left: -140px;
        margin-top: -40px;
        top: 50%;
        z-index: 10005;
    }

    .Notification-modal {
        /*BY KKHELAWY @21.09.2012*/
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;
        z-index: 10004;
    }

    /***********************BEGIN::For Status Bar Notification BY KKhelawy @29.11.2012::****************************/
    .StatusBarWrapper {
        position: fixed;
        bottom: 15px !important;
        right: 0px;
        z-index: 9998;
        height: auto !important;
        /*width: 100%;*/
        display: none;
        padding-right: 40px !important;
    }

    .StatusBarContent {
        position: relative;
        z-index: 9999;
        height: auto !important;
        width: 100%;
        text-align: center;
        /*top: 6px !important;*/
        font-weight: normal;
        font-size: 14px;
        color: #fff !important;
    }

    .StatusBarClose {
        width: 22px;
        height: 22px;
        position: absolute;
        z-index: 9999;
        top: 11px !important;
        right: 9px;
        cursor: pointer;
    }

        .StatusBarClose:before {
            content: "\f00d";
            font-family: FontAwesome !important;
            color: #fff;
            display: block;
            font-size: 14px;
            font-weight: 700;
            opacity: .5;
            color: #333;
            border-radius: 50%;
            height: 20px;
            width: 20px;
            font-weight: normal;
        }

    .StatusBarNotice .StatusBarClose {
        background-position: left;
    }

        .StatusBarNotice .StatusBarClose:hover {
            background-position: center;
        }

        .StatusBarNotice .StatusBarClose:active {
            background-position: right;
        }

    .StatusBarSuccess .StatusBarClose {
        background-position: left;
    }

        .StatusBarSuccess .StatusBarClose:hover {
            background-position: center;
        }

        .StatusBarSuccess .StatusBarClose:active {
            background-position: right;
        }

    .StatusBarWarning .StatusBarClose {
        background-position: left;
    }

        .StatusBarWarning .StatusBarClose:hover {
            background-position: center;
        }

        .StatusBarWarning .StatusBarClose:active {
            background-position: right;
        }

    .StatusBarError .StatusBarClose {
        background-position: left;
    }

        .StatusBarError .StatusBarClose:hover {
            background-position: center;
        }

        .StatusBarError .StatusBarClose:active {
            background-position: right;
        }

    /***********************END::For Status Bar Notification BY KKhelawy @29.11.2012::****************************/
    .RadComboBoxDropDown_Default .rcbHovered, .RadComboBoxDropDown_Default .rcbCheckAllItemsHovered {
        color: #fff !important;
        background-color: #206e87 !important;
    }

    /******************************** OverMaskDialog **********************************/
    #contentContainer {
        padding: 15px;
    }

    #divPopupDialogContent  {
        /*aibrahim remove styles of"#divPopupDialogContent" fix bug #7483 7-11-2017*/
    }

        #divPopupDialogContent .OverMaskDialog {
            position: absolute !important;
            /*aibrahim fix bug #5948 1-11-2017*/
        }

    #itg_dashboard_VoiceComand + #divPopupDialogContent .OverMaskDialog:not(.ui-draggable):not([style*="top"]) {
        top: 100px !important;
    }

    div[id$="_UCBooks_dvLearningPlanPopUp"].OverMaskDialog {
        top: 150px !important;
    }

    .OverMaskDialog {
        display: none;
        position: fixed;
        width: 500px;
        height: auto;
        min-height: 300px;
        top: 30%;
        left: 50%;
        margin-left: -190px;
        padding: 0px;
        z-index: 10003;
        text-align: left;
        word-wrap: break-word;
    }

    .OverMaskDialog {
        background-color: #fff;
        box-shadow: none;
        color: #555555;
        font-size: 14px;
    }

        .OverMaskDialog .align_right a {
            display: inline-block;
            white-space: nowrap;
            overflow: hidden;
            position: relative;
            font-weight: normal;
            color: #206e87;
            width: 35px;
            /*aibrahim fix bug no 48216*/
        }

            .OverMaskDialog .align_right a:after {
                font-family: 'FontAwesome' !important;
                content: "\f00d";
                font-size: 17px;
                position: absolute;
                top: 2px;
                right: 10px;
                color: #fff;
                text-indent: 0;
                z-index: 1;
            }

        .OverMaskDialog iframe {
            /*aibrahim fix bug #6005 16-10-2017*/
            width: 100% !important;
            min-height: calc(100% - 20px) !important;
        }

    .web_dialog_overlay {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        height: 100%;
        width: 100%;
        margin: 0;
        padding: 0;
        z-index: 10002;
        display: none;
    }

    .web_dialog_overlay {
        background: Black;
        opacity: .40;
        filter: alpha(opacity=40);
        -moz-opacity: .40;
    }

    .DialogTitle {
        padding: 4px;
        font-weight: bold;
        text-align: left;
    }

    .align_right {
        padding: 4px;
        color: White;
        font-weight: bold;
        text-align: right;
    }

        .align_right a {
            color: #fff;
        }

    .DialogTitle, .align_right {
        background: #206e87;
        color: #fff;
        padding: 0px 7px 2px;
        line-height: 23px;
        vertical-align: middle;
    }

    /***********************  Jqyuary ui tolltip style ****************************/
    .ui-tooltip, .arrow:after {
        background: black;
        /*border: 2px solid white;*/
    }

    .ui-tooltip {
        padding: 5px 10px;
        color: white;
        border-radius: 4px;
        text-transform: uppercase;
        /*box-shadow: 0 0 7px black;*/
        position: absolute;
        font-size: var(--font-12, 12px) !important;
        z-index: 10000;
        /*for courses menu tooltip*/
        background: rgba(0, 0, 0, 0.8) !important;
        color: #fff !important;
    }

    .arrow {
        width: 70px;
        height: 16px;
        overflow: hidden;
        position: absolute;
        left: 50%;
        margin-left: -35px;
        bottom: -16px;
    }

        .arrow.top {
            top: -16px;
            bottom: auto;
        }

        .arrow.left {
            left: 20%;
        }

    .ui-tooltip:after {
        content: "";
        position: absolute;
        left: 6px;
        top: -5px;
        /*width: 10px;
  height: 10px;
  box-shadow: 6px 5px 9px -9px black;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);*/
        /*background: #000;*/
        /*background: rgba(0,0,0,.85);*/
        border-bottom: 5px solid rgba(0, 0, 0, 0.8);
        border-right: 5px solid transparent;
        border-left: 5px solid transparent;
        display: none;
    }

    .arrow.top:after {
        bottom: -20px;
        top: auto;
    }

    /*****************************  multimedialibrary *******************************/
    .eduwaveWrapper .eduwaveWrapper {
        margin: 0;
        border: 0;
        padding: 0;
    }

    .videoContainer {
        border-radius: 0;
        padding: 10px;
        overflow: hidden;
        margin-bottom: 30px;
        position: relative;
        max-width: 95%;
        margin: 0 auto;
        box-sizing: border-box;
        background: #f1f1f1;
        /*overflow-x: auto;*/
    }

    .VideoUserName {
        margin-top: 15px;
    }

    .videoDescription {
        padding: 2px 2%;
        width: 100%;
        font-size: var(--font-12, 12px);
        background: #206e87;
        color: #fff;
        display: block !important;
    }

    .UserUploader .videoDescription {
        background: none;
    }

    .videoDescription span {
        display: block !important;
        text-overflow: ellipsis;
        width: 100%;
        overflow: hidden;
        white-space: nowrap;
    }

    .UserUploader .videoDescription span {
        text-overflow: inherit;
        overflow: visible;
        white-space: inherit;
    }

    .videoDescription .videoDuration:before {
        content: "\f017";
        font-family: fontAwesome;
        color: #fff !important;
        display: inline-block;
        margin: 0 3px;
    }

    .videoContainer a img {
        max-width: 100%;
        max-height: 100%;
        min-width: 100%;
        min-height: 100%;
    }

    .videoContainer a {
        display: block;
        /*float: left;*/
        position: relative;
        overflow: hidden;
        margin: 10px;
        text-align: center;
        /*width: 135px;
  height: 135px;*/
        overflow: hidden;
        border: 4px solid #fff;
        box-shadow: 0px 0px 3px RGBA(144, 144, 144, 0.84);
        border-radius: 4px;
        min-width: 180px;
    }

    .LastVideos {
        width: 24.3%;
        margin-left: .5%;
        margin-bottom: .7%;
        float: left;
        position: relative;
    }

    .LastVideo {
        width: 49.7%;
        margin-right: .5%;
        float: left;
        position: relative;
    }

        .LastVideo .videoImage {
            height: 333px;
        }

    .videoImage {
        width: 100%;
        height: 130px;
        /*    padding-right: 10px;
      margin-right: 10px;*/
    }

    .videoContainer div a:first-child {
        margin-left: 0px;
    }

    .videoContainer a .PlayIcons:before {
        content: "\f04b";
        width: 50px;
        height: 50px;
        font-family: fontAwesome;
        position: absolute;
        top: calc(50% - 45px);
        left: calc(50% - 20px);
        font-size: 17px;
        color: #fff;
        line-height: 45px;
        opacity: .9;
        box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5);
        border-radius: 50%;
        border: 2px solid #fff;
        padding: 0 13px;
        background: rgba(0, 0, 0, 0.5);
        transform: scale(5);
        opacity: 0;
        transition: .5s ease-in;
    }

    .videoContainer a:hover .PlayIcons:before {
        transform: scale(1);
        opacity: 1;
    }

    .videoContainer div {
        display: table-cell;
    }

    .VideoSearchContent {
        display: table;
        margin: auto;
    }

        .VideoSearchContent input {
            display: table-cell;
            height: 30px !important;
            border-color: #e3e3e3;
            padding: 6px 12px;
            border-radius: 0;
            margin-bottom: 0;
        }

    .VideoSearchButtons {
        display: table-cell;
    }

        .VideoSearchButtons input:before {
            content: "\f002";
            display: block;
            font-family: fontAwesome;
            padding: 4px 7px;
            background-color: #206e87;
            color: #fff;
        }

    .VideoSearchContent > input {
        min-width: 360px;
    }

    .VideoSearch + table .TitleStyle {
        max-width: 95% !important;
    }

    .comment {
        padding: 8px;
        margin: 0 0 15px 45px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        font-size: var(--font-12, 12px);
        position: relative;
        z-index: 1;
    }

    .commentCont {
        clear: both;
    }

    .comment .commenterName {
        font-size: var(--font-12, 12px);
        font-weight: bold;
        margin-bottom: 10px;
        display: block;
        color: #555;
    }

    .comment ul.commentControls {
        list-style: none;
        display: block;
        position: absolute;
        right: 20px;
        top: 8px;
    }

        .comment ul.commentControls li {
            float: left;
            margin-left: 10px;
        }

    .comentsContainer {
        width: 700px !important;
        /* margin: 0 auto; */
    }

    .LeaveReplay:after {
        content: '';
        clear: both;
        display: block;
    }

    .comentsContainer td, .comentsContainer th, .commentCon table {
        border: 0;
    }

    .CommentArrow {
        /* border: 7px solid;
   border-color: transparent rgb(255, 255, 255) transparent transparent;
   position: absolute;
   right: 1px;
   top: 8px;
   width: 0;
   height: 0;
   z-index: 2;*/
    }

    .SingleVideoPage .comment:before {
        border-right: 9px solid rgba(0, 0, 0, 0.2);
        border-left: 11px solid transparent;
        border-top: 7px solid transparent;
        border-bottom: 7px solid transparent;
        content: "";
        display: inline-block;
        position: absolute;
        left: -21px;
        top: 8px;
    }

    .SingleVideoPage .comment:after {
        border-right: 10px solid #FFFFFF;
        border-left: 7px solid transparent;
        border-top: 7px solid transparent;
        border-bottom: 7px solid transparent;
        content: "";
        display: inline-block;
        position: absolute;
        left: -16px;
        top: 8px;
    }

    .comments .commentCon .commenterImg {
        float: left;
        /*background: url(../../images/Blog/c_arrow.png) no-repeat center right;*/
        padding-right: 12px !important;
        position: relative;
        z-index: 2;
    }

    .commentCon {
        padding: 10px 0 0;
        color: #888;
    }

    .VideoContent {
        width: 80%;
        margin: 0 auto 20px;
    }

    .UserUploader {
        padding: 10px;
        position: relative;
        clear: both;
        background-color: #206e87;
        color: #fff;
    }

    .VideoContent .UserUploader {
        padding: 10px 15px;
    }

        .VideoContent .UserUploader h3 {
            margin: 0;
            margin-bottom: 8px;
            font-size: var(--font-18, 18px);
            font-weight: bold;
            background: #206e87;
            padding: 3px;
        }

    .VideoAutherImage {
        float: left;
        margin: 2px 5px 10px 0;
        border-radius: 50%;
        border: 3px solid #fff;
    }

    .VideoRate {
        position: absolute;
        top: 10px;
        right: 10px;
        padding: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        background-color: #fff;
        color: #555;
        box-shadow: 1px 2px 1px #0a6497;
    }

    .clearBoth {
        clear: both;
    }

    .SingleVideoPage {
        background-color: #f1f1f1;
    }

        .SingleVideoPage .comments {
            margin: 0 20px;
            width: 700px;
            margin: 0 auto;
        }

    .SingleVideoPage {
        padding: 20px 0;
        max-width: 75%;
        margin: 0 auto;
    }

        .SingleVideoPage .defaultFloatDiv {
            float: none !important;
            display: inline-block;
        }

    .commentControls a.CommentsDate {
        text-indent: 100%;
        position: relative;
        white-space: nowrap;
        overflow: hidden;
        display: inline-block;
        width: 20px;
    }

        .commentControls a.CommentsDate:before {
            font-family: FontAwesome !important;
            content: "\f014";
            font-size: 15px;
            display: inline-block;
            color: #ea4242;
            text-indent: 0;
            position: absolute;
            left: 3px;
            top: -1px;
        }

    .SingleRelatedVideos .videoCon {
        display: inline-block;
    }

    .videoContainer .othervideos {
        margin: auto;
        text-align: center;
        display: block;
    }

    .videoContainer .SingleRelatedVideos {
        display: inline-block;
    }

    .NextArrow .ArrowStyle {
        margin-left: 16px;
    }

    .NextArrow .ArrowStyle {
        border-color: transparent transparent transparent #fff;
    }

    .ArrowStyle {
        border-style: solid;
        border-width: 8px;
        margin: 10px 5px;
        width: 0;
        height: 0;
        display: block !important;
    }

    .ArrowStyle {
        border-color: transparent #fff transparent transparent;
    }

    .NextArrow {
        right: 0px;
    }

    .PrevArrow, .NextArrow {
        height: 35px;
        width: 35px;
        overflow: hidden;
        cursor: pointer;
        position: absolute;
        top: 53%;
        margin-top: -30px;
        z-index: 2;
    }

    .NextArrow {
        box-shadow: -1px 0px 2px rgba(62, 62, 62, 0.34);
    }

    .PrevArrow, .NextArrow {
        background: #f4a42a;
    }

    .PrevArrow {
        box-shadow: 2px 0px 2px rgba(62, 62, 62, 0.34);
    }

    .PrevArrow {
        left: 0px;
        background-position: 12px 0;
    }

    /******************************** Search Page ***********************************/
    .searchAriaCon .submenu {
        background: #fff;
        border: 1px solid #eee;
        /*padding: 15px;*/
        display: none;
        position: absolute;
        min-width: 150px;
        z-index: 1000;
    }

        .searchAriaCon .submenu ul {
            list-style: none;
            margin: 0;
            padding: 0;
        }

            .searchAriaCon .submenu ul li a {
                display: block;
                font-weight: bold;
                padding: 6px 10px;
                cursor: pointer;
                text-decoration: none;
                font-size: var(--font-12, 12px);
                font-weight: normal;
            }

    .searchAriaCon .dropdown {
        display: table-cell;
        background: #206e87;
        padding: 3px;
        height: 30px;
    }

        .searchAriaCon .dropdown > a {
            color: #fff;
            font-size: 11px;
        }

    .searchAriaCon .SearchArea, .searchAriaCon .dropdown, .searchAriaCon .Searchbtn {
        display: table-cell !important;
        vertical-align: top;
    }

        .searchAriaCon .dropdown,
        .searchAriaCon .Searchbtn input {
            padding: 4px 7px;
            background-color: #206e87;
            color: #fff;
            height: 30px;
            border-radius: 0;
            margin-bottom: 0;
        }

    /*.searchAriaCon .dropdown{
    margin-right: 1px;
    display: inline-block !important;
    top: -1px;
    min-width: 130px;
        padding-bottom: 27px;
}

.searchAriaCon .dropdown > a{
    outline: 1px solid #206e87 ;
    outline-offset: 7px;
    padding-right: 16px;
    width: 100%;
    display: inline-block;
}

.searchAriaCon .dropdown > a:after{
    border-color: #fff transparent transparent;
    top: 12px;
}*/
    .searchAriaCon .dropdown {
        margin-right: 1px;
        display: inline-block !important;
        /*top: -1px;*/
        min-width: 130px;
        position: relative;
        padding: 0;
    }

        .searchAriaCon .dropdown > a {
            outline: 1px solid #206e87;
            /*outline-offset: 7px;*/
            padding-right: 16px;
            width: 100%;
            display: inline-block;
            line-height: 21px;
            position: relative;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            vertical-align: middle;
            padding: 4px 7px;
            padding-bottom: 5px;
            padding-right: 15px;
        }

            .searchAriaCon .dropdown > a:focus {
                border: 0;
                outline: 1px solid #206e87 !important;
            }

            .searchAriaCon .dropdown > a:after {
                border-color: #fff transparent transparent;
                top: 12px;
            }

    .searchAriaCon .Searchbtn input {
        height: 32px !important;
        margin-top: -1px;
    }

    .searchAriaCon .SearchArea input {
        height: 32px;
        border-color: #e3e3e3;
        padding: 5px 7px;
        border-right: 0;
        min-width: 300px;
    }

    .searchresultitem:nth-child(odd) {
        padding: 15px;
        border: 1px solid #ddd;
        background: #f8f8f8;
    }

    .searchresultitem:nth-child(even) {
        padding: 15px;
        border-left: 1px solid #ddd;
        border-right: 1px solid #ddd;
        background: #fff;
    }

    .searchresultitem .searchresulttitle {
        font-size: var(--font-14, 14px);
        display: inline-block;
        margin-top: 0;
    }

    .badge-orange {
        background-color: #ff9a00;
        color: #ffffff;
    }

    .badge-gray, .badge-red, .badge-orange, .badge-blue, .badge-green {
        padding: 1px 7px;
        margin: 0 10px;
    }

    .searchresultcontent {
        display: block;
    }

    .searchSummary {
        /*ul li a:last-child {
      border-bottom:none;
  }*/
    }

        .searchSummary .ContainerDIV {
            padding: 0px;
        }

        .searchSummary .labelsStyle {
            background: #206e87;
            display: block;
            margin: 0;
            padding: 7px;
            color: #fff;
        }

        .searchSummary ul {
            padding: 0;
            margin: 0;
            min-height: 100px;
        }

            .searchSummary ul li a {
                padding: 7px;
                display: block;
                border-bottom: 1px solid #e8e8e8;
            }

                .searchSummary ul li a:hover {
                    background: #eee;
                }

        .searchSummary br {
            display: none;
        }

    /*.searc .dropdown {
    right: 6px;
    min-width: 67px;
    bottom: 6px;

    color: #555;
    margin: 0;
    position: absolute;
    height: 100%;
    top: 5px;
    background-color: #eee;
    padding: 6px 20px 3px 8px;
    border-radius: 0 5px 5px 0;
    min-width: 120px;
    box-shadow: 1px -1px 2px rgba(0, 0, 0, 0.1) inset;
    border-left: 1px solid #cccccc;
    font-size: 8px;
    text-align: center;
}


.Search-dropdown {
    width: 300px;
    padding: 6px;
}

.Search-dropdown input{
    width: 100%;
    color: #777;
}

.SelectedItem::after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    top: 10px;
    right: 7px;
    border-width: 5px;
    border-style: solid;
    border-color: #0077bb transparent transparent;
}

.Search-dropdown .submenu {
    background: #fff;
    position: absolute;
    top: 24px;
    right: 0;
    z-index: 100;
    width: 150px;
    display: none;
    padding: 0px 0px 5px;
    border-radius: 5px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45);
}

.Search-dropdown .root {
    list-style: none;
    margin: 0px;
    padding: 0px;
    font-size: 13px;
    padding: 0 0 0 0px;
    border-top: 1px solid #dedede;
}

.Search-dropdown .dropdown li a {
    color: #555555;
    display: block;
    font-family: arial;
    font-weight: bold;
    padding: 6px 10px;
    cursor: pointer;
    text-decoration: none;
}*/
    /************************** BEGIN LMS Styles BY KKhelawy @26.03.2013 ************************************/
    .contentPreviewIcons {
        width: 28px;
        height: 30px;
    }

    .LMCTocArrows {
        width: 26px;
        height: 31px;
        padding-bottom: 3px;
    }

    .LMSTOCImg {
        BACKGROUND: url(../../images/ContentPreview/TOC.png) no-repeat;
    }

    .LMSReleatedArticlesImg {
        BACKGROUND: url(../../images/ContentPreview/RelatedArt.png) no-repeat;
    }

    .LMSLearningMaterialsImg {
        BACKGROUND: url(../../images/ContentPreview/Enrichment.png) no-repeat;
    }

    .LMSEduPediaImg {
        BACKGROUND: url(../../images/ContentPreview/Thesaurus.png) no-repeat;
    }

    .LMSAddNotesImg {
        BACKGROUND: url(../../images/ContentPreview/AddToolTip.png) no-repeat;
    }

    .LMSModifyNotesImg {
        BACKGROUND: url(../../images/ContentPreview/ModifyToolTip.png) no-repeat;
    }

    .PlagiarismCheckerImage {
        BACKGROUND: url(../../images/ContentPreview/Plagiarism_Checker_icon.png) no-repeat;
    }

    .LMSEduKitImg {
        BACKGROUND: url(../../images/ContentPreview/EduKitIcon.png) no-repeat;
    }

    .LMSPreviousPageImg {
        BACKGROUND: url(../../images/ContentPreview/PreviousPage.png) no-repeat;
    }

    .LMSNextPageImg {
        BACKGROUND: url(../../images/ContentPreview/NextPage.png) no-repeat;
    }

    .LMSBackImg {
        BACKGROUND: url(../../images/ContentPreview/Back.png) no-repeat;
    }

    .LMSMoveUpImg {
        BACKGROUND: url(../../images/ContentPreview/ArrowUpButton.jpg) no-repeat;
    }

    .LMSMoveDownImg {
        BACKGROUND: url(../../images/ContentPreview/ArrowDownButton.jpg) no-repeat;
    }

    /*.HelpImg  
{
    background:  url(../../images/All/Help_icon.png) no-repeat;
    width:23px; 
    height:21px;
}*/
    .instructionPopup {
        top: 0;
        left: 0;
        z-index: 500;
        cursor: default;
        position: absolute;
        font: menutext;
        width: 215px;
        background-color: #ffffcc;
        font-size: var(--font-12, 12px);
        padding: 10px;
        word-wrap: break-word;
    }

    div#ctl00_ctl00_cphPageBody_cphPageBody__ucLearningObjectFolderingWidget_divInstructionPopupLanguage.instructionPopup {
        margin: 0 240px;
    }

    .AssessmentStage #divTFContainer .assessTrOrFa span {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .LMSZoomImg {
        BACKGROUND: url(../../images/ContentPreview/Zoom.png) no-repeat;
    }
    /*
.LMSSizeExtraLarag {
    BACKGROUND: url(../../images/ContentPreview/ExtraLarg.png) no-repeat;
    width: 48px;
    height: 48px;
}

.LMSSizeLarag {
    BACKGROUND: url(../../images/ContentPreview/Larg.png) no-repeat;
    width: 32px;
    height: 32px;
}

.LMSSizeNormal {
    BACKGROUND: url(../../images/ContentPreview/Normal.png) no-repeat;
    width: 24px;
    height: 24px;
}

.LMSSizeSmall {
    BACKGROUND: url(../../images/ContentPreview/Small.png) no-repeat;
    width: 16px;
    height: 16px;
}
*/
    .ContainerDIV {
        background: #ffffff;
        /*border: 1px #eee solid;*/
        border: 0px #86c4e8 solid;
        box-shadow: 1px 1px 3px #ccc;
    }

    [id$="pnlMenu"] .ContainerDIV {
        padding: 5px !important;
    }

    .NotificationList {
        display: block;
        position: absolute;
        width: 150px;
        top: 25px;
        padding: 10px;
        font-weight: normal;
        background: #fff;
        border: 1px #dfdfdf solid;
        color: #555;
    }

    .notificationTopArrow {
        background: url(../../images/All_Ar/notification_topArrow.png) no-repeat;
        position: absolute;
        width: 18px;
        height: 10px;
        background-position: top center;
        left: 0px;
        top: -10px;
    }

    .MaterialsHeader {
        width: 200px;
        background-color: #2C9AD9;
        color: white;
        text-align: center;
        border: 1px solid white;
        padding: 5px;
    }

    .LearningMaterialsHeader {
        background-color: #A2A2A2;
        color: white;
        border: 1px solid white;
        padding: 5px;
    }

    /***************************  END LMS Styles BY KKhelawy @26.03.2013  ************************************/
    .itglightbox {
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
        filter: alpha(opacity=80);
        -moz-opacity: 0.8;
        -khtml-opacity: 0.8;
        width: 100%;
        position: absolute;
        z-index: 999;
        /*opacity: 0.8;*/
        /*height: auto;*/
        /*background-color: #fff;*/
        height: 100%;
        top: 0;
        background: RGBA(51, 51, 51, 0.65);
        color: #fff;
    }

    /********************************* Overwrite on jquery.ui.chatbox.css ************************************/
    .modal-header {
        background: #206e87 !important;
    }

    .box-header .box-tools .btn-box-tool {
        /*color: #fbb23f !important;*/
        color: #ccc !important;
        /*overwrite jquery.ui.chatbox.css*/
        display: inline-block;
        padding: 4px 4px !important;
        font-size: 10px !important;
        /*border: 2px solid #fbb23f !important;*/
        border: 2px solid #ccc !important;
        border-radius: 50% !important;
        height: 19px !important;
        width: 19px;
        vertical-align: middle;
        line-height: 0 !important;
    }

        .box-header .box-tools .btn-box-tool i:before {
            color: #ccc !important;
            top: 0px;
            left: 1px;
        }

    .col-md-8.content.coursepagecontent {
        padding-top: 0 !important;
        background-color: transparent;
    }

    .box-header .box-tools .btn-box-tool .fa.fa-times {
        margin-top: -2px;
    }

    .box-header .box-tools .btn-box-tool .fa-minus {
        line-height: 8px;
    }

    /*.btn {
    padding: 6px 12px !important;
}*/
    .btn-default {
        background-color: #f4f5f6 !important;
    }

        .btn-default:hover,
        .btn-default:active,
        .btn-default:foucs {
            background-color: #d7dfe7 !important;
        }

    .postsMainContainer .writePostWarper .form-control,
    .latestPostsWidget .writePostWarper .form-control {
        padding: 11px 12px !important;
    }

    .btn.btn-flat {
        border-width: 1px !important;
    }

    .Filter-bar .btn-flat {
        padding: 4px 7px !important;
    }

    .html-tamplet-content .form-control[multiple=""],
    textarea.form-control {
        height: auto !important;
    }

    .form-control.input-lg,
    .input-group-lg > .form-control,
    .input-group-lg > .input-group-addon,
    .input-group-lg > .input-group-btn > .btn,
    .html-tamplet-content .input-group-lg.input-group .form-control,
    .input-group-lg > .input-group-btn input[type="text"] {
        height: 42px !important;
        padding: 10px 16px;
        font-size: var(--font-18, 18px);
        line-height: 1.3333333;
        border-radius: 6px 0 0 6px;
    }

    /********************************** view more for post *********************************/
    .modal-likeList {
        position: absolute;
        top: 45px;
        width: 100%;
        bottom: 0;
        background: #fff;
        border-bottom: 1px solid #aaa;
        z-index: 20;
    }

        .modal-likeList .modal-header {
            background: #ddd !important;
            color: #555;
        }

            .modal-likeList .modal-header .close {
                color: #555;
            }

        .modal-likeList #likeList .box-comment {
            background: none;
        }

            .modal-likeList #likeList .box-comment .username {
                font-size: var(--font-12, 12px);
                margin-top: 6px;
                padding-left: 35px;
                color: #666;
            }

        .modal-likeList .box-comments {
            margin: 0 -15px;
        }

    #likesModal {
        margin-right: 10px;
    }

    /********************************* Study Groups ************************************/
    .tableHeaderCell {
        background: #206e87;
        color: #fff;
        padding: 5px 10px;
    }

    /********************************* Edu Briefcase ************************************/
    .briefcasemenu {
        padding: 0;
    }

        .briefcasemenu ul {
            list-style: none;
            margin-bottom: 20px;
            padding: 0;
            margin: 0 auto 20px;
            max-width: 560px;
        }

            .briefcasemenu ul li {
                border: 1px solid #e8e8e8;
                background: #fff;
                display: table-cell;
                min-width: 100px;
                text-align: center;
                border-left: none;
            }

                .briefcasemenu ul li:first-child {
                    border-left: 1px solid #e8e8e8;
                }

                .briefcasemenu ul li a {
                    padding: 5px 10px;
                    display: block;
                }

                    .briefcasemenu ul li a.active {
                        background: #206e87;
                        color: #fff;
                    }

    .briefcasesidemenu ul {
        padding: 0;
    }

    .briefcasesidemenu ul {
        list-style: none;
        margin-bottom: 20px;
        padding: 0;
        margin-right: 10px;
        border: 1px solid #ddd;
        border-radius: 0px;
    }

        .briefcasesidemenu ul li a {
            color: #206e87;
            border-bottom: 1px solid #ddd;
            display: block;
            padding: 7px;
            font-size: var(--font-12, 12px);
            font-weight: bold;
            border-left: 2px solid #206e87;
        }

            .briefcasesidemenu ul li a.active {
                background: #2e95b7;
                color: #fff;
            }

            .briefcasesidemenu ul li a:hover {
                background: #eee;
            }

            .briefcasesidemenu ul li a.active:hover {
                background: #2e95b7;
                color: #fff;
            }

    table img {
        /*aibrahim Edubreafcase issue*/
        max-width: inherit;
    }

    .MailHeader input {
        vertical-align: middle;
    }

        .MailHeader input[src*="HeaderIcon_ImportanceArrow.gif"] {
            vertical-align: top;
        }

    table img[src*="InboxTemplate"] {
        vertical-align: top;
    }

    /********************************* General old styles ************************************/
    .userSmallInfo img.userImage {
        float: left;
        margin-right: 10px;
    }

    .userSmallInfo .editProfile {
        font-size: var(--font-12, 12px);
    }

    .userSmallInfo h2 span {
        font-size: var(--font-24, 24px);
        font-weight: normal;
    }

    .userSmallInfo h2 span {
        color: #555;
    }

    .userSmallInfo h2 {
        margin: 0;
        font-size: var(--font-22, 22px);
    }

    div.divQRLogin {
        height: 180px;
        vertical-align: middle !important;
        padding-top: 70px;
    }

    .userSmallInfo div.divQRLogin {
        padding-top: 30px;
    }

    .Bloglabel {
        margin-left: 75px;
    }

    .ValidationClass,
    .ValidationStar {
        color: #de1313;
    }

    .ValidationNote {
        color: #de1313;
        margin-left: 10px;
        font-size: 12px;
        text-align: center !important;
        margin: 12px auto !important;
    }

    #ctl00_ctl00_cphPageBody_cphPageBody_tbTitle {
        /*    width: 180px !important*/
    }

    #mdlBadgeCreator .modal-header .close {
        position: absolute;
        left: 17px;
        background-color: transparent;
        border: 0;
        font-size: 30px;
        top: -4px;
    }

    #mdlBadgeCreato .FileUploaderStyle > div {
        width: 70px !important;
        left: 20px;
    }

    #mdlBadgeCreator .modal-content {
        max-height: 500px;
    }

    #mdlBadgeCreator .modal-body {
        max-height: 500px;
        overflow: hidden;
        overflow-y: scroll;
    }

    .border_section {
        border: 1px solid #115c7440;
        border-radius: 8px;
        padding: 12px 10px 12px;
    }

    .container.col-md-12.content.coursepagecontent, .col-md-12.content.coursepagecontent, .col-md-8.content.coursepagecontent {
        /*    border: 1px solid #115c7440;*/
        border-radius: 8px;
        /*    padding: 12px 10px 12px;*/
    }

    .lectureFormStyle .ValidationNote, .dvAddSection .ValidationNote {
        text-align: start !important;
    }

    .eduwaveWrapper #colorMenu table td input {
        padding: 0 !important;
        min-width: 12px !important
    }

    .eduwaveWrapper #colorMenu table[id$="oElementEditor_Table6"] td[background] {
        display: none;
    }

    .eduwaveWrapper #colorMenu table[id$="oElementEditor_Table6"] > tbody > tr:first-child,
    .eduwaveWrapper #colorMenu table[id$="oElementEditor_Table6"] > tbody > tr:last-child {
        display: none;
    }

    .eduwaveWrapper #colorMenu table[id$="oElementEditor_Table6"] td:has(> img:only-child) {
        display: none;
    }

    .eduwaveWrapper #colorMenu {
        border: 1px solid var(--primary-color);
        border-radius: 8px;
        overflow: hidden;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    }

    #tableMenu,
    #colorMenu {
        top: 5rem !important;
    }

    .CourseColumnContent {
        /*    width: 100%;
    margin: 0;
    padding: 0;*/
    }

    .marginBottom {
        margin-bottom: 10px;
    }

    .eduwaveWrapper table td {
        vertical-align: top;
    }

    .DataListItems span {
        float: left;
    }

    .StudyLevelsContainer .StudyLevels h5 {
        color: #206e87;
        margin-top: -14px;
        font-size: var(--font-12, 12px);
        font-weight: bold;
    }

    .defaultFloatDiv {
        /*    float: right !important;*/
    }

    .comment {
        padding: 8px;
        margin: 0 0 15px 45px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        font-size: var(--font-12, 12px);
        position: relative;
        z-index: 1;
        border: 1px #ccc solid;
        background: #fff;
        /*border: 1px #cacaca solid;
  background: #fff url(../../images/Blog/comment_bg.png) repeat-x bottom;
  box-shadow: 2px 2px 3px #e8e8e8;*/
    }

    table.info_postion {
        position: relative;
        /* overflow: hidden; */
    }

    .sidebarTitle {
        background: #206e87;
    }

    div[id*="UpdatePanelNotesViewer"] div {
        text-align: center;
    }

    /**** assesment ****/
    .assessmentHeader {
        background: #206e87;
    }

    .assessmentHeader {
        background: #206e87 !important;
        border: medium none;
        border-radius: 0px;
        margin: 0px -10px;
        border-bottom: 3px solid rgba(37, 98, 141, 0.74);
    }

    .QuestionNumber, .QuestionGrayHeader {
        background: #e6e6e7 !important;
        /*color: #fff;*/
    }

    .assessmentFooter {
        /*background: #70bfef;*/
        background: #e6e6e7 !important;
    }

    .assessmentButtons a.assessBtn,
    a.AssessBtns {
        background: #206e87 !important;
        border: none !important;
    }

    #ulYesNo {
        width: 110px !important;
    }

    .OptionsLinkWidth {
        width: 50px;
    }

    /*.AnswerContent {
    overflow: visible;
}*/
    /****************** Old Chat Style *********************/
    /*************************************************************************/
    /******** Instant Messages Styles **** Added by Ra'ad Khalaileh *********/
    /***********************************************************************/
    /*.Instant_messages_container > table > tbody > tr > td:first-child > div{
    min-height: 435px;
    max-height: 400px;
    background-color: #f6f6f6 !important;
    margin-right: 8px;
}*/
    .Instant_messages_container > table > tbody > tr > td:first-child > div {
        min-height: 416px;
        max-height: 400px;
        background-color: #f6f6f6 !important;
        border-right: none !important;
    }

        .Instant_messages_container > table > tbody > tr > td:first-child > div > div:first-child {
            padding: 15px 0 !important;
        }

            .Instant_messages_container > table > tbody > tr > td:first-child > div > div:first-child a {
                padding: 6px 45px;
                -moz-border-radius: 6px;
                -webkit-border-radius: 6px;
                border-radius: 6px;
                background-position: top;
                background: #206e87;
                color: #fff;
                text-shadow: 1px 1px #206e87;
                border: 1px #66aad0 solid;
                width: 100%;
                display: block;
                margin: -15px 0;
                border-radius: 0;
                padding: 11px;
            }

                .Instant_messages_container > table > tbody > tr > td:first-child > div > div:first-child a:hover {
                    background: #206e87;
                    text-decoration: none;
                }

    .Instant_messages_container .slimScrollDiv #lstUsers {
        height: 388px !important;
    }

        .Instant_messages_container .slimScrollDiv #lstUsers > table {
            padding: 5px 0px !important;
            border-bottom: 1px solid #ccc;
            position: relative;
        }

        .Instant_messages_container .slimScrollDiv #lstUsers table > tbody > tr > td {
            border-bottom: none !important;
        }

    .slimScrollDiv #lstUsers table td {
        vertical-align: middle;
    }

    .Instant_messages_container .slimScrollDiv #lstUsers table img {
        width: 40px !important;
        border-radius: 50%;
    }

    .Instant_messages_container .slimScrollDiv #lstUsers table .notificationRow > a {
        width: 346px;
        height: 64px;
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        line-height: 87px;
        text-indent: 80px;
        cursor: pointer;
    }

    .Chat_Msg_details {
        margin-bottom: 15px;
        background-color: #e9e9e9;
        padding: 10px;
        margin-right: 100px;
        border-radius: 8px;
        position: relative;
    }

        .Chat_Msg_details:after {
            font-family: FontAwesome !important;
            content: "\f0d9";
            font-size: 24px;
            position: absolute;
            color: #e9e9e9;
            left: -8px;
            top: 0;
        }

        .Chat_Msg_details.My_message {
            background-color: #24b0bf14;
            padding: 10px;
            margin-left: 100px;
            border-radius: 8px;
            margin-right: 0;
        }

            .Chat_Msg_details.My_message:before {
                font-family: FontAwesome !important;
                content: "\f0da";
                font-size: 24px;
                position: absolute;
                color: #24b0bf14;
                right: -8px;
                top: 0px;
            }

            .Chat_Msg_details.My_message:after {
                display: none;
            }

        .Chat_Msg_details .Chat_Msg_UserInfo {
            color: #0f8ad1;
            font-size: var(--font-13, 13px);
            font-weight: 600;
        }

        .Chat_Msg_details .Chat_Msg_Date {
            float: right;
            font-size: var(--font-12, 12px);
            color: #969696;
        }

        .Chat_Msg_details .Chat_Msg_Text {
            display: block;
            padding-top: 10px;
            font-size: var(--font-13, 13px);
        }

        .Chat_Msg_details .Chat_Msg_Text_ar {
            display: block;
            padding-top: 10px;
            font-size: var(--font-13, 13px);
            direction: rtl;
            text-align: right;
        }

    .Instant_messages_container .txtareabox {
        padding: 10px !important;
        padding-bottom: 21px !important;
        box-sizing: border-box;
        margin-bottom: 7px !important;
    }

    .Instant_messages_container #btnSubmit {
        float: left;
        margin-right: 40px;
        /*padding: 6px 45px;*/
        padding: 6px 25px;
        margin: 5px 40px 5px 0px;
        border-radius: 0;
    }

    .Instant_messages_container > table > tbody > tr > td:last-child > div > table {
        position: relative;
        overflow: hidden;
    }

    .Instant_messages_container > table > tbody > tr > td:last-child tr:last-child td div {
        display: inline-block;
        padding-top: 12px;
        color: #828282;
        margin: 0 5px;
    }

    .Instant_messages_container > table > tbody > tr > td:last-child tr:last-child td {
        padding-bottom: 5px !important;
    }

    .Instant_messages_container > table > tbody > tr > td:last-child tr:first-child td {
        padding: 13px !important;
        position: absolute !important;
        width: 100%;
        top: 0;
        left: 0;
        z-index: 300;
        box-sizing: border-box;
    }

        .Instant_messages_container > table > tbody > tr > td:last-child tr:first-child td input {
            /*color: #000;
  font-weight: 600;
  border: 1px solid #c1c1c1 !important;
  border-radius: 0;
  background: #fff !important;*/
        }

    .autocomplete_completionListElement {
        border: 1px solid #ccc;
        font-size: var(--font-12, 12px);
        padding: 5px;
        box-sizing: border-box;
        border-top: 0;
        width: 222px !important;
    }

    @-moz-document url-prefix() {
        /********* specific for firefox ***********/
        .Instant_messages_container .slimScrollDiv .itgChatBox {
            height: 231px !important;
        }
    }

    .Instant_messages_container > table > tbody > tr > td > div > div:first-child {
        background-color: #fff;
        position: relative;
    }

    .Instant_messages_container > table > tbody > tr > td > div #lstUsers > table {
        background: #fefefe;
        cursor: pointer;
    }

        .Instant_messages_container > table > tbody > tr > td > div #lstUsers > table.active,
        .Instant_messages_container > table > tbody > tr > td > div #lstUsers > table:hover {
            background: #24b0bf14;
        }

    #lstUsers {
        height: 363px !important;
        overflow: hidden !important;
        overflow-y: auto !important;
    }

    /***************** bugs *******************/
    div[id*="divAddNote"] div[id*="AddNoteForm"] {
        /*aibrahim fix bug #5863 24-9-2017*/
        padding: 15px;
    }

    div[id*="divAddNote"] {
        /*aibrahim fix bug #7338 13-11-2017*/
    }

        div[id*="divAddNote"] table {
            border-collapse: separate;
            border-spacing: 2px;
        }

        div[id*="divAddNote"] .DialogTitle {
            margin: -2px;
            display: block;
        }

    .labelsStyle {
        /*aibrahim fix bug #5865 29-10-2017*/
        margin-right: 5px;
    }

    div[id*='UpdatePassword'] table {
        /*aibrahim fix bug #6880 26-10-2017*/
        table-layout: fixed;
    }

        div[id*='UpdatePassword'] table input[type="text"],
        div[id*='UpdatePassword'] table input[type="password"] {
            /*aibrahim fix bug #7428 26-10-2017*/
            width: 97% !important;
        }

    .AnswerContent {
        /*aibrahim fix bug #7274 7-11-2017*/
        overflow: visible !important;
    }

        .AnswerContent:after {
            /*aibrahim fix bug #7274 7-11-2017*/
            clear: both;
            display: block;
            content: '';
        }

    #pnlAddMessage {
        /*aibrahim fix bug #7477 7-11-2017*/
    }

        #pnlAddMessage table {
            /*border-collapse: separate;
    border-spacing: 2px;*/
            line-height: 17px;
        }

        #pnlAddMessage > table {
            border-collapse: separate;
            border-spacing: 1px;
        }

        #pnlAddMessage table td {
            padding: 1px !important;
        }

    #pnlAddMessage {
        /*aibrahim fix bug #7477 7-11-2017*/
        border-spacing: 2px !important;
        border-collapse: separate;
    }

    .QuestionNumber {
        background: none;
    }

    .calendar tfoot tr.time td {
        /*padding: 0 !important;
  margin: 0 !important;*/
        /*line-height: 12px;*/
    }

    input[type="file"] {
        /*aibrahim fix bug #8491 13-12-2017*/
        margin-bottom: 10px;
    }

    .calendar tfoot tr.time table td.up,
    .calendar tfoot tr.time table td.down {
        /*aibrahim fix bug #8331 24-12-2017*/
        height: 10px;
        line-height: 10px;
    }

    .fc-content table, .fc-content * {
        /*aibrahim fix bug #9248, 9865 30-1-2018*/
        direction: ltr !important;
    }

    #tblDefault img,
    #tdDefault img {
        /*aibrahim fix bug #9384 17-1-2018*/
        max-width: 100%;
    }

    .tableViewComments {
        /*aibrahim fix bug #10091 25-2-2018*/
        display: inline-block;
        margin-bottom: -4px;
    }

    .wrapper {
        width: 100%;
        /*dashboard width issue on IE*/
    }

    .CourseColumnContent {
        width: 100%;
        padding: 0;
    }

    .MarginWrapper .wrapper {
        padding: 0;
        overflow: visible !important;
    }

        .MarginWrapper .wrapper .courseleftSide,
        .MarginWrapper .wrapper .coursepagecontent {
            margin-bottom: 0;
        }

    th.gradingPeriodColumn, td.gradingPeriodColumn {
        /*aibrahim fix bug #14058 25-9-2018*/
        position: inherit !important;
    }

    [id*="trEmail"] table {
        /*aibrahim fix bug #12853 25-9-2018*/
        border-collapse: initial;
        border-spacing: 2px;
    }

    .tblCal {
        /*aibrahim fix Imam project bug No #16634 16-10-2018*/
        min-width: 100%;
    }

        .tblCal #dvCal #calendar {
            margin-left: 1% !important;
            margin-right: 1% !important;
            width: 98% !important;
        }

        .tblCal div[style*="margin-left: 146px;"] {
            margin-left: 18px !important;
        }

        .tblCal .tblCalHeader td:first-child div {
            display: table-cell;
            margin: 0 20px !important;
            width: auto !important;
        }

            .tblCal .tblCalHeader td:first-child div .tblCalHeader td:first-child div:first-child,
            .tblCal .tblCalHeader td:first-child div .tblCalHeader td:first-child div:last-child,
            .tblCal .tblCalHeader td:first-child div button {
                margin: 0px !important;
            }

        .tblCal label.unitplanTitel {
            margin-top: -28px;
            margin-bottom: 15px;
            display: block;
        }

        .tblCal .dv-lists {
            float: none !important;
        }

    .TitleWithButtons {
        /*aibrahim fix Imam project bugs No #16711,#16677 16-10-2018*/
        position: relative;
    }

    .DialogDesc {
        /*aibrahim fix bug No #18059 14-11-2018*/
        overflow: auto;
        height: calc(100% - 31px);
    }

    .all-courses .col-md-3:nth-child(4n+1) {
        /*aibrahim fix bug No #19703 11-12-2018*/
        clear: left;
    }

    /****************** pop up chat in dashboard conflict with jquery ui style *********************/
    .ui-chatbox-titlebar {
        background: #206e87 !important;
        color: #fff !important;
        padding: 10px;
        /*height: 14px;*/
        cursor: pointer;
        font-size: var(--font-12, 12px);
        line-height: 1.2em;
        border: none !important;
    }

    .ui-widget-header .ui-icon {
        background-image: url(../../images/ui_images/ui-icons_ffffff_256x240.png) !important;
    }

    .ui-widget-content.ui-chatbox-input.box-footer {
        max-width: 100% !important;
    }

    .direct-chat-primary .direct-chat-img {
        padding: 6px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        background: #206e87;
        color: #fff;
        width: 40px;
        height: 40px;
        font-size: var(--font-18, 18px);
        text-align: center;
    }

    .direct-chat-primary .right > .direct-chat-text {
        background: #206e87 !important;
        border-color: #206e87 !important;
        color: #fff;
    }

        .direct-chat-primary .right > .direct-chat-text:after,
        .direct-chat-primary .right > .direct-chat-text:before {
            border-left-color: #206e87 !important;
        }

    .direct-chat-primary .direct-chat-text audio {
        position: relative;
        z-index: 1;
    }

    /****** online and offline popup chat *********/
    .ui-chatbox .offline-peopel, .ui-chatbox .online-peopel {
        position: relative;
        top: auto;
        left: auto;
        width: 9px;
        height: 9px;
        border: 1px solid #fff;
        display: inline-block;
        margin-top: -13px;
        vertical-align: middle;
    }

    .ui-chatbox .offline-peopel {
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        background: #ddd;
        z-index: 10;
        box-shadow: 0px 0px 1px #B5B4B499;
    }

.ui-chatbox .box-header .box-title {
    display: inline-block;
    /* aibrahim 22-9-2018 fix bug No #17049 */
    font-size: 13px;
    overflow: hidden;
    height: 17px;
    margin: 0 14px;
    text-wrap: wrap;
    width: 150px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

    input[id*='txtHour'],
    input[id*='txtHour'] + input,
    input[id*='txtMinute'],
    input[id*='txtAmPm'] {
        /* aibrahim 7-7-2020 fix bug No #45045 */
        padding: 1px 0px;
    }

    table[id*="gvPeriods"] span[id*="gvPeriods"] td {
        /* aibrahim 7-7-2020 fix bug No #45045 */
        vertical-align: middle !important;
    }

    /*****************************************************/
    .modal-content .box-footer.send-comment {
        position: relative !important;
        bottom: inherit !important;
        margin: inherit !important;
        border-top: 0;
        /*margin-bottom: -65px !important;*/
    }

    .modal-content .btn {
        padding: 6px 12px !important;
        border-radius: 0px !important;
    }

    .modal-content .btn-group-xs > .btn, .modal-content .btn-xs {
        padding: 1px 5px !important;
        font-size: var(--font-12, 12px) !important;
        line-height: 1.5 !important;
    }

    /***** all chat page style ******/
    .Chat_Msg_details .Chat_Msg_Text:before, .Chat_Msg_details .Chat_Msg_Text:after {
        content: "";
        display: block;
        clear: both;
    }

    .direct-chat-text .post-image-thumb, .direct-chat-text .post-video-thumb {
        float: none;
    }

    /** no image attache **/
    .no-image-attache {
        position: relative;
        display: inline-block;
        width: 20px;
        height: 10px;
    }

        .no-image-attache:before {
            content: '';
            display: block;
            font-size: 19px;
            position: absolute;
            top: -5px;
            height: 20px;
            width: 3px;
            background: #fff;
            border-left: 2px solid #597a96;
            transform: rotate(24deg);
            right: 5px;
            z-index: 6;
            color: #597a96;
        }

        .no-image-attache:after {
            content: '\f03e';
            display: block;
            font-family: FontAwesome !important;
            font-size: 14px;
            position: absolute;
            top: -5px;
            right: 0px;
            z-index: 3;
            color: #597a96;
        }

    /***************** Parent User styles *****************/
    .children {
        border: 1px solid #cfdae1;
        padding: 15px;
        height: auto;
        overflow: hidden;
        position: relative;
    }

        .children > a {
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            z-index: 10;
            display: block;
        }

    .children_container {
        padding: 7px !important;
    }

        .children_container:nth-child(2n + 1) {
            clear: left;
        }

    .children_image {
        width: 100%;
        height: 123px;
    }

    .col-xs-4.children_img_section {
        padding: 0;
        max-width: 110px;
    }

    .children_number {
        width: 100%;
        text-align: center;
        font-weight: 700;
        font-size: var(--font-14, 14px);
        display: block;
        color: #fff;
        margin-top: 3px;
        background: #206e87;
    }

    .col-xs-8.children_details {
        padding-right: 0px;
        padding-left: 10px;
    }

    .children_name {
        font-size: var(--font-13, 13px);
        font-weight: 600;
        color: #666;
        display: block;
    }

    .children_type {
        font-weight: 300;
        display: block;
        border-bottom: 1px solid #cfdae1;
        color: #999;
        font-size: 11px;
    }

    .children_details_row {
        margin: 0px 0px;
    }

        .children_details_row:last-child {
            margin-bottom: 0px;
        }

    .details_icon {
        width: 100%;
        display: inline-block;
        padding-left: 18px;
        position: relative;
        font-size: var(--font-13, 13px);
        font-weight: 600;
        line-height: 14px;
        margin-top: 4px;
        color: #206e87;
    }

    .details_number {
        width: 100%;
        display: inline-block;
        color: #666;
        font-size: var(--font-13, 13px);
        font-weight: 100;
        padding-left: 20px;
        float: left;
        line-height: 17px;
    }

    .details_icon:before {
        font-family: fontAwesome;
        font-size: var(--font-13, 13px);
        color: #206e87;
        position: absolute;
        left: 0;
    }

    .class_icon:before {
        content: "\f024";
    }

    .absence_icon:before {
        content: "\f274";
    }

    .grades_icon:before {
        content: "\f15c";
    }

    .NewDesginClassChild.coursepagecontent {
        padding-top: 0;
    }

    .ParentContent {
        padding-left: 0;
    }

    /************************ HTML Template *************************/
    .html-tamplet-content .box {
        box-shadow: none;
        border-bottom: 1px solid #dadada;
        border-right: 1px solid #dadada;
        border-left: 1px solid #dadada;
    }

        .html-tamplet-content .box.box-widget {
            box-shadow: none;
            border: 1px solid #dadada;
        }

    .checkbox.disabled {
        opacity: .6;
    }

    .input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group {
        margin: 0;
        margin-left: -1px;
    }

    .select-wrapper select.form-control,
    .select-wrapper select {
        background: #fff;
        position: relative;
        color: #333;
        padding: 0 !important;
        /*padding-left: 2px !important;*/
        border: 1px solid #206e87 !important;
        height: 22px !important;
        font-size: var(--font-12, 12px);
        width: 98% !important;
    }

    .select-wrapper:after {
        content: '\f0d7';
        display: block;
        font-family: FontAwesome !important;
        font-size: 12px;
        border: 0 !important;
        color: #fff;
        position: absolute;
        top: 4px;
        right: calc(2% + 7px);
        pointer-events: none;
        z-index: 30;
    }

    .select-wrapper:before {
        content: '';
        display: block;
        clear: both;
        width: 25px;
        height: 100%;
        background: #206e87;
        position: absolute;
        top: 0px;
        right: calc(2% - 2px);
        pointer-events: none;
        z-index: 10;
        border: 1px solid #005c90 !important;
    }

    .select-wrapper {
        position: relative;
        clear: both;
        display: block;
    }

        .select-wrapper:before {
            display: block;
            content: '';
            clear: both;
        }

    [class*='col-'].select-wrapper:after {
        right: 15px;
    }

    select.form-control option,
    select option {
        color: #333;
    }

        select.form-control option:hover,
        select option:hover {
            background: #206e87 !important;
        }

    .imgBrowse:before {
        display: inline-block;
        font-family: FontAwesome !important;
        font-size: 15px;
        margin-right: 2px;
        content: "\f07c";
        color: #fff;
        font-size: 12px;
    }

    .imgBrowse input {
        opacity: 0;
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        cursor: pointer;
        height: 34px;
    }

    .imgBrowse {
        background: #206e87 !important;
        display: table-cell;
        padding: 2px 10px;
        position: relative;
        width: 1%;
        white-space: nowrap;
        color: #fff;
        font-size: var(--font-12, 12px);
    }

    .FileUploaderStyle {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

        .FileUploaderStyle .file {
            display: table-cell;
            /*padding: 6px 12px;*/
            padding: 2px 12px;
            font-size: var(--font-12, 12px);
            border: 1px solid #cccccc;
            height: 26px;
            /* aibrahim 29-5-2018 fix bug No #12827 */
            width: 100%;
        }

    .html-tamplet-content select option:focus,
    .html-tamplet-content select:focus {
        background: transparent;
    }

    .select-overlay {
        display: none;
    }

    .select-wrapper,
    .select-wrapper * {
        box-sizing: initial !important;
    }

        .select-wrapper.disabled {
            opacity: .6;
        }

    /*.horizontal-checkbox,
.horizontal-checkbox {
    padding-left: 0;
}*/
    .checkbox label, .radio label {
        padding-left: 0px;
        padding-right: 20px;
    }

    .html-tamplet-content .products-list .product-img {
        float: left;
        width: 40px;
        line-height: 40px;
        vertical-align: middle;
        text-align: center;
        height: 40px;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        border-radius: 50%;
        overflow: hidden;
    }

        .html-tamplet-content .products-list .product-img img {
            max-width: 40px;
            max-height: 40px;
            text-align: center;
            width: auto;
            height: auto;
            -webkit-border-radius: 0;
            -moz-border-radius: 0%;
            -ms-border-radius: 0%;
            border-radius: 0%;
            overflow: visible;
        }

    .html-tamplet-content .products-list .product-title {
        display: inline-block;
        max-width: 100%;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
        height: 19px;
    }

    .html-tamplet-content .products-list .product-info {
        margin-left: 50px;
    }

    .item.nodescription .product-info {
        padding-top: 7px;
    }

    .html-tamplet-content .users-list > li > .users-list-img {
        border-radius: 50%;
        max-width: 100%;
        height: 50px;
        width: 50px;
        margin: auto;
    }

    .html-tamplet-content .users-list > li img {
        max-height: 50px;
        max-width: 50px;
    }

    .html-tamplet-content .btn {
        display: inline-block;
        padding: 3px 12px;
    }

    .html-tamplet-content .box .box-footer a.btn {
        border-top: 1px solid #f4f4f4;
        padding: 10px 12px;
    }

    .html-tamplet-content .box .box-footer {
        border-top: 1px solid #ddd;
    }

        .html-tamplet-content .box .box-footer a.btn:hover {
            box-shadow: none !important;
            border: 1px solid #f4f4f4 !important;
        }

        .html-tamplet-content .box .box-footer .btn.btn-flat:hover {
            border-radius: 0;
            -webkit-box-shadow: none;
            -moz-box-shadow: none;
            box-shadow: none;
            border-width: 0px;
            border: 0;
        }

    .html-tamplet-content .itg_dashboard_dropdown-menu {
        top: calc(100% + 10px);
    }

    .html-tamplet-content .form-group label,
    .html-tamplet-content .form-horizontal .control-label {
        text-align: left;
        color: #777;
        font-size: var(--font-13, 13px);
    }

    /********************************** Edit profile page *******************************************/
    /*.userSmallInfo{
    width: 300px;
    text-align: center;
    position: absolute;
    left: 15px;
    top: 76px;
    height: calc(100% - 152px);
    box-shadow: 8px 0 0 #fff;
    border-radius: 0;
    border: 1px solid #ddd;
    border-right: 3px solid #cbcbcb;
}
.userSmallInfo img.userImage{
    background: #fff;
    border: 3px solid #206e87  !important;
    border-radius: 5px;
    float: none;
    margin: 10px 0 5px 0;
    max-width: 80px;
    max-height: 80px;
}
.userSmallInfo img.userImage:befor{
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: 20px solid #EEE;
    vertical-align: middle;
}
.userSmallInfo .editProfile {
    font-size: 12px;
    display: block;
}
.userSmallInfo .editProfile:before {
    display: inline-blocks;
    font-family: FontAwesome !important;
    font-size: 15px;
    margin-right: 7px;
}
.userSmallInfo .editProfile[id*='EditProfile']:before {
    content: "\f044";
}

.userSmallInfo .editProfile[id*='EditUserPrefernces']:before {
    content: "\f007";
}

.userSmallInfo .editProfile[id*='EditUserTriggers']:before {
    content: "\f0f3";
}

.userSmallInfo .editProfile + span {
    display: none;
}

.Bloglabel {
    background: #206e87 ;
    display: block;
    margin-left: 0;
    text-align: center;
    width: 120px;
    padding: 5px 10px;
    border-radius: 4px;
    color: #fff;
    margin: 10px auto;
}

.Bloglabel:hover{
    color: #fff;
}

.userSmallInfo td{
    display: block;
}
div.divQRLogin .userInfoLabelStyle {
    width: 200px;
    display: block;
    text-align: center;    
    margin: 20px;
}
div.divQRLogin {
    margin: auto;
}

.userSmallInfo h2 span {
    color: #777;
    margin: 10px 0;
    display: block;
}
[id*='tdShowUserInfo']{
    margin-left: 300px;
}

.userSmallInfo .greenColor:before {
    display: inline-blocks;
    font-family: FontAwesome !important;
    font-size: 15px;
    margin-right: 7px;
    content: "\f007";
}*/
    /*To minimize spaces between labels, controls and validation*/
    .form-adjust .col-md-4 {
        max-width: 260px;
    }

        .form-adjust .col-md-4.small-label {
            max-width: 150px;
        }

        .form-adjust .col-md-4 .RequiredValidationStar:after {
            content: '*';
            color: #de1313;
            display: inline-block;
            font-weight: normal;
            font-size: 14px;
            margin-left: 3px;
        }

    .starline {
        white-space: nowrap;
    }

    .form-adjust .ValidationNote {
        margin-left: 0px;
    }

    /************************************* Teacher Style **********************************************/
    span[id*="tsStartTime"] td {
        line-height: 0;
    }

    ul.grading_priods li button.grading_periods_bttons {
        border: none;
    }

    .grading_priods {
        padding: 0;
        margin: 0;
    }

    /* 
.FileUploaderStyle > div{
    background: $primary-background !important;
    padding: 0px 10px;
    text-align: center;
    margin-left: 11px;
    height: 26px !important;
    line-height: 26px;
    vertical-align: middle;
}
 
.FileUploaderStyle > div:before{
    content: 'Browse';
    color: #fff;
    display: inline-block;
    pointer-events: none;
    position: absolute;
    width: 100%;
    left: 0;
} 

.FileUploaderStyle > div > input{
    height: 26px !important;
}*/
    /************ page instructions R10 ***********/
    .PageInstructions {
        /*--------------- page instructions R10 ------------------*/
        color: #ec8e27;
        background: #fff3d0;
        border: 1px #e7d6a7 solid;
        /*width:100%;*/
        color: #524e1f;
    }

    .PageInstructionsHide {
        /*--------------- page instructions R10 ------------------*/
        color: #ec8e27;
        background: #fff3d0;
        border: 1px #e7d6a7 solid;
        color: #524e1f;
    }

    .PageInstructions {
        /*--------------- page instructions R10 ------------------*/
        font-size: var(--font-14, 14px);
        font-size: var(--font-12, 12px);
        position: relative;
        padding: 10px;
        margin-bottom: 20px;
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        border-radius: 6px;
        /*behavior: url(css/PIE.htc);*/
    }

    /*a.closeInstructions,*/
    a.hideInstructions {
        /*--------------- page instructions R10 ------------------*/
        background: url(../../images/All/instructions_close_hide.jpg) no-repeat;
    }

    a.ShowInstructions {
        background: url(../../images/All/maximiz.jpg) no-repeat;
    }

    .PageInstructionsHide {
        /*--------------- page instructions R10 ------------------*/
        font-size: var(--font-14, 14px);
        font-size: var(--font-12, 12px);
        position: relative;
        padding: 5px 25px;
        width: 120px;
        margin-bottom: 20px;
        -moz-border-radius: 6px;
        -webkit-border-radius: 6px;
        border-radius: 6px;
        /*behavior: url(css/PIE.htc);*/
    }

    .InstruTitle {
        /*--------------- page instructions R10 ------------------*/
        display: block;
        font-weight: bold;
    }

    /*a.closeInstructions,*/
    a.hideInstructions {
        /*--------------- page instructions R10 ------------------*/
        display: block;
        position: absolute;
        top: 10px;
        width: 10px;
        height: 8px;
        text-decoration: none;
    }

    /*a.closeInstructions{ 
    right:10px;
    background-position:-17px 0px;
    }*/
    a.hideInstructions {
        /*--------------- page instructions R10 ------------------*/
        right: 10px;
        /*25px By Iyasin*/
        background-position: 0px 1px;
    }

    a.ShowInstructions {
        display: block;
        position: absolute;
        top: 10px;
        width: 10px;
        height: 8px;
        right: 10px;
        /*25px By Iyasin*/
        background-position: 0px 0px;
        text-decoration: none;
    }

        a.ShowInstructions:active {
            background-position: 0px -9px;
        }

    /*a.closeInstructions:active{ 
    background-position:-17px -8px;
    }*/
    a.hideInstructions:active {
        /*--------------- page instructions R10 ------------------*/
        background-position: 0px -7px;
    }

    .ui-accordion .ui-accordion-icons {
        height: auto;
        line-height: inherit;
    }

    .widget .sidebarTitle {
        background: #206e87 !important;
    }

    table[id*='gvGroupMembers'] > tbody > tr > td:first-child {
        vertical-align: middle;
    }

    /*[id*='tblSearchCriteria'] .TitleStyle,[id*='tblSearchCriteria'] .TitleWithButtons ,*/
    /*[id*='divSearch'] .TitleStyle,[id*='divSearch'] .TitleWithButtons {
    padding-bottom: 0;
    border-bottom: none;
    margin-bottom: 0;
}*/
    table .footer {
        background: none;
        padding: 0px;
        color: #555;
        position: relative;
    }

    .dtree:hover .dtree,
    .dtree:hover {
        background: #2e95b7 !important;
        color: #fff;
    }

        .dtree:hover a {
            color: #fff;
        }

    .RadFilterRTL li li .rfDiv {
        padding: 0 10px 0 0 !important;
        background-position: right top !important;
    }

    .LMSMoveUpImg {
        /*border-color: transparent transparent $primary-background transparent;*/
        border-color: transparent transparent #2e95b7 transparent;
        border-style: solid;
        border-width: 4px 11px 17px 10px;
    }

    .LMSMoveDownImg {
        /*border-color: $primary-background transparent transparent transparent;*/
        border-color: #2e95b7 transparent transparent transparent;
        border-style: solid;
        border-width: 17px 11px 5px 10px;
    }

    .LMCTocArrows {
        width: 23px;
        margin: 0 auto 10px;
    }

    .LMSMoveDownImg,
    .LMSMoveUpImg {
        background: transparent !important;
    }

    #tdid span.jqTransformCheckboxWrapper {
        display: inline-block;
        float: none;
    }

    .SearchDIV .jqTransformCheckboxWrapper + label {
        /*case in assesment bank page*/
        font-weight: normal;
    }

    [id*='imgWarning'] {
        margin: 0 !important;
    }

    /********************* course ********************/
    .contentContainer .content {
        clear: left;
        padding: 0 0 20px 20px;
        margin-bottom: 20px;
        border: 1px solid #e8e8e8;
    }

        .contentContainer .content table,
        .contentContainer .content table td {
            border: none;
        }

    .content .Post h2 a {
        display: block;
        font-size: var(--font-16, 16px);
        color: #0f8ad1;
        text-decoration: none;
        font-weight: normal;
        padding-bottom: 5px;
        margin-bottom: 5px;
        border-bottom: 1px #eaeaea solid;
    }

        .content .Post h2 a:hover {
            border-bottom: 1px #f4a42a solid;
        }

    .e31_rightfloatmenu {
        top: 70px !important;
    }

    #divDialog {
        background-color: #206e87 !important;
    }

        #divDialog a {
            color: #fff;
            width: fit-content !important;
            padding: 0 15px !important;
        }

    #parentNode a {
        color: #206e87;
    }

    .tableHeaderCell > th {
        width: auto !important;
    }

    .nav.navbar-nav.navbar-right li {
        position: relative;
    }

    #divDialogArrow {
        display: none;
    }

    /********************* ul Tabs **********************/
    ul.tabs {
        margin: 0px;
        padding: 0px;
        list-style: none;
    }

    .asNetDisabled {
        width: 15px !important;
    }

    .tab-content {
        /*    display: none;*/
        background: #FFFFFF;
        padding: 15px;
        /*    border: 1px solid #CCD;*/
    }

        .tab-content.Active {
            display: inherit;
        }

    ul.tabs li a, ul.tabs li span {
        text-decoration: none;
        padding: 5px 15px;
        display: block;
        min-width: 100px;
    }

    ul.tabs li.Active {
        background: #2e95b7;
        color: #FFF;
        border-bottom: 1px solid #2e95b7;
    }

    ul.tabs li {
        color: #fff;
        display: inline-block;
        cursor: pointer;
        text-align: center;
        border-bottom: 1px solid #808080;
        border-radius: 0;
        background: #206e87;
    }

    .tab-link {
        border-radius: 15px 15px 0 0;
        border-bottom: 1px solid #ededed;
        box-shadow: 0px 0px 2px #CCC;
    }

    /********************* ui Tabs **********************/
    .ui-tabs .ui-tabs-nav li a,
    .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a {
        cursor: pointer;
        background: #ddd;
        color: #555;
        border-TOP-left-radius: 3px;
        border-top-right-radius: 3px;
        margin-top: 3px;
        border: 1px solid #ccc;
        border-bottom: none;
    }

    .ui-tabs .ui-tabs-nav li.ui-state-active a, .ui-tabs .ui-tabs-nav li.ui-state-active a:link, .ui-tabs .ui-tabs-nav li.ui-state-active a:visited {
        background: #206e87;
        color: #fff;
        border-color: #206e87;
    }

    /********************* Tabs **********************/
    .RadTabStripTop_RadTabStripSkin .rtsLevel .rtsLink {
        background: #206e87;
        color: #fff;
    }

    .RadTabStripTop_RadTabStripSkin .rtsLevel .rtsLink {
        border-right: 1px solid #fff;
        padding: 5px !important;
    }

        .RadTabStripTop_RadTabStripSkin .rtsLevel .rtsLink:hover {
            background: #206e87;
        }

    .RadMultiPage {
        padding: 15px;
        border: 1px solid #ccc;
    }

    .RadTabStripTop_RadTabStripSkin .rtsLevel .rtsLink.rtsSelected {
        background: #2e95b7;
    }

    .RadTabStrip {
        margin-bottom: -1px;
    }

    #tdSuggestedAnswers .tableHeaderCell {
        background: none;
        color: #555;
    }

    .ViewRubricButton,
    .CreateRubricButton {
        background: #206e87;
        color: #fff !important;
        text-shadow: 1px 1px #206e87;
        margin: 0 2px;
        padding: 1px 8px 2px;
        top: -4px;
        position: relative;
    }

        .ViewRubricButton:before,
        .CreateRubricButton:before {
            content: '';
            display: inline-block;
            font-family: 'FontAwesome' !important;
            font-size: 12px;
        }

        .CreateRubricButton:before {
            content: '\f067';
        }

        .ViewRubricButton:before {
            content: '\f06e';
        }

    /************************************ Wizard ******************************************/
    .coursepagecontent .TitleWithButtons #wizHeader {
        margin: 0 -10px;
    }

    #wizHeader li .currentStep {
        background-color: #0988CF;
    }

    #wizHeader li a:before {
        content: " ";
        display: block;
        border: none !important;
        margin-top: 0;
        margin-left: 1px;
        right: 0 !important;
        z-index: 1;
        height: 100% !important;
        width: 25px !important;
        left: auto !important;
        background: #999 !important;
    }

    #wizHeader li a {
        color: white;
        text-decoration: none;
        padding: 5px 30px 5px 5px !important;
    }

    #wizHeader li {
        margin: 1px;
    }

        #wizHeader li a:before {
            background: #D3D3D3 !important;
        }

        #wizHeader li a:after {
            font-family: 'FontAwesome' !important;
            font-size: 12px;
            display: inline-block;
            content: "\f054" !important;
            border: none !important;
            top: 5px !important;
            right: 16px !important;
            color: #666;
            font-size: 14px;
        }

        #wizHeader li a.currentStep:before {
            background-color: #206e87 !important;
        }

        #wizHeader li a.currentStep:after {
            color: #fff;
        }

        #wizHeader li a.prevStep {
            background-color: #2e95b7;
            ;
        }

            #wizHeader li a.prevStep:before {
                background-color: #2e95b7 !important;
            }

            #wizHeader li a.prevStep:after {
                color: #fff;
                content: "\f00c" !important;
                font-size: 15px;
                top: 3px !important;
                right: 19px !important;
            }

        #wizHeader li a:hover:before {
            background: #2e95b7 !important;
        }

        #wizHeader li a:hover:after {
            color: #fff !important;
        }

    #assessment-left-side #tdTTS .record-btns button {
        background: #206e87 !important;
    }

    .table-input-width table {
        /*    width: 100% !important;*/
    }
    /**********************************************************/
    /******************* Minimize spacing ***********************/
    .eduwaveWrapper {
        margin: 0px 11px 50px !important;
        padding: 0px 0px 0px !important;
        /*    border: 1px solid #206e87 ;*/
    }

    .RadComboBox.RadComboBox_Default {
        /*  width: 100% !important;*/
    }

    .show {
        display: block;
        transform: scale(1);
        visibility: visible;
        opacity: 1;
    }

    .modal-content {
        border-radius: 8px !important;
    }

    .MarginWrapper {
        margin: 0 0;
    }

    .SearchDIV {
        margin: 5px 0px;
    }

    .col-12.StudyTheCourse {
        position: relative;
    }
    /*.page-title {
    padding: 3px 10px 5px !important;
}*/
    .TitleStyle, .TitleWithButtons {
        padding-bottom: 5px;
        border-bottom: 1px solid #bdbdbd;
        margin-bottom: 10px;
    }

    .coursepagecontent .TitleStyle, .coursepagecontent .TitleWithButtons {
        padding: 5px 10px;
        border-bottom: 1px solid #CFDAE1;
        margin: 0 0px 10px;
    }

    .box-paragraph.row {
        padding: 5px;
        border: 1px solid #206e876b !important;
    }

    /************************ power Query *************************/
    .PowerQueryContainer .btn {
        background: #206e87;
        border: none !important;
        border-radius: 3px;
        font-size: var(--font-13, 13px) !important;
        padding: 3px 10px;
        vertical-align: top;
        line-height: inherit;
        margin: 1px;
        text-shadow: none;
        font-weight: normal;
    }

        .PowerQueryContainer .btn:hover {
            background: #206e87;
            font-weight: normal;
            color: #fff;
        }

    .PowerQueryContainer .stepactive td,
    .PowerQueryContainer .stepinactive td {
        vertical-align: middle;
    }

    .PowerQueryContainer .customselect[disabled="disabled"] {
        opacity: 0.7;
    }

    .PowerQueryContainer .customselect {
        background: #fff;
        color: #555;
        border-radius: 0px;
        border: 1px solid #206e87;
    }

    .PowerQueryContainer .PowerQueryGrdHeader {
        background: #206e87 !important;
    }

    .PowerQueryContainer .ui-accordion-icons {
        height: auto !important;
        line-height: inherit !important;
    }

    /***************** Text editor style ***************/
    .AuthorHeaderIcons:hover {
        border: 1px solid #ccc;
        padding: 0;
    }

    .ColorsPanel {
        COLOR: #666666;
        BACKGROUND-COLOR: #ffffff;
    }

    .AuthorHeaderIcons {
        cursor: pointer;
        padding: 1px;
        height: 25px;
    }

    /***************** Reports & Statistics page ***************/
    .e31_reportmenulinks nav ul {
        background-color: #ffffff;
        -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
        -moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
        box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
        display: block;
        padding: 10px;
        list-style: none;
        margin: 10px 0;
    }

        .e31_reportmenulinks nav ul li {
            display: inline-block;
            text-align: center;
            margin-bottom: 6px;
            padding: 5px;
            position: relative;
            min-width: 110px;
            min-height: 66px;
        }

            .e31_reportmenulinks nav ul li a {
                display: block;
                border-bottom: 2px solid rgba(215, 215, 215, 0.5);
                padding: 40px 0 10px;
                position: relative;
                height: 100%;
                top: 0;
                text-decoration: none;
                font-size: var(--font-13, 13px);
            }

            .e31_reportmenulinks nav ul li i {
                display: block;
                color: #206e87;
                top: 10px;
                right: 50%;
                margin-right: -15px;
                position: absolute;
            }

    .glyphicon-folder-close:before {
        content: "\f07b";
        font-family: FontAwesome !important;
        font-size: 25px;
    }

    /***************** course padges page ***************/
    #tblLearnersBadges th .ddlContainer .OptionsContextMenu li a {
        font-size: var(--font-13, 13px);
        padding: 4px 10px;
    }

    .EduwaveBtn {
        text-shadow: none !important;
        border: none !important;
        border-radius: 3px !important;
        background: #206e87 !important;
        font-size: var(--font-13, 13px) !important;
        padding: 3px 10px !important;
    }

        .EduwaveBtn:hover {
            background: #206e87;
        }

    #mdlCofirmMessage h3 {
        margin: 0;
        color: #555;
        font-size: var(--font-16, 16px);
        font-weight: bold;
    }

    #mdlCofirmMessage p {
        color: #787878;
    }

    #mdlCofirmMessage .modal-header {
        padding: 6px 15px 7px;
    }

    #trBadgesHeader {
        background: #fff;
    }

    .FileUploaderStyle input.file.marginBottom {
        margin-right: 10px;
    }

    /***************** Teacher bugs *******************/
    .grade-input-sm {
        /* aibrahim 29-5-2018 fix bug No #12737 */
        min-width: 42px;
    }

    .FileUploaderStyle > div {
        /* aibrahim 29-5-2018 fix bug No #12791 */
        width: 70px !important;
    }

    .GradingScaleNumber, .CriteriaTitle {
        /* aibrahim 30-5-2018 fix bug No #12673 */
        width: 100%;
    }

    .NotificationList {
        /* aibrahim 30-5-2018 fix bug No #12865 */
        box-sizing: content-box;
    }

    span[id*="tsFromTime"].tSelector,
    span[id*="tsToTime"].tSelector {
        /* aibrahim 3-6-2018 fix bug No #12957 */
        line-height: 1px;
    }

    /*********************** General styles for teacher ********************/
    /*td:empty,div:empty,p:empty{
    line-height: 0;
}*/
    .Post ul.DateNcomments {
        padding: 0;
    }

    .TabelGrid tr td.tdClass {
        /** for Rubric grid fixed td **/
        position: inherit;
    }

    .grid_rubric_style .TabelGrid tr td.tdClass {
        position: relative;
    }

    /** icons for butons in course dashboard **/
    .ModifyButtonBulletinBoard:after {
        display: block;
        font-family: FontAwesome !important;
        content: "\f044";
        color: #206e87;
        font-size: 24px;
        margin: -3px 0 -1px;
        cursor: pointer;
    }

    .RecentActivityButtonSettings:after {
        display: block;
        font-family: FontAwesome !important;
        content: "\f013";
        color: #2e95b7;
        font-size: 23px;
        margin-top: -4px;
        cursor: pointer;
    }

    .ModifyButtonBulletinBoard,
    .RecentActivityButtonSettings {
        position: relative;
    }

        .ModifyButtonBulletinBoard input,
        .RecentActivityButtonSettings input {
            position: absolute;
            opacity: 0;
            width: 100%;
            height: 100%;
        }

    .light-warning.alert-warning {
        color: #856404 !important;
        background-color: #fce18b !important;
        border-color: #ecc13f;
    }

        .light-warning.alert-warning a {
            color: #856404 !important;
            text-decoration: underline;
        }

        .light-warning.alert-warning .fa {
            font-size: 22px;
            float: left;
            margin-top: -1px;
        }

    .SearchDIV tr[id*='trCalGregorian'] input {
        /*Course Announcements*/
        /*    width: 200px !Important;*/
    }

    a.aspNetDisabled {
        /*color: #206e87  !important;*/
    }

    /**************** adding border to the cericle image if there is no image ******************/
    .postsMainContainer .writePostWarper .img-sm,
    .latestPostsWidget .writePostWarper .img-sm,
    .study-groups-Widget .box-body .widget-block .img-circle img,
    .coursesWidget .products-list .product-img,
    .product-img img,
    .latestPostsWidget .products-list .product-img img,
    .coursesAnouicmentWidget .products-list .product-img img,
    .coursepeople .products-list .product-img img,
    .course-list .topImage,
    .user-block .img-circle {
        position: relative;
        border-radius: 50%;
        z-index: 1;
        display: block;
    }

        .latestPostsWidget .writePostWarper .img-sm:after,
        .study-groups-Widget .box-body .widget-block .img-circle img:after,
        .coursesWidget .products-list .product-img:after,
        .product-img img:after,
        .latestPostsWidget .products-list .product-img img:after,
        .coursesAnouicmentWidget .products-list .product-img :after,
        .coursepeople .products-list .product-img :after,
        .course-list li a .topImage :after,
        .user-block .img-circle:after {
            border: 1px solid rgba(0, 0, 0, 0.1);
            bottom: 0;
            content: '';
            left: 0;
            position: absolute;
            right: 0;
            top: 0;
            border-radius: 50%;
            z-index: 0;
        }

    .navbar-Center .navbar-options.course-list li a:hover .topImage :after {
        border: 1px solid #fff;
    }

    /**************** End of adding border to the cericle image if there is no image ******************/
    /********************** SearchDIV ***********************/
    .SearchDIV.ValidationNote {
        background: #FFF5E4;
        /*    border: 1px solid #206e87;*/
        padding: 7px;
        border-radius: 3px;
    }

        .SearchDIV.ValidationNote:before {
            content: "\F071";
            font-family: 'FontAwesome';
            font-size: 22px;
            display: inline-block;
            vertical-align: middle;
            color: #206e87;
        }

    /******************** Study Group Moderators *****************/
    .StudyGroupModerator {
        display: block;
    }

        .StudyGroupModerator:last-child {
            margin-bottom: 9px;
        }

        .StudyGroupModerator:before {
            content: '\f007';
            font-family: 'FontAwesome' !important;
            font-size: 13px;
            display: inline-block;
            margin-right: 7px;
        }

    /************************** Survey Style ****************************/
    .survey-container {
        background: #fff;
        border: 1px solid #eee;
        box-shadow: 0px 0px 2px rgba(224, 224, 224, 0.5);
    }

    .survey-question {
        border-bottom: 1px solid #eee;
        padding: 15px;
        color: #206e87 !important;
        font-weight: bold;
    }

        .survey-question:before {
            font-family: FontAwesome !important;
            font-size: 17px;
            margin-bottom: 7px;
            color: #206e87;
            display: inline-block;
            content: "\f059";
            font-weight: normal;
            margin: 0 6px 0 0;
        }

    .survey-answer {
        padding: 15px;
    }

        .survey-answer ul {
            list-style: none;
            padding: 0;
            margin: 0 0 0 20px;
        }

            .survey-answer ul li {
                padding: 2px 0;
            }

                .survey-answer ul li .jqTransformRadioWrapper + label,
                .survey-answer ul li .jqTransformCheckboxWrapper + label,
                .survey-answer ul li span[disabled="disabled"] + label {
                    font-weight: normal;
                    color: #777;
                }

                .survey-answer ul li .jqTransformRadioWrapper {
                    margin-top: 4px;
                }

    .survey-temp {
        border: 1px solid #ddd;
        background: #eee;
        padding: 5px;
        text-align: center;
        color: #777;
        min-height: 50px;
    }

    /************************** Generic user Style ****************************/
    .generic-assessment-Widget .box-body {
        max-height: 300px;
        overflow: auto;
    }

    .assessment-title,
    .assessment-time,
    .assessment-location {
        display: block;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .assessment-title {
        color: #206e87;
        font-size: var(--font-14, 14px);
    }

    .assessment-time {
        color: #999;
        font-size: var(--font-12, 12px);
    }

    .assessment-location {
        color: #7c7c7c;
        font-weight: bold;
        font-size: var(--font-13, 13px);
    }

        .assessment-location:before {
            font-family: FontAwesome !important;
            font-size: 17px;
            margin-bottom: 7px;
            content: "\f041";
            color: #206e87;
            display: inline-block;
        }

    .assessment-details-container {
        display: table;
        text-align: right;
    }

        .assessment-details-container .itg_dashboard_dropdown-menu {
            left: auto;
            right: -2px;
            min-width: 100px;
            text-align: center;
            top: 75%;
            /*aibrahim fix bug #42945 26-4-2020*/
        }

    .generic-assessment-Widget .product-list-in-box > .item:last-child {
        /*aibrahim fix bug #42945 26-4-2020*/
        margin-bottom: 20px;
    }

    .assessment-details-container .itg_dashboard_dropdown-menu li a {
        text-align: center;
        font-size: 13px;
        padding: 6px 10px;
    }

    .assessment-details-container .itg_dashboard_dropdown-menu:after,
    .assessment-details-container .itg_dashboard_dropdown-menu:before {
        right: 12px;
        left: auto;
    }

    .assessment-details-container .btn-group {
        display: table-cell;
        width: 30px;
    }

        .assessment-details-container .btn-group button i {
            color: #206e87;
            font-size: 18px;
        }

        .assessment-details-container .btn-group.open .dropdown-toggle {
            -webkit-box-shadow: none;
            box-shadow: none;
        }

    .assessment-details-container a.aspNetDisabled {
        color: #888;
    }

        .assessment-details-container a.aspNetDisabled:hover {
            color: #888;
            text-decoration: none;
        }

    .assessment-details {
        margin: 0;
        padding: 0;
        text-align: right;
        display: inline-block;
        display: flex;
        /*fix issue no 47834 aibrahim 6/8/2020 */
        list-style: none;
    }

        .assessment-details li {
            /*display: table-cell;*/
            padding: 5px 16px;
            min-width: 100px;
            text-align: center;
            vertical-align: middle;
            flex: 1;
        }

    .generic-assessment-Widget .assessment-details-title {
        color: #888;
        font-size: var(--font-13, 13px);
    }

    .assessment-details-title:before {
        font-family: FontAwesome !important;
        font-size: 14px;
        margin-bottom: 7px;
        color: #206e87;
        display: inline-block;
        content: '';
        margin: 0 5px 0 -10px;
    }

    .Questions .assessment-details-title:before {
        content: "\f29c";
        font-size: 15px;
    }

    .Remaining .assessment-details-title:before {
        content: "\f252";
        font-size: 12px;
    }

    .PassMark .assessment-details-title:before {
        content: "\f00c";
    }

    .Duration .assessment-details-title:before {
        content: "\f017";
    }

    .generic-assessment-Widget .assessment-details-description {
        color: #206e87;
        font-size: 12px;
    }

    #generic-assessment-Widget {
        margin-top: 15px;
    }

    .generic-assessment-Widget .product-list-in-box > .item {
        margin: 0;
        position: relative;
    }

    .generic-assessment-Widget .mCSB_scrollTools {
        right: 4px;
    }

    .generic-assessment-Widget .product-list-in-box > .item:before {
        content: '';
        background: #206e87;
        position: absolute;
        left: 0;
        top: 0;
        height: 100%;
        width: 3px;
        display: block;
    }

    .generic-assessment-Widget .product-list-in-box > .item.notcorrected:before {
        content: '';
        background: #206e87;
    }

    .generic-assessment-Widget .product-list-in-box > .item.finishd:before {
        content: '';
        background: #129f26;
    }

    .generic-assessment-Widget .product-list-in-box {
        min-height: 130px;
    }

        .generic-assessment-Widget .product-list-in-box > .item {
            border-bottom-color: #ddd;
        }

    .generic-assessment-Widget .box-body {
        padding: 0;
    }

    .generic-assessment-Widget .itg_dashboard_knob {
        font-size: 10px !important;
    }

    .coursepage .generic-assessment-Widget .box-header.with-border {
        padding: 13px 10px;
    }

    .generic-assessment-Widget .box-header > .box-tools {
        top: 14px;
    }

    .generic-assessment-Widget .box-header .RadComboBox_Default {
        margin-top: 3px;
    }

    /**** E-ssessment result ****/
    .generic-assessment-Widget .Points .assessment-details-title:before {
        content: "\f295";
        font-size: 15px;
    }

    .generic-assessment-Widget .Result .assessment-details-title:before {
        content: "\f00c";
        font-size: 12px;
    }

    .generic-assessment-Widget .Learning-Objects .assessment-details-title:before {
        content: "\f15c";
    }

    .generic-assessment-Widget .Books .assessment-details-title:before {
        content: "\f02d";
    }

    .e-assessment-result {
        margin-bottom: 20px;
    }

        .e-assessment-result .assessment-details li {
            min-width: 120px;
            word-break: break-word;
        }

        .e-assessment-result .assessment-details-container {
            padding-right: 0;
        }

        .e-assessment-result .assessment-title {
            margin-top: 7px;
        }

    .assessment-details-title b {
        font-weight: normal !important;
    }

    .e-assessment-result .assessment-details-description {
        margin-top: 6px;
        line-height: 15px;
        display: block;
    }

    .generic-assessment-Widget.e-assessment-result .product-list-in-box > .item::before {
        width: 4px;
    }

    .generic-assessment-Widget.e-assessment-result .product-list-in-box {
        border: 1px solid #ddd;
        border-left: none;
    }

    .e-assessment-result .assessment-details li {
        vertical-align: top;
    }

    .e-assessment-result .assessment-title {
        overflow: visible;
        white-space: inherit;
        text-overflow: inherit;
    }

    .color-blue {
        color: #206e87;
    }

    @media (min-width: 1050px) {
        .e-assessment-result .assessment-details li {
            min-width: 120px;
            max-width: 160px;
        }
    }

    @media (max-width: 1050px) {
        .e-assessment-result .assessment-details-container {
            width: 100%;
        }

        .e-assessment-result .assessment-details {
            text-align: left;
            width: 100%;
        }
    }

    @media (max-width: 1030px) {
        .e-assessment-result .assessment-details {
            display: flex;
            flex-wrap: wrap;
            margin-left: 15px;
        }

            .e-assessment-result .assessment-details li {
                padding: 10px;
                border: 1px solid #ddd;
                flex-direction: row;
                flex: 0 24%;
            }
    }

    @media (max-width: 768px) {
        .e-assessment-result .assessment-details li {
            flex: 0 32%;
        }

            .e-assessment-result .assessment-details li:nth-child(4),
            .e-assessment-result .assessment-details li:nth-child(5),
            .e-assessment-result .assessment-details li:nth-child(6),
            .e-assessment-result .assessment-details li:nth-child(7) {
                border-top: 0;
            }
    }

    @media (max-width: 590px) {
        .generic-assessment-Widget .box-header > .box-tools {
            position: relative;
            top: 0;
            margin: 12px 12px 0;
        }

        .generic-assessment-Widget .assessment-details-container {
            display: inherit;
            position: initial;
            margin-top: 10px;
        }

        .generic-assessment-Widget .btn-group, .btn-group-vertical {
            position: absolute;
            right: 0px;
            top: 0px;
        }

        .assessment-details li.assessment-grade {
            position: absolute;
            top: 0;
            right: 30px;
        }

        .btn-group > .btn:first-child {
            margin-left: 0;
            padding: 10px 0;
        }

        .finishd .assessment-title, .finishd .assessment-time, .finishd .assessment-location {
            padding-right: 125px;
        }

        .generic-assessment-Widget .product-list-in-box > .item {
            margin: 0;
            position: relative;
            border-bottom-color: #ddd;
        }

        .assessment-details-grade span {
            font-size: var(--font-12, 12px);
        }

        /*** e-assessment-result **/
        .e-assessment-result .assessment-details li {
            word-wrap: break-word;
            max-width: 48%;
        }

            .e-assessment-result .assessment-details li:nth-child(3),
            .e-assessment-result .assessment-details li:nth-child(4),
            .e-assessment-result .assessment-details li:nth-child(5),
            .e-assessment-result .assessment-details li:nth-child(6),
            .e-assessment-result .assessment-details li:nth-child(7) {
                border-top: 0;
            }

            .e-assessment-result .assessment-details li:nth-child(8) {
                /*min-width: 96%;
    border-top: 0;*/
            }

        .e-assessment-result .assessment-details li {
            flex: 0 50%;
        }
    }

    @media (max-width: 450px) {
        .assessment-details {
            display: flex;
            width: 100%;
            flex-wrap: wrap;
        }

            .assessment-details li {
                /*display: flex;*/
                padding: 10px;
                border: 1px solid #ddd;
                flex-direction: row;
                flex: 0 50%;
            }

                .assessment-details li.assessment-grade {
                    border: none;
                }

        .assessment-title, .assessment-time, .assessment-location {
            display: block;
            overflow: hidden;
            white-space: inherit;
            text-overflow: inherit;
        }
    }

    @media (max-width: 320px) {
        .assessment-details {
            display: block;
            width: 100%;
        }

        .e-assessment-result .assessment-details li {
            flex: 0 100%;
            max-width: 94%;
        }

        .assessment-details li {
            display: block;
            flex: 0;
        }

            .assessment-details li.assessment-grade {
                border: none;
                position: inherit;
            }

        .finishd .assessment-title, .finishd .assessment-time, .finishd .assessment-location {
            padding-right: 0;
        }

        .assessment-details-container .btn-group > .btn:first-child {
            padding: 10px 0px;
        }
    }
    /****************** New people Structure *****************/
    .PeopleCoursePeriod {
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        width: 100%;
    }

        .PeopleCoursePeriod .userSmallInfo {
            width: 33%;
            display: flex;
            margin-right: .3%;
        }

            .PeopleCoursePeriod .userSmallInfo h2 span {
                font-size: var(--font-17, 17px);
                font-weight: bold;
                color: #666 !important;
            }

        .PeopleCoursePeriod .jqTransformCheckboxWrapper + label {
            flex: initial;
            display: block;
            width: calc(100% - 47px);
        }

        .PeopleCoursePeriod [id*="lblClassValue"] {
            word-wrap: break-word;
            display: block;
            max-width: 132px;
        }

        .PeopleCoursePeriod > span.jqTransformCheckboxWrapper {
            margin-left: 13px;
        }

    .col-md-7.coursepagecontent .PeopleCoursePeriod .userSmallInfo {
        width: 49.5%;
        display: flex;
        margin-right: .5%;
    }

    @media (max-width: 1200px) {
        .PeopleCoursePeriod .userSmallInfo {
            width: 49%;
        }
    }

    @media (max-width: 700px) {
        .col-md-7.coursepagecontent .PeopleCoursePeriod .userSmallInfo,
        .PeopleCoursePeriod .userSmallInfo {
            width: 100%;
        }
    }
    /****************** Folder Widget *****************/
    #FolderListContainer {
        text-align: center;
        margin: 15px 0;
        min-height: 170px;
    }

        #FolderListContainer span.jqTransformCheckboxWrapper {
            position: absolute;
            z-index: 10;
        }

        #FolderListContainer img[id*="ImgObject"] {
            margin-bottom: 5px;
        }

        #FolderListContainer td {
            position: relative;
        }

    .folder-wedgit-header {
        color: #333;
        background-color: #f8f8f8;
        border: 1px solid #ddd;
        padding: 3px 10px;
        margin: 0 0;
        min-width: 100%;
        vertical-align: middle;
        line-height: 25px;
        border-radius: 8px;
    }

        .coursesWidget .products-list .folder-wedgit-header div a,
        .folder-wedgit-header div a {
            display: inline-block;
        }

        .folder-wedgit-header > a,
        .folder-wedgit-header > div {
            display: inline-block;
        }

    .folder-DeleteAllItems,
    .folder-SelectItems,
    .folder-wedgit-add {
        position: relative;
        width: 40px !important;
        cursor: pointer;
        padding: 0 10px;
        float: right;
    }

        folder-DeleteAllItems:before,
        .folder-SelectItems:before {
            font-family: FontAwesome !important;
            content: "\f046";
            display: block;
            color: #206e87;
            font-size: 19px;
            text-align: center;
            margin: 1px 0;
        }

    .folder-EditItems,
    .folder-DeleteItems {
        display: inline-block;
        margin: 0 10px;
    }

        .folder-DeleteAllItems:before,
        .folder-EditItems:before,
        .folder-DeleteItems:before {
            font-family: FontAwesome !important;
            content: "\f044";
            display: block;
            color: #afafaf;
            font-size: 17px;
            text-align: center;
            margin: 1px 0;
            width: 30px;
            height: 30px;
        }

        .folder-DeleteItems:before {
            content: "\f1f8";
        }

        .folder-DeleteItems:hover:before {
            color: #bd1123;
        }

        .folder-EditItems:hover:before {
            color: #206e87;
        }

    .folder-DeleteAllItems:before {
        content: "\f1f8";
        color: #bd1123;
    }

    .add-folder.folder-wedgit-add:after,
    .add-folder.folder-wedgit-add:before {
        font-family: FontAwesome !important;
        content: "\f07b";
        display: block;
        color: #206e87;
        font-size: 19px;
        text-align: center;
        margin: 1px 0;
    }

    .add-folder.folder-wedgit-add:after {
        content: "\f067";
        font-size: 10px;
        position: absolute;
        top: -8px;
        right: 5px;
    }

    .fab-icon-btn a {
        width: 42px;
        height: 42px;
        background: #206e87;
        color: #fff;
        padding: 8px 10px;
        display: block;
        border-radius: 50%;
        margin-bottom: 10px;
        position: relative;
    }

        .fab-icon-btn a:before,
        .btnOpenAddFromExistingPopup:after {
            font-family: FontAwesome !important;
            content: "\f0ee";
            display: block;
            color: #fff;
            font-size: 19px;
            text-align: center;
        }

        .fab-icon-btn a.btnOpenAddZipFileResourcesPopup:before {
            content: "\f1c6";
        }

        .fab-icon-btn a.btnOpenAddFolderResourcesPopup:before {
            content: "\f07b";
        }

        .fab-icon-btn a.btnOpenAddFromExistingPopup:before {
            content: "\f03a";
            font-size: 16px;
            margin: 4px 3px -3px 1px;
        }

        .fab-icon-btn a.JoinCourseByCode:before {
            content: "" !important;
        }

        .fab-icon-btn a.addNewCourse:before,
        .fab-icon-btn a.addNewAssessment:before,
        .fab-icon-btn a.addNewAssignment:before {
            content: "";
            font-size: 16px;
            margin: 1px 4px -2px -1px;
        }

        .fab-icon-btn a.addNewCourse i,
        .fab-icon-btn a.addNewAssessment i,
        .fab-icon-btn a.addNewAssignment i {
            content: "\f067";
            font-size: 10px;
            position: absolute;
            top: 11px;
            right: 10px;
            text-shadow: -2px 1px 0px #206e87;
            z-index: 1;
        }

        .fab-icon-btn a.addNewAssessment::before {
            content: "\f059";
        }

        .fab-icon-btn a.addNewAssignment::before {
            content: "\f0c5";
        }

    .btnOpenUploadPopup:before {
        line-height: 26px;
    }

    .fab-icon-btn a:after,
    .btnOpenUploadPopup:after {
        content: '';
        display: block;
        border: 1px dashed #fff;
        position: absolute;
        width: 36px;
        height: 36px;
        top: 3px;
        left: 3px;
        border-radius: 50%;
    }

    .fab-icon-btn a.btnOpenAddFromExistingPopup i {
        content: "\f067";
        font-size: 10px;
        position: absolute;
        top: 11px;
        right: 8px;
        color: #fff;
    }

    .DataListItems {
        min-height: 270px;
    }

    #FolderListContainer .DataListItems {
        min-height: auto;
    }

    .fab-container * {
        margin: 0;
        padding: 0;
    }

    .fab-container {
        position: absolute;
        bottom: 10px;
        right: 10px;
        z-index: 999;
        cursor: pointer;
    }

    .fab-open-btn,
    .fab-icon-btn {
        width: 42px;
        height: 42px;
        border-radius: 100%;
        transition: all ease-in-out .4s;
        position: relative;
    }

        .fab-open-btn:hover {
            opacity: 0.8;
        }

    .open-fab .fab-open-btn {
        transform: rotate(45deg);
        background: #2e95b7;
    }

    .fab-open-btn i {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        font-size: 16px;
        color: #ffffff;
        font-weight: normal;
        margin: 0;
    }

        .fab-open-btn i:before {
            font-family: 'FontAwesome' !important;
            content: "\f067" !important;
        }

    .fab-icon-btn a {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 21px;
        color: #ffffff;
        margin: 0;
    }

    .float-end span {
        color: #206e87 !important;
    }

    .fab-open-btn {
        width: 42px;
        height: 42px;
        background: #016fb9;
        margin: 5px;
    }

    .content.container.col-md-8.coursepage.coursepagecontent {
        border: 0px solid #115c7440;
        border-radius: 0;
        padding: 0;
    }

    .fa-plus:before {
        color: #fff;
        position: relative;
        top: -1px;
        left: 0px;
    }

    #Library-Widget, #course-todoList-Widget {
        /*    padding: 0 5px;*/
    }

    .modal-content .btn {
        color: #206e87 !important;
        border: 1px solid #206e87;
    }

    #Library-Widget {
        padding: 0 10px;
    }

    .fab-options {
        list-style-type: none;
        margin: 0;
        position: absolute;
        bottom: 60px;
        right: 0;
        opacity: 0;
        transition: all 0.3s ease;
        transform: scale(0);
        transform-origin: 85% bottom;
    }

    .open-fab .fab-options {
        opacity: 1;
        transform: scale(1);
    }

    .fab-options li {
        display: flex;
        justify-content: flex-end;
        padding: 7px 5px;
        align-items: center;
    }

    .fab-label {
        padding: 3px 5px;
        align-self: center;
        user-select: none;
        white-space: nowrap;
        border-radius: 3px;
        font-size: 13px;
        background: #666666;
        background: #505050;
        box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 8px;
        color: #ffffff;
        margin-right: 10px;
    }

    .radio-toolbar input[type="radio"]:checked + label {
        background-color: #bbb;
    }

    .roundedRBContainer {
        margin: 13px 5px;
    }

        .roundedRBContainer .jqTransformRadioWrapper + label {
            border: 1px solid #ddd;
            padding: 4px 8px;
            border-radius: 19px;
            padding-left: 24px;
            margin: -8px 14px 0 -25px;
            cursor: pointer;
        }

            .roundedRBContainer .jqTransformRadioWrapper + label.active {
                background: #206e87;
                color: #fff;
            }

        .roundedRBContainer .jqTransformRadioWrapper {
            margin: 3px 5px 0 8px;
        }

    /******************** Folder search and filter ********************/
    .FilterBar-container {
        position: relative;
        /*.RadComboBox_Default .rcbDisabled .rcbInputCell ,
  .RadComboBox_Default .rcbDisabled .rcbArrowCell  {
      background: #eee !important;
  }*/
    }

        .FilterBar-container .RadComboBox .rcbDisabled .rcbReadOnly .rcbArrowCellRight,
        .FilterBar-container .RadComboBox_Default .rcbArrowCellLeft,
        .FilterBar-container .RadComboBox_Default .rcbArrowCellRight,
        .FilterBar-container .RadComboBox .rcbArrowCell a {
            border-color: transparent;
        }

        .FilterBar-container .RadComboBox_Default .rcbInputCell, .FilterBar-container .RadComboBox_Default .rcbArrowCell {
            background: #fff !important;
            border-color: transparent !important;
        }

        .FilterBar-container .RadComboBox .rcbDisabled .rcbArrowCell a {
            background: #eee !important;
        }

        .FilterBar-container .RadComboBox .rcbDisabled .rcbInputCell .rcbInput {
            margin-top: 0;
        }

        .FilterBar-container .RadComboBox_Default .rcbDisabled .rcbInputCell {
            border-color: #ddd !important;
        }

        .FilterBar-container .RadComboBox .rcbDisabled .rcbArrowCell {
            border: none;
            border-right: none;
        }

        .FilterBar-container .RadComboBox .rcbDisabled .rcbReadOnly .rcbArrowCellRight {
            background: #ccc !important;
        }

        .FilterBar-container .RadComboBox .rcbArrowCell a::after {
            position: relative;
            top: 1px;
            display: inline-block;
            font-family: FontAwesome !important;
            font-style: normal;
            font-weight: normal;
            line-height: 1;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            position: absolute;
            content: "\f0d7";
            right: 53%;
            margin-right: -5px;
            text-indent: 0;
            top: 4px;
            font-size: 12px;
            color: #ffffff;
        }

        .FilterBar-container .RadComboBox .rcbDisabled .rcbArrowCell a::after {
            color: #a4a4a4 !important;
        }

        .FilterBar-container .RadComboBox .rcbDisabled {
            filter: alpha(opacity=90);
            opacity: .9;
        }

        .FilterBar-container .RadComboBox .rcbInputCell .rcbInput {
            border: none;
            height: 25px;
        }

        .FilterBar-container .RadComboBox .rcbArrowCell a {
            height: 25px !important;
            background-color: #fff !important;
        }

        .FilterBar-container .RadComboBox .rcbReadOnly {
            border: 1px solid #ccc;
        }

        .FilterBar-container .RadComboBox .rcbArrowCell a::after {
            top: 5px !important;
            font-size: 16px;
            color: #938e95 !important;
        }

        .FilterBar-container .RadComboBox_Default .rcbInputCell,
        .FilterBar-container .RadComboBox_Default .rcbArrowCell {
            background: transparent !important;
        }

        .FilterBar-container .RadComboBox .rcbInputCell {
            height: 26px;
        }

        .FilterBar-container .html-tamplet-content .form-group label {
            font-family: 'Cairo Regular';
            font-size: var(--font-12, 12px) !important;
        }

    [id*="dvLearningPlanPopUpdivDialogDesc"] {
        padding: 0;
    }

        [id*="dvLearningPlanPopUpdivDialogDesc"] iframe {
            widows: 100% !important;
            margin: 0 !important;
        }

    .FilterBar-container.SearchBar input[type="text"] {
        width: 131px !important;
        padding: 3px;
    }

    .FilterBar-container input[type="text"] {
        box-shadow: inset 0px 4px 5px rgba(0, 0, 0, 0.08);
    }

    .RadComboBox .rcbInputCell .rcbInput {
        box-shadow: none;
    }

    .all-filters {
        margin: 5px;
        display: inline-block;
    }

    .FilterBar-content {
        background: #eee;
        border: 1px solid #ccc;
        padding: 13px 5px;
        margin: 12px 16px 10px;
    }

    .SearchBar .FilterBar-content div[class*='col-sm'],
    .SearchBar .FilterBar-content .form-group {
        display: inline-block !important;
        width: auto;
        padding: 0;
        margin-bottom: 0;
    }

        .SearchBar .FilterBar-content .form-group > div[class*='col-sm'] {
            padding: 0 8px;
        }

        .SearchBar .FilterBar-content .form-group label {
            display: none !important;
        }

    .SearchBar .FilterBar-content {
        background: #fff;
        border: 0;
        padding: 12px 15px;
        padding-bottom: 0;
        box-shadow: 0px 3px 2px rgba(0, 0, 0, 0.2);
        margin: -5px -10px 10px;
    }

    .SearchBar .all-filters {
        display: none;
    }

        .SearchBar .all-filters.search-hidden {
            display: inline-block;
        }

    .search-hidden {
        display: none;
    }

    .SearchBar .FilterBar-content div.filter-buttons[class*='col-sm'],
    .SearchBar .filter-buttons {
        display: inline-block;
        margin-bottom: 10px;
    }

    .SearchBar .search-hidden {
        display: inline-block;
        margin: 0 15px;
    }

    .SearchBar .filter-header {
        display: none;
    }

    .SearchBar .FilterBar-content .form-group.search-hidden {
        /*display: none !important;*/
    }

    .SearchBar .FilterBar-content .form-group.search-show {
        display: none !important;
    }

    .filter-header {
        margin: 12px 16px 10px;
    }

    .filter-buttons {
        position: absolute;
        right: 0;
        top: -3px;
        text-align: right;
    }

    .SearchBar .filter-buttons {
        position: relative;
        right: auto;
        top: 0px;
    }

    .FilterBar-container .RadComboBox_Default {
        height: 33px;
    }

    .FilterBar-container.SearchBar .ValidateSearch {
        display: block !important;
        vertical-align: top;
    }

    .FilterBar-container .ValidateSearch {
        display: inline-block !important;
        vertical-align: top;
    }

    .FilterBar-container .col-sm-6:nth-child(2n+2) {
        clear: left;
    }

    .FilterBar-container.SearchBar .col-sm-6:nth-child(2n+2) {
        clear: none;
    }

    @media (max-width: 600px) {
        .FilterBar-content div[class*='col-sm'],
        .SearchBar .FilterBar-content div[class*='col-sm'] {
            width: 100%;
        }

            .SearchBar .FilterBar-content div[class*='col-sm'].responsive-search-show {
                display: none !important;
            }

        .FilterBar-container.SearchBar div[class*='col-sm'].responsive-search-show {
            display: block !important;
        }
    }

    @media (max-width: 480px) {
        .FilterBar-container .ValidateSearch,
        .FilterBar-container.SearchBar .ValidateSearch {
            display: block !important;
        }
    }
    /********* Genral styles ********/
    [id*="dlEducationStage"] ul {
        padding: 0;
    }

    .calendarCalendarDefault {
        z-index: 10004 !important;
    }

    .fa.EditFieldGrid {
        text-align: left;
    }

    /********* Dashboard NEW styles ********/
    .ITGNewDashboard .itg_dashboard_sidechatbox_button, .ITGNewDashboard .itg_dashboard_sidewidget_button, .ITGNewDashboard .itg_dashboard_addwidget_button, .ITGNewDashboard .itg_dashboard_Writepost_button, .ITGNewDashboard .itg_dashboard_Edit_button {
        position: relative;
        bottom: inherit;
        right: 0;
        line-height: 14px;
    }

    .ITGNewDashboard .widgetsbtncontainer ul li {
        line-height: 14px;
    }

    .ITGNewDashboard .box-header > .box-tools .btn {
        padding: 3px 10px;
    }

    .ITGNewDashboard #side-drag-widget {
        bottom: inherit;
    }

    .ITGNewDashboard .widgetsbtncontainer ul {
        margin-top: 0 !important;
    }

    .dashboard-tabs-container .nav-tabs {
        border-radius: 8px !important;
        padding: 7px 10px !important;
    }

    .ITGNewDashboard .itg_dashboard_sidewidget_button {
        display: block;
    }

    .dashboard-tabs-container .nav-tabs {
        margin-top: 0 !important;
    }
    /******************** Main Marquee ***********************/
    .MainMarquee {
        background: #fff;
        padding: 0px 0 5px;
        box-shadow: 0 6px 5px rgba(0, 0, 0, 0.1);
        position: relative;
        z-index: 1031;
        border-top: 1px solid #ddd;
        direction: ltr;
        overflow: hidden;
        /*amr ibrahim 6/8/2020 fix bug no 47883*/
        width: 100%;
        display: none !important;
    }

        .MainMarquee ul {
            visibility: hidden;
            margin: 0;
            padding: 0;
            display: inline-block;
            white-space: nowrap;
        }

            .MainMarquee ul li {
                display: inline-block;
                padding-left: 30px;
                font-size: 11px;
            }

        .MainMarquee span:hover {
            animation-play-state: paused;
        }

        .MainMarquee[data-direction="right"] ul {
            direction: rtl;
        }

    /********************** E-assesmet dragable designe **************************/
    #assessmentDragableContainer {
        width: 100%;
        min-height: 100px;
        margin: 0 auto;
        position: relative;
        display: flex;
        margin-top: 5px;
    }

        #assessmentDragableContainer .nav-tabs > li > a {
            border: none !important;
        }

        #assessmentDragableContainer [id*="dvHeader"] {
            padding: 0px 15px;
        }

        #assessmentDragableContainer [id*="divDuration"] {
            padding: 0 5px;
            float: right;
        }

        #assessmentDragableContainer .assessmentHeader {
            padding: 5px 15px 6px;
            background-color: #206e87 !important;
            width: 101% !important;
        }

        #assessmentDragableContainer.fullWidthAssesment .assessmentHeader {
            background-color: none;
            border-color: none;
        }

    .eduwaveWrapper .assessmentFooter input[type="submit"], .eduwaveWrapper .assessmentFooter input[type="button"] {
        background: #206e87 !important;
    }

    .QuestionNumber, .QuestionGrayHeader {
        background: transparent !important;
        /*color: #fff;*/
    }

    #tdOption2.active, #tdOption1.active, .assessmentButtons a.assessBtn, a.AssessBtns, #tdTTS .record-btns button {
        background: #206e87 !important;
        color: #fff !important;
    }

    a.jqTransformCheckbox:before {
        background-color: #206e87 !important;
    }

    .QuestionContent {
        border: 0px #e3e3e3 solid !important;
    }

    .AssessmentStage .assessmentHeader {
        background: #206e87 !important;
        width: 101% !important;
    }

    .QuestionGrayHeader .MarkReview {
        display: flex !important;
        justify-content: flex-start !important;
        align-items: center !important;
        padding: 0 47px 10px !important;
    }

    #assessment-left-side #tdTTS .record-btns button.btnListen::before {
        color: #fff !important;
    }

    #assessmentDragableContainer #assessment-drag-side {
        position: absolute;
        top: 0;
        height: 100%;
    }

    #assessmentDragableContainer #assessment-right-side, #assessmentDragableContainer #assessment-left-side {
        border: 1px solid #ddd;
        background-color: #ffffff;
        border-radius: 4px;
        /*min-width: 300px;*/
    }

    #assessmentDragableContainer #assessment-left-side {
        left: 0;
        width: calc(60% - 10px);
    }

    #assessmentDragableContainer #assessment-right-side {
        left: 10px;
        width: 40%;
        position: relative;
        min-height: 300px;
    }

    #assessmentDragableContainer #assessment-drag-side {
        left: calc(60% - 10px);
        width: 10px;
        background-color: #eee;
        cursor: move;
        z-index: 1;
    }

        #assessmentDragableContainer #assessment-drag-side:before {
            content: "\f142";
            display: block;
            font-family: 'FontAwesome' !important;
            font-size: 18px;
            text-align: center;
            margin-top: 200px;
            color: #999;
        }

    #assessmentDragableContainer #info {
        text-align: center;
        line-height: 2em;
    }

    #assessmentDragableContainer + .assessmentFooter {
        background: #fff !important;
    }

        #assessmentDragableContainer + .assessmentFooter #ReviewQuestion,
        #assessmentDragableContainer + .assessmentFooter #Previous, #assessmentDragableContainer + .assessmentFooter #Next {
            /*vertical-align: top;
      float: none !important;
      display: inline-block !important;*/
            float: none !important;
            margin-top: -14px;
            display: table-cell !important;
            padding: 0 10px;
        }

        #assessmentDragableContainer + .assessmentFooter #Previous, #assessmentDragableContainer + .assessmentFooter #Next {
            padding: 2px 10px;
        }

        #assessmentDragableContainer + .assessmentFooter #ReviewQuestion {
            margin: 0 10px;
        }

        #assessmentDragableContainer + .assessmentFooter .assessmentButtons {
            /*display: inline-block;
      float: none;*/
        }

        #assessmentDragableContainer + .assessmentFooter ul.assessmentNavigation {
            /*list-style: none;
      width: calc(100% - 60px) !important;
      text-align: center;
      display: inline-block;
      float: none;*/
            list-style: none;
            width: calc(100% - 60px) !important;
            display: inline-block;
            width: auto !important;
        }

        #assessmentDragableContainer + .assessmentFooter [id*="cphPageBody_dvFooter"] {
            text-align: center;
        }

    #assessmentDragableContainer .AssesBoxContent {
        min-height: 37px;
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }

    #assessmentDragableContainer #divMCContainer .AssesBoxContent {
        min-height: auto;
    }

    .assessNext a::after {
        margin-left: 3px !important;
        margin-right: 3px !important;
        transform: rotate(0deg);
    }

    .assessmentNavigation .assessPrev {
        width: 100px;
    }

        .assessmentNavigation .assessPrev a::after {
            content: '';
            border-left: 8px solid #206e87;
            border-top: 6px solid transparent;
            border-bottom: 6px solid transparent;
            border-right: 5px solid transparent;
            display: inline-block;
            width: 11px;
            height: 10px;
            margin-left: 0;
            transform: rotate(180deg);
            margin-top: 0;
            position: absolute;
            top: 4px;
            right: 5px;
        }

    .assessmentNavigation .assessNext a::after {
        content: '';
        border-top: 6px solid transparent;
        border-right: 8px solid #206e87;
        border-bottom: 6px solid transparent;
        display: inline-block;
        width: 11px;
        height: 10px;
        margin-left: 10px;
        margin-left: 0;
        margin-right: 10px;
    }

    .tblCal .tblCalHeader {
        display: flex;
        justify-content: center;
    }

    .assessmentNavigation .assessNext a {
        background: none;
        padding: 0 13px 0 0;
    }

    .filter-buttons a {
        color: #206e87;
    }

    .assessmentNavigation #Previous {
        position: relative !important;
        left: 0;
        top: 0;
        text-transform: uppercase;
    }

    #assessmentDragableContainer .AssesBoxTool > span {
        max-height: 23px;
        display: block;
    }

    #assessmentDragableContainer .tab-content {
        position: absolute;
        height: calc(100% - 35px);
        top: 33px;
        width: 100%;
    }

    #assessmentDragableContainer.fullWidthAssesment #assessment-right-side,
    #assessmentDragableContainer.fullWidthAssesment #assessment-drag-side {
        display: none;
    }

    #assessmentDragableContainer.fullWidthAssesment #assessment-left-side {
        width: 100% !important;
    }

    .assessment-tabs-container {
        border-top: none;
    }

        .assessment-tabs-container .tab-content {
            display: block;
            border: none;
        }

        .assessment-tabs-container .fade {
            display: none;
        }

            .assessment-tabs-container .fade.in {
                display: block;
            }

        .assessment-tabs-container .assessment-tabs-header-item a {
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .assessment-tabs-container .assessment-tabs-header {
            display: flex;
            border-bottom: none;
        }

            .assessment-tabs-container .assessment-tabs-header li {
                float: none;
                flex: 1;
            }

        .assessment-tabs-container .assessment-tabs-header-item {
            border: 1px solid #ddd;
            border-top: none;
            overflow: hidden;
            border-right: 0;
        }

            .assessment-tabs-container .assessment-tabs-header-item a {
                white-space: nowrap;
                overflow: hidden;
                border-top: none;
                padding: 6px 5px;
                text-align: center;
                color: #555;
                font-size: var(--font-14, 14px);
                border-radius: 0;
                margin: 0;
                text-overflow: ellipsis;
            }

                .assessment-tabs-container .assessment-tabs-header-item a:hover, .assessment-tabs-container .assessment-tabs-header-item a:focus {
                    border: none;
                }

            .assessment-tabs-container .assessment-tabs-header-item.itg_dashboard_active {
                border-color: #206e87;
            }

                .assessment-tabs-container .assessment-tabs-header-item.itg_dashboard_active a {
                    background: #206e87;
                    color: #fff;
                    font-weight: normal;
                    margin: 0 !important;
                }

        .assessment-tabs-container .assessment-tabs-content {
            padding: 15px;
        }

    /*********** inlinechoice popup for editor *********/
    .add-button-style {
        padding: 8px 9px 1px;
        -webkit-transition: background-color 0.5s ease-in-out;
        -moz-transition: background-color 0.5s ease-in-out;
        -ms-transition: background-color 0.5s ease-in-out;
        -o-transition: background-color 0.5s ease-in-out;
        transition: background-color 0.5s ease-in-out;
        background-color: #206e87;
        color: #ffffff;
        border: 0 none;
        cursor: pointer;
        outline: 0;
        margin-bottom: 5px;
        font-size: var(--font-13, 13px);
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        -ms-border-radius: 3px;
        border-radius: 3px;
        margin: 1px 3px;
        background: #206e87;
    }

    .delete-button-style {
        padding: 6px 8px 5px;
        -webkit-transition: background-color 0.5s ease-in-out;
        -moz-transition: background-color 0.5s ease-in-out;
        -ms-transition: background-color 0.5s ease-in-out;
        -o-transition: background-color 0.5s ease-in-out;
        transition: background-color 0.5s ease-in-out;
        background-color: #ff543f;
        color: #ffffff;
        border: 0 none;
        cursor: pointer;
        outline: 0;
        margin-bottom: 5px;
        font-size: var(--font-13, 13px);
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        -ms-border-radius: 3px;
        border-radius: 3px;
        margin: 1px 3px;
        background: #ff543f;
    }

        .add-button-style:before,
        .delete-button-style:before {
            font-family: 'FontAwesome' !important;
            font-size: var(--font-14, 14px);
            display: block;
            margin: auto;
            margin-bottom: 5px;
            text-align: center;
            content: "\f067";
        }

        .delete-button-style:before {
            content: "\f014";
            font-size: 18px;
            margin-bottom: 0;
        }

    /*********************** coursesWidget REQ #51383 **********************/
    .coursesWidget.EmptyList .text-right {
        position: absolute;
        top: calc(50% - 40px);
        left: calc(50% - 40px);
        text-align: center;
        right: auto;
        bottom: auto;
    }

        .coursesWidget.EmptyList .text-right .icon-bg {
            width: 80px;
            height: 80px;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 31px;
        }

    /******************* Peoplelist REQ #51476 *******************/
    .peoplelist-chat:before,
    .peoplelist-delete:before {
        font-family: FontAwesome !important;
        content: "\f00d";
        content: "\f014";
        display: block;
        color: #206e87;
        font-size: 18px;
        text-align: center;
        margin: 1px 0;
    }

    .peoplelist-delete:hover:before {
        color: #bd1123;
    }

    .peoplelist-chat::before {
        content: "\f27b";
    }

    .peoplelist-tools {
        min-width: 60px;
    }

        .peoplelist-tools.ImsgButton > div {
            display: inline-block;
            margin: 0 6px;
        }

    /**************** Invite button **************/
    .btn.lbtnInvite {
        display: block;
        width: 100%;
        display: flex;
        justify-content: center;
        background: #206e87;
        color: #fff;
        margin-bottom: 10px;
        text-transform: uppercase;
        border-radius: 8px;
        position: relative;
    }

    .lbtnInvite .invite-icon {
        margin: 0 10px;
        font-size: 18px;
        margin-top: -4px;
    }

    .lbtnInvite:hover {
        background: #138bca;
        color: #fff;
    }

    .ResetCodeBtn:before {
        content: "\f021";
        display: inline-block;
        font-family: FontAwesome !important;
        margin: 0 10px;
    }

    /**************** Tabs Style **************/
    .tabsStyle {
        margin-bottom: 20px;
    }

    ul.nav-tabs {
        padding: 0;
    }

    .tabsStyle .nav-tabs {
        background: #f2f2f2;
        border: none;
        margin-bottom: 6px;
    }

        .tabsStyle .nav-tabs > li > a {
            color: #666;
        }

            .tabsStyle .nav-tabs > li.itg_dashboard_active > a,
            .tabsStyle .nav-tabs > li > a:hover {
                border-color: none;
                background: none;
                color: #206e87;
                box-shadow: 0 3px 0 #206e87;
            }

    .tabsStyle .TitleWithButtons {
        margin-left: 0;
        margin-right: 0;
    }

    /************************************ div Grid style *************************************/
    .setupDivGrid .table {
        margin-bottom: -1px;
        border-collapse: initial !important;
        border-collapse: separate;
    }

    .table {
        display: table;
        width: 100%;
        border-spacing: 0 10px;
        /* cellspacing:poor IE support for  this */
    }

.table-row {
    display: flex;
    width: 100%;
    clear: both;
    box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.08);
    border-radius: 4px;
    overflow: hidden;
    justify-content: space-between;
    align-items: center;
    background-color: #f5f5f5;
    max-height: 70px;
}

    .table-head {
        display: table-row;
        /*width: auto;
  clear: both;
  overflow: hidden;*/
    }

    .table-head-col {
        border: none;
        padding: 15px 28px 3px;
        font-weight: normal;
        color: #206e87;
        position: relative;
        font-size: var(--font-14, 14px);
        display: table-cell;
        min-width: 150px;
    }

        .table-head-col:before {
            content: "";
            display: block;
            position: absolute;
            left: 19px;
            top: 15px;
            height: 18px;
            width: 1px;
            border-left: 1px solid #c4c4c4;
        }

    .noBorder.table-head-col:before,
    .DivGridtoolsTd.table-head-col:before {
        display: none;
    }

    .noBorder.table-head-col,
    .DivGridtoolsTd.table-head-col {
        padding: 15px 20px 4px 20px;
    }

    .table-row-col {
        display: table-cell;
        padding: 13px 20px 13px;
        background: #fff;
        /*vertical-align: middle;*/
    }

    .vertical-middle .table-row-col {
        vertical-align: middle;
    }

    .vertical-middle .input-group.date,
    .setupDivContainer .vertical-middle .form-control {
        margin-bottom: 0;
    }

    .table-row .table-row-col:first-child {
        /*border-radius: 4px 0 0 4px;*/
        border-bottom-left-radius: 4px;
        border-top-left-radius: 4px;
        position: relative;
        overflow: hidden;
    }

        .table-row .table-row-col:first-child:before {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            height: 100%;
            width: 4px;
            background: #206e87;
        }

    .table-row:nth-of-type(2n+1) .table-row-col:first-child:before {
        background: #206e87;
    }

    .table-row .table-row-col:last-child {
        /*border-radius: 0 4px 4px 0;*/
        border-bottom-right-radius: 4px;
        border-top-right-radius: 4px;
        box-shadow: inset 1px 0px 0px #fff;
        /* fix IE shadow with radious issue  */
    }

    .GridviewOptionsIcons {
        text-align: right;
        margin-top: 5px;
        margin-bottom: 0;
        white-space: nowrap;
    }

        .GridviewOptionsIcons li {
            display: inline-block;
            padding: 0 7px;
            width: 27px;
            text-align: center;
        }

            .GridviewOptionsIcons li:last-child {
                padding-right: 0;
            }

            .GridviewOptionsIcons li button::after,
            .GridviewOptionsIcons li a::after {
                font: normal 14px itgIconsFont;
                color: #206e87;
                cursor: pointer;
                position: relative;
                top: 2px;
            }

            .GridviewOptionsIcons li .OptionsIconDelete:after {
                content: "\e90e";
            }

            .GridviewOptionsIcons li .OptionsIconEdit:after {
                content: "\e913";
            }

            .GridviewOptionsIcons li .OptionsIconView:after {
                content: "\e939";
            }

            .GridviewOptionsIcons li .OptionsIconExtirnalLink::after {
                content: "\e922";
            }

    /*.DivsGridContainer .table-row .table-row-col {
    background: #eee;
}*/
    /**** DivsGridContainer ****/
    .DivsGridContainer .table {
        border-collapse: separate;
    }

    .DivsGridContainer .table-row-col {
        background: #f5f5f5;
        vertical-align: top;
    }
.CourseColapsedMenu.CourseColapsedContent .courseContentTabs .table div div .OptionsIconDelete {
    font-size: large !important;
}
.table-row-col.division {
    width: 170px !important;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
}
.DivsGridContainer .table-row {
    box-shadow: none;
/*    margin: 14px 0px;*/
}

        .DivsGridContainer .table-row .table-row-col:last-child {
            box-shadow: inset 1px 0px 0px #f8f8f8;
            /* fix IE shadow with radious issue  */
        }

    .DivsGridContainer .my-custom-scrollbar {
        margin-top: -10px;
    }

    .table.withDatePicker .table-row-col {
        vertical-align: middle;
        padding: 3px 20px 3px;
    }

        .table.withDatePicker .table-row-col .input-group.date {
            margin-bottom: 0;
        }

            .table.withDatePicker .table-row-col .input-group.date .form-control {
                min-width: 110px;
            }

    /**************************************** Grid style End ***********************************/
    .TableGridstyle .TabelGrid {
        border: none;
        margin-bottom: 0;
        width: 100% !important;
        min-width: 100% !important
    }

        .TableGridstyle .TabelGrid > tbody > tr > td {
            background-color: transparent !important;
            color: #777;
            font-size: var(--font-14, 14px);
            padding: 13px 20px 13px;
            border: none;
            position: relative;
            /*            white-space: nowrap;*/
        }
#ctl00_ctl00_cphPageBody_cphPageBody_gvAssessments > tbody > tr > td {
    white-space: nowrap !important;
    padding: 6px 3px 6px !important;
}
#ctl00_ctl00_cphPageBody_cphPageBody_gvAssessments > tbody > tr > th {
    white-space: normal !important;
    
}
/*    .wideGridInDiv .WideGrid > div:has(table.TabelGrid) {
        overflow-x: auto;
    }*/
.TableGridstyle .TabelGrid > tbody > tr > td:first-child:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 4px;
    background: #206e87;
}

    .TableGridstyle .TabelGrid > tbody > tr:nth-of-type(2n+1) > td:first-child:before {
        background: #206e87;
    }

    .TableGridstyle .TabelGrid > tbody > tr {
        background-color: #f8f8f8 !important;
        border-bottom: 10px solid #fff;
    }

        .TableGridstyle .TabelGrid > tbody > tr.tableHeaderCell > th {
            background-color: #fff !important;
            color: #206e87;
            font-size: var(--font-14, 14px);
            border: none;
            padding: 15px 13px 3px 14px;
            font-weight: normal;
            position: relative;
            /*min-width:100px;*/
            white-space: nowrap;
            overflow: visible;
        }

        .TableGridstyle .TabelGrid > tbody > tr.tableHeaderCell > th:before {
            content: "";
            display: block;
            position: absolute;
            left: 10px;
            right:0px !important;
            top: 50%;
            height: 18px;
            width: 1px;
            border-left: 1px solid #c4c4c4;
        }

        .TableGridstyle .TabelGrid > tbody > tr.tableHeaderCell > th.no-border:before {
            display: none;
        }

    .TableGridstyle .TabelGrid tr th a {
        color: #206e87;
    }

    .TableGridstyle .TabelGrid > tbody > tr.tableHeaderCell {
        box-shadow: none;
    }

    .TableGridstyle .TabelGrid > tbody > tr.GridPagination tr {
        background-color: transparent !important;
        border-bottom: none;
    }

    .TableGridstyle .TabelGrid > tbody > tr.GridPagination {
        background-color: transparent !important;
        border-bottom: none;

    }

        .TableGridstyle .TabelGrid > tbody > tr.GridPagination td {
            background: #fff;
            border-bottom: none;
        }

            .TableGridstyle .TabelGrid > tbody > tr.GridPagination td:before {
                display: none;
            }

    .TableGridstyle .TabelGrid > tbody > tr[merge="MergeRow"] {
        border-bottom: 0px;
    }

    .TableGridstyle [merge="MergeRow"] + tr td:before {
        display: none;
    }

    .TableGridstyle .RadComboBox table td.rcbArrowCell {
        padding: 0;
        border-width: 0;
        position: relative !important;
    }

    .TableGridstyle .TabelGrid > tbody > tr[merge="MergeRow"],
    .TableGridstyle .TabelGrid > tbody > tr[merge="MergeRow"] + tr {
        background-color: rgba(0, 173, 213, 0.07) !important;
    }

        .TableGridstyle .TabelGrid > tbody > tr[merge="MergeRow"] > td:first-child::before {
            background: #00add5 !important;
        }

    .TableGridstyle .GridPagination table {
        margin: auto;
    }

    .TableGridstyle .GridPagination span,
    .TableGridstyle .GridPagination a {
        border-radius: 50%;
    }

    .TableGridstyle .GridPagination span {
        /*background-color: #206e87 ;
  color: #fff;
  box-shadow: 0px 2px 5px rgba(0,0,0,.3);*/
        background-color: #206e87;
        color: #fff;
        box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
        line-height: 18px;
        width: 32px;
        height: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: var(--font-12, 12px);
    }

    .TableGridstyle .GridPagination a {
        color: #777;
        background: none;
    }

        .TableGridstyle .GridPagination a[href*="Page$First"],
        .TableGridstyle .GridPagination a[href*="Page$Last"] {
            color: transparent;
        }

            .TableGridstyle .GridPagination a[href*="Page$Last"]::after,
            .TableGridstyle .GridPagination a[href*="Page$Last"]::before {
                content: "\f105";
                font-family: FontAwesome !important;
                font-size: 17px;
                color: #206e87;
                text-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
                display: inline-block;
            }

            .TableGridstyle .GridPagination a[href*="Page$First"]::after,
            .TableGridstyle .GridPagination a[href*="Page$First"]::before {
                content: "\f104";
                font-family: FontAwesome !important;
                font-size: 17px;
                color: #206e87;
                text-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
                display: inline-block;
            }

    .TableGridstyle .mCSB_container {
        /*fix not X scrolling when data become bigger after pagging*/
        overflow: auto;
    }

    /********************** filter bar new updates 3-11-2021 ***************************/
    .parentFilterBar .SearchBar .FilterBar-content {
        margin: 0 -2px 10px;
    }

        .parentFilterBar .SearchBar .FilterBar-content .col-form-input {
            margin-right: 20px;
        }

    .parentFilterBar .filter-header {
        margin: 0;
        padding: 0;
    }

    .parentFilterBar .filter-buttons {
        top: 13px;
    }

    .parentFilterBar .SearchBar .filter-buttons {
        margin-bottom: 0;
    }

    .parentFilterBar .SearchBar .filter-buttons {
        top: 0;
        float: right;
    }

    .parentFilterBar .TitleWithButtons {
        border: none;
    }

    .fullSearchArea {
        /*    background: #f8f8f8;*/
        padding: 15px;
    }

        .fullSearchArea.SearchBar {
            padding: 0;
            background: #fff;
        }

            .fullSearchArea.SearchBar .FilterBar-content {
                padding: 30px 25px 20px;
                box-shadow: none;
            }

        .fullSearchArea .FilterBar-content {
            background: transparent !important;
            border: none;
            padding: 0;
            margin: 0;
        }

    .parentFilterBar.pageFilterBar {
        margin: -5px -10px 0;
    }

        .parentFilterBar.pageFilterBar .col-form-label .labelsStyle,
        .parentFilterBar .form-group label.col-form-label {
            color: #206e87;
            font-weight: normal;
            font-size: var(--font-14, 14px) !important;
            font-family: 'Cairo Regular';
        }

    .parentFilterBar .col-form-input input[type="text"] {
        background: #fff;
        padding: 5px 10px;
        height: 33px;
        color: #555;
        box-shadow: none;
    }

    .parentFilterBar:not(.pageFilterBar) .col-form-input input[type="text"] {
        width: 85% !important;
    }

    .parentFilterBar .all-filters {
        margin: 5px 20px;
    }

        .parentFilterBar .SearchBar .all-filters.search-hidden,
        .parentFilterBar .all-filters + a {
            margin-right: 15px;
        }

    .PopupFooter input[type="submit"],
    .parentFilterBar input[type="submit"],
    .parentFilterBar input[type="button"] {
        padding: 9px 13px 4px;
        border-radius: 0;
        min-width: 80px;
        padding-top: 5px;
        border-radius: 8px;
    }
    /*.parentFilterBar {
    border: 1px solid #115c7440;
}*/
    .wideGridInDiv.TableGridstyle.paggingWithSave {
        margin-bottom: -74px;
    }

    .PopupFooter {
        text-align: right;
        position: fixed;
        right: 20px;
        bottom: 20px;
        direction: rtl;
        /*padding-bottom: 20px;*/
    }

        .PopupFooter .btnSave {
            width: 47px;
            height: 47px;
            background: #206e87;
            color: #fff !important;
            border: none;
            border-radius: 50%;
            box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);
            opacity: .8;
            display: inline-block;
            text-align: center;
            line-height: 46px;
            margin-bottom: -10px;
        }

            .PopupFooter .btnSave:hover {
                opacity: 1;
            }

            .PopupFooter .btnSave:before {
                position: relative;
                font-family: itgIconsFont;
                font-style: normal;
                font-weight: normal;
                display: inline-block;
                content: "\e92e";
                font-size: 19px;
            }

        .PopupFooter .ValidationNote {
            color: #de1313;
            margin-left: 10px;
            background: #f86363;
            color: #fff;
            padding: 8px 10px;
            border: none;
            border-radius: 4px;
        }

        .PopupFooter input {
            position: relative;
            z-index: 2;
        }

    .parentFilterBar .FilterBar-container .RadComboBox {
        background: #fff;
    }

    .parentFilterBar .form-group {
        margin-bottom: 0;
    }

    .parentFilterBar .FilterBar-container .RadComboBox .rcbArrowCell a::after {
        content: "\f107";
    }

    .parentFilterBar .FilterBar-container:not(.SearchBar) .RadComboBox_Default {
        height: 34px;
    }

    .parentFilterBar:not(.pageFilterBar) .FilterBar-container:not(.SearchBar) .RadComboBox_Default {
        width: 85% !important;
    }

    .parentFilterBar.pageFilterBar table[summary="combobox"] > tbody > tr {
        border: 1px solid #ccc;
    }

    .parentFilterBar .SearchBar.FilterBar-container .RadComboBox_Default {
        max-width: 100% !important;
    }

    .TableGridstyle .TabelGrid > tbody > tr > td span {
        /*    inline-size: 150px;*/
        overflow-wrap: break-word;
        text-wrap: wrap;
    }

    .e31_notifications .slimScrollDiv .notifbox {
        overflow-y: scroll !important;
        scrollbar-width: thin;
    }

    .e31_notifications li.notificationSetting a:after {
        font-size: 17px !important;
        top: -15px;
        right: 0;
        margin: 0 -60px;
    }
    /*#courseReportsWidget, #latestPostsWidget {
    padding: 0;
}*/
    .wideGridInDiv .WideGrid .TabelGrid tr td span {
        /*    inline-size: 150px;*/
        overflow-wrap: break-all;
        text-wrap: wrap;
        /*    word-break: break-all;*/
        width: auto !important;
    }

    .parentFilterBar .FilterBar-container .RadComboBox .rcbArrowCell a {
        height: 32px !important;
    }

    .parentFilterBar .FilterBar-container .RadComboBox .rcbInputCell .rcbInput {
        height: 32px !important;
        padding: 10px !important;
    }

    .parentFilterBar .fullSearchArea.SearchBar .col-form-input input[type="text"] {
        width: 100% !important;
    }

    .parentFilterBar .SearchBar .row.html-tamplet-content {
        margin: 0 !important;
    }

    .FilterBar-container .RadComboBox .rcbArrowCell a::after {
        top: 5px !important;
        font-size: 20px;
    }

    .wideGridInDiv .WideGrid {
        max-width: 100% !important;
        overflow: visible;
        /*    overflow-x: auto;*/
        max-height: inherit;
        /*    padding-bottom: 0;*/
        padding-top: 0;
    }

    .fullSearchAreaBottom {
        padding: 15px 15px;
        padding-bottom: 0;
    }

        .fullSearchAreaBottom .WideGrid {
            margin: 0
        }

        .fullSearchAreaBottom .TitleStyle,
        .fullSearchAreaBottom .TitleWithButtons .TitleStyle {
            font-size: var(--font-16, 16px);
        }

    .parentFilterBar.pageFilterBar .fullSearchAreaBottom {
        padding: 15px 15px;
    }

    .eduwaveWrapper .parentFilterBar.pageFilterBar .FilterBar-container table td {
        vertical-align: middle;
    }

        .eduwaveWrapper .parentFilterBar.pageFilterBar .FilterBar-container table td .CalendarImage {
            vertical-align: top;
            padding: 5px 3px 0;
            position: relative;
        }

    /*
.eduwaveWrapper .parentFilterBar.pageFilterBar .FilterBar-container table td .CalendarImage img{
    opacity:0;
}
.eduwaveWrapper .parentFilterBar.pageFilterBar .FilterBar-container table td .CalendarImage:before{
    font-family: 'FontAwesome' !important;
    font-size: 18px;
    display: block;
    margin: auto;
    margin-bottom: auto;
    margin-bottom: 5px;
    text-align: center;
    content: "\f073";
    position:absolute;
    color: #206e87 ;
    margin: 0 7px;
}
*/
    .fullSearchAreaBottom .TitleWithButtons {
        border: none;
    }

    .FilterBar-container .FilterBar-content input::placeholder {
        /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #fff;
        opacity: 1;
        /* Firefox */
    }

    .FilterBar-container .FilterBar-content input:-ms-input-placeholder {
        /* Internet Explorer 10-11 */
        color: #fff;
    }

    .FilterBar-container .FilterBar-content input::-ms-input-placeholder {
        /* Microsoft Edge */
        color: #fff;
    }

    .FilterBar-container.SearchBar .FilterBar-content input::placeholder {
        /* Chrome, Firefox, Opera, Safari 10.1+ */
        color: #777;
        opacity: 1;
        /* Firefox */
    }

    .FilterBar-container.SearchBar .FilterBar-content input:-ms-input-placeholder {
        /* Internet Explorer 10-11 */
        color: #777;
    }

    .FilterBar-container.SearchBar .FilterBar-content input::-ms-input-placeholder {
        /* Microsoft Edge */
        color: #777;
    }

    .parentFilterBar .col-form-input-wrapper .jqTransformRadioWrapper + label {
        float: left;
    }

    .parentFilterBar .col-form-input-wrapper .jqTransformCheckboxWrapper + label {
        float: left;
    }

    .parentFilterBar .col-form-input-wrapper [class*="col-sm"] {
        width: auto;
        margin-right: 20px;
        padding: 0;
    }

    .parentFilterBar #lblSearchCriteria {
        margin-top: 20px;
        margin-bottom: 10px;
    }

    .parentFilterBar [id*="ucAssessmentPool_dvAssessmentMode"] {
        margin-bottom: 20px;
        margin-top: 10px;
    }

    .parentFilterBar .TitleStyle, .parentFilterBar .TitleWithButtons .TitleStyle {
        font-size: var(--font-16, 16px);
        font-weight: normal;
        color: #206e87;
        display: block;
    }

    /*.TableGridstyle .TabelGrid a[href*="DoPostBackWithOptions"] {
     overflow: hidden;
     text-indent: -9999;
     &:before{
         font-family: 'itgIconsFont' !important;
         content: "\e90b";
         font-size: 9px;
         color: #206e87 ;
         text-indent: 0;
     }
 }*/
    /***************************** checkbox and radiobutton new styles 15/3/2021 ****************************/
    /*.parentFilterBar a.jqTransformCheckbox {
    box-shadow: none;
    border: none;
    background: none;
    width: 19px;
    height: 19px;
}

    .parentFilterBar a.jqTransformCheckbox::before {
        display: none;
    }

    .parentFilterBar a.jqTransformCheckbox::after {
        font-family: itgIconsFont;
        font-style: normal;
        font-weight: normal;
        color: #a4a4a4;
        display: inline-block;
        content: "\e933";
        font-size: 15px;
        position: relative;
        top: -2px;
    }

    .parentFilterBar a.jqTransformCheckbox.jqTransformChecked::after {
        content: "\e909";
        color: #206e87 ;
    }

.parentFilterBar .jqTransformRadioWrapper + label,
.parentFilterBar .jqTransformCheckboxWrapper + label {
    font-weight: normal;
}
*/
    a.jqTransformCheckbox {
        position: relative;
        top: 5px;
    }
    /************ Dialog popup style 3-11-2021 ************/
    .DialogTitle, .align_right {
        color: #fff;
        line-height: 28px;
    }

    .OverMaskDialog .align_right a::after {
        font-family: 'itgIconsFont' !important;
        content: "\e90b";
        font-size: 9px;
        position: absolute;
        top: 7px;
        right: 2px;
        color: #206e87;
        text-indent: 0;
        z-index: 1;
        padding: 5px;
        background: #fff;
        border-radius: 50%;
        font-weight: normal;
        width: 26px;
        height: 26px;
        line-height: 17px;
        text-align: center;
        visibility: initial;
    }

    .OverMaskDialog .align_right a {
        visibility: hidden;
    }

    .OverMaskDialog .align_right a {
        width: 35px;
        line-height: 14px;
        height: 35px;
        text-align: center;
        top: 3px;
    }

    .OverMaskDialog .DialogTitle {
        vertical-align: middle;
        padding: 0 15px;
        font-weight: normal;
    }

    #divPopupDialogContent .OverMaskDialog {
        border-radius: 10px;
        overflow: hidden;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    }
#divPopupDialogContent div[id*="divSelefAssessment"] {
    top: 10% !important;
}
.DialogDesc iframe {
    border: none;
}
@media (max-width: 1400px) {
    .TableGridstyle .TabelGrid > tbody > tr.tableHeaderCell > th, .TableGridstyle .TabelGrid > tbody > tr.tableHeaderCell > th a {
        font-size: 12px !important;
    }
}

    @media (max-width: 1000px) {
        .TableGridstyle .TabelGrid > tbody > tr.tableHeaderCell > th {
            font-size: 12px;
        }

        #divPopupDialogContent .OverMaskDialog {
            position: fixed !important;
            top: 20px !important;
            width: calc(100% - 40px) !important;
            inset: 20px !important;
            height: 300px !important;
        }
    }
    /*************** Leader Board Widget***************/
    .leaderBoardWidget .product-list-in-box > .item {
        border-bottom: none;
    }

    .leaderBoardWidget .products-list a {
        display: flex;
        align-items: center;
    }

    .leaderBoardWidget .products-list .product-info {
        margin-left: 10px;
        width: 100%;
        display: inline-flex;
        flex: 1;
        width: calc(100% - 120px);
        overflow: hidden;
    }

    .leaderBoardWidget .product-img {
        width: 40px;
        float: none;
        flex: 1;
        max-width: 40px;
    }

    .leaderBoardWidget .products-list .product-img img {
        width: 40px;
        height: 40px;
    }

    .leaderBoardWidget .tabsStyle {
        margin-bottom: 0;
    }

    .leaderBoardWidget .product-img.badge-icon {
        width: 20px;
        max-width: 20px;
        background: url("../../images/Badges/leader-padge.png");
        background-size: 20px 26px;
        height: 26px;
        position: relative;
        background-repeat: no-repeat;
        margin-right: 10px;
    }

        .leaderBoardWidget .product-img.badge-icon span {
            position: absolute;
            top: 0;
            left: 0;
            font-size: 11px;
            color: #fff;
            width: 20px;
            line-height: 18px;
            text-align: center;
            height: 18px;
        }

    .leaderBoardWidget .product-title {
        font-weight: normal;
        white-space: nowrap;
    }

    .leaderBoardWidget .product-title {
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .leaderBoardWidget .label {
        margin-top: 4px;
        margin-left: auto;
        font-weight: normal;
        color: #2e95b7 !important;
        font-size: var(--font-13, 13px);
        font-family: 'Cairo Regular';
    }

    .leaderBoardWidget.mainLeaderBoard .products-list {
        display: flex;
        flex-wrap: wrap;
    }

    .leaderBoardWidget.mainLeaderBoard .product-list-in-box > .item {
        width: 48%;
        margin-right: 4%;
    }

        .leaderBoardWidget.mainLeaderBoard .product-list-in-box > .item:nth-of-type(2n) {
            margin-right: 0;
        }

    .box-body .nav-tabs {
        margin: -10px -10px 10px;
    }

    /******************** MergeCells ******************/
    .wideGridInDiv .MergeCells:before {
        display: none;
    }

    .wideGridInDiv .TableRowStyle.MergeRows {
        border-bottom: none;
    }

        .wideGridInDiv .TableRowStyle.MergeRows + .TableGrayRowStyle {
            border-top: 10px solid #fff;
        }

    /***************** Voice recording styles *****************/
    #VCContainer {
        position: relative;
    }

        #VCContainer img {
            opacity: 0;
            position: relative;
            z-index: 2;
            width: 25px;
            height: 25px;
        }

        #VCContainer .VCMicIcon {
            position: absolute;
            top: 0;
            left: 0;
        }

            #VCContainer .VCMicIcon::before {
                font-family: 'FontAwesome' !important;
                font-size: 16px;
                display: block;
                margin: auto;
                text-align: center;
                content: "\f130";
                font-weight: normal;
                width: 21px;
                height: 22px;
                background: white;
                border-radius: 4px;
                color: #206e87;
                position: relative;
                top: 5px;
            }

        #VCContainer #stopBtn[style="display: initial;"] + .VCMicIcon::before {
            color: red;
        }

        #VCContainer #statusDiv {
            position: absolute;
            top: 31px;
            z-index: 1100;
            left: -22px;
            font-size: var(--font-12, 12px);
            font-weight: normal;
            background: #fff;
            padding: 2px 8px !important;
            border-radius: 4px;
            box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
            text-align: center;
        }

        #VCContainer .msg {
            position: absolute;
            top: 31px;
            z-index: 1100;
            left: -40px;
            color: #11a313 !important;
            font-size: var(--font-12, 12px);
            font-weight: normal;
            background: #fff;
            padding: 2px 8px !important;
            border-radius: 4px;
            box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
            text-align: center;
            width: 100px;
        }

            #VCContainer #statusDiv:empty,
            #VCContainer .msg:empty {
                display: none;
            }

    /******************/
    .tblCal .dv-lists .fab-open-btn {
        background: #555;
    }

        .tblCal .dv-lists .fab-open-btn i {
            font-size: 12px;
            font-weight: bold;
        }

    .tblCal .dv-lists .TStyle {
        position: relative;
    }

    .tblCal .dv-lists .fab-container {
        top: -6px;
        bottom: auto;
        right: -6px;
    }

    .tblCal .dv-lists .fab-options {
        bottom: auto;
        top: 32px;
        right: -7px;
        transform-origin: 85% top;
    }

    .tblCal .dv-lists .fab-open-btn {
        width: 20px;
        height: 20px;
    }

    .tblCal .dv-lists .fab-options li {
        padding: 4px 5px;
    }

    .tblCal .dv-lists .fab-icon-btn a::after, .tblCal .dv-lists .btnOpenUploadPopup::after {
        width: 30px;
        height: 30px;
    }

    .tblCal .dv-lists .fab-icon-btn a {
        width: 36px;
        height: 36px;
    }

    .tblCal .dv-lists .fab-icon-btn {
        width: 36px;
        height: 36px;
    }

        .tblCal .dv-lists .fab-icon-btn a::before, .tblCal .dv-lists .btnOpenAddFromExistingPopup::after {
            font-size: 15px;
        }

        .tblCal .dv-lists .fab-icon-btn a.btnOpenAddFromExistingPopup::before {
            margin: 1px 3px -3px 1px;
        }

        .tblCal .dv-lists .fab-icon-btn a.btnOpenAddFromExistingPopup i {
            top: 8px;
            text-shadow: -1px 1px 0px #206e87;
        }

        .tblCal .dv-lists .fab-icon-btn a.addNewCourse i,
        .tblCal .dv-lists .fab-icon-btn a.addNewAssessment i,
        .tblCal .dv-lists .fab-icon-btn a.addNewAssignment i {
            content: "\f067";
            font-size: 9px;
            position: absolute;
            /* top: 7px;
  right: 8px; */
            text-shadow: -1px 1px 0px #206e87;
            z-index: 1;
            color: #fff;
            font-size: 9px;
            top: 8px;
            right: 9px;
        }

        .tblCal .dv-lists .fab-icon-btn a.addNewCourse i,
        .tblCal .dv-lists .fab-icon-btn a.addNewAssessment i,
        .tblCal .dv-lists .fab-icon-btn a.addNewAssignment i {
            /* font-size: 10px; */
            font-size: 8px;
        }

        .tblCal .dv-lists .fab-icon-btn a.addNewAssessment::before {
            font-size: 19px !important;
            /* margin: 0px 4px -2px -1px; */
            margin: 0px 2px -2px -1px;
        }

        .tblCal .dv-lists .fab-icon-btn a.addNewAssignment::before {
            font-size: 16px !important;
            margin: 0px 2px -2px -2px;
        }

        .tblCal .dv-lists .fab-icon-btn a.addNewAssignment i {
            right: 10px;
            top: 7px;
        }

    .courses-content .fab-container {
        position: absolute;
        position: sticky;
        text-align: right;
        margin-top: -20px;
    }

    .wideGridInDiv .WideGrid .TabelGrid tr td {
        /*aibrahim fix bug #59122 27-5-2021*/
        position: relative;
    }

        .wideGridInDiv .WideGrid .TabelGrid tr td:first-child {
            /*aibrahim fix bug #59122 27-5-2021*/
            position: relative;
        }

    .fa-thumbtack.PinIcon {
        font-size: var(--font-15, 15px);
        transform: rotate(45deg);
        color: #206e87;
    }

        .fa-thumbtack.PinIcon.UnPin {
            color: #999;
        }

    /******************************* edu-session multiple course priod add audience*********************************/
    .equal-items-wraper {
        display: flex;
        flex-wrap: wrap;
        margin: 0;
    }

        .equal-items-wraper .btn {
            margin: 6px;
            /* flex: 1; */
            min-width: 70px;
            padding: 7px 11px;
            border-radius: 20px !important;
        }

            .equal-items-wraper .btn.btn-default {
                border-color: #ccc;
                background: #fff !important;
            }

    .coursepagecontent > .tabsStyle > ul {
        /*    margin: -15px -15px 15px;*/
        padding-bottom: 3px;
    }

    .coursepagecontent .tabsStyle .equal-items-wraper {
        display: flex;
        flex-wrap: wrap;
        margin: -15px -15px 10px;
    }

    .equal-items-wraper .btn.btn-primary {
        border-color: #206e87;
        box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.2);
        color: #fff !important;
    }

    .flter-inside-tab.Filter-bar {
        border: none;
        margin: 0px -10px 11px;
    }

    .TitleWithButtons.bo-border {
        border: none;
    }

    .equal-items-wraper.search-area-box {
        /*margin: -5px -10px 10px;*/
    }


    .search-area-box {
        background: #fcfcfc;
        padding: 10px;
        border-bottom: 1px solid #efefef;
        margin-bottom: 15px;
    }

    .no-wrap {
        white-space: nowrap;
    }

    .item-with-image {
        display: flex;
        align-items: center;
    }

        .item-with-image .product-info {
            margin: 0 10px;
        }

    .product-img.small-img {
        width: 30px;
        height: 30px;
        max-width: 30px;
    }

        .product-img.small-img img {
            width: 30px;
            height: 30px;
            max-width: 30px;
        }

    .TableGridstyle .TabelGrid > tbody > tr > td {
        padding: 6px 15px 6px;
        vertical-align: middle;
    }

    .OverMaskDialog {
        height: auto !important;
        min-height: auto !important;
    }

    .dropdown .fa-globe {
        margin: 0 6px !important;
    }
    /*@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic);*/
    /*#72afd2*/
    /*body {
    color: $primary-color;
}*/
    .courseleftSide {
        text-align: center;
        background-color: #fff;
        margin-bottom: 30px;
        border: 1px solid #dddddd;
        /*border-top: 3px solid $primary-color;*/
        /*padding-top: 15px;*/
    }

    .Course-img {
        padding: 0;
        margin: 0;
        max-height: 150px;
        overflow: hidden;
        border-bottom: 1px solid #dddddd;
        cursor: pointer;
        box-shadow: 0px 0px 1px #888;
    }

        .Course-img input {
            max-height: 150px;
            min-height: 100px;
        }

    /*.Course-img input{
    background: transparent url("../ImageWriter.ashx?U1cxaFoyVlVlWEJs0=TWc9PQ2&UTI5MWNuTmxVR1Z5YVc5a1NVUT01=T0RjMw2&VEdGdVozVmhaMlZKUkE9PQ2=TWc9PQ2") no-repeat scroll 0% 0%;
    text-indent: -99999px;
    background-position: center;
    background-size: cover;
}*/
    .StudyTheCourse {
        background-color: #206e87;
        color: #fff;
        border: 1px solid #206e87;
        /*margin-bottom: 20px;*/
        /*margin-bottom: 3px;*/
        cursor: pointer;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        -ms-border-radius: 3px;
        border-radius: 3px;
        -webkit-transition: all 100ms ease-in-out;
        -moz-transition: all 100ms ease-in-out;
        -o-transition: all 100ms ease-in-out;
        -ms-transition: all 100ms ease-in-out;
        transition: all 100ms ease-in-out;
    }

        .StudyTheCourse h5 {
            margin-bottom: 10px;
            font-size: var(--font-13, 13px);
            margin-top: 7px;
        }

        /*.StudyTheCourse:hover .fa-chevron-right {
    transform: translate(7px, 0);
    -webkit-transform: translate(7px, 0);
    -o-transform: translate(7px, 0);
    -moz-transform: translate(7px, 0);
    transition-duration: .7s;
}*/
        .StudyTheCourse:hover {
            background-color: #206e87;
            ;
            color: #fff;
            border: 1px solid #206e87;
        }

    .table.info_postion td {
        position: inherit;
    }

    .StudyTheCourse.CurriculumBuilder:hover {
        /*    height: 45px;*/
    }

    .StudyTheCourse h5 .fa-angle-right:before {
        top: 1px;
        left: 4px;
        position: relative;
        font-size: 19px;
    }

    /*.OtherCourses-menu ul,*/
    .Course-menu-ul {
        padding: 0;
        list-style: none;
        text-align: left;
        margin: 0 -15px;
        border: 1px solid #c8c8ca;
    }

        .Course-menu-ul li:last-child {
            border: none;
        }

        .Course-menu-ul li:nth-child(5n+1) i:before {
            background: #206e87;
        }

        .Course-menu-ul li:nth-child(5n+2) i:before {
            background: #ca5241;
        }

        .Course-menu-ul li:nth-child(5n+3) i:before {
            background: #FFB43B;
        }

        .Course-menu-ul li:nth-child(5n+4) i:before {
            background: #b4c836;
        }

        .Course-menu-ul li:nth-child(5n+5) i:before {
            background: #648191;
        }

        .Course-menu-ul li:nth-child(5n+1):hover a, .Course-menu-ul li:nth-child(5n+1).active a {
            color: #53798f;
        }

        .Course-menu-ul li:nth-child(5n+2):hover a, .Course-menu-ul li:nth-child(5n+2).active a {
            color: #ca5241;
        }

        .Course-menu-ul li:nth-child(5n+3):hover a, .Course-menu-ul li:nth-child(5n+3).active a {
            color: #FFB43B;
        }

        .Course-menu-ul li:nth-child(5n+4):hover a, .Course-menu-ul li:nth-child(5n+4).active a {
            color: #b4c836;
        }

        .Course-menu-ul li:nth-child(5n+5):hover a, .Course-menu-ul li:nth-child(5n+5).active a {
            color: #648191;
        }

        .Course-menu-ul li {
            border-bottom: 1px solid #ccc;
            border-top: 0;
            cursor: pointer;
            font-size: var(--font-13, 13px);
            position: relative;
            display: table;
            width: 100%;
            height: 50px;
        }

            .Course-menu-ul li i {
                font-style: normal
            }
            /*      i{
        font-size: 14px;
        font-weight: bold;
        //vertical-align: middle;
        //padding-bottom: 5px;
        //margin-right: 7px;
        position: absolute;
        top: 0px;
        left: 0px;
        color: #fff;
        width: 100px;
        height: 100;
        padding: 20px;
        font-family: FontAwesome !important;
    }*/
            /**************** Parent menu *******************/
            /***************************/


            .Course-menu-ul li .title {
                vertical-align: middle;
                display: table-cell;
            }

            .Course-menu-ul li i:before {
                position: absolute;
                top: 0px;
                left: 0px;
                color: white;
                display: block;
                font-family: FontAwesome !important;
                width: 50px;
                height: 50px;
                text-align: center;
                vertical-align: middle;
                line-height: 50px;
                font-size: 23px;
                font-style: normal;
                content: '';
            }

            .Course-menu-ul li .fa-coursePosts:before {
                /*background: #1890e3 ;*/
                content: "\F086";
            }

            .Course-menu-ul li .fa-books:before {
                /*background: #ca5241;*/
                content: "\F02D";
            }

            .Course-menu-ul li .fa-learningPlane:before {
                /*background: #FFB43B;*/
                content: "\f0cb";
            }

            .Course-menu-ul li .fa-eduSession:before {
                /*background: #b4c836;*/
                content: "\f0c0";
            }

            .Course-menu-ul li .fa-coursePortfolio:before {
                /*background: #648191;*/
                content: "\f0f2";
            }

            .Course-menu-ul li .fa-LearnerProfile:before {
                content: "\f2bd";
            }

            .Course-menu-ul li .fa-ApproachToLearn:before {
                content: "\f19d";
            }

            .Course-menu-ul li .fa-reflection:before {
                content: "\f1e5";
                font-size: 18px;
                text-align: left;
                padding: 3px 8px;
            }

            .Course-menu-ul li .fa-reflection:after {
                content: "\f36c";
                position: absolute;
                top: -3px;
                left: 10px;
                color: white;
                display: block;
                font-family: ionicons !important;
                line-height: 50px;
                font-size: 21px;
                font-style: normal;
            }

            .Course-menu-ul li .fa-Badges:before {
                content: "\f349";
                font-family: ionicons !important;
                font-size: 27px;
            }

            .Course-menu-ul li .fa-E-Assessment:before {
                /* content: "\f295"; */
                content: "\e964";
                font-family: 'itgIconsFont' !important;
                font-size: 21px;
            }

            .Course-menu-ul li .fa-Assignment:before {
                content: "\f0c5";
            }

            .Course-menu-ul li .fa-studentAttendance:before {
                background: #206e87;
                content: "\F256";
            }

            .Course-menu-ul li .fa-teacherComments:before {
                background: #ca5241;
                content: "\F0E5";
            }

            .Course-menu-ul li .fa-teacherRemarks:before {
                background: #ca5241;
                content: "\F0E5";
            }

    .courseleftSide {
        width: 90%;
    }

    .content.container.col-md-8.coursepage.coursepagecontent {
        margin: 0 !important;
    }

    .coursepageMargin {
        margin-right: 10px;
    }

    .SearchTable .jqTransformRadioWrapper {
        margin-top: 3px;
    }

    .add-btn-circle:before {
        font-family: 'FontAwesome' !important;
        font-size: 18px;
        /* display: block; */
        content: "\f055";
        color: #206e87;
    }
}

.btn-secondary {
    color: #206e87;
    background-color: #f4f5f6 !important;
    border-color: #f4f5f6 !important;
}

.Course-menu-ul li {
    border-bottom: 1px solid #ccc;
    border-top: 0;
    cursor: pointer;
    font-size: var(--font-13, 13px);
    position: relative;
    display: table;
    width: 100%;
    height: 50px;
    background-color: #fff;
}

.row.custom-row {
    background-color: #206e87;
}

.Course-menu-ul li .fa-reportCard:before {
    background: #FFB43B;
    content: "\f2c3";
}

.Course-menu-ul li .fa-transcriptReport:before {
    background: #b4c836;
    content: "\f0c0";
}

.Course-menu-ul li .fa-requestReview:before {
    background: #648191;
    content: "\f0c5";
}

.Course-menu-ul li .fa-ConsentForm:before {
    font-size: 26px;
    content: "\f022";
}

.Course-menu-ul li .fa-RequestForm:before {
    font-size: 26px;
    content: "\f022";
}

.Course-menu-ul li .fa-incident:before {
    content: "\f2a2";
    font-family: "Ionicons" !important;
}

.Course-menu-ul li .fa-Studygroup:before {
    content: "\f0c0";
}

.Course-menu-ul li .fa-DPapplications:before {
    content: "\f276";
    font-family: "Ionicons" !important;
}

.Course-menu-ul li .fa-DPapplications:after {
    content: "\f02d";
    position: absolute;
    color: #fff;
    top: 5px;
    left: 21px;
    content: "\f19d";
    font-size: 16px !important;
    z-index: 0;
    font-family: FontAwesome !important;
    text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.2);
}

.Course-menu-ul li .fa-Certificate:before {
    content: "\f349";
    font-family: "Ionicons" !important;
}

.Course-menu-ul li .fa-MYPPersonalProject:before {
    content: "\f0c5";
}

.Course-menu-ul li .fa-MYPPersonalProject:after {
    content: "\f013";
    position: absolute;
    color: #fff;
    top: 2px;
    left: 24px;
    font-size: 16px !important;
    z-index: 0;
    font-family: FontAwesome !important;
    text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.2);
}

.Course-menu-ul li .fa-CourseModification:before {
    content: "\f0c5";
}

.Course-menu-ul li .fa-CourseModification:after {
    content: "\f013";
    position: absolute;
    color: #fff;
    top: 2px;
    left: 24px;
    font-size: 16px !important;
    z-index: 0;
    font-family: FontAwesome !important;
    text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.2);
}

.Course-menu-ul a {
    font-size: 14px;
    /*font-weight: bold;*/
    vertical-align: middle;
    display: block;
    /*padding: 6px 10px 6px 30px;*/
    padding-left: 60px;
    /*height: 50px;
    line-height: 50px;*/
    vertical-align: middle;
    color: #878787;
    /*transition: all .5s linear 0s;*/
}

.Course-menu-ul li:hover a {
    font-weight: bold;
    /*font-size: 13px;*/
    font-size: 12px;
    /*overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;*/
}

.Course-menu-ul .courselist-fa-coursePosts:hover a, .Course-menu-ul .courselist-fa-coursePosts.active a,
.Course-menu-ul .courselist-coursePosts:hover a, .Course-menu-ul .courselist-coursePosts.active a {
    color: #206e87;
}

.Course-menu-ul .courselist-fa-books:hover a, .Course-menu-ul .courselist-fa-books.active a,
.Course-menu-ul .courselist-books:hover a, .Course-menu-ul .courselist-books.active a {
    color: #ca5241;
}

.Course-menu-ul .courselist-fa-learningPlane:hover a, .Course-menu-ul .courselist-fa-learningPlane.active a,
.Course-menu-ul .courselist-learningPlane:hover a, .Course-menu-ul .courselist-learningPlane.active a {
    color: #FFB43B;
}

.Course-menu-ul .courselist-fa-eduSession:hover a, .Course-menu-ul .courselist-fa-eduSession.active a,
.Course-menu-ul .courselist-eduSession:hover a, .Course-menu-ul .courselist-eduSession.active a {
    color: #9cad34;
}

.Course-menu-ul .courselist-fa-coursePortfolio:hover a, .Course-menu-ul .courselist-fa-coursePortfolio.active a,
.Course-menu-ul .courselist-coursePortfolio:hover a, .Course-menu-ul .courselist-coursePortfolio.active a {
    color: #53798f;
}

/*.Course-menu .Course-menu-ul .active:hover {
    background-color: $primary-color;
    border-left-color: #206e87 ;
    color: #fff;
}*/
.courseleftSide {
    margin-top: 8px;
}

    .courseleftSide h6.title {
        color: #888;
        font-size: var(--font-14, 14px);
    }

    .courseleftSide .Course-title h6.title {
        color: #206e87;
        margin: 0;
        font-weight: bold;
        font-size: var(--font-14, 14px);
    }

    .courseleftSide .Course-title {
        padding: 6px 10px 4px;
    }

.custom-row {
    margin: 0;
}

@media (max-width: 1290px) {
    .Course-menu-ul a {
        font-size: var(--font-12, 12px);
    }

    .Course-menu-ul a {
        font-size: var(--font-12, 12px);
    }

    .StudyTheCourse {
        padding: 0 10px;
        /*margin-bottom: 12px;*/
    }
}

@media (min-width: 1280px) {
    .StudyTheCourse h5 {
        font-size: var(--font-13, 13px) !important;
    }
}
/***************************** Parent children info *****************************/
.courseleftSide .navbar-nav > li {
    float: none;
    padding: 5px 10px;
    text-align: center;
    list-style: none;
}

    .courseleftSide .navbar-nav > li .userphoto {
        margin: auto;
        width: 60px;
        height: 60px;
    }

.courseleftSide .navbar-nav {
    width: 100%;
    margin: 0 0 20px;
    padding: 0;
}

    .courseleftSide .navbar-nav > li.userinfo {
        color: #206e87;
        font-weight: bold;
        font-size: var(--font-12, 12px);
    }

        .courseleftSide .navbar-nav > li.userinfo .UserType {
            color: #ffb43b;
        }

    .courseleftSide .navbar-nav > li .userphoto .Course-img {
        cursor: default;
        color: #fff;
        border-color: #fff;
    }

/************************** teacher side menu *********************************/
.courseleftSide {
    border-bottom: 0;
    /*
      h6.title {
          display: none;
      }
  */
}

    .courseleftSide .Course-img {
        border-bottom: none;
    }

    .courseleftSide .custom-row {
        margin: 0 -16px;
        border: 1px solid #eee;
    }

    .courseleftSide .StudyTheCourse {
        border: none;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        -ms-border-radius: 0px;
        border-radius: 0;
        margin: 0px;
        border-top: 5px solid #e9ebee;
        border-bottom: 5px solid #e9ebee;
        width: 100%;
    }

.TitleWithButtons #wizHeader li .currentStep::after {
    background: #206e87;
    border-right-color: var(--main-color,#206e87 ) !important;
}

#wizHeader li a {
    background: #206e87;
}

    #wizHeader li a.currentStep {
        background: #206e87 !important;
    }


.courseleftSide .Course-title {
    margin-bottom: 0;
    background: rgba(250, 250, 250, 0.8);
    border-top: 1px solid #206e87;
    position: absolute;
    bottom: 0;
    min-height: 36px;
}

.courseleftSide .StudyTheCourse h5 {
    margin-bottom: 12px;
    font-size: var(--font-13, 13px);
    margin-top: 12px;
    padding-right: 30px;
    text-align: left;
}

    .courseleftSide .StudyTheCourse h5 .fa-angle-right {
        position: absolute;
        top: 0px;
        background: #206e87;
        ;
        width: 40px;
        right: 0px;
        height: 39px;
        vertical-align: middle;
        line-height: 24px;
    }

        .courseleftSide .StudyTheCourse h5 .fa-angle-right:before {
            top: 6px;
            left: 8px;
            position: relative;
            font-size: var(--font-16, 16px);
            background: #fff;
            color: #206e87;
            width: 24px;
            display: block;
            height: 24px;
            border-radius: 50%;
            line-height: 24px;
            font-weight: bold;
        }

.courseleftSide .CurriculumBuilder.StudyTheCourse {
    border-bottom: none !important;
    position: relative;
}

    .courseleftSide .CurriculumBuilder.StudyTheCourse h5 .fa-angle-right:before {
        font-size: 10px !important;
        font-family: itgIconsFont;
        font-style: normal;
        font-weight: bold;
        color: #206e87;
        content: "\e900" !important;
    }

    .courseleftSide .CurriculumBuilder.StudyTheCourse a {
        color: #fff;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 5;
    }

.courseleftSide .StudyTheCourse.disabled {
    color: #969696;
    background-color: #c8c8c8;
    cursor: default;
    opacity: .9;
}

    .courseleftSide .StudyTheCourse.disabled h5 .fa-angle-right:before {
        color: #a1a1a1;
    }

    .courseleftSide .StudyTheCourse.disabled h5 .fa-angle-right {
        background: #b9b9b9;
    }

    .courseleftSide .StudyTheCourse.disabled a {
        cursor: default;
    }

.courseleftSide .text-virtual,
.courseleftSide .text-online {
    background: #6fae14;
    position: absolute;
    top: 10px;
    left: 0;
    color: #fff;
    width: 35px;
    height: 25px;
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
    border: 1px solid #fff;
    border-left: 0;
}

    .courseleftSide .text-online:before {
        /*content: "\F086";
    font-size: 15px;
    font-family: FontAwesome !important;*/
        content: "\f3a0";
        font-size: 17px;
        font-family: "Ionicons" !important;
        line-height: 23px;
    }

    .courseleftSide .text-online.virtual:before {
        /*content: "\f12f";*/
        /*content: "\f4b6";*/
        content: "\f380";
        font-size: 15px;
        font-family: "Ionicons" !important;
        line-height: 23px;
    }

    .courseleftSide .text-online.virtual {
        background: #597a96;
    }

    .courseleftSide .text-online.inSchool {
        background: #206e87;
    }

        .courseleftSide .text-online.inSchool:before {
            content: "\F024";
            font-size: 15px;
            font-family: FontAwesome !important;
        }

.Course-menu-ul.teacher-course-menu {
    /*max-height: 341px;*/
    border-bottom: 3px solid #206e87 87;
    /*a:before {    
      position: absolute;
      content: "\f10c";
      font-family: FontAwesome !important;
      color: $primary-color;
      margin-left: -16px;
      font-weight: bold;
      font-size: 10px;
      top: 9px;    
  }*/
}


.CourseColapsedContent {
    background: #206e87 1c !important;
    padding: 15px;
    border: 1px solid #ccc;
}

.CourseColapsedMenu .panel-default > .panel-heading a.CollapsItemToolbarBtn.active, .CollapsItemToolbarBtn.active {
    background: #206e87;
    !important;
    color: #fff !important;
}

.CollapsItemToolbarBtn {
    background: #fff;
    padding: 2px 10px;
    border: 1px solid #206e87;
    !important;
    border-radius: 12px;
    margin: 0 3px;
}

.CourseColapsedMenu.CourseColapsedContent .panel-default > .panel-heading a {
    color: #206e87 !important;
}

.CourseColapsedMenu .panel-default > .panel-heading a.collapseArrow::before {
    color: #206e87 !important;
    background-color: #e3f1f0 !important;
}

.deleteCollapsItem:hover::before, .editCollapsItem:hover::before {
    color: #fff !important;
    background: #206e87 !important;
}


.intervalCollapsItem::before, .deleteCollapsItem::before, .editCollapsItem::before {
    position: relative;
    font-family: itgIconsFont;
    font-style: normal;
    font-weight: normal;
    color: #206e87 !important;
}


.collapsTitle.sectionOrder, .collapsTitle.lectureOrder {
    color: #206e87 !important;
}

.CourseColapsedMenu.CourseColapsedContent .panel-default > .panel-heading a {
    color: #206e87 !important;
}


.lectureFormStyle span:not(.ValidationStar, .ValidationNote), .dvAddSection .lightBgContainer span:not(.ValidationStar, .ValidationNote) {
    color: #206e87 !important;
    margin-bottom: 5px;
    display: inline-block;
}


.LectureBtnsContainer .CancelBtn {
    color: #206e87;
    !important;
    background: transparent;
}


.lectuerSectionContainer .nav-tabs > li.itg_dashboard_active > a {
    box-shadow: 0 3px 0px #206e87;
    !important;
}

.courseContentTabs .nav-tabs > li.itg_dashboard_active > a {
    color: #206e87;
    !important;
    box-shadow: inset 0 -3px 0px #206e87;
}

.courseContentTabs .nav-tabs > li > a:hover {
    border-color: #fff #eee #fff;
    color: #206e87;
    !important;
}

.VideoContent a[title="Delete"]::before {
    position: relative;
    font-family: itgIconsFont;
    font-style: normal;
    font-weight: normal;
    color: #206e87;
    !important;
    content: "\e90b";
    font-size: 11px;
    padding: 0;
    cursor: pointer;
}


.addButonwithicon::before {
    position: relative;
    font-family: itgIconsFont;
    font-style: normal;
    font-weight: normal;
    color: #fff;
    display: inline-block;
    content: "\e900";
    font-size: 8px;
    padding: 6px;
    background: #206e87;
    !important;
}


.addButonwithicon {
    background: #fff;
    border: 1px solid #e8e8e8;
    padding: 10px;
    color: #206e87;
    !important;
    background-color: #fff;
}


.Course-menu-ul.teacher-course-menu a {
    font-size: var(--font-14, 14px);
    font-weight: bold;
    vertical-align: middle;
    display: block;
    padding: 10px 10px 12px 10px;
    height: auto;
    line-height: inherit;
    width: auto;
    color: #8d8d8d;
}

.Course-menu-ul.teacher-course-menu li {
    height: auto;
}

    .Course-menu-ul.teacher-course-menu li i {
        display: none;
    }

    .Course-menu-ul.teacher-course-menu li:hover a {
        color: #206e87 !important;
        font-size: var(--font-14, 14px);
    }

    .Course-menu-ul.teacher-course-menu li.active a {
        background: #2e95b7 !important;
        color: #fff !important;
        box-shadow: inset 4px 0px 0px #f7a42c;
    }

        .Course-menu-ul.teacher-course-menu li.active a:before {
            color: #fff;
        }

/************************ New course image style **************************/
.courseleftSide div.Course-img {
    width: 100%;
    padding-top: 100%;
    position: relative;
    background-color: transparent;
}

.courseleftSide .image {
    position: absolute;
    top: 0px;
    left: -10px;
    width: 100%;
    height: 100%;
/*    transform: scale(0.8);*/
}

.Course-img input {
    max-height: inherit;
}

.Course-img input {
    max-height: 300px;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    height: 100%;
    width: 100%;
}

.body-no-scroll {
    overflow: hidden;
}

.start-the-course {
    position: fixed;
    display: none;
    top: 0;
    background-color: #F8F8F9;
    z-index: 10000;
    min-height: 100%;
    height: 100%;
    width: 100%;
}

    .start-the-course .eduwaveHeader {
        background-color: #ffffff;
        border-bottom: 1px solid #dddddd;
    }

        .start-the-course .eduwaveHeader .logo {
            font-size: 16px;
            text-align: left;
            font-family: 'open_sansregular';
            width: 315px;
            color: #206e87;
        }

        .start-the-course .eduwaveHeader > .navbar {
            margin-left: 315px;
            min-height: 50px;
        }

        .start-the-course .eduwaveHeader .sidebar-toggle {
            padding: 14px 20px;
            background-color: #206e87;
            color: #fff;
        }

    .start-the-course .navbar-nav {
        min-height: 45px;
        margin-top: 0;
    }

    .start-the-course .navbar-custom-menu > .navbar-nav > li {
        border-left: 1px solid #dddddd;
        min-height: 51px;
        min-width: 52px;
        text-align: center;
    }

        .start-the-course .navbar-custom-menu > .navbar-nav > li > a {
            min-height: 50px;
            margin: 0;
            padding: 14px 15px;
            color: #206e87;
        }

            .start-the-course .navbar-custom-menu > .navbar-nav > li > a .fa-ok:after {
                content: "\F00C";
            }

            .start-the-course .navbar-custom-menu > .navbar-nav > li > a .fa-chevron-sign-left:after {
                content: "\F137";
            }

            .start-the-course .navbar-custom-menu > .navbar-nav > li > a .fa-chevron-sign-right:after {
                content: "\F138";
            }

    .start-the-course .main-sidebar {
        background-color: #fff;
        border-right: 1px solid #dddddd;
        width: 316px;
        position: absolute;
        top: 0;
        left: 0;
        padding-top: 50px;
        min-height: 100%;
        z-index: 810;
    }

        .start-the-course .main-sidebar .header {
            color: #206e87;
            font-size: var(--font-13, 13px);
            font-weight: 600;
            padding: 10px 25px 10px 15px;
            overflow: hidden;
            text-overflow: clip;
            white-space: nowrap;
            margin: 0;
            display: block;
        }

            .start-the-course .main-sidebar .header .fa-toggle-off {
                display: inline-block;
                font: normal normal normal 24px/1 FontAwesome;
                top: 4px;
                position: relative;
                margin-right: 10px;
                cursor: pointer;
            }

        .start-the-course .main-sidebar .learning-standard-on {
            display: none;
        }

        .start-the-course .main-sidebar .learning-standard-off {
            display: block;
        }

        .start-the-course .main-sidebar .sidebar-menu .treeview > a:hover,
        .start-the-course .main-sidebar .sidebar-menu .treeview > a:focus,
        .start-the-course .main-sidebar .sidebar-menu .treeview.active > a {
            background-color: #206e87;
            color: #fff;
        }

        .start-the-course .main-sidebar .sidebar-menu .treeview {
            border-bottom: 1px solid #eff1f2;
        }

            .start-the-course .main-sidebar .sidebar-menu .treeview a {
                color: #206e87;
                font-weight: 600;
                font-size: var(--font-13, 13px);
            }

            .start-the-course .main-sidebar .sidebar-menu .treeview .treeview-menu {
                padding-left: 1px;
            }

                .start-the-course .main-sidebar .sidebar-menu .treeview .treeview-menu a {
                    color: #838383;
                    font-weight: 600;
                    font-size: var(--font-13, 13px);
                    padding: 10px 5px 10px 15px;
                    background-color: #f5f5f5;
                    border-bottom: 1px solid #fff;
                }

                    .start-the-course .main-sidebar .sidebar-menu .treeview .treeview-menu a.active,
                    .start-the-course .main-sidebar .sidebar-menu .treeview .treeview-menu a:hover {
                        border-left: 4px solid #206e87;
                    }

                    .start-the-course .main-sidebar .sidebar-menu .treeview .treeview-menu a i {
                        font-size: 17px;
                        margin-right: 10px;
                        color: #206e87;
                    }

                        .start-the-course .main-sidebar .sidebar-menu .treeview .treeview-menu a i.fa-caret-square-o-right {
                            display: none;
                        }

                    .start-the-course .main-sidebar .sidebar-menu .treeview .treeview-menu a.active i.fa-caret-square-o-right {
                        display: block;
                    }

    .start-the-course .sidebar-menu li.active > a > .fa-chevron-down {
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    .start-the-course .content-wrapper {
        margin-left: 315px;
        padding: 60px 120px;
        background-color: #f8f8f8;
        overflow: auto;
        height: 100%;
       font-family: 'Cairo Regular';
        font-weight: 400;
    }

    .start-the-course .navbar .navbar-nav > li > a [class^="fa"] {
        font-size: 21px;
    }

    .start-the-course .content-wrapper .content {
        min-height: 250px;
        padding: 60px 80px;
        margin-right: auto;
        margin-left: auto;
        padding-left: inherit;
        padding-right: inherit;
        border: 1px solid #dddddd;
        background-color: #fff;
        margin-bottom: 80px;
        max-width: 900px;
    }

        .start-the-course .content-wrapper .content h3 {
            padding-bottom: 20px;
            color: #4d4d4d;
        }

        .start-the-course .content-wrapper .content p {
            font-size: var(--font-13, 13px);
            padding-bottom: 20px;
        }

/***************** tooltip ****************/
.navbar-custom-menu a .tooltiptext,
.sidebar .header .tooltiptext,
.treeview .treeview-menu li a .tooltiptext {
    visibility: hidden;
    width: auto;
    background-color: #000;
    color: #fff;
    text-align: center;
    border-radius: 0;
    padding: 5px 10px;
    position: absolute;
    z-index: 1;
    left: 50%;
    margin-left: -43px;
    opacity: 0;
    transition: opacity 1s;
    top: 55px;
    font-size: var(--font-13, 13px);
    display: block;
    white-space: nowrap;
}

    .sidebar .header .tooltiptext.TooltipSwitch {
        top: 97px;
        left: 20%;
    }

    .treeview .treeview-menu li a .tooltiptext.TooltipResume {
        top: -25px;
        left: 85%;
    }

    .navbar-custom-menu a .tooltiptext.PushForLeft {
        margin-left: -125px;
    }

    .navbar-custom-menu a .tooltiptext::after,
    .sidebar .header .tooltiptext:after,
    .treeview .treeview-menu li a .tooltiptext:after {
        content: "\f0d9";
        font: normal normal normal 40px/1 FontAwesome;
        position: absolute;
        top: -19px;
        right: 12px;
        color: #000;
        z-index: -1;
    }

    .sidebar .header .tooltiptext.TooltipSwitch:after,
    .ChangeSwitchTooltip .ChangedTooltip:after {
        left: 12px;
        right: inherit !important;
        content: "\f0da" !important;
    }

    .treeview .treeview-menu li a .tooltiptext.TooltipResume:after {
        top: 7px;
    }

.navbar-custom-menu a:hover .tooltiptext,
.sidebar .header:hover .tooltiptext,
.treeview .treeview-menu li a.active:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}

.ChangedTooltip {
    display: none !important;
}

.ChangeSwitchTooltip .ChangedTooltip {
    display: block !important;
    top: 97px !important;
    left: 20% !important;
}

.start-the-course .eduwaveHeader {
    background-color: #ffffff;
    border-bottom: 1px solid #dddddd;
    max-height: 70px;
    height: auto !important;
}

    .start-the-course .eduwaveHeader .sidebar-toggle {
        padding: 14px 20px;
        background-color: #206e87;
        color: #fff;
    }

.start-the-course .bg-green a,
.start-the-course .bg-green {
    color: #fff;
}

.nav .bg-green.open > a {
    background-color: #00a65a !important;
}

.start-the-course .bg-green i {
    color: #fff;
}

.wrapper {
    position: relative;
    top: 0;
    /*min-height: 100vh;*/
}

.mobilemenu-sidebar {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 260px;
    display: block;
    z-index: 1;
    color: #fff;
    font-weight: 200;
    background-size: cover;
    background-position: center center;
}

    .mobilemenu-sidebar .sidebar-wrapper {
        position: relative;
        max-height: none;
        min-height: 100%;
        overflow: hidden;
        width: 260px;
        z-index: 4;
    }

    .mobilemenu-sidebar .sidebar-background {
        position: absolute;
        z-index: 1;
        height: 100%;
        width: 100%;
        display: block;
        top: 0;
        left: 0;
        background-size: cover;
        background-position: center center;
    }

    .mobilemenu-sidebar .logo {
        padding: 10px 15px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }

        .mobilemenu-sidebar .logo p {
            float: left;
            font-size: var(--font-20, 20px);
            margin: 10px 10px;
            color: #FFFFFF;
            line-height: 20px;
           font-family: 'Cairo Regular';
        }

        .mobilemenu-sidebar .logo .simple-text {
            text-transform: uppercase;
            padding: 5px 0px;
            display: block;
            font-size: var(--font-18, 18px);
            color: #FFFFFF;
            text-align: center;
            font-weight: 400;
            line-height: 30px;
        }

    .mobilemenu-sidebar .logo-tim {
        border-radius: 50%;
        border: 1px solid #333;
        display: block;
        height: 61px;
        width: 61px;
        float: left;
        overflow: hidden;
    }

        .mobilemenu-sidebar .logo-tim img {
            width: 60px;
            height: 60px;
        }

    .mobilemenu-sidebar .nav {
        margin-top: 20px;
    }

        .mobilemenu-sidebar .nav li > a {
            color: #FFFFFF;
            margin: 5px 15px;
            opacity: .86;
            border-radius: 4px;
        }

        .mobilemenu-sidebar .nav li:hover > a {
            background: rgba(255, 255, 255, 0.13);
            opacity: 1;
        }

        .mobilemenu-sidebar .nav li.active > a {
            color: #FFFFFF;
            opacity: 1;
            background: rgba(255, 255, 255, 0.23);
        }

        .mobilemenu-sidebar .nav p {
            margin: 0;
            line-height: 30px;
            font-size: var(--font-12, 12px);
            font-weight: 600;
            text-transform: uppercase;
        }

        .mobilemenu-sidebar .nav i {
            font-size: 28px;
            float: left;
            margin-right: 15px;
            line-height: 30px;
            width: 30px;
            text-align: center;
        }

    .mobilemenu-sidebar .logo,
    body > .navbar-collapse .logo {
        padding: 20px 15px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
        text-align: center;
        text-align: center;
    }

        .mobilemenu-sidebar .logo p,
        body > .navbar-collapse .logo p {
            float: left;
            font-size: var(--font-20, 20px);
            margin: 10px 10px;
            color: #FFFFFF;
            line-height: 20px;
           font-family: 'Cairo Regular';
        }

        body > .navbar-collapse .logo img {
            max-width: 50px;
            max-height: 50px;
        }

        body > .navbar-collapse .logo .client-logo {
            display: none;
        }

        .mobilemenu-sidebar .logo .simple-text,
        body > .navbar-collapse .logo .simple-text {
            text-transform: uppercase;
            padding: 5px 0px;
            display: block;
            font-size: var(--font-18, 18px);
            color: #FFFFFF;
            text-align: center;
            font-weight: 400;
            line-height: 30px;
        }

    .mobilemenu-sidebar .logo-tim,
    body > .navbar-collapse .logo-tim {
        border-radius: 50%;
        border: 1px solid #333;
        display: block;
        height: 61px;
        width: 61px;
        float: left;
        overflow: hidden;
    }

        .mobilemenu-sidebar .logo-tim img,
        body > .navbar-collapse .logo-tim img {
            width: 60px;
            height: 60px;
        }

    .mobilemenu-sidebar:after,
    .mobilemenu-sidebar:before,
    body > .navbar-collapse:after,
    body > .navbar-collapse:before {
        display: block;
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        z-index: 2;
    }

/*
.sidebar:before,
body > .navbar-collapse:before {
    opacity: .33;
    background: #000000;
}
*/
.mobilemenu-sidebar,
body > .navbar-collapse:after {
    background: #787878;
    background: -moz-linear-gradient(top, #787878 0%, #343434 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #787878), color-stop(100%, #343434));
    background: -webkit-linear-gradient(top, #787878 0%, #343434 100%);
    background: -o-linear-gradient(top, #787878 0%, #343434 100%);
    background: -ms-linear-gradient(top, #787878 0%, #343434 100%);
    background: linear-gradient(to bottom, #787878 0%, #343434 100%);
    background-size: 150% 150%;
    z-index: 3;
    opacity: 1;
}

/*
.sidebar[data-image]:after,
.sidebar.has-image:after,
body > .navbar-collapse[data-image]:after,
body > .navbar-collapse.has-image:after {
    opacity: .77;
}
*/
.sidebar[data-color="blue"]:after,
body > .navbar-collapse[data-color="blue"]:after {
    background: #206e87;
    background-size: 150% 150%;
}

.sidebar,
.main-panel,
.main-panel-noSideBar {
    /*overflow: auto;*/
    max-height: 100%;
    height: 100%;
    -webkit-transition-property: top, bottom;
    transition-property: top, bottom;
    -webkit-transition-duration: .2s, .2s;
    transition-duration: .2s, .2s;
    -webkit-transition-timing-function: linear, linear;
    transition-timing-function: linear, linear;
    -webkit-overflow-scrolling: touch;
}

.mobilemenu-sidebar {
    display: none;
}

.collapse.navbar-collapse.has-image {
    background: none !important;
}

    /*.collapse.navbar-collapse.has-image .nav.navbar-nav li a:hover,
.collapse.navbar-collapse.has-image .nav.navbar-nav li:active {
    background: #000;
    opacity: .3;
    color: #fff !important;
}*/
    .collapse.navbar-collapse.has-image .nav.navbar-nav .userphoto {
        margin: 0 auto;
        margin-top: 10px;
        width: 45px;
        height: 45px;
    }

    /*.collapse.navbar-collapse.has-image .nav.navbar-nav li:hover{
    background: transparent !important;
    opacity: 1 !important;
    color: #fff !important;
}*/
    .collapse.navbar-collapse.has-image .nav.navbar-nav .userinfo.dropdown {
        border-bottom: 1px solid #afafaf;
        text-align: center;
    }

.post-image-container {
    display: block;
    border-top: 1px solid #eee;
}

.post-video-thumb:before {
    content: "\f04b";
    width: 40px;
    height: 40px;
    font-family: fontAwesome;
    position: absolute;
    top: 42px;
    left: 42px;
    font-size: 17px;
    color: #fff;
    line-height: 35px;
    opacity: .9;
    box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5);
    border-radius: 50%;
    border: 3px solid #fff;
    padding: 0 13px;
    background: rgba(0, 0, 0, 0.5);
}

.post-image-thumb,
.post-video-thumb {
    float: left;
    width: 80px;
    height: 80px;
    position: relative;
    margin: 5px;
    /*line-height: 80px;*/
    vertical-align: middle;
    border: 1px solid #eee;
    text-align: center;
    overflow: hidden;
    cursor: pointer;
}

    .post-video-thumb i.fa-close,
    .post-image-thumb i.fa-close {
        position: absolute;
        right: 5px;
        top: 5px;
        display: none;
        color: #ffffff;
        z-index: 100;
    }

    .post-video-thumb:hover i.fa-close,
    .post-image-thumb:hover i.fa-close {
        display: block;
    }

    .post-video-thumb img,
    .post-image-thumb img {
        /*max-width: 150%;
  max-height: 150%;
  margin: -25%;*/
        max-width: 100%;
        max-height: 100%;
        min-width: 100%;
        min-height: 100%;
    }

    .post-video-thumb:hover .post-video-hover,
    .post-image-thumb:hover .post-image-hover {
        width: 100%;
        height: 100%;
        position: absolute;
        background: #333;
        opacity: .3;
    }

.box-warning .post-image-container {
    border: none;
    margin-bottom: 0px;
}

.box-warning .post-video-thumb,
.box-warning .post-image-thumb {
    border: none;
    width: 135px;
    height: 135px;
    /*line-height: 135px;*/
}

#latestPostsWidget .post-video-thumb:before,
.modal-body .post-video-thumb:before {
    content: "\f04b";
    width: 25px;
    height: 25px;
    font-family: fontAwesome;
    position: absolute;
    top: 28px;
    left: 28px;
    font-size: 10px;
    color: #fff;
    line-height: 22px;
    opacity: .9;
    box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.5);
    border-radius: 50%;
    border: 2px solid #fff;
    padding: 0 8px;
    background: rgba(0, 0, 0, 0.5);
    direction: ltr;
    pointer-events: none;
    /*aibrahim fix bug #9799 30-1-2017*/
}

.lightbox {
    /* to make lightbox fixed*/
    position: fixed !important;
    top: 40px !important;
}

.video-content {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    margin: auto;
    max-width: 720px;
    max-height: 100%;
    height: 0;
    height: auto !important;
}

    .video-content video {
        margin-top: 15%;
        max-width: 100%;
        opacity: 1 !important;
        max-height: 430px;
        vertical-align: middle;
        line-height: 430px;
    }

.video-overlay {
    text-align: center;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    background-color: rgba(0, 0, 0, 0.8);
    display: none;
}

.viewmore-box .product-description {
    color: #777;
    margin-top: 20px;
}

.viewmore-box .user-block .username,
.viewmore-box .user-block .description {
    font-size: var(--font-13, 13px);
    margin-left: 48px !important;
}

.viewmore-box .box-header {
    border-bottom: 1px solid #ddd;
    margin-bottom: 15px;
    padding: 15px 0;
}

.viewmore-box .user-block .img-circle {
    width: 37px;
    height: 37px;
}

.viewmore-box .carousel-inner > .itg_dashboard_active {
    /*left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  position: absolute;*/
    height: 100%;
}

.viewmore-box video {
    margin: auto;
    max-width: 80%;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /*min-width: 80%;*/
    min-height: 80%;
    max-height: 300px;
    /*aibrahim fix bug #9801 30-1-2017*/
}

.viewmore-box .carousel-inner > .itg_dashboard_item > img {
    max-height: 300px;
    margin: auto;
    max-width: 100%;
}

.viewmore-box .carousel-control.itg_dashboard_left:hover, .viewmore-box .carousel-control.itg_dashboard_right:hover {
    background-color: rgba(0, 0, 0, 0.3);
}

.viewmore-box .carousel-inner {
    position: relative;
    width: 100%;
    overflow: hidden;
    height: 300px;
    line-height: 300px;
    vertical-align: middle;
    display: block;
}

#read-post .modal-dialog {
    width: 600px;
    margin: 10px auto 0 !important;
}

    #read-post .modal-dialog .modal-body {
        padding-top: 0;
        padding-bottom: 0;
    }

.box-footer.box-comments {
    max-height: 300px;
}

.modal-body .commentsContainer {
    max-height: inherit;
}

.modal-body .box-comments .box-comment:last-of-type {
    /*Overwrite on jquery.ui.chatbox.css*/
    padding-bottom: 10px;
}

.writePostWarper {
    border: 1px solid #ddd;
    padding: 5px 10px;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.39);
    position: relative;
}

    .writePostWarper .pull-right {
        margin-top: 8px;
    }

    .writePostWarper .post-options {
        position: absolute;
        height: 100%;
        top: 5px;
        right: 17px;
    }

    .writePostWarper .input-sm {
        height: auto !important;
    }

.post-options .itg_dashboard_dropdown-menu {
    padding: 15px;
    top: 128% !important;
    right: 0 !important;
    left: auto !important;
}

    .post-options .itg_dashboard_dropdown-menu li {
        padding: 2px 0px;
        color: #206e87;
    }

    .post-options .itg_dashboard_dropdown-menu .descreption {
        font-size: 11px;
        margin: 5px 0;
    }

    .post-options .itg_dashboard_dropdown-menu .headerscroll {
        max-height: 210px;
        /*aibrahim 24/2/2019 Fix bug No 22019*/
    }

        .post-options .itg_dashboard_dropdown-menu .headerscroll div[id*="liCourse"] * {
            display: table-cell;
        }

        .post-options .itg_dashboard_dropdown-menu .headerscroll div[id*="liCourse"] {
            min-width: 210px;
        }

.post-options input[type="checkbox"],
.post-options input[type="radio"] {
    display: none !important;
}

.eduwaveContent .post-image-container {
    border-top: 0px;
}

.postsMainContainer .writePostWarper .input-sm {
    padding: 13px 1px;
}

.postsMainContainer .writePostWarper .img-sm {
    width: 40px !important;
    height: 40px !important;
}

.postsMainContainer .btn {
    padding: 7px 18px;
}

.postsMainContainer .box-header .box-tools .btn-box-tool {
    border: none !important;
    font-size: var(--font-14, 14px) !important;
    padding: 0 !important;
    color: #97a0b3 !important;
}
.product-title span {
    color: #206e87 !important;
}
.product-title {
    color: #206e87 !important;
}
@media (max-width: 768px) {
    .latestPostsWidget .products-list .product-title {
        margin-bottom: 15px;
        margin-right: 55px;
    }

    .post-image-thumb, .post-video-thumb {
        width: 65px;
        height: 65px;
        /*line-height: 65px;*/
    }

    #latestPostsWidget .post-video-thumb:before, .modal-body .post-video-thumb:before {
        width: 25px;
        height: 25px;
        top: 18px;
        left: 18px;
    }
}

@media (max-width: 600px) {
    #read-post .modal-dialog {
        width: auto;
        margin: 10px !important;
    }
}
/*# course post upload attachemennt */
.box-footer.box-comments {
    max-height: 300px;
}

#itg_dashboard_write_post_high input[type="file"], #itg_dashboard_write_post input[type="file"], #itg_dashboard_post_link input[type="file"], .writePostWarper input {
    display: block;
}

#itg_dashboard_write_post .k-button.k-upload-button span {
    display: none;
}

#itg_dashboard_write_post .k-widget.k-upload {
    display: flex;
}

#itg_dashboard_write_post .k-button.k-upload-button {
    background: transparent;
    border: none;
    width:40px;
    padding: 0 !important;
    line-height: 0;
    flex: 0 0 22px;
    min-width: 34px;
}

.k-upload-files {
    text-align: left;
    flex: 1;
}

#itg_dashboard_write_post .k-button.k-upload-button:before {
    content: "\f0ee";
    color: #206e87 !important;
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    font-style: normal;
    font-size: 30px;
}

#itg_dashboard_write_post .k-button.k-upload-button.disabled:before {
    color: #bbb !important;
}

.k-i-xlsx::before {
    content: "\e90a";
    display: inline-block;
}

#itg_dashboard_write_post .k-dropzone {
    width: 40px;
}

#itg_dashboard_write_post .k-dropzone-hint {
    display: none;
}

.k-button.k-button-icon:hover,
.k-button.k-button-icon {
    background: transparent;
    border: none;
}

#itg_dashboard_write_post .k-upload .k-filename {
    color: #555;
}

#itg_dashboard_write_post .k-upload-files,
#itg_dashboard_write_post .k-file {
    border: none !important;
}

    #itg_dashboard_write_post .k-upload-files .k-icon:before {
        font-size: 23px;
        color: #206e87 !important;
    }

    #itg_dashboard_write_post .k-upload-files .k-icon.k-i-close:before {
        font-size: 16px;
    }

.k-i-docx::before,
.k-i-doc::before {
    content: "\e90b";
}

.k-i-pptx::before,
.k-i-ppt::before {
    content: "\e90d";
}

.k-upload-files .k-file-error .k-file-group-wrapper .k-icon,
.k-file-error .k-file-name {
    opacity: 0.5;
    color: #333 !important;
}

#itg_dashboard_write_post .k-upload-files:not(:empty) {
    width: 350px;
}

    #itg_dashboard_write_post .k-upload-files .k-file-name {
        color: #333 !important;
        width: 80%;
        overflow: hidden;
        display: inline-flex;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.uploaded-icons {
    color: #666;
    font-weight: normal;
    font-size: 13px;
}

    .uploaded-icons .k-icon {
        background: none;
        font-size: 20px;
        color: #206e87;
        width: auto;
        height: auto;
        display: inline;
        padding: 0 4px;
        top: -2px;
        position: relative;
    }

#itg_dashboard_write_post .k-upload-files .k-icon {
    position: relative;
    background: none;
    width: auto;
    height: auto;
    line-height: initial;
}

.k-file-state,
.k-file-size,
.k-upload-status-total,
.k-file-validation-message {
    display: none;
}

/*@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic);*/
/*#72afd2*/
/*body {
    color: $primary-color;
}*/
body {
   font-family: 'Cairo Regular';
}

.box-header, body {
    direction: rtl;
}

/*.pull-left {float:right !important;}
.pull-right {float:left !important;}*/
.itg_dashboard_daterangepicker table tr:first-child {
    direction: ltr;
}

/*english code to ar code*/
.box-header > .box-tools {
    left: 10px !important;
    right: auto;
}

.itg_dashboard_sidewidget_button {
    /*aibrahim fix bug #6009 17-10-2017*/
    left: 7px !important;
    right: auto;
}

.chat .item > .message {
    margin-right: 55px;
    margin-left: 0;
}

.box-header > .fa, .box-header > .glyphicon, .box-header > .ion {
    margin-left: 5px;
    margin-right: 0;
}

#side-drag-widget {
    left: 5px;
    right: auto;
}

/*input[type="text"], input[type="password"] {
    font-family: arial !important;
}*/
.close {
    float: left !important;
}

.modal-open {
    padding: 0 !important;
}

body, html {
    height: auto;
}

form {
    height: 100%;
}

.small-box .icon {
    left: 10px !important;
    right: auto;
}

.box-header > .box-tools.pull-right .itg_dashboard_dropdown-menu {
    left: 0px;
    right: auto;
}

.itg_dashboard_dropdown-menu {
    text-align: right;
}

    .itg_dashboard_dropdown-menu > li > a > .glyphicon, .itg_dashboard_dropdown-menu > li > a > .fa, .itg_dashboard_dropdown-menu > li > a > .ion {
        margin-right: 0px;
        margin-left: 10px;
    }

.itg_dashboard_todo-list li .tools {
    float: left;
}

.itg_dashboard_nav-tabs-custom > .itg_dashboard_nav-tabs.pull-right > li {
    float: left;
}

div.k-chart, div.k-gauge, span.k-sparkline, .k-stockchart {
    direction: ltr;
}

.chat .item > .attachment {
    margin-right: 65px;
    margin-left: 15px;
}

.modal-footer {
    text-align: left;
    /*direction: ltr;*/
}

.parentFilterBar a.jqTransformCheckbox::after {
    right: 1px; /*fix bug no #91362 (specific resolution)*/
}
/*  aibrahim 7-6-2018 comment "direction: ltr;" to fix bug No #13033 */
.pagination > li {
    direction: rtl;
    float: right;
}

/*.pagination-sm > li:first-child > a, .pagination-sm > li:first-child > span {
    border-radius: 0px 3px 3px 0px;
    -ms-border-radius: 0px 3px 3px 0px;
    -o-border-radius: 0px 3px 3px 0px;
    -moz-border-radius: 0px 3px 3px 0px;
    -webkit-border-radius: 0px 3px 3px 0px;
}
.pagination-sm > li:last-child > a, .pagination-sm > li:last-child > span {
    border-radius: 3px 0px 0px 3px;
    -ms-border-radius: 3px 0px 0px 3px;
    -o-border-radius: 3px 0px 0px 3px;
    -moz-border-radius: 3px 0px 0px 3px;
    -webkit-border-radius: 3px 0px 0px 3px;
}*/
/* commenteed for x scroll issue in dashboard */
/*.col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9,
.col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9 ,
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9
{ float: right;}*/
.drilldown ul {
    direction: rtl;
}

.back-drill-btn:after, .back-drill-btn:before {
    left: -17px;
    right: auto;
}

.back-drill-btn:after {
    border-color: rgba(136, 183, 213, 0);
    border-right-color: #f8f8f8;
    border-width: 5px;
    margin-top: -5px;
    margin-right: 2px;
}

.back-drill-btn:before {
    border-color: rgba(136, 183, 213, 0);
    border-right-color: #88b7d5;
    border-width: 5px;
    margin-top: -5px;
}

/*ar addtional*/
.W-dimension {
    height: 250px;
    width: 100%;
}

.right-space {
    margin-left: 5px;
}

.wysihtml5-toolbar .btn {
    padding: 5px 11px !important;
    font-size: var(--font-13, 13px) !important;
    height: 30px;
}

.chartDirection, .itg_dashboard_knob_row {
    direction: ltr;
}

    .itg_dashboard_sparkline_row .text-center, .itg_dashboard_knob_row .text-center {
        border-left: 1px solid #f4f4f4;
    }

        .itg_dashboard_sparkline_row .text-center:last-of-type, .itg_dashboard_knob_row .text-center:last-of-type {
            border-left: none;
        }

.itg_dashboard_textarea {
    width: 100%;
    height: 125px;
    font-size: var(--font-14, 14px);
    line-height: 18px;
    border: 1px solid #dddddd;
    padding: 10px;
}

/************ Posts-Style start *************/
.user-block .username, .user-block .description, .user-block .comment, .box-comments .comment-text {
    margin-right: 50px;
    margin-left: 0px;
}

.show-comments {
    margin-left: 0px;
    margin-right: 10px;
}

.img-sm, .img-md, .img-lg, .box-comments .box-comment img, .user-block.user-block-sm img, .user-block img {
    float: right;
}

    .img-sm + .img-push {
        margin-left: 0px;
        margin-right: 40px;
    }

.btn-primary i {
    margin-right: 5px;
}

.modal-footer .btn i {
    margin-left: 5px;
    margin-right: 0;
}

.itg_dashboard_Writepost_button {
    left: 29px;
    right: auto;
}

.itg_dashboard_sidechatbox_button {
    left: 75px;
    right: auto;
}

.box-comments .box-comment.replay-comment {
    padding-right: 50px;
    padding-left: 0;
}

.viewmore-box .user-block .username,
.viewmore-box .user-block .description {
    margin-right: 48px !important;
    margin-left: 0px !important;
}

/************ Posts-Style end *************/
/************ chat-Style start *************/
#sideChatBox {
    left: 0;
    right: auto;
    border-right: 3px solid #206e87;
    border-left: none;
}

.contacts-list-info {
    margin-left: 0;
    margin-right: 45px;
}

.contacts-list-img {
    float: right;
}

.direct-chat .box-tools {
    right: auto;
    left: 4px;
}

/************ chat-Style end *************/
/*********************     new 27-7-2017  AIbrahim  *************************/
/************************** General styles  ****************************/
.text-left {
    text-align: right;
}

.text-right {
    text-align: left;
}

.fa-angle-right:before {
    content: "\f104" !important;
}

.fa-angle-left:before {
    content: "\f105" !important;
}

.side-drag-widget .box-header .img-circle {
    line-height: 20px;
    vertical-align: middle;
}

.itg_dashboard_sidewidget_button {
    line-height: 29px;
    vertical-align: middle;
}

.side-drag-widget .box-header .img-circle .fa {
    margin-top: 2px;
}

.side-drag-widget .box-header .img-circle {
    float: right;
    margin-left: 5px;
    margin-right: 0;
}

.ContextMenuAlign {
    left: 0 !important;
    right: auto !important;
}

.jqTransformRadioWrapper + label, .jqTransformCheckboxWrapper + label, span[disabled="disabled"] + label {
    margin-left: 5px;
    margin-right: 0px !important;
    position: relative;
    /*    display: flex;*/
    justify-content: center;
    align-items: center;
    /*position: relative;
    top: -3px;*/
}

.scrollingCheckBoxList .jqTransformCheckboxWrapper + label {
    display: flex;
}

.StatusBarWrapper.StatusBarSuccess {
    background: #2e95b7 !important;
}

.TitleWithButtons + table tr:nth-child(1) td > table tbody tr:nth-child(2) td:nth-child(1) table tbody tr:last-child span label {
    display: inline-block;
}

.fa.EditFieldGrid {
    text-align: right;
}

/************************** Header style  ****************************/
.container-fluid > .navbar-header {
    float: right;
}

.navbar .navbar-nav .userinfo .UserNameHeader span {
    max-width: 205px;
}

.nav.navbar-nav.navbar-left {
    margin-left: 0;
    position: relative;
    margin-top: -13px;
    cursor: pointer;
    margin-right: 30px;
    padding-right: 10px;
}

.nav.navbar-nav.navbar-left {
    float: right !important;
}

.navbar .navbar-nav > li.userinfo {
    padding: 5px 0px 0px 0px;
}

    .navbar .navbar-nav > li.userinfo:after {
        top: 2px;
        left: 4px;
        right: auto;
    }

.eduwaveHeader .nav.navbar-nav.navbar-Center {
    margin-right: 70px;
    float: right;
    margin-left: 0;
    padding: 0;
}

    .eduwaveHeader .nav.navbar-nav.navbar-Center li {
        /*        float: right;*/
        margin: 0 20px;
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center.additional-navbar-center {
        margin-left: -70px;
        margin-right: 70px;
    }

.eduwaveHeader .navbar-right {
    margin-left: 10px;
    margin-right: 0;
}

.navbar .navbar-brand.client-logo {
    float: left;
    margin-left: -15px !important;
}

.navbar-nav > li {
/*    float: right;*/
}

.navbar .navbar-nav.navbar-Center > li:after {
    margin-right: 12px;
    left: auto;
    right: -10px;
}

.navbar-right .itg_dashboard_dropdown-menu.navbar-options,
.navbar-right .itg_dashboard_dropdown-menu {
    left: -5px;
    right: auto;
}

.navbar-nav.navbar-right > li > .itg_dashboard_dropdown-menu::before {
    left: 18px;
    right: auto;
}

.navbar-nav.navbar-right > li > .itg_dashboard_dropdown-menu::after {
    right: auto;
    left: 20px;
}

.navbar-right .navbar-options li:nth-child(3n+1) {
    clear: right;
}

.users-list > li {
    width: 25%;
    float: right;
}

.SearchsideBarContainer .dropdown {
    left: 5px;
    right: auto;
    padding: 6px 8px 3px 20px;
    box-shadow: 1px -1px 2px rgba(0, 0, 0, 0.1) inset;
    border-right: 1px solid #cccccc;
    border-left: none;
}

.notifbox span.NotifiTime {
    padding-right: 20px;
    padding-left: 0;
}

.e31_notifications .notifbox li a::after {
    right: 9px;
    left: auto;
}

.eduwaveHeader .navbar-right .itg_dashboard_dropdown-menu a {
    text-align: center;
    margin: auto;
    display: block;
    /*padding: 0;*/
}
#show-settings {
    z-index: 99999 !important;
    /*    position: relative ;*/
    height: auto;
}
#itg_dashboard_write_post {
    z-index: 9999 !important;
    /*    position: relative ;*/
    height: 100%;
}
.postsMainContainer.courseposts a.btn-primary {
    background: #206e87 !important;
    color: #fff !important;
}
.ui-widget-content OverMaskDialog.ui-resizable.ui-draggable.ui-draggable-handle {
    top: 30%;
}
.modal-backdrop.fade.show {
    display: none;
}
 #menu2 .WideGrid {
    overflow: visible !important;
    overflow-x: visible !important;
}
.eduwaveHeader .navbar-right .itg_dashboard_dropdown-menu .titlebar a {
    text-align: center;
}

.e31_notifications .notifbox li .CloseNotifi {
    right: auto;
    left: 10px;
}

.eduwaveHeader .navbar-right .itg_dashboard_dropdown-menu.navbar-options a {
    text-align: center !important;
}

.navbar-left .itg_dashboard_dropdown-menu:before,
.navbar-left .itg_dashboard_dropdown-menu:after {
    /*aibrahim fix bug #8497 13-12-2017*/
    right: 12px;
    left: auto;
}

/*.navbar-default .navbar-Center.navbar-nav > li > a:not(.btn) {
    font-weight: bold;
}*/
/************************** Student course page ****************************/
.coursepage .widget-block .img-circle,
.coursepage .user-block .img-circle {
    float: right;
}

.coursepage .widget-block .widget-title,
.coursepage .widget-block .widget-description,
.coursepage .user-block .username,
.coursepage .user-block .description,
.coursepage .user-block .comment {
    display: block;
    margin-right: 35px;
}

.coursepage .box-header > .box-tools > *:last-child {
    padding-left: 0;
    padding-right: 5px;
}

.writePostWarper .post-options {
    right: auto !important;
    left: 15px;
    top: 30px;
}

.latestPostsWidget .products-list .product-title {
    margin-right: 0px;
}

.products-list .product-img {
    float: right;
}

.products-list .product-info {
    margin-right: 60px;
    margin-left: 0;
}

/*.bread-crumb-links::after {
    content: "\F104";
    margin-right: 9px;
}*/
.fa-arrow-right::before {
    content: "\f060" !important;
}

.post-image-thumb, .post-video-thumb {
    float: right !important;
}

.Course-menu-ul {
    text-align: right;
}

    .Course-menu-ul a {
        padding-left: 0;
        padding-right: 60px;
    }

    .Course-menu-ul li i:before {
        left: 0;
        right: 0px;
    }

    .Course-menu-ul li .fa-DPapplications:after {
        right: 21px;
        text-shadow: 0px -1px 0px rgb(0 0 0 / 20%);
    }

    .Course-menu-ul li .fa-CourseModification:after {
        right: 24px;
        text-shadow: 0px -1px 0px rgb(0 0 0 / 20%);
    }

    .Course-menu-ul li .fa-reflection:after {
        content: "\f36c";
        position: absolute;
        top: -3px;
        right: 5px;
        left: auto;
    }

.coursepeople .products-list .product-img {
    float: right;
}

.coursepeople .product-info {
    margin-right: 50px;
    margin-left: 0px;
}

.recentActivity .products-list .product-info {
    margin-left: 0px;
    margin-right: 0;
}

.recentActivity .products-list .product-title {
    line-height: 19px;
}

.searchAriaCon .dropdown {
    margin-left: 1px;
    margin-right: 0px
}
/************************** Student dashboard ****************************/
.course-dashboard {
    /*.col-md-4 {
  	padding-left: 0;
  }*/
}

/*lement {
    width: 19px;
    height: 10px;
    position: absolute;
    vertical-align: middle;
    margin-top: 10px;
    margin-right: -24px;
    border: 0px none;
    background: rgba(0, 0, 0, 0) none repeat scroll 0% 0%;
    font: bold 6px Arial;
    font-family: Arial;
    font-size: 6px;
    text-align: center;
    color: rgb(243, 156, 17);
    padding: 0px;
}*/
.course_gradebook.accordion .box-header .course_gradbook_label + span div input {
    margin-right: 4px;
}

.course_gradebook.accordion .box-header .box-title {
    width: 100%;
}

.course_gradebook .course_gradbook_label {
    left: 35px;
    right: auto;
}

.course_gradebook_sub .course_gradbook_label + div {
    direction: ltr;
}

.itg_dashboard_todo-list li {
    padding-left: 55px;
    padding-right: 26px;
}

    .itg_dashboard_todo-list li .handle {
        left: auto;
        right: 4px;
    }

    .itg_dashboard_todo-list li .tools {
        left: 10px;
        right: auto;
    }

    .itg_dashboard_todo-list li .text {
        margin-left: 0;
        margin-right: 5px;
    }

    .itg_dashboard_todo-list li .label {
        margin-right: 10px;
        margin-left: 0;
    }

    .itg_dashboard_todo-list li .text .fa {
        margin-right: 0;
        margin-left: 3px;
    }

.course_gradbook_excused.course_gradbook_label {
    right: auto !important;
    left: 0 !important;
}

.study-groups-Widget .box-body .widget-block {
    padding-right: 0;
    padding-left: 30px;
}

    .study-groups-Widget .box-body .widget-block .img-circle {
        float: right;
        margin-left: 15px;
    }

.study-groups-Widget .fa-bullhorn {
    right: auto;
    left: 7px;
}

.study-groups-Widget .study-group-members {
    left: auto;
    right: 0;
    direction: rtl;
}

.coursesWidget .products-list .product-img {
    float: right;
}

.coursesWidget .product-info {
    margin-right: 50px;
    margin-left: 0;
}

.coursecalendarWidget .products-list .product-info {
    margin-left: 60px;
    margin-right: 0;
}

.widget_overlay.active .fa-close {
    right: auto;
    left: 10px;
}

.widget_overlay .widget_overlay_content .icon-bg {
    margin-left: 45px;
    margin-right: 0;
}

/*.widget_overlay .widget_overlay_content .text-right{
    left: 15px;
    right: auto;
}*/
.checkbox input[type="checkbox"],
.checkbox-inline input[type="checkbox"],
.radio input[type="radio"],
.radio-inline input[type="radio"] {
    margin-right: -20px;
    margin-left: 0;
}

.checkbox label,
.radio label {
    padding-right: 20px;
    padding-left: 0;
}

.widget-header-search {
    right: auto;
    left: 0;
}

.course-myschedule-Widget .products-list .product-info {
    margin-left: 0px;
    margin-right: 10px;
}

.widgetrow .col-md-6:first-child {
    padding-left: 7px;
    padding-right: 15px;
}

.widgetrow .col-md-6:last-child {
    padding-right: 7px;
    padding-left: 15px;
}

.widgetrow .col-md-6.col-md-12 {
    padding-left: 15px;
    padding-right: 15px;
}

/****************************/
.itg_table .itg_dashboard_dropdown-menu,
.box-header .itg_dashboard_dropdown-menu {
    left: auto;
    left: -16px;
    right: auto;
}

    .itg_table .itg_dashboard_dropdown-menu::after,
    .itg_table .itg_dashboard_dropdown-menu::before,
    .box-header .itg_dashboard_dropdown-menu::after,
    .box-header .itg_dashboard_dropdown-menu::before {
        left: 12px;
        right: auto;
    }

/*******************  course posts page *********************/
.product-img {
    float: right;
}

.latestPostsWidget .box-body .text-yellow i {
    margin-right: 5px;
}

.courseposts .box-comments .comment-text {
    margin-right: 40px;
    margin-left: 0px;
}

.courseposts .user-block .description {
    margin-right: 50px;
}

/*******************  courses page *********************/
.Course-sorting,
.header-sorting,
.Courses-sorting {
    text-align: left;
    float: right;
}

.header-title-content,
.course-content-header,
.courses-content-header {
    float: right;
}

.Filter-bar .sidebar-form {
    float: right;
}

.Filter-bar .filter-butt {
    width: 50%;
    float: left;
    text-align: left;
    direction: rtl;
}

.Filter-bar .Filter-bar-butt {
    margin-right: 10px;
    margin-left: 0;
    display: inline-block;
}

/*******************  Edussetion page *********************/
.input-group-addon:first-child {
    border-left-width: 0px;
    border-right: 1px solid #d2d6de;
}

/*******************  Course Portofolio page *********************/
.list-with-image .list-img {
    float: right;
}

.list-with-image .list-info {
    margin-right: 60px;
    margin-left: 0;
}

/************** Jqtransform **************/
span.jqTransformCheckboxWrapper {
    float: right ;
    margin-left: 5px;
    margin-right: 0;
}

/******************* profile page *********************/
.userSmallInfo img.userImage {
    float: right;
    margin-left: 10px;
    margin-right: 0px;
}

.Bloglabel {
    margin-right: 75px;
    margin-left: 0;
}

.userSmallInfo {
    border-left: none;
    border-right: 3px solid #cbcbcb;
}

.Notification-item-image {
    left: auto;
    right: 0;
}

.Notification-item-close {
    left: 8px !important;
    right: auto !important;
}

.RadComboBox .rcbReadOnly .rcbInputCellRight {
    display: table-cell;
    padding: 0;
}

.RadComboBox .rcbReadOnly .rcbArrowCellLeft {
    display: table-cell;
}

.RadComboBox_Default .rcbReadOnly .rcbInput {
    display: block;
}

.RadComboBox .rcbInputCell .rcbInput {
    PADDING-right: 2px !important;
    PADDING-left: 0 !important;
    height: 35px;
    /*    width: 100% !important;*/
}

input {
    border-radius: 5px;
    height: 30px;
    /*    width: 100% !important;*/
    border-color: #ddd;
    box-shadow: 0 0 0 0 transparent;
}
/**************/
.DialogTitle {
    text-align: right;
}

.align_right {
    text-align: left;
}

    .align_right a:after {
        right: auto;
        left: 10px;
    }

/***********/
.searchAriaCon .SearchArea input {
    border-right: 1px solid #e3e3e3;
    border-left: 0;
}

.searchAriaCon .dropdown > a {
    padding-right: 0;
    padding-left: 16px;
    padding-bottom: 5px;
}

.SearchsideBarContainer .dropdown > a {
    text-align: center !important;
}

.searchAriaCon .dropdown > a.SelectedItem:after {
    right: auto;
    left: 7px;
}

/********/
.StudyTheCourse h5 .fa-angle-right:before {
    /*aibrahim fix bug #8477 24-12-2017*/
    top: 4px;
    right: 6px;
    left: auto;
}

/*******/
.ValidationNote {
    /*aibrahim fix bug #8458 13-12-2017*/
    margin-right: 10px;
    margin-left: 0;
}

/************* Edu Briefcase ************/
div[id*="divEduBriefcaseMenu"] ul li {
    border-left: 1px solid #e8e8e8;
    border-right: none;
}

    div[id*="divEduBriefcaseMenu"] ul li:first-child {
        border-right: 1px solid #e8e8e8;
    }

.briefcasesidemenu ul {
    margin-right: 0px;
    margin-left: 10px;
}

/************************** General Style **********************************/
.TabelGrid tr:nth-child(2n+1) {
    direction: inherit;
}

.TitleWithButtons #buttons,
.TitleWithButtons .buttons {
    float: left !important;
}

.coursepagecontent .TitleWithButtons .TitleStyle,
.TitleWithButtons .TitleStyle {
    float: right;
}

.DialogTitle {
    text-align: right;
    padding: 4px 15px 5px;
    line-height: 21px;
    vertical-align: middle;
}

.widget-block .widget-description {
    color: #999;
    font-size: 10px;
    margin-top: -2px;
    font-weight: bold;
}

th,
.TabelGrid td, .TabelGrid th {
    /* aibrahim fix bug #6021 17/10/2017 */
    text-align: right !important;
}

.labelsStyle {
    /*aibrahim fix bug #5865 29-10-2017*/
    margin-left: 5px;
    margin-right: 0;
}

.mCSB_scrollTools .mCSB_draggerContainer {
    right: 1px !important;
    left: auto !important;
}

#calendar {
    margin: 1px !important;
}

.todo-list-container .text-right {
    position: absolute;
    left: 15px;
    right: auto;
}

.box-tool .btn-box-tool .fa-plus {
    margin-top: -1px;
}

.box-tool .btn-box-tool {
    height: 20px !important;
    width: 20px !important;
}

.box-header .img-circle i.fa-graduation-cap::before {
    margin-right: -2px;
    margin-left: 0;
}

.box-header .img-circle i.fa-line-chart::before {
    margin-right: -1px;
    margin-left: 0;
}

.OverMaskDialog {
    text-align: right !important;
}

    .OverMaskDialog .align_right a:after {
        right: auto;
        left: 2px;
    }

.videoContainer a .PlayIcons:before {
    left: calc(50% - 20px);
    font-size: 15px;
    padding: 0 11px;
    background: rgba(0, 0, 0, 0.5);
}

.DataListItems span, .LastVideos,
.LastVideo, .defaultFloatDiv,
.Instant_messages_container #btnSubmit,
.Instant_messages_container > table > tbody > tr > td:last-child tr:last-child td div {
    /*aibrahim fix bug #6021 11-9-2017*/
    float: right;
}

.Instant_messages_container > table > tbody > tr > td:first-child > div {
    border-right: none !important;
    border-left: 1px solid #f6f6f6 !important;
}

.userSmallInfo div.divQRLogin {
    float: left;
}

.AssessmentStage {
    direction: rtl;
    text-align: right;
}

.Chat_Msg_details .Chat_Msg_Date {
    float: left;
}

/*.AssessmentLabels #tdDefault p{
    direction: rtl;
    text-align: right;
}*/
.OrderAssesBoxAnswer .AssesBoxContent, .OrderAssesBox .AssesBoxContent {
    background-position: right;
}

#likesModal {
    margin-left: 10px;
    margin-right: 0;
}

.StatusBarWrapper {
    /*aibrahim fix bug #8402 13-12-2017*/
    right: 0px;
    margin: auto;
    left: 0;
}

.jqTransformRadioWrapper:first-child {
    /*aibrahim fix bug #8421 13-12-2017*/
    float: right !important;
}

/******** popup chat *********/
.right .direct-chat-text {
    margin-left: 40px !important;
    margin-right: 0 !important;
}

.direct-chat-primary .right .direct-chat-img {
    left: 2px !important;
    right: auto !important;
}

.direct-chat-primary .direct-chat-img {
    right: 2px !important;
    left: auto !important;
}

.direct-chat-text {
    margin: 5px 40px 0 0 !important;
}

.direct-chat-primary .right > .direct-chat-text:after, .direct-chat-primary .right > .direct-chat-text:before {
    border-right-color: #206e87 !important;
    border-left-color: transparent !important;
    right: 100% !important;
    top: 15px;
    left: auto !important;
}

.direct-chat-text:after, .direct-chat-text:before {
    left: 100% !important;
    border-left-color: #d2d6de !important;
    border-right-color: transparent !important;
    right: auto !important;
}

.direct-chat-primary .right {
    text-align: left !important;
}

.direct-chat-msg, .direct-chat-text {
    display: inline-block !important;
}

.VideoRate {
    right: auto;
    left: 10px;
}

.VideoAutherImage {
    float: right;
    margin: 2px 0px 10px 5px;
}

.comment ul.commentControls {
    left: 20px;
    right: auto;
    padding: 0;
}

    .comment ul.commentControls li {
        float: right;
        margin-right: 10px;
        margin-left: 0;
    }

.comments .commentCon .commenterImg {
    float: right;
    padding-left: 12px !important;
    padding-right: 0px !important;
}

.comment {
    margin: 0 45px 15px 0px;
}

.SingleVideoPage .comment:before {
    border-left: 9px solid rgba(0, 0, 0, 0.2);
    border-right: 11px solid transparent;
    right: -21px;
    left: auto;
}

.SingleVideoPage .comment::after {
    border-left: 10px solid #FFFFFF;
    border-right: 7px solid transparent;
    right: -16px;
    left: auto;
}

.eduwaveWrapper td.MailHeader,
.eduwaveWrapper .MailHeader table td {
    vertical-align: middle;
}

.briefcasesidemenu ul li a {
    border-right: 2px solid #206e87;
    border-left: none;
}

.UsageCapacity img {
    display: table;
}

/*************************** Arabic Widget Header ********************************/
.coursepage .widget-block .widget-title {
    /*    font-size: var(--font-12, 12px);*/
    margin-bottom: 2px;
}

.coursecalendarWidget .box-header .widget-block .widget-title,
.course-myschedule-Widget .box-header .widget-block .widget-title {
    font-size: var(--font-12, 12px);
    margin-bottom: 5px;
}

.coursepage .widget-block .img-circle i, .box-header .img-circle i {
    color: #fff;
    font-size: 14px;
    width: 31px;
    height: 30px;
}

.course-dashboard .box.box-widget > .box-header .img-circle i {
    padding-top: 8px !important;
}

.box-header > .box-tools {
    top: 7px;
}

.box.box-widget {
    border-radius: 8px;
    border: 1px solid #206e8763;
    padding: 5px;
}

.course-dashboard .box.box-widget > .box-header .img-circle i {
    margin-top: 0px !important;
}

/****** online and offline popup chat *********/
.ui-chatbox .online-peopel,
.ui-chatbox .ofline-peopel {
    margin-left: 3px;
    margin-right: 0;
}

/******************************* Parent Style ***********************************/
.ParentContent {
    padding-right: 0px;
}

.children {
    border: 1px solid #cfdae1;
    padding: 15px;
    height: auto;
    overflow: hidden;
}

.children_container {
    padding: 7px !important;
}

    .children_container:nth-child(2n + 1) {
        clear: right;
    }

.children_image {
    width: 100%;
    height: 123px;
}

.col-xs-4.children_img_section {
    padding: 0;
    max-width: 110px;
}

.children_number {
    width: 100%;
    text-align: center;
    font-weight: 700;
    font-size: var(--font-14, 14px);
    display: block;
    color: #fff;
    margin-top: 3px;
    background: #206e87;
}

.col-xs-8.children_details {
    padding-left: 0px;
    padding-right: 10px;
}

.children_name {
    font-size: var(--font-13, 13px);
    font-weight: 600;
    color: #666;
    display: block;
}

.children_type {
    font-weight: 300;
    display: block;
    border-bottom: 1px solid #cfdae1;
    color: #999;
    font-size: 11px;
}

.children_details_row {
    margin: 0px 0px;
}

    .children_details_row:last-child {
        margin-bottom: 0px;
    }

.details_icon {
    width: 100%;
    display: inline-block;
    padding-right: 18px;
    position: relative;
    font-size: 13px;
    font-weight: 600;
    line-height: 14px;
    margin-top: 4px;
    color: #206e87;
}

.details_number {
    width: 100%;
    display: inline-block;
    color: #666;
    font-size: var(--font-13, 13px);
    font-weight: 100;
    padding-right: 20px;
    float: right;
    line-height: 17px;
}

.details_icon:before {
    font-family: fontAwesome;
    font-size: 13px;
    color: #206e87;
    position: absolute;
    left: auto;
    right: 0;
}

.class_icon:before {
    content: "\f024";
}

.absence_icon:before {
    content: "\f274";
}

.grades_icon:before {
    content: "\f15c";
}

.ViewRubricButton,
.CreateRubricButton {
    padding: 1px 8px 0px;
    top: -6px;
    font-size: var(--font-12, 12px);
}

.jqTransformRadioWrapper + label, .jqTransformCheckboxWrapper + label {
    font-weight: bold !important;
}

.CourseColumnContent {
    /*    padding-left: 15px;
    padding-right: 0;
    margin: 0 10px;*/
}

.section.wrapper.row.eduwaveContent .col-md-2 {
    padding: 0
}

.col-md-2 .courseleftSide.clearfix {
    border: 1px solid #206e8752;
    padding: 0 20px;
    margin: 20px 11px 0 0 !important;
    border-radius: 8px;
}

.itg_dashboard_todo-list li .tools > .fa-edit {
    margin-top: 1px;
}

.container.col-md-12.content.coursepagecontent {
    border-radius: 8px;
    padding: 0 ;
}
/****************** new page title *******************/
.page-title-container {
    float: left;
    padding-right: 0;
    padding-left: 15px;
}

/************************ Teacher submenu *************************/
.Main-submenu ul li:before {
    left: 0;
    right: auto;
}

.multilines.Main-submenu ul li:before {
    left: -4px;
    right: auto;
}

.Main-submenu ul li a.active {
    margin-right: -1px;
    margin-left: 0;
}

.calendar thead .headrow {
    display: flex;
    width: 100%;
    justify-content: center;
    align-items: center;
}
#btnAddNewResource {
    padding: 0px 40px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    border-radius: 8px !important;
}
.Main-submenu ul li a,
.Main-submenu ul li a.active {
    padding: 5px 25px 7px;
    border-radius: 8px;
}

.Main-submenu ul li {
    margin-right: -4px;
    margin-left: 0px;
}

a.logOutIcon {
    position: relative !important;
    color: transparent !important;
    width: 25px;
    height:25px;
}

.logOutIcon:before {
    font-family: 'Font Awesome 5 Free', 'FontAwesome', 'Font Awesome 5 Regular' !important;
    content: "\f011" !important;
    font-size: 20px;
    color: #fff;
    position: relative;
    top: 3px;
    right: 3px;
}
.active a {
    color: rgb(46 149 183) !important;
}
a.homeIcon {
    position: relative !important;
    color: transparent !important;
    display: flex !important;
    top: -4px;
    left: 3px;
}
.fa.fa-ellipsis-v {
    color: rgb(46 149 183) !important;
}
.fa.fa-question-circle {
    top: 1px;
    left: -2px;
}
.homeIcon:before {
    font-family: 'Font Awesome 5 Free', 'FontAwesome', 'Font Awesome 5 Regular' !important;
    content: "\f015" !important;
    font-size: 20px;
    color: #fff;
    position: relative;
    top: 3px;
    right: 3px;
}
/************************************* Switch Profile **********************************************/
.switch-profile-container {
    float: right;
}

.has-popup.static > ul {
    right: 0% !important;
    left: auto !important;
    background-color: #f6f6f6;
    padding: 20px 10px;
    border-radius: 8%;
    margin-top: -20px;
}

    .has-popup.static > ul:before {
        right: 10px;
        left: auto;
    }

/*
.collapse.navbar-collapse .has-popup.static > ul:before {
    right: 10px;
}*/
/************************ HTML Template *************************/
.select-wrapper:before {
    background-position: 0 -66px !important;
    right: auto;
    left: calc(2% - 2px);
}

.select-wrapper:after {
    right: auto;
    left: calc(2% + 7px);
}

.html-tamplet-content select.form-control, .html-tamplet-content select {
    height: 23px !important;
}

.customListbox,
select[multiple],
select[size] {
    /*aibrahim 19-12-2019 fix bug No #22229*/
    height: auto !important;
}

.input-group-addon:last-child {
    border-right: 0;
    border-left: 1px solid #d2d6de;
}

.input-group-btn:first-child > .btn,
.form-control.input-lg,
.input-group-lg > .form-control,
.input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .btn,
.html-tamplet-content .input-group-lg.input-group .form-control,
.input-group-lg > .input-group-btn input[type="text"] {
    border-radius: 0 6px 6px 0;
}

.input-group-btn:last-child > .btn {
    border-radius: 6px 0 0 6px;
}

.html-tamplet-content .products-list .product-img {
    float: right;
}

.html-tamplet-content .products-list .product-info {
    margin-left: 0px;
}

.html-tamplet-content .checkbox label, .html-tamplet-content .radio label {
    padding-left: 20px;
    padding-right: 0;
}

.jqTransformRadioWrapper:first-child {
    margin-right: 0px;
    margin-left: 6px !important;
}

.roundedRBContainer .jqTransformRadioWrapper + label {
    /*aibrahim fix bug #52987 15-12-2020*/
    margin: -4px 5px 0 4px;
    display: block;
    padding: 5px 33px 5px 11px;
}

.roundedRBContainer .jqTransformRadioWrapper:first-child {
    /*aibrahim fix bug #52987 15-12-2020*/
    margin-right: 10px;
    margin-left: 6px !important;
}

.html-tamplet-content .itg_dashboard_dropdown-menu {
    left: auto;
    right: 0;
}

    .html-tamplet-content .itg_dashboard_dropdown-menu:before,
    .html-tamplet-content .itg_dashboard_dropdown-menu:after {
        left: auto;
        right: 12px;
    }

.html-tamplet-content .form-horizontal .control-label {
    text-align: right;
}

/****************** user menu icons ***************/
a[id*="lbtnMyAccount"]:before,
a[id*="lbtnLogout"]:before {
    margin-right: 0px;
    margin-left: 7px;
}

/************************** teacher side menu *********************************/
.Course-menu-ul.teacher-course-menu a {
    padding: 8px 23px 8px 10px;
}

    .Course-menu-ul.teacher-course-menu a:before {
        margin-right: -16px;
        margin-left: 0;
    }

.Course-menu-ul.teacher-course-menu li.active a {
    box-shadow: inset -4px 0px 0px #206e87;
}

/************************************ Wizard ******************************************/
#wizHeader li a:before {
    margin-left: 0;
    margin-right: 1px;
    left: 0 !important;
    right: auto !important;
}

#wizHeader li a {
    color: white;
    text-decoration: none;
    padding: 5px 5px 5px 30px !important;
    font-weight: bold;
}

    #wizHeader li a.prevStep:after {
        left: 20px !important;
        right: auto !important;
    }

    #wizHeader li a:after {
        content: "\f053" !important;
        font-weight: normal;
        left: 17px !important;
        right: auto !important;
    }

/***************** Teacher bugs *******************/
span[id*="tsStartTime"] {
    /* aibrahim 3-6-2018 fix bug No #12995 */
    direction: ltr;
}

.mCSB_scrollTools .mCSB_draggerContainer {
    /*scroll issue*/
    width: 100% !important;
}

.Post ul.DateNcomments li {
    /* aibrahim 7-6-2018 fix bug No #13064 */
    float: right !important;
    margin-right: 0px !important;
    margin-left: 10px;
}

.SearchDIV [id*="rblSendSMS"] .jqTransformRadioWrapper:first-child {
    /*aibrahim fix bug #13000 25-9-2018*/
    margin-right: 6px !important;
    margin-left: 0px !important;
}

.TabelGrid .OptionsContextMenu,
.TitleWithButtons .OptionsContextMenu {
    /*aibrahim fix Imam project bug No #16677 16-10-2018*/
/*    left: 40px !important;*/
}

/*.eduwaveWrapper  .TabelGrid .OptionsContextMenu {
    left: 8px !important;
}*/
.eduwaveWrapper  .parentFilterBar .OptionsContextMenu {
    left: auto !important;
}
.eduwaveWrapper .WideGrid .TabelGrid .OptionsLinkWidth .OptionsContextMenu {
/*        left:auto !important;*/
}
.eduwaveWrapper .WideGrid .TabelGrid .OptionsLinkWidth .OptionsContextMenu.OptionsUlMargain {
/*    left: 8px !important;*/
}
.eduwaveWrapper .CreateImageHotspotQuestionsPadding table td {
    position: static;
}
.eduwaveWrapper .CreateImageHotspotQuestionsPadding table tbody {
    position: relative;
}


input[type=checkbox], input[type=radio] {
    accent-color: #206e87;
}

.QuestionH_Title, .AnswerTitle {
    text-align: start;
}
.RadComboBoxDropDown_Default {
    border-radius: 8px !important;
    padding: 10px 5px !important;
}
.RadComboBoxDropDown .rcbItem, .RadComboBoxDropDown .rcbHovered, .RadComboBoxDropDown .rcbDisabled, .RadComboBoxDropDown .rcbLoading, .RadComboBoxDropDown .rcbCheckAllItems, .RadComboBoxDropDown .rcbCheckAllItemsHovered {
    padding: 5px 5px !important;
    border-radius: 8px !important;
}
.noData-img-container {
    background: #206e877d;
    height: 170px;
    width: 170px;
    border-radius: 50%;
    display: flex;
    align-content: center;
    justify-content: center;
    align-content: center;
    align-self: center;
    align-items: center;
    margin-bottom: 6px;
    margin: 0 auto;
}
.CreateImageHotspotQuestionsPadding table td {
    position: inherit;
}

.CreateImageHotspotQuestionsPadding  table tbody {
    position: relative !important;
}
.noDataImg {
    width: 170px;
    height: 132px;
}
.radioButtonList tr td a.jqTransformRadio.jqTransformChecked {
    background: #DEEFED !important;
    width: 100%;
    position: absolute;
    height: 100%;
    border-radius: 5px;
    top: -2px !important;
    right: -2px;
}
#FolderListContainer .mCSB_container {
    display: block;
    overflow: visible;
}
.radioButtonList tbody tr td label i {
    color: #206e87;
}
#FolderListContainer  .ValidationNote {
    color: #6c6666;

}
.radioButtonList .jqTransformRadio {
    position: absolute;
    width: 100%;
    height: 100%;
    box-shadow: unset;
    border: none;
    background: transparent;
}

.eduwaveWrapper table td {
    vertical-align: top;
    position: relative;
}

/* Start Edit Icons in Course Template  By Ahmed Refaay */
#ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin table tr td {
    /*    width: 71px;
    border: 1px solid #206e87 ;
    border-radius: 10px;
    margin: 8px;*/
/*    position: relative;*/
}

#ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin .info_postion tr td {
    /*    width: 71px;
    border: 1px solid #206e87 ;
    border-radius: 10px;
    margin: 8px;*/
    position: inherit;
}

#ctl00_ctl00_cphPageBody_cphPageBody_ucCourseTemplate_rblCourseIcons .info_postion tr td {
    position: inherit;
}

info_postion td {
    position: inherit;
}

.AssessmentStage #divTFContainer {
    width: fit-content !important;
}

.AssessmentStage .assessTrOrFa {
    padding: 5px 11px 5px 11px;
}

    .AssessmentStage .assessTrOrFa span {
        display: inline;
    }
/**************** General bugs *********************/
.all-courses .col-md-3:nth-child(4n+1) {
    /*aibrahim fix bug No #19703 11-12-2018*/
    clear: right;
}

table[id*='ucLearningStandardItem_rblSearchType'] td {
    /*aibrahim fix bug #35192 23-12-2019*/
    white-space: nowrap !important;
}

span[id*="tsStartTime"] {
    /*aibrahim fix bug #42804 22-4-2020*/
    direction: rtl;
}

/************* grade ************************/
#divOptions {
    /*float: left;*/
}

/************* grade table scroll issue in arabic *************/
.grid-table {
    direction: rtl;
}

#divGradingEntry {
    direction: ltr;
}

/************* END grade table scroll issue in arabic *************/
@media (max-width: 1024px) {
    .eduwaveHeader .navbar-right {
        left: 70px;
        right: auto !important;
    }
}

@media (max-width: 868px) {
    .coursepage .widget-block .img-circle, .coursepage .user-block .img-circle {
        margin-left: 10px;
        margin-right: 0px !important;
    }

    .container-fluid > .navbar-header, .nav.navbar-nav.navbar-left {
        float: right !important;
        /*width: auto !important;*/
    }
}

@media (max-width: 769px) {
    .navbar-header .navbar-toggle {
        float: left;
    }

    .navbar .navbar-brand {
        float: right;
    }

    .navbar-header .navbar-toggle {
        margin: 6px 5px 10px 15px;
    }

    .container-fluid > .navbar-header, .nav.navbar-nav.navbar-left {
        float: right !important;
        /*width: 100% !important;*/
    }

    .coursepage .widget-block .widget-title, for widget header title
    .coursepage .widget-block .widget-description, .coursepage .user-block .username, .coursepage .user-block .description, .coursepage .user-block .comment {
        margin-left: 35px !important;
    }

    .nav.navbar-nav.navbar-left {
        float: right !important;
    }
}

@media (max-width: 768px) {
    .popupHeader .container-fluid > .navbar-header {
        float: right !important;
    }

    .nav.navbar-nav.navbar-left {
        float: none !important;
    }

    .nav-open .navbar-collapse {
        -webkit-transform: translate3d(0px, 0, 0);
        -moz-transform: translate3d(0px, 0, 0);
        -o-transform: translate3d(0px, 0, 0);
        -ms-transform: translate3d(0px, 0, 0);
        transform: translate3d(0%, 0, 135px);
        left: 0;
    }

    /*body > .navbar-collapse {
      left: 0;
  }*/
    body > .navbar-collapse {
        left: -100%;
        right: auto !important;
        -webkit-transform: translate3d(0px, 0, 0) !important;
        -moz-transform: translate3d(0px, 0, 0) !important;
        -o-transform: translate3d(0px, 0, 0) !important;
        -ms-transform: translate3d(0px, 0, 0) !important;
        transform: translate3d(0px, 0, 0) !important;
    }

    .nav-open .bodywrapper {
        right: 0;
        -webkit-transform: translate3d(250px, 0, 0) !important;
        -moz-transform: translate3d(250px, 0, 0) !important;
        -o-transform: translate3d(250px, 0, 0) !important;
        -ms-transform: translate3d(250px, 0, 0) !important;
        transform: translate3d(250px, 0, 0) !important;
        left: auto !important;
    }

    #bodyClick {
        right: auto !important;
        /*aibrahim fix bug #9766 Chrome isssue 30-1-2018*/
        left: 250px !important;
    }

    .nav-open .bodywrapper,
    #bodyClick {
        -webkit-transition: all 0.33s;
        -moz-transition: all 0.33s;
        -o-transition: all 0.33s;
        -ms-transition: all 0.33s;
    }
}

.courseleftSide .text-virtual, .courseleftSide .text-online {
    right: 0px;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
    border-left: 1px solid #fff;
    border-right: 0px none;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.courseleftSide .StudyTheCourse h5 .fa-angle-right {
    left: 0px;
    right: inherit;
}

.courseleftSide .StudyTheCourse h5 {
    padding-left: 40px;
    padding-right: 0;
    text-align: right;
}

.courseleftSide .Course-title h6.title {
    font-size: var(--font-15, 15px);
}

.StudyTheCourse h5 {
    text-align: right;
}

.html-tamplet-content .form-group label,
.html-tamplet-content .form-horizontal .control-label {
    text-align: right;
}

.tblCal #dvCal {
    margin-left: 0px !important;
    margin-right: -12px;
}

.StudyGroupModerator:before {
    margin-left: 7px;
    margin-right: 0px;
}

/************************** Generic user Style ****************************/
.generic-assessment-Widget .product-list-in-box > .item::before {
    right: 0;
    left: auto;
}

.assessment-details-container,
.assessment-details {
    text-align: left;
}

.assessment-grade {
    direction: ltr;
}

.assessment-details-title:before {
    margin: 0 -10px 0 5px;
}

.assessment-details-container .itg_dashboard_dropdown-menu {
    left: 0;
    right: auto;
}

    .assessment-details-container .itg_dashboard_dropdown-menu:after,
    .assessment-details-container .itg_dashboard_dropdown-menu:before {
        left: 12px;
        right: auto;
    }

.generic-assessment-Widget .mCSB_scrollTools {
    left: 4px !important;
    right: auto;
}

.e-assessment-result .assessment-details-container {
    padding-left: 0;
    padding-right: 15px;
}

@media (max-width: 1050px) {
    .e-assessment-result .assessment-details {
        text-align: right;
    }
}

@media (max-width: 590px) {
    .generic-assessment-Widget .btn-group, .btn-group-vertical {
        left: 10px;
        right: auto;
    }

    .assessment-details li.assessment-grade {
        left: 30px;
        right: auto;
    }

    .finishd .assessment-title, .finishd .assessment-time, .finishd .assessment-location {
        padding-left: 125px;
        padding-right: 0;
    }
}

@media (max-width: 320px) {
    .finishd .assessment-title, .finishd .assessment-time, .finishd .assessment-location {
        padding-left: 0;
    }
}
/****************** New people Structure *****************/
.PeopleCoursePeriod .userSmallInfo {
    margin-right: 0;
    margin-left: .3%;
}

.PeopleCoursePeriod > span.jqTransformCheckboxWrapper {
    margin-left: 17px;
    margin-right: 0;
}

.col-md-7.coursepagecontent .PeopleCoursePeriod .userSmallInfo {
    margin-right: 0;
    margin-left: .5%;
}

/****************** Folder Widget *****************/
.folder-DeleteAllItems,
.folder-SelectItems,
.folder-wedgit-add {
    float: left;
}

#FolderbuttonsContainer {
    left: 30px;
    right: auto;
}

.filter-buttons {
    left: 0;
    right: auto;
    text-align: left;
}

.FilterBar-container .col-sm-6:nth-child(2n+2) {
    clear: right;
}

.FilterBar-container.SearchBar .col-sm-6:nth-child(2n+2) {
    clear: none;
}

.FilterBar-container [class*=col-sm] {
    float: right;
}

.FilterBar-container .html-tamplet-content .form-group label {
   font-family: 'Cairo Regular';
}

.fab-options {
    right: auto;
    left: 0;
}

.fab-container {
    right: auto;
    left: 10px;
}

.fab-label {
    margin-left: 10px;
    margin-right: 0px;
}

/********* Header additional style **************/
.navbar .navbar-nav .settings-menu li a [class^="ionicons"],
.navbar .navbar-nav.navbar-Center .users-menu li a [class^="ionicons"],
.navbar .navbar-nav.navbar-Center .Schedule-menu li a [class^="ionicons"],
.navbar .navbar-nav .settings-menu li a [class^="fa"],
.navbar .navbar-nav.navbar-Center .users-menu li a [class^="fa"],
.navbar .navbar-nav.navbar-Center .Schedule-menu li a [class^="fa"] {
    float: right;
}

.settings-menu .products-list .product-info,
.users-menu .products-list .product-info,
.Schedule-menu .products-list .product-info {
    margin-right: 30px;
    margin-left: 0;
}

#assessmentDragableContainer {
    /*#assessment-drag-side {
      left: calc(40% - 2px);
  }
  #assessment-right-side {
      right: 10px;
  }
  #assessment-drag-side {
      margin-left: -10px;
  }*/
}

    #assessmentDragableContainer #assessment-right-side {
        width: calc(40%);
        right: 10px;
    }

    #assessmentDragableContainer #assessment-drag-side {
        left: calc(40% - 0px);
    }

    #assessmentDragableContainer #assessment-left-side {
        left: 10px;
        width: calc(60% - 10px);
    }

    #assessmentDragableContainer .AssesBoxContent {
        min-height: 38px;
        -webkit-border-radius: 5px 0 0 5px;
        -moz-border-radius: 5px 0 0 5px;
        border-radius: 5px 0 0 5px;
    }

.MarkReview {
    position: relative;
    left: 12px;
    top: 8px;
}

.dashboard-stat.hoki {
    background-color: #206e87 !important;
}

.MarkReview span.jqTransformCheckboxWrapper {
    margin-right: -24px;
}

.assessment-tabs-header-item {
    border-right: 0;
    border-left: 1px solid #ddd;
}

/********* Invite button *********/
.lbtnInvite [id*='lblInvite'] {
    line-height: 25px;
}

.lbtnInvite .invite-icon {
    margin-top: 0px;
}

/*********************** Div Grid style *************************/
.table-head-col:before {
    right: 19px;
    left: auto;
}

.table-row .table-row-col:first-child {
    /*border-radius: 0 4px 4px 0;*/
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}

.table-row .table-row-col:last-child {
    /*border-radius: 4px 0 0 4px;*/
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
    box-shadow: inset -1px 0px 0px #fff;
}

.table-row .table-row-col:first-child::before {
    left: auto;
    right: 0;
}

.DivsGridContainer .table-row .table-row-col:last-child {
    box-shadow: inset -1px 0px 0px #f8f8f8;
    /* fix IE shadow with radious issue  */
}

.table-header-withbutons {
    margin: 3px 0px -36px !important;
}

.setupWizardTools a.table-header-butns {
    margin: -8px 0 -16px -15px;
}

.GridviewOptionsIcons {
    text-align: left;
}

/********************** filter bar new updates 3-11-2021 *****************************/
.parentFilterBar .col-form-input-wrapper .jqTransformRadioWrapper + label {
    float: right;
}

.parentFilterBar .col-form-input-wrapper .jqTransformCheckboxWrapper + label {
    float: right;
}

.parentFilterBar .col-form-input-wrapper [class*="col-sm"] {
    margin-left: 20px;
    margin-right: 0;
}

.PopupFooter {
    text-align: left;
}

.parentFilterBar .SearchBar .FilterBar-content .col-form-input {
    margin-right: 0px;
    margin-left: 15px;
}

.parentFilterBar .SearchBar .filter-buttons {
    float: left;
}

.parentFilterBar .SearchBar .all-filters.search-hidden,
.parentFilterBar .all-filters + a {
    margin-left: 15px;
    margin-right: 0px;
}

.TableGridstyle .TabelGrid > tbody > tr > td:first-child::before {
    right: 0;
    left: auto;
}

.TableGridstyle .TabelGrid > tbody > tr.tableHeaderCell > th::before {
    right: 10px;
    left: auto;
}

.TableGridstyle .GridPagination a[href*="Page$Last"]::after,
.TableGridstyle .GridPagination a[href*="Page$Last"]::before {
    content: "\f104";
}

.TableGridstyle .GridPagination a[href*="Page$First"]::after,
.TableGridstyle .GridPagination a[href*="Page$First"]::before {
    content: "\f105";
}

.PopupFooter {
    left: 20px;
    right: auto;
    direction: ltr;
}

.parentFilterBar .FilterBar-container .RadComboBox .rcbArrowCell a::after {
    left: 14%;
    right: auto;
}

/*************** Leader Board Widget***************/
.leaderBoardWidget .product-list-in-box > .item {
    border-bottom: none;
}

.leaderBoardWidget .products-list .product-info {
    margin-left: 0px;
    margin-right: 10px;
}

.leaderBoardWidget .product-img.badge-icon {
    margin-left: 10px;
    margin-right: 0px;
}

    .leaderBoardWidget .product-img.badge-icon span {
        line-height: 21px;
    }

.leaderBoardWidget.mainLeaderBoard .product-list-in-box > .item {
    margin-left: 4%;
    margin-right: 0%;
}

    .leaderBoardWidget.mainLeaderBoard .product-list-in-box > .item:nth-of-type(2n) {
        margin-left: 0;
    }

.nav-tabs > li {
    float: right;
}

.tblCal .dv-lists .fab-container {
    right: auto;
    left: -6px;
}

.tblCal .dv-lists .fab-options {
    right: auto;
    left: -7px;
    transform-origin: 5% top;
}

.tblCal .dv-lists #FolderbuttonsContainer {
    left: 0px;
    top: -8px;
}

.tblCal .dv-lists .fa.pull-right {
    margin-right: .3em;
    margin-left: 0;
}

.courses-content .fab-container {
    text-align: left;
}

.fa-thumbtack.UnPin::after {
    right: -4px;
    left: auto;
}

@media (max-width: 1270px) {
    /********************* course header *********************/
    .additional-navbar-center {
        margin-right: -30px;
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center {
        margin-left: 30px;
        margin-top: 0px;
    }

    .header-top {
        width: Calc(100% - 156px);
    }

    .eduwaveHeader .navbar-right {
        margin: 0;
        padding: 0 !important
    }

    .navbar {
        font-size: var(--font-12, 12px);
    }

        .navbar .navbar-nav > li > a [class^="fa"] {
            font-size: 15px;
        }

        .navbar .navbar-brand.client-logo {
            min-width: 52px;
            height: 52px;
        }

        .navbar .navbar-nav > li.userinfo {
            font-size: var(--font-12, 12px);
        }

        .navbar .navbar-nav .UserType {
            font-size: 10px;
        }

    .Main-submenu li {
        margin-top: 3px;
    }

    .eduwaveHeader {
        height: 65px;
    }

        .eduwaveHeader > .navbar {
            min-height: 52px;
        }

    .navbar .navbar-brand {
        height: 52px;
        min-height: 52px;
    }

    .userphoto {
        width: 35px;
        height: 35px;
    }

    .navbar-nav.navbar-Center {
        margin-top: 7px;
    }

    .navbar .navbar-nav.navbar-Center > li > a {
        /*margin: 14px 15px 10px 4px;*/
    }

    .navbar .navbar-nav.navbar-right > li {
        padding: 11px 3px;
        width: 45px;
        background-color: #ffffff09;
        margin: 5px;
        border-radius: 50%;
    }

    .nav.navbar-nav.navbar-left {
        min-width: 170px;
    }
}

@media (max-width: 1170px) {
    .tblCal .tblCalHeader td:first-child div,
    .tblCal .tblCalHeader td:last-child div {
        margin: 3px 5px !important;
    }
}

@media (max-width: 1024px) {
    .eduwaveHeader .navbar-right {
        position: absolute;
        right: 70px;
    }

    .eduwaveHeader .box-footer div {
        float: none;
        width: 100%;
        margin-bottom: 3px;
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center {
        margin-right: 0px;
        margin-left: 0px;
        padding-right: 0px;
        padding-left: 0px;
    }

    /*.navbar .navbar-nav.navbar-right > li > a {
  	padding: 0px 3px;
  }*/
    .navbar-default .navbar-nav > li > a:not(.btn) {
        font-size: var(--font-17, 17px);
    }

    .nav.navbar-nav.navbar-left {
        min-width: inherit;
        margin-left: 15px;
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center li > a:not(.btn) {
        font-size: var(--font-12, 12px);
    }
}

@media (max-width: 991px) {
    .coursepage .box .box-footer {
        margin-bottom: 0;
    }

        .coursepage .box .box-footer .col-md-12 {
            width: 100%;
        }

    .coursepagecontent.content {
        padding: 0 15px;
    }

    .page-title-container {
        float: none;
        padding-left: 15px;
    }

    .box .box-footer a.btn-default {
        display: block;
    }

    #divGradingEntry {
        min-width: 950px;
    }

    .coursepagecontent.content > .pagesection {
        padding: 10px;
    }

    .tblCal #dvCal {
        margin-left: 0px !important;
        margin-right: 0;
    }

        .tblCal #dvCal #calendar {
            margin-left: 0 !important;
            margin-right: 0 !important;
            width: 100% !important;
        }

    .tblCal > tbody > tr > td {
        display: block;
        clear: both;
    }

    .tblCal .dv-lists {
        float: none;
    }

        .tblCal .dv-lists .lst {
            width: auto;
        }
}

@media (max-width: 895px) {
    .eduwaveHeader .nav.navbar-nav.navbar-Center {
        margin-right: 0px;
        margin-left: 0px;
        padding-right: 0px;
        padding-left: 0;
    }

        .eduwaveHeader .nav.navbar-nav.navbar-Center.additional-navbar-center {
            margin-right: 0px;
            margin-left: 0px;
            padding-right: 0px;
            padding-left: 0;
        }

    .userphoto {
        width: 30px;
        height: 30px;
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center li > a:not(.btn) {
        font-size: 11px;
        padding: 9px 6px;
    }

    .navbar-nav > li .fa-th::before {
        font-size: 14px;
        padding: 4px 4px 2px;
    }

    .navbar .navbar-nav .notification {
        padding: 0 5px;
        font-size: 9px;
    }
}
@media(max-width: 992px) {
    .k-grid .k-grid-content table

{
    border-spacing: 0 10px !important;
    min-width: 100%;
    table-layout: auto !important;
    display: block;
    overflow-x: auto;
}

.k-grid-content table, .k-grid-content-locked > table, .k-grid-footer table, .k-grid-header table {
    table-layout: auto !important;
}
}
@media (min-width: 769px) and (max-width: 992px) {
    .k-grid .k-grid-content table {
        border-spacing: 0 10px !important;
        min-width: 100%;
        table-layout: auto !important;
        display: block;
        overflow-x: auto;
    }

    .k-grid-content table, .k-grid-content-locked > table, .k-grid-footer table, .k-grid-header table {
        table-layout: auto !important;
    }
    /*********** botstrap definition *******************/
    .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
        float: left;
    }

    .col-md-12 {
        width: 100%;
    }

    .col-md-11 {
        width: 91.66667%;
    }

    .col-md-10 {
        width: 83.33333%;
    }

    .col-md-9 {
        width: 75%;
    }

    .col-md-8 {
        width: 66.66667%;
    }

    .col-md-7 {
        width: 58.33333%;
    }

    .col-md-6 {
        width: 50%;
    }

    .col-md-5 {
        width: 41.66667%;
    }

    .col-md-4 {
        width: 33.33333%;
    }

    .col-md-3 {
        width: 25%;
    }

    .col-md-2 {
        width: 16.66667%;
    }

    .col-md-1 {
        width: 8.33333%;
    }

    /************** course page ****************/
    .page-title-container {
        float: right;
        padding-left: 0;
        padding-right: 7px;
    }

        .page-title-container + .col-md-2 {
            width: 21.667%;
            padding: 0 7px;
        }

    .page-title-container,
    .CourseColumnContent {
        width: 78.333%;
    }

    .coursepagecontent.content {
/*        width: 77.333%;*/
    }

    .coursepage.coursepagecontent {
        /*main course page*/
        width: 78.33% !important;
        padding-left: 0;
        padding-right: 7px;
    }

    .col-md-3.courseRightSide {
        float: right;
        width: 78.333%;
        padding-left: 0;
    }

    .col-md-10.CourseColumnContent .coursepagecontent.content {
        width: 100%;
    }

    .col-md-10.CourseColumnContent .coursepagecontent.content {
        padding: 7px;
    }

    .CourseColumnContent {
        padding-right: 7px;
    }

    /*******************************************/
    .eduwaveHeader .navbar-right {
        right: 56px;
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center {
        /*margin-left: 24px;*/
    }

    clearfix.header-top {
        width: Calc(100% - 126px);
    }

    .navbar .navbar-brand {
        padding: 0px 10px;
        width: 115px;
    }

        .navbar .navbar-brand img {
/*            width: 33%;*/
        }

        .navbar .navbar-brand.client-logo img {
            max-width: 35px;
            max-height: 35px;
            vertical-align: top;
        }

    .course-list .topImage {
        width: 42px;
        height: 42px;
    }

    .navbar-Center .navbar-options,
    .navbar-right .navbar-options {
        min-width: 300px;
    }

    .navbar-Center .itg_dashboard_dropdown-menu {
        min-width: 300px;
    }

    .MarginWrapper .wrapper .coursepagecontent {
        margin-bottom: 10px;
    }

    .coursepagecontent .TitleStyle, .coursepagecontent .TitleWithButtons {
        margin: 0 2px 10px;
    }

    .postsMainContainer {
        padding: 10px;
    }

        .postsMainContainer.ui-chatbox {
            padding: 0px;
        }
}

@media (min-width: 769px) {
    body > .navbar-collapse.collapse {
        display: none !important;
    }

    .footer:not(.footer-big) nav > ul li:first-child {
        margin-left: 0;
    }
}

@media (max-width: 768px) {
    .parentFilterBar.pageFilterBar .FilterBar-container table:not([summary="combobox"]) td,
    .parentFilterBar.pageFilterBar .col-form-input,
    .parentFilterBar.pageFilterBar .col-form-label {
        display: block;
    }

    .parentFilterBar.pageFilterBar .FilterBar-container .RadComboBox table td {
        display: table-cell;
    }

    /********************* Start the course *********************/
    .sidebar-collapse .start-the-course .main-sidebar {
        -webkit-transform: translate(-316px, 0);
        -ms-transform: translate(-316px, 0);
        -o-transform: translate(-316px, 0);
        transform: translate(-316px, 0);
    }

    .sidebar-collapse .start-the-course .content-wrapper {
        margin-left: 0px;
    }

    /***************** Student dashboard ****************/
    .coursepage .col-md-6 .box-body {
        height: 260px;
    }

    .courses-container {
        height: 100%;
    }

    .box .box-footer a.btn-default {
        width: 100%;
    }

    .widgetrow .col-md-6:first-child,
    .widgetrow .col-md-6:last-child {
        padding: 0 15px ;
    }

    .label.closed-label {
        display: inline-block;
    }

    products-list .product-img {
        float: none;
        margin-bottom: -32px;
    }

    .products-list .product-date {
        margin-right: 55px;
    }

    .latestPostsWidget .writePostWarper .post-options {
        position: relative;
        left: 0;
        width: 100%;
    }

    .latestPostsWidget .products-list .product-title {
        margin-bottom: 15px;
        margin-right: 55px !important;
    }

    .latestPostsWidget .products-list .product-info {
        margin-right: 0;
    }

    .latestPostsWidget .products-list > .item,
    .coursesAnouicmentWidget .products-list > .item {
        border-top: 1px solid #eee;
        padding-top: 10px;
    }

    .post-image-thumb,
    .post-video-thumb {
        width: 65px;
        height: 65px;
    }

    .coursepage .user-block .username,
    .coursepage .user-block .description,
    .coursepage .user-block .comment {
        margin-left: 0;
    }

    .coursepage .widget-block .widget-title,
    .coursepage .widget-block .widget-description {
        margin-left: 30px;
    }

    .widget-block .widget-title {
        /*        font-size: var(--font-13, 13px);*/
    }

    .coursecalendarWidget .products-list .product-info {
        margin-left: 0 !important;
    }

    .coursecalendarWidget .products-list .product-info,
    .coursecalendarWidget .product-list-in-box .item .pull-right {
        float: none !important;
    }

    .course-dashboard .col-md-4 {
        padding-right: 0;
        padding-left: 0;
    }

    .course-myschedule-Widget .product-list-in-box .item .pull-right {
        text-align: right;
        margin-top: 5px;
        width: 100%;
    }

    .course_gradebook .pull-left {
        display: block;
        float: none !important;
    }

    /***************** main menu ****************/
    .collapse.navbar-collapse.has-image .navbar-nav > li {
        float: none;
    }

    .collapse.navbar-collapse.has-image .navbar-nav {
        padding: 0;
        margin: 0;
        float: none !important;
    }

    .navbar-nav > li .fa-th:before {
        padding: 5px 6px 3px;
        font-size: 18px;
    }

    /***************** Header ****************/
    .navbar-right .course-chat-menu.itg_dashboard_dropdown-menu {
        margin-bottom: 10px;
    }

    .navbar-Center .itg_dashboard_dropdown-menu {
        min-height: 245px;
        min-width: 100%;
    }

    .navbar-Center .navbar-options.course-list li {
        width: 50%;
    }

    .navbar-Center .navbar-options.course-list .box-footer .btn {
        display: block;
    }

    .navbar-nav .navbar-options li .fa-Grades-Management:after {
        top: 15px;
        left: 52%;
    }

    .navbar-nav .navbar-options li a:after {
        z-index: 1 !important;
    }

    .container-fluid > .navbar-header {
        float: none;
    }

    .navbar-right {
        float: none !important;
    }

    .navbar-nav .notification,
    .navbar-collapse .navbar-nav .notification {
        top: 0;
        left: 44%;
    }

    .popupHeader {
        /*aibrahim fix bug #5906 25-10-2017*/
    }

        .popupHeader .navbar .navbar-collapse.collapse,
        .popupHeader .navbar .navbar-collapse.collapse.in,
        .popupHeader .navbar .navbar-collapse.collapsing {
            display: block !important;
            min-width: 280px;
        }

        .popupHeader .navbar-header {
            float: left;
        }

        .popupHeader .container-fluid > .navbar-header {
            float: left !important;
        }

        .popupHeader .navbar-header .collapse, .popupHeader .navbar-toggle {
            display: none !important;
        }

    .container-fluid > .navbar-header, .nav.navbar-nav.navbar-left {
        float: left;
        width: 100%;
    }

    .popupHeader .container-fluid > .navbar-header {
        width: auto;
    }

    .navbar-default .navbar-nav.navbar-Center > li > a:not(.btn) {
        color: #fff;
        font-size: var(--font-12, 12px);
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center {
        padding-left: 0px;
    }

    .navbar .navbar-brand {
        width: 115px;
    }

        .navbar .navbar-brand img {
            width: 100%;
        }

    .collapse.navbar-collapse.has-image .box-footer a {
        display: block;
    }

    .course-chat-menu #divMessages {
        min-height: 220px;
    }

    /*************** switch profile **********/
    .switch-profile-container > div,
    .switch-profile-container ul,
    .switch-profile-container {
        float: none !important;
        width: 100% !important;
    }

    .switch-profile-container {
        height: 30px;
    }

        .switch-profile-container > a {
            height: 0px !important;
            display: block;
        }

    .switch-profile-icon {
        left: calc(50% - 15px);
    }

    .has-popup.static {
        width: 100%;
    }

    /********************* Course Page *******************/
    .coursepagecontent.content {
        width: calc(100% - 30px);
        margin: auto;
    }

    .CourseColumnContent .coursepagecontent.content {
        width: 100%;
    }

    .MarginWrapper .wrapper .coursepagecontent {
        margin-bottom: 15px;
    }

    .coursepage.coursepagecontent {
        width: 100%;
    }

    .MarginWrapper .CourseColumnContent .coursepagecontent {
        margin-bottom: 0;
    }

    .CourseColumnContent {
        padding-left: 15px;
    }

    .MarginWrapper .wrapper .courseleftSide {
        margin-bottom: 15px;
    }

    .footer:not(.footer-big) nav > ul li:first-child {
        margin-left: 0;
    }

    .sidebar {
        display: none;
    }

    .main-panel {
        width: 100%;
    }

    /****************** New course image style ********************/
    .leftSidecontent .row:first-of-type {
/*        width: 200px;*/
        margin: auto;
    }
    .courseleftSide div.Course-img {
        width: 100%;
        padding-top: 55%;
        position: relative;
        background-color: transparent;
    }

    .courseleftSide .Course-img {
        width: 200px;
    }

    .courseleftSide .StudyTheCourse {
        box-shadow: 0px -1px 0px #c8c8ca;
    }

    /******************* General *********************/
    .instructionPopup {
        margin-left: -250px;
        margin-top: 6px;
    }

    .SearchDIV table td {
        display: inline-block;
        max-width: 260px;
        /*commented because There is no default structure to the content of".SearchDIV" */
        /*width: 45% !important;*/
    }

        .SearchDIV table td:nth-child(3n) {
            /*commented because There is no default structure to the content of".SearchDIV" */
            /* display: block;*/
        }

    .RadComboBox .rcbHovered .rcbInputCellLeft,
    .RadComboBox table td.rcbInputCell,
    .RadComboBox .rcbFocused .rcbInputCellLeft,
    .RadComboBox .rcbReadOnly .rcbInputCellLeft {
        background-position: 0 -88px;
        width: 100% !important;
    }

    .SearchBar .FilterBar-content .form-group {
        width: 100%;
    }

    .parentFilterBar .SearchBar.FilterBar-container .RadComboBox_Default {
        width: 100% !important;
    }

    .fullSearchAreaBottom {
        padding-bottom: 40px;
    }
}

@media (max-width: 768px) {

    .header-top {
        width: 100%;
    }

    #divGradingEntry {
        /*min-width: 950px;*/
    }

        #divGradingEntry .grid-table tr:nth-child(2n+0) {
            background: #f5f5f5 !important;
        }

    .main-panel-noSideBar {
        width: 100%;
    }

    .navbar-transparent {
        padding-top: 15px;
        background-color: rgba(0, 0, 0, 0.45);
    }

    body {
        position: relative;
    }

    .navbar .container {
        left: 0;
        width: 100%;
        -webkit-transition: all 0.33s cubic-bezier(0.685, 0.0473, 0.346, 1);
        -moz-transition: all 0.33s cubic-bezier(0.685, 0.0473, 0.346, 1);
        -o-transition: all 0.33s cubic-bezier(0.685, 0.0473, 0.346, 1);
        -ms-transition: all 0.33s cubic-bezier(0.685, 0.0473, 0.346, 1);
        transition: all 0.33s cubic-bezier(0.685, 0.0473, 0.346, 1);
        position: relative;
    }

    .navbar .navbar-collapse.collapse,
    .navbar .navbar-collapse.collapse.in,
    .navbar .navbar-collapse.collapsing {
        display: none !important;
    }

    .navbar-nav > li {
        float: none;
        position: relative;
        display: block;
    }

    body > .navbar-collapse {
        position: fixed;
        display: block;
        top: 0;
        height: 100%;
        width: 250px;
        right: 0;
        z-index: 1032;
        visibility: visible;
        background-color: #999;
        overflow-y: visible;
        border-top: none;
        text-align: left;
        padding: 0;
        -webkit-transform: translate3d(250px, 0, 0);
        -moz-transform: translate3d(250px, 0, 0);
        -o-transform: translate3d(250px, 0, 0);
        -ms-transform: translate3d(250px, 0, 0);
        transform: translate3d(250px, 0, 0);
        -webkit-transition: all 0.33s cubic-bezier(0.685, 0.0473, 0.346, 1);
        -moz-transition: all 0.33s cubic-bezier(0.685, 0.0473, 0.346, 1);
        -o-transition: all 0.33s cubic-bezier(0.685, 0.0473, 0.346, 1);
        -ms-transition: all 0.33s cubic-bezier(0.685, 0.0473, 0.346, 1);
        transition: all 0.33s cubic-bezier(0.685, 0.0473, 0.346, 1);
    }

        body > .navbar-collapse > ul {
            position: relative;
            z-index: 4;
            overflow-x: hidden;
            height: calc(100vh - 61px);
            width: 100%;
        }

    .additional-navbar-center {
        margin: 0 0 -10px !important;
    }

    .fa-badges {
        height: 57px !important;
    }

    .leaderBoardWidget.mainLeaderBoard .product-list-in-box > .item {
        width: 100%;
        margin: 0% !important;
    }

    body > .navbar-collapse .nav > li > a {
        padding: 10px 25px;
    }

    .collapse.navbar-collapse.has-image .navbar-nav {
        margin: 10px 0;
    }

        .collapse.navbar-collapse.has-image .navbar-nav.navbar-Center > li > a {
            background: #206e87;
            margin-bottom: 2px;
        }

            .collapse.navbar-collapse.has-image .navbar-nav.navbar-Center > li > a:hover {
                background: #359ce4;
            }

        .collapse.navbar-collapse.has-image .navbar-nav.navbar-Center > li:hover > a:not(.btn):after {
            content: "";
            position: absolute;
            bottom: 0;
            display: block;
            left: 0;
            height: 3px;
            background: #fff;
            width: 100%;
        }

    body > .navbar-collapse .nav > li > a.fa.fa-comments {
        margin-top: 10px;
    }

    body > .navbar-collapse:before {
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        position: absolute;
        background-color: #282828;
        display: block;
        content: "";
        z-index: 1;
    }

    body > .navbar-collapse .logo {
        position: relative;
        z-index: 4;
    }

    .nav-open .navbar-collapse {
        -webkit-transform: translate3d(0px, 0, 0);
        -moz-transform: translate3d(0px, 0, 0);
        -o-transform: translate3d(0px, 0, 0);
        -ms-transform: translate3d(0px, 0, 0);
        transform: translate3d(0px, 0, 0);
    }

    .nav.navbar-nav.navbar-left {
        margin-left: 0px;
        margin-top: 0px;
    }

    .navbar-nav .navbar-brand {
        display: none;
    }

    .navbar-nav .navbar-left {
        color: #fff;
    }

        .navbar-nav .navbar-left .userinfo {
            padding-bottom: 10px;
            font-weight: bold;
        }

            .navbar-nav .navbar-left .userinfo .UserType,
            .navbar-nav .navbar-left .userinfo .UserNameHeader {
                white-space: nowrap;
                text-overflow: ellipsis;
                width: 90%;
                overflow: hidden;
                margin: auto;
            }

            .navbar-nav .navbar-left .userinfo .UserType {
                font-weight: normal;
            }

    .nav-open .navbar .container {
        left: -250px;
    }

    .nav-open .bodywrapper {
        left: 0;
        -webkit-transform: translate3d(-250px, 0, 0);
        -moz-transform: translate3d(-250px, 0, 0);
        -o-transform: translate3d(-250px, 0, 0);
        -ms-transform: translate3d(-250px, 0, 0);
        transform: translate3d(-250px, 0, 0);
    }

    .navbar-toggle .icon-bar {
        display: block;
        position: relative;
        background: #fff;
        width: 24px;
        height: 2px;
        border-radius: 1px;
        margin: 0 auto;
    }

    .navbar-header .navbar-toggle {
        /*margin: 10px 15px 10px 0;
    width: 40px;
    height: 40px;*/
        margin: 6px 15px 10px 0;
        width: 40px;
        height: 0;
    }

    .bar1,
    .bar2,
    .bar3 {
        outline: 1px solid transparent;
    }

    .bar1 {
        top: 0px;
        -webkit-animation: topbar-back 500ms linear 0s;
        -moz-animation: topbar-back 500ms linear 0s;
        animation: topbar-back 500ms 0s;
        -webkit-animation-fill-mode: forwards;
        -moz-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }

    .bar2 {
        opacity: 1;
    }

    .bar3 {
        bottom: 0px;
        -webkit-animation: bottombar-back 500ms linear 0s;
        -moz-animation: bottombar-back 500ms linear 0s;
        animation: bottombar-back 500ms 0s;
        -webkit-animation-fill-mode: forwards;
        -moz-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }

    .toggled .bar1 {
        top: 6px;
        -webkit-animation: topbar-x 500ms linear 0s;
        -moz-animation: topbar-x 500ms linear 0s;
        animation: topbar-x 500ms 0s;
        -webkit-animation-fill-mode: forwards;
        -moz-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }

    .toggled .bar2 {
        opacity: 0;
    }

    .toggled .bar3 {
        bottom: 6px;
        -webkit-animation: bottombar-x 500ms linear 0s;
        -moz-animation: bottombar-x 500ms linear 0s;
        animation: bottombar-x 500ms 0s;
        -webkit-animation-fill-mode: forwards;
        -moz-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }

    @keyframes topbar-x {
        0% {
            top: 0px;
            transform: rotate(0deg);
        }

        45% {
            top: 6px;
            transform: rotate(145deg);
        }

        75% {
            transform: rotate(130deg);
        }

        100% {
            transform: rotate(135deg);
        }
    }

    @-webkit-keyframes topbar-x {
        0% {
            top: 0px;
            -webkit-transform: rotate(0deg);
        }

        45% {
            top: 6px;
            -webkit-transform: rotate(145deg);
        }

        75% {
            -webkit-transform: rotate(130deg);
        }

        100% {
            -webkit-transform: rotate(135deg);
        }
    }

    @-moz-keyframes topbar-x {
        0% {
            top: 0px;
            -moz-transform: rotate(0deg);
        }

        45% {
            top: 6px;
            -moz-transform: rotate(145deg);
        }

        75% {
            -moz-transform: rotate(130deg);
        }

        100% {
            -moz-transform: rotate(135deg);
        }
    }

    @keyframes topbar-back {
        0% {
            top: 6px;
            transform: rotate(135deg);
        }

        45% {
            transform: rotate(-10deg);
        }

        75% {
            transform: rotate(5deg);
        }

        100% {
            top: 0px;
            transform: rotate(0);
        }
    }

    @-webkit-keyframes topbar-back {
        0% {
            top: 6px;
            -webkit-transform: rotate(135deg);
        }

        45% {
            -webkit-transform: rotate(-10deg);
        }

        75% {
            -webkit-transform: rotate(5deg);
        }

        100% {
            top: 0px;
            -webkit-transform: rotate(0);
        }
    }

    @-moz-keyframes topbar-back {
        0% {
            top: 6px;
            -moz-transform: rotate(135deg);
        }

        45% {
            -moz-transform: rotate(-10deg);
        }

        75% {
            -moz-transform: rotate(5deg);
        }

        100% {
            top: 0px;
            -moz-transform: rotate(0);
        }
    }

    @keyframes bottombar-x {
        0% {
            bottom: 0px;
            transform: rotate(0deg);
        }

        45% {
            bottom: 6px;
            transform: rotate(-145deg);
        }

        75% {
            transform: rotate(-130deg);
        }

        100% {
            transform: rotate(-135deg);
        }
    }

    @-webkit-keyframes bottombar-x {
        0% {
            bottom: 0px;
            -webkit-transform: rotate(0deg);
        }

        45% {
            bottom: 6px;
            -webkit-transform: rotate(-145deg);
        }

        75% {
            -webkit-transform: rotate(-130deg);
        }

        100% {
            -webkit-transform: rotate(-135deg);
        }
    }

    @-moz-keyframes bottombar-x {
        0% {
            bottom: 0px;
            -moz-transform: rotate(0deg);
        }

        45% {
            bottom: 6px;
            -moz-transform: rotate(-145deg);
        }

        75% {
            -moz-transform: rotate(-130deg);
        }

        100% {
            -moz-transform: rotate(-135deg);
        }
    }

    @keyframes bottombar-back {
        0% {
            bottom: 6px;
            transform: rotate(-135deg);
        }

        45% {
            transform: rotate(10deg);
        }

        75% {
            transform: rotate(-5deg);
        }

        100% {
            bottom: 0px;
            transform: rotate(0);
        }
    }

    @-webkit-keyframes bottombar-back {
        0% {
            bottom: 6px;
            -webkit-transform: rotate(-135deg);
        }

        45% {
            -webkit-transform: rotate(10deg);
        }

        75% {
            -webkit-transform: rotate(-5deg);
        }

        100% {
            bottom: 0px;
            -webkit-transform: rotate(0);
        }
    }

    @-moz-keyframes bottombar-back {
        0% {
            bottom: 6px;
            -moz-transform: rotate(-135deg);
        }

        45% {
            -moz-transform: rotate(10deg);
        }

        75% {
            -moz-transform: rotate(-5deg);
        }

        100% {
            bottom: 0px;
            -moz-transform: rotate(0);
        }
    }

    @-webkit-keyframes fadeIn {
        0% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    @-moz-keyframes fadeIn {
        0% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    @keyframes fadeIn {
        0% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    .itg_dashboard_dropdown-menu .divider {
        background-color: rgba(229, 229, 229, 0.15);
    }

    .navbar-nav {
        margin: 1px 0;
        text-align: center;
    }

        .navbar-nav .open .itg_dashboard_dropdown-menu > li > a {
            padding: 15px 15px 5px 50px;
        }

        .navbar-nav .open .itg_dashboard_dropdown-menu > li:first-child > a {
            padding: 5px 15px 5px 50px;
        }

        .navbar-nav .open .itg_dashboard_dropdown-menu > li:last-child > a {
            padding: 15px 15px 25px 50px;
        }

    .navbar-collapse.has-image .navbar-nav .open .itg_dashboard_dropdown-menu > li:last-child > a,
    .navbar-collapse.has-image .navbar-nav .open .itg_dashboard_dropdown-menu > li:first-child > a {
        padding: 15px 15px 5px 50px;
        border-radius: 0;
    }

    .navbar-collapse.has-image .navbar-nav .open .itg_dashboard_dropdown-menu > li:last-child > a,
    .navbar-collapse.has-image .itg_dashboard_dropdown-menu.navbar-options {
        border-bottom: 2px solid #ccc;
        border-radius: 0;
    }

    [class*="navbar-"] .navbar-nav > li > a,
    [class*="navbar-"] .navbar-nav > li > a:hover,
    [class*="navbar-"] .navbar-nav > li > a:focus,
    [class*="navbar-"] .navbar-nav .active > a,
    [class*="navbar-"] .navbar-nav .active > a:hover,
    [class*="navbar-"] .navbar-nav .active > a:focus,
    [class*="navbar-"] .navbar-nav .open .itg_dashboard_dropdown-menu > li > a,
    [class*="navbar-"] .navbar-nav .open .itg_dashboard_dropdown-menu > li > a:hover,
    [class*="navbar-"] .navbar-nav .open .itg_dashboard_dropdown-menu > li > a:focus,
    [class*="navbar-"] .navbar-nav .navbar-nav .open .itg_dashboard_dropdown-menu > li > a:active {
        color: white;
        opacity: 1;
    }

        [class*="navbar-"] .navbar-nav > li > a,
        [class*="navbar-"] .navbar-nav > li > a:hover,
        [class*="navbar-"] .navbar-nav > li > a:focus,
        [class*="navbar-"] .navbar-nav .open .itg_dashboard_dropdown-menu > li > a,
        [class*="navbar-"] .navbar-nav .open .itg_dashboard_dropdown-menu > li > a:hover,
        [class*="navbar-"] .navbar-nav .open .itg_dashboard_dropdown-menu > li > a:focus {
            opacity: 1;
            background: transparent;
        }

    [class*="navbar-"] .navbar-nav.navbar-nav .open .itg_dashboard_dropdown-menu > li > a:active {
        opacity: 1;
    }

    [class*="navbar-"] .navbar-nav .dropdown > a:hover .caret {
        border-bottom-color: #777;
        border-top-color: #777;
    }

    [class*="navbar-"] .navbar-nav .dropdown > a:active .caret {
        border-bottom-color: white;
        border-top-color: white;
    }

    /*.itg_dashboard_dropdown-menu {
      display: none;
  }*/
    .navbar-fixed-top {
        -webkit-backface-visibility: hidden;
    }

    #bodyClick {
        height: 100%;
        width: 100%;
        position: fixed;
        opacity: 0;
        top: 0;
        left: auto;
        right: 250px;
        content: "";
        z-index: 9999;
        overflow-x: hidden;
        background-color: #333;
        opacity: .5;
    }

    .social-line .btn {
        margin: 0 0 10px 0;
    }

    .subscribe-line .form-control {
        margin: 0 0 10px 0;
    }

    .social-line.pull-right {
        float: none;
    }

    .footer nav.pull-left {
        float: none !important;
    }

    .footer:not(.footer-big) nav > ul li {
        float: none;
    }

    .social-area.pull-right {
        float: none !important;
    }

    .form-control + .form-control-feedback {
        margin-top: -8px;
    }

    .navbar-toggle:hover,
    .navbar-toggle:focus {
        background-color: transparent !important;
    }

    .btn.dropdown-toggle {
        margin-bottom: 0;
    }

    .media-post .author {
        width: 20%;
        float: none !important;
        display: block;
        margin: 0 auto 10px;
    }

    .media-post .media-body {
        width: 100%;
    }

    .navbar-collapse.collapse {
        height: 100% !important;
    }

        .navbar-collapse.collapse.in {
            display: block;
        }

    .navbar-header .collapse,
    .navbar-toggle {
        display: block !important;
    }

    .navbar-header {
        float: none;
    }

    .navbar-nav .open .itg_dashboard_dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .navbar-collapse .nav p {
        font-size: var(--font-14, 14px);
        margin: 0;
    }

    .navbar-collapse [class^="pe-7s-"] {
        float: left;
        font-size: var(--font-20, 20px);
        margin-right: 10px;
    }

    .navbar-collapse.collapse .itg_dashboard_dropdown-menu {
        background: #fff;
    }

    .navbar-collapse.has-image .navbar-nav .open .itg_dashboard_dropdown-menu > li:first-child > a,
    .navbar-collapse.has-image .navbar-nav .open .itg_dashboard_dropdown-menu > li:last-child > a,
    .navbar-collapse.has-image .navbar-nav .open .itg_dashboard_dropdown-menu > li > a {
        color: #206e87;
        padding: 15px;
        text-align: center;
    }

    .eduwaveWrapper .MarginWrapper {
/*        width: calc(100% + 50px);*/
    }

    .mCustomScrollBox {
        max-height: inherit !important;
    }

    .navbar-Center .navbar-options, .navbar-right .navbar-options {
        max-width: 100%;
        min-width: 100%;
    }

    .itg_dashboard_dropdown-menu .box-footer div {
        color: #206e87;
        font-size: var(--font-12, 12px);
        margin: 0 0 -11px;
        width: 100%;
    }

    .SearchsideBarContainer .dropdown {
        bottom: 7px;
        top: inherit;
    }

    .fc-header-right {
        display: table-cell !important;
        width: 200px;
    }

    .popupHeader {
        /*aibrahim fix bug #5906 25-10-2017*/
    }

        .popupHeader .navbar .navbar-collapse.collapse,
        .popupHeader .navbar .navbar-collapse.collapse.in,
        .popupHeader .navbar .navbar-collapse.collapsing {
            display: block !important;
            min-width: 280px;
        }

        .popupHeader .navbar-header {
            float: left;
        }

        .popupHeader .container-fluid > .navbar-header {
            float: left !important;
        }

        .popupHeader .navbar-header .collapse, .popupHeader .navbar-toggle {
            display: none !important;
        }

        .popupHeader .navbar-brand.client-logo {
            min-width: 52px;
            height: 59px;
            line-height: 45px;
        }

    /*********** people page ************/
    table[id*="dlCoursePeriodAudience"] > tbody > tr {
        display: block !important;
    }

        table[id*="dlCoursePeriodAudience"] > tbody > tr > td {
            width: 100% !important;
            display: block !important;
        }

    #divPopupDialogContent .OverMaskDialog {
        position: absolute !important;
        width: 98% !important;
        top: 15% !important;
    }
    .ui-widget-content.OverMaskDialog.ui-resizable.ui-draggable.ui-draggable-handle {
        top: 15% !important;
    }
        #divPopupDialogContent .OverMaskDialog tr, #divPopupDialogContent .OverMaskDialog tbody, #divPopupDialogContent .OverMaskDialog td {
            width: 100%;
            display: block;
        }

        #divPopupDialogContent .OverMaskDialog .DialogTitle {
            display: table-cell;
        }

    /*.tblCal #dvCal{
      margin-top: 0 !important;
  }*/
    /*******************************/
    .SearchDIV tr[id*="trCalGregorian"] td:nth-child(1),
    .SearchDIV tr[id*="trCalGregorian"] td:nth-child(2) {
        display: table-cell;
    }
}
/* Changes for small display */
@media (max-width: 550px) {
    .k-scheduler .k-scheduler-toolbar > ul,
    .k-scheduler .k-scheduler-toolbar > ul li.k-nav-current,
    .k-scheduler .k-scheduler-toolbar > ul li.k-nav-today {
        display: block;
        text-align: center;
        float: none;
        margin-bottom: 10px;
    }

        .k-scheduler .k-scheduler-toolbar > ul:first-child {
            float: none;
        }

    .bodywrapper {
        padding-bottom: 80px;
    }

    .EarnedBadgesWidget .widget-block {
        text-align: left;
    }

    .writePostWarper .post-options,
    .writePostWarper .pull-right {
        position: relative !important;
        left: 0;
        width: 100%;
    }

    .post-options .itg_dashboard_dropdown-menu .headerscroll div[id*="liCourse"] {
        min-width: 150px;
    }
}

@media (max-width: 478px) {
    /***************** General***************/
    body {
        min-width: 250px;
        font-size: var(--font-13, 13px);
    }

    .pagination > li > a, .pagination > li > span {
        padding: 1px 7px;
        margin: 0px;
    }

    .FileUploaderStyle > div {
        width: 70px !important;
        display: block !important;
        position: relative !important;
        margin: 0px 0 6px;
    }

    .products-list .product-info {
        margin-left: 35px;
    }

    .product-img img, .latestPostsWidget .products-list .product-img img,
    .coursesAnouicmentWidget .products-list .product-img img,
    .coursepeople .products-list .product-img img,
    .products-list .product-img img {
        width: 30px;
        height: 30px;
    }

    .coursepeople .product-info {
        margin-top: 5px;
    }

    .StatusBarError, .StatusBarSuccess {
        max-width: 100% !important;
        left: 50%;
        margin-left: -50%;
    }

    .instructionPopup {
        width: calc(100% - 20px);
        left: 10px !important;
        margin-left: 0;
    }

    #divDialog {
        left: 20px !important;
    }

    /*******************************************/
    /****************** Grading page ******************/
    .grading_priods {
        padding: 5px;
        background: #eee;
        border: 1px solid #ddd;
        margin-bottom: 10px;
    }

    .eduwaveWrapper #divGradingEntry td {
        display: table-cell;
    }

    #divGradingPeriods {
        margin-top: 10px;
    }

    ul.grading_priods li {
        margin: 3px;
    }

    #divPopupDialogContent .OverMaskDialog {
        width: 90% !important;
        left: 2.5% !important;
        height: 65vh !important;
        top: 25px !important;
    }

        #divPopupDialogContent .OverMaskDialog .DialogTitle,
        #divPopupDialogContent .OverMaskDialog .align_right {
            display: table-cell;
        }

    /***************** Header ****************/
    .writePostWarper .pull-right a {
        display: inline-block;
    }

    .userSmallInfo td {
        display: table;
        text-align: center;
        padding: 7px;
        width: 100%;
        max-width: 100% !important;
    }

    div.divQRLogin .userInfoLabelStyle {
        width: auto !important;
    }

    div.divQRLogin td {
        display: table;
        text-align: center;
    }

    .userSmallInfo img.userImage {
        float: none;
    }

    [id*="map"] {
        /*profile map*/
        width: 100% !important;
    }

    /************** old styles ***************/
    body.popupStyle #container {
        min-width: 100%;
    }

    .defaultFloatDiv {
        float: none;
        width: 100% !important;
    }

    /**************** SearchDIV ****************/
    .SearchDIV {
        padding: 10px;
    }

        .SearchDIV td {
            display: block;
        }

        .SearchDIV [id*='trCalGregorian'] td {
            display: table-cell;
        }

    .eduwaveWrapper table td {
        width: 100% !important;
    }

    .SearchDIV table {
        width: 100%;
    }

    /**************** form adjust ****************/
    .form-adjust .col-md-4 input,
    .form-adjust .col-md-4 .RadComboBox_Default {
        width: 100% !important;
    }

    /******************** Title With buttons *********************/
    .TitleWithButtons #buttons,
    .TitleWithButtons .buttons,
    .coursepagecontent .TitleWithButtons .TitleStyle,
    .TitleWithButtons .TitleStyle {
       
        padding: 0 ;
        float: none;
        display: flex;
        width:100% ;
    }

    /*.TitleWithButtons * {
      display: inline-block;
      float: none;
  }*/
    .TitleWithButtons .TitleStyle {
        margin-bottom: 10px;
    }

    .TitleStyle, .TitleWithButtons .TitleStyle {
        font-size: var(--font-16, 16px);
    }

    /******************** td general ****************/
    .eduwaveWrapper table td {
        display: block;
        width: 100%;
        /*** My Portal > Library **/
    }

        .eduwaveWrapper table td [width],
        textarea[style*='width'],
        input[style*='width'],
        .eduwaveWrapper table td[style*='width'] {
            width: 100% !important;
        }

    .course_gradebook_sub input[style*='width'] {
        width: 19px !important;
    }

    .eduwaveWrapper table.ucBadgeData td [width] {
        width: inherit !important;
    }

    .eduwaveWrapper table td [width][src*="warning-information-icon.png"] {
        width: auto !important;
    }

    input.hasChildren[style*='width'],
    input.hasNotChildren[style*='width'] {
        width: 18px !important;
    }

    .eduwaveWrapper table td#tdFolderMessages [width],
    .eduwaveWrapper table td#tdFolderMessages[style*='width'] {
        width: auto !important;
        display: table-cell;
    }

    .eduwaveWrapper table td#tdFolderMessages table {
        width: 100%;
        display: table;
    }

    .eduwaveWrapper table td#tdFolderMessages[style*="width"] {
        display: block;
    }

    .eduwaveWrapper table td#tdFolderMessages,
    .eduwaveWrapper table td#tdFolderMessages td {
        display: table-cell;
    }
    .eduwaveWrapper table#tblRubric .tdClass textarea[style*='width'] {
        width: 170px !important;
    }

    .eduwaveWrapper table#tblRubric .tdClass {
        position: inherit !important;
    }

    .tSelector {
        width: auto !important;
    }

        .tSelector td {
            display: flex;
        }

        .tSelector input[style*="width"] {
            width: 22px !important;
        }

    .SearchDIV [id*='trCalGregorian'] input[style*='width'] {
        width: inherit !important;
    }

    input.itg_dashboard_knob[style*="width"] {
        width: 19px !important;
    }

    .calendarMonthDefault td,
    .eduwaveWrapper table.TabelGrid td {
        display: table-cell;
    }

    .eduwaveWrapper table.TabelGrid table td {
        display: block;
        width: 100% !important ;
    }
    .eduwaveWrapper #tblGridviewRow td[rowspan="8"] {
        width: 100% !important;
        text-align: center !important;
        margin: auto !important;
        min-width: 100%;
    }
    .eduwaveWrapper #tblGridviewRow td {
        width: 100% !important;
        text-align: center !important;
        margin: auto !important;
    }

    #tblGridviewRow td #button {
        width: 100% !important;
        display: flex !important;
        flex-flow: wrap !important;
    }
    .eduwaveWrapper table.TabelGrid table .rcbReadOnly td.rcbInputCellLeft,
    .eduwaveWrapper table.TabelGrid table .rcbReadOnly td.rcbArrowCellRight {
        display: table-cell;
    }

    .rcbReadOnly input {
        width: 100% !important;
    }

    table {
        width: 100%;
    }
    .k-grid .k-grid-content table {
        border-spacing: 0 10px !important;
        min-width: 100%;
        table-layout: auto !important;
        display: block;
        overflow-x: auto;
    }
    .k-grid-content table, .k-grid-content-locked > table, .k-grid-footer table, .k-grid-header table {
        table-layout: auto !important;
    }
/*    .border_section table tr {
        display: flex !important; 
    }*/
    /*.eduwaveWrapper table[id*='rvBluePrintReport_fixedTable'] td ,*/
    .eduwaveWrapper [id*='rvBluePrintReport_ct'] td,
    .eduwaveWrapper table[id*='BesideTable'] td {
        display: table-cell;
        width: auto !important;
    }

    .eduwaveWrapper table[id*='rvBluePrintReport_fixedTable'] div[id*='oReportDiv'] td {
        width: 100% !important;
    }

    /*.calendarMonthDefault {
      display: table;
  }
  
  .calendarMonthDefault tr {
      display: table-row;
  }*/
    .calendarCalendarDefault table {
        width: auto;
    }

    .eduwaveWrapper table.TabelGrid .GridPagination td {
        display: table-cell;
        width: auto;
    }

    .TabelGrid .GridPagination td,
    .GridPagination td {
        display: inline-block;
    }

    .GridPagination table {
        width: auto;
    }

    .eduwaveWrapper .k-widget td {
        /*fix spacific tables */
        display: table-cell;
    }

    .RadComboBox_Default {
        width: 100% !important;
        min-width: 150px;
    }

    .writePostWarper .pull-right i:first-child, .writePostWarper .pull-right i.fa.fa-link:first-child,
    .post-options.pull-right i:first-child,
    #itg_dashboard_write_post_high .pull-right i:first-child,
    #itg_dashboard_write_post .pull-right i:first-child,
    .writePostWarper .pull-right i:first-child,
    .writePostWarper .pull-right a i:first-child {
        margin-left: 0;
        padding-left: 0;
    }

    .writePostWarper .pull-right i {
        display: inline-block;
        margin-left: -4px;
    }

    .writePostWarper .pull-right > i:first-of-type {
        padding-left: 0;
    }

    .postsMainContainer .user-block .username {
        font-size: var(--font-12, 12px) !important;
        padding-right: 50px !important;
    }

    .postsMainContainer .user-block .description {
        font-size: 11px;
    }

    .widget-block .widget-title {
        font-size: var(--font-12, 12px);
    }

    td input[id*='ibtnOpenCalendar'] {
        display: block;
        margin: auto;
    }

    #calendar td {
        display: table-cell !important;
    }

    .eduwaveWrapper table #calendar td[style*="width"] {
        width: auto !important;
    }

    /***************** chat page ****************/
    .Instant_messages_container #btnSubmit {
        margin: 5px auto;
    }

    .Instant_messages_container td {
        width: 100% !important;
        text-align: center;
    }

    .Instant_messages_container img {
        max-width: 25px;
        margin-top: 4px;
    }

    .chat-menu-item {
        cursor: pointer;
    }

        .chat-menu-item:before {
            display: block;
            content: "\f086";
            font-family: FontAwesome;
            padding: 7px 10px;
            background: #f5b025;
            color: #fff;
            font-size: 18px;
        }

    .Instant_messages_container > table > tbody > tr > td:first-child > div {
        min-height: inherit;
        max-height: 450px;
        margin: 0;
    }

    #lstUsers {
        height: auto !important;
    }

        #lstUsers.slideUp {
            height: 0 !important;
        }

    .Instant_messages_container > table > tbody > tr > td:first-child > div {
        border: 1px solid #ccccdd !important;
    }

    #tdMessages {
        background: #fafafa;
        border: 1px solid #56d5ff;
    }

        #tdMessages .itglightbox {
            left: 0px;
        }

    .select2-container--default.select2-container--focus,
    .select2-selection.select2-container--focus,
    .select2-container--default:focus,
    .select2-selection:focus, .select2-container--default:active,
    .select2-selection:active {
        width: 100% !important;
    }

    /****************** Full Calender ******************/
    .eduwaveWrapper table td.fc-header-left,
    .eduwaveWrapper table td.fc-header-center,
    .eduwaveWrapper table td.fc-header-right {
        display: block !important;
    }

    .fc-toolbar [class*='fc-'] {
        display: block;
        float: none;
        width: 100%;
    }

    .fc-toolbar .fc-button-group {
        margin: auto;
        float: none;
    }

        .fc-toolbar .fc-button-group > * {
            float: none !important;
        }

        .fc-toolbar .fc-button-group > * {
            float: none;
            margin: 0;
            display: table-cell;
            width: auto;
            margin: 10px 5px !important;
            min-width: 45px;
        }

    .fc .fc-toolbar > * > * {
        float: none !important;
        margin-left: 0 !important;
    }

    .fc-toolbar .fc-center h2 {
        margin: 0;
        font-size: var(--font-20, 20px);
        font-weight: bold;
    }

    .eduwaveWrapper .fc table td [width] {
        width: auto !important;
    }

    .fc .fc-view-container {
        min-width: 700px;
    }

    .fc-ltr .fc-axis {
        width: inherit !important;
    }

    /************ Badges **************/
    #ExitingBadgesContainer .ContentExistingBadge {
        border-bottom: 1px solid #aaa;
    }

    #ExitingBadgesContainer #BadgesContainer .ContentBadge {
        margin: auto;
    }

    .RadFilter {
        min-width: 100% !important;
        width: 100% !important;
    }

        .RadFilter li {
            min-width: 100% !important;
        }

    table[id*="clbservices"] {
        width: 100% !important;
    }

    .BadgeImgContainer {
        margin: auto;
        float: none !important;
    }

    .modal-content #ShapeBadgeContainer {
        text-align: center;
    }

    .modal-content .jcrop-active, .modal-content .jcrop-box {
        position: relative;
        margin: auto;
    }

    .modal-content [id*='span_uc'] {
        margin: 7px 0;
        display: inline-block;
    }

    .modal-content #tb_uc_Message, .modal-content #tb_uc_Title {
        width: 100% !important;
    }

    .calendarCalendarDefault {
        /*****/
        width: 206px !important;
    }

        .calendarCalendarDefault td[style*='width'] {
            width: 200px !important;
        }

    /******* Course reports ******/
    .e31_reportmenulinks nav ul {
        display: flex;
        padding: 0px;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

        .e31_reportmenulinks nav ul li {
            display: inline-block;
            text-align: center;
            margin-bottom: 6px;
            padding: 5px;
            position: relative;
            min-width: 110px;
            min-height: 66px;
            width: 50%;
            flex: 3;
            box-sizing: border-box;
        }

            .e31_reportmenulinks nav ul li:last-child {
                margin-bottom: 0;
            }

                .e31_reportmenulinks nav ul li:last-child a {
                    border-bottom: none;
                }

    /*******************************/
    .QuestionNumber {
        width: auto !important;
    }

    ul.assessmentNavigation {
        width: 100% !important;
    }

        ul.assessmentNavigation li {
            float: none !important;
            display: table-cell !important;
            margin: 0px !important;
            padding: 5px !important;
        }

    /**************** Ui Tabs ********************/
    .ui-tabs .ui-tabs-nav li {
        float: none !important;
        margin: 0 !important;
    }

        .ui-tabs .ui-tabs-nav li a {
            float: none !important;
            display: block;
            border: 0;
            border-bottom: 1px solid #ccc;
            border-radius: 0;
            margin-top: 0;
            background: #eee;
        }

    .ui-tabs .ui-tabs-panel {
        padding: 0 !important;
        margin: 0px !important;
        width: 100%;
        min-height: 400px;
    }

    /************** service is not available **************/
    .SearchDIV.ValidationNote:before {
        display: block;
    }

    /*************************/
    .Filter-bar .filter-butt,
    .Filter-bar .sidebar-form {
        float: none;
        width: 100%;
        text-align: center;
    }

    .Filter-bar .filter-butt {
        height: auto;
    }

    .courses-content-header {
        float: none;
        width: 100%;
    }

    /*************************/
    .PowerQueryContainer .ReportTypeColumns {
        width: 100%;
        float: none;
    }

    .PowerQueryContainer .ui-accordion .ui-accordion-content {
        padding: 1em 1em;
    }

    .PowerQueryContainer .stepinactive,
    .PowerQueryContainer .stepactive {
        width: 100%;
    }
}

@media (max-width: 360px) {
    .FileUploaderStyle > div {
        width: 70px !important;
        position: relative !important;
        display: block !important;
    }

    /************** wizard ***************/
    #wizHeader li,
    #wizHeader li a {
        float: none !important;
    }

        #wizHeader li:last-child {
            padding-right: 0 !important;
        }

    /*  .form-adjust .col-md-4 input,
      .form-adjust .col-md-4 .RadComboBox_Default{
          width: 100% !important;
      }
      .eduwaveWrapper table.TabelGrid {
          flex-direction: column;
          display: flex;
      }
      .eduwaveWrapper table.TabelGrid tr {
          flex-direction: column;
          display: flex;
      }
      .eduwaveWrapper table.TabelGrid th,
      .eduwaveWrapper table td {
          display: block;
          width: inherit !important;
          height: auto;
      }
      .TitleWithButtons .TitleStyle,
      .TitleWithButtons #buttons, .TitleWithButtons .buttons{
          float: none;
          display: block;
      }
      .eduwaveWrapper table td.fc-header-left,
      .eduwaveWrapper table td.fc-header-center,
      .eduwaveWrapper table td.fc-header-right, {
          display: block !important;
      }
      
      .RadComboBox_Default {
              width: 100%;
      }
  */
}

@media (max-width: 1024px) {
    .navbar-default .navbar-nav > li > a:not(.btn) {
        font-size: var(--font-15, 15px);
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center li > a:not(.btn) {
        font-size: 14px;
    }

    .nav.navbar-nav.navbar-left {
        margin-right: var(--font-15, 15px);
        margin-left: 0;
    }
}

@media (max-width: 895px) {
    .nav.navbar-nav.navbar-left {
        margin-right: 10px;
        margin-left: 10px;
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center li > a:not(.btn) {
        padding: 9px 8px;
    }

    .navbar .navbar-brand {
        width: 105px;
    }

        .navbar .navbar-brand > img {
/*            width: 38%;*/
        }
}

@media (min-width: 769px) and (max-width: 992px) {
    .eduwaveHeader .nav.navbar-nav.navbar-Center li > a:not(.btn) {
        font-size: var(--font-12, 12px);
        font-weight: bold;
    }

    /*********** botstrap definition *******************/
    .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
        float: right;
    }

    /************** course page ****************/
    .page-title-container {
        float: left;
        padding-right: 0;
        padding-left: 7px;
    }

    .coursepagecontent.content {
        padding-right: 0;
        padding-left: 7px;
    }

    .col-md-3.courseRightSide {
        float: left;
        padding-right: 0;
        padding-left: 7px;
    }

    .coursepagecontent.content > .row {
        margin: 0;
    }

    .CourseColumnContent {
        padding-left: 7px;
        padding-right: 0;
    }

    /*******************************************/
    .eduwaveHeader .navbar-right {
        left: 56px;
        right: auto;
    }

    .eduwaveHeader .nav.navbar-nav.navbar-Center {
        margin-left: 0px;
        margin-right: 0px;
    }
}

/************* Footer ************/
.footer {
    text-align: center;
    min-height: 80px;
    display: flex;
    justify-content: center;
}

    .footer .navbar-brand.client-logo {
        width: 60px;
        height: 60px;
        padding: 0;
        margin: -10px 0px -10px 15px;
    }

        .footer .navbar-brand.client-logo img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            display: none;
        }

.footerSlogan {
    display: block;
    font-size: 12px;
}

.footerInside {
    font-size: 12px;
}

@media (max-width: 768px) {
    .page-title-container {
        float: none;
        padding-left: 15px;
        padding-right: 15px;
    }

    .CourseColumnContent {
        padding-left: 15px;
        padding-right: 15px;
    }

    .coursepage .widget-block .img-circle,
    .coursepage .user-block .img-circle {
        margin-right: 10px;
    }

    .popupHeader {
        /*aibrahim fix bug #5906 25-10-2017*/
    }

        .popupHeader .container-fluid > .navbar-header {
            float: right !important;
            width: auto !important;
        }

    .instructionPopup {
        margin-left: 0;
        margin-right: -250px;
    }

    .leaderBoardWidget.mainLeaderBoard .product-list-in-box > .item {
        width: 100%;
        margin: 0% !important;
    }

    .additional-navbar-center {
        margin: 0 0 -10px !important;
    }
}

@media (max-width: 550px) {
    .EarnedBadgesWidget .widget-block {
        text-align: right;
    }

    .post-options .itg_dashboard_dropdown-menu {
        left: auto;
        right: 0;
    }
}

@media (max-width: 478px) {
    .post-options.pull-right i:first-child,
    #itg_dashboard_write_post_high .pull-right i:first-child,
    #itg_dashboard_write_post .pull-right i:first-child,
    .writePostWarper .pull-right i:first-child,
    .writePostWarper .pull-right a i:first-child {
        margin-left: 1px;
        padding-left: 2px;
        margin-right: 0px;
        padding-right: 0px;
    }

    .postsMainContainer .user-block .username {
        padding-right: 0px !important;
        padding-left: 50px !important;
    }

    .instructionPopup {
        margin-left: 0;
        margin-right: 0;
    }
}

.TitleWithButtons .buttons .OptionsContextMenu {
    left: 0;
    right: auto;
}

.TabelGrid#tblRubric tr td.tdClass:first-child {
    position: sticky !important;
    right: 0 !important;
    width: 40px !important;
    min-width: 40px !important;
    box-shadow: inset 1px 0px 1px #ddd !important;
}

.TabelGrid#tblRubric tr td.tdClass:nth-child(2) {
    position: sticky !important;
    right: 39px !important;
    background: #fff;
    box-shadow: inset 1px 0px 1px #ddd !important;
}

.TabelGrid#tblRubric tr td.tdClass:last-child {
    position: sticky !important;
    left: 0 !important;
    right: auto !important;
    box-shadow: inset -1px 0px 1px #ddd !important;
}

.TabelGrid#tblRubric > tbody > tr > th:first-child {
    position: sticky !important;
    right: 0 !important;
    width: 40px !important;
    min-width: 40px !important;
    box-shadow: inset 1px 0px 1px #ddd !important;
}

.TabelGrid#tblRubric > tbody > tr > th:nth-child(2) {
    position: sticky !important;
    right: 39px !important;
    background: #fff;
    box-shadow: inset 1px 0px 1px #ddd !important;
}


.TabelGrid#tblRubric > tbody > tr > th:last-child {
    position: sticky !important;
    left: 0 !important;
    right: auto !important;
    box-shadow: inset -1px 0px 1px #ddd !important;
}

.k-calendar .k-link.k-nav-fast {
    color: #206e87;
    ;
}

.k-calendar .k-link {
    color: #206e87;
    ;
}

.k-link:link, .k-link:visited, .k-nav-current.k-state-hover .k-link {
    color: #206e87;
    ;
}

.k-state-selected, .k-state-selected:link, .k-state-selected:visited, .k-list > .k-state-selected, .k-list > .k-state-highlight, .k-panel > .k-state-selected, .k-ghost-splitbar-vertical, .k-ghost-splitbar-horizontal, .k-draghandle.k-state-selected:hover, .k-scheduler .k-scheduler-toolbar .k-state-selected, .k-scheduler .k-today.k-state-selected, .k-marquee-color {
    color: #ffffff;
    background-color: #206e87;
    ;
    border-color: #206e87;
    ;
}

.k-state-hover, .k-state-hover:hover, .k-splitbar-horizontal-hover:hover, .k-splitbar-vertical-hover:hover, .k-list > .k-state-hover, .k-scheduler .k-scheduler-toolbar ul li.k-state-hover, .k-pager-wrap .k-link:hover, .k-dropdown .k-state-focused, .k-filebrowser-dropzone, .k-mobile-list .k-item > .k-link:active, .k-mobile-list .k-item > .k-label:active, .k-mobile-list .k-edit-label.k-check:active, .k-mobile-list .k-recur-view .k-check:active {
    color: #ffffff;
    background-color: #2bb1be;
    border-color: #2bb1be;
}

.k-block, .k-widget, .k-popup, .k-content, .k-toolbar, .k-dropdown .k-input {
    color: #206e87;
}

.k-calendar .k-footer .k-nav-today {
    color: #206e87;
    ;
    text-decoration: none;
}

.itg_dashboard_todo-list li:hover {
    background: #2bb1be !important;
}

a.jqTransformCheckbox:hover {
    border-color: #206e87;
    ;
}

a.jqTransformChecked {
    border-color: #206e87;
    ;
}

a.jqTransformCheckbox:before {
    position: absolute;
    top: 2px;
    left: -20px;
    content: "";
    background-color: #206e87;
    ;
    width: 9px;
    height: 9px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}





.radioButtonList .radio-input-container label {
    margin-bottom: 0 !important;
}


.radio-input-container .jqTransformRadio {
    opacity: 1;
    width: 100%;
    height: 100%;
}

.radioButtonList .radio-input-container .jqTransformRadio.jqTransformChecked {
    background: #206e87;
    !important;
}


.box-body canvas {
    position: absolute;
    right: 25px !important;
    height: 250px !important;
}


.radioButtonList .radio-input-container .radio-input-container .jqTransformRadioWrapper {
    position: absolute;
    /* background: #ddd !important;*/

    z-index: 0;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
}

.radioButtonList .radio-input-container {
    margin-right: 11px !important;
    display: flex !important;
    margin-bottom: 0 !important;
    align-items: center !important;
    margin-bottom: 20px !important;
    color: #206e87;
}

    .radioButtonList .radio-input-container label {
        margin-bottom: 0 !important;
        position: relative;
        padding: 4px 12px !important;
        cursor: pointer;
        font-size: var(--font-16, 16px);
    }



.radioButtonList .jqTransformRadio:before {
    position: absolute;
    top: 0px;
    left: 0px;
    opacity: 0;
}


.radioButtonList .jqTransformRadio {
    box-shadow: unset;
    border: none;
    background: transparent !important;
    border-radius: 0;
}

.progress.progress-bar {
    margin-top: 20px;
}

.jqTransformRadioWrapper:has(.jqTransformChecked) {
    background: transparent !important;
}


#ctl00_ctl00_cphPageBody_cphMain_dlStudents td {
    background: none !important;
}

#ctl00_ctl00_cphPageBody_cphMain_dlStudents tr {
    /*padding: 10px;*/
    display: block;
}

#ctl00_ctl00_cphPageBody_cphMain_dlStudents {
    border: none !important;
    /*    background: #e9ebee !important;*/
    /*    padding: 20px;
*/ display: block;
    border-radius: 4px;
    position: relative;
}

    #ctl00_ctl00_cphPageBody_cphMain_dlStudents > tbody > tr {
        background: #e9ebee !important;
    }

    #ctl00_ctl00_cphPageBody_cphMain_dlStudents span.jqTransformCheckboxWrapper {
        display: block;
        float: left;
        margin-right: 5px;
        margin-top: 4px !important;
    }


    #ctl00_ctl00_cphPageBody_cphMain_dlStudents tr {
        margin-bottom: 20px;
        display: flex;
        flex-wrap: wrap;
    }


        #ctl00_ctl00_cphPageBody_cphMain_dlStudents tr:last-child {
            margin-bottom: 0;
        }

/*#ctl00_ctl00_cphPageBody_cphMain_dlStudents_ctl00_btnDashboardLink {
    position: absolute;
    left: 20px;
    top: 29px;
    right: auto;
}
*/
.ParentContainer table td #ctl00_ctl00_cphPageBody_cphMain_dlStudents_ctl00_btnDashboardLink {
    position: relative !important;
    top: 0;
    right: 0;
}

#ctl00_ctl00_cphPageBody_cphMain_dlStudents .labelsStyle {
    color: #000;
    font-size: var(--font-13, 13px);
    font-weight: 600;
}


/*.program-tabs {
    display: flex;
    justify-content: space-evenly;
}

    .program-tabs * {
        z-index: 2;
    }

.program-tab img {
    width: 26%;
    margin-left: 24px;
}

.program-tab {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: auto;
    width: 23%;
    font-size: 1.25rem;
    font-weight: 500;
    border-radius: 99px;
    cursor: pointer;
    transition: color 0.15s ease-in;
    border: 1px solid transparent;
}

    .program-tab:hover {
        border: 1px solid #206e87 ;
    }

.program-tab {
    background: #fff;
    padding: 16px 24px;
    border-radius: 8px;
}

.program-tabs p {
    width: 250px;
    font-size: 22px;
}

    .program-tabs p span {
        display: block;
        font-size: 16px;
        margin-top: 8px;
    }

        .program-tabs p span.tab-count {
            display: inline;
            color: #000;
        }

.program-image {
    margin-right: 24px;
    background: #206e87 6e;
    padding: 12px;
    border-radius: 50%;
}

span.tab-sub-title {
    color: #206e87 ;
}


.program-tab span.tab-count {
    color: #278075;
}

.tab-sub-title {
    display: flex;
}*/

.program-tabs {
    display: flex;
    justify-content: flex-start;
    /* margin-bottom: 16px; */
    flex-wrap: wrap;
    gap: 20px;
}

.course-dashboard.coursepage .program-tabs {
    flex-wrap: nowrap !important;
    gap: 20px !important;
    background: #fff;
    margin: 10px 8px;
    width: calc(100% - 16px);
    border-radius: 8px;
    margin-bottom: 16px;
    border: 1px solid #206e8752 ;
}

table .jqTransformRadio {
    /*    margin: 0 18px;*/
}
/*
.calendarMonthDefault {
    background-color: #206e87  !important;
    border: 1px solid #206e87  !important;
}
*/
.calendarDayNameDefault {
    /*font: bold 11px Tahoma;*/
    font-size: 11px;
    font-weight: bold;
   font-family: 'Cairo Regular';
    color: #222 !important;
    text-align: center;
}

.calendarDayDefault {
    /*font: 11px Tahoma;*/
    font-size: 11px;
    font-family: 'Cairo Regular';
    /* color: #ffffff !important;*/
    text-align: center;
    padding: 1px;
    border: 1px solid #F6F6F6;
    cursor: pointer;
    cursor: hand;
}

.calendarMonthTitleDefault {
    /*font: bold 12px Tahoma;*/
    font-size: 12px;
    font-weight: bold;
   font-family: 'Cairo Regular';
    text-align: center;
    padding: 4px;
    /*    color: #ffffff !important;*/
}

.program-tabs * {
    z-index: 2;
}

.content.container.col-md-10.coursepage.coursepagecontent {
    padding-left: 15px;
}

.program-tab {
    display: flex;
    align-items: center;
    /*justify-content: space-between;*/
    height: auto;
    min-width: 200px;
    font-size: var(--font-20, 20px);
    font-weight: 500;
    border-radius: 99px;
    cursor: pointer;
    transition: color 0.15s ease-in;
    border: 1px solid transparent;
    margin-bottom: 16px;
}

.course-dashboard.coursepage.clearfix .col-md-6 {
    padding: 0 8px;
}


/*.program-tab:hover {
    border: 1px solid #206e87 ;
}*/

.program-tab {
    background: #fff;
    padding: 16px 20px;
    border-radius: 0px;
    margin-bottom: 0;
    border-bottom: 4px solid #fff;
}

.program-tabs p {
    width: 250px;
    font-size: var(--font-22, 22px);
}

    .program-tabs p span {
        display: block;
        font-size: var(--font-16, 16px);
        margin-top: 8px;
    }

        .program-tabs p span.tab-count {
            display: inline;
            color: #000;
        }

.program-image {
    margin-left: 12px;
    background: #DEEFED;
    padding: 15px;
    border-radius: 50%;
}

span.tab-sub-title {
    color: #206e87;
}

.program-tab span.tab-count {
    color: #000000;
}


.program-tab div {
    font-size: var(--font-15, 15px);
    font-weight: bold;
}

.program-tab .tab-sub-title {
    font-size: var(--font-13, 13px);
    font-weight: 300;
    margin-top: 4px;
    color: #206e87;
}


.program-tab.active {
    /*    background: #206e87 ;*/
    color: #206e87 !important;
    border-bottom: 4px solid #206e87;
}

    .program-tab.active .tab-sub-title {
        color: #206e87 !important;
    }

    .program-tab.active span.tab-count {
        color: #206e87 !important;
    }

/*.program-tab.active .program-image {
        margin-left: 12px;
        background: rgba(255,255,255,0.20);
        padding: 15px;
        border-radius: 50%;
    }


        .program-tab.active .program-image img {
            filter: brightness(0) invert(1);
        }

*/

@media (max-width: 900px) {
    .program-tabs {
        display: flex;
        justify-content: center;
        margin-bottom: 16px;
        flex-wrap: wrap;
    }

    .program-tab {
        background: #fff;
        padding: 16px 20px;
        border-radius: 8px;
        margin: 8px;
    }
}




.RadTreeView_Default .rtHover .rtIn {
    border-color: #D6EEEE !important;
    color: #000;
    background-color: #c3c3c3;
    background-image: linear-gradient(#ddd,#c3c3c3);
    background: #D6EEEE !important;
}

.rtUL .RadTreeView_Default .rtIn {
    border-color: #D6EEEE !important;
    color: #000;
    background-color: #c3c3c3;
    background-image: linear-gradient(#ddd,#c3c3c3);
    background: #D6EEEE !important;
}

.rtUL .rtTop .rtIn {
    background: #d1dcdf;
}

.rtLI .rtIn {
    background: #D6EEEE;
}

.rtLI .rtMid .rtIn {
    background: #206e87;
    color: #fff;
}


.rtLI .rtMid.rtHover .rtIn {
    background: #037f74 !important;
    color: #fff;
}

.rtLI .rtUL .rtLI .rtMid .rtIn {
    background: #c8dce3;
    color: #000;
}

.rtLI.rtLast .rtBot .rtIn {
    background: #206e87;
    color: #fff;
}

.rtLI.rtLast .rtBot.rtHover .rtIn {
    background: #037f74 !important;
    color: #fff;
}

.rtIn {
    border-radius: 2px;
}

.RadTreeView_Default .rtIn {
    color: #000;
}

.rtLI .rtLI.rtLast .rtBot .rtIn {
    background: #d6eeee;
    color: #000;
}

.RadTreeView .rtPlus::before, .RadTreeView .rtMinus::before {
    font: 20px 'TelerikWebUI';
    line-height: normal;
    margin: -0.5em 0 0 -0.5em;
    width: 1em;
    height: 1em;
    line-height: 1em;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
}

.rtLI.rtFirst > .rtTop .rtIn {
    background: #206e87 !important;
    color: #fff;
}


span.rtIn i {
    margin-right: 25px;
    margin-left: 0;
}

.rtUL .rtTop .rtIn i {
    color: #206e87;
}

.rtLI .rtLI.rtLast .rtBot .rtIn i {
    color: #206e87;
}

.rtLI .rtUL .rtLI .rtMid .rtIn i {
    color: #206e87;
}

.rtLI.rtFirst > .rtTop .rtIn i {
    color: #fff;
}




.courseleftSide .Course-title h6.title a {
    color: #206e87 !important;
}


.fab-open-btn {
    width: 42px;
    height: 42px;
    background: #206e87;
    margin: 5px;
}



.Course-menu-ul.teacher-course-menu li.active a {
    background: #206e87;
    color: #fff !important;
    box-shadow: inset 4px 0px 0px #206e87;
}


.courseContentTabs .nav-tabs > li > a.active {
    color: #206e87 !important;
    background: var(--light-primary-color) !important;
    border: none;
    transition: background ease-in-out .3s !important;
}
.courseContentTabs .nav-tabs > li > span.cardIcon i {
    display:none;
}
.courseContentTabs.cardView .nav-tabs > li > span.cardIcon i {
    
    color: #555;
    background: #f4f4f4;
    padding: 5px;
    border-radius: 50%;
    height: 35px;
    width: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.courseContentTabs.cardView .nav-tabs > li {
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 8px 26px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
    .courseContentTabs.cardView .nav-tabs > li:has(a.active) {
        border: 2px solid var(--primary-color);
        background: #00c0ef17;
    }
        .courseContentTabs.cardView .nav-tabs > li:has(a.active) > span.cardIcon i {
            color: var(--primary-color);
        }
    .courseContentTabs.cardView .nav-tabs > li > a.nav-link.active::before {
        content: "\f058";
        font-family: 'FontAwesome';
        position: absolute;
         width: unset; 
         height: unset; 
         background: none; 
        bottom: 55px;
        right: -15px;
    }
    .menu-nav {
            display: flex;
            justify-content: space-between;
            position: relative;
            margin-left: 0 !important;
            margin-right: 0px !important;
        }

#ctl00_cphPageBody_ucLectureViewerDetails_divCourseContentTabs .slideshow-container .dot.active, #ctl00_cphPageBody_ucLectureViewerDetails_divCourseContentTabs .slideshow-container .dot:hover {
    background-color: var(--light-primary-color) !important;
    color: #fff !important;
}


.courseContentTabs:hover .nav.nav-tabs:hover a:hover {
    color: #206e87 !important;
}



.courseleftSide .Course-title h6.title a {
    color: #206e87 !important;
}

.CourseColapsedMenu.CourseColapsedContent .panel-heading.active {
    background: #d3efea !important;
}

.dropzone .dz-message::before {
    font-family: 'FontAwesome' !important;
    font-size: 42px;
    color: #206e87 !important;
    margin: 0 10px;
    margin-bottom: 0px;
    margin-bottom: 5px;
    text-align: center;
    content: '\f0ee';
    display: flex;
    align-items: center;
    justify-content: center;
}

.insertVideo .LectureBtnsContainer .CancelBtn:hover {
    color: #206e87 !important;
}


.video-js.vjs-default-skin iframe {
    width: 100%;
}

.VideoContainer {
    display: inline-block;
    width: 100%;
}

.InteractiveVideoSetup div span {
    display: block;
    margin-bottom: 10px;
}

.InteractiveVideoSetup div {
    margin-bottom: 12px;
}

.CourseColapsedMenu .panel-default > .panel-heading a.CollapsItemToolbarBtn.active, .CollapsItemToolbarBtn.active {
    background: #206e87 !important;
    color: #fff;
}

.CollapsItemToolbarBtn {
    background: #fff;
    padding: 2px 10px;
    border: 1px solid #206e87 !important;
    border-radius: 12px;
    margin: 0 3px;
    cursor: pointer;
    display: inline-block;
    line-height: 17px;
    min-width: 80px;
    text-align: center;
    font-size: var(--font-14, 14px);
    height: 25px;
}

.lectuerSectionContainer .nav-tabs > li.itg_dashboard_active > a {
    box-shadow: 0 3px 0px #206e87 !important;
}

.courseContentTabs .nav-tabs > li.itg_dashboard_active > a {
    color: #206e87 !important;
    box-shadow: unset !important;
}

.lectuerSectionContainer .nav-tabs > li.itg_dashboard_active {
    box-shadow: 0 3px 0px #206e87 !important;
}


.courseContentTabs .nav-tabs > li > a:hover {
    border-color: #fff #eee #fff;
    color: #206e87 !important;
}


.VideoContent a[title="Delete"]::before {
    position: relative;
    font-family: itgIconsFont;
    font-style: normal;
    font-weight: normal;
    color: #206e87 !important;
    content: "\e90b";
    font-size: 11px;
    padding: 0;
    cursor: pointer;
}

.InteractiveVideoSetup span.k-widget.k-dropdown span {
    margin-bottom: 0;
}

.InteractiveVideoSetup span.k-widget.k-dropdown {
    width: 100%;
}

.course-quiz-label span {
    display: inline-block !important;
}

.k-grid .k-grid-content tbody tr td:first-child:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 4px;
    background: #206e87 !important;
}

.k-grid .k-grid-content tbody tr:nth-of-type(2n+1) td:first-child:before {
    background: var(--primary-color) !important;
}


.video-js.vjs-default-skin video {
    max-width: 100% !important;
    max-height: 100% !important;
}

.InteractiveVideoSetup .displayTime input {
    width: 100% !important;
    text-align: center;
    border-radius: 4px !important;
    padding: 5px;
}

.displayTime {
    width: 13%;
    margin-left: 20px;
}

.InteractiveVideoSetup input {
    width: 100% !important;
}

.k-dropdown-wrap .k-select, .k-numeric-wrap .k-select, .k-picker-wrap .k-select {
    position: absolute;
    top: 0;
    right: auto;
    display: inline-block;
    vertical-align: top;
    text-decoration: none;
    left: 0;
}

.divQuiz {
    display: flex;
    flex-wrap: wrap;
}


.table-row-col.Title::before {
    background: var(--primary-color) !important;
    border-radius: 0 !important;
}

.table-row-col.VideoClipTime div {
    display: inline-block;
    margin: 0 11px;
    background: #017b713d;
    padding: 5px;
    border-radius: 4px;
    width: 100px;
    text-align: center;
}


.table {
    display: table;
    width: 100%;
    border-spacing: 0;
}

.GridviewOptionsIcons {
    text-align: left;
    padding: 0 36px;
}

    .GridviewOptionsIcons a {
        margin: 0 5px;
    }

.table-row-col.Title {
    vertical-align: bottom;
    padding-bottom: 0 !important;
}

.GridviewOptionsIcons li a {
    padding: 0;
    text-align: revert;
    padding: 0;
}

.modal-dialog .modal-body > div {
    margin-bottom: 18px;
}

.modal-footer .Add {
    background: transparent;
    border: none;
    color: #fff;
    background: var(--primary-color);
    padding: 6px 39px !important;
    border: 1px solid aliceblue;
    height: 36px;
    margin-bottom: 0px;
    position: relative;
    top: -2px;
    border-radius: 50px;
}

.modal-body input {
    border-radius: 5px !important;
}

.modal-content .btn {
    padding: 6px 39px !important;
    border-radius: 0px !important;
    border-radius: 50px !important;
    background: transparent;
    color: #017b71;
    border: 1px solid;
}

.col-sm-3 .col-sm-2.col-form-label {
    color: #a4a4a4;
    font-size: var(--font-12, 12px);
    font-weight: 300;
}

.col-sm-2.col-form-label {
    width: 100%;
    margin-bottom: 11px;
}

ul.GridviewOptionsIcons img.course-image {
    width: 100%;
}


.add-quiz-container i {
    border: 1px dashed;
    padding: 5px;
    border-radius: 50px;
    margin: 0 7px;
    font-size: 13px;
    font-weight: 100;
}

.add-quiz-container {
    background: transparent;
    color: #206e87;
    width: 100%;
    border: 2px dashed;
    border-radius: 8px;
    padding: 7px;
    text-decoration: underline;
    text-align: center;
}

    .add-quiz-container input {
        width: 100%;
        background: none;
        color: #206e87;
        padding: 0 !important;
        text-decoration: underline;
    }

.course-quiz-label {
    display: flex;
    flex-direction: row;
}

.displayTimeContainer {
    display: flex;
    flex-direction: unset;
    margin-top: 12px;
}

    .displayTimeContainer span {
        opacity: .5;
        margin-top: 3px;
    }

.InteractiveVideoSetup .labelTitle {
    font-size: var(--font-14, 14px);
    font-weight: bold;
    margin-bottom: 8px;
}

.add-quiz-container input {
    width: auto;
    text-align: center;
}

    .add-quiz-container input:hover {
        color: #206e87;
        text-decoration: underline;
    }

span.quizValidationcb a.jqTransformChecked:before {
    left: 1px !important;
    width: 11px;
    height: 11px;
    top: 1px !important;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.pointContainer input {
    border-radius: 8px;
    margin-bottom: 8px;
    padding: 8px;
}
/*# sourceMappingURL=Eduwave.css.map */

.divQuiz .k-dropdown-wrap .k-select {
    position: absolute;
    top: 0;
    right: auto !important;
    left: 0 !important;
    display: inline-block;
    vertical-align: top;
    text-decoration: none;
}

.InteractiveVideoSetup .actionButtonsContainer input {
    width: 17% !important;
    border-radius: 21px !important;
}

.actionButtonsContainer .CancelBtn {
    background: transparent;
    color: #206e87;
    border: 1px solid #206e87 !important;
}


a.jqTransformCheckbox:before {
    position: absolute;
    top: 2px;
    left: -20px;
    content: "";
    background-color: #206e87 !important;
    width: 9px;
    height: 9px;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}


.DialogDesc table .roundedRBContainer tr {
    display: flex;
    flex-wrap: wrap;
}

    .DialogDesc table .roundedRBContainer tr td {
        margin-bottom: 13px;
    }

.eyeBlack {
    color: #000;
}

.progress {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 1rem;
    overflow: visible;
    font-size: var(--font-12, 12px);
    border-radius: .25rem;
    position: relative;
}

    .progress:not(.CourseReportDetails .progress) {
        background-color: #02938659 !important;
        height: auto;
    }

.progress-bar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    background-color: #206e87;
    transition: width .6s ease;
    position: relative;
    border-radius: 13px;
    top: 0;
    left: 0;
    height: 100%;
    float: inline-start;
    width: 20%
}

.progress p {
    margin: 0;
    z-index: 1;
    position: relative;
}

.progress > .progress-bar {
    height: 0.8rem;
    border-radius: 8px;
    position: relative;
}

.progressPercentage {
    position: absolute;
    /* background: aqua; */
    padding: 0px 5px;
    background-color: #007f76;
    color: #fff;
    font-size: var(--font-12, 12px);
    border-radius: 4px;
    top: -26px;
    /*right: 10px;*/
    left: 0;
    transform: translateX(-25%);
}

.progress > .progress-bar:after {
    content: "";
    position: absolute;
    width: 7px;
    height: 7px;
    background-color: #007f76;
    top: -10px;
    /*right: 10px;*/
    left: 0;
    transform: translateX(50%) rotate(45deg);
    border-radius: 2px;
}

.ParentContainer table td:nth-child(odd) {
    width: auto !important;
    /*    margin: 0 10px ;*/
}

.ParentContainer table td .TextValueStyle {
    margin: 0 30px;
}

.ParentContainer table {
    width: 100%;
}

td.tdParentChildDash {
    position: absolute;
    left: 20px;
}

.ParentContainer {
    border: none !important;
    background: #e9ebee !important;
    padding: 20px;
    display: block;
    border-radius: 4px;
    width: 100%;
}

.OverMaskDialog .jqTransformRadio {
    top: 0px !important;
    z-index: 1;
}

.ParentContainer table td:nth-child(even) {
    width: auto !important;
    /*    margin: 0 10px ;*/
}
.GridviewOptionsIcons a {
    font-size: large !important;
}
/****************************************user alaa cu***********************************************************/
.CourseColapsedMenu.CourseColapsedContent .table-row-col {
    padding: 9px 5px;
    padding-bottom: 7px !important;
}

a.btn-primary {
    background: #206e87 !important;
}

.FilterBar-container .html-tamplet-content .form-group label {
    color: #206e87 !important;
    opacity: 1;
    display: block !important;
    text-align: start !important;
}

.LearningObjectFolderingWidget .mCustomScrollbar {
    max-height: 100%;
}

.LearningObjectFolderingWidget .mCustomScrollBox {
    position: relative;
    overflow: hidden;
    height: 100%;
    max-width: 100%;
    outline: 0;
    direction: ltr;
}

/*.DataListItems {
    min-height: 100%;
}

#FolderListContainer .noData-img-container img {
    width: 10%;
}

#FolderListContainer {
    text-align: center;
    margin: 15px 0;
    max-height: 100%;
    min-height: 100%;
}

.parentFilterBar .SearchBar .row.html-tamplet-content {
    direction: rtl;
}

.SearchBar .FilterBar-content div[class*='col-sm'], .SearchBar .FilterBar-content .form-group {
    text-align: start;
    display: block !important;
}

.eduwaveWrapper {
    margin: 0;
}

.MarginWrapper .parentFilterBar .fullSearchArea.SearchBar .col-form-input > input[type="text"], .FilterBar-container.SearchBar .RadComboBox, .FilterBar-container.SearchBar input[type="text"] {
    width: 100% !important;
}

.html-tamplet-content .filter-buttons {
    position: absolute;
    left: 5px;
    top: -50px;
    direction: ltr;
}

.parentFilterBar .SearchBar .filter-buttons a {
    margin: 0 10px;
}

.html-tamplet-content .RadComboBox .rcbDisabled .rcbReadOnly .rcbInputCellLeft {
    background-color: #efefef !important;
}

.parentFilterBar .SearchBar .filter-buttons {
    top: 17px;
    float: left;
    padding-right: 15px;
}

.html-tamplet-content .col-sm-4.marginBottom {
    text-align: start !important;
    direction: rtl;
}

.fullSearchArea .FilterBar-content {
    background: #f8f8f8;
    border: none;
    padding: 0 25px;
    margin: 0;
}

.html-tamplet-content .col-sm-4 {
    text-align: start !important;
    direction: rtl;
}

.parentFilterBar .SearchBar.FilterBar-container .RadComboBox_Default {
    max-width: 100% !important;
    width: 100% !important;
}

.parentFilterBar .SearchBar .FilterBar-content div[class*='col-sm'], .parentFilterBar .SearchBar .FilterBar-content .form-group {
    text-align: start;
    display: block;
    width: 100%;
}

.parentFilterBar .TitleStyle, .parentFilterBar .TitleWithButtons .TitleStyle {
    text-align: start;
    direction: rtl;
}
.parentFilterBar .fullSearchAreaBottom .wideGridInDiv span {
    text-align: start;
    display: flex;
    justify-content: end;
}*/







.calendar {
    border-radius: 10px !important;
    border: none !important;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, .2) !important;
   font-family: 'Cairo Regular' !important;
    width: 20%;
}

    .calendar tfoot tr.time td.hour, .calendar tfoot tr.time td.minute {
        background-color: #ffffff;
    }

    .calendar table {
        width: 100%;
        background-color: #fff;
    }

    .calendar table {
        border-radius: 10px;
    }

    .calendar thead .title {
        background-color: #018076 !important;
        color: #f2a001 !important;
       font-family: 'Cairo Regular' !important;
    }

    .calendar > table > thead > tr:first-child > td.button {
        color: #fff !important;
        font-size: var(--font-16, 16px) !important
    }

    .calendar table td {
        /*        background: #fff !important;*/
        color: #000 !important;
        font-weight: normal;
    }

    .calendar table {
       font-family: 'Cairo Regular' !important;
        border: none !important;
    }

    .calendar thead .name {
        color: #206e87 !important;
        font-size: 11px !important;
    }


    .calendar > table > thead > tr:first-child > td {
        border: none !important;
        padding: 11px !important;
        vertical-align: middle;
        background: #206e87 !important;
        color: #fff !important;
    }


        .calendar > table > thead > tr:first-child > td:first-child {
            display: table-cell;
            padding: 0 7px 13px !important;
            font-size: var(--font-14, 14px) !important;
            background: #f5a224;
            border-radius: 0 0px 0 0;
        }

        .calendar > table > thead > tr:first-child > td:last-child {
            display: table-cell;
            font-size: var(--font-18, 18px) !important;
            line-height: 14px;
            font-weight: normal !important;
            border-radius: 0px 0 0 0;
        }

    /*  .calendar > table > thead > tr:first-child > td:nth-child(2) {
            color: #F5A224 !important;
        }
*/

    .calendar tbody .daysrow td.selected {
        background-color: #206e87 !important;
       font-family: 'Cairo Regular' !important;
        border: none !important;
    }


    .calendar thead .weekend {
        /*color: #206e87  !important;*/
        color: #206e87 !important;
    }

    .calendar tbody .daysrow .emptycell {
        border: 1px solid #eee !important;
       font-family: 'Cairo Regular' !important;
    }

    .calendar table td {
        border: 1px solid #eee !important;
    }

    .calendar table td {
        font-size: 11px !important;
       font-family: 'Cairo Regular' !important;
    }

    .calendar tfoot .ttip {
        /* background: #206e87  !important;
        color: #fff !important;*/
        padding: 5px !important;
       font-family: 'Cairo Regular' !important;
        font-weight: normal !important;
        background: #206e87 !important;
        color: #fff !important;
        border-radius: 0 0 10px 10px;
        border: none !important;
    }

    .calendar tfoot tr.time td.hour, .calendar tfoot tr.time td.minute {
        border-color: #ffffff !important;
        background-color: #fff !important;
        text-align: center !important;
    }

.parentFilterBar .fullSearchAreaBottom .TitleWithButtons {
    border-bottom: 1px solid #ddd;
    margin: 0 0 15px;
}

.SearchTable table tr td input {
    padding-top: 5px;
    /*    width: 180px !important;*/
}

#ctl00_ctl00_cphPageBody_cphPageBody_pnlStudentsComments, #ctl00_ctl00_cphPageBody_cphMain_divAllCurricula, .CreateImageHotspotQuestionsPadding, #ctl00_ctl00_cphPageBody_cphPageBody_pnlPassword {
    padding: 12px 10px 12px;
    border: 1px solid #115c7440;
    border-radius: 8px;
}

.Main-submenu ul {
/*    border: 1px solid #115c7440;*/
    border-radius: 8px;
}
/*#ctl00_ctl00_cphPageBody_cphPageBody_ddlRadAssessmentStatus_Input, #ctl00_ctl00_cphPageBody_cphPageBody_ddlRadDifficultylevel_Input {
    width: 180px !important;
}*/
.study-groups-Widget .fa-bullhorn {
    color: #206e87 !important;
}

#tdOption2.active:before, #tdOption1.active:before {
    color: #fff !important;
}

.padding-section {
    padding: 15px 25px;
    border: 1px solid #206e87;
    border-radius: 8px;
}

.width-input-feild {
    width: 245px;
}

.course-dashboard .box-footer a {
    color: #206e87 !important;
}

.lblTotalPoints:before, .lblBadgesTotalCount::before {
    background: #206e87 !important;
}

.coursecalendarWidget .product-list-in-box .item .product-title, .coursecalendarWidget .widget_overlay .product-title {
    color: #206e87 !important;
}

.dashboard-tabs-container .nav-tabs > li.itg_dashboard_active {
    box-shadow: inset 0 -3px 0px #206e87 !important;
}

.eduwaveWrapper .eduwaveContent .course-dashboard .survey-container .survey-answer ol li .jqTransformRadioWrapper {
    margin-top: 0px;
}

.eduwaveWrapper .eduwaveContent .course-dashboard .survey-container .survey-answer ol li label {
    display: block;
}

.eduwaveWrapper .radioButnsWidth td {
    min-width: 170px;
}

#divSRContainer {
    margin: 0 10px !important;
}

.assessTrOrFa input[type=checkbox], input[type=radio] {
    margin: 0px 0 0;
}

.DialogDesc #ctl00_ctl00_cphPageBody_cphPageBody_rblLanguageLO .jqTransformRadio {
    top: 0px !important;
}

.box-body + #itg_dashboard_write_post .modal-dialog .modal-footer .btn-publish:hover,
.courseposts .postsMainContainer #postsContainer .box-footer .img-push .input-group-btn .btnComment:hover,
.courseposts .postsMainContainer #postsContainer .btnLike:hover,
.courseposts .postsMainContainer #postsContainer .btnUnLike:hover,
.postsMainContainer + #itg_dashboard_write_post .modal-dialog .modal-footer .btn-publish:hover,
.itg_dashboard_tab-content .itg_dashboard_tab-pane .coursepagecontent .postsMainContainer #lnkSettings:hover,
#show-comments + #show-settings .modal-dialog .modal-content .modal-footer a:hover,
#show-comments + #show-settings .modal-dialog .modal-content .modal-footer button:hover,
#removeAlert + #itg_dashboard_edit .modal-dialog .modal-content .modal-footer button:hover,
.box-footer .input-group .input-group-btn .btnAttach:hover {
    color: #206e87 !important;
    background: white !important;
}

.box-body + #itg_dashboard_write_post .modal-dialog .modal-footer .btn-publish i,
.box-body + #itg_dashboard_write_post .modal-dialog .modal-footer .btn-flat i {
    margin: 0 5px;
}

.box-body + #itg_dashboard_write_post .modal-dialog .modal-footer .demo-section:has(.k-upload-files),
.box-body + #itg_dashboard_write_post .modal-dialog .modal-footer .demo-section:has(.k-upload-files) + div,
.courseposts + #itg_dashboard_write_post .modal-dialog .modal-footer .demo-section:has(.k-upload-files),
.courseposts + #itg_dashboard_write_post .modal-dialog .modal-footer .demo-section:has(.k-upload-files) + div {
    display: block !important;
}

.post-options > div {
    float: none !important;
}

    .post-options > div:nth-child(2):has(.btn-group):not(.float-end) {
        display: flex;
        justify-content: space-between;
    }

    .post-options > div:nth-child(2) .btn-group.open ul.itg_dashboard_dropdown-menu {
        top: 128%;
        right: 0;
        left: auto;
    }

        .post-options > div:nth-child(2) .btn-group.open ul.itg_dashboard_dropdown-menu::after {
            right: 12px;
            left: auto;
        }

        .post-options > div:nth-child(2) .btn-group.open ul.itg_dashboard_dropdown-menu::before {
            right: 12px;
            left: auto;
        }

    .post-options > div:nth-child(2) > div:nth-child(1) {
        /*min-width: 370px;*/
        margin-left: 245px;
        margin-right: 0;
    }

.bodywrapper .eduwaveWrapper .MarginWrapper .eduwaveContent .widgetrow {
    padding: 0 7.5px;
}

.k-upload-status {
    right: auto;
    left: 12px;
}

.lbtnInvite:hover {
    background: #206e87;
    color: #fff;
}

.courseposts .postsMainContainer #postsContainer .box-footer div img.img-circle {
    margin-right: auto;
    margin-left: 8px;
}

.courseposts .postsMainContainer #postsContainer .box-footer .img-push .input-group-btn .btnComment:hover,
.courseposts .postsMainContainer #postsContainer .btnLike:hover,
.courseposts .postsMainContainer #postsContainer .btnUnLike:hover {
    color: #206e87 !important;
}

.courseposts .postsMainContainer #postsContainer .box-header .user-block .username {
    color: #206e87 !important;
}

.ui-tabs.ui-corner-all .ContainerForTabs.ui-corner-bottom .DataListItems {
    min-height: auto;
}

#tdOption2.active, #tdOption1.active {
    background: #206e87 !important;
}

#tdOption2:before, #tdOption1:before {
    color: #206e87 !important;
}

#ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin > table tbody tr:nth-child(2) > td > table > tbody > tr > td > table {
    width: auto !important;
}

.Related-Subject-Icon .radioButtonList a.jqTransformRadio {
    top: auto;
}

#ctl00_ctl00_cphPageBody_cphPageBody_ucCourseTemplate_rblFrames .jqTransformRadioWrapper {
    margin-top: 0;
}

.Main-submenu ul li:before {
    right: auto !important;
    left: 0;
    opacity: 0;
}

ul.grading_priods li button.grading_periods_bttons i {
    background-color: #206e87 !important;
}

ul.grading_priods li button.grading_periods_bttons.activebutton i {
    background-color: #f59a0e !important;
}

#ctl00_ctl00_cphPageBody_cphPageBody_divGradeSetup {
    padding-bottom: 20px;
}

.calendarMonthDefault .calendarDayTodayDefault,
.calendarMonthDefault .calendarDayTodayOverDefault {
    color: white;
    background-color: #206e87;
}

#ctl00_ctl00_cphPageBody_cphPageBody_Div3 .jqTransformCheckboxWrapper + label,
#ctl00_ctl00_cphPageBody_cphPageBody_oPollUC_rblSchoolAnswers .jqTransformRadioWrapper + label {
    display: inline-block;
}

.jqTransformRadioWrapper {
    margin-top: 2px !important;
}

.itg_dashboard_tab-content .itg_dashboard_active #ctl00_ctl00_cphPageBody_cphPageBody_UCCoursePosts_divContainer .postsMainContainer > div:nth-child(1) {
    width: 100% !important;
}

.section.wrapper.eduwaveContent .coursepagecontent td > div {
    max-width: 100% !important;
}

table.Afdc757cad97d4601a96c30102713b35072 {
    background: red;
}
#ctl00_ctl00_cphPageBody_cphPageBody_UCMeetings_upnlPublishedMeetings .WideGrid {
    overflow: visible !important;
    overflow-x: visible !important;
}
.dlLearningObjectsItem .itg-font-delete {
   right: 25px !important;
}
.table.dlLearningObjects .dlLearningObjectsItem div a.itg-font-delete.aspNetDisabled.disabled {
    color: #bbbbbb !important;
}
#show-comments + #show-settings .modal-dialog.glyphicon-fullscreen.fullscreen .modal-content .modal-footer a {
    color: white !important;
}
    #show-comments + #show-settings .modal-dialog.glyphicon-fullscreen.fullscreen .modal-content .modal-footer a:hover {
        color: #206e87 !important;
    }
#ctl00_ctl00_cphPageBody_cphPageBody_UCBookElements_UpdatePanel4 .wideGridInDiv.TableGridstyle .WideGrid,
#ctl00_ctl00_cphPageBody_cphPageBody_UCLearningObjects_UpdatePanel2 .wideGridInDiv.TableGridstyle .WideGrid {
    overflow: visible !important;
}

#ctl00_ctl00_cphPageBody_cphPageBody_divAdmin > div > div:nth-child(3),
#ctl00_ctl00_cphPageBody_cphPageBody_divNewDesginContainer #ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin {
    padding-bottom: 15px;
    padding-top: 0;
/*    overflow: hidden;*/
}
.folder-wedgit-header a {
    color: #206e87;
}
#FolderListContainer #mCSB_5_container .noData-img-container img.noDataImg.mCS_img_loaded {
    width: 150px;
}

#divSearch1 {
    display: flex;
}

.MarginWrapper .wrapper .courseleftSide, .MarginWrapper .wrapper .coursepagecontent {
    margin: 0;
    margin-bottom: 0;
    /*border: 1px solid #206e87 ;*/
}

.tabsStyle .nav-tabs > li.itg_dashboard_active > a, .tabsStyle .nav-tabs > li > a:hover {
    border-color: none;
    background: none;
    color: var(--secondary-color);
    box-shadow: 0 3px 0 var(--secondary-color);
}

.tabsStyle .nav-tabs > li > a {
    padding: 0 30px;
    margin: 0;
}

.tabsStyle .nav-tabs {
    background: #f2f2f2;
    border: none;
    margin-bottom: 6px;
    padding: 15px;
}

#ctl00_ctl00_cphPageBody_cphPageBody__ucLearningObjectFolderingWidget_divContainer {
    padding: 15px;
}

#ctl00_ctl00_cphPageBody_cphPageBody_fuGroupImage_divImageViewerContainer {
    display: block !important;
}

.ContentLibraryMgtPadding {
    padding: 15px 25px;
    border: 1px solid #206e8757;
    border-radius: 8px;
}

.__fileupload-Aathar {
    bottom: 6px;
    left: -5px;
    position: relative !important;
}

#assessmentDragableContainer #divMCContainer .AssesBoxTool + .AssesBoxContent {
    min-height: 38px;
}
/*
#ctl00_ctl00_cphPageBody_cphPageBody_pnlAddEditGroup {
    padding: 15px 25px;
    border: 1px solid #206e87;
    border-radius: 8px;
}*/

.dashboard-tabs-container {
    margin-top: 10px;
}

.col-md-12.Main-submenu-container .page-title {
    padding: 12px 10px 12px;
    border: 1px solid #115c7440;
}

#BorderTableWideTop #mCSB_7_container .noData-img-container img[alt="No Attendance"] {
    width: 120px;
}

#ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin .WideGrid table tbody > tr td:last-child:has(.OptionsContextMenu):not(.OptionsContextMenu) {
    text-align: end !important;
}

#ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin table tbody > tr td:last-child:has(.OptionsContextMenu) .OptionsContextMenu {
    text-align: start;
    left: 0px !important;
    top: 37px !important;
}

#ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin .info_postion {
    width: auto;
    text-align: start;
}
/*.calendarMonthDefault {
    background-color: #206e87 !important;
    border: 1px solid #206e87 !important;
}

.calendarMonthDefault {
    color: #ffffff !important;
}

.calendarDayNameDefault {
    color: #ffffff !important;
}

.calendarDayDefault {
    color: #ffffff !important;
}
.calendar table {
    background-color: #206e87 !important;
    border: 1px solid #206e87 !important;
}

.calendar thead .name {
    border-color: #206e87;
    background-color: #206e87;
    color: #fff !important;
}
.calendarMonthTitleDefault {
    color: #ffffff !important;
}
.calendar tbody td {
    color: #fff !important;
}
.calendarArrowRightDefault {
    color: #ffffff !important;
}
.calendar tfoot tr.time td.hour, .calendar tfoot tr.time td.minute {
    border-color: #cdcabc;
    background-color: #206e87 !important;
}
.calendar .button {
    border-color: #fff #adaa9c #adaa9c #fff;
    background: none;
    color: #fff !important;
}
.calendar tfoot tr.time td.timetext {
    text-align: center;
    color: #fff !important;
}
.calendarArrowLeftDefault, .calendarTitleDefault {
    color: #ffffff !important;
}

.calendarCalendarDefault {
    background-color: #206e87 !important;
}
.calendar thead .name {
    border-color: #000;
    background-color: #206e87 !important;
}
.calendarDaySelectedDefault {
    color: #ffff !important;
    border: 1px solid #2e95b7 !important;
    background-color: #2e95b7 !important;
}*/
.itg_dashboard_tab-content .itg_dashboard_tab-pane .k-grid .k-grid-content:not(.k-grid-pager) {
    overflow: visible;
}

/*#ctl00_ctl00_cphPageBody_cphPageBody_pnlSearch + #ctl00_ctl00_cphPageBody_cphPageBody_pnlContent #ctl00_ctl00_cphPageBody_cphPageBody_oUpdatePanelQuestions .WideGrid {
    max-height: max-content;
    overflow: visible;
}*/
.WideGrid {
    max-width: 100%;
    max-height: fit-content;
    overflow: visible;
    padding-bottom: 20px;
}

.RadMultiPage.RadMultiPage_Default .rmpView table > tbody > tr:has(.MathIconAnswer) {
    text-align: end;
}

    .RadMultiPage.RadMultiPage_Default .rmpView table > tbody > tr:has(.MathIconAnswer) > td a i {
        font-size: var(--font-21, 21px);
    }

.course-dashboard.coursepage .widget-block .widget-title {
    font-size: var(--font-16, 16px);
}

.CourseColumnContent .panel-default.lecturePanel .panel-collapse .courseContentTabs .itg_dashboard_tab-content .itg_dashboard_tab-pane .WideGrid .table.dlLearningObjects .dlLearningObjectsItem.SimulationApp {
    background: #f8f8f9;
    border-radius: 5px;
    max-width: 100px;
    border: 1px solid #ededf3;
    margin: 10px;
}

.itg_dashboard_tab-content .itg_dashboard_tab-pane .WideGrid .table.dlLearningObjects .dlLearningObjectsItem.SimulationApp:last-child {
    margin-left: 0;
}

.itg_dashboard_tab-content .itg_dashboard_tab-pane .WideGrid .table.dlLearningObjects .dlLearningObjectsItem.SimulationApp:first-child {
    margin-right: 0;
}

.CourseColumnContent .panel-default.lecturePanel .panel-collapse .courseContentTabs .itg_dashboard_tab-content .itg_dashboard_tab-pane .WideGrid .table.dlLearningObjects .dlLearningObjectsItem.SimulationApp > div {
    padding: 3px;
}

.itg_dashboard_tab-content .itg_dashboard_tab-pane .WideGrid .table.dlLearningObjects .dlLearningObjectsItem.SimulationApp i {
    color: #206e87;
    font-size: 36px;
}

.CourseColumnContent .panel-default.lecturePanel .panel-collapse .courseContentTabs .itg_dashboard_tab-content .itg_dashboard_tab-pane .WideGrid .table.dlLearningObjects .dlLearningObjectsItem.SimulationApp > div:nth-child(2) {
   font-family: 'Cairo Regular';
    font-weight: 600;
}

.nav.navbar-nav.navbar-right .e31_InstantMessages.itg_dashboard_dropdown-menu.course-chat-menu {
    padding-bottom: 38px;
}

.box-body .course_gradbook_grade canvas {
    position: static;
    width: 30px;
    height: 30px !important;
}

input[type="image"] {
    border: 0 !important;
    padding-top: 5px !important;
/*    height: auto !important;*/
    border-radius: 0 !important;
    width: auto !important;
    margin: 0 10px !important ;
}
#ctl00_ctl00_cphPageBody_cphPageBody_UcQuestionBank_upQuestionBank > td {
    width: 270px !important;
}
.GridPagination.TableRowStyle table {
    width: auto !important;
}
#ctl00_ctl00_cphPageBody_cphPageBody_UcQuestionBank_lbtnAddQuestionBank.add-btn-circle {
    position: relative;
    right: -40px;
}
input[type="submit"] {
    width: auto !important;
}
#ctl00_ctl00_cphPageBody_cphPageBody_clrExtendPeriod{
    font-size: 12px !important;
}
.table_text.TableGridstyle .TabelGrid > tbody > tr.tableHeaderCell > th:before {
    content: "";
    display: block;
    position: absolute;
    left: 10px;
    top: 20px;
    height: 18px;
    width: 1px;
    border-left: 1px solid #c4c4c4;
}

#generalAvarage .noData {
    min-height: auto;
    position: relative;
    background-color: #fff !important;
    top: 0;
}

#generalAvarageDev {
    border: 0 !important
}

.jqTransformRadioWrapper {
    margin-top: 2px !important;
}

#tblSwitchHtml {
    width: auto !important;
}

#ctl00_ctl00_cphPageBody_cphPageBody_oQuestionTemplateUC_UcQuestionBank_upQuestionBank .ddlQuestionBankContainer {
    padding-left: 0 !important;
}
/*#ctl00_ctl00_cphPageBody_cphPageBody_oQuestionTemplateUC_tbInstructions_tbDescription {
    margin-left: 118px;
}*/
/*#ctl00_ctl00_cphPageBody_cphPageBody_tbDescription {
    width: 180px !important;
}*/
.eduwaveHeader .navbar-default .navbar-brand:focus, .eduwaveHeader .navbar-default .navbar-brand {
    background-color: transparent;
    padding-top: 7px;
}

.SearchTable td[style="width: 25%;"]:empty,
.SearchTable td[style="width:25%;"]:empty {
    width: 50px !important
}

#ctl00_ctl00_divPageNavigation {
    margin: 15px 10px 10px;
}

.CreateImageHotspotQuestionsPadding {
    margin: 15px 0;
}
/*#ctl00_ctl00_cphPageBody_cphPageBody_pnlSearch {
    padding: 15px 25px;
    border: 1px solid #206e87 ;
    border-radius: 8px;
}*/
.calendarDayNameDefault {
    font: bold 11px Tahoma;
    color: #222 !important;
    text-align: center;
}

.mCSB_container {
    display: flex;
    flex-wrap: wrap;
}
/*.page-title-container .row {
    --bs-gutter-x: 0 !important;
}*/
.coursepageMargin > div:nth-child(1).row {
    /*    margin-left: 0;*/
}

    .coursepageMargin > div:nth-child(1).row > #LearningObjectFolderingWidget {
        /*        padding-right: 0px;*/
    }


.btn-secondary {
    color: #206e87;
    background-color: #f4f5f6 !important;
    border-color: #f4f5f6 !important;
}

@media (min-width: 768px) {
    .modal-dialog {
        max-width: 600px;
        margin: 30px auto;
    }
  
}


.itg_dashboard_tab-content > .itg_dashboard_tab-pane {
    display: none;
}


.itg_dashboard_tab-content > .itg_dashboard_active {
    display: block;
}

/*}
*/
/*.post-options > div:nth-child(2) .btn-group.open ul.itg_dashboard_dropdown-menu {
    top: 128% !important;
}*/
/*#mCSB_1_container > ul.products-list {
    flex-grow:1;
}

    #mCSB_1_container > ul.products-list .product-title{
        display:flex;
        justify-content:space-between;
        padding:0 2px;
    }*/

.courseContentTabs .nav-tabs > li > a {
    position: relative;
}

    .courseContentTabs .nav-tabs > li > a.nav-link.active::before {
        content: "";
        position: absolute;
        width: 100%;
        height: 4px;
        background: var(--primary-color);
        bottom: -16px;
    }

.courseContentTabs .tab-content {
    border: none;
}

div.container.coursepagecontent.col-md-12 {
    width: 100% !important;
    max-width: 100% !important;
}

.LectureBtnsContainer input[type="button"] {
    width: auto !important;
}

.Notification-item-btnYesContainer input[type="button"], .Notification-item-btnNoContainer input[type="button"] {
    padding: 6px 20px !important;
    min-width: 100px;
}

.ui-sortable {
    display: block !important;
}




.AssessmentStage .assessmentHeader {
    background: #206e87 !important;
    padding: 10px 15px;
    border: 1px solid #206e87 !important;
    border-radius: 0 !important;
}

.unit-section {
    justify-content: space-between !important;
    background-color: #206e87 !important;
    color: #fff !important;
    padding: 15px;
}

.tabs-sidebar .sideBarTabs .nav-link.active {
    border-bottom-color: #206e87 !important;
    border-radius: 8px;
    background-color: #206e87 !important;
    color: #fff !important;
}

.start-course-header .bread-crumb-links span::after {
    border-right: 8px solid #206e87 !important;
}

.icon-lecture-time.icon-size-xl.text-primary {
    color: #206e87 !important;
    position: relative;
    left: 5px;
}

.icon-Description.icon-size-xl.text-primary {
    color: #206e87 !important;
}

.LectureTitle span {
    color: #206e87 !important;
   font-family: 'Cairo Regular' !important;
}

.eduwaveWrapper.box .courseContentTabs .nav-tabs > li > a {
    color: #555;
    background: #fff;
    border-radius: 8px;
    background: #206e87 !important;
    color: #fff;
    padding: 4px 12px;
    font-size: var(--font-14, 14px);
    display: inline-block;
    min-width: 90px;
    text-align: center;
}

#slidorion #newAdjustable-layout {
    display: flex;
    align-items: stretch;
    width: 100%;
    height: calc(100vh - 130px);
    scrollbar-color: #206e87 #00000000 !important;
    overflow: auto;
}

.GetSectionLink {
    color: #206e87 !important;
    position: relative;
    top: -4px;
    font-weight: bold;
}

.sidebar-adjust-buttons-container .btn-primary {
    background-color: #206e87 !important;
    border-color: #206e87 !important;
}

.dropdown-container-edit .dropdown-edit a:hover {
    background-color: #206e87;
    color: #fff !important;
}
#ctl00_ctl00_cphPageBody_cphPageBody_ucCourseTemplate_trReadOnly td:nth-child(3) {
    width: 15px !important;
}
#ctl00_ctl00_cphPageBody_cphPageBody_ucCourseTemplate_trReadOnly td:nth-child(4) {
/*    width: 25% !important;*/
}
#ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin{
    width: 100% ;
}
#ctl00_ctl00_cphPageBody_cphPageBody_ucLearningStandardItem_ucLearningStandardDocuments_gvLearningStandaradDocuments td:last-child {
    text-align: center; /* جعل المحتوى في المنتصف عرضياً */
    vertical-align: middle; /* جعل المحتوى في المنتصف طولياً */
    width: 50px; /* تحديد عرض ثابت للعمود لمنع التذبذب */
}
@media (max-width: 768px) {
    .CreateImageHotspotQuestionsPadding table table tr {
        display: inherit !important;
    }
    .WideGrid table {
        word-wrap: normal !important;
    }
    .TableGridstyle .TabelGrid > tbody > tr > td span {
        word-wrap: normal !important;
    }
    .inputDatee tr {
        display: flex;
        justify-content: start;
        align-items: center;
    }
}

/* ضبط أيقونة النقاط الثلاث */
.fa-ellipsis-v {
    display: block; /* تحويلها لعنصر بلوك لسهولة التحكم */
    margin: 0 auto; /* توسيطها داخل الخلية */
    cursor: pointer;
    text-decoration: none;
    color: #333; /* يمكنك تغيير اللون حسب الرغبة */
}
/*.trAccessLevelCheckboxStyle .cbAccessLevelClass {
    position: relative;
    right: 30px;
}*/
#ctl00_ctl00_cphPageBody_cphPageBody_ucCourseTemplate_lblAccessLevelRequired {
    text-align: right !important;
    margin: 0 !important;
}
/*#ctl00_ctl00_cphPageBody_cphPageBody_ucCourseTemplate_trAccessLevelCheckbox {
    display: contents !important;
}*/
.tableCheckbox {
    display: ruby-text;
    margin-top: 15px;
}
    .tableCheckbox div {
        margin: 0 0 0 5px;
    }
.sectionActionsArrows a {
    font-size: 17px;
    width: 26px;
    height: 26px;
    display: flex;
    color: #fff;
    background-color: #206e87 !important;
    border-radius: 50%;
    font-weight: normal;
    display: inline-block !important;
    padding: 7px;
    line-height: 9px;
    text-align: center;
    cursor: pointer;
    transition: all ease-in-out .3s;
}

.tabsStyle .nav-tabs > li > a:hover,
.tabsStyle .nav-tabs .nav-link.active {
    border-color: transparent !important;
    box-shadow: 0 3px 0 var(--secondary-color) !important;
    background: none;
    color: var(--secondary-color) !important;
}

.MarginWrapper .parentFilterBar {
    padding: 15px !important;
}

    .MarginWrapper .parentFilterBar .FilterBar-content .filter-buttons {
        display: flex;
        justify-content: flex-end;
        margin-top: 15px;
    }

iframe .eduwaveWrapper {
    margin-bottom: 0 !important;
}

.ViewDataEmptyAddNew {
    min-height: 200px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.Notification-position-MiddleCenter #divButtonsContainer {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 25px;
    gap: 5px;
}

    .Notification-position-MiddleCenter #divButtonsContainer input[type='button'] {
        min-width: 100px;
        padding: 10px 5px;
    }

.Notification-position-MiddleCenter .Notification-item {
    padding: 0 !important;
}

.Notification-position-MiddleCenter .Notification-item-image {
    position: relative;
    right: 0;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 15px;
    height: auto;
}

    .Notification-position-MiddleCenter .Notification-item-image::before {
        position: relative;
        right: 0;
        top: 0;
        left: 0;
        margin: 0 !important;
    }

.Notification-position-MiddleCenter .Notification-item-close {
    top: 0;
}

.Notification-position-MiddleCenter .Notification-item-wrapper {
    padding-top: 50px !important;
}

#ctl00_ctl00_cphPageBody_cphPageBody_divAdmin,
#ctl00_ctl00_cphPageBody_cphPageBody_pnlTeacherStudents,
#ctl00_ctl00_cphPageBody_cphPageBody_divNewDesginContainer #ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin {
    background: #fff;
    height: 100%;
    border-radius: 8px;
    border: 0px solid #ddd;
    padding: 15px;
}
.SearchDIV td:empty {
    display: none;
}
@media (max-width: 767px) {
    .bodywrapper .eduwaveWrapper .MarginWrapper .eduwaveContent .widgetrow.row{
        padding:unset !important;
    }

    .row > * {
        padding-left: calc(var(--bs-gutter-x) * .5) !important;
        padding-right: calc(var(--bs-gutter-x) * .5) !important;
        margin-top: var(--bs-gutter-y) !important;
    }
    .course-dashboard.row.coursepage.clearfix {
        margin: 25px calc(-.5 * var(--bs-gutter-x));
    }
    .wrapper {
        width: unset;
    }
        .wrapper .col-md-2 .courseleftSide.clearfix {
            width: 100%;
            margin: 20px 0px 15px !important;
        }
        .wrapper .page-title {
            margin: 20px 0px 15px;
        }
        .wrapper .coursepageMargin{
            margin:0;
        }
    .btn.btn-flat{
        width:100%;
    }
}
@media (max-width: 991px) {
    
        #divCourseHomeContent #ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin.coursepagecontent table#tblMain {
            width: 100% !important;
        }
            #divCourseHomeContent #ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin.coursepagecontent table#tblMain #ctl00_ctl00_cphPageBody_cphPageBody_pnlStudentsComments table {
                width: 100% !important;
            }
    #divCourseHomeContent #ctl00_ctl00_cphPageBody_cphPageBody_divNewDesgin.coursepagecontent table#tblMain #ctl00_ctl00_cphPageBody_cphPageBody_oUpdatePanelComments table {
        width: 100% !important;
    }
    #navigation-example-2 {
        background: var(--primary-color);
        z-index: 1;
        height: auto;
    }
    .LearningObjectFolderingWidget .DataListItems span span table tr:last-of-type td .folder-DeleteItems:before {
        content: "\f1f8";
        color: #BA2532;
        background-color: #FEF1F2;
        padding: 3px 7px;
        border-radius: 50%;
        font-size: 12px;
       
    }
    /*#navigation-example-2 {
        background-color: var(--primary-color) !important;
    }
    .mobilemenu-sidebar, body > .navbar-collapse:after {
        background: transparent !important;
        }
        #navigation-example-2.navbar-collapse {
            position: fixed;
            top: 0;
            right: -100%;*/ /* البداية تكون خارج الشاشة من اليمين */
            /*width: 250px;
            height: 100vh;
            background-color: #fff;*/ /* لون الخلفية */
            /*z-index: 1050;
            transition: right 0.3s ease-in-out;
            display: block !important;*/ /* إجبار العنصر على الظهور للتحكم بحركته */
            /*box-shadow: -2px 0 5px rgba(0,0,0,0.2);
            padding-top: 60px;
            overflow-y: auto;
        }*/

            /* عندما يتم الضغط على الزر وتضاف كلاس show */
            /*#navigation-example-2.navbar-collapse.show {
                right: 0;*/ /* الدخول إلى الشاشة */
            /*}*/

        /* تحويل العناصر داخل القائمة لتكون عمودية */
        /*#navigation-example-2 .navbar-nav {
            flex-direction: column;
            padding: 15px;
        }*/

    /* تنسيق إضافي لضمان عدم تداخل الهيدر */
    /*.navbar-header {
        z-index: 1060;
        position: relative;
    }

    #ctl00_ctl00_cphHeader_EduWaveHeaderNotifications_New_HeaderMenu {
        display: flex !important;
        flex-wrap: wrap !important;
        padding: 10px !important;
        background: #fdfdfd;
        list-style: none;
    }*/

        /* 2. تنسيق كل عنصر (li) ليصبح كـ "كارت" */
        /*#ctl00_ctl00_cphHeader_EduWaveHeaderNotifications_New_HeaderMenu li.col-md-4 {
            width: 33.33% !important;*/ /* 3 عناصر في السطر الواحد */
            /*padding: 8px !important;
            float: right !important;*/ /* للمحاذاة العربية */
            /*box-sizing: border-box;
        }*/

        /* 3. تنسيق الرابط (الزر) نفسه */
        /*#ctl00_ctl00_cphHeader_EduWaveHeaderNotifications_New_HeaderMenu li a {
            display: flex !important;
            flex-direction: column !important;*/ /* الأيقونة فوق النص */
            /*align-items: center !important;
            justify-content: center !important;
            background: #ffffff !important;
            border: 1px solid #e0e6ed !important;
            border-radius: 12px !important;
            padding: 15px 5px !important;
            height: 90px !important;*/ /* توحيد الارتفاع */
            /*text-decoration: none !important;
            color: #444 !important;
            font-size: 11px !important;
            font-weight: 600;
            transition: all 0.3s ease;
            box-shadow: 0 2px 4px rgba(0,0,0,0.02);
        }*/

            /* 4. إضافة تأثير عند الضغط */
            /*#ctl00_ctl00_cphHeader_EduWaveHeaderNotifications_New_HeaderMenu li a:active {
                background: #f0f7ff !important;
                transform: scale(0.95);
            }*/

            /* 5. تنسيق الأيقونات (الـ Pseudo-elements إذا كانت تستخدم FontAwesome) */
            /*#ctl00_ctl00_cphHeader_EduWaveHeaderNotifications_New_HeaderMenu li a::before {
                font-family: "FontAwesome";
                font-size: 24px !important;
                margin-bottom: 8px !important;
                color: #007bff;*/ /* لون الأيقونات الموحد */
            /*}*/

    /* تخصيص أيقونات معينة بناءً على الـ Class الموجود في الكود */
    /*.fa-Assessment-Management::before {
        content: "\f0ae";
    }*/
    /* مثال لأيقونة امتحانات */
    /*.fa-Assignment-Management::before {
        content: "\f02d";
    }*/
    /* مثال لواجبات */
    /*.fa-Course-Templates::before {
        content: "\f009";
    }

    .fa-Learning-Managment::before {
        content: "\f19d";
    }

    .fa-Content-Library::before {
        content: "\f02b";
    }

    .fa-Learning-Standards::before {
        content: "\f0ca";
    }*/

    /* 6. إخفاء العناصر غير الضرورية (مثل السكرول بار القديم) */
    /*.mCSB_draggerContainer, .mCSB_scrollTools {
        display: none !important;
    }

    .mCustomScrollBox, .mCSB_container {
        overflow: visible !important;
        width: 100% !important;
    }
    .dropdown-menu.itg_dashboard_dropdown-menu.navbar-options {
        display: block !important;
        position: fixed !important;*/ /* ثابتة على الشاشة */
        /*top: 0 !important;
        right: 0 !important;
        width: 280px !important;*/ /* عرض القائمة */
        /*height: 100vh !important;*/ /* ملء ارتفاع الشاشة */
        /*margin: 0 !important;
        padding: 60px 10px 20px 10px !important;*/ /* مساحة علوية لتجنب التداخل مع الهيدر */
        /*background: transparent !important;
        box-shadow: -5px 0 15px rgba(0,0,0,0.15) !important;
        z-index: 99999 !important;
        overflow-y: auto !important;*/ /* سكرول داخلي طبيعي */
        /*border: none !important;
        transform: none !important;
    }*/

    /* 2. تنظيف عناصر مكتبة mCustomScrollbar التي تسبب التداخل */
    /*.mCustomScrollBox,
    .mCSB_container,
    #ctl00_ctl00_cphHeader_EduWaveHeaderNotifications_New_HeaderMenu {
        position: relative !important;
        top: 0 !important;*/ /* إلغاء الـ -336px الظاهر في الصورة */
        /*left: 0 !important;
        width: 100% !important;
        height: auto !important;
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
        background-color: transparent;
    }*/

        /* 3. تنسيق الأيقونات (المربعات) */
        /*#ctl00_ctl00_cphHeader_EduWaveHeaderNotifications_New_HeaderMenu li.col-md-4 {
            width: 50% !important;*/ /* عنصرين في كل سطر لشكل أرتب */
            /*padding: 8px !important;
            float: right !important;
            box-sizing: border-box !important;
            list-style: none !important;
        }

    .navbar-nav .navbar-options li a.fa-Learning-Managment:after{
        display: none !important ;
    }
    .eduwaveHeader .navbar-right {
        position: relative;
        left: 0;
        right: auto !important;
    }
        #ctl00_ctl00_cphHeader_EduWaveHeaderNotifications_New_HeaderMenu li a {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        background: #f8f9fa !important;
        border: 1px solid #e0e0e0 !important;
        border-radius: 10px !important;
        height: 40px !important;
        padding: 0px !important;
        text-align: center !important;
        color: #333 !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        text-decoration: none !important;
    }*/

            /* تنسيق الأيقونة */
            /*#ctl00_ctl00_cphHeader_EduWaveHeaderNotifications_New_HeaderMenu li a::before {
                display: none !important
            }
    .navbar-nav .navbar-options li a:hover:after, .navbar-nav .navbar-options li a.selected:after {
        display: none !important
    }*/
    /* إخفاء السكرول بار البرمجي تماماً لأنه يشوه المنظر */
    /*.mCSB_scrollTools, .mCSB_draggerContainer {
        display: none !important;
    }
    .navbar-nav .navbar-options li .fa-Health-Management::after, .navbar-nav .navbar-options li .fa-Badges-Management:after, .navbar-nav .navbar-options li .fa-ExtendedEssayForm:after, .navbar-nav .navbar-options li .fa-ibprogram:after, .navbar-nav .navbar-options li .fa-kwnoladge:after, .navbar-nav .navbar-options li .fa-Student-Affairs:after, .navbar-nav .navbar-options li .fa-Course-Management:after, .navbar-nav .navbar-options li .fa-Content-Management:after, .navbar-nav .navbar-options li .fa-Assessment-Management:after, .navbar-nav .navbar-options li .fa-Grades-Management:after, .navbar-nav .navbar-options li .fa-Attendance-Management:after, .navbar-nav .navbar-options li .fa-Assignment-Management:after, .navbar-nav .navbar-options li .fa-Books-Management:after {
        display: none !important;
    }

    .first-step-menu {
        flex-direction: column;
        align-items: center;
    }*/

    /* الصورة في النص */
    /*.userphoto {
        text-align: center;
        width: 100%;
    }*/

    /* المعلومات تحت الصورة */
    /*.userinfo {
        margin: 10px 0;
        text-align: center;
    }*/

    /* يمنع النص يبوظ الشكل */
    /*.UserType span {
        display: block;
    }*/

    /* dropdown تبقى تحت وfull width */
    /*.itg_dashboard_dropdown-menu {
        position: static;
        display: block;*/ /* تبقى ظاهرة */
        /*width: 100%;
        box-shadow: none;
        text-align: center;
        padding: 0;
    }

        .itg_dashboard_dropdown-menu li {
            border-top: 1px solid #eee;
            padding: 10px;
        }
    .wideGridInDiv {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .TabelGrid {
        min-width: 900px;*/ /* أو حسب عدد الأعمدة */
    /*}*/
/*    #ctl00_ctl00_LogoDiv button{
        display: none ; 
    }*/
        #navigation-example-2.navbar-collapse.collapse:not(.show),
        #navigation-example-2.navbar-collapse.collapse {
            display: flex !important;
            justify-content: end;
        }
    .clearfix.header-top .headercentercontent {
        display: none;
    }
    /* 2. إخفاء زر المنيو (الهامبرجر) لأنه لم يعد له داعٍ هنا */
    .navbar-toggler {
        display: none !important;
    }

    /* 3. تنسيق توزيع العناصر في الهيدر */
    .container-fluid {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center;
        justify-content: space-between;
    }
    .navbar-right .itg_dashboard_dropdown-menu.navbar-options, .navbar-right .itg_dashboard_dropdown-menu {
        left: -23px;
        right: auto;
        top: 45px;
        position: absolute;
    }
    .navbar .navbar-brand:before {
        right: 60px !important;
    }
    .navbar .navbar-nav.navbar-right > li {
        width: 35px;
        height: 35px;
    }
    .navbar .navbar-nav.navbar-right > li {
        padding: 0 !important;
    }
    .lbtn-course-home a:before {
        font-size: 16px;
        color: var(--primary-color);
    }
    .eduwaveHeader > .navbar {
        padding: 0;
    }
    .course-dashboard.coursepage .program-tabs {
        z-index: 0;
    }
    .mCSB_container .col-md-4 {
        flex: 0 0 auto;
        width: 33.33333333%;
    }
    #navigation-example-2 {
        background: transparent !important;
    }
    .fa-volume-up:before {
        font-size: 16px;
        color: var(--primary-color);
    }
    .navbar-nav > li .fa-th:before {
        font-size: 16px;
        color: var(--primary-color);
    }
    .nav.navbar-nav.navbar-right li{
        background-color: #fff !important ;
    }
    .logOutIcon:before {
        top: 1px;
        right: 15px;
    }
    .navbar .navbar-nav.navbar-right > li > a {
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
    }
    .logOutIcon:before {
        font-size: 16px;
        color: var(--primary-color);
    }
    .navbar .navbar-nav.navbar-right > li {
        padding: 0 21px;
    }
    .navbar-Center .navbar-options, .navbar-right .navbar-options {
        max-width: 100% !important;
        min-width: 300px !important;
        box-sizing: border-box;
        padding: 10px 0;
    }
        /* 4. تنسيق القوائم لتظهر كأيقونات متراصة */
        .navbar-nav {
        flex-direction: row !important;
        margin: 0 !important;
        align-items: center;
    }
    .eduwaveHeader .navbar-right {
        position: relative;
        right: 0 !important;
        left: 0;
        justify-content: end;
    }

    




}
.box-tools.RecentActivityButtonSettings input[type="submit"] {
    padding: 0;
}




.calendar {
    border-radius: 10px !important;
    border: none !important;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, .2) !important;
    font-family: 'Cairo Regular' !important;
    width: 20%;
}

    .calendar tfoot tr.time td.hour, .calendar tfoot tr.time td.minute {
        background-color: #ffffff;
    }

    .calendar table {
        width: 100%;
        background-color: #fff;
    }

    .calendar table {
        border-radius: 10px;
    }

    .calendar thead .title {
        background-color: #018076 !important;
        color: #f2a001 !important;
        font-family: 'Cairo Regular' !important;
    }

    .calendar > table > thead > tr:first-child > td.button {
        color: #fff !important;
        font-size: var(--font-16, 16px) !important
    }

    .calendar table td {
        /*        background: #fff !important;*/
        color: #000 !important;
        font-weight: normal;
    }

    .calendar table {
        font-family: 'Cairo Regular' !important;
        border: none !important;
    }

    .calendar thead .name {
        color: #206e87 !important;
        font-size: 11px !important;
    }

    .calendar > table > thead > tr:first-child > td {
        border: none !important;
        padding: 11px !important;
        vertical-align: middle;
        background: #206e87 !important;
        color: #fff !important;
    }


        .calendar > table > thead > tr:first-child > td:first-child {
            display: table-cell;
            padding: 0 7px 13px !important;
            font-size: var(--font-14, 14px) !important;
            background: #f5a224;
            border-radius: 0 0px 0 0;
        }

        .calendar > table > thead > tr:first-child > td:last-child {
            display: table-cell;
            font-size: var(--font-18, 18px) !important;
            line-height: 14px;
            font-weight: normal !important;
            border-radius: 0px 0 0 0;
        }

    /*  .calendar > table > thead > tr:first-child > td:nth-child(2) {
            color: #F5A224 !important;
        }
*/

    .calendar tbody .daysrow td.selected {
        background-color: #206e87 !important;
        font-family: 'Cairo Regular' !important;
        border: none !important;
    }


    .calendar thead .weekend {
        /*color: #206e87  !important;*/
        color: #206e87 !important;
    }

    .calendar tbody .daysrow .emptycell {
        border: 1px solid #eee !important;
        font-family: 'Cairo Regular' !important;
    }

    .calendar table td {
        border: 1px solid #eee !important;
    }

    .calendar table td {
        font-size: 11px !important;
        font-family: 'Cairo Regular' !important;
    }

    .calendar tfoot .ttip {
        /* background: #206e87  !important;
        color: #fff !important;*/
        padding: 5px !important;
        font-family: 'Cairo Regular' !important;
        font-weight: normal !important;
        background: #206e87 !important;
        color: #fff !important;
        border-radius: 0 0 10px 10px;
        border: none !important;
    }

    .calendar tfoot tr.time td.hour, .calendar tfoot tr.time td.minute {
        border-color: #ffffff !important;
        background-color: #fff !important;
        text-align: center !important;
    }
div#treeview ul {
    display: flex;
    flex-direction: column;
    padding: 0 !important;
}
.table-row-col {
/*    display: flex;
    justify-content: center;
    align-items: center;*/
}
i {
    font-style: normal;
}
.LearningObjectFolderingWidget  .DataListItems span > span {
/*    border: 1px solid #E6E6E6;*/
    padding: 20px 0px 0;
    width: 176px;
    text-align: center;
    margin: 0 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 168px;
    border-radius: 12px;
    position: relative;
    margin: 15px ;
}
.LearningObjectFolderingWidget  .DataListItems span span table tr:last-of-type td {
    position: absolute !important;
    top: 5px;
    right: -3px;
    display: block;
}
    .LearningObjectFolderingWidget .DataListItems span span table tr:last-of-type td .folder-EditItems, .folder-DeleteItems {
        display: block;
        margin: 0 10px;
    }
    .LearningObjectFolderingWidget .DataListItems span span table tr:last-of-type td .folder-DeleteItems:before {
        content: "\f1f8";
        color: #BA2532;
        background-color: #FEF1F2;
        padding: 3px 7px;
        border-radius: 50%;
        font-size: 12px;
        width: 30px !important;
        height: 30px !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        margin: 10px 0 !important;
    }
.LearningObjectFolderingWidget  .DataListItems td.CreatorName {
    border-top: 1px solid #ddd;
    padding-top: 10px;
}
.LearningObjectFolderingWidget  .DataListItems span span table {
    width: 100% !important
}
.LearningObjectFolderingWidget  .ImportBook .ImportBookBody {
    border: 1px solid #E6E6E6;
    border-radius: 12px;
    padding: 15px;
}
.ImportBook {
    padding: 15px
}
.ImportBook .ImportBookBody .info_postion .ValidationStar {
    position: absolute;
    top: -7px;
    left: 4px;
}
    .ImportBook .ImportBookBody .file.marginBottom {
        display: block;
        width: 400px !important;
        height: 48px !important;
        border-radius: 16px;
        padding-top: 12px;
        padding-right: 16px;
        padding-bottom: 12px;
        padding-left: 16px;
    }
    .ImportBook .ImportBookBody .FileUploaderStyle {
        width: 100% !important;
    }
    .ImportBook .ImportBookBody .__fileupload-Aathar {
        background: none !important;
        display: inline;
        overflow: hidden;
        background-color: #206e87 !important;
        width: 192px !important;
        height: 48px !important;
        border-radius: 16px;
        padding-top: 12px;
        padding-right: 22px;
        padding-bottom: 12px;
        padding-left: 22px;
        position: relative !important;
    }
        .ImportBook .ImportBookBody .__fileupload-Aathar:before {
            content: "تحميل";
            color: #fff;
            display: flex;
            justify-content: center;
            align-items: center;
            font-family: Cairo;
            font-size: 18px;
            margin: 0 15px;
        }
    .ImportBook .ImportBookBody input[type="file"] {
        top: -29px;
        left: 17px;
        cursor: pointer !important;
    }
    .ImportBook .ImportBookBody #ctl00_ctl00_cphPageBody_cphPageBody_FUZippedFile_tdFileLabel {
        display: flex;
    }
.LibraryLabel .labelsStyle.marginBottom {
    color: #086271;
    width: fit-content !important;
}
.ContentLibraryMgtPadding div {
    text-align: center;
}
#ctl00_ctl00_cphPageBody_cphPageBody__ucLearningObjectFolderingWidget_lbtnSelectItems {
    font-weight: bold;
}
#parentNode > li, #ulChildNode389 > li, #ulChildNode453 > li, #ulChildNode463 > li  {
    border: 1px solid #e1ebef;
    border-radius: 13px;
    padding: 10px 10px;
    margin: 17px 0 -5px 0;
    background-color: #e1ebef;
}
#ulChildNode1 > li {
    border: 1px solid #ddd;
    border-radius: 13px;
    padding: 10px 10px;
    margin: 17px 0 -5px 0;
    background-color: #fff;
}
#ulChildNode104 > li, #ulChildNode105 > li, #ulChildNode449 > li , #ulChildNode452 > li, #ulChildNode458 > li, #ulChildNode391 > li, #ulChildNode106 > li, #ulChildNode3 > li, #ulChildNode367 > li {
    background-color: #fff !important;
}
#ulChildNode1 > li a {
    color: 000;
}
.CreateImageHotspotQuestionsPadding #treeview ul > li {
    border: 1px solid #ddd;
    border-radius: 13px;
    padding: 10px 10px;
    margin: 17px 0 -5px 0;
}
#ulChildNode2 > li{
    border: 1px solid #ddd;
    border-radius: 13px;
    padding: 10px 10px;
    margin: 17px 0 -5px 0;
    background-color: #e1ebef !important;
}
    #ulChildNode2 > li a {
        color: #000;
        padding: 4px 0 0 0 !important;
    }
#parentNode > li a {
    padding: 4px 0 0 0 !important;
}
.ImportBook .FileUploaderStyle > div[style*="position"] {
    left: -9px;
    top: -3px;
}
.ImportBook .HelpImg::before {
    position: relative;
    top: 50px;
    left: -15px;
}
#parentNode .highlight, #ulChildNode2 .highlight, #ulChildNode1 .highlight {
    background-color: transparent;
}
#ctl00_ctl00_cphPageBody_cphPageBody__ucLearningObjectFolderingWidget_lbtnSelectItems
.ContentLibraryMgtPadding .noDataClass img {
    display: flex !important;
    justify-content: center;
    align-items: center;
    margin: auto;
    width: 17%;
}

.btnEdit:before {
    font-family: 'Font Awesome 5 Free', 'FontAwesome', 'Font Awesome 5 Regular' !important;
    content: "\f06e" !important;
    font-size: 16px;
    color: #fff;
    position: absolute;
    right: 19px;
    top: 9px;
}
.btnDelete:before {
    font-family: 'Font Awesome 5 Free', 'FontAwesome', 'Font Awesome 5 Regular' !important;
    content: "\f2ed" !important;
    font-size: 16px;
    color: #981b25;
    position: absolute;
    right: 30px;
    top: 9px;
}
.btnBody:before {
    font-family: 'Font Awesome 5 Free', 'FontAwesome', 'Font Awesome 5 Regular' !important;
    content: "\f303" !important;
    font-size: 16px;
    color: #206e87;
    position: absolute;
    right: 30px;
    top: 6px;
}
.btnEdit input, .btnBody input, .btnDelete input {
    padding: 0 50px 0 40px !important
}

.btnEdit, .btnBody, .btnDelete {
    position: relative;
}
    .ImportBook .ImportBookBody .labelsStyle {
        font-family: Typography/Language/Language;
        font-weight: 600;
        font-style: SemiBold;
        font-size: 14px;
        leading-trim: NONE;
        line-height: 20px;
        letter-spacing: 0%;
        text-align: right;
    }

.ContentLibraryMgtPadding .TabelGrid {
    border-radius: 16px;
    overflow: hidden;
}
.ContentLibraryMgtPadding .TabelGrid tr td {
    border: 0 !important;
}

    .ContentLibraryMgtPadding .TabelGrid tr td #gvLibraryGrid {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 10px;
    }

        .ContentLibraryMgtPadding .TabelGrid tr td #gvLibraryGrid .LibraryDiv {
            display: flex;
            align-items: center;
            gap: 10px;
        }
            .ContentLibraryMgtPadding .TabelGrid tr td #gvLibraryGrid .LibraryDiv img {
                border-radius: 16px;
                border: 1px solid #E6E6E6;
                background: #fff;
                padding: 7px;
               
            }
            .ContentLibraryMgtPadding .TabelGrid tr td #gvLibraryGrid .LibraryDiv .LibraryLabel {
                display: block;
            }
        .ContentLibraryMgtPadding .TabelGrid tr td #gvLibraryGrid .TitleWithButtons {
            border: 0;
            margin: 0;
            padding: 0;
        }
        .ContentLibraryMgtPadding .TabelGrid tr td #gvLibraryGrid .TitleWithButtons #buttons {
            float: none !important;
            gap: 5px;
        }
            .ContentLibraryMgtPadding .TabelGrid tr td #gvLibraryGrid .TitleWithButtons #buttons input[type="submit"]{
                border-radius:16px;
            }
            .ContentLibraryMgtPadding .TabelGrid tr td #gvLibraryGrid .TitleWithButtons #buttons [id$="_btnLibraryContent"] {
                background: rgba(17, 92, 116, 0.04);
                border: 1px solid var(--primary-color);
                color: var(--primary-color);
            }
            .ContentLibraryMgtPadding .TabelGrid tr td #gvLibraryGrid .TitleWithButtons #buttons [id$="_btnDeleteLibrary"] {
                background: rgba(152, 27, 37, 0.04);
                border: 1px solid rgba(152, 27, 37, 1);
                color: rgba(152, 27, 37, 1);
            }

div#mCSB_6_container {
    display: block;
}
.navbar-right .itg_dashboard_dropdown-menu.navbar-options div#mCSB_6_container {
    display: flex !important;
}
.section.wrapper.eduwaveContent .coursepagecontent .DataListItems .dlBookElements td > div.input-group {
    margin-bottom: 0 !important;
}
div.OverMaskDialog[id*="dvLearningPlanPopUp"] {
    top: 150px !important;
}

.FileUploaderStyle > div[style*="position"] {
    left: 0;
    top: 3px;
}

#tdInsertFile input[size="3"][maxlength="4"],
#tdInsertFile input[size="3"][maxlength="3"] {
    min-width: 200px;
}

#tdInsertFile select[id*="ddlAlign"] {
    min-width: 200px;
    border-radius: 5px;
    height: 30px;
    border-color: #ddd;
    box-shadow: 0 0 0 0 transparent;
}

#tdInsertFile iframe,
#tdInsertFile #dvImgViewer {
    border-radius: 5px;
    height: 30px;
    border-color: #ddd !important;
    box-shadow: 0 0 0 0 transparent;
}
[id*="tblSearchCriteria"] .SearchDIV .HScrollDiv.tags-container,
[id*="tblSearchCriteria"] .SearchDIV input[style*="width:165px"] {
    width: 180px !important;
    border-radius: 4px;
}
.fixInput table tr {
    display: flex;
}
.fixInput table tr td:first-child {
    display: flex;
    flex-direction: row-reverse;
}
    .fixInput table tr td:first-child input{
        border-radius:0 ;
        padding:0 ;
        min-width:9px;
    }
    .fixInput table tr td:last-child {
        display: flex;
        flex-direction: column;
    }
    .fixInput table tr td:last-child br {
        display: none;
    }
label.switch .jqTransformCheckboxWrapper:has(.jqTransformChecked) + .slider {
    background: var(--primary-color);
}
label.switch .jqTransformCheckboxWrapper:has(.jqTransformChecked) + .slider:before {
    left: 23px;
}
.sectionToggleContainer {
    display: flex;
    justify-content:flex-end;
}
.LectureToggleContainer {
/*    margin-top: 10px;*/
    display: inline-flex !important;
/*    justify-content: space-between;*/
    width: 175px;
    align-items: center;
    float:none !important;


}

#treeview #parentNode li:nth-of-type(1) {
    background-color: #e1ebef;
}
#treeview #parentNode li ul li {
    background-color: #fff !important;
}
#treeview #parentNode li ul li ul li {
    background-color: #e1ebef !important;
}
#treeview #parentNode li ul li ul li ul li  {
    background-color: #fff !important;
}
#treeview #parentNode li ul li ul li ul li ul li {
    background-color: #e1ebef !important;
}
#treeview #parentNode li ul li ul li ul li ul li ul li {
    background-color: #fff !important;
}
#treeview #parentNode img {
    color: transparent;
    background-color: transparent;
    padding: 10px;
}
.dlLearningObjectsItem {
    border: 1px solid #E6E6E6;
    padding: 20px 0px 0;
    /*    width: 176px;*/
    text-align: center;
    margin: 0 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 168px;
    border-radius: 12px;
    position: relative;
    font-size: 14px;
    flex-direction: column;
}
.table.dlLearningObjects .dlLearningObjectsItem div a {
    position: absolute;
    top: 0;
    right: 3px;
    color: red !important;
}
.table.dlLearningObjects .dlLearningObjectsItem div {
    padding: 5px;
    min-width: 90px;
    overflow: hidden;
    white-space: wrap !important;
    text-align: center;
    text-overflow: ellipsis;
    text-wrap: auto;
}
#trtabs #tabs-1 table span table {
    border: 1px solid #E6E6E6;
    padding: 20px 0px 0;
    width: 176px;
    text-align: center;
    margin: 0 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 168px;
    border-radius: 12px;
    position: relative;
}
.CourseColapsedMenu.CourseColapsedContent .courseContentTabs .table div div a  {
    position: relative !important;
/*    font-size: 45px !important;*/
    color: var(--primary-color) !important;
}
    .CourseColapsedMenu.CourseColapsedContent .courseContentTabs .table div div a.itg-font-delete {
        position: absolute !important;
        top: 0 !important;
        right: 3px !important;
        color: red !important;
        font-size: 18px !important;
    }
.ContentLibraryMgtPadding div.folder-wedgit-header clearfix {
    text-align: start !important;
}
#BorderTableWideTop .DataListItems span span table {
    border: 1px solid #E6E6E6;
    padding: 20px 0px 0;
    width: 176px !important;
    text-align: center;
    margin: 0 10px;
    box-shadow: 0px 4px 40px 0px #A1A1A140;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 168px !important;
    border-radius: 12px;
    position: relative;
}
#BorderTableWideTop table span span table tr:last-child td:last-child {
    position: absolute !important;
    top: 0;
    right: 0px;
    text-align: right;
}
#trtabs #tabs-1 table span table tr:last-child td:last-child {
    position: absolute;
    top: 0;
    right: 5px;
}
#divStudyGroup .group-info-container .widget-title > span.label {
    font-size: 10px;
    border-radius: 4px;
}
#divStudyGroup .group-info-container .widget-title > span.closed-label.label.label-success {
    background: var(--bs-danger) !important;
}
/*----------------- Start Loading Style --------------------*/

.loadingGif {
    width: 160px;
    height: 160px;
    border-radius: 50%;
    position: absolute;
    background-color: rgba(32, 110, 135, 0.51);
    padding: 0px;
    left: calc(50% - 89px);
    top: calc(50% - 89px);
    display: flex;
    align-items: center;
    justify-content: center;
    background-repeat: no-repeat;
    background-position: center;
    backdrop-filter: blur(1.5px);
}

    .loadingGif:before {
        position: relative;
        z-index: 2;
        content: "";
        width: 159.5px;
        height: 159.5px;
        margin: 0;
        background: transparent;
        border-top: 3px solid #fff;
        border-right: 2px solid transparent;
        border-radius: 60%;
        -webkit-animation: 1s spin linear infinite;
        animation: 1.5s spin linear infinite;
    }

@-webkit-keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.loadingGif:after {
    z-index: 0;
    content: "";
    width: 100%;
    position: absolute;
    background-image: url(../../Images/AjyalLogoWhite.png);
    background-position: center;
    background-repeat: no-repeat;
    display: block;
    height: 100%;
    background-size: 72px;
}


.itg_loading_overlay {
    position: fixed;
    inset: 0;
    background-color: rgba(var(--primary-opacaty-color), 0.7);
    backdrop-filter: blur(2px);
    z-index: 1000000;
    display: none;
}

.itg_loader {
    width: 160px;
    height: 160px;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(32, 110, 135, 0.51);
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(1.5px);
}

    .itg_loader::before {
        content: "";
        width: 159.5px;
        height: 159.5px;
        border-top: 3px solid #fff;
        border-right: 2px solid transparent;
        border-radius: 60%;
        animation: spin 1.5s linear infinite;
    }

    .itg_loader::after {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        background-image: url(../../Images/AjyalLogoWhite.png);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 72px;
    }
/*----------------- End Loading Style --------------------*/

@media(max-width:992px){
/*    .navbar .navbar-brand:before {
        right: 140px !important;
    }*/
    .headerLogoText p {
        font-size: 8px;
        margin-top: 7px;
    }
   


}
#BorderTableWideTop .DataListItems span span table:hover {
    border: 1px solid var(--primary-color);
}

@media(max-width: 768px) {
    .TabelGrid td, .TabelGrid th {
        min-width: 120px !important; /* يضمن أن كل عمود له مساحة كافية */
        word-break: normal !important; /* يمنع كسر الكلمات بشكل عشوائي */
    }
    #ctl00_ctl00_cphPageBody_cphPageBody_gvAssessments {
        display: table;
        min-width: 1000px !important;  /* اجعل هذا الرقم مساوياً لمجموع عرض الأعمدة المناسب */
    }
    #ctl00_ctl00_cphPageBody_cphPageBody_oUpdatePanelQuestions .WideGrid table {
        width: auto !important;
    }
    .RadComboBox .rcbInputCell {
        text-align: start !important;
    }
 /*   .CreateImageHotspotQuestionsPadding table table tr{
        display: flex !important ;
    }*/
    #ctl00_ctl00_cphPageBody_cphMain_ddlEventTypeAdd_Input {
        width: 100% !important;
    }
    .Notification-item {
        min-width: 0 !important;
    }
    .TitleWithButtons #buttons, .TitleWithButtons .buttons {
        display: block !important;
    }
}

.divMainPopUpData p {
    margin-bottom: 5px !important;
}




@media (max-width: 991px) {
    .coursepageMargin .TitleWithButtons {
        display: block;
        padding: 0 15px !important;
    }
    #ctl00_ctl00_cphPageBody_cphMain_ddlEventTypeSearch_Input{
        border: 0px !important
    }
    .TitleWithButtons {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        padding: 0 !important;
    }

        .TitleWithButtons #buttons, .TitleWithButtons .buttons {
            display: flex !important;
            text-align: end !important;
            justify-content: end;
        }

            .TitleWithButtons .buttons input[type="submit"], input[type="button"] {
                padding: 0 6px !important;
            }

    .courseContentTabs .nav.nav-tabs a {
        color: #9f9f9f !important;
        background-color: transparent;
        padding: 5px 10px;
    }

    .TitleStyle {
        width: 44%;
        text-align: right;
    }

    .TitleWithButtons #buttons {
        display: block !important;
        text-align: end;
    }

        .TitleWithButtons #buttons input[type="submit"], input[type="button"] {
            padding: 0px 30px;
            height: 30px;
            margin-bottom: 10px;
            padding: 0px 5px;
        }

    .lecturePanel .card-header {
        display: block !important;
    }

        .lecturePanel .card-header span {
            font-size: 12px !important;
            color: #000 !important;
        }

    .lecturePanel {
        background-color: transparent !important;
    }

        .lecturePanel .CollapsItemToolbar {
            display: flex;
            justify-content: space-around;
            margin: 10px 0 0;
            position: relative;
            left: 0;
            top: 0;
        }

    .CollapsItemToolbarBtn {
        min-width: 47% !important;
        height: 35px !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

    .CourseColapsedMenu.CourseColapsedContent a.collapseArrow {
        background: transparent;
    }

    .collapseArrow.collapsed:before {
        color: #99A1AF !important;
    }

    .lectuerSectionContainer .d-flex.justify-content-between div span {
        font-size: 12px !important;
        color: #000 !important;
        font-weight: bold;
    }

        .lectuerSectionContainer .d-flex.justify-content-between div span.ValidationNote {
            display: block;
            text-align: right !important;
            margin: 0 !important;
            color: red !important;
            font-weight: normal;
            font-size: 10px !important;
        }

    .panel-default.lecturePanel.card .card-header {
        background-color: transparent !important;
    }

    .lectuerSectionContainer .panel-group {
        padding: 0 0;
        position: relative;
    }

    input[type="submit"], input[type="button"] {
        padding: 0px 5px;
        height: 40px;
    }

    .CourseColapsedContent {
        background: transparent !important;
        padding: 0 !important;
        border: 0px solid #ccc !important;
        border-radius: 8px !important;
    }

    .lectuerSectionContainer {
        background: #F9FAFB;
        padding: 0;
        border: 1px solid #ccc;
        border-radius: 8px;
        margin-bottom: 10px;
    }

        .lectuerSectionContainer .d-flex.justify-content-between > div {
            background-color: #fff;
            padding: 5px 10px;
            margin-bottom: 10px;
            border-bottom: 1px solid #ddd;
            width: 100%;
        }

    .SearchDIV {
        border-bottom: 1px solid #ddd;
    }

    #ctl00_ctl00_cphPageBody_cphPageBody_UcQuestionBank_upQuestionBank > tr {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #ctl00_ctl00_cphPageBody_cphPageBody_UcQuestionBank_lbtnAddQuestionBank.add-btn-circle {
        position: relative;
        right: 0;
    }

    .TitleWithButtons input[type="submit"], input[type="button"] {
        padding: 0px 30px;
        height: 30px;
        margin-bottom: 10px;
    }

    .TableDatee table tr {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #ctl00_ctl00_cphPageBody_cphPageBody_gvExams td:first-child {
        white-space: normal !important;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    #ctl00_ctl00_cphPageBody_cphPageBody_gvExams td:nth-child(2) {
        white-space: normal !important;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .filter-header .TitleWithButtons {
        justify-content: normal !important;
    }

    .fullSearchAreaBottom .TitleWithButtons #buttons {
        display: flex !important;
        justify-content: center;
        align-items: center;
    }

        .fullSearchAreaBottom .TitleWithButtons #buttons input[type="submit"] {
            padding: 0px 6px;
            height: 30px;
        }

    .Courses-sorting {
        width: 100%;
    }

    .ContainerForTabs .TitleWithButtons {
        justify-content: center;
        flex-direction: column;
        text-align: center;
    }

        .ContainerForTabs .TitleWithButtons #buttons {
            justify-content: center;
            flex-direction: column;
            margin: auto;
            text-align: center !important;
        }

        .ContainerForTabs .TitleWithButtons .TitleStyle {
            justify-content: center;
        }

    .ContentLibraryMgtPadding .TabelGrid {
        border-radius: 16px;
        overflow: visible;
    }

    #gvLibraryGrid #buttons {
        display: flex !important;
        justify-content: center;
    }

    #tblGridviewRow .TitleWithButtons #buttons {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
    }

    #ctl00_ctl00_cphPageBody_cphPageBody_pnlGroups .TitleWithButtons {
        padding: 10px 10px 0 !important;
    }

    .noDataImg {
        width: 100px;
        height: 100px;
    }

    .noData-img-container {
        height: 150px;
        width: 150px;
    }

    .coursesWidget .mCSB_container {
        display: block !important;
    }

    #FolderListContainer {
        margin: 0px 0;
    }

    .btnEdit:before {
        color: #206e87;
    }

    .btnBody:before {
        right: -34px;
        top: 6px;
    }
}


/* مهم للموبايل */
@media (max-width: 768px) {
    .courseContentTabs .nav.nav-tabs {
        display: block;
    }

    .courseContentTabs .nav-tabs > li > a.active {
        color: #ffffff !important;
        background-color: #206e87 !important;
        padding: 3px 10px;
        border-radius: 25px;
        width: fit-content;
        border-bottom: 0 !important;
    }

    .courseContentTabs .nav-tabs > li > a.nav-link.active::before {
        display: none;
    }

    .courseContentTabs .nav.nav-tabs a {
        color: #9f9f9f !important;
        background-color: transparent;
        padding: 5px 10px;
    }

    .TabelGrid {
        display: block;
        overflow-x: auto;
    }

    .wideGridInDiv {
        width: 100% !important;
        overflow-x: auto !important; /* ده اللي هيعمل السكرول */
        -webkit-overflow-scrolling: touch; /* عشان السكرول يكون ناعم على الموبايل */
        margin-bottom: 20px;
    }

    /* 2. الجدول نفسه */
    #ct100_ct100_cphPageBody_cphPageBody_gvAssessments {
        min-width: 800px !important; /* العرض اللي يخلي الداتا مفرودة ومش داخلة في بعضها */
        width: 100% !important;
        table-layout: auto !important; /* بيخلي الأعمدة تاخد مساحتها بناءً على المحتوى */
    }

    /* 3. منع الكلام إنه ينكمش بزيادة داخل الخلايا */
    .TabelGrid td, .TabelGrid th {
        white-space: nowrap !important; /* بيمنع الكلام إنه ينزل سطر جديد ويخلي شكل الجدول وحش */
        padding: 10px !important;
        text-align: center;
    }

        .TabelGrid td span {
            word-break: break-all;
        }

    #ctl00_ctl00_cphPageBody_cphPageBody_gvExams {
        display: table;
    }




    .TitleWithButtons {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
    }

    .TitleStyle {
        width: 44%;
        text-align: right;
    }

    .TitleWithButtons #buttons {
        display: block !important;
        text-align: end;
    }

        .TitleWithButtons #buttons input[type="submit"], input[type="button"] {
            padding: 0px 30px;
            height: 30px;
        }

    .lecturePanel .card-header {
        display: block !important;
    }

        .lecturePanel .card-header span {
            font-size: 12px !important;
            color: #000 !important;
        }

    .lecturePanel {
        background-color: transparent !important;
    }

        .lecturePanel .CollapsItemToolbar {
            display: flex;
            justify-content: space-around;
            margin: 10px 0 0;
            position: relative;
            left: 0;
            top: 0;
        }

    .CollapsItemToolbarBtn {
        min-width: 47% !important;
        height: 35px !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

    .CourseColapsedMenu.CourseColapsedContent a.collapseArrow {
        background: transparent;
    }

    .collapseArrow.collapsed:before {
        color: #99A1AF !important;
    }

    .lectuerSectionContainer .d-flex.justify-content-between div span {
        font-size: 12px !important;
        color: #000 !important;
        font-weight: bold;
    }

        .lectuerSectionContainer .d-flex.justify-content-between div span.ValidationNote {
            display: block;
            text-align: right !important;
            margin: 0 !important;
            color: red !important;
            font-weight: normal;
        }

    .panel-default.lecturePanel.card .card-header {
        background-color: transparent !important;
    }

    .lectuerSectionContainer .panel-group {
        padding: 0 0;
        position: relative;
    }

    .CourseColapsedContent {
        background: transparent !important;
        padding: 0 !important;
        border: 0px solid #ccc !important;
        border-radius: 8px !important;
    }

    .lectuerSectionContainer {
        background: #F9FAFB;
        padding: 0;
        border: 1px solid #ccc;
        border-radius: 8px;
        margin-bottom: 10px;
    }

        .lectuerSectionContainer .d-flex.justify-content-between > div {
            background-color: #fff;
            padding: 5px 10px;
            margin-bottom: 10px;
            border-bottom: 1px solid #ddd;
        }
}



@media(max-width: 540px) {
    #calendar td.fc-header-right {
        display: flex !important;
        justify-content: center;
        align-items: center;
    }
    .lecturePanel .card-header span {
        font-size: 10px !important;
    }
    .courseleftSide div.Course-img {
        width: 100%;
        padding-top: 100%;
    }
}

#ctl00_ctl00_cphPageBody_cphPageBody_ucCourseTemplate_imgCourseImage {
    position: relative;
    top: -35px;
    height: 150px !important;
    width: 150px !important;
}
#ctl00_ctl00_cphPageBody_cphPageBody_tblSearchCriteria .jqTransformCheckboxWrapper + label {
    font-weight: normal !important;
    font-size: 16px !important;
}
input#ctl00_ctl00_cphPageBody_cphPageBody_tbAssessmentTitle {
    font-size: 12px;
}

.postsMainContainer.courseposts > div {
    width: 100% !important;
}
.tabsStyle .nav-tabs {
    background: transparent !important;
}
.tabsStyle .nav-tabs > li > a {
    padding: 0;
    margin: 0 0px 0 30px;
    text-align: right;
}
.writePostWarper {
    border: 1px solid #ddd;
    padding: 25px 10px !important;
    box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.39);
    position: relative;
    background-color: #f8f8f8 !important;
    border-radius: 8px !important;
}
.textPush {
    margin-top: 4px;
}
.FlexSetting {
    position: absolute;
    top: -76px;
    left: 0;
    display: flex;
    align-items: center;
}
#lnkSettings i {
    margin: 0 0px 0 10px;
}
.box.box-warning {
    border-top-color: #2e95b7;
    border-top: 5px solid var(--primary-color) !important;
    border: 1px solid var(--primary-color);
    padding: 5px;
    border-radius: 12px;
}
.postsContainer .btnLike,
postsContainer  .btnLike:hover {
    display: flex !important;
}
.btnLike, .btnLike:hover {
    position: relative;
    border-radius: 16px !important;
    height: auto;
    padding: 9px 35px !important;
    font-style: SemiBold;
    font-size: 16px !important;
    
   
    letter-spacing: 0%;
    display: flex;
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color);
}
    .btnLike::before {
        content: "\f164";
        display: block;
        font-family: FontAwesome !important;
        font-size: 15px;
        font-style: normal;
    }
.likesModal {
    position: relative;
    display: flex;
    direction: rtl;
    justify-content: center;
    align-items: center;
    color: var(--bs-secondary-color) !important;
}
span.lblCounter {
    color: var(--bs-secondary-color) !important;
}
.active a.likesModal {
    position: relative;
    display: flex;
    direction: rtl;
    justify-content: center;
    align-items: center;
    color: var(--bs-secondary-color) !important;
}
.box-footer {
    border-top: 0px solid #f4f4f4 !important;
}
.lnkComment .text-muted {
    position: relative;
    display: flex;
    direction: rtl;
    justify-content: center;
    align-items: center;
    color: var(--bs-secondary-color) !important;
}
.lnkComment .text-muted  a{
    color: var(--bs-secondary-color) !important;
}
.likesModal::before {
    content: "\f164";
    display: block;
    font-family: FontAwesome !important;
    font-size: 15px;
    font-style: normal;
    margin: 0 5px;
}
.lnkComment .text-muted::before {
    content: "\f4ad";
    display: block;
    font-family: FontAwesome !important;
    font-size: 15px;
    font-style: normal;
    margin: 0 5px;
}
.buttonSocial {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #ddd;
    padding-top: 20px;
}
.box-footer.inputSocial .img-push {
    width: 100% ;
}
.inputSocial .btnComment {
    background-color: transparent;
    border: 0;
    box-shadow: 0 0 !important;
    position: absolute !important;
    left: 7px;
    top: 13px;
}
.inputSocial .btn.btnComment:not(.circleBtn) > i::before {
    color: var(--primary-color) !important;
    margin: 0;
    content: "\f1d8" !important;
    font-family: 'FontAwesome' !important;
}
.inputSocial .img-push .input-group input {
    height: 48px !important;
    border-radius: 16px !important;
    background-color: #fff !important;
}
.inputSocial img.img-responsive.img-circle {
    height: 48px !important;
    width: 48px !important;
    margin: 0  0 0 15px ;
}
.lblPostBody {
    margin: 0 20px;
}
.likesModal span {
    color: var(--bs-secondary-color) !important;
}
.FlexSetting .spanText {
    padding-right: 5px !important;
    padding-left: 23px !important;
}
.postsMainContainer.courseposts a.btn-primary {
    background: #206e87 !important;
    color: #fff !important;
    border-radius: 10px;
}
.post-options .float-end {
    float: inline-start !important;
}
.modal-dialog .post-options .float-end {
    float: none !important;
}
    .modal-dialog .post-options .float-end .attachment-upload + a{
        float:left;
    }
    .btnComment {
        background-color: transparent !important;
        border: 0 !important;
        box-shadow: 0 0 !important;
        position: absolute !important;
        top: 28px;
        left: 0;
    }
.btnComment .fa.fa-send {
    position: absolute;
    right: -23px;
    top: -7px;
}
.btn.btnComment:not(.circleBtn) > i::before {
    color: var(--primary-color) !important;
    margin: 0;
    content: "\f1d8" !important;
    font-family: 'FontAwesome' !important;
}
.box-footer .img-push .input-group input {
    height: 48px !important;
    border-radius: 16px !important;
}
.box-footer:not(.box-comments) .img-push {
    width: 100%;
}
.box-footer img {
    height: 48px !important;
    width: 48px !important;
}
.content-home-span {
    max-height: 400px;
    overflow: hidden;
    overflow-y: auto ;
}


#FolderListContainer .content-home-span table tbody tr {
    display: block;
    width: 100%;
}
#FolderListContainer .content-home-span table tbody tr td {
    display: block;
    width: 100%;
    border: 0 ;
}
    #FolderListContainer .content-home-span table tbody {
        display: block;
        width: 100%;
    }
#FolderListContainer .content-home-span table tbody tr td .StandardFontPlain {
    border-bottom: 1px solid #ddd;
    padding: 10px 0;
}



@media (max-width: 478px) {
    #ctl00_ctl00_cphPageBody_cphPageBody_ucCourseTemplate_rblCourseIcons td {
        width: auto !important; 
    }
}
.eduwaveWrapper table td.ui-widget-content {
    width: 16% !important;
}
.fc-first.fc-last {
    display: contents !important;
    width: 100% !important;
}
.eduwaveWrapper .fc-border-separate tbody tr {
    display: table-row !important
}
.CreateImageHotspotQuestionsPadding .TitleWithButtons {
     display: block ;
}

.box.box-widget.latestPostsWidget .post-options.float-end {
    top: 30px !important;
}
.course-dashboard #latestPostsWidget .post-options.float-end {
    top: 20px !important;
}
#ctl00_ctl00_cphPageBody_cphPageBody_ucLibraryViewWidget__ucLearningObjectFolderingWidget_dvFolderMap{
    display: flex;
}
#ctl00_ctl00_cphPageBody_cphPageBody__ucLearningObjectFolderingWidget_dvFolderWedgit{
    text-align: right !important ;
}
#ctl00_ctl00_cphPageBody_cphPageBody_ucLibraryViewWidget__ucLearningObjectFolderingWidget_dvFolderMap a {
    width: auto !important;
}
    .course-dashboard #FolderListContainer .DataListItems .content-home-span {
        max-height: 100% !important;
        overflow: visible !important;
        overflow-y: hidden !important;
    }

#ctl00_ctl00_cphPageBody_cphPageBody_ucLearningStandardItem_gvLearningStandaradItems td:last-child {
/*    width: 10px !important;*/
/*    max-width: 10px;*/
/*    overflow: hidden;*/
}
#ctl00_ctl00_cphPageBody_cphPageBody_ucLearningStandardItem_gvLearningStandaradItems {
    table-layout: fixed;
    width: 100%;
}
    #ctl00_ctl00_cphPageBody_cphPageBody_ucLearningStandardItem_gvLearningStandaradItems td:last-child * {
/*        max-width: 10px;*/
        overflow: hidden;
    }
    #ctl00_ctl00_cphPageBody_cphPageBody_ucLearningStandardItem_gvLearningStandaradItems td:nth-child(2) span {
        display: block;
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.box-footer box-comments .commentsContainer .comment-text .username .text-muted.float-end {
    display: block !important;
    width: 100% !important;
}
.btn.btn-primary.btn-flat.btnComment {
    background-color: transparent !important;
}
#read-post #divContact.box-body .like-controls {
    display: flex;
    order: -1;
}
#read-post #divContact.box-body {
    display: flex;
    justify-content: space-between;
    width: 100%;
}
    #read-post #divContact.box-body .like-controls + .float-end{
        min-width:180px;
        order : 50;
    }

#postsContainer .box-body .btn-xs.btnUnLike {
    border-radius: 16px !important;
}
    #postsContainer .box-body .btn-xs.btnLike,
    #read-post #divContact.box-body .like-controls #divLike .btnLike {
        color: #fff !important;
        display: flex;
        align-items: center;
        background: var(--primary-color);
        padding: 6px 39px !important;
        font-size: var(--font-12, 12px) !important;
    }
    #read-post #divContact.box-body .like-controls #divLike .btn-xs.btnLike:hover,
    #read-post #divContact.box-body .like-controls #divLike .btn-xs.btnLike {
        padding: 6px 39px !important;
        font-size: var(--font-12, 12px) !important;
    }
 #read-post .box-footer:not(.box-comments) .img-push{
     width: calc(100% - 40px);
 }
#read-post .box-footer .btnComment .fa.fa-send{
    right:30px !important;
}
 .box-footer .btnComment{
    z-index:55;
}
 .box-footer .img-push .input-group input{
    padding-left: 55px !important;
}
#read-post .box-comments .comment-text {
    overflow-wrap:anywhere;
}


#read-post .box-comments .box-comment{
    background: transparent;
}


/*.dropdown-list {
    background-color: #fff;
    padding: 5px;
}
*/
.AssesQuesDesc ul li {
    list-style-type: disc !important;
    direction: rtl;
}


.ShowPriorityHeader {
    display: flex;
    width: 100%;
    justify-content: space-between;
}
#show-settings.show {
    height: 100% !important;
}
.postsContainer .box-header > .box-tools {
    display: flex;
    align-items: center;
}
.postsContainer .box-header > .box-tools  .dropdown-menu > li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #555;
       
    line-height: 1.5em;
    padding: 9px;
    /* border-right: 4px solid #ffffff; */
    position: relative;
}
.float-end span.jqTransformCheckboxWrapper
.ShowPriorityHeader span.jqTransformCheckboxWrapper {
    float: right !important;
}
#divCourseHomeContent .styleTableResponsivvE table td:empty {
    display: none;
}

#Pf9b1ef1919b6417b9bde41d565310204_1_oReportDiv {
    direction: rtl !important;
}

#divCourseHomeContent .styleTableResponsivvE table {
    direction: rtl !important;
}

#divCourseHomeContent .styleTableResponsivvE [style] {
    color: inherit !important;
    background: inherit !important;
    font-size: inherit !important;
    font-family: inherit !important;
    table-layout: inherit !important;
    width: inherit !important;
    height: inherit !important;
    font-style: inherit !important;
}
.postsContainer.post_comment .commentsContainer {
    max-height: 500px;
    overflow: hidden;
    overflow-y: auto;
    padding: 0 20px;
}

#read-post .modal-content .btn, #read-post .modal-content .btn:hover {
    padding: 10px 39px !important;
    border-radius: 0px !important;
    border-radius: 50px !important;
    background: transparent;
    color: #ffffff !important;
    border: 1px solid;
    display: flex;
}
#read-post .modal-content:empty {
    display: none;
}
.navbar-expand-lg .navbar-nav .dropdown-menu {
    position: absolute;
    left: 0;
    right: auto;
}
@media(max-width:478px) {
    .eduwaveWrapper #divCourseHomeContent .styleTableResponsivvE table td {
        width: auto !important;
        display: table-cell !important;
    }
}
.dropdown-menu.itg_dashboard_dropdown-menu ul[id*="New_HeaderMenu"] div#mCSB_6_container {
    display:flex;
}