/* :root{
    --primary:#7c3200;
    --main-cards:#7c3200;   
    --test-bg: -webkit-linear-gradient(135deg, rgb(0,0,0) 0%, rgb(62, 1, 4) 100%);
    --bg-opacity:0.9;
    --disabled-button:#724a30;

}

.test{
    --main-cards:#005c6b;   
    --disabled-button:#4f6978
     rgb(0, 12, 35);
    rgb(0, 52, 58);     
    background-image: -webkit-linear-gradient(135deg, rgb(75,0,0) 100%, rgb(125,50,0) 0%);
    opacity: 0.9;
    background-color:var(--primary);
    opacity: 1.4;
} 
*/
.highlightSection {
    background-color: yellow;
  }
*:not(i){
    font-family: 'Nunito' !important;
}
html,body{
    height:auto !important;
    overflow:auto !important;
}
.scrolled {
    background-color: var(--primary);
    opacity: 1;
    transition:all 0.4s ease-in-out;
    position: relative;
    transform: translate(0,-100px);
}
.no-zoom {
    touch-action: manipulation; /* Allow touch events */
    pointer-events: none; /* Disable mouse events */
  }
.multi.dropdown-item{
    display:flex;
    align-items:center;
}
button.botui-actions-buttons-button{
    background-color: var(--primary);;   
}
.quiz-button{
    display: none;
}
.lightPlayer.presentation_player.fluidImage.fluidLayout .tall_img .slide_image {
    width: 100% !important;
}

@media (max-width:1024px) and (min-width:400px){
    .descrip {
        margin-left:-35px;
    }
}
.certificateFile {
    left: 28%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    height: 27px;
    left: -moz-calc(28%);
    left: -webkit-calc(27%);
    width:219px;
    margin-top: 7px;
  }
  
  @-moz-document url-prefix() {
    .certificateFile {
      left: 26%;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      position: relative;
      height: 27px;
      left: -moz-calc(26%);
    left: -webkit-calc(26%);
    width:193px;
    margin-top: 2px;
    }
  }
  .certificateFilename {
    margin-left: -221px;
    margin-left: -moz-calc(-221px);
    margin-left: -webkit-calc(-221px);
 }
  @-moz-document url-prefix() {
    .certificateFilename {
       margin-left: -189px;
       margin-left: -moz-calc(-189px);
       margin-left: -webkit-calc(-189px);
    }
}

.foot_mindmap a {
    opacity: 0.75;
    display: inline-block;
    /* width: 15%; */
    font-size: 10px;
    padding: 6px 0 4px 84px;
    cursor: pointer;
    padding: 0 !important;
}
.botui-actions-text-submit {
    display: inline-block !important;
    background-color: var(--primary) !important;
    border-radius: 0px !important;
    width: 68px !important;
    height: 30px !important;
}
.botui-actions-text-submit:hover{
    background-color: #fff !important;
    color: var(--primary);
    border: 2px var(--primary) solid;
}
.botui-message-content {
    background-color: white !important;
    border: 1px grey solid
}
.botui-message-content.human {
    background-color: var(--primary) !important;
    border: 0;
}
form.botui-actions-text {
    /* float: right; */
    margin: 0;
    text-align: right;
}
.botui-app-container {
    width: 78% !important;
    height: fit-content !important;
    max-height: 530px !important;

    margin: 0 auto;
    overflow: hidden !important;
}

input.botui-actions-text-input{
    padding-right: 50px;
    width: 80%;
    margin-right: -38px;
}
input::selection{
    background-color: #4285f4;
    color: white;
  }
  
.clip{
    font-size: 25px;
}

@media screen and (max-width:1200px){
    input.botui-actions-text-input{
        width: 65%;
    }
}
@media screen and (max-width:500px){
    input.botui-actions-text-input{
        width: 82%;
    }
}
@media screen and (max-width:400px){
    input.botui-actions-text-input{
        width: 75%;
    }

}
.text{
        display: inline-block;
        /* margin-left: 12px; */
        margin-top: 2px;
        color:white;
}
.text-time{
    margin-left: 5px;
    color: lightgrey;
    font-size: smaller;
}
.chat::before{
    position: absolute;
    right: 100px;
    margin-right: 0 !important;
}
.botui-messages-container{
    max-height: 60vh;
    overflow: auto;
    overflow-x: hidden;
    display: inline-block !important;
    width: 100%;
}
.botui-actions-container {
    padding: 10px 20px;
    padding-top: 20px !important
    ;
    padding-left: 0 !important;
    padding-right: 0 !important;

}
.botui-container {
    height: 103% !important;
}
.sendImage{
    text-align: right;
    margin-right: 25px;
}
.addNotes{
    margin: 10px;
}
.addNotes i{
    margin: 0;
}
.brQuiz{
    display: none;
}
.previousButton.mcq{
    margin-left: -188px;
}
.grid{
    /* line-height: 1.2; */

    color: #000;
    height: 40px;
    background-color: #fff;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid black;
    font-size: 17px;
    font-family: 'Nunito';
    width: 25%;
    display: inline-block;
    padding-top: 2.5%;
}
.grid:hover{
    text-decoration: underline;
    font-weight: bolder;
    text-underline-offset: 4px;
    cursor: pointer;
    /* text-decoration-thickness: auto; */
    text-shadow: 0px 0.5px, 0.5px 0.5px, 0px 0px;
}
.current{
    background-color: var(--primary);
    text-decoration: none;
    text-underline-offset: 4px;
    color: white;
    cursor: pointer;
    /* text-decoration-thickness: auto; */
    text-shadow: 0px 0.5px, 0.5px 0.5px, 0px 0px;

}
.grid.answered{
    color: #f46426;
    font-weight: bold;
    text-underline-offset: 4px;
    text-decoration:underline;
}

@media screen and (max-width: 995px){
       .grid {
        padding-top:1%;
    
    }
}
.popup-container .popup-body{
    font-family: 'Nunito'!important;
}

.popup-container .popup-buttons .button{
    font-family: 'Nunito'!important;
}

.redTimer {
    background-color: red;
    color: #fff !important;
}
.redTimer h1,.redTimer h4{
    color: #fff;
}
.rectangle{
    padding: 2.5px 5px;
padding-bottom: 5px;
border: 1px solid white;

}
.contact-us-tittle h4{
    font-size: 80px;
    color: White;

}
#contact-us{
    padding-top: 60px;
    min-height: 40vh;
    
}
.progress
{
    width: 77%;
}
@media screen and (max-width:1350px){
    .progress
    {
        width: 75%;
    }
}
@media screen and (max-width:500px){
    .progress
    {
        width: 65%;
    }
}
a,
button,
:focus,
a:focus,
button:focus,
a:active,
a:hover {
  outline: 0 !important; }

#contact-us .contact-item{
    min-width: 200px;
    min-height: 150px;
    margin-bottom: 25px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.contact-item i{
    font-size: 80px;
    color: black;
    margin-bottom: 5px;

}
.contact-item h5{
    font-size: 20px;
    color: black;
    margin-bottom: 5px;

}
.contact-item h6{
    font-size: 15px;
    color: grey;
    margin-bottom: 5px;
    
}
.contact-row{
    display: flex !important;
    justify-content: center;
}

.choose-heading{
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-left: 0;
    width: 100%;
}


.below-link{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    margin: 0 !important;

}
.back-arrow{
    color: #2e556b;
    margin-left: 5px;
    margin-top: 4px;
}


.back-arrow::before{
    font-size: 35px;
}
button.button.button-video1 {
    margin-left:0 !important;
}
@media screen and (max-width:1440px){
    .main-title h3.mt0{
        font-size: 38px;

    }
    .popup-container .popup-body{
        overflow: hidden;
    }

    .main-title p.courseTitle1{
        font-size: 23px;
    }
    button.button.button-video1 {
    margin-right: 18px;
}

}
/* @media screen and (max-width:1400px){
    .progress{
        width: 68%;
    }
} */

@media screen and (min-width:1050px) and (max-width:1200px) {
    .add-video{
        width: 67vw;
        overflow: hidden;
    
    }

    
}

@media screen and (max-width:1024px){

      .main-title h3.mt0{
        font-size:28px;


    }

    .main-title p.courseTitle1{
        font-size: 18px;
    }
    button.button.button-video1 {
    margin-right: 20px;
}
}

@media screen and (max-width:767px){
    iframe :not(.fullScreen){
        margin-top: -15%;
        margin-bottom: -15%;
    }
    .brQuiz{
        display: block;
    }
    .remaining{
        margin-left: -1% !important;
    }
    /* .progress
    {
        width: 65%;
    } */
    #section-1{
    width: 99%
    }
    .main-title h3.mt0{
        font-size: 27px;

    }

    .main-title p.courseTitle1{
    font-size:18px
    }


    #ccn-main-region .row {
    margin: 0px auto;
    display: block;

    }


    button.button.button-video1 {
        margin-right: 20px;
    }


  }
  .aboveLink{
      overflow: hidden;
    display: flex;
    margin-bottom: 13px;
    margin-top: -30px;
    margin-bottom: 0 !important;
    justify-content: center;
}
  @media screen and (max-width:520px){

    
    .contact-us-tittle h4{
        font-size: 50px;
    
    }

}


@media screen and (max-width:480px){
    .ccn-identify-course-intro {
    margin-bottom: 2;
    border-bottom: 2px solid rgb(237, 239, 247);
    }
    .main-title{

        margin: inherit 5px;

    }
    
    .education{
        font-size: 20px !important;
    }
    .mobile-resposnsive-title{
        font-size: 25px !important;
    }

    div#inst108 iframe:not(.fullScreen){
        width: 100vw;
        height: 48vh;
        margin-left: -28px;
        margin-top: 0px;
        margin-bottom: -20px;
    }
    div#inst111 iframe:not(.fullScreen){
        width: 100vw;
        height: 48vh;
        margin-left: -28px;
        margin-top: 0px;
        margin-bottom: -20px;
    }
    .cs_row_two .cs_overview .editmode p{
        font-size: 20px;
        /* color: red; */
}
    .cs_row_two .cs_overview {
        padding: 0px 8px 0px 8px;
        margin: 20px 5px;
        border-bottom: 2px solid rgb(237, 239, 247);
        border-top: 0px;
        border-right: 0px;
        border-left: 0px;
        margin-bottom: 30px;
}
    .feature_course_widget {
        margin:10px !important;
        padding : 25px !important;

}

    .main-title h3.mt0{
        font-size:27px;

    }

    .main-title p.courseTitle1{
    font-size:16px;
    }

    .ui_kit_table .noBorder td{
    padding-left:0px;
    padding-right:0px;
    }

    _.cs_row_three .course_content{
    padding:20px 0px 0px 5px
    }

    #ccn-main-region .row {
        margin: 0px auto;
        display: block;
    }

    .our-courses .row {
        margin: 0px auto;
        display: block;

    }

    .col-md-12{
        padding:0 3px;
    }

   .container {
    padding: 0px 5px;
}

   .cs_row_three .course_content {
    padding: 30px 20px 8px;
    border-bottom: 2px solid rgb(237, 239, 247);
    border-top: 0px;
    border-right: 0px;
    margin-bottom: 30px;
    border-left: 0px;
}

   .blog_tag_widget .blueHead {
    padding: 10px 8px 20px 10px;
    border-bottom: 2px solid rgb(237, 239, 247);
    border-top: 0px;
    border-right: 0px;
    margin-bottom: 20px;
    border-left: 0px;
}

   .instructor_pricing_widget {
    padding: 10px 8px 8px 10px;
    border-bottom: 2px solid rgb(237, 239, 247);
    border-top: 0px;
    border-right: 0px;
    margin-bottom: 20px;
    border-left: 0px;
    margin-right: 0;
}
button.button.button-video1 {
    margin-right: 20px;
}

}
@media screen and (max-width:786px){

    #ccn-main-region #graph-row1{
        padding: 0px 8px 0px 8px;
        margin: -10px 0px 0px -85px;
}
    #ccn-main-region #graph-row2{
        padding: 0px 8px 0px 8px;
        margin: -10px 0px 0px -85px;
}
}
@media screen and (max-width:786px){

    #ccn-main-region .shortcode_widget_table{
        padding: 0px 8px 0px 8px;
        margin: 0px 0px 0px -20px;
}
}

@media screen and (max-width:411px){

   div#inst108 iframe:not(.fullScreen){
       max-width:110vw;
       height:41vh;
       margin-left: 0 !important;
       margin-top:0px;
       margin-bottom:-15px;
    }

       div#inst111 iframe:not(.fullScreen){
        max-width:110vw;
        height:41vh;
        margin-left: 0 !important;
        margin-top:0px;
        margin-bottom:-15px;
    }

    .main-title h3.mt0{
        padding: 0px 15px;
        font-size: 24px;}

    .main-title p.courseTitle1{
        padding:0 10px;
        font-size:14.5px;}



#ccn-main-region .row {
    margin: 0px auto;
    display: block;

}

.our-courses .row {
    margin: 30px 0px -45px 0px;
    display: block;

}
button.button.button-video1 {
    margin-right: 20px;
}

}



@media screen and (max-width:360px){
    .cs_row_one .cs_title{
        font-size: 24px;
    }
    .back-arrow::before{
        font-size: 25px;
    }
    .back-arrow{
        margin-right: -1px;
        margin-top: 14px !important;
    }
   div#inst108 iframe:not(.fullScreen){
       max-width: 101vw;
       margin-left: 0 !important;
       margin-top:0px;
       margin-bottom:-15px;
       height: 36vh;
    }
    div#inst111 iframe:not(.fullScreen){
        max-width: 101vw;
        margin-left: 0 !important;
        margin-top:0px;
        margin-bottom:-15px;
        height: 36vh;
     }
    .cs_overview{
        margin:0px;
    }
    iframe:not(.fullScreen){
    height: 56vh;
    }

 .main-title h3.mt0 {
   padding: 0 10px;
   font-size: 19px;
}

  .main-title p.courseTitle1 {
    font-size: 12px;
    padding: 0 15px;



}


#ccn-main-region .row {

    margin: 0px auto;


}

.our-courses .row {

    margin: 0px auto;

    display: block;

}
button.button.button-video1 {
    margin-right: 20px;
}

}



@media screen and (max-width:320px){

    div#inst108 iframe:not(.fullScreen){
        margin-left: 0 !important;
        left:-13vw;
        margin-top:-45px;
        margin-bottom:-15px;
    }
    div#inst111 iframe:not(.fullScreen){
        margin-left: 0 !important;
        left:-13vw;
        margin-top:-45px;
        margin-bottom:-15px;
    }
    .main-title h3.mt0 {
        font-size: 16px;
        padding-left:10px;
        padding-right:10px;
   
    }
    .main-title p.courseTitle1{
        padding-left:15px;
        padding-right:15px;
        margin:0;
        font-size:10px

    }


#ccn-main-region .row {
    margin: 0px auto;
    display: block;

}

.our-courses .row {
    margin: 0px auto;
    display: block;

}
button.button.button-video1 {
    margin-right: 20px;
}

}
.add-video .popup   {
    width: 67vw ;
    max-width: 200vw;
}
.add-video{
    width: 90vw;
    margin: 0;
    left: 0;

}
.content_lib2{
    padding-right: 10px;
    padding: 0;
    margin-left: 0px;
    margin-right: 6px;
    margin-left: -10px;
    padding-right: 20px;

}

.popupPlayer{
    /* padding: 25px; */
    /* margin: 20px; */
    padding-top: 22px;
    padding-bottom: 20px;
    margin-left: -10px;
}
#player iframe:not(.fullScreen) {
    margin-right: -30px;
    height: 55vh;
    width: 39vw;
    margin-top: -26px;
}
.searchForm textarea{
    background-color: lightgray;
    width: 100%;
    border-radius: 8px;
    padding:5px;
    margin: 5px;
    margin-left: 0;
    margin-bottom: 20px;

}
.searchForm input,.pop-input{
    background-color: lightgray;
    border: none;
    /*border-radius: 8px;*/
    color: black;
    padding:5px;
    margin: 5px;
    margin-left: 0;

}

.activeVideo{
    -webkit-box-shadow: 0 0 5px 2px black;
    -moz-box-shadow: 0 0 5px 2px black;
    box-shadow: 0 0 8px 2px black;
}

.heading-underline{
    border-bottom: 1px solid #dedede !important;
}
img.video-slider-image {
    margin-top: -11%;
}
@media screen and (max-height:700px){

    .popup-container .popup-body{
        overflow-y: scroll;
        overflow-x: hidden;
    }

}
.subheading{
    font-size: 20px;
    font-family: 'Nunito';
    margin-bottom: 12px !important;
}
.section-confirm .popup .popup-body{
    overflow: hidden;
}
.mcqTest .popup .popup-body{
    min-height:480px;
}
.closed {
    -webkit-transform: translate3d(-100%, 0px, 0px);
    transform: translate3d(-100%, 0px, 0px);
    visibility: visible;
    transition: all 0.5s ease 0s;
    -webkit-transition: all 0.5s ease 0s;
}

input.lab-input {

    margin: 14px 0;
    padding: 5px;
    font-family: "SourceSansPro-Regular";
    border: 0;
    border-radius: 5px;
    background-color: #eae9e9;
    height: 35px;
    width:103%;
    color:black;


}

textarea.lab-input {
    margin: 14px 0;
    padding: 5px;
    font-family: "SourceSansPro-Regular";
    border: 0;
    border-radius: 5px;
    background-color: #eae9e9;
    height: 147px;
    width:100%;
}

span.lab-input{
    margin-top: 2px;
    color: black;
    padding: 10px;
    background-color: #eae9e9;
    position: absolute;

}

.modeButton{
    background-color:white !important;
    color:black;
}
.modeButton:hover{
    background-color:white !important;
    color:black;  
}

.publishedIcon{
    color: green;

}
.unPublishedIcon{
    color: orange;
}

.cursorPointer{
    cursor: default !important;
}
.publishButton{
    border-radius: 5px;
    margin-left: 15px;
    background-color: darkgreen;
    border: 2px darkgreen solid;
    padding: 5px 0;
    color: white;
    


}
.publishButton:hover{

    background-color: white;
    color:darkgreen;
    border: 2px darkgreen solid;
    
}
.unPublishButton{
    border: 2px solid rgb(255, 16, 83);
    border-radius: 5px;
    margin-left: 15px;
    background-color: rgb(255, 16, 83);
    padding: 5px 15px;
    color: white;



}
.blackButton{
    border: 2px solid black;
    border-radius: 5px;
    margin-left: 15px;
    background-color: white;
    padding: 5px 5px;
    color: black;
}
.blackButton:disabled{
    border-color: grey;
    color: grey;

}
.blackButton:hover{
    color: var(--primary);
    border-color: var(--primary);
}
.barIcon:hover{
    font-size: 18px;
    font-weight: bolder;
    color: #000;
}
.unPublishButton:hover{

    background-color: white;
    color:rgb(255, 16, 83);
    border: 2px rgb(255, 16, 83) solid;
    
}
.publishButton span{
    padding: 6px 12px 6px 12px;
}
.unPublishButton span{
    padding: 6px 12px 6px 12px;

}
.progress span{
    font-size: 12px;
    font-weight: 600;
    text-align: center;

}
.btn-thm3{
    font-size: 13px;
    /* border: 2px solid #ff8d00; */
    padding: 4px 12px;
}
.btn-thm3:hover{
    background-color: white;
    color: #ff8d00;
}
.categoryAcordation{
    border: 0;
    background-color: initial;

}
.categoryAcordation::before{
    margin-right: -144%;
}
.profile-popup .btn:after{
    display: none;
}
.profile-popup .btn:not(.btn-thm3):not(.modeButton){
    padding: 0;
}



.quizClock{
    display: flex;
    width: 87%; 
    justify-content: flex-end; 
}
@media (max-width: 480px){
    .onnav {
        top: -11px;
    }
}

@media (max-width: 1200px){
    .quizButton {
        margin-right: 85px;
    }
}

@media (max-width: 700px){
    .quizButton {
        max-height: 38px;
        font-size: 18px;
        padding: 4px;                
    }
}
@media (max-width:780px){
    .cs_row_four .about_ins_container .details .review_list{
        margin-right: 0px;
    }
    h3.cs_title.ng-binding{
        max-width: 70vw;
        text-overflow: ellipsis;
        text-transform: capitalize;
        margin-top: 16px;
        white-space: nowrap;
        overflow: hidden;
    }
}
@media (max-width:768px){
    .quiz-button{
        display: block;
        text-align: right;
    }

    .quiz2{
        display: none;
    }
    .topic-edit{
        margin-right: 0 !important;

    }

    .quizTopBar{
        width: 75%;
    }
    .quizClock{
        max-width: 70%;
    }
    .submit_btn{
        margin-left: 20px !important;
    }
    .previousButton.mcq{
        margin-left: -133px !important;
    }
    .botui-app-container {
        width: 100% !important;
        height: 500px;
        margin: 0 auto;
        overflow: hidden !important;
    }
    
}

@media (max-width:500px){
    .add-video .popup   {
        width: 90vw ;
        max-width: 200vw;
    }
    .pclas{
        margin-left: -5% !important;
    }
    .content_lib1.ng-pristine.ng-untouched.ng-valid.ng-empty {
        margin-left: -9% !important;

    }
    .previousButton{
        margin-left: -73px !important;
    }
    .previousButton.mcq{
        margin-left: 0px !important;
    }
    .next_btn{
        margin-left: 15px !important;
    }
    .submit_btn{
        margin-left: 0 !important;
    }

    .breadcrumb_title{
        font-size: 24px !important;
    }
    .inner_page_breadcrumb{
        padding:0 !important;
        height: 240px;
    }
    .inner_page_breadcrumb .breadcrumb_content{
        margin-top: 95px !important;
    }
    .aboveLink.textbook{
        overflow: hidden;
        display: inline-flex;
        justify-content: start;
        margin-top: -10px;
    }
    .about_ins_container{
        padding: 10px 5px !important;
        border-top: 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        border-bottom: 2px solid rgb(237, 239, 247) !important;
    }
    .blog_tag_widget {
        /* width: 123%; */
        padding: 10px 5px !important;
        border-top: 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        margin-right: 0;
        border-bottom: 2px solid rgb(237, 239, 247) !important;
    }
    .feature_course_widget{
            /* width: 123%; */
            padding: 10px 5px !important;
            border-top: 0 !important;
            border-left: 0 !important;
            border-right: 0 !important;
            margin-right: 0;
            border-bottom: 2px solid rgb(237, 239, 247) !important;
        }
       
    .about_ins_container .details{
        padding-left: 130px;
    }

}
.quizpoints{
    margin-top: 0 !important;
    /*padding-right:40px;*/
    /* font-weight:bold;  */
}
.quizTopBar{
    margin-top: 10px;
    width: 71% !important;
}

@media (max-width:350px){
    .quizTopBar{
        width: 100% !important;
    }
    .quizClock{
        max-width: 90%;
    }
    .next_btn.mcq{
        margin-left: 0;
    }
    .previousButton.mcq{
        margin-left: -85px !important;
    }


}
.quizModeName{
    text-align: center;
    width: 30%;
    font-size: 18px;
    color: black;
   /* margin-left: 50px; */
    font-weight: bold;
} 

@media (max-width:1200px){
    /*.quizModeName{
        margin-right: 85px;
    }*/
}
@media only screen and (min-width:1024px){
    .quizModeName{
            margin-left:-5px;
        }
        .quizNavBtn .delete_btn, .add_btn{
            margin-left: 14px;}
            .quizNavBtn{
                display: flex;
            }

}
@media only screen and (max-width:500px){

    .quizTopBar{
        margin-left: 15px;
        width: 85% !important;
        display: flex;
        align-items: baseline;
        }

        .quizNavBtn{
            display: inline-block;
        }
        .quizNavBtn .add_btn{
            margin-top: 10px;
            margin-left: 25px;

        }
        .quizNavBtn .delete_btn{
            margin-top: 10px;
            margin-left: 43px;
        }
        .quizModeName{
            margin-left:5px;
        }
        #ccn-main-region .row .questionTagRow{
            display: flex;
        }

}
@media (max-width:480px){
    .quizTopBar{
        width: 85%;
    }
    .quizModeName{
        text-align: center;
        width: 30%;
        font-size: 13px;
        color: black;
        /*margin-left: 50px;*/
        font-weight: bold;
    }  
    .quizClock{
        max-width: 85%;
    } 
    
}







@media (max-width:1200px){
    .quizTopBar{
        width: 80%;
    }
    .quizClock{
        width: 70%;
    }
    
}


.extendTimeButton{
    background-color: rgb(255, 16, 83);
    color: white;
    border: 2px rgb(255, 16, 83) solid;
}
.extendTimeButton:hover{
    background-color: white;
    color:rgb(255, 16, 83);
    border: 2px rgb(255, 16, 83) solid;
}
.extendTimeButton:hover +i{
    color:rgb(255, 16, 83);
}
.selectedVideo{
    background-color: white;
    color: black;
    border: 2px black solid;
    cursor:default !important;
}
.pinkButton{
    background-color: rgb(255, 16, 83);
    color: white;
    border: 2px rgb(255, 16, 83) solid;
    font-weight: 700;
}
.pinkButton:hover{
    background-color: white;
    color:rgb(255, 16, 83);
    border: 2px rgb(255, 16, 83) solid;
}
.quizScores{
    text-align: left;

}
.quizScores span{
    font-size: 20px;
    color: black;
    margin-right: 20px;
}
.highlight{
    font-weight: bold;
}

.home1-mainslider .from .slide:before{
    background-image: -moz-linear-gradient(140deg, rgb(112,128,144) 0.6%, black 68%);
    background-image: -webkit-linear-gradient(140deg, rgb(112,128,144) 0.6%, black 68%);
    background-image: -ms-linear-gradient(140deg, rgb(112,128,144) 0.6%, black 68%);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 1.0;
    position: absolute;
    right: 0;
    top: 0;
}
.correctAsnwer{
    color: green;
}
.incorrectAnswer{
    color: red;
}
.ui_kit_table .table th, .ui_kit_table .table td {
    padding: 10px 0px;
    line-height: 1.1;
}
.reverseBlue {
    background-color: #fff;
    color: var(--primary);
}
.reverseBlue:hover{
    color: #fff;
    background-color: var(--primary);
}
.hoverImage {
    max-width: 70vh;
    margin-top: 10px;
}

.ui_kit_table .table th {
    /* background-color: #2441e7; */

}
.ui_kit_table {
    overflow-x: auto;
}

.rotatedArrow i{
    transform: rotate(180deg);
}

.csoverviewid::marker{
    display: none !important;
    width: 0;
    height: 0;
}

div.slider.slider-horizontal {
    width: 100%;
    float: left;
    margin-right: 0;
    margin-top: 5px;
    margin-bottom: 19px;
    margin-left: 0;
}
.slider-handle.min-slider-handle.round{
    display: none;
}

.start-timer{
    position: inherit;
    color: var(--primary);
    margin-top: 0;
    float: left;
}
.end-timer{
    position: inherit;
    color: var(--primary);

    float: right;
    margin-top: -6px;

}
.stars:last-of-type{
    margin-right: -0.5rem;
}


.disabledButton{
    cursor: not-allowed !important; 
    background-color: var(--disabled-button) !important;
    border-color: var(--disabled-button);
}
.clickableDisabledButton{
    cursor: default !important;
    background-color: var(--disabled-button) !important;
    border-color: var(--disabled-button);   
}
.clickableDisabledButton:hover{
    color: #fff;
    border-color: var(--disabled-button);   

}
.dropdown-item.active {
    background-color: var(--primary);
    color: white !important;
}
.dropdown-item.active, .dropdown-item:active {
    background-color: var(--primary);
    color: white !important;
}

.toc-content{   
    text-align: left;
    font-size: 17px;
    margin: 5px 0%;
    padding: 10px 5px;
    cursor: pointer !important;
    padding-left: 2px;
    padding-right: 2px;


}
.toc-content:hover{
    background-color: var(--primary);
    border-radius: 5px;
    text-decoration: none;
    color: white;
    cursor: pointer !important;

    
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
    font-weight: 700 !important;
    font-size: large !important ;
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link{
    cursor: pointer !important;
}

button.btn.btn-thm.attendance.expanded i {
    transition: all 0.5s;
    transform: rotate(180deg);
}
button.btn.btn-thm.attendance i {
    transition: all 0.5s;
    font-size: 21px;
    margin-right: 0px;
    margin-left: 8px;
    padding-top: 0px;
}

.changePwd .popup-body{
    height:180px
}
.passErr{
       
      color: red;
      margin-right: 3px;
     
  
}
.passSuc{
    color: green;
    margin-right: 3px;

}
.toogleAttendance{
    padding: 0px 22px;
    background: white;
    border: 0;
    font-size: 16px;
    text-decoration: underline;
}
.toogleAttendance{
    padding: 0px 22px;
    background: white;
    border: 0;
    font-size: 16px;
}
.partialAttendance{
    background-color: lightslategrey;
}
.absent{
    background-color: darkgrey;
}
.absent.orange{
    background-color: orange;
}

.presentAttendance{
    background-color: lightgreen;
}
.blueHead{
    padding: 0;
    padding-top: 24px;
}
.blueHead .title{
    background-color: var(--primary);
    color: #fff;
    margin-top: 0;
    margin-bottom: 0;
    padding: 0;

}
.blueHead .heading {
    padding: 10px 0px;
    background-color: var(--primary);
    margin-bottom: 10px;
    text-align: center;

}
.blueHead .content {
    padding: 0 7px;
    text-align: inherit;


}
.blog_tag_widget .blueHead{
    padding: 0;
}
.blog_tag_widget .blueHead .title{
    background-color: var(--primary);
    color: #fff;
    margin-top: 0;
    margin-bottom: 0;
    padding: 0;

}
.blog_tag_widget .blueHead .heading {
    padding: 10px 0px;
    background-color: var(--primary);
    margin-bottom: 10px;
    text-align: center;

}
.blog_tag_widget .blueHead .content {
    padding: 0 7px;
    text-align: inherit;

}
.btn-thm a:hover{
    color: var(--primary);
}
#sampleButton{
    color: inherit;
}

/*.codeFileStyle {
    z-index: 20;
    position: absolute;
    left: 118px;
    top: 256px;
    float: left;
    background-color: #e8e8e8;
}*/
.codeFileStyle {
    z-index: 20;
    position: relative;
    left: 113px;
   /*  top: 256px; */
    float: left;
    background-color: #e8e8e8;
    margin-top: -189px;
}
.solutionFileStyle {
    z-index: 20;
    position: relative;
    left: 113px;
   /*  top: 459px; */
    float: left;
    background-color: #e8e8e8;
    margin-top: -385px;
}
/*
.solutionFileStyle {
    z-index: 20;
    position: absolute;
    left: 118px;
    top: 459px;
    float: left;
    background-color: #e8e8e8;
}*/
.instructionFileStyle {
    z-index: 20;
    position: relative;
    left: 113px;
    float: left;
    width: 300px;
    height: 25px;
    background-color: #e8e8e8;
    margin-top:-106px;
    margin-left: -5px;
}
.certificateFileStyle{
    z-index: 20;
    position: relative;
    left: 105px;
    /*top: 182px;*/
    float: left;
    width: 300px;
    height: 25px;
    background-color: #e8e8e8;
    margin-top:-225px;
}
.popup-container input {
    margin-top: 0;
}
@media only screen and (min-width:1000px){
    .feature_course_widget {
        width: 115%;
    }
    .submit_btn{
        margin-left: -50px !important;
    }
}
.breadcrumb-item{
    color: #fff;
    cursor: pointer;
}
.popup-container.autoScroll .popup .popup-body {
    overflow-y: auto;
}
.slider.slider-horizontal .slider-tick, .slider.slider-horizontal .slider-handle{
    height: 16px;
    width: 16px;
    margin-left: -18px;
    margin-top: 4px;
}
.stop{
    display: none ;
}
.emptyCourse .popup .popup-body {
    height: 350px;
    overflow-y: auto;
}
.course_footer button{
    background-color: #fff;
    border: none;

}
.course_footer button:hover{
    background-color: #fff;
    border: none;
    text-decoration: underline;
    
}
.adminMode{
    background-color:var(--primary) !important;
    color: #fff !important;
    border: 2px solid var(--primary);
    border-radius: 5px;
    padding: 5px 5px;
}
@media only screen and (min-width:800px){

.adminMode:hover{
    background-color: white !important;
    color:var(--primary) !important;
    border: 2px solid var(--primary);
    border-radius: 5px;
    padding: 5px 5px;
}

.adminModeReverse:hover{
    background-color:var(--primary) !important;
    color: #fff !important;
    border: 2px solid var(--primary);
    border-radius: 5px;
    padding: 5px 5px;
}
}
.adminModeReverse{
    background-color: white !important;
    color:var(--primary) !important;
    border: 2px solid var(--primary);
    border-radius: 5px;
    padding: 5px 5px;
}
.highlightMode{
    background-color: rgb(255, 16, 83) !important;
    color: #fff !important;
    border: 2px solid rgb(255, 16, 83);
    border-radius: 5px;
    padding: 5px 5px;

}
@media only screen and (min-width:800px){
    .highlightMode:hover{
        background-color: white !important;
        color:rgb(255, 16, 83) !important;
        border: 2px solid rgb(255, 16, 83);
        border-radius: 5px;
        padding: 5px 5px;
    }
    .highlightModeReverse:hover{
        background-color: rgb(255, 16, 83) !important;
        color: #fff !important;
        border: 2px solid rgb(255, 16, 83);
        border-radius: 5px;
        padding: 5px 5px;
    }
}
.highlightModeReverse{
    background-color: white !important;
    color:rgb(255, 16, 83) !important;
    border: 2px solid rgb(255, 16, 83);
    border-radius: 5px;
    padding: 5px 5px;
    margin-top: 10px;
}
.header_user_notif li.user_setting .dropdown-menu.show {
    padding: 26px 20px 10px;
}
.profile-popup .dropdown-menu.show {
    padding: 26px 20px 10px;
}

.selectedStudent{
    width: 15px;
    height: 15px;
    border: 1px solid var(--primary);
    background-color: var(--primary)

}
.notSelectedStudent{
    width: 15px;
    height: 15px;
    border: 1px solid black;
    background-color: #fff
}
.subCategoryAcordation::before
{
    margin-right: -74%;
}
i.fa.fa-pencil.fa-lg {
    font-size: 17px;
}
i.fa.fa-question.fa-lg {
    font-size: 17px;
}
.login:hover{
    text-decoration: underline !important;
}
.about_ins_container .about_ins_info .thumb img {
    max-width: 40vh;
    height: auto;
}

.profile-input{
    margin-bottom: 30px;
    width: 90%;
    /* border: 1px solid rgba(0, 0, 0, 0.2); */
    padding: 10px;
    background: #eae9e9;
    font-family: "SourceSansPro-Regular";
    border: 0;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    margin-left: 10px;
    line-height: normal !important
    ;
}
.editCategory{
    cursor: pointer;
    margin-bottom: -3px;
}
.editCategory:hover{
    text-decoration: underline !important;
}
.copyCourse{
    font-size: 15px;
    font-weight: 400;
    font-family: 'Nunito' !important;
}
.copyCourse:hover{
    text-decoration: underline !important;
}
.profile-input.dis{
    background-color: #fff !important;
    border: 1px solid gray;
    border-radius: 5px;
}
.show-password {
    position: absolute;
    bottom: 9px;
    z-index: 1000;
    font-size: 28px;
    color: black;
    cursor: pointer;
}
.show-password-lmsReg{
    position: absolute;
    right: 40px;
    top:419px;
    z-index: 1000;
    font-size: 28px;
    color: black;
    cursor: pointer;
}



.top_courses .details .tc_footer{
    padding-left: 12px;
}
.registrationStatus{
    background-color: gray;
    width: 20px;
    color: gray;
    height: 20px;
    display: inline-block;
    color: #fff;
    border-radius: 50%;
    margin-left: 5px;
}
.resi{
  display: flex;
                                align-items: center;
                                justify-content: center;
                                flex-direction: row;
                                /* margin-top: 0px; */
                                margin-top: 5px;
                            
}
.registrationStatus span{
    color: #fff;
    display: inline-block;
    margin-top: 7%;
    font-weight: 600;
}


.popup-body button#dropdownMenuButton {
    color:black !important;
    border-color:black;
}


.popup-body .dropdown-item:hover{
    background-color:white;
    color: #000 !important;
    font-weight: 800 !important;
    cursor: pointer;


}
.popup-body .dropdown-item.active {
    background-color:black;
    color: #fff !important;
    font-weight: 500 !important;
    
}
.greenAnswer{
    border: solid green;
    border-width: 3px;
}
.popup-body .dropdown button{
    color: gray !important;
    border-color: gray;
}
.feature_course_widget ul li span,.feature_course_widget ul li a {
    color: black;
}
.flaticon-user::before{
    font-size: 15px;
}
.insideSearch::before
{
    margin-left: -35px;
}
.searchButton::after{
    display: none
}
@media screen and (max-width:425px){

    .next_btn {
            margin-right: -2px !important;

    }    
    /*.submit_btn{
        margin-left: -78px !important;
    }*/
}
@media screen and (max-width:335px){
    .submit_btn {
        margin-left: 0px !important;
    }
    .next_btn {
            margin-right: 0px !important;

    }    
}
.mobileView {
    display: none !important;

}   
.desktopView {
    display: block
}
@media screen and (max-width:600px){
    .mobileView {
        display: block !important;

    }   
    .desktopView {
        display: none !important;
    }
}
@media screen and  (max-width:750px){
    .show-password-lmsReg{
        right: 86px;
    }
}
@media screen and  (max-width:475px){
    .show-password-lmsReg{
        right: 40px;
        bottom: 104px;
        top: 400px;
    }
}

.blur-div{
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
    filter: blur(5px);
    background-color: #ccc;
}
.selectAll{
    cursor: pointer;
}
.selectAll:hover{
    font-weight: 900;
    text-decoration: underline;

}
@media only screen and (min-width:500px){

    div#mitra-logo2 {
        display:none
    }
    #topmlogo{
        display: none;
    }        

    }
/*@media only screen and (max width:1024 px) { 
        .quiz-slider-image{ 
		padding-left : 20px;
        }
}*/ 
    @media only screen and (min-width:1024px) { 
        .mcq__flex-resize {
           margin-left: 20px;
           flex:auto;
        }
        .btn-card.concept-card1{
            margin-right:30px;
            width:auto;
        }

        .quiz-slider-image{
            width:100%; 
            padding-left:0px;
        } 
 
    }   
    @media only screen and (max-width: 1024px) and (min-width: 500px) {
     .btn-card.concept-card1 {
            width:auto;
            padding-left:10px;
            margin-left: 30px;
        }
      .mcq__flex-resize {
           margin-left: 10px;
           flex:auto;
        }
 }
    @media only screen and (max-width:500px){
        .quiz-slider-image{
            width: auto; 
            padding-left:10px;
        } /* Mobile view width auto for drap drop auto*/
        .btn-card.concept-card1 {
            width:auto;
            padding-left:10px;
            margin-left: 30px;
            margin-right:30px;
        }
        .pclas{ /* ALignment for select the correct option text*/
            padding-left:15px;
        }
        .concept-card1 {
           margin-left:20px;
        }
        .mcq__flex-resize {
           margin-left: 30px;
           flex:auto;
        }
        /*.previousButton.mcq {
           margin-left: -13px; !important; 
        }*/   
    }
    div#mitra-logo {
        display:none
    }  
    #topimlogo{
        display: none;
    } 
    .feature_course_widget h4 {
        font-size: 20px;
        font-weight: 540;
        color: #0a0a0a;
        line-height: 1.2;
        padding-left: 0;
      }
      .feature_course_widget ul li {
        border-bottom: 1px solid #eeeeee;
        color: #0a0a0a;
        font-family: "Open Sans";
        font-size: 15px;
        line-height: 2.667;
        padding: 0 30px;
        padding-left: 10px;
      }
    }
@media only screen and (max-width: 1199.98px){
.menu_bar_home2 li.list-inline-item:first-child:after {
    display: none;
}
}
@media only screen and (max-width: 1199.98px){
    .stylehome1 .nav_logo_img, .stylehome1.dashbord_mobile_logo .nav_logo_img {
        position: relative;
        max-height: 45px;
    }
        
}

.add-lab .popup .popup-body {
    overflow-y: auto;
}
.previous-score-page div {
    display: inline-block;
    min-height: 91px;
    min-width: 219px;
    padding: 10px 5px;
    border: 3px rgb(237, 243, 250) solid;
    border-radius: 5px;

}
.previous-score-page{
    text-align: start;
}
.noLeft{
    border-left: 0 !important;
}
.noLeftRight{
    border-left: 0 !important;
    border-right: 0 !important;
}
.cs_row_two .cs_overview .title{
    margin-bottom: 10px;
}
.instructor_pricing_widget .price_quere_list li .ccn-course-details-item {
    line-height: 2.1;
}
.downloadLink{
    margin-left: 10%;
    color: var(--primary);
    cursor: pointer;
}

.downloadLink:hover{
    text-decoration: underline !important;
}
.sectionNotePopup{
    width: 100%;
    left: 0;
    margin: 0;
}


.disable-flicker:hover{
    line-height: inherit !important;

}
.disable-flicker span{
    /* display: none; */
}
.disable-flicker:hover .iconhide {
    display: inline-block;
    
}
.additionalLearning .cross{
    display: none;
}
.additionalLearning:hover .cross{
    display: inline;
}
.keyword{
    display: inline-block;
}
.awardKeyword{
    display: flex;
    flex-wrap: wrap;
}

.question p{
    color: black !important;
}
.scrollToHome{
    display: none !important;
}
.chat-ui {
    background-color: green;
    min-height: 250px;
    overflow: auto;
    border-radius: 10px;
    padding: 20px;
}

.sent {
    background-color: white;
    display: inline-block;
    border-radius: 5px;
    color: black;
    font-family: 'Nunito';
}
.topper-card{
    width: 140px;
    background-color: #fff;
    border-radius:10px;
    margin: 0 10px;
    padding: 10px;
    text-align: center;
}
.topper-card img{

    /* max-width: 80px; */
    margin: 0 auto;
    border-radius: 13px;

}
.topper-card span{
    display: block;
    margin-top: 5px;
    color: #000;
}
.polkadots{
  background-color:#007390;
  background-image: radial-gradient(#358ba1 2px, transparent 2px),radial-gradient(#358ba1 2px, transparent 2px);
  background-size:40px 40px;
  background-position: 0 20px, 20px 0, 10px 0px, 0px 0px;
}
.slick-prev:before, .slick-next:before {
    font-family: 'slick';
    font-size: 28px;
    line-height: 1;
    opacity: 1;
    color: var(--primary);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-left: -3px;
}
.slick-prev:before{
    margin-left: 9px;

}
.slick-next:before{
    margin-left: -34px;
}

#ka-banner{
    margin-top: -81px;
    /* margin-bottom: 10px; */
    width: 44vw;
    aspect-ratio: auto;
}
@media only screen and (max-width:1000px){
    #ka-banner{
        margin-top: -81px;
        /* margin-bottom: 10px; */
        width: 70vw;
        aspect-ratio: auto;
    }
}
@media only screen and (max-width:800px){
    #ka-banner{
        margin-top: -10px;
        margin-left: 16px;
        aspect-ratio: auto;
        width: fit-content;
    }
}

body:not(.ccn_header_style_7) .navbar_brand img{
    margin-top: 2px;
    max-height: 40px;
}

.present{
    margin: 0;
    /* margin-left: -3px; */
    height: 10px;
    width: 15px;

    background-color: green;
    display: inline-block;
}   
.absentt{
    margin: 0;
    /* margin-left: -3px; */
    height: 10px;
    width: 15px;
    background-color: red;
    display: inline-block;
}
.notyet{
    margin: 0;
    /* margin-left: -3px; */
    height: 10px;
    width: 15px;
    background-color: rgb(255, 255, 255);
    display: inline-block;
    border: 0.5px grey solid;
}
@media only screen and (max-width:442px){
    .attendance-report{
        margin-top: 10px;
        /*margin-left: -22px;*/
        }
}
.less-gray {
    color: gray !important;
}


.course-table .course-buy {
    display: inline-block;
    margin: 0;
    padding: 0;
    border-right: 1px solid rgb(237, 239, 247);
    border-bottom: 1px solid rgb(237, 239, 247);
    border-radius: 5px;
    min-height: 100%;
    margin-top: 0;
    position: relative;
    margin-bottom: 20px;
    position: relative;
}
.course-table:first-child{
    border-left: 2px solid rgb(237, 239, 247);

}
.course-table {
    display: flex;
    align-items: stretch;
    min-height: 310px;
}   

.course-buy h4{
    font-weight: 600;
    color:#fff;
    margin: 0;
    width: fit-content;

}
.course-buy button {
    bottom: -48px;
    width: 82%;
    margin: 0;
    font-weight: 700;
    position: absolute;

}
.course-buy .head-title{
    text-align: centerx;
    background-color: var(--primary);
    width: 100%;
    color: #fff;
    padding: 3px 10px;
    margin-bottom: 15px;

}
.star{
    color: rgb(111,112,116);

}
.error{
    color: red;
}
.botui-message-content{
    display: inline-block !important;
    margin-top: 15px;
}
.leftAlign{
    margin-left: -61vw !important;
}
@media only screen and (max-width:1420px){
    .leftAlign{
        margin-left: -65vw !important;
    }
    
}
@media only screen and (max-width:1350px){
    .leftAlign{
        margin-left: -70vw !important;
    }
    
}
.rightAlign{
    margin-left: 30px !important;
}
@media only screen and (max-width:1420px){
    .rightAlign{
        margin-left: 10px !important;
    }
    
}
@media only screen and (max-width:1350px){
    .rightAlign{
        margin-left: 10px !important;
    }
    
}
.leftAlignc{
    margin-left: -19vw !important;
}
@media only screen and (max-width:1420px){
    .leftAlignc{
        margin-left: -25vw !important;
    }
    
}
@media only screen and (max-width:1350px){
    .leftAlignc{
        margin-left: -30vw !important;
    }
    
}
.rightAlignc{
    margin-left: 37vw !important;
}
@media only screen and (max-width:1420px){
    .rightAlignc{
        margin-left: 37vw !important;
    }
    
}
@media only screen and (max-width:1350px){
    .rightAlignc{
        margin-left: 37vw !important;
    }
    
}
.lowScore{
    border: 1px solid red;
}
.selectType{
    display: flex;
    flex-direction:row;
}
.selectType div{    
   margin-left: 30px;
}
.selectType div:first-child{    
    margin-left: 0px;
 }
.selectType div span{    
    margin-right: 15px;
 }
 @media only screen and (max-width:900px){
     .dates div{
         width:auto !important;

     }
 }
 .modeCheck input{
    width: 30px;
    display: inline;
    /* margin-bottom: 19px; */
    margin: 10px 0 20px;
    margin-left: -7px;
 }

.lowPerformance{
    color: #ad1d13;
    font-weight: 800;
    margin-left: 2px;
    font-size: 12px;
    /* padding-bottom: 1px; */
    display: inline-block;
    /* margin-top: -20px; */
    vertical-align: super;
}
.marketingInfo{
    height:auto !important;
}
div.answer{
    display:none;
    width: 82%;
    height: min-content;
    /* margin-top: -9px; */
    position: absolute;
    top: 20px;
    margin-top:11px;
    text-align: start;
}
.ratingName{

    display: inline-block;
    width: 195px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    margin-bottom: 0;
}
.blog_tag_widget ul li #noteq {
    color: black;
}
.blog_tag_widget ul li #noteq a{
    color: inherit !important;
}

.blog_tag_widget ul li #noteq:hover{
    color: var(--primary)
}
.feature_course_widget ul li #noteq {
    color: black;
}
.feature_course_widget ul li #noteq a{
    color: inherit !important;
}

.feature_course_widget ul li #noteq:hover{
    color: var(--primary)
}
.panel-heading{
    display: flex;
    align-content: center;
    align-items: baseline;
    width: 107%;
    justify-content: space-between;
}
.panel-title{
    flex: 2 1 auto;
    margin-right: 14px;
    max-width: 95%;
}

.scroll-pop .popup .popup-body{
    overflow-y: scroll !important;
}

.referenceFileStyle{
    max-width: 69%; 
    left: 118px;
}
menuc{
    position: fixed;
    top: 0;
    z-index: 999;
}
.no-scroll .scroll-content{
    overflow: hidden;
}
.quizimgdiv{
    text-align: left !important;
    width:auto !important;
}
.toast-message{
    font-size: 18px;
    line-height:150%;
}
.toast-container{
    width: 200%;
}
#desktop{
    display:block;
}
#mobile{
    display: none;
}
@media screen and (max-width:1200px){
    #desktop{
        display: none;
        
    }
    #mobile{
    display:block;

    }
}

#HiddenMenu {
    background-color: #e00;

  }
  #hoverSpace {
    background-color: transparent;
    overflow: hidden;
    height: 75px;
    position: fixed;
    display: block;
    width: calc(100vw - 20px) !important;
}

  @media screen and (min-width:600px){
    #toast-container.toast_bottom_center .toast{
        width:500px
    }
}
#hoverSpace:hover{

}
.cs_overview .row .learningDetials{
    width: 80px;
    margin-bottom: 30px;
    margin-top: 6px;
    line-height: 1.2;
}
.cs_overview .row .learningRank{
    width: 93px;
    margin-bottom: 30px;
    margin-top: 6px;
    line-height: 1.2;
}
.quizFileStyle {
    z-index: 20;
    position: absolute;
    left: 122px;
    top: 177px;
    float: left;
    background-color: #e8e8e8;
    width: 65%;
    margin-left: -8px;

}
.pub ,.pub{
    color: black;
}
.unPub ,.unPub{
    color: grey !important;
}
.pub:hover,.unPub:hover{
    cursor: pointer;

}
.fa-play.InProgress{
    color: rgb(0, 55, 255);
}
.fa-play{
    color: black;
}
.fa-play.completed{
    color: rgb(0, 255, 64);
}
.color-box {
    width: 20px; 
    height: 20px; 
    margin-right: 5px;
    border: 1px solid #000; 
}

.red-box {
    background-color:rgb(0, 55, 255);
}
.black-box {
    background-color: black;
}

.green-box {
    background-color: rgb(0, 255, 64);
}

.background-colour-green{
    background-color: rgb(0, 255, 64);
}
.background-colour-blue{
    background-color:rgb(0, 55, 255);
}
.ellipsis{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 5px;
    /* left:27%; */
    width: 65%;
}

.iconhide{
    display:none;

}
#noteq:hover .iconhide{
    display: inline-block;
}
@media only screen and (max-width:500px){
    .addNotes button{
        left: 5px !important;
    }
    #addQuestion{
        left : -4px !important;
    }
}
@media (max-width: 500px) {
    #controls {
      height: auto;
      overflow: overlay;
      margin-top: 15px; } }
.feature_course_widget ul li:last-child {
border-bottom: none;
padding-left: 10px;
}
#ka-banner-main {
    width: 57%;
    margin: auto;
    margin-top: 5.9%;
}
@media (max-width: 1400px) {
    #ka-banner-main{
     width: 88%;
     margin: auto;
     margin-top: 6.7%;
    }
 }
 @media (max-width: 1200px) {
    #ka-banner-main{
        width: 91%;
        margin: auto;
        margin-top: 8%;
    }
}

@media (max-width: 800px) {
    #ka-banner-main{
        width: 92%;
        margin: auto;
        margin-top: 16%;
    }
}
@media (max-width: 600px) {
    #ka-banner-main{
        width: 92%;
        margin: auto;
        margin-top: 25%;
    }
}
@media (max-width: 400px) {
    #ka-banner-main{
        width: 92%;
        margin: auto;
        margin-top: 45%;
    }
}



 
.popup-body #accordion .panel-heading a.collapsed:hover, .popup-body #accordion .panel-heading a.collapsed:focus{
    font-size: 16px !important;
    font-weight:bolder
}

.content-icon{
    width: 15px;
    margin-right: 15px;
    display: inline-block;
}
.contact-icon i{
    margin:0 !important;
    text-align: left;
}
#mainsubtopicvideo.fullScreen iframe{
    width: 98%;
    height: 100%;
    margin-left: 73px;
}
.sideLink{
    padding-top:18%;
    margin-left: 19px;
    z-index: 999;
}
.sideLink button{
    min-height: 40px;
    margin-top: 30px;
    padding-left: 20px;
    min-width: unset;
    width: 46px;
}
@media (max-width:1400px) and (max-height:500pxx){
    #mainsubtopicvideo.fullScreen iframe{
        width: 101%;
        height: 99%;
        margin-left:0
        
    }
    .sideLink{
        width: 50px !important;
        margin-left: 12px !important;
    padding-top:5%;

    }
}
@media (max-width:1400px) and (max-height:1024px){
    #mainsubtopicvideo.fullScreen iframe{
        width: 101%;
        height: 99%;
        margin-left:0
        
    }
    .sideLink{
        width: 50px !important;
        margin-left: 12px !important;
    padding-top:26%;

    }
}

@media (max-width:1000px) {
    #mainsubtopicvideo.fullScreen iframe{
        width: 101% !important;
        height: 100%;
        margin-left: 0;
        
    }
    .sideLink{
        width: 50px !important;
        margin-left: 12px !important;
        padding-top:16%;


    }
}
@media (max-width:1000px) and (max-height:380px) {
    #mainsubtopicvideo.fullScreen iframe{
        width: 101% !important;
        height: 87%;
        margin-left: 0;
        
    }
    .sideLink{
        width: 50px !important;
        margin-left: 12px !important;
        padding-top:11%;


    }
}
@media(max-width:850px) and (max-height:380px){
    #mainsubtopicvideo.fullScreen iframe {
            width: 129% !important;
            height: 99%;
            margin-left: 0;
            margin-top: 2px;
            margin-left: -82px;
    }
    .sideLink{
        padding-top:16%;
    }
}

@media (max-width:747px) {
    #mainsubtopicvideo.fullScreen iframe{
        width: 101% !important;
        height: 100%;
        margin-left: 0;
        
    }
    .sideLink{
        width: 50px !important;
        margin-left: 12px !important;
        padding-top:17%;


    }
}

@media (max-width:650px){
    #mainsubtopicvideo.fullScreen iframe {
        width: 101% !important;
        height: 100%;
        margin-left: 0;
        margin-top: 2px;
    }
    .sideLink{
        padding-top:11%;
    }
}

.chart-container {
    position: relative;
    margin: auto;
    width: 30%;
  }



  




  #mainsubtopicvideo.fullScreen iframe{
    width: 98%;
    height: 100%;
    /* margin-left: 25px; */
}
.sideLink{
    padding-top:18%;
    margin-left: 19px;
}
.sideLink button{
    min-height: 40px;
    margin-top: 30px;
    padding-left: 20px;
    min-width: unset;
    width: 46px;
}
.rotated .vp-center {
    align-items: flex-end;
}
@media (max-height:1400px) and (max-width:500px){
    #mainsubtopicvideo.fullScreen.rotated iframe{
        width: 101%;
        height: 99%;
        margin-left:0
        
    }
    .sideLink{
        width: 50px !important;
        margin-left: 12px !important;
    padding-top:5%;

    }
}
@media (max-height:1400px) and (max-width:1024px){
    #mainsubtopicvideo.fullScreen.rotated iframe{
        width: 101%;
        height: 102% !important;
        margin-left:0
        
    }
    .sideLink{
        width: 50px !important;
        margin-left: 12px !important;
    padding-top:26%;

    }
    #mainsubtopicvideo.fullScreen.rotated{
        height:50% !important;
  
    
        }
}

@media (max-height:1000px) and (max-width:500px) {
    #mainsubtopicvideo.fullScreen.rotated iframe{
        width: 93% !important;
        height: 100%;
        margin-left: 30px;
        
    }
    .sideLink{
        width: 50px !important;
        margin-right: 43px !important;
        padding-top:16%;


    }
    #mainsubtopicvideo.fullScreen.rotated{
        height:87% !important;
  
    
        }
}
/* @media (max-height:1000px) and (max-width:380px) {
    #mainsubtopicvideo.fullScreen.rotated iframe{
        width: 101% !important;
        height: 87%;
        margin-left: 0;
        
    }
    .sideLink{
        width: 50px !important;
        margin-left: 12px !important;
        padding-top:11%;


    }
    #mainsubtopicvideo.fullScreen.rotated{
      height:50% !important;

  
      }
} */
@media(max-height:850px) and (max-width:380px){
    #mainsubtopicvideo.fullScreen.rotated iframe{
            width: 129% !important;
            height: 99%;
            margin-left: 0;
            margin-top: 2px;
            margin-left: -82px;
    }
    .sideLink{
        padding-top:16%;
    }
    #mainsubtopicvideo.fullScreen.rotated{
      height:46% !important;

  
      }
}

@media (max-height:747px) {
    #mainsubtopicvideo.fullScreen.rotated iframe{
        width: 101% !important;
        height: 100%;
        margin-left: 0;
        
    }
    .sideLink{
        padding-top:17%;
    }
    #mainsubtopicvideo.fullScreen.rotated{
        margin-top: 30px;
      height:50% !important;

  
      }
    .sideLink{
        width: 50px !important;
        margin-left: 12px !important;


    }
}

@media (max-height:650px){
    #mainsubtopicvideo.fullScreen.rotated iframe {
        width: 101% !important;
        height: 100%;
        margin-left: 0;
        margin-top: 2px;
    }
    .sideLink{
        padding-top:11%;
    }
    #mainsubtopicvideo.fullScreen.rotated{
      margin-top: 30px;
      height:50% !important;

    }
}

.chart-container {
    position: relative;
    margin: auto;
    width: 30%;
  }

.back-arrow{
    width:auto;
}
#chat.fullScreen{
    position: absolute;
    display: block;
    top: 65%;
    right: 30px;
    width: 50vw;
    max-width: 600px;
    /* height: 90vh; */
    animation: slideRight 0.4s ease;
    transform: translateY(-50%);
}

.video-container.fullScreen{
    height:100vh;
}
#ccn-main-region{
    background-color:white;
}
@keyframes slideRight {
    0% {
        right: 0;
        
    }

    100% {
        opacity: 30;
        
    }
}


@media (max-height:600px){
    #chat.fullScreen{
        position: absolute;
        display: block;
        top: 50vh;
        right: 84px;
        width: 50vw;
        max-width: 600px;
        /* height: 90vh; */
        animation: slideRight 0.4s ease;
        transform: translateY(-50%);
    }
}
.col{
    padding-left: 0;
}
.back-arrow {
  
    height: auto;
}

.sideLink{
    margin-right: 10px;
    display: none;
}
#chat.fullScreen #hello .botui.botui-container{
    background-color: rgb(255,255,255,0.2);
}
.fullScreen input.botui-actions-text-input {
    color: white;
    color: wh;
}
.slider-controls > li {
    margin: 0;
}
/* body {
    font-size: 0.875rem;
    background-color: #e9eef5;
    font-family: 'Open Sans', sans-serif;
  } */
  
  /* NEW CSS STARTS HERE */
  .stats-wrapper {
    background-color: #007390;
    border-radius: 15px;
/*     padding: 15px 0px;
 */    text-align: center;
    color: #fff;
    margin-bottom: 20px;
  }
  .stats-wrapper .count {
    font-size: 2rem;
    font-weight: 700;
    display: inline-block;
    position: relative;
    margin-bottom: 10px;
  }
  .stats-wrapper .count::before {
    position: absolute;
    content: '';
    display: block;
    bottom: 0px;
    width: 100%;
    height: 1px;
    left: 0px;
    background-color: #69c3da;
  }
  
  .rich-features {
    background-color: #fff;
    margin-bottom: 2rem;
  }
  .why-choose-us h3 {
    font-weight: 700;
    padding-bottom: 1rem;
  }
  .why-choose-us .btn {
    background-color: #004826;
    color: #fff;
    border: 0px none;
    border-radius: 30px;
    padding: 10px 30px;
    margin-top: 1rem;
  }
  .why-choose-us .btn:hover,
  .why-choose-us .btn:focus {
    background-color: #007390;
  }
  .rich-features .why-choose-us,
  .feature-card {
    padding: 25px;
  }
  .feature-card {
    position: relative;
    padding-bottom: 60px !important;
  }
  .feature-card .arrow-btn {
    background: url('../img/ind_arrow_icon.svg') no-repeat center center #eaf2f7;
    background-size: 10px;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    text-indent: -9999px;
    display: block;
    position: absolute;
    right: 25px;
    bottom: 25px;
    transition: all 0.25s ease-out;
  }
  .feature-card.shadow-bg .arrow-btn {
    background-color: #fff;
  }
  .feature-card .arrow-btn:hover {
    transform: translateY(-5px);
    box-shadow: 0px 5px 15px 5px rgba(0, 0, 0, 0.1);
  }
  .feature-card img {
    width: 25px;
    margin-bottom: 10px;
  }
  .feature-card h4 {
    font-size: 1.143rem;
    margin-bottom: 1rem;
  }
  .feature-card.shadow-bg {
    background-color: #eaf7f1;
  }
  .feature-card ul > li {
    margin-top: 5px;
  }
  .custom-popup .popup-body {
    width: 100%;
  }
  .icon-view{
    cursor: pointer;
    color: #606162;
  }
  .icon-view:hover{
    color: #000000;
  }
  
  .custom-popup .popup-head {
    text-align: center;
    width: 100%;
  }
  .custom-popup .popup{
    width: 100%;
  }
  
  @media screen and (min-width: 768px) {
    .rich-features .row {
      margin: 0px;
    }
    .rich-features .col-md-6 {
      padding: 0px;
    }
    .rich-features .why-choose-us {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      align-items: flex-start;
    }
    .rich-features .why-choose-us,
    .feature-card {
      height: 100%;
    }
  }
  /* NEW CSS ENDS HERE */
#zmmtg-root{
    position: relative !important;
    
}
/*.option-div{
    text-align: left;
    margin-left: 20px;
}*/


/* CONSOLIDATED ATTENDANCE */

.attendanceTable__consolidated {
    padding:20px 5px;
    padding-bottom: 0;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
}

.attendanceTable__consolidated > button {
    margin-bottom: 5px !important;
}

.attendanceTable__navigation {
    justify-content: flex-end;
    text-align: left;
    display: flex;
    margin-right: 16px;
    margin-bottom: 15px;
    margin-top: 10px;
}

/* PROCTORING */

.quiz__proctoring {
    display: inline-flex;
    align-items: center;
    justify-content: space-evenly;
    margin-top:15px;
    min-width: 160px;
}
.gradeBookInput input{
    width: 2.5rem;
    height: 1.5rem;
    background-color: lightgray;
}
.gradeBoundaries{
    font-size: 13px;
    height: 1.5rem; 
    vertical-align: middle;
    width: 5rem;
}
.gradeBoundariesName{
    font-size: 13px;
    height: 1.5rem; 
    vertical-align: middle;
    width: 3rem;
}
.button-award {
    color: #4c4c4c;
    width: 138px;
    background: transparent;
    font-size: 14px;
    line-height: 1;
    margin: 7px;
    border-radius: 5px;
    border: 1px solid gray;
    height: 30px;
}
.button-award:hover {
    background-color: var(--primary);
    color: #ffffff;
}
.viewTemplate:hover{
    cursor: pointer !important;
}