:root {
    --color-orange      : #FAA61A;
    --color-skyblue     : #1DA8E0;
    --color-hotpink     : #EC168F;
    --color-asdagreen   : #90C53F;
    --color-text-main   : #3C3C3C;
    --color-cancel      : #AAAAAA;
    --color-disabled    : #E3E3E3;
    --color-lg1         : #90C540;
    --color-lg2         : #EC168F;
    --color-lg3         : #EBD71D;
    --color-lg4         : #1DA8E0;
    --color-lg5         : #FAA61A;
}
body[class*="education-"]{
    background: transparent linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 68%, #D4EEF9 100%) 0% 0% no-repeat padding-box;
}
body[class*="education-"] .wrapper_footer {
  margin-top:-50px!important
}
body[class*="education-"] #web_menu .sidebarIconToggle{
    top:6px;
}
body[class*="education-"] #web_menu .sidebarIconToggle{
    top:6px;
}
body[class*="education-"] #mobile_menu label.sidebarIconToggle{
    right:unset;
    left:0;
    position:unset;
    margin: 20px 16px 0 0;
}
body[class*="education-"] #mobile_menu .icon-menu-wrapper{
    position: absolute;
    right: 0;
    top:0;
}
body[class*="education-"] #mobile_menu .icon-menu-wrapper .notification-wrapper{
    margin: 17px 0 0 0;
}
.top_menu .notification-wrapper{
    position:relative;
    line-height: 15px;
    cursor:pointer;
}
.top_menu .notification-icon {
    background-image: url(../images/bell-small.png);
    background-repeat: no-repeat;
    background-size: 55%;
    background-position: center center;
    display: inline-block;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: var(--color-lg4);
}
.top_menu .notification-count{
    position: absolute;
    top: -5px;
    right: -5px;
    background: var(--color-lg2);
    color:#FFF;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 12px;
}
.top_menu .notification-count:empty {
    display: none;
}
.menu-dropdown-icon-wrapper .sidebarIconToggle{
    top:0!important;
}
.menu-dropdown-icon-wrapper{
    position:relative;
    width:27px;
    height:27px;
}
.menu-dropdown-icon-wrapper input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-1{
    margin-top:10px;
}
.menu-dropdown-icon-wrapper input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-2{
    margin-top:-16px;
}
.weglot-container.wg-default{
    display:none;
}
hr.popup-hr{
    border-top: 2px solid #B8B8B8;
}
input[type="checkbox"].ct-design,
input[type="radio"].ct-design{
    display: none;
}
.label-checkbox {
    margin-bottom: 5px;
    font-size: .8rem;
    position: relative;
    padding-left: 25px;
    cursor: pointer;
}
.label-checkbox::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background-color: #E3E3E3;
    box-sizing: border-box;
    transition: background-color 0.3s, border-color 0.3s;
    border-radius: 4px;
}
.label-checkbox.chk-circle::before{
    width: 15px;
    height: 15px;
    border-radius: 15px;
}

#lightview.lightview-loading-wrapper .lv_WrapUp,
#lightview.lightview-loading-wrapper.opening .lv_Loading{
    display:none!important;
}
#lightview.lightview-loading-wrapper .lv_Loading{
    display:unset!important;
}
.edu-popup{
    background: #FFF;
    padding: 20px 30px;
    box-shadow: 0px 3px 6px #00000029;
    background-color: #ffffff;
    border: 1px solid #e9ecef !important;
    border-radius: 0.5rem;
}
.icon.hint{
    font-size:1.5rem;
    font-weight:bold;
    width: 35px;
    height: 35px;
    border: 3px solid #FFF;
    line-height: 32px;
    color: #FFF;
    text-align: center;
    border-radius: 35px;
    cursor:pointer;
}
.icon.hint.color-lg5{
    border-color: var(--color-lg5);
    color: var(--color-lg5);
}
.circle{
    width: 15px;
    height: 15px;
    display: inline-block;
    background: #ccc;
    border-radius: 50%;
}
.circle.color-disabled{
    background:var(--color-disabled);
}
.circle.color-lg1{
    background:var(--color-lg1);
}
.circle.color-lg2{
    background:var(--color-lg2);
}
.circle.color-lg3{
    background:var(--color-lg3);
}
.circle.color-lg4{
    background:var(--color-lg4);
}
.circle.color-lg5{
    background:var(--color-lg5);
}
.bg-color-disabled{
    background: var(--color-disabled)!important;
}
.no-click{
    pointer-events: none;
}
/* lightview */
div.lv_Container ul li div.border-right,
div.lv_Container div.border-right{
    border-right: 2px solid #B8B8B8 !important;
}
.top_menu #web_menu #sidebarSearch {
    position: absolute;
    right: 85px;
    top: 50%;
    transform: translateY(-50%);
}
.top_menu #web_menu #sidebarSearch.sidebar-search-edu{
    right:92px;
}
.top_menu #web_menu #sidebarSearch.sidebar-search-edu input#search{
    width:180px;
}
.sidebarMenusearch{
    position: relative;
    cursor: pointer;
}
.success-msg {
    background: #dff0d8;
    border: 1px solid #d6e9c6;
    color: #3c763d;
    padding: 10px;
    margin: 10px 0;
}
.error-msg {
    background: #f2dede;
    border: 1px solid #ebccd1;
    color: #a94442;
    padding: 10px;
}
body[class*="education-"] .content-wrapper{
    padding: 40px 10% 80px 10%;
}
form.form-edu input{
    border: 1px solid #b6b6b6;
    padding: 8px;
    border-radius: 5px;
    width: 100% !important;
    font-size: 13px;
}

form.form-edu .fixed-width{
    width:100px;
}
form.form-edu .row{
    margin-left:0;
    margin-right:0;
}
form.form-edu .input-field{
    margin-bottom:10px;
}
.validation-advice{
    margin:5px 0 0 10px;
}
body.education-teacher-addstudents .container{
    margin-top:20px;
}
body.education-teacher-addstudents .container #import-students-btn{
    color:#FFF;
}
.top_menu.education-header{
    -webkit-box-shadow: 0px 5px 10px #e8e8e8;
    -moz-box-shadow: 0px 5px 10px #e8e8e8;
    box-shadow: 0 5px 10px #e8e8e8;

}
.top_menu.education-header img.logo-img{
    max-width:100%;
    width:150px;
    padding:10px 0;
}
.curriucla-btn.button, 
.cartoons-btn.button,
.myclassroom-btn.button,
.sssessments-btn.button,
.learnmore-btn.button{
    padding: 10px 20px;
    color:#FFF;
    font-weight:bold;
    text-decoration:none;
    text-transform:uppercase;
    border-radius:15px;
    min-width:160px;
    display:inline-block;
    background-color: #AAAAAA;
}
.curriucla-btn.button.active,
.curriucla-btn:hover,
.curriucla-btn:active{
    background-color:#EC168F;
}
.cartoons-btn.button.active,
.cartoons-btn:hover,
.cartoons-btn:active{
    background-color:#1DA8E0;
}
.myclassroom-btn.button.active,
.myclassroom-btn:hover,
.myclassroom-btn:active{
    background-color:#FAA61A;
}
.sssessments-btn.button.active,
.sssessments-btn:hover,
.sssessments-btn:active{
    background-color:#90C540;
}
.learnmore-btn.button.active,
.learnmore-btn:hover,
.learnmore-btn:active{
    background-color:#EBD71D;
}
body.education-teacher-index div#header-carousel {
    background-image: url(../images/portal/Banner-Image@2x.webp);
    min-height: 500px;
    background-size: cover;
    background-position: center;
}
.no-wrap {
  white-space: nowrap;
}

.cartoons-btn{
    z-index: 9;
    position: relative;
}
.top_menu .sidebarMenuInner-top_menu h6{
    font-size:12px;
}
.sidebarMenuInner-top_menu {
    position: absolute;
    display: none;
    background: #fff;
    z-index: 999;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    box-shadow: 0px 2px 3px 0px rgb(204 204 204);
}

.sidebarMenuInner-top_menu ul {
    list-style: none;
    margin: 0;
    padding: 5px 0;
}

.sidebarMenuInner-top_menu li {
    padding: 5px 10px;
    cursor: pointer;
}

.sidebarMenuInner-top_menu li:hover {
    background: #f2f2f2;
}
.active .diagonal.part-1{
    transition: all 0.3s;
    box-sizing: border-box;
    transform: rotate(135deg);
    margin-top: 14px;
}
.active .horizontal {
    transition: all 0.3s;
    box-sizing: border-box;
    opacity: 0;
}
.active .diagonal.part-2 {
    transition: all 0.3s;
    box-sizing: border-box;
    transform: rotate(-135deg);
    margin-top: -15px;
}
.headline {
    width: 100%;
    color: #FFF;
}
.headline .head-icon{
    width:40px;
    padding: 0 11px;
    margin-left: 10px;
    display: flex;
    align-items: center;
    font-size: 16px;
    border-radius: 15px;
}
.headline .head-icon.active i{
    font-size: 1.7rem;
}
.headline.bg-asdagreen .title, 
.headline.bg-asdagreen .icon {
    background: var(--color-asdagreen);
}
.section .headline .title {
    font-size: 1.5rem;
    font-weight: bold;
    text-transform:uppercase;
    padding: 2px 20px;
}
.headline .title, .headline .icon {
    border-radius: 15px;
}
.headline.bg-orange .title, .headline.bg-orange .icon {
    background: var(--color-orange);
}
.section.assessments .row.box {
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 20px;
}
.section.assessments .row.box .border-left, .section.assessments .row.box .border-right {
    border-width: 2px !important;
    border-color: #707070 !important;
}
.section.assessments .subtitle {
    font-size: 1.1rem;
    font-weight: bold;
}
a.btn-edu, button.btn-edu {
    background: #8CC641;
    color: #FFF;
    border-radius: 20px;
    padding: 5px 30px;
    text-decoration: none;
    font-weight: bold;
    display: inline-block;
    text-align: center;
}

body.education-teacher-addclass .content-wrapper .form-wrapper{
    max-width:400px;
    margin:0 auto;
}
button.btn-primary.btn-edu{
    color: #fff;
    background-color: #ED6436;
    border-color: #ED6436;
}
.btn-cancel.btn-edu{
    background-color: #AAAAAA;
    border-color: #AAAAAA;
}
a.btn-edu.no {
    background: #AAAAAA;
}
.bg-color-cancel{
    background-color: var(--color-cancel)!important;
}
.bg-color-lg1 {
    background-color: var(--color-lg1)!important;
}
.bg-color-lg2 {
    background-color: var(--color-lg2)!important;
}
.bg-color-lg3 {
    background-color: var(--color-lg3)!important;
}
.bg-color-lg4 {
    background-color: var(--color-lg4)!important;
}
.bg-color-lg5 {
    background-color: var(--color-lg5)!important;
}
.edu-lightview .lv_topButtons{
    overflow:unset!important;
    top: -12px!important;
}
.edu-lightview .lv_Center .lv_Button.lv_Close{
    display:none;
}
.edu-lightview .lv_topButtons .lv_topcloseButtonImage{
    margin-top:unset!important;
    margin-right: -25px;
}

.edu-lightview .lv_topButtons .lv_topcloseButtonImage .lv_Button{
    background-image: url(../images/close.webp)!important;
    background-size: contain !important;
    width: 25px!important;
    height: 25px!important;
}

.top_menu_no_search .sidebarIconToggle,
.top_menu_with_search .sidebarIconToggle{
    position:unset;
    margin:unset;
}
.top_menu_with_search .top_right_icons_wrapper{
    padding-left:0;
}
.top_menu_no_search .top_right_icons_wrapper{
    text-align:right!important;
}
.top_menu_no_search .top_right_icons_wrapper #sidebarMenu,
.top_menu_with_search .top_right_icons_wrapper #sidebarMenu{
    text-align:center!important;
}
.top_menu_no_search .top_right_icons_wrapper .sidebarIconToggle.active .diagonal.part-1,
.top_menu_with_search .top_right_icons_wrapper .sidebarIconToggle.active .diagonal.part-1{
    margin-top: 10px;
}
.top_menu_no_search .top_right_icons_wrapper .sidebarIconToggle.active .diagonal.part-2,
.top_menu_with_search .top_right_icons_wrapper .sidebarIconToggle.active .diagonal.part-2{
    margin-top: -16px;
}
.top_menu_with_search #web_menu #sidebarMenusearch{
    z-index:10;
}
.top_menu_with_search #web_menu #sidebarSearch{
    position: absolute;
    right: 50px;
    top: 50%;
    transform: translateY(-50%);
    padding: 15px 0px;
    box-shadow: 0px 3px 6px #00000029;
    background: #FFF;
    width: 225px;
    z-index: 9;
    border-radius: 0.5rem;
}
.top_menu_with_search #web_menu #sidebarSearch input#search{
    width:160px;
    margin-left:10px;
    padding: 5px 10px;
}
@media (max-width: 1200px) {
    .top_btns_wrapper a.btn-edu{
        font-size:.8rem;
        padding:10px 0;
        min-width: 120px;
    }
}
@media (max-width: 1100px) {
    .top_menu_no_search .top_btns_wrapper a.btn-edu{
        font-size:.8rem;
        padding:10px 0;
        min-width: 120px;
    }
}

@media (max-width: 991px) {
    .top_menu_no_search #web_menu,
    .top_menu_with_search #web_menu{
        display: flex!important;
    }
    .top_menu_with_search #web_menu #sidebarMenusearch{
        padding:12px!important;
    }
    .top_menu_with_search #web_menu #sidebarSearch input#search{
        width:160px!important;
    }
}
@media (max-width: 890px) {
    .top_menu_no_search,
    .top_menu_no_search #web_menu{
        padding:0!important;
    }
    .top_menu_no_search .navbar-brand{
        margin-right:0;
    }
    .top_menu_no_search .logo_wrapper{
        padding-right:0!important;
    }
    .top_menu.education-header .top_btns_wrapper a.btn-edu {
        font-size: .7rem;
        min-width: 105px;
    }
}
@media (max-width: 768px) {
    .top_menu_no_search{
        padding-bottom:20px!important;
    }
    .logo_wrapper{
        order:1;
        padding-left: 15px;
        text-align: left;
        flex: 0 0 calc(50% - 15px);
        max-width: unset;
    }
    .top_btns_wrapper{
        order:3;
        max-width:unset;
        flex: 0 0 100%;
        margin-bottom:20px;
    }
    .top_right_icons_wrapper{
        order:2;
        max-width:unset;
        justify-content:right!important;
        padding-right: 15px !important;
        flex: 0 0 calc(50% - 15px);
    }
    .logo_wrapper a{
        margin-right:0;
    }
    #web_menu{
        justify-content: space-between !important;
    }
    .top_btns_wrapper a.btn-edu{
        width:100%;
    }
    body[class*="education-"] #lightview {
        width: 100% !important;
        height: 320px !important;
    }
    div.lv_Container ul li .lv_contentBottom {
        width: 100% !important;
        overflow: hidden !important;
        height: 320px !important;
    }
    div.lv_Container ul li .lv_contentBottom div {
        width: 100% !important;
    }
    div.lv_Container ul li .lv_contentBottom .display {
        left: 65px !important;
        top: 35px !important;
    }
    div.lv_Container ul li {
        height: 350px !important;
    }
    body[class*="education-"] .lv_Close {
        right: 0px !important;
    }
    .edu-lightview .lv_Center .lv_Button.lv_Close{
        display:block;
    }
}
@media (max-width: 615px) {
        .top_menu.education-header .top_btns_wrapper a.btn-edu{
        min-width: unset;
        padding: 10px 15px;
    }
}
@media (max-width: 576px) {
    .top_menu.education-header .top_btns_wrapper .top_btns_wrapper{
        max-width:unset;
        padding:0;
    }
}

@media (max-width: 530px) {
    .top_menu.education-header .top_btns_wrapper .top_btns_wrapper{
        max-width:unset;
        padding:0;
    }
    
    .top_btns_wrapper .d-flex.flex-nowrap {
        flex-wrap: wrap !important;
        justify-content: center;
    }

    .top_btns_wrapper  .d-flex.flex-nowrap > .flex-fill {
        flex: 0 0 calc(29% + 10px) !important;
        max-width: calc(29% + 10px);
    }
    .top_btns_wrapper .d-flex.flex-nowrap > .flex-fill:nth-child(-n+3) {
        margin-bottom: 10px;
    }
    .top_btns_wrapper .d-flex.flex-nowrap > .flex-fill:nth-child(3) {
        margin-right:0!important;
    }
    .top_btns_wrapper .d-flex.flex-nowrap > .flex-fill:nth-child(4),
    .top_btns_wrapper .d-flex.flex-nowrap > .flex-fill:nth-child(5)    {
        margin-right:0!important;
    }
    
}
@media (max-width: 450px) {
    div.lv_Container {
        width: 100% !important;
        height: 250px !important;
    }
    div.lv_Container ul li .lv_contentBottom {
        width: 100% !important;
        overflow: hidden !important;
        height: 250px !important;
    }
    div.lv_Container ul li .lv_contentBottom .bg_language {
        width: 100% !important;
        height: 250px !important;
        background-position: center center !important;
        background-size: 395px !important;
    }
    div.lv_Container ul li .lv_contentBottom div {
        width: 100% !important;
    }
    div.lv_Container ul li .lv_contentBottom video {
        width: 100% !important;
        height: 250px !important;
        height: auto !important;
    }
}
@media (max-width: 400px) {
    .top_btns_wrapper  .d-flex.flex-nowrap > .flex-fill {
        max-width:unset;
        width:100%;
        flex: 0 0 100% !important;
    }
    .top_btns_wrapper .d-flex.flex-nowrap > .flex-fill{
        margin-bottom: 10px!important;
        margin-right:0!important;;
    }
    .top_menu.education-header .top_btns_wrapper a.btn-edu{
        padding: 10px 20px;
        min-width: 160px;
    }
}