body{background: #011931;background-image: -o-linear-gradient(top, #011931, #011F3F);background-image: -webkit-gradient(linear, left top, left bottom, from(#011931), to(#011F3F));background-image: linear-gradient(to bottom, #011931, #011F3F);}

/* header */
header .media .avatar{width: 45px;}
header .media{cursor: pointer;}
header .navbar-brand img{width: 115px;}
header .navbar-nav .nav-item a{color: #fff !important;cursor: pointer;position: relative;}
header .navbar-nav .nav-item a:hover{color: #F25A29 !important;}
header .navbar-nav .nav-item a.active{color: #F25A29 !important;}
header .navbar-nav .line{height: 43px;width: 3px;background: #fff;border-radius: 2px;}
header .navbar-nav .fingerprint{width: 45px;}
header .nav-portal{padding-bottom: 4px;border-bottom: 3px solid #f1592a;margin-left: 10%;}
header .nav-portal .nav-item .active:before{content:"";position: absolute;height: 8px;border-radius: 3px;margin-left: -4px;margin-right: -4px;width: -webkit-fill-available;background: #f1592a;bottom: -9px;left: 0;}
header .nav-portal .dropdown-item:hover,
header .nav-portal .dropdown-item:focus{background: #011831;outline: 0;}
header .nav-portal .dropdown-item:hover a{color:#fff!important;}
header .notification-layer .media span{background: #6bbd1b;position: absolute;top: 3px;right: 19px;width: 6px;height: 6px;border-radius: 25px;}
header .notification-layer .media img{width: 25px;}
header .notification-menu{top: 2rem;background: #001831;padding: 0;min-width: 20em;}
header .notification-menu .notification-content{max-height: 360px;overflow-y: scroll;}
header .notification-menu .notification-content .notification-item hr{background: #e05629;border-top: 3px solid rgba(0,0,0,.1);margin-top: 1rem;margin-bottom: 0;}
header .notification-menu .notification-content::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);box-shadow: inset 0 0 6px rgba(0,0,0,0.3);border-radius: 5px;background-color: #03253c;}
header .notification-menu .notification-content::-webkit-scrollbar{width: 5px;background-color: #03253c;}
header .notification-menu .notification-content::-webkit-scrollbar-thumb{border-radius: 2px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #ec5929;}
header .portal-login-menu .dropdown-item:hover,
header .portal-login-menu .dropdown-item:focus{background: #011831;color: #F25A29 !important;outline: 0;}
header .portal-activity-menu.dropdown-menu-right{top: 51px;background: #011932;}
header .portal-activity-menu h4{font-size:20px;background: #052f4c;}
header .portal-activity-menu .activity-chart{max-height: 290px;overflow-y: scroll;}
header .portal-activity-menu .activity-chart::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);box-shadow: inset 0 0 6px rgba(0,0,0,0.3);border-radius: 5px;background-color: #03253c;}
header .portal-activity-menu .activity-chart::-webkit-scrollbar{width: 8px;background-color: #03253c;}
header .portal-activity-menu .activity-chart::-webkit-scrollbar-thumb{border-radius: 5px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #ec5929;}
header .portal-activity-menu .activity-chart-item:last-child{padding-bottom: 0!important;}
header .portal-activity-menu .activity-chart-item .activity-icon:before{content:"";position: absolute;bottom: -18px;left: 50%;height: 22px;width: 2px;background: #fff;}
header .portal-activity-menu .activity-chart-item:last-child .activity-icon:before{display:none;}
header .portal-activity-menu .activity-chart-item .activity-icon{position:relative;}
header .portal-activity-menu .activity-chart-item .activity-icon img{height: 40px;}
header .search-layer .media img{width: 25px;}
header .search-layer .search-menu input{color: #f1592a;font-size: 15px;font-weight: 700;}
header .search-layer .search-menu{top: 2rem;width: 220px;padding: 4px 5px;}
header .search-layer .search-menu input:focus{background: transparent;}
header .search-layer .search-menu input::-webkit-input-placeholder{color:#fff;font-weight: 400;}
header .search-layer .search-menu input::-moz-placeholder{color:#fff;font-weight: 400;}
header .support-layer .media img{width: 25px;}

/* main */
main.landing{position: relative;}
main.landing:before{content: "";position: absolute;background: url(../images/w-star.png);top: -90px;right: 0;width: 60%;height: 41%;z-index: -1;background-size: contain;background-repeat: no-repeat;}
main .activity-scrollbar{overflow-y: scroll;}
main .activity-chart-item .activity-icon:after{content:"";position: absolute;bottom: -40px;left: 50%;height: 8px;width: 2px;background: #fff;}
main .activity-chart-item .activity-icon:before{content:"";position: absolute;bottom: -23px;left: 50%;height: 29px;width: 2px;background: #fff;}
main .activity-chart-item .activity-icon{position:relative;}
main .activity-chart-item .activity-icon img{height: 40px;}
main .active-user .circle span{background: #db3d09;width: 95px;height: 95px;border: 10px solid #ec5929;-webkit-animation: pulseG 1.5s ease-in-out 1s infinite;animation: pulseG 1.5s ease-in-out 1s infinite;}
main .accordion-list-layer{background: #011427;}
main .accordion-list-layer .list-card{background: #011931;}
main .accordion-list-layer .title{background: #011427;cursor: pointer;position: relative;}
main .accordion-list-layer .title:not(.collapsed):after{content: "";position: absolute;background: url(../images/right-arrow-b.png);width: 27px;height: 17px;background-size: cover;top: 7px;right: 0;-webkit-transform: rotate(270deg);-ms-transform: rotate(270deg);transform: rotate(270deg);}
main .accordion-list-layer .title.collapsed::after{content:"";position: absolute;background: url(../images/right-arrow-b.png);width: 27px;height: 17px;background-size: cover;top: 7px;right: 0;}
main .accordion-list-layer .collapsing{position: relative;height: 0;overflow: hidden;-webkit-transition: height .65s ease;-o-transition: height .65s ease;transition: height .65s ease;}
main .animate-color-t,
main .animate-color-g{position: relative;border: 0;}
main .animate-color-t:before,
main .animate-color-g:before{content:"";position: absolute;width: 1%;height: 100%;border-radius: 9px;top: 0;left: 0;-webkit-transition: all .6s ease;-o-transition: all .6s ease;transition: all .6s ease;}
main .animate-color-t:hover:before{width: 100%;background: #f1592a;}
main .animate-color-g:hover:before{width: 100%;background: #489404;}
main .animate-color-t span,
main .animate-color-g span{position: relative;z-index: 9;}
main .appointment-item{position: relative;cursor: pointer;padding: 0 1em;border-bottom-width: 2px !important;}
main .appointment-item:hover{background: #082644;}
main .appointment-item:after{content:"";position: absolute;background: url(../images/right-arrow-b.png);width: 27px;height: 17px;background-size: cover;top: 45%;right: 0;-webkit-transform: rotate(270deg);-ms-transform: rotate(270deg);transform: rotate(270deg);}
main .appointment-item .lesson{width: 150px;}
main .appointment-item .teacher{width: 220px;}
main .appointment-item:last-child{border-bottom: 0!important;}
main .datepicker-container{width: auto;font-family: Nunito;font-size: 15px;background: transparent;}
main .datepicker-panel>ul>li{width: 50px;background-color: transparent;}
main .datepicker-panel>ul>li.picked{color: #fff;background: #e05629 !important;}
main .datepicker-panel>ul>li.picked:hover{background-color: #f1592b;color: #fff;}
main .datepicker-panel ul:first-child li:nth-child(1):hover{color: #e05629}
main .datepicker-panel ul:first-child li:nth-child(2):hover{color: #e05629}
main .datepicker-panel ul:first-child li:nth-child(3):hover{color: #e05629}
main .datepicker-panel [data-view*='week']{display: none;}
main .datepicker-panel [data-view*='week'] li:hover{background-color: #052f4c;cursor: pointer;}
main .datepicker-panel [data-view*='days'] li{background: #fff;width: 41px;height: 39px;padding: 4px;margin: 8px;border-radius: 50%;}
main .datepicker-panel [data-view*='days'] li.picked:hover{color:#fff;}
main .datepicker-panel [data-view*='days'] li:hover{color:#000;}
main .datepicker-panel [data-view*='days'] li.muted{background: transparent;color: #74818e;}
main .datepicker-panel [data-view*='month'] li{background: #fff;padding: 0px;margin: 8px;border-radius: 50%;}
main .datepicker-panel [data-view*='year'] li{background: #fff;padding: 0px;margin: 8px;border-radius: 50%;}
main .datepicker-panel:nth-child(1) ul:first-child{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;font-size: 18px;padding-bottom: 1em;width: 100%;}
main .datepicker-panel:nth-child(1) ul:first-child li{width: inherit;font-size: 18px;color: #fff;}
main .datepicker-panel:nth-child(1) ul:first-child .disabled{background-color: transparent;}
main .datepicker-panel:nth-child(1) ul:first-child li:hover{color:#e05629;background: transparent;}
main .datepicker-panel:nth-child(1) ul:first-child li:nth-child(1){text-align: left;font-size: 40px;}
main .datepicker-panel:nth-child(1) ul:first-child li:nth-child(3){text-align: right;font-size: 40px;}
main .datepicker-panel:nth-child(2) ul:first-child{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;font-size: 18px;padding-bottom: 1em;width: 100%;}
main .datepicker-panel:nth-child(2) ul:first-child li{width: inherit;font-size: 18px;color: #fff;}
main .datepicker-panel:nth-child(2) ul:first-child li:hover{color:#e05629;background: transparent;}
main .datepicker-panel:nth-child(2) ul:first-child li:nth-child(1){text-align: left;font-size: 40px;}
main .datepicker-panel:nth-child(2) ul:first-child li:nth-child(3){text-align: right;font-size: 40px;}
main .datepicker-panel:nth-child(3) ul:first-child{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;font-size: 18px;padding-bottom: 1em;width: 100%;}
main .datepicker-panel:nth-child(3) ul:first-child li{width: inherit;font-size: 18px;color: #fff;}
main .datepicker-panel:nth-child(3) ul:first-child li:hover{color:#e05629;background: transparent;}
main .datepicker-panel:nth-child(3) ul:first-child li:nth-child(1){text-align: left;font-size: 40px;}
main .datepicker-panel:nth-child(3) ul:first-child li:nth-child(3){text-align: right;font-size: 40px;}
main .c-back{width: 15px;}
main .c-close{width: 20px;}
main .card-suggestion.c-orange{background: #ec5929;}
main .card-suggestion.c-orange h5,
main .card-suggestion.c-orange .video{background: #dd4717;}
main .card-suggestion.c-purple{background: #8d29c3;}
main .card-suggestion.c-purple h5,
main .card-suggestion.c-purple .video{background: #7117a2;}
main .card-suggestion.c-red{background: #ab1414;}
main .card-suggestion.c-red h5,
main .card-suggestion.c-red .video{background: #630505;}
main .card-suggestion.c-blue{background: #29b7ec;}
main .card-suggestion.c-blue h5,
main .card-suggestion.c-blue .video{background: #1288b4;}
main .card-suggestion .video{border-radius: 10px;}
main .card-suggestion .video img{width: 60px;margin-top: 15px;margin-bottom: 5px;}
main .comment-field{background: #001931;}
main .comment-field .comment-field-layer{max-height: 350px;overflow-y: scroll;}
main .comment-field .comment-field-layer::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);box-shadow: inset 0 0 6px rgba(0,0,0,0.3);border-radius: 5px;background-color: #03253c;}
main .comment-field .comment-field-layer::-webkit-scrollbar{width: 8px;background-color: #03253c;}
main .comment-field .comment-field-layer::-webkit-scrollbar-thumb{border-radius: 5px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #ec5929;}
main .comment-field .comment-field-layer .comment-field-item{background: #011324;position: relative;}
main .comment-field .comment-field-layer .comment-field-item .user-layer img{width: 20px;}
main .comment-field .comment-field-layer .comment-field-item.right:before{display: none;}
main .comment-field .comment-field-layer .comment-field-item .collapse-arrow{position: relative;margin-top: 10px;cursor: pointer;}
main .comment-field .comment-field-layer .comment-field-item .collapse-arrow img{width: 23px;}
main .comment-field .comment-field-layer .comment-field-item .collapse-arrow.collapsed{-webkit-transform: rotate(270deg);-ms-transform: rotate(270deg);transform: rotate(270deg);}
main .comment-field .comment-field-layer .collapsing{position: relative;height: 0;overflow: hidden;-webkit-transition: height .65s ease;-o-transition: height .65s ease;transition: height .65s ease;}
main .comment-field .comment-field-layer .comment-field-item.b-gray{position:relative;background: #1a2b3b;}
main .comment-field .comment-field-layer .comment-field-item.b-gray:before{content: "";position: absolute;background: url(../images/exchange.png);width: 15px;height: 13px;top: 0;left: -24px;}
main .comment-field .comment-field-layer .comment-field-item .username{color: #ed8012;}
main .comment-field .message-field{position: relative;}
main .comment-field .message-field input{background: transparent;border: 0;color: #fff;padding-right: 60px;}
main .comment-field .message-field button{position: absolute;right: 0;top: 0;}
main .comment-field .message-field button img{width: 26px;}
main .comment-field .message-field input::-webkit-input-placeholder{color:#fff;font-weight: 400;}
main .comment-field .message-field input::-moz-placeholder{color:#fff;font-weight: 400;}
main .comment-field .message-field input:-ms-input-placeholder{color:#fff;font-weight: 400;}
main .comment-field .message-field input::-ms-input-placeholder{color:#fff;font-weight: 400;}
main .comment-field .message-field input::placeholder{color:#fff;font-weight: 400;}
main .custom-select::-webkit-input-placeholder{color: #606a74;font-weight: 600;background: url(../images/select-i.png) no-repeat right .75rem center/8px 10px;}
main .custom-select::-moz-placeholder{color: #606a74;font-weight: 600;background: url(../images/select-i.png) no-repeat right .75rem center/8px 10px;}
main .custom-select:-ms-input-placeholder{color: #606a74;font-weight: 600;background: url(../images/select-i.png) no-repeat right .75rem center/8px 10px;}
main .custom-select::-ms-input-placeholder{color: #606a74;font-weight: 600;background: url(../images/select-i.png) no-repeat right .75rem center/8px 10px;}
main .custom-select::placeholder,
main .custom-select{color: #606a74;font-weight: 600;background: url(../images/select-i.png) no-repeat right .75rem center/8px 10px;}
main .custom-select:focus{color:#EC5A29;}
main .custom-section-area .custom-control-label{border: 3px solid #021d36;cursor: pointer;}
main .custom-section-area .custom-control-label:hover{border: 3px solid #f1592a9e;}
main .custom-section-area .custom-control-input:checked ~ .custom-control-label{border: 3px solid #f1592a;}
main .custom-section-area .custom-control-label::before,
main .custom-section-area .custom-control-label::after{display: none;}
main .circle-progress-bar{width: 100%;position: relative;}
main .circle-progress-bar svg {height: 100%;width: 100%;fill: none;stroke-width: 20px;stroke-linecap: round;}
main .circle-progress-bar .text{position: absolute;left: 52%;top: 52%;padding: 0px;margin: 0px;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);color: #aa31e8;font-size: 30px;font-weight: 600;font-family: Nunito;}
main .circle-progress-bar .fill-layer{stroke: #fff;stroke-width: 10px;fill-opacity: 0;}
main .circle-progress-bar .stroke-layer{stroke-dasharray: 301.635, 301.635;stroke-width: 11px;fill-opacity: 0;}
main .daily-time{border-right: 2px solid #ffffff80;}
main .daily-time canvas{width: 210px;margin: 0 auto;}
main .digital-optics{border-radius: .25rem .25rem 0 0;}
main .digital-optic-list{border-radius: 0 0 .25rem .25rem;max-height: 390px;overflow-y: auto;}
main .digital-optic-list .table tr td{padding: 5px 11px;}
main .digital-optic-list .table tr td:nth-child(n+2):nth-child(-n+6){position: relative;width: 50px;text-align: center;}
main .digital-optic-list .table tr td .selected{position: absolute;top: 4px;left: 17px;width: 25px;height: 25px;border: 1px solid #312783;border-radius: 50%;}
main .digital-optic-list .table .active-question{background: #e9e9e9;}
main .digital-optic-list .table .active-question td:first-child{border-radius: 11px 0 0 11px;}
main .digital-optic-list .table .active-question td:last-child{border-radius: 0 11px 11px 0;}
main .digital-optic-list::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);box-shadow: inset 0 0 6px rgba(0,0,0,0.3);border-radius: 10px;background-color: #bcbcbc;}
main .digital-optic-list::-webkit-scrollbar{width: 10px;background-color: #fff;}
main .digital-optic-list::-webkit-scrollbar-thumb{border-radius: 10px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #ff6c00;}
main .educator-content{background: #041f32;}
main .educator-content .text-content{border-top: 3px solid #e05629;border-bottom: 3px solid #e05629;}
main .educator-content .list-group-item .filled-star,
main .educator-content .list-group-item .halffilled-star,
main .educator-content .list-group-item .unfilled-star{width: 20px;}
main .educator-content .list-group-item .point-layer{border-left: 3px solid #a1ff00;padding-left: 10px;margin-left: 10px;width: 60px;}
main .exchange2{position: absolute;top: -20px;left: -29px;width: 60px;cursor: pointer;z-index: 9;}
main .exam-layer .user-avatar{position: relative;}
main .exam-layer .user-avatar img{position: absolute;width: 95px;bottom: -8px;}
main .exam-question img{margin: 0 auto;}
main .exam-evaluation tbody td{border-bottom: 1.5px solid #041f32 !important;border-right: 2px solid #041f32 !important;}
main .exam-evaluation .y-icon,
main .exam-evaluation .t-icon,
main .exam-evaluation .q-stage{width: 26px;}
main .exam-evaluation .ra-icon{width: 15px;height: 21px;-webkit-animation: loaderArrow linear 2s;animation: loaderArrow linear 2s;}
main .fc-center h2{font-size: 20px;color: #fff;}
main .fc-event{background-color: #6bbd1b;border: none;}
main .fc-unthemed td.fc-today{background: #e05629;}
main .fc-event-container .fc-content .fc-title{color: #fff;}
main .fc-left .fc-button-group button{background: #011932;border: 0;}
main .fc-right .fc-today-button{background-color: #f1592a;border-color: transparent;}
main .fc-button-primary:not(:disabled).fc-button-active,
main .fc-button-primary:not(:disabled):active{background-color: #f1592a;border-color: #f1592a;}
main .fc-button-primary:not(:disabled).fc-button-active:focus,
main .fc-button-primary:not(:disabled):active:focus{-webkit-box-shadow: 0 0;box-shadow: 0 0;}
main .fc-ltr .fc-dayGrid-view .fc-day-top .fc-day-number{color:#fff;}
main .fc-row.fc-widget-header tr .fc-day-header span{color: #fff;text-transform: uppercase;}
main .fc-unthemed .fc-content,
main .fc-unthemed .fc-divider,
main .fc-unthemed .fc-list-heading td,
main .fc-unthemed .fc-list-view,
main .fc-unthemed .fc-popover,
main .fc-unthemed .fc-row,
main .fc-unthemed tbody,
main .fc-unthemed td,
main .fc-unthemed th,
main .fc-unthemed thead{border-color: #011932;}
main .fingerprint-scan svg{width: 60px;}
main .fingerprint-scan svg path{fill: #6DD300;-webkit-animation: fingerprintscan 2s ease-in-out;animation: fingerprintscan 2s ease-in-out;}
main .fingerprint img{width: 60px;}
main .form-group input:-webkit-autofill,
main .form-group input:-webkit-autofill:hover,
main .form-group input:-webkit-autofill:focus{-webkit-text-fill-color: #f1592a;-webkit-transition: background-color 5000s ease-in-out 0s;transition: background-color 5000s ease-in-out 0s;}
main .form-control::-webkit-input-placeholder{color: #606a74;font-weight: 600;}
main .form-control::-moz-placeholder{color: #606a74;font-weight: 600;}
main .form-control:-ms-input-placeholder{color: #606a74;font-weight: 600;}
main .form-control::-ms-input-placeholder{color: #606a74;font-weight: 600;}
main .form-control::placeholder{color: #606a74;font-weight: 600;}
main .h-activity{padding-bottom: 16px;border-bottom: 3px solid #f1592a;}
main .head-arrow{width: 13px;height: 21px;}
main .jw-tab-focus:focus{outline: none;}
main .layer-right-b{border-left: 4px solid #f1592a;padding-left: 2em;}
main .list-profile .list-group-item .circle{background: #f15a29;width: 14px;height: 14px;border-radius: 30px;}
main .list-card-r{background: #011427;}
main .list-card-r .latest-contents::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);box-shadow: inset 0 0 6px rgba(0,0,0,0.3);border-radius: 5px;background-color: #03253c;}
main .list-card-r .latest-contents::-webkit-scrollbar{width: 8px;background-color: #03253c;}
main .list-card-r .latest-contents::-webkit-scrollbar-thumb{border-radius: 5px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #ec5929;}
main .list-card-r .latest-contents.v1{max-height: 360px;overflow-y: scroll;}
main .list-card-r .latest-contents.v2{max-height: 400px;overflow-y: scroll;}
main .list-card-r .list-card-r-item{background: #011931;}
main .list-card-r .list-card-r-item .title{padding-bottom: 8px;border-bottom: 1px solid #a1ff00;}
main .list-card-r .previous-item{position: relative;color: #96ef03;}
main .list-card-r .previous-item .rt-36{-webkit-transform: rotate(180deg);-ms-transform: rotate(180deg);transform: rotate(180deg);}
main .list-card-r .previous-item img{cursor: pointer;}
main .lesson-card{border: 0;border-bottom: 5px solid #0e1b2b !important;}
main .lesson-card h3{cursor: pointer;font-size: 24px;}
main .lesson-card .title:not(.collapsed):after{content: "";position: absolute;background: url(../images/right-arrow-b.png);width: 27px;height: 17px;background-size: cover;top: 7px;right: 0;-webkit-transform: rotate(270deg);-ms-transform: rotate(270deg);transform: rotate(270deg);}
main .lesson-card .title.collapsed::after{content:"";position: absolute;background: url(../images/right-arrow-b.png);width: 27px;height: 17px;background-size: cover;top: 7px;right: 0;}
main .lesson-card .list-group{border-top: 5px solid #0e1b2b;}
main .lesson-card .list-group .list-group-item{background: transparent;border: 0;border-bottom: 2px solid #0e1b2b;border-radius: 0;}
main .lesson-card .list-group .list-group-item:last-child{border-bottom: 0;}
main .nav-pills .nav-item a{color:#fff;}
main .nav-pills .nav-item a:hover{background: #EC5A29;}
main .nav-pills .nav-link{border: 1px solid #EC5A29;}
main .nav-pills .nav-link.active{background: #EC5A29;}
main .nav-profile .nav-link{background: #032540;border: 0;position: relative;font-family: "Nunito";font-weight: 600;padding-left: 56px;color: #fff;font-size: 18px;border-radius: 0;margin-bottom: 3px;}
main .nav-profile .nav-link:before{content:"";position: absolute;background: #fff;width: 14px;height: 14px;top: 22px;left: 22px;border-radius: 30px;}
main .nav-profile .nav-link.active:before{background: #f15a29;}
main .nav-profile .nav-link.active{background: #032540;color: #f15a29}
main .nav-profile .nav-link.active:after{content:"";position: absolute;background: url(../images/right-arrow-1.png);width: 16px;height: 26px;top: 16px;right: -45px;}
main .owl-reward-timeline{overflow: hidden;}
main .owl-reward-timeline .owl-stage{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;}
main .owl-reward-timeline .reward-timeline-item img{width: 50px;}
main .owl-reward-timeline .reward-timeline-item .h-title{margin-top: 10px;line-height: 17px;height:60px;}
main .owl-reward-timeline .owl-dots,
main .owl-reward-timeline .owl-nav{text-align:center;-webkit-tap-highlight-color:transparent}
main .owl-reward-timeline .owl-nav{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;}
main .owl-reward-timeline .owl-nav .owl-prev{left: 0;}
main .owl-reward-timeline .owl-nav .owl-next{right: 0;}
main .owl-reward-timeline .owl-nav .owl-prev span,
main .owl-reward-timeline .owl-nav .owl-next span{font-size: 57px;}
main .owl-reward-timeline .owl-nav [class*=owl-]{position: absolute;top: 33%;color: #d7522a;font-size:14px;line-height: 21px;width: 23px;outline: 0;height: 37px;cursor:pointer;}
main .owl-reward-timeline .owl-nav [class*=owl-]:hover{background:#021d36;color:#FFF;text-decoration:none}
main .owl-reward-timeline .owl-nav .disabled{opacity:.5;cursor:default}
main .owl-reward-timeline .owl-nav.disabled+.owl-dots{position: absolute;bottom: 20px;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;width: 100%;}
main .owl-reward-timeline .owl-dots .owl-dot{display:inline-block;zoom:1;outline: 0;}
main .owl-reward-timeline .owl-dots .owl-dot.active span{width: 45px;background: #fff;}
main .owl-reward-timeline .owl-dots .owl-dot span{width: 25px;height: 8px;margin:5px 7px;background: #869791;display:block;-webkit-backface-visibility:visible;backface-visibility:visible;-webkit-transition:opacity .2s ease;-o-transition:opacity .2s ease;transition:opacity .2s ease;border-radius: 2px;}
main .owl-appointments .owl-dots,
main .owl-appointments .owl-nav{text-align:center;-webkit-tap-highlight-color:transparent;}
main .owl-appointments .owl-nav{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;}
main .owl-appointments .owl-nav .owl-prev{left: 0;}
main .owl-appointments .owl-nav .owl-next{right: 0;}
main .owl-appointments .owl-nav .owl-prev span,
main .owl-appointments .owl-nav .owl-next span{font-size: 57px;}
main .owl-appointments .owl-nav [class*=owl-]{position: absolute;top: 33%;color: #d7522a;font-size:14px;line-height: 21px;width: 23px;outline: 0;height: 37px;cursor:pointer;}
main .owl-appointments .owl-nav [class*=owl-]:hover{color:#FFF;text-decoration:none}
main .owl-appointments .owl-nav .disabled{opacity: 0;cursor:default;}
main .owl-appointments .owl-nav.disabled+.owl-dots{position: absolute;bottom: 20px;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;width: 100%;}
main .owl-appointments .owl-dots .owl-dot{display:inline-block;zoom:1;outline: 0;}
main .owl-appointments .owl-dots .owl-dot.active span{width: 45px;background: #fff;}
main .owl-appointments .owl-dots .owl-dot span{width: 25px;height: 8px;margin:5px 7px;background: #869791;display:block;-webkit-backface-visibility:visible;backface-visibility:visible;-webkit-transition:opacity .2s ease;-o-transition:opacity .2s ease;transition:opacity .2s ease;border-radius: 2px;}
main .pagination .page-item.active .page-link{color:#f1592a;}
main .pagination .page-item .page-link{color:#fff;}
main .pagination .page-link:hover{color:#f1592a;}
main .pagination .page-link:focus{-webkit-box-shadow: 0 0;box-shadow: 0 0;outline: 0;}
main .portal-timeline{position: relative;width: 100%;}
main .portal-timeline img{position: absolute;top: 35%;width: 20px;}
main .portal-timeline .timeline-bar{width: 100%;background: #fff;height: 5px;margin-top: 7em;margin-bottom: 7em;border-radius: 5px;}
main .portal-timeline .timeline-bar .starting-point{position: absolute;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;width: 120px;margin-left: 0%;top: 0;}
main .portal-timeline .timeline-bar .starting-point span{position: relative;color: #bf22e6;font-weight: 600;font-size: 19px;padding-bottom: 5px;text-align: center;font-family: nunito;}
main .portal-timeline .timeline-bar .starting-point span sub{position: absolute;right: 50%;top: 100%;width: 6px;border-radius: 3px;height: 86px;background: -o-linear-gradient(top, #be23e6, #5c6df0);background: -webkit-gradient(linear, left top, left bottom, from(#be23e6), to(#5c6df0));background: linear-gradient(to bottom, #be23e6, #5c6df0);}
main .portal-timeline .timeline-bar .timeline-item{position: absolute;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;width: 120px;top: 0;}
main .portal-timeline .timeline-bar .timeline-item span{position: relative;color: #fff;font-weight: 600;font-size: 19px;text-align: center;font-family: nunito;}
main .portal-timeline .timeline-bar .timeline-item span sub{position: absolute;right: 50%;top: 100%;width: 6px;display: block;border-radius: 3px;height: 86px;background: -o-linear-gradient(top, #e621a8, #995ef0);background: -webkit-gradient(linear, left top, left bottom, from(#e621a8), to(#995ef0));background: linear-gradient(to bottom, #e621a8, #995ef0);}
main .portal-days-left .circle-progress-bar2{width: 100%;position: relative;}
main .portal-days-left .circle-progress-bar2 svg {height: 100%;width: 100%;fill: none;stroke-width: 20px;stroke-linecap: round;}
main .portal-days-left .circle-progress-bar2 .text{position: absolute;left: 51%;top: 50%;padding: 0px;margin: 0px;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);color: #fff;font-size: 53px;font-weight: 600;font-family: Nunito;}
main .portal-days-left .circle-progress-bar2 .fill-layer{stroke: #3a3d4c;stroke-width: 4px;fill-opacity: 0;}
main .portal-days-left .circle-progress-bar2 .stroke-layer{stroke-dasharray: 301.635, 301.635;stroke-width: 5px;fill-opacity: 0;}
main .portal-scorechart{width: 90%;margin: 0 auto;}
main .portal-scorechart .circle-progress-bar2{width: 100%;position: relative;}
main .portal-scorechart .circle-progress-bar2 svg {height: 100%;width: 100%;fill: none;stroke-width: 20px;stroke-linecap: round;}
main .portal-scorechart .circle-progress-bar2 .text{position: absolute;left: 52%;top: 52%;padding: 0px;margin: 0px;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);color: #fff;font-size: 34px;font-weight: 600;font-family: Nunito;}
main .portal-scorechart .circle-progress-bar2 .fill-layer{stroke: #3a3d4c;stroke-width: 4px;fill-opacity: 0;}
main .portal-scorechart .circle-progress-bar2 .stroke-layer{stroke-dasharray: 301.635, 301.635;stroke-width: 5px;fill-opacity: 0;}
main .pwrapper h1 span{font-size: 7.5rem;}
main .progress-layer .title{width: 200px;}
main .progress-layer .circle{background: #fff;width: 18px;height: 18px;border-radius: 30px;}
main .progress-layer .progress{background-color: #3a3d4c;width: 50%;-webkit-animation: loaderProgress linear 6s;animation: loaderProgress linear 6s;}
main .progress-layer .progress-bar{-webkit-animation: loaderProgress linear 5s;animation: loaderProgress linear 5s;}
main .progress-layer .progress .bg-linear-1{background-image: -o-linear-gradient(left, #c424e7, #fff);background-image: -webkit-gradient(linear, left top, right top, from(#c424e7), to(#fff));background-image: linear-gradient(to right, #c424e7, #fff);background-color: #3a3d4c;}
main .progress-layer .progress .bg-linear-2{background-image: -o-linear-gradient(left, #01fddd, #5872f0);background-image: -webkit-gradient(linear, left top, right top, from(#01fddd), to(#5872f0));background-image: linear-gradient(to right, #01fddd, #5872f0);background-color: #3a3d4c;}
main .progress-layer .progress .bg-linear-3{background-image: -o-linear-gradient(left, #5b6ef0, #c21fe6);background-image: -webkit-gradient(linear, left top, right top, from(#5b6ef0), to(#c21fe6));background-image: linear-gradient(to right, #5b6ef0, #c21fe6);background-color: #3a3d4c;}
main .profile-layer .avatar img{width: 140px;}
main .profile-layer .rank-box{border: 2px solid #f1592a;}
main .profile-layer .rank-box p{color: #f1592a;}
main .profile-layer .rank-box .rank-list img{width: 30px;}
main .profile-menu .nav-item{position: relative;}
main .profile-menu .nav-item.active:before{background: #f1592a;}
main .profile-menu .nav-item:before{content:"";position: absolute;background: #001831;left: -40px;top: 11px;border-radius: 6px;height: 22px;width: 60px;}
main .profile-menu .nav-item.active a{color: #f1592a;}
main .profile-menu .nav-item a{color: #fff;}
main .pdf-thumb{max-height: 240px;width: 100%;-o-object-fit: cover;object-fit: cover;-o-object-position: top;object-position: top;}
main .pdf-thumb2{height: auto;width: 100%;-o-object-fit: cover;object-fit: cover;-o-object-position: top;object-position: top;}
main .refenrece img{filter: grayscale(1);-webkit-filter: grayscale(1);-webkit-transition: all 0.5s ease 0s;-o-transition: all 0.5s ease 0s;transition: all 0.5s ease 0s;}
main .refenrece img:hover{filter: none;-webkit-filter: none;-webkit-transition: all 0.5s ease 0s;-o-transition: all 0.5s ease 0s;transition: all 0.5s ease 0s;}
main .section-area{background: #011427;}
main .section-area button img{width: 20px;}
main .owl-staffs .owl-dots,
main .owl-staffs .owl-nav{text-align:center;-webkit-tap-highlight-color:transparent;}
main .owl-staffs .owl-nav{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: justify;-webkit-justify-content: space-between;-ms-flex-pack: justify;justify-content: space-between;}
main .owl-staffs .owl-nav .owl-prev{left: 0;}
main .owl-staffs .owl-nav .owl-next{right: 0;}
main .owl-staffs .owl-nav .owl-prev span,
main .owl-staffs .owl-nav .owl-next span{font-size: 57px;}
main .owl-staffs .owl-nav [class*=owl-]{position: absolute;top: 33%;color: #d7522a;font-size:14px;line-height: 21px;width: 23px;outline: 0;height: 37px;cursor:pointer;}
main .owl-staffs .owl-nav [class*=owl-]:hover{color:#FFF;text-decoration:none}
main .owl-staffs .owl-nav .disabled{opacity: 0;cursor:default;}
main .owl-staffs .owl-nav.disabled+.owl-dots{position: absolute;bottom: 20px;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;width: 100%;}
main .owl-staffs .owl-dots .owl-dot{display:inline-block;zoom:1;outline: 0;}
main .owl-staffs .owl-dots .owl-dot.active span{width: 45px;background: #fff;}
main .owl-staffs .owl-dots .owl-dot span{width: 25px;height: 8px;margin:5px 7px;background: #869791;display:block;-webkit-backface-visibility:visible;backface-visibility:visible;-webkit-transition:opacity .2s ease;-o-transition:opacity .2s ease;transition:opacity .2s ease;border-radius: 2px;}
main .staff-layer{background: #011427;}
main .staff-layer .title{background: #011427;cursor: pointer;position: relative;}
main .staff-layer .title.collapsed:after{-webkit-transform: rotate(270deg);-ms-transform: rotate(270deg);transform: rotate(270deg);}
main .staff-layer .title:after{content:"";position: absolute;background: url(../images/right-arrow-b.png);width: 27px;height: 17px;background-size: cover;top: 7px;right: 0;}
main .staff-layer .educator{height: 250px;}
main .staff-layer .introducing{position: absolute;bottom: 15px;width: 91%;margin-left: 2%;cursor: pointer;background: #c30352;color: #fff;font-size: 14px;}
main .staff-layer .introducing img{width: 20px;}
main .staff-layer .introducing .info{background: -o-linear-gradient(45deg, #fc5530, #ff0c87);background: linear-gradient(45deg, #fc5530, #ff0c87);}
main .staff-layer .introducing .info img{width: 7px;}
main .staff-layer .collapsing{position: relative;height: 0;overflow: hidden;-webkit-transition: height .65s ease;-o-transition: height .65s ease;transition: height .65s ease;}
main .staff-choice .educator {height: 250px;}
main .staff-choice .introducing{position: absolute;bottom: 15px;width: 91%;margin-left: 2%;background: #c30352;color: #fff;}
main .scroll{position: relative;}
main .scroll img{width: 30px;cursor: pointer;position: relative;-webkit-animation: scrollDown linear 1.8s;animation: scrollDown linear 1.8s;-webkit-animation-iteration-count: infinite;animation-iteration-count: infinite;-webkit-transform-origin: 50% 50%;-ms-transform-origin: 50% 50%;transform-origin: 50% 50%;}
main .scrollbar-style::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);box-shadow: inset 0 0 6px rgba(0,0,0,0.3);border-radius: 5px;background-color: #03253c;}
main .scrollbar-style::-webkit-scrollbar{width: 8px;background-color: #03253c;}
main .scrollbar-style::-webkit-scrollbar-thumb{border-radius: 5px;-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);box-shadow: inset 0 0 6px rgba(0,0,0,.3);background-color: #ec5929;}
main .statistics{border-left: 2px solid #ffffff80;border-right: 2px solid #ffffff80;}
main .tab-content .card .card-img-top{position: relative;height: 300px;-o-object-fit: contain;object-fit: contain;padding-top: 10px;border-radius: 0;background: #01203F url(../images/training-bg.png);background-position: 50% 40%;}
main .user-avatar img{width: 140px;}
main .user-photo-file{position: relative;width: 200px;overflow: hidden;}
main .user-photo-file:before{content:"+";position: absolute;top: 16%;left: 38%;font-size: 69px;line-height: 53px;}
main .user-photo-file .custom-file-input{position: absolute;top: 0;left: 0;bottom: 0;right: 0;width: 100%;height: 100%;}
main .total-o-number{width: 240px;}
main .total-o-number .progress{background-color: #020f1d;}
main .total-o-number .progress-border{position: relative;border: 10px solid #011429;border-radius: 10px;}
main .total-o-number .progress-border .progress-amount{position: absolute;background: #fff;font-size: 13px;top: -3px;font-family: Nunito;font-weight: 700;line-height: 12px;padding-bottom: 4px;padding-top: 6px;padding-left: 18px;padding-right: 18px;border-radius: 8px;}
main .video-info{background: #041f32;color: #fff;height: 100%;-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;font-family: Nunito;}
main .video-info:before {content: "";position: absolute;left: -30px;top: 0;height: 100%;width: 35px;background: #041f32;}
main .video-info .video-info-l .educator{width: 120px;}
main .video-info .video-info-l .filled-star,
main .video-info .video-info-l .halffilled-star,
main .video-info .video-info-l .unfilled-star{width: 23px;}
main .video-info .video-info-r{border-left: 4px solid #0e1b2b;}
main .video-card-b img{width: 45px;}
main .video-card-b span{line-height: 18px;font-size: 15px;}
main .question-layer article p{font-size: 16px;font-weight: 400;margin-bottom: 1.5rem;}
main .question-layer article p:last-child{margin-bottom: 0;}
main #educator-content #educatorcollapse:not(.show){display: block;height: 3rem;overflow: hidden;}
main #educator-content #educatorcollapse.collapsing{height: 3rem;}
main #educator-content a.collapsed::after{content: '\25CF \25CF \25CF';color: #e05629;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;font-size: 16px;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;}
main #educator-content a:not(.collapsed)::after{content: '\25CF \25CF \25CF';color: #e05629;display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;font-size: 16px;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center;}

/* footer */
footer .img-f-logo{width: 115px;}
footer .social-icon{height: 20px;}
footer .footer-nav a{color: #0480ff;}
footer .footer-nav a:hover{color: #54a2f3;}

/* sole */
.fs-13{font-size:13px;}
.fs-14{font-size:14px;}
.fs-15{font-size:15px;}
.fs-17{font-size:17px;}
.fs-18{font-size:18px;}
.fs-20{font-size:20px;}
.fw-1{font-weight: 100;}
.fw-3{font-weight: 300;}
.fw-4{font-weight: 400;}
.fw-5{font-weight: 500;}
.fw-6{font-weight: 600;}
.fw-7{font-weight: 700;}
.fw-8{font-weight: 800;}
.py-6{padding-top: 5rem;padding-bottom: 5rem;}
.bg-darkblue{background: #011932;}
.bg-darkblue-2{background: #01203F;}
.bg-darkblue-3{background: #011225;}
.bg-darkblue-4{background: #001629;}
.bg-darkblue-5{background: #052f4c;}
.bg-darkblue-6{background: #032540;}
.bg-darkblue-7{background: #0e1b2b;}
.pr-6,.px-6{padding-right: 5rem;}
.rounded-1{border-radius: 10px;}
.rounded-2{border-radius: 9px;}
.rounded-3{border-radius: 4px;}
.btn.focus,
.btn:focus,
.form-control:focus{-webkit-box-shadow: 0 0;box-shadow: 0 0;}
.table-nowrap th,
.table-nowrap td{white-space:nowrap;}
.table-centered td,
.table-centered th{vertical-align: middle !important;}
.ff-nunito{font-family: Nunito;}
.outline-0{outline: 0!important;}
.btn-orange{color: #fff;background-color: #ec5929;}
.btn-lblue{color: #fff;background-color: #016ac3;}
.bg-success-2{background-color: #489404;}
.bg-success-3{background-color: #3aab09;}
.btn-pink{background: #c30352;color: #fff;}
.btn-pink:hover span{color:#fff;}
.btn-purple{background: #6a0f5a;color: #fff;}
.text-purple{color:#6a0f5a}
.btn-orange:hover,
.btn-lblue:hover,
.btn-lblue:hover,
.btn-purple:hover{color:#fff}
.shadow-e{-webkit-box-shadow: 0px 13px 15px #0000006e;box-shadow: 0px 13px 15px #0000006e;}
.text-orange{color:#f1592a!important}
.bg-t-orange{background: #f1592a;}
.bg-danger2{color: #fff;background-color: #ff0000;}
.border-orange-s1{border-color: #f1592a61!important;}
.border-dark-s1{border-color: #011932 !important;}
.border-green-s1{border-color: #a1ff00 !important;}
.modal-backdrop{background-color: #12263f;}
.modal-backdrop.show{z-index: 1;}
.backdrop{position: fixed;top: 0;left: 0;overflow: hidden;z-index: 100;opacity: .7;width: 100vw;height: 100vh;background-color: #12263f;}
.fc-dayGridDay-view .fc-content-skeleton,
.fc-dayGridWeek-view .fc-content-skeleton{padding-bottom:1em}
.fc-dayGrid-view .fc-body .fc-row{min-height:4em}
.fc-row.fc-rigid{overflow:hidden}
.fc-row.fc-rigid .fc-content-skeleton{position:absolute;top:0;left:0;right:0}
.fc-day-top.fc-other-month{opacity:.3}
.fc-dayGrid-view .fc-day-number,
.fc-dayGrid-view .fc-week-number{padding:2px}
.fc-dayGrid-view th.fc-day-number,
.fc-dayGrid-view th.fc-week-number{padding:0 2px}
.fc-ltr .fc-dayGrid-view .fc-day-top .fc-day-number{float:right}
.fc-rtl .fc-dayGrid-view .fc-day-top .fc-day-number{float:left}
.fc-ltr .fc-dayGrid-view .fc-day-top .fc-week-number{float:left;border-radius:0 0 3px}
.fc-rtl .fc-dayGrid-view .fc-day-top .fc-week-number{float:right;border-radius:0 0 0 3px}
.fc-dayGrid-view .fc-day-top .fc-week-number{min-width:1.5em;text-align:center;background-color:#f2f2f2;color:grey}
.fc-dayGrid-view td.fc-week-number{text-align:center}
.fc-dayGrid-view td.fc-week-number>*{display:inline-block;min-width:1.25em}

/* animation */
.animated {-webkit-animation-duration: 1s;animation-duration: 1s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
.fadeIn{-webkit-animation-name: fadeIn;animation-name: fadeIn;}
.animated.delay-1s{-webkit-animation-delay: 0.1s;animation-delay: 0.1s;}
.animated.delay-2s{-webkit-animation-delay: 0.2s;animation-delay: 0.2s;}
.animated.delay-3s{-webkit-animation-delay: 0.3s;animation-delay: 0.3s;}
.animated.delay-4s{-webkit-animation-delay: 0.4s;animation-delay: 0.4s;}
.animated.delay-5s{-webkit-animation-delay: 0.5s;animation-delay: 0.5s;}
.animated.delay-6s{-webkit-animation-delay: 0.6s;animation-delay: 0.6s;}
.animated.delay-7s{-webkit-animation-delay: 0.7s;animation-delay: 0.7s;}
.animated.delay-8s{-webkit-animation-delay: 0.8s;animation-delay: 0.8s;}
@-webkit-keyframes fadeIn{from{opacity: 0;}to{opacity: 1;}}
@keyframes fadeIn{from{opacity: 0;}to{opacity: 1;}}
@-webkit-keyframes fingerprintscan{0%{opacity: 0.1;fill: #fff;}50%{opacity: 0.5;fill: scale(0.5);}75%{opacity: 0.8;fill: scale(0.8);}100%{opacity: 0.5;fill: scale(1);}}
@keyframes fingerprintscan{0%{opacity: 0.1;fill: #fff;}50%{opacity: 0.5;fill: scale(0.5);}75%{opacity: 0.8;fill: scale(0.8);}100%{opacity: 0.5;fill: scale(1);}}
@-webkit-keyframes pulseG{0% {-webkit-box-shadow: none;box-shadow: none;}10% {-webkit-box-shadow: 0 0 1.4em #ffffffb8;box-shadow: 0 0 1.4em #ffffffb8;border-color: #db3d09a3;}}
@keyframes pulseG{0% {-webkit-box-shadow: none;box-shadow: none;}10% {-webkit-box-shadow: 0 0 1.4em #ffffffb8;box-shadow: 0 0 1.4em #ffffffb8;border-color: #db3d09a3;}}
@-webkit-keyframes scrollDown{0%{-webkit-transform:translateY(0);transform:translateY(0);}50%{-webkit-transform:translateY(-10px);transform:translateY(-10px);}100%{-webkit-transform:translateY(0);transform:translateY(0)};}
@keyframes scrollDown{0%{-webkit-transform:translateY(0);transform:translateY(0);}50%{-webkit-transform:translateY(-10px);transform:translateY(-10px);}100%{-webkit-transform:translateY(0);transform:translateY(0)};}
@-webkit-keyframes loaderProgress{0%{width: 0%;}}
@keyframes loaderProgress{0%{width: 0%;}}
@-webkit-keyframes loaderArrow{0%{-webkit-transform: translateX(-180px);transform: translateX(-180px);}100%{-webkit-transform: translateX(0);transform: translateX(0);};}
@keyframes loaderArrow{0%{-webkit-transform: translateX(-180px);transform: translateX(-180px);}100%{-webkit-transform: translateX(0);transform: translateX(0);};}

/* responsive */
@media (max-width: 4000px){
main .chart-container.chat1{position: relative;height:31vh;width:30vw;}
main .chart-container.chat2{height: 310px;}
}
@media (max-width: 2000px){
header .portal-activity-menu{width: 25em;}
main .chart-container.chat1{height: 283px;width: 25vw;}
main .statistics h5{font-size: 20px;}
main .h-activity-layer{height: 100%;}
main .activity-scrollbar{height: 56vw;}
main .statistics span{font-size: 16px;}
main .portal-scorechart h5{font-size: 22px;}
main .video-info .video-info-r{width: 320px;}
}
@media (max-width: 1800px){
header .portal-activity-menu{width: 24em;}
main .chart-container.chat1{height: 280px;width: 25vw;}
main .chart-container.chat2{height: 308px;}
main .portal-scorechart h5{font-size: 20px;}
main .video-info .video-info-r{width: inherit;}
}
@media (max-width: 1600px){
header .portal-activity-menu{width: 23em;}
main .chart-container.chat1{height: 215px;width: 25vw;}
main .chart-container.chat2{height: 242px;}
main .activity-scrollbar{height: 73vw;}
main .educator-content .list-group-item .star-layer{text-align: center;}
main .staff-choice .educator{height: 170px;}
main .chart-container.chart1{width: auto;height: auto;}
main .portal-days-left{width: 135px;margin-left: 0;}
main .statistics h5{font-size: 20px;}
main .digital-optic-list .table tr td .selected{left: 12px;}
main .statistics span{font-size: 16px;}
main .video-card-b img{display: none;}
main .portal-scorechart h5{font-size: 17px;}
main .total-o-number{width: initial;}
main .table .ra-icon{-webkit-animation: loaderArrow linear 1s;animation: loaderArrow linear 1s;}
main .staff-layer .play-icon{display: none;}
main .staff-layer .educator{height: 220px;}
main .staff-layer-title{font-size: 22px;}
main .video-info .video-info-r{border-left: 0;}
main .video-info:before{left: -30px;width: 35px;}
@-webkit-keyframes loaderArrow{0%{-webkit-transform: translateX(-60px);transform: translateX(-60px);}100%{-webkit-transform: translateX(0);transform: translateX(0);};}
@keyframes loaderArrow{0%{-webkit-transform: translateX(-60px);transform: translateX(-60px);}100%{-webkit-transform: translateX(0);transform: translateX(0);};}
}
@media (max-width: 1583px) and (min-width: 1391px){
main .daily-time{border-right: 0;}
}
@media (max-width: 1440px){
header .search-layer .search-menu{top: 3em;right: -102px;}
header .notification-menu{top: 3em;right: -102px;}
header .portal-activity-menu{width: 22em;}
main .chart-container.chat1{height: 180px;width: inherit;}
main .chart-container.chat2{position: relative;height: 208px;}
main .card-suggestion.c-orange h5,
main .card-suggestion.c-purple h5,
main .card-suggestion.c-blue h5,
main .card-suggestion.c-red h5{font-size: 18px;}
main .card-suggestion.c-orange span,
main .card-suggestion.c-purple span,
main .card-suggestion.c-blue span,
main .card-suggestion.c-red span{font-size: 15px;}
main .card-suggestion .video img{width: 40px;}
main .activity-scrollbar{height: 79vw;}
main .portal-scorechart .circle-progress-bar2 .text{font-size: 29px;}
main .portal-scorechart{width: 116px;}
main .digital-optic-list .table tr td .selected{left: 6px;}
main .portal-scorechart h5{font-size: 17px;}
main .portal-days-left{width: 138px;margin-left: 0;}
main .alive-layer2 img{width: 350px;}
main .statistics h5{font-size: 20px;}
main .statistics span{font-size: 16px;}
main .staff-choice .educator{height: 125px;}
main .staff-layer .educator{height: 180px;}
main .staff-layer-title{font-size: 18px;}
main .daily-time h5{font-size: 20px;}
main .table .ra-icon{-webkit-animation: loaderArrow linear 1s;animation: loaderArrow linear 1s;}
@-webkit-keyframes loaderArrow{0%{-webkit-transform: translateX(-25px);transform: translateX(-25px);}100%{-webkit-transform: translateX(0);transform: translateX(0);};}
@keyframes loaderArrow{0%{-webkit-transform: translateX(-25px);transform: translateX(-25px);}100%{-webkit-transform: translateX(0);transform: translateX(0);};}
}
@media (max-width: 1390px) and (min-width: 1199px){
main .statistics{border-left: 0;border-right:0;}
}
@media (max-width: 1200px){
header .portal-activity-menu .activity-chart{max-height: 210px;}
header .nav-portal .nav-item .active:before{display:none}
header .portal-activity-menu{width: 21em;}
header .nav-portal{padding-bottom: 0;border-bottom: 0;}
main .h-activity-layer{height: initial;}
main .chart-container.chat1{height: auto;width: auto;}
main .chart-container.chat2{height: auto;width: auto;}
main .staff-layer .play-icon{display: block;}
main .video-info:before{display:none;}
main .digital-optic-list .table tr td .selected{left: 10px;}
main .activity-scrollbar{height: 25vw;}
main .exchange2{left: 48%;top: -35px;}
main .pdf-thumb{height: 260px;width: 100%;-o-object-fit: contain;object-fit: contain;}
main .video-info .video-info-r{border-top: 0;padding-top: 0;margin-top: 0;border-left: 4px solid #0e1b2b;width: initial;}
main .table .ra-icon{-webkit-animation: initial;animation: initial}
main .portal-scorechart,
main .portal-days-left{width: 100%;margin-left: 0;}
main .pdf-thumb2{height: 400px;}
main .appointment-item .lesson{width: auto;}
main .appointment-item .teacher{width: auto;}
main .video-info{padding: 1em;}
main .player-content{width: 100%;border-radius: 3px;}
main .daily-time{border-left: 0;border-right: 0;}
main .video-card-b img{display: block;}
main .player img{width: 100%;border-radius: 10px;}
main .portal-scorechart .circle-progress-bar2,
main .portal-days-left .circle-progress-bar2{width: 20%;}
main .portal-scorechart .circle-progress-bar2 .text{font-size: 27px;}
main .portal-days-left .circle-progress-bar2 .text{font-size: 50px;}
main .staff-choice .educator{height: 190px;}
main .alive-layer2 img{display: none;}
}
@media (max-width: 992px){
header .portal-activity-menu{width: 20em;}
main.landing:before{top: 0;width: 65%;}
main .pwrapper h1{font-size: 4em;}
main .statistics{border-left: 0;border-right: 0;padding-right: 2em;}
main .layer-right-b{border-left: 0;padding-left: 0;}
main .pdf-thumb{height: 200px;}
main .digital-optic-list .table tr td .selected{left: 39%;}
main .digital-optic-list .table tr td:nth-child(n+2):nth-child(-n+6){width: auto;}
main .total-o-number .progress-border .progress-amount{left: 6%;}
main .daily-time{border-right: 0;}
main .flex-portal{display: block;width: 100%;overflow-x: auto;-webkit-overflow-scrolling: touch;white-space: nowrap;}
main .video-info .video-info-r{border-top: 0;padding-top: 1em;margin-top: 1em;border-left: 4px solid #0e1b2b;}
main .total-o-number{width: 100%;padding-right: 3em;}
main .pdf-thumb2{height: 310px;}
main .activity-scrollbar{height: 53vw;}
main .exchange2{left: 47%;top: -34px;}
main .portal-scorechart .circle-progress-bar2 .text{font-size: 43px;}
main .portal-days-left .circle-progress-bar2 .text{font-size: 43px;}
main .staff-choice .educator{height: 250px;}
main .h-100{height: inherit !important;}
main .pwrapper h1 span{font-size: 1.5em;}
main .portal-timeline{display: block;width: 100%;overflow-y: hidden;padding-bottom: 14px;overflow-x: auto;-webkit-overflow-scrolling: touch;}
main .pwrapper h2{font-size: 1.5em;}
main .progress-layer .progress{width: 40%;}
}
@media (max-width: 768px){
header .portal-activity-menu{width: 19em;}
header .notification-menu{right: -80px;}
header .media-user{border-left: 3px solid #fff;margin-left: 0.5em;padding-left: 1em;}
main .digital-optic-list .table tr td .selected{left: 36%;}
main.landing:before{display: none;}
main .progress-layer .progress{width: 80%;}
main .portal-timeline{padding-bottom: 0px;}
main .pdf-thumb{height: auto;}
main .h-activity{border-bottom: 2px solid #f1592a;font-size: 20px;}
main .exchange2{left: 46%;top: -34px;}
main .video-info .video-info-r{border-top: 4px solid #0e1b2b;padding-top: 1em;margin-top: 1em;border-left: 0;}
main .statistics{border-left: 0;border-right: 0;padding-right: 3em;}
main .portal-timeline .timeline-bar .starting-point span{font-size: 14px;}
main .portal-timeline .timeline-bar .timeline-item span{font-size: 13px;}
main .portal-timeline .timeline-bar .starting-point span sub,
main .portal-timeline .timeline-bar .timeline-item span sub{width: 4px;}
main .portal-scorechart .circle-progress-bar2 .text{font-size: 30px;}
main .portal-days-left .circle-progress-bar2 .text{font-size: 30px;}
main .pwrapper h1{font-size: 3em;text-align: center;}
main .pwrapper h1 span{font-size: 1.5em;}
main .video-card-b img{width: 35px;}
main .portal-timeline .timeline-bar .timeline-item{width: unset;}
main .pwrapper h2{font-size: 1.5em;text-align: center;}
main .nav-profile .nav-link.active:after{right: -32px;}
main .owl-reward-timeline .owl-nav [class*=owl-]{display: none;}
main .staff-layer .educator{height: 200px;}
main .profile-layer .avatar{display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex;}
main .profile-layer .username{width: 100%;}
main .profile-layer{-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;flex-wrap: wrap;}
main .tab-content .card .card-img-top{height: 150px;}
}
@media (max-width: 576px){
header .notification-layer .media span{top: 2px;right: 18px;}
header .navbar-brand img{width: 95px;}
header .media .avatar{width: 35px;}
header .search-layer .search-menu{top: 45px;right: -80px;width: 200px;}
header .media .avatar{width: 30px;}
header .search-layer .media img,
header .notification-layer .media img,
header .support-layer .media img{width: 22px;}
header .portal-activity-menu{width: 18em;}
header .portal-activity-menu .activity-chart{max-height: 145px;}
header .portal-activity-menu .activity-chart-item .activity-icon{display: none;}
header .portal-login-menu{top: 45px;right: -22px;}
header .notification-menu{top: 45px;right: -123px;}
header .media-user{border-left: 2px solid #808c99;margin-left: 5px;padding-left: 10px;}
main .digital-optic-list .table tr td .selected{left: 26%;}
main .profile-menu .nav-item:before{left: 0;top: 14px;width: 33px;height: 15px;}
main .appointment-item .lesson{width: 100%;}
main .appointment-item .teacher{width: 100%;border-left: 0!important;}
main .appointment-item .subject{width: 100%;border-left: 0!important;}
main.landing:before{display: none;}
main .card-suggestion.c-orange h5,
main .card-suggestion.c-purple h5,
main .card-suggestion.c-blue h5,
main .card-suggestion.c-red h5{font-size: 18px;}
main .card-suggestion.c-orange span,
main .card-suggestion.c-purple span,
main .card-suggestion.c-blue span,
main .card-suggestion.c-red span{font-size: 15px;}
main .pdf-thumb{height: auto;}
main .card-suggestion .video img{width: 40px;}
main .total-o-number .progress-border .progress-amount{left: 0;}
main .c-close{right: 20px;}
main .video-layer2 #intedoplayer{height: 250px !important;}
main .active-user .circle span{-webkit-animation:inherit;animation:inherit}
main .video-card-b img{width: 25px;}
main .exchange2{left: 44%;top: -32vh;}
main .pdf-thumb2{height: 190px;}
main .pagination .page-item .page-link{font-size: 15px;}
main .digital-optic-list{max-height: 220px;}
main .progress-layer .progress{width: 70%;}
main .daily-time{width: 100%;border-right: 0;padding-right: 3em;}
main .amount-layer span{padding: 6px !important;background: transparent;}
main .head-arrow{width: 10px;height: 16px;}
main .player img{height: 197px;}
main .staff-layer .title span{font-size: 20px;}
main .staff-layer .title:after{width: 22px;height: 14px;background-size: contain;}
main .lesson-card h3{font-size: 20px;}
main .portal-scorechart .circle-progress-bar2 .text{font-size: 20px;}
main .portal-days-left .circle-progress-bar2 .text{font-size: 20px;}
main .lesson-card .list-group .list-group-item span{font-size: 15px;}
main .question-layer article p{font-size: 15px;}
main .staff-layer .introducing{width: 85%;}
main .staff-choice .educator{height: 190px;}
main .pwrapper h1{font-size: 3em;text-align: center;}
main .pwrapper h1 span{font-size: 1.5em;}
main .pwrapper h2{font-size: 1.5em;text-align: center;}
main .tab-content .card .card-img-top{height: 180px;}
main .scroll:before{width: 26px;height: 50px;}
main .scroll img{width: 25px;}
footer .img-f-logo{width: 95px;}
}