/* ---------------------------
   { Login & Register page CSS } 
------------------------------*/
body
{ font-family: 'Poppins' !important;
  font-size: 14px; 
  font-weight: 400; 
  line-height: 24px; 
  color: #1d1d1d;
}
.login-body-bg{background-color:#4ec7e5;}
.login-button {
  padding: 16px 13px;
  margin-top: 50px;
  /* margin-right: 60px; */
  width: 100%;
    font-weight: 800;
    font-size: 22px;
  float: right;
  color: #fff;
  background-color: #1db3db;
  border: #1db3db;
  margin-bottom: 30px;
}
.forget-pass-text{
color: #000 !important;
font-size: 14px;
}
.m-b-40{margin-bottom:40px}
.m-b-60{margin-bottom:60px;}
.p-40{padding:10px 40px;}
.m-t-10{margin-top:10px !important;}
.p-15{padding:15px;}
.m-l-10{margin-left:10px;}
.m-r-10{margin-right:10px;}
.m-t-0{margin-top:0px !important;}
.m-b-10{margin-bottom:10px}
.m-b-20{margin-bottom:20px;}
.m-t-20{margin-top:20px;}
.m-t-30{margin-top:30px}
.m-t-50{margin-top:50px}
.m-r-20{margin-right:20px;}
.login-sub-text{font-size:16px;font-weight:400; color: #888787;  font-family:'Poppins'!important;}
.input-margin{margin-bottom:4em !important}
.login-text{text-align:left; font-size:32px; color:#5887da; font-weight:900}



.login-page{ display: flex; min-height: 100vh; padding: 40px 0;}
.login-left{ background-color: #3d096d; border-radius: 6px; padding: 40px; color: #fff;}
.login-rate-box{ background-color: rgba(255,255,255,0.16); padding: 20px; border-radius: 6px;}
.login-rate-box h6{ border-bottom: rgba(255,255,255,0.2) thin solid; padding-bottom: 10px;}
.rate-table{ width: 100%; border-collapse: collapse;}
.rate-table tr{border-bottom: rgba(255,255,255,0.2) thin solid;}
.rate-table tr th, .rate-table tr td{ padding: 10px 5px 10px 5px; text-align: center;}

.login-page-padding{padding-left:400px;padding-right:400px}
.login-bg{ background-color: #fff; height: 100%; padding: 40px 60px; position: relative;}

.sub-title-purple{color: #3d096d; font-size: 1.5rem; font-weight: 600;}
.sub-title-purple:after{ width: 40px; height: 3px; content: ""; display: block; background-color: #3d096d; margin-top: 5px;}
.font-size-1{ font-size: 1rem;}
.font-size-2{ font-size: 1.5rem;}
.font-size-3{ font-size: 2rem;}

.text-white{ color: #fff;}
.text-purpal{ color: #3d096d;}

a{ text-decoration: none; font-weight: 500;}

.purple-border-btn{color: #3d096d; border: #3d096d 2px solid; display: inline-block; border-radius: 6px; padding: 8px 30px; font-size: 18px; background-color: #fff; font-weight: 500;}
.purple-border-btn:hover{color: #fff; background-color: #3d096d;}

.forgot-password {
  float: right;
  color: #6a6868;
  margin-top: 10px;
  font-family: 'Poppins';
  font-size: 16px;
  color: #383d7d !important;
}
.forgot-password:hover{ color: #3d096d;}

.form-group{ margin-bottom: 1.5rem;}

/*--- Input effect  CSS ---*/
.field__input {
    --uiFieldPlaceholderColor: var(--fieldPlaceholderColor, #767676);
        background-color: transparent;
        border-radius: 0; color: #1d1d1d;
        border: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        font-family: 'Poppins';
        font-size:16px;
    }
    .field__input:focus::-webkit-input-placeholder {
    color: var(--uiFieldPlaceholderColor);
    }
  .field__input::-webkit-input-placeholder {
    color: var(--uiFieldPlaceholderColor);
    }
    .field__input:focus::-moz-placeholder {
    color: var(--uiFieldPlaceholderColor);
    }
    
    
    .field {
    --uiFieldBorderWidth: var(--fieldBorderWidth, 2px);
    --uiFieldPaddingRight: var(--fieldPaddingRight, 0rem);
    --uiFieldPaddingLeft: var(--fieldPaddingLeft, 0rem);
    --uiFieldBorderColorActive: var(--fieldBorderColorActive, rgba(22, 22, 22, 1));
        display: var(--fieldDisplay, inline-flex);
        position: relative; width:100%;
        font-size: var(--fieldFontSize, 1rem);
    }
    .field__input {
        box-sizing: border-box; color: #1d1d1d;
        width: var(--fieldWidth, 100%);
        /*height: var(--fieldHeight, 3rem);*/
        padding: var(--fieldPaddingTop, 1.25rem) var(--uiFieldPaddingRight) var(--fieldPaddingBottom, .5rem) var(--uiFieldPaddingLeft);
        /*  border-bottom: var(--uiFieldBorderWidth) solid var(--fieldBorderColor, rgba(0, 0, 0, .25));*/
       border: 1px solid #c7c7c7;
    }
   .field-input-text{padding: 15px 10px 15px 50px;}
 .field__input:focus {
        outline: none;
    }

    .field__label-wrap {
        box-sizing: border-box;
        pointer-events: none;
        cursor: text;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }
    .field__label-wrap::after {
        content: "";
        box-sizing: border-box;
        width: 100%;
        height: 0;
        opacity: 0;
        position: absolute;
        bottom: 0;
        left: 0;
    }
    .field__input:focus ~ .field__label-wrap::after {
        opacity: 1;
    }
    .field__label {
        position: absolute; 
        left: var(--uiFieldPaddingLeft);
        top: calc(50% - .5em);
        line-height: 1;
        font-size: var(--fieldHintFontSize, inherit);
        transition: top .2s cubic-bezier(0.9, -0.15, 0.1, 1.15), opacity .2s ease-out, font-size .2s ease-out;
        will-change: bottom, opacity, font-size;
    }
    .field__input:focus ~ .field__label-wrap .field__label, .field__input:not(:placeholder-shown) ~ .field__label-wrap .field__label {
    --fieldHintFontSize: var(--fieldHintFontSizeFocused, .80rem);
        top: var(--fieldHintTopHover, .25rem);
    }
    
    .field_v2 .field__label-wrap {
        overflow: hidden;
    }
    .field_v2 .field__label-wrap::after {
        border-bottom: var(--uiFieldBorderWidth) solid var(--uiFieldBorderColorActive);
        transform: translate3d(-105%, 0, 0);
        will-change: transform, opacity;
        transition: transform .285s ease-out .2s, opacity .2s ease-out .2s;
    }
    .field_v2 .field__input:focus ~ .field__label-wrap::after {
        transform: translate3d(0, 0, 0);
        transition-delay: 0;
    }
    .field {
    --fieldBorderColor: #aeadad;
    --fieldBorderColorActive: #3d096d;
    }

    .field field_v2{ position: relative;}

.field_v2 img{position: absolute; bottom: 15px;padding-left:17px;}




/* ---------------------------
   { Home page CSS } 
------------------------------*/
.page-bg { 
    background: #e5e9ea no-repeat; /* Old browsers */
    }
.desktop-nav{ color:#3d096d; display: inline-block; cursor: pointer;}

.header-right{justify-content: end; display: flex;}

.header-right ul{ width: auto; padding: 0; margin: 0; align-self: center;}
.header-right ul li{ list-style: none; display: inline-block; padding: 0 10px 0 0;margin-top:0px}
.header-right ul li a{ color: #000; font-weight: 500; display: inline-block; position: relative;}
.header-right ul li a:hover{ opacity: 0.7;}
.header-right ul li a sup {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: #fff;
    position: absolute;
    top: 0;
    right: 0;
    line-height: 18px;
    text-align: center;
    color: #3d096d;
}
.top-notice {
    color: #ab0515;
    font-weight: 600;
    text-align: center;
    background: #f7d7da;
    text-transform: uppercase;
    border-radius: 6px;
    padding: 10px 15px;
}

.dashboard-menu-icon{margin-left:-20px}
.system-menu-icon{margin-left:-20px}
.course-menu-icon{margin-left: -24px;}
.content-menu-icon{margin-left: -16px;
margin-right: -5px;}
.dashboard-icon{margin-top:-8px}

.course-icon{margin-top:-4px;margin-right:10px}
.content-icon{margin-right:10px}
.top-notice p{ margin-bottom: 0;}

.box{ width: 100%; height: auto; border-radius: 6px; padding: 15px; margin-bottom: 15px;}

.box-title{ width: 100%; display: flex; padding-bottom: 8px; justify-content: left; align-self: center;}
.box-title h2 {
    font-size: 18px;
    margin: 0; 
    align-self: center;
}

.box .form-group{ margin-bottom: 0.5rem !important;}
.box .form-group label{ margin-bottom: 0.2rem !important; color: #1d1d1d;}


.container{
max-width:100%;
}


footer{ background-color: #e6e6e6; width: 100%;}

.footer-box{ border-radius: 6px; background-color: #3d096d; padding: 20px; margin-top: -50px;}

.pb-80{ margin-bottom: 80px;}

.footer-links{ width: 100%; padding: 0; margin: 0; display: inline-block; text-align: center;}

.footer-links li{ list-style: none; display: inline-block; padding: 5px 8px;}

.footer-links li a{ color: #fff;}

.footer-links li a:hover{ opacity: 0.7;}

.copyright{ color: #000; padding: 10px; width: 100%; text-align: center; display: inline-block;font-weight:300}


.country-background{ background-color :#19b5dd}
.schools-background{background-color:#00529e}
.school-icon{margin-top:-7px;}
.centre-background{background-color:#323460}
.application-grid {
    display: inline-grid;
  
    width: 20%;
    display: contents;
}
.application-div-text {
    font-size: 18px;
    font-family: 'Poppins';
    font-weight: 600 !important;
}
.application-div-body {
    font-size: 27px;
    // padding: 0px 25px;
    font-family: 'Poppins';
    font-weight: 600 !important;
}
.application-grid-alignment {
    padding-top: 30px;
margin-bottom:30px;
  
}
.application-divs {
    color: #fff;
    height: 100px;
    padding: 38px 15px 50px 20px;
}

.number-body {
    font-size: 13px;
    padding: 0px 25px;
    font-family: 'Poppins';
    font-weight: 500 !important;
}
.courses-bg {
    background-color: #ffd000 !important;
}
.content-lib-bg {
    background-color: #d4eef5;
}
.dashboard-grid {
    display: inline-grid;
 height: 45px;
    width: 12%;
}
.content-grid {
    display: inline-grid;
 height: 45px;
    width: 14%;
}
.float-right{
float:right;
}

.admin-dashboard-text{
    font-size: 26px;
    font-family: 'Poppins';
    font-weight: 700 !important;
padding: 10px 10px 10px 30px;
}
.admin-background{
background-color:#f5f9fa
}
.breadcrumb-text{
font-size:12px;
padding:10px 10px 10px 10px;
font-weight:600;
}
.main-text {
   color: #000;
  font-family: 'Poppins' !important;
  font-size: 13px;
  font-weight: 700;
  width: 100%;
margin-top:10px;
  text-align: left !important;
}
.active-menu {
    font-family: 'Poppins';
    font-weight: 700 !important;
    color: #0254a0 !important;;
}
.submenu li {margin-top:0px !important}
.submenu {
    padding-left: 0px !important;
margin-top:0px;
}
.sub-text {
    color: #000;
   font-family: 'Poppins' !important;
    font-weight: 400;
    font-size: 13px;
margin-top:-7px;
}
.sub-menu{
padding-left:50px !important;
}
.view-details-button {
    background: #8793a1;
    float: right;
margin-top:-20px;
margin-right:-15px;
    font-size: 12px;
    font-weight: 300; 
    font-family: 'Poppins';
    padding: 5px 16px;
    border: #8793a1;
    color: white;
}
.p-8{padding:8px !important}
.view-edit-button {
    background: #19b5dd;
    float: right;
    margin-bottom:15px;
    font-size: 12px;
    font-weight: 300;
    font-family: 'Poppins';
    padding: 5px 16px;
    border: #19b5dd;
    color: white;
}
ul, li {
    list-style: none;
    margin-top: 16px;
}
.left-side-menu {
    border: 1px solid #e2e2e2;
}
.logo-border {
    border: 1px solid #e2e2e2;
}
.border-left {
    border-left: 1px solid #000;
}
.admin-dashboard-background{
background-color:#d4eef5;
}
.mainmenu {
    padding-left: 30px;
}
.text-center{
text-align:center;
}
.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    padding: 0 0;
    margin-bottom: 0;
    list-style: none;
}
.view-edit-btn-aln{
  padding:10px;
}
.box-header{
font-size: 22px;
font-weight: 800;
}
.f-20{
font-size:20px;
}
.p-l-20{padding-left:20px;}
.p-l-10{padding-left:10px;}
.p-l-14{padding-left:14px}
.footer-text-span{padding:0px 10px;}
.footer-div{text-align:center;background:#e6e6e6;padding-top:10px}
.logout-button{
padding: 25px 40px 0px 0px;
border: 1px solid #e2e2e2;
}
.course-table-div{
margin-top:0px;text-align:center;padding-top:20px;overflow:auto;margin-bottom:20px
}
.content-table-div{margin-top:0px;padding:13px;text-align:center;overflow:auto}
.content-table-div-bottom{margin-top:0px;text-align:center;padding:14px;overflow:auto;margin-bottom:30px}

.courses-table{ width: 100%; border-collapse: collapse;}
.courses-table tr th {border-right: #000 thin solid;}
.courses-table tr td {border-right: #000 thin solid;padding: 0px 10px 0px 10px;}
.courses-table tr th, .rate-table tr td{  text-align: center;}
.courses-table tr td:last-child {border:none;}
.courses-table tr th:last-child {border:none;}



<!--Menu  -->
.topnav {
overflow: hidden;
background-color: #333;
}

.topnav a {
  float: left;
  display: block;
  color: #000;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
}

.topnav a:hover {
  color: black;
}

.topnav a.active {
  color: white;
}

.topnav .icon {
  display: none;
}


.sidenav-icon{
  display: none;
}


.sidenav {
overflow: hidden;
background-color: #fff;
}

.sidenav a {
  /*float: left;*/
  float: none;
  display: block;
  color: #000;
  text-align: left;
  padding: 2px 18px;
  text-decoration: none;
  font-size: 12px !important;
}

.sidenav a:hover {
  color: black;
}


.sidenav a.active {
  color: white;
}

.sidenav .icon {
  display: none;
}
.sidenav .closebtn {
  display: none;
}

.centre-creation-box{
width: 100%;
height: auto;
background-color: #fff;
padding: 15px;
margin-left:0px;
margin-bottom: 15px;
border: 1px solid #e2e2e2;
}

.form-control{ font-size: 0.9rem !important;border-radius:0}
.create-centre-label{font-family: 'Poppins';}
.clr-red{
color: #e61a1a;
font-weight: 900;
font-size: 16px;
}

.create-centre-button{
background-color: #ffd000;
font-weight: 600;
padding: 3px 20px;
float: right;
margin-bottom: 15px;
font-size: 12px;
border: #ffd000;
color: white;
font-family: 'Poppins';
}
input:focus{border: 1px solid #ced4da;}




select {
    padding: 2px;
    -webkit-appearance: menulist-button;
}
select {
    padding: 2px;
    border: 1px solid #ced4da;
    outline: 0;
    text-transform: capitalize;
}
label{font-family: 'Poppins';}
select,
option {
    width: 100%;
    background: #fff;
    text-transform: capitalize;
    font-family: 'Poppins';
}
.p-t-30{padding-top:30px;}
.search-button{
background-color: #19b5dd;
font-weight: 600;
padding: 3px 17px;
float: right;
margin-bottom: 15px;
font-size: 12px;
border: #19b5dd;
color: white;
font-family: 'Poppins';
}
.create-centre-account-button{
background-color: transparent;
font-weight: 600;
padding: 0px 17px;
float: right;
margin-bottom: 15px;
font-size: 12px;
border: 2px solid #19b5dd;
color: #19b5dd;
font-family: 'Poppins';
}
.user-account-dashboard-icon{
margin-top: -14px;
height: 25px;
}
.table {
    width: 100%;
    margin-bottom: 1rem;
    background-color: #fff;
}
.table-align{overflow:auto;width:100%}
table thead th{
background: #00529e !important;
color:#fff;
font-weight:300;
 vertical-align: middle;
    font-size: 13px;
font-family: 'Poppins';
    border-bottom: 2px solid #dee2e6;
}
table tbody tr td{font-size:14px;
font-family: 'Poppins';
box-shadow:none !important;}
.table-striped tbody tr:nth-of-type(odd) {
    background-color: #fff !important;
}
.w-200{width:200px}
.w-150{width:150px;}
.table-striped tr:nth-child(even) {
  background-color: #eff1f7 !important;
}
.label-font-weight{font-size:13px;font-weight:600}
.table-striped tbody tr:nth-of-type(even) {
    background-color: #f1f1f1;
}

.upload-photo{
background-color: #fff;
font-weight: 600;
margin-bottom: 15px;
font-size: 12px;
border: 2px solid #19b5dd;
color: #19b5dd;
font-family: 'Poppins';
}
.upload-profile{ width:132px !important; height: 132px !important;}
.user-account-school select{padding: .375rem;}

.text-center{text-align:center;}
.teacher-input{padding:2px !important;}
.p-0{padding:0px}
.p-l-r-15{padding-left:15px;padding-right:15px;}


.hide-actions{
text-align: center;
overflow: hidden;
display: flex;
}
.action-icon{display:flex;margin-left:2px;}
 #image {
            display: none;
        }
 #image1 {
            display: none;
        }
.form-check{padding-left:33px;}




.m-b-60{margin-bottom:60px;}
.btn {
background-color: #e6e7e7;
color: #000;
  padding: 2px 10px;
  font-size: 16px;
  border: none;
  outline: none;
}

.dropdown {
  position: relative;
  /*display: inline-block;*/
  display: flex;
  justify-content: center;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 60px;
  z-index: 1;
margin-left:-10px;
}

.dropdown-content a {
  color: black;
  padding: 5px 5px;
  text-decoration: none;
  display: block;
background-color: #fff;
border: 1px solid #e1e2e3;
}

.dropdown-content a:hover {
background-color: #e6e7e7;
color: #000;
}

.dropdown:hover .dropdown-content {
  display: block;
}
.btn:hover, .dropdown:hover .btn {
 background-color: #e6e7e7;
color: #000;
}
.dropdown-content button:hover{background-color:#e6e7e7 !important}

.table-action-button{
background: white;
color: black;
border: 1px solid #bdbebf;
width: 100%;
}
.table-action-button a{padding:0px;border:none !important;}

.alert-success{
  padding:10px;
  margin-top: 10px;
}
.alert-danger{
  padding:10px;
  margin-top: 10px;
}

<!-- Modal popup -->

.modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1050;
    display: none;
    width: 100%;
    height: 100%;
    overflow: hidden;
    outline: 0;
}
.modal{
overflow-y: auto !important;
    background: rgba(0, 0, 0, 0.3) !important;}
.fade {
    transition: opacity 0.15s linear;
}
.modal-content {
     position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 0.3rem;
    outline: 0;
}
.modal-header{padding: 0.35rem 1.25rem 0.15rem 1.25rem !important;display: block;    background: #f4f4f4; overflow: hidden;}
.modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: 1rem;
}
 .modal-sm {
    max-width: 500px !important;
}
.modal-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    padding: 0.75rem;
    border-top: 1px solid #dee2e6;
    border-bottom-right-radius: calc(0.3rem - 1px);
    border-bottom-left-radius: calc(0.3rem - 1px);
}
.modal-header h4.modal-title {
    font-size: 15px !important;
    font-weight: bold;
display: inline-block;
}
.modal-title {
    color: #333 !important;
margin-bottom: 0;
    line-height: 1.5;
}
.modal-header .close {
    padding: 2px 5px !important;
    margin: 0;
color:red;
border: none;
    background: none;
}
.close {
    float: right;
    font-size: 28px !important;
    font-weight: 700;
    line-height: 22px;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=50);
    opacity: 0.5;
}
.modal-header button.close span {
    font-size: 30px !important;
}
.btn-primary {
    border-radius: 5px !important;
    background-color: #337ab7 !important;
color:#fff !important;
font-size: 13px !important;
font-family: 'Poppins' !important;
}
.btn-danger {
    color: #fff !Important;
    background-color: #dc3545 !important;
    border-color: #dc3545;
font-size: 13px !important;
font-family: 'Poppins'!important;
}

.close {
  position: absolute;
  right: 5px;
  font-size: 40px;
  font-weight: bold;
  color: red;
}

.close:hover,
.close:focus {
  color: #f44336;
  cursor: pointer;
}


<!-- Select2 Field  -->

.select2-container--default .select2-selection--single {
  background-color: #fff;
border: 1px solid #ced4da;
  border-radius: none !important;
}
.select2-container--default .select2-selection--single {
  background-color: #fff;
  border: 1px solid #aaa;
  border-radius:0 !important;
}
.select2-container .select2-selection--single {
  box-sizing: border-box;
  cursor: pointer;
  display: block;
  height: 35px !important;
  user-select: none;
  -webkit-user-select: none;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #444;
  line-height: 31px !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 31px !important;
  position: absolute;
  top: 1px;
  right: 1px;
  width: 20px;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: #ddd !important;
  color: #000 !important;
}
.select2-container--default .select2-results__option[aria-selected="true"] {
  background-color: #fff !important;
}
.select2-results__option[aria-selected] {
  cursor: pointer;
  margin-top: 0px !important;
  background: #fff;
}
.select2-results__option[aria-selected]:hover {
    background: #ddd !important;
}
.select2-results__option {
  padding: 6px;
  margin-top: 0px !important;
  user-select: none;
  -webkit-user-select: none;
}
.select2-dropdown {
  background-color: white;
  border: 1px solid #aaa;
    border-bottom-color: rgb(170, 170, 170);
    border-bottom-style: solid;
    border-bottom-width: 1px;
  border-radius: 0px !Important;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
  box-sizing: border-box;
  display: block;
  position: absolute;
  left: -100000px;
  width: 100%;
  z-index: 1051;
}


.add-child-button{
background: #19b5dd;
font-size: 15px;
font-family: 'Poppins' !important;
font-weight: 500;
padding: 3px 7px !important;
color: #fff;
float: right;
margin: 30px 10px 30px 10px;
width: 130px;
border: #19b5dd;
}
.child-div-back{
background:#dcf3f9;
}
.child-div-align{
position: relative;
margin-top: 30px;
}



.contact-support-button{
background-color: transparent;
font-weight: 600;
margin-bottom: 15px;
font-size: 12px;
border: 2px solid #19b5dd;
color: #19b5dd;

float: right;
margin:15px;
padding: 3px 15px;
}
.contact-support-main-text{font-size:22px;font-weight:700;font-family: 'Poppins';}
.contact-support-sub-text{font-size:17px;font-weight:400;font-family: 'Poppins';}
.m-b-0{margin-bottom:0px !important}



.ongoing-cls-bg{background-color:#f2f2f2 !important}
.ongoing-cls-1{
background-color: #fff;
margin-top: 0px;
text-align: center;
padding: 20px;
margin-left:0px;
overflow: auto;
margin-bottom:50px;
}
.ongoing-cls-1-header{
color: #00529e;
font-family: 'Poppins';
font-size: 18px;
font-weight: 600;
}
.ongoing-cls-text{
justify-content: left !important;
width: 100%;
display: flex;
text-align:left;
font-family: 'Poppins';
font-size: 15px;
font-weight: 500;
}
.cls-submit-button {
  background-color: #ffd000;
  font-weight: 800;
  padding: 5px 20px;
  float: left;
  margin-bottom: 15px;
  font-size: 12px;
  border: #ffd000;
  color: white;
font-family: 'Poppins';
border-radius:7px;
}
.cls-continue-btn {
  background-color: #fff;
  font-weight: 500;
  margin-bottom: 15px;
  font-size: 14px;
float:right;
  border: 2px solid #19b5dd;
  color: #19b5dd;
  font-family: 'Poppins';
padding:5px 20px;
}
.float-left{float:left;text-align:left;}
.cls-course-img{ height:180px;width:100%;}


#myProgress {
  width: 100%;
  background-color: #ddd;
border-radius:10px;
}
.progress-bar-empty {
  height: 10px !important;
background-image:none !important;
}
#myBar {
  width: 33%;
  height: 10px;
 background-image: -webkit-linear-gradient(-45deg, transparent 33%, rgba(0, 0, 0, .1) 33%, rgba(0,0, 0, .1) 66%, transparent 66%), -webkit-linear-gradient(top, rgba(255, 255, 255, .25), rgba(0, 0, 0, .25)), -webkit-linear-gradient(left,#5f8bd2,#7a99b4,#7b9ab3,#c5bc55,#ddc532, #e7c924 ,#facf08);
background-size: 20px 12px, 95% 100%, 100% 100%;
  text-align: center;
  line-height: 30px;
  color: white;
border-radius:10px;
}
.cls-progress{
font-size: 12px;
font-family: 'Poppins';
float: left;
font-weight: 600;
}
.course-font{
font-size: 15px;
font-weight: 600;
width:310px !important;
text-align: left !important;
padding-left: 40px !important;
padding-right: 0px !important;
}
.content-font{
    font-size: 15px;
    font-weight: 600;
    text-align: left !important;
    padding-left: 30px !important;
    }
.width-100{width:100px}
.assignment-button {
  background-color: #0047ba;
  font-weight: 800;
  padding: 5px 20px;
  float: left;
  margin-bottom: 15px;
  font-size: 12px;
  border: #0047ba;
  color: white;
  font-family: 'Poppins';
  border-radius: 7px;
}
.view-course-button {
  background: #19b5dd;
  float: right;
  margin-bottom: 15px;
  font-size: 13px;
  font-weight: 600;
  font-family: 'Poppins';
  padding: 5px 16px;
  border: #19b5dd;
  color: white;
}
.line-h-10{line-height:10px;}
.subject-d-height{height:150px;}
.back-button{
background: #f0f1f1;
height: 40px !important;
/*font-weight: 600;*/
padding: 3px 20px;
font-size: 14px;
border: 1px solid #d0d2d3;
color: #000;
font-family: 'Poppins';
}
.send-button {
  background-color: #ffd000;
  font-weight: 600;
  padding: 3px 25px;
  float: right;
  margin-bottom: 15px;
  font-size: 14px;
  border: #ffd000;
  color: white;
  font-family: 'Poppins';
}
.add-file-button {
background: #19b5dd;
font-size: 16px;
font-family: 'Poppins';
font-weight: 500;
padding: 6px 5px !important;
color: #fff;
float: right;
width: 110px;
border: #19b5dd;
}
.upload-file-material{
background-color: #fff;
font-weight: 600;
margin: 2px 10px;
font-size: 12px;
border: 2px solid #19b5dd;
color: #19b5dd;
font-family: 'Poppins';
padding: 3px 17px;
}
.upload-thumbnail-button {
  background-color: #fff;
  font-weight: 600;
  margin-bottom: 15px;
  font-size: 14px;
  border: 2px solid #19b5dd;
  color: #19b5dd;
  font-family: 'Poppins';
  padding: 3px 20px;
}
.text-center{text-align:center}
.done-button{
background-color: #19b5dd;
height: 40px !important;
/*font-weight: 600;*/
padding: 6px 25px;
float: right;
margin-bottom: 15px;
font-size: 14px;
border: #ffd000;
color: white;
font-family: 'Poppins';
}
.upload-files-header{
font-family: 'Poppins';
font-size: 20px;
font-weight: 600;
background: #fff;
border: 1px solid #e2e2e2;
padding: 15px;
color: #6e6e6e;
}
.width-200{width:200px}

.checkbox-group-border {
    border: 1px solid #e8e9e9;
}

.checkbox-group {
    height: 160px;
    overflow: auto;
}
.roles-check-back tbody tr:nth-of-type(odd) {
    background-color: #f1f1f2;
}

.roles-check-back tbody tr:nth-of-type(even) {
    background-color: #fff;
}
.form-check {
    margin-top: 0px !important;
}
.form-check-input {
    width: 20px;
    height: 20px;
    margin-left: -8px
}

.form-check-label {
    margin-left: 3%;
    border: none !important;
    padding: .205rem .35rem;
    width: 41%;
}
.checkbox-label {
    width: 90% !important;
    margin-left: 5% !important;
}
.assign-unassign-button {
  padding: 0px 9px;
margin-top: 0px;
font-weight: 500;
width: 120px;
height: 35px;
float: right;
color: #0198d5;
background-color: #fff;
border: 1px solid #0198d5;
}

.assignment-button-alignment{
display: inline-grid;
align-content: center;
padding: 60px;
}
.save-button {
  background-color: #ffd000;
  font-weight: 600;
  padding: 3px 20px;
  float: right;
  margin-bottom: 15px;
  font-size: 14px;
  border: #ffd000;
  color: white;
  font-family: 'Poppins';
}

.student-namelist-button{
background-color: #19b5dd;
font-weight: 700;
padding: 10px 30px;
float: right;
margin-bottom: 15px;
font-size: 15px;
border: #19b5dd;
color: white;
font-family: 'Poppins';
}
.classroom-save-button{
background-color: #ffd000;
font-weight: 600;
padding: 3px 20px;
float: right;
margin-bottom: 15px;
font-size: 15px;
border: #ffd000;
color: white;
font-family: 'Poppins';
}
.student-account-button{
background-color: transparent;
font-weight: 600;
padding: 6px 17px;
float: right;
font-size: 16px;
border: 2px solid #19b5dd;
color: #19b5dd;
font-family: 'Poppins';
}

.dataTables_wrapper .dataTables_paginate .paginate_button.previous{
  border: 1px solid #dee1e2;
  background: #fff;
  width: 240px; 
  float:left;
  background-image: url("/assests/images/icon_arrow_back.png");
  background-repeat: no-repeat;
  background-position: 24px center;
  background-size: 15px 15px
}
.dataTables_wrapper .dataTables_paginate .paginate_button.next{
  border: 1px solid #dee1e2;
  background: #fff;
  width: 240px; 
  float:right;
  background-image: url("/assests/images/right-arrow.png");
  background-repeat: no-repeat;
  background-position: right 24px center;
  background-size: 15px 15px
}
.dataTables_paginate .paging_simple_numbers{
	align-items: center;
    text-align: center;
}
.dataTables_wrapper .dataTables_paginate {
  width: 100%;
  text-align: center;
  padding-top: 0.25em;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.previous:hover{
  border: 1px solid #dee1e2;
  background: #fff;
  color:#000 !important;
  width: 240px; 
  float:left;
  background-image: url("/assests/images/icon_arrow_back.png");
  background-repeat: no-repeat;
  background-position: 24px center;
  background-size: 15px 15px
}
.dataTables_wrapper .dataTables_paginate .paginate_button.next:hover{
  border: 1px solid #dee1e2;
  background: #fff;
  width: 240px; 
  color:#000 !important;
  float:right;
  background-image: url("/assests/images/right-arrow.png");
  background-repeat: no-repeat;
  background-position: right 24px center;
  background-size: 15px 15px
}











.md-stepper-horizontal {
	display:table;
	width:100%;
	height: auto;
background-color: #fff;
padding:15px 150px;
border: 1px solid #e2e2e2;
margin-top: 15px !important;
}
.md-stepper-horizontal .md-step {
	display:table-cell;
	position:relative;
                  width:100px;
	<!-- padding:24px;-->
}
.md-stepper-horizontal .md-step:hover,
.md-stepper-horizontal .md-step:active {
	background-color:rgba(0,0,0,0.04);
}
.md-stepper-horizontal .md-step:active {
	border-radius: 15% / 75%;
}
.md-stepper-horizontal .md-step:first-child:active {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
.md-stepper-horizontal .md-step:last-child:active {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.md-stepper-horizontal .md-step:hover .md-step-circle {
	background-color:#757575;
}
.md-stepper-horizontal .md-step:first-child .md-step-bar-left,
.md-stepper-horizontal .md-step:last-child .md-step-bar-right {
	display:none;
}
.md-stepper-horizontal .md-step .md-step-circle {
	width:30px;
	height:30px;
	margin:0 auto;
background:none !important;
	<!-- background-color:#999999; -->
	border-radius: 50%;
	text-align: center;
	line-height:30px;
	font-size: 16px;
	font-weight: 600;
	color:#FFFFFF;
}
.md-stepper-horizontal.green .md-step.active .md-step-circle {
	<!-- background-color:#00AE4D; -->
}
.md-stepper-horizontal.orange .md-step.active .md-step-circle {
	background: none !important;
}
.md-stepper-horizontal .md-step.active .md-step-title.active{
color:#00529e;
}
.md-stepper-horizontal .md-step.active .md-step-circle {
	<!-- background-color: rgb(33,150,243);-->
}
.md-stepper-horizontal .md-step.done .md-step-circle:before {
	font-family: 'Poppins';
	font-weight:100;
	content: "\f00c";
}
.md-stepper-horizontal .md-step.done .md-step-circle *,
.md-stepper-horizontal .md-step.editable .md-step-circle * {
	display:none;
}
.md-stepper-horizontal .md-step.editable .md-step-circle {
	-moz-transform: scaleX(-1);
	-o-transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
}
.md-stepper-horizontal .md-step.editable .md-step-circle:before {
	font-family: 'Poppins';
	font-weight:100;
	content: "\f040";
}
.md-stepper-horizontal .md-step .md-step-title {
	margin-top:5px;
	font-size:16px;
	font-weight:600;
}
.md-stepper-horizontal .md-step .md-step-title,
.md-stepper-horizontal .md-step .md-step-optional {
	text-align: center;
	color:rgba(0,0,0,.26);
}
.md-stepper-horizontal .md-step.active .md-step-title {
	font-weight: 600;
	color:rgba(0,0,0,.87);
}
.md-stepper-horizontal .md-step.active.done .md-step-title,
.md-stepper-horizontal .md-step.active.editable .md-step-title {
	font-weight:600;
}
.md-stepper-horizontal .md-step .md-step-optional {
	font-size:12px;
}
.md-stepper-horizontal .md-step.active .md-step-optional {
	color:rgba(0,0,0,.54);
}
.md-stepper-horizontal .md-step .md-step-bar-left,
.md-stepper-horizontal .md-step .md-step-bar-right {
	position:absolute;
	top:15px;
	height:1px;
	border-top:1px solid #DDDDDD;
}
.md-stepper-horizontal .md-step .md-step-bar-right {
	right:0;
	left:50%;
	margin-left:20px;
}
.md-stepper-horizontal .md-step .md-step-bar-left {
	left:0;
	right:50%;
	margin-right:20px;
}
.lesson-background{
background: #f0f0f0;
}
.lesson-padding{padding-left:5%;margin-top:-50px}
.quiz-padding{padding-left:5%;/*margin-top:-50px;*/}
.course-child-buttons{
background: #19b5dd;
font-size: 15px;
font-family: 'Poppins';
font-weight: 500;
padding: 6px 6px !important;
color: #fff;
float: right;
margin: 30px 10px 30px 10px;
width: 90px;
border: #19b5dd;
}
.student-above-span{
line-height: 1.1;
font-size: 12px;
width: 300px;
margin-top: -20px;
}
.minus-button{
color: #ea2045;
margin-right: 10px;
}
.quiz-pointing-arrow{margin-left: -20px;margin-top: 10px;}
.lesson-pointing-arrow{margin-left: -20px;margin-top: 10px;}


.course-preview-content{
background-color: #fff;
margin-top: 0px;
text-align: center;
padding: 20px;
margin-left: 0px;
overflow: auto;
margin-bottom: 50px;
}
.course-preview-img{
 background: #f0f0f0;
border: 1px solid #d1d2d3;
}
.course-preview-header{
color: #00529e;
font-family: 'Poppins';
font-size: 20px;
font-weight: 600;
text-align:left;
}
.course-preview-text{
justify-content: left !important;
width: 100%;
display: flex;
text-align: left;
font-family: 'Poppins';
font-size: 15px;
font-weight: 500;
line-height: 1.2;
margin-top:30px;
}



.previewnav {
overflow: hidden;
background-color: #fff;
color: #000;
margin-top: 20px;
border-bottom:2px solid #6b9ac6;
padding:0px;
}

.previewnav a {
  float: left;
 background-color: #f0f0f0;
color: #000;
  text-align: center;
padding: 9px 35px;
  text-decoration: none;
  font-size: 17px;
margin-left:1px;
}

.previewnav a:hover {
  background-color: #ddd;
  color: black;
}

.previewnav a.active {
  background-color: #00529e;
  color: white;
}
.overview-tab-text{
justify-content: left !important;
width: 100%;
/*display: flex;*/
text-align: left;
font-family: 'Poppins';
font-size: 16px;
font-weight: 500;
line-height: 1.5;
margin-top: 30px;
}
.curriculum-unit-div{
padding: 20px 0px;
font-weight: 500;
font-size: 16px;
text-align: left;
margin-bottom:2px;
}
.preview-unit-heading{
font-size: 20px;
font-weight: 700;
font-family: 'Poppins';
text-align: left;
margin-top: 30px;
margin-bottom: 5px;
}
.unit-subheading{
font-size: 15px;
text-align: left;
font-weight: 500;
font-family: 'Poppins';
margin-bottom: 15px;
}

.curriculum-unit-table{
width: 100%;
border-collapse: collapse;
background:#f2f2f2;
}
.curriculum-unit-table tr {
border-bottom: 1px solid #fff;
}
.curriculum-unit-table tr td {
  padding: 15px 5px 15px 5px;

}
.curriculum-table-box{
overflow:auto;
}
.clock-icon{
color: #bababa;
margin-right: 10px;
vertical-align: middle;
font-size: 18px;
}
.unit-td-font{
font-size:16px;
color: #737171;
}
.permission-msg{
  padding: 216px 50px;
    text-align: center;
}
.star-color{
color:#ffd100
}
.star-grey-color {
  color: #b7b5ae;
}
.table-shadow{
box-shadow:0px 3px 5px -1px rgb(0 0 0 / 20%), 0px 6px 10px 0px rgb(0 0 0 / 14%), 0px 1px 18px 0px rgb(0 0 0 / 12%)
}
.comments-add-button{
background: #19b5dd;
float: right;
font-size: 13px;
font-weight: 600;
font-family: 'Poppins';
padding: 5px 16px;
border: #19b5dd;
color: white;
}
.comments-input{width:100%;}
.disable-text{color: #9b9daf;font-size: 14px;}
.grade-student-button{
background: #19b5dd;
float: right;
margin-bottom: 15px;
margin-right:20px;
font-size: 16px;
font-weight: 500;
font-family: 'Poppins';
padding: 6px 25px;
border: #19b5dd;
color: white;
}
.classroom-cls-text{
  justify-content: left !important;
  width: 100%;
  display: flex;
  text-align: left;
  font-family: 'Poppins';
  font-size: 15px;
  font-weight: 500;
  line-height: 1.5;
  margin-top: 10px;
}
.classroom-view-button{
background: #19b5dd;
float: right;
margin-top: -20px;
margin-right: -15px;
font-size: 12px;
font-weight: 300;
font-family: 'Poppins';
padding: 5px 16px;
border: #19b5dd;
color: white;
}
.published-button{
background: #67b64f;
float: right;
margin-top: -15px;
margin-right: -15px;
font-size: 13px;
font-weight: 500;
font-family: 'Poppins';
padding: 2px 25px;
border: #67b64f;
color: white;
}
.draft-button{
background: #ffcc00;
float: right;
margin-top: -15px;
margin-right: -15px;
font-size: 13px;
font-weight: 500;
font-family: 'Poppins';
padding: 2px 25px;
border: #ffcc00;
color: white;
width:100px;
}

.m-r-35{margin-right:35px;}


table.dataTable thead span.sort-icon {
  /*display: inline-block;*/
  padding-left: 20px;
  width: 12px;
  height: 12px;
}

table.dataTable thead .sorting span { background: url('http://cdn.datatables.net/plug-ins/3cfcc339e89/integration/bootstrap/images/sort_both.png') no-repeat center right; }
table.dataTable thead .sorting_asc span { background: url('http://cdn.datatables.net/plug-ins/3cfcc339e89/integration/bootstrap/images/sort_asc.png') no-repeat center right; }
table.dataTable thead .sorting_desc span { background: url('http://cdn.datatables.net/plug-ins/3cfcc339e89/integration/bootstrap/images/sort_desc.png') no-repeat center right; }

table.dataTable thead .sorting_asc_disabled span { background: url('http://cdn.datatables.net/plug-ins/3cfcc339e89/integration/bootstrap/images/sort_asc_disabled.png') no-repeat center right; }
table.dataTable thead .sorting_desc_disabled span { background: url('http://cdn.datatables.net/plug-ins/3cfcc339e89/integration/bootstrap/images/sort_desc_disabled.png') no-repeat center right; }

/*Question 1 (Connect the dots)---------------------------- Start*/

.accordion-button::after {
  background-image: url("https://www.svgrepo.com/show/80156/down-arrow.svg");
  transform: scale(.7) !important;
  color: #cfcfcf;
  margin-right: 14px !important;
}
.accordion-button:not(.collapsed)::after {
  background-image: url("https://www.svgrepo.com/show/93813/up-arrow.svg"); margin-right: 14px;}
    .accordion-button:not(.collapsed){background-color: #f5f5f5!important;color:#787878!important; font-weight: 600;}
    
.course-child-buttons{
min-width: auto !important;
width: auto!important;
}
p { padding: 12px; color: #8f959c; }
.ques3 select{padding:.5rem;}

.close-window {position: absolute; right: 5px; z-index: 9999;}

.btn-delete {text-align: center !important; height: 40px !important; border-radius: 0px !important; background: #d41f34 !important; padding: 5px 20px; font-size: 14px !important; border: 1px solid #d0d2d3; margin-left: 5px;}
/*Question 1 (Connect the dots)---------------------------- end*/

.select2-search--inline{
  margin-top:0px !important;
}



/*--------------------------------------safari-------------------------------------------------------------*/
[type=button], [type=reset], [type=submit], button {
    -webkit-appearance: none !important;
}

.header-right
{
    -webkit-justify-content: flex-end;
}

/*--------------------------------------Create Course img/video-------------------------------------------------------------*/
/*.courses-v-i*/
.img-container {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 ratio */
  height: 0;
  overflow: hidden;
}

.img-container img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.img-container video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


.img-container-2 {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 ratio */
  height: 0;
  overflow: hidden;
}

.img-container-2 img {
  position: absolute;
  top: 0;
  text-align: center;
  margin: 0px auto;
  width: auto;
  height: 100%;
}
.img-container-2 video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
/*-----------Hover Blue none-----------------*/
.create-centre-account-button a:hover{ color: #19b5dd;}

.teacher_search_btn { margin-right: 13px !important; }

.centre_user_account_search_btn { margin-right: 13px !important; }

tbody, td, tfoot, th, thead, tr { padding-left: 18px !important; }

.select2-container{
  width: 100% !important;
}