:root {
    --eel: #2f80ed;
    --ques-shadow: rgba(233, 238, 242, 0.7);
}
.main-panel{
    width: 100% !important;
}
.top-right{
    position: absolute;
    top: 0px;
    right: 0px;
}
.swal2-modal .swal2-icon, .swal2-modal .swal2-success-ring {
    margin-top: auto !important;
    margin-bottom: auto !important;
}
.border-right{
    border-right: 1px solid black;
}
.border-bottom{
    border-bottom: 1px solid black;
}
#modalContainer {
    background-color: rgba(0, 0, 0, 0.3);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 10000;
    background-image: url(tp.png);
    /* required by MSIE to prevent actions on lower z-index elements */
}
.pad520{
    padding: 5px 20px !important;
}
input:disabled,select:disabled {
    background: none !important;
}
#alert_addvideo,#alert_basicsettings,#alert_publish,#alert_curriculum,
#alert_edit_exam,#alert_saveRP,#alert_saveCam,#alert_savemsg,
#alert_savetime,#alert_savegrading,#alert_savequestions{
    display: none;
    margin-bottom: 25px;
}
#alertBox {
    position: relative;
    width: 400px;
    text-align: center;
    min-height: 150px;
    margin-top: 70px;
    border: 1px solid #666;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: 20px 30px;
}

#modalContainer>#alertBox {
    position: fixed;
}
#modal-footer,#modal-header{
    display: flex;
    align-items: center;
    justify-content: center;
}
#modal-header{
    background: red;
    color: #fff;
}
#examContainerScreen{
    min-height: 100vh !important;
}

#alertBox h1 {
    margin: 0;
    font: bold 1em verdana, arial;
    background-color: #3073BB;
    color: #FFF;
    border-bottom: 1px solid #000;
    padding: 8px 0px;
}

#alertBox p {
    font: 0.9em verdana, arial;
    margin: 30px 0px;
}

#alertBox #closeBtn {
    display: block;
    position: relative;
    margin: 15px auto;
    padding: 7px;
    border: 0 none;
    width: 70px;
    font: 0.7em verdana, arial;
    text-transform: uppercase;
    text-align: center;
    color: #FFF;
    background-color: #357EBD;
    border-radius: 3px;
    text-decoration: none;
}

/* unrelated styles */
#mContainer {
    position: relative;
    width: 600px;
    margin: auto;
    padding: 5px;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
    font: 0.7em verdana, arial;
}

#mContainer h1,
#mContainer h2 {
    margin: 0;
    padding: 4px;
    font: bold 1.5em verdana;
    border-bottom: 1px solid #000;
}

code {
    font-size: 1.2em;
    color: #069;
}

#credits {
    position: relative;
    margin: 25px auto 0px auto;
    width: 350px;
    font: 0.7em verdana;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    height: 90px;
    padding-top: 4px;
}

#credits img {
    float: left;
    margin: 5px 10px 5px 0px;
    border: 1px solid #000000;
    width: 80px;
    height: 79px;
}

.important {
    background-color: #F5FCC8;
    padding: 2px;
}

code span {
    color: green;
}

@media (max-width:767px) {
    #alertBox {
        width: 320px;
    }
}












.sidebar {
    position: fixed;
}

.page-body-wrapper {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.main-panel {
    margin-left: 224px;
}

.sidebar-icon-only .container-scroller .page-body-wrapper .main-panel {
    margin-left: 54px;
}

.createExam {
    display: flex;
    margin-right: -15px;
    margin-left: -15px;
    justify-content: space-around;
}
.lg-dis-none{
    display: none;
}
.goLeft{
    float: left;
}
.goRight{
    float: right;
}
@media only screen and (max-width:600px) {
    .main-panel {
        margin-left: 0px;
    }

    .sidebar-icon-only .container-scroller .page-body-wrapper .main-panel {
        margin-left: 0px;
    }
}

.modal-dialog {
    border-radius: 10px;
    overflow: hidden !important;
}
.reg-modal .modal-dialog {
    margin-top: 45px !important;
    max-width: 740px !important;
}
.reg-modal ul{
    margin-bottom: 0px;
    list-style-type: disc;
}
.reg-modal input[type="date"],
.reg-modal select{
    padding: 0px !important;
}
.reg-modal #cpassword,
.reg-modal #father_phone_number{
    /* font-size: 12px !important; */
    padding: 0px;
}

.modernreg {
    margin-right: 0px !important;
    margin-left: 0px !important;
}

.accordion-body {
    padding-bottom: 0px !important;
}

.regwhitebox {
    height: 100% !important;
    padding: 20px 40px;
    background: #fff;
    border-radius: 0 20px 20px 0;
}

.regwhitebox .col-sm-6,
.regwhitebox .col-sm-12,
.regwhitebox .col-sm-2,
.regwhitebox .col-sm-3,
.regwhitebox .col-sm-4 {
    padding-bottom: 20px;
}

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

.made_url {
    position: static !important;
    text-decoration: underline;
    cursor: pointer;
    /* position: relative;
    display: inline-block; */
}

/* .made_url .tooltiptext {
    visibility: hidden;
    width: 250px;
    background-color: rgba(0, 0, 0, 0.836);
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 4px 0;
  
    position: absolute;
    z-index: 1;
}
.made_url:hover .tooltiptext {
    visibility: visible;
} */

/* START TOOLTIP STYLES */
[tooltip] {
    position: relative;
    /* opinion 1 */
}

/* Applies to all tooltips */
[tooltip]::before,
[tooltip]::after {
    text-transform: none;
    /* opinion 2 */
    font-size: .9em;
    /* opinion 3 */
    line-height: 1;
    user-select: none;
    pointer-events: none;
    position: absolute;
    display: none;
    opacity: 0;
}

[tooltip]::before {
    content: '';
    border: 5px solid transparent;
    /* opinion 4 */
    z-index: 1001;
    /* absurdity 1 */
}

[tooltip]::after {
    content: attr(tooltip);
    /* magic! */

    /* most of the rest of this is opinion */
    font-family: Helvetica, sans-serif;
    text-align: center;

    /* 
      Let the content set the size of the tooltips 
      but this will also keep them from being obnoxious
      */
    min-width: 3em;
    max-width: 21em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 1ch 1.5ch;
    border-radius: .3ch;
    box-shadow: 0 1em 2em -.5em rgba(0, 0, 0, 0.35);
    background: #333;
    color: #fff;
    z-index: 1000;
    /* absurdity 2 */
}

/* Make the tooltips respond to hover */
[tooltip]:hover::before,
[tooltip]:hover::after {
    display: block;
}

/* don't show empty tooltips */
[tooltip='']::before,
[tooltip='']::after {
    display: none !important;
}

/* FLOW: RIGHT */
[tooltip][flow^="right"]::before {
    top: 50%;
    border-left-width: 0;
    border-right-color: #333;
    right: calc(0em - 5px);
    transform: translate(.5em, -50%);
}

[tooltip][flow^="right"]::after {
    top: 50%;
    left: calc(100% + 5px);
    transform: translate(.5em, -50%);
}

/* KEYFRAMES */
@keyframes tooltips-vert {
    to {
        opacity: .9;
        transform: translate(-50%, 0);
    }
}

@keyframes tooltips-horz {
    to {
        opacity: .9;
        transform: translate(0, -50%);
    }
}

/* FX All The Things */
[tooltip]:not([flow]):hover::before,
[tooltip]:not([flow]):hover::after,
[tooltip][flow^="up"]:hover::before,
[tooltip][flow^="up"]:hover::after,
[tooltip][flow^="down"]:hover::before,
[tooltip][flow^="down"]:hover::after {
    animation: tooltips-vert 300ms ease-out forwards;
}

[tooltip][flow^="left"]:hover::before,
[tooltip][flow^="left"]:hover::after,
[tooltip][flow^="right"]:hover::before,
[tooltip][flow^="right"]:hover::after {
    animation: tooltips-horz 300ms ease-out forwards;
}

.searchwhitebox {
    padding: 5px 0 20px 0px;
    display: flex;
    align-items: center;
}

.searchwhitebox input {
    padding: 10px;
    border: none;
    color: #adabab;
    border-bottom: 1px solid #adabab;
    border-radius: 0px;
}

.searchwhitebox h1 {
    font-size: 26px;
    opacity: 0.9;
    font-weight: 600;
}

.searchwhitebox input::placeholder {
    color: #adabab;
}

.searchwhitebox textarea {
    padding: 10px;
    font-size: 14px;
    border: none;
    color: #adabab;
    border-bottom: 1px solid #adabab;
    border-radius: 0px;
}

.searchwhitebox select {
    padding: 10px;
    border: none;
    outline: none;
    color: #5b545d;
    border-bottom: 1px solid #c3c3c3;
    border-radius: 0px;
    width: 100%;
    /* background: none; */
}

.searchwhitebox input:focus,
.searchwhitebox select:focus,
.searchwhitebox textarea:focus {
    outline: none;
    border-bottom: 1px solid #817f7f;
}

.searchwhitebox label {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transition: all 1s ease;
}

.searchwhitebox select:focus~label,
.searchwhitebox select[data-chosen] label,
.searchwhitebox input:focus~label,
.searchwhitebox input:not(:placeholder-shown)+label {
    top: -5px;
    opacity: 0.7;
    left: 15px;
    font-size: 14px;
}

.searchQuesbox{
    margin-top: 20px;
}

.searchQuesbox .col-sm-2{
    max-width: 195px;
}

.searchQuesbox select {
    padding: 10px;
    border: none;
    outline: none;
    color: #5b545d;
    border-bottom: 1px solid #c3c3c3;
    border-radius: 0px;
    width: 180px;
    /* background: none; */
}

.searchQuesbox select:focus{
    outline: none;
    border-bottom: 1px solid #817f7f;
}

.searchQuesbox label {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transition: all 1s ease;
}

.searchQuesbox select:focus~label,
.searchQuesbox select[data-chosen] label{
    top: -5px;
    opacity: 0.7;
    left: 15px;
    font-size: 14px;
}

.regwhitebox {
    position: relative;
    display: inline-block;
}

.regwhitebox input {
    padding: 10px;
    margin-top: 10px;
    border: none;
    color: #000000a1;
    border-bottom: 1px solid #adabab;
    border-radius: 0px;
}

.regwhitebox h1 {
    font-size: 26px;
    opacity: 0.9;
    font-weight: 600;
}

.regwhitebox input::placeholder {
    color: #adabab;
}

.regwhitebox textarea {
    padding: 10px;
    margin-top: 10px;
    font-size: 14px;
    border: none;
    color: #000000a1;
    border-bottom: 1px solid #adabab;
    border-radius: 0px;
}

.regwhitebox select {
    padding: 10px;
    margin-top: 10px;
    border: none;
    outline: none;
    color: #000000a1;
    border-bottom: 1px solid #adabab;
    border-radius: 0px;
}
.regwhitebox input:focus,
.regwhitebox select:focus,
.regwhitebox textarea:focus {
    outline: none;
    border-bottom: 1px solid #817f7f;
}

.regwhitebox label {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transition: all 1s ease;
}

.regwhitebox .nolabel {
    position: static;
    opacity: 1 !important;
    margin: 0px;
    font-size: medium !important;
    margin-left: 10px;
}

.regwhitebox select~label,
.regwhitebox select:focus~label,
.regwhitebox select[data-chosen] label,
.regwhitebox input:focus~label,
.regwhitebox input:not(:placeholder-shown)+label {
    top: -5px;
    opacity: 0.7;
    left: 15px;
    font-size: 14px;
}

.padT10 {
    padding-top: 10px;
}

.storecategory {
    width: 100%;
    border-radius: 20px !important;
}

.storecategory .label {
    width: auto !important;
}

.addeditmodals {
    padding: 30px;
    height: 100%;
}

.liveIcon {
    font-size: 9px !important;
}

.blink {
    animation: blinker 1.5s linear infinite;
}

@keyframes blinker {
    50% {
        opacity: 0;
    }
}

.changePassword .col-sm-12 {
    text-align: right;
}

.changePassword .col-sm-12 input {
    margin: 0px;
    padding: 0px 10px;
    height: 35px;
}

.changePassword .col-sm-12 i {
    position: relative;
    top: 30px;
    right: 10px;
    font-size: 18px;
    cursor: pointer;
    opacity: 0.5;
}

.modernreg .modalhead {
    box-shadow: #2f80edb3 0px 0px 1px 1px;
    margin-bottom: 10px;
    padding: 15px 0px 10px 0px !important;
    text-align: center;
    background: #2f80edb3;
    /* border-radius: 7px 7px 0 0; */
}

.modernreg .modalhead h1 {
    font-size: 25px;
    font-weight: 900;
}

.label {
    background: rgba(0, 140, 255, 0.596);
    font-size: 12px;
    padding: 5px;
    border-radius: 5px;
    color: #fff;
    margin-top: 5px;
    margin-right: 5px;
}
.quesDiv{
    padding-top: 10px;
    display: flex;
    flex-direction: row;
    justify-content: start;
    /* align-items: center; */
}
.quesDiv .p{
    margin-right: 10px;
}
.quesDiv p,.quesDiv h3,.quesDiv h6{
    margin-bottom: 0px;
}
.quesBankDiv{
    display: flex;
    flex-direction: row;
    justify-content: start;
}
.quesBankDiv .p{
    margin-right: 10px;
}
.quesBankDiv p,.quesBankDiv h3,.quesBankDiv h6{
    margin-bottom: 0px;
}
.quesContainer .col-sm-2 p{
    padding-top: 10px;
    display: flex;
    flex-direction: row;
    justify-content: start;
}
.ansDiv{
    padding-top: 10px;
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: center;
}
.ansDiv input{
    margin-right: 5px;
}
.ansDiv p{
    margin-bottom: 0px;
}

#Qtype {
    width: 100%;
    margin: 0px;
    padding: 0px;
}
#Qtype .col-8{
    width: 75%;
    padding: 0px;
}
#Qtype .option .col-11{
    margin-top: 10px;
    padding: 0px;
}
.qNoTop{
    display: flex;
    align-items: start;
    justify-content: end;
}
.qDelBtn{
    display: flex;
    align-items: start;
    justify-content: end;
}
.qDelBtn button{
    padding: 0px;
}
.aInputBtn{
    display: flex;
    align-items: start;
    justify-content: end;
    padding-top: 40px;
}
.aInputBtn input{
    margin: 0px !important;
}
.cke_dialog_body{
    width: 600px !important;
}
.cke_dialog_contents{
    width: 100% !important;
}
.cke_dialog_ui_input_textarea {
    height: 100px !important;
}
#Qtype .col-sm-1,
#Qtype .col-sm-10 {
    margin-top: 20px;
    margin-bottom: 10px;
}

#Qtype .col-md-1,
#Qtype .col-md-10 {
    margin-top: 10px;
    margin-bottom: 10px;
}

.option .row .col-sm-6 {
    margin: 0;
    padding: 0;
}

.option .row .col-sm-6 input {
    margin: 0;
    padding: 0;
}

.skills span{
    background: #2f80ed;
    color: #fff;
    margin-right: 10px;
    padding: 3px 10px;
    border-radius: 15px;
}
.skills a{
    color: #fff;
    text-decoration: none;
}
.skills a:hover{
    color: #dfdddd;
}
.skills a i{
    font-weight: 500;
}

#add,
#save {
    display: none;
}

.SCQremove_btn{
    color: #b1aeae;
    outline: none;
    background: none;
    border: none;
}
.remove_btn {
    /* margin-top: -43px; */
    color: #b1aeae;
    outline: none;
    background: none;
    border: none;
}

.mtneg {
    margin-top: -125px;
}

.centerMe {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.centermeRow{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.centerX {
    display: flex;
    justify-content: center;
}

.centerY {
    display: flex;
    align-items: center;
}

.centerEnd {
    display: flex;
    justify-content: center;
    align-items: flex-end;
}

.centerTop {
    display: flex;
    justify-content: flex-start;
}

.bigFont {
    opacity: 0.8;
    font-size: 20px;
    font-weight: 500;
}

.createBtn {
    margin: 0px;
    padding: 0px;
}

.content-wrapper {
    padding: 1.375rem 2.375rem !important;
}

.thebox{
    height: 380px !important;
    overflow-y: hidden;
}

.scrollExamCard {
    height: 430px !important;
    overflow-y: hidden;
}
#loadMoreUP{
    display: none;
}
.loadMore{
    padding-top: 5px;
}
.loadMore span,#loadMoreUP span{
    font-size: 12px;
    user-select: none;
}
.loadMore span:hover,#loadMoreUP span:hover{
    cursor: pointer;
    color: #2f80ed;
    font-weight: 600;
}
/* 
.scrollExamCard::-webkit-scrollbar {
    width: 10px;
}

.scrollExamCard::-webkit-scrollbar-track {
    border-radius: 10px;
}

.scrollExamCard::-webkit-scrollbar-thumb {
    background: #fff;
    border-radius: 10px;
}

.scrollExamCard::-webkit-scrollbar-thumb:hover {
    background: rgb(211, 210, 210);
} */

.userName h1 {
    font-size: 28px;
    font-weight: 600;
    opacity: 0.7;
}

.manageExam {
    padding: 0px;
    margin-top: 10px;
}

.manageExam .col-lg-4,.manageExam .col-sm-6 {
    padding: 10px;
}

.manageExam .col-6 {
    padding: 10px;
}

.exambox {
    min-height: 178px;
    padding-bottom: 0px !important;
    padding: 15px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 3px 3px 10px 0px rgb(0 0 0 / 12%);
}
.exambox .dropdown{
    padding: 0px;
    margin-left: -15px;
}
.exambox .row {
    padding-left: 10px;
}

.exambox .padd {
    padding-top: 15px;
}
.carddesc .edesc{
    padding-right: 0px;
}
.carddesc .edesc p{
    padding-top: 14px;
    opacity: 0.6;
    font-size: 12px;
    margin-bottom: 0px;
}

.exambox .row .col-3 button {
    padding: 2px 10px;
    font-size: 12px;
    font-weight: 600;
}
.exambox .head .col-8 p{
    font-size: 11px;
}
.exambox .mid .col-4 {
    padding-left: 0px;
}
.exambox .pb-3 .col-4 {
   height: 100%;
}

.exambox .start {
    padding-right: 0px;
    display: flex !important;
    justify-content: start !important;
    align-items: start !important;
}
.exambox .attmpt p{
    margin: 0px;
}

.exambox .row .col-7 {
    padding-top: 0px;
    opacity: 0.7;
}

.exambox .row .col-3 a {
    float: right;
}

.exambox .row .col-3 a i {
    color: #000;
}

.exambox .row .ename h4 {
    color: #000000a6 !important;
    font-weight: 700;
    margin-bottom: 1px;
}
.disNone{
    display: none;
}
.shortName span{
    cursor: pointer;
}
.exambox .row .ename p {
    font-size: 10px;
    opacity: 0.7;
    margin-bottom: -8px;
    margin-top: -5px;
}
.exambox .row .ename button{
    padding: 2px 15px;
    font-size: 11px;
    height: 16px;
}
.exambox .row .ename p:first-child{
    text-transform: uppercase;
    margin-bottom: 0px;
    margin-top: 0px;
}
.exambox .row .ename .catg{
    font-size: 15px;
    font-weight: 800;
}
.exambox .row .ename .times{
    font-size: 15px;
    font-weight: 800;
    padding-top: 5px;
}
.exambox .row .etime .times{
    text-align: center;
    font-size: 18px;
    font-weight: 900;
}
.exambox .padd .etime{
    padding-left: 0px;
}
.exambox .head .col-3{
    padding-right: 0px;
}

.exambox .row .etime p {
    display: flex;
    justify-content: end;
    font-size: 15px;
}

.exambox .row .col-8 p {
    opacity: 0.6;
    font-size: 12px;
    margin-bottom: 0px;
}

.padT20 {
    padding-top: 20px;
}
.padT15 {
    padding-top: 15px;
}

.exambox .row .col-4 {
    display: flex;
    justify-content: end;

}

.exambox .row .col-4 button,
.exambox .row .col-4 a {
    padding: 2px 15px;
    font-size: 11px;
    height: 16px;
}
.padMedia {
    padding: 10px 50px;
}
.popup_allowed {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.popup_allowed input{
    margin: 0px;
}
.popup_allowed label{
    margin: 0px;
}
.popup_allowed button{
    padding: 2px 8px;
    border-radius: 5px !important;
}

.px5{
    padding-right: 30px !important;
    padding-left: 30px !important;
}

.card-sales {
    margin-bottom: 20px;
    padding: 20px;
    padding-bottom: 5px !important;
    padding-top: 15px !important;
    background: #fff;
    border-radius: 10px;
    box-shadow: 3px 3px 10px 0px rgb(0 0 0 / 12%);
}
.card-sales h4{
    font-size: 18px;
    opacity: 0.7;
    font-weight: bold;
    margin-bottom: 15px;
    margin-top: 0px;
}
.card-sales h4 span{
    color: gray;
    opacity: 1;
}
.sales-pay-box{
    background-color: #fff;
    margin-bottom: 15px;
    width: 100%;
    margin-left: 0px;
    border-radius: 0px 0px 5px 5px;
    padding: 15px;
}
.sales-pay-box h4{
    font-size: 15px;
    opacity: 0.7;
    font-weight: bold;
}
.sales-pay-box h4 span{
    color: gray;
    opacity: 1;
}
/* overlay-images */
.overlay-images .money-box1{
    background-image: url('https://doik495yr0ub5.cloudfront.net/dashboard/icons/money-box.png');
    background-repeat: no-repeat;
    background-size: 33% 53%;
    position: absolute;
    top: 20px;
    left: 190px;
    height: 100%;
}
.overlay-images .payroll-growth{
    background-image: url('https://doik495yr0ub5.cloudfront.net/dashboard/icons/payrool-growth.png');
    background-repeat: no-repeat;
    background-size: 46% 76%;
    position: absolute;
    top: 5px;
    left: 400px;
    height: 100%;
    opacity: 0.8;
}
.overlay-images .payroll-money{
    background-image: url('https://doik495yr0ub5.cloudfront.net/dashboard/icons/payrool-money.png');
    background-repeat: no-repeat;
    background-size: 62% 70%;
    position: absolute;
    top: 5px;
    left: 750px;
    height: 100%;
}
.overlay-images .money-box2{
    background-image: url('https://doik495yr0ub5.cloudfront.net/dashboard/icons/money-box.png');
    background-repeat: no-repeat;
    background-size: 27% 53%;
    position: absolute;
    top: 9px;
    right: -146px;
    height: 100%;
}


.newexambox {
    min-height: 195px;
    padding-bottom: 0px !important;
    padding: 15px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 3px 3px 10px 0px rgb(0 0 0 / 12%);
}
.coursebox{
    min-height: 150px !important;
}
.enrollcoursebox{
    min-height: 120px !important;
}
.enrollcoursebox .description{
    padding-right: 0px;
}
.enrollcoursebox .enroll{
    padding-left: 0px;
}
.enrollcoursebox .enroll a{
    padding: 5px 10px;
    margin-top: -5px;
}

/* course-setting */
.course-setting .course-tabs,
.toggleLesson,
.lessonbox{
    display: none;
}
.course-setting .curriculum,
.toggleLesson-0-0,
.lessonbox0{
    display: block;
}
.lesson-theory-modal .modal-dialog,
.chap-theory-modal .modal-dialog{
    max-width: 780px !important;
    margin-top: 50px;
}
.course-setting .button{
    border-bottom: 1px solid gray;
}
.course-setting .a{
    cursor: pointer !important;
}
.course-iframe iframe{
    width: 100%;
    height: 120px;
}
.course-setting select{
    color: #495057;
}
.course-setting select:focus{
    border: 1px solid #7facda;
}
.course-setting .course_btn{
    padding: 5px 20px;
    border: none;
    color: gray;
    background: none;
}
.course-setting .preview_btn{
    padding: 5px 20px;
    border: none;
    color: gray;
    background: none;
    font-size: 14px;
}
.course-setting .course-left-bar{
    height: 100%;
    min-height: calc(100vh - 199px);
    padding: 20px;
    border-right: 1px solid rgb(173, 173, 173);
}
.course-setting .course-left-bar .row{
    margin: 0px;
}
.course-setting .course-left-bar .chapterCard{
    background: #fff;
    border-radius: 5px;
    text-align: center;
    padding: 15px;
    padding-bottom: 10px;
    margin-bottom: 15px;
}
.course-setting .course-left-bar .chapterCard .col-sm-6{
    padding: 0px;
}
.course-setting .course-left-bar .chapterCard button{
    background: #2f80ed;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 11px;
    padding: 2px 5px;
    float: left;
}
.course-setting .course-left-bar .chapterCard a{
    background: #444546;
    color: #fff !important;
    text-decoration: none;
    border: none;
    border-radius: 4px;
    font-size: 11px;
    padding: 2px 5px;
    margin: 0px !important;
    float: right;
}
.course-setting .course-left-bar .chapterCard .lessonCard{
    border: 1px solid #00000033;
    padding: 5px 0px;
    margin-bottom: 10px;
}
.course-setting .course-left-bar .chapterCard .lessonCard-0-0{
    border: 1px solid #2f80ed91;
    background: #2f80ed26;
}
.course-setting .course-left-bar .chapterCard .lessonCard p{
    margin: 0px;
}
.course-setting .course-left-bar .chapterCard .fa-sort-down{
    float: right;
    margin-top: -27px;
    cursor: pointer;
    padding: 0px 5px;
    font-size: 15px;
}
.course-setting .course-left-bar .chapter_btns .col-sm-6{
    padding: 0px;
}
.course-setting .course-left-bar .chapter_btns button{
    background: gray;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 11px;
    padding: 2px 7px;
    float: left;
}
.course-setting .course-left-bar .chapter_btns a{
    background: red;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 10px;
    padding: 2px 5px;
    float: right;
    text-decoration: none;
}
.course-setting .course-left-bar .chapter_btns .certification_btn{
   text-align: center;
   margin-top: 10px;
}
.course-setting .course-left-bar .chapter_btns .certification_btn a{
    background: #2f80ed;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 11px;
    padding: 5px 10px;
    float: unset;
}
.course-setting .course-left-bar .chapter_btns .certification_btn a i{
    font-size: 11px;
}

.course-setting .course-tabs{
    padding-top: 15px;
}
.course-setting .course-tabs p{
    margin: 0px;
    color: gray;
    font-size: 12px;
}
.course-setting .course-tabs form{
    background: #fff;
    padding: 15px;
    border-radius: 5px;
}
.course-setting .course-tabs form label{
    margin-top: 15px;
    font-size: 14px;
    font-weight: 600;
    color: #000000ce;
}
.course-setting .course-tabs h3,
.course-setting .course-tabs h4,
.course-setting .course-tabs h5,
.course-setting .course-tabs h6{
    margin: 0px;
    font-weight: 600;
    color: #000000ce;
}
.course-setting .course-tabs h4{
    margin-bottom: 6px;
    color: gray;
}
.course-setting .course-tabs button[type=submit]{
    color: #fff;
    background: #2f80ed;
    padding: 5px 25px;
    border: none;
    font-size: 15px;
    border-radius: 4px;
    margin-top: 30px;
}
.course-setting .course-tabs .delete-course{
    margin-top: 30px;
}
.course-setting .course-tabs .delete-course p{
    line-height: 15px;
}
.course-setting .course-tabs .delete-course a{
    border-radius: 5px;
    padding: 5px 15px;
    margin-top: 10px;
}
.course-setting .course-tabs .course-verfied{
    background: rgb(255 227 227);
    padding: 10px;
    margin: 0px;
    margin-top: 15px;
    border-radius: 4px;
}
.course-setting .course-tabs .course-verfied p{
    font-size: 12px;
    display: flex;
    align-items: center;
}
.course-setting .course-tabs .course-verfied span{
    font-size: 8px;
}
.course-setting .course-tabs .course-verfied .fa-check{
    color: rgb(255 227 227);
}

.course-setting .curriculum .icon{
    background: #fff;
    color: #b9b9b9;
    padding: 10px;
    text-align: center;
    border: 1px solid rgba(128, 128, 128, 0.144);
    border-radius: 4px;
}
.course-setting .curriculum .col-sm-6{
    margin-top: 20px;
}
.course-setting .curriculum .col-sm-2{
    padding: 0px 10px;
}
.course-setting .curriculum .assess{
    margin-top: 40px;
}
.course-setting .curriculum .lesson_quiz a{
    text-decoration: none;
}

.course-setting #videourl_submit{
    display: none;
}

.course-setting .settings form h4{
    margin: 0px;
    font-weight: 600;
    color: #000000bb;
}
.course-setting .settings form label{
    margin-top: 20px;
    color: #0000008c;
}
.course-setting .settings .course-admin{
    padding-top: 40px;
    background: none;
}
.course-setting .settings .course-admin button{
    margin-top: 15px;
    float: right;
}
.course-setting .settings .cover_image{
    font-size:11px;
    margin-top:5px;
}

.course-setting .publish input{
    margin-right: 10px;
    margin-top: 25px;
}
.course-setting .publish .rows{
    padding-left: 90px;
    padding-right: 90px;
}
.course-setting .publish form{
    padding: 25px;
}
.course-setting .publish form h4{
    color: #000000ce;
}
.course-setting .publish form p{
    line-height: 15px;
}
.course-setting .publish form label{
    font-size: 16px;
    font-weight: 500;
}

.newexambox .fafa{
    color: #fff;
    border-radius: 50%;
    padding: 3px;
    font-size: 14px;
}
.newexambox .fa-s{
    background: green;
}
.newexambox .fa-w{
    background: #f1b703;
}
.newexambox .text-warning{
    color: #f1b703 !important;
}
.newexambox .text-danger{
    color: #FF4747 !important;
}
.newexambox .status{
    padding-right: 0px;
    display: flex !important;
    justify-content: start !important;
    align-items: start !important;
}
.newexambox .setting{
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
}
.newexambox .names h4{
    margin: 0px;
    /* margin-top: 5px; */
}
.newexambox .names .n{
    font-weight: 700;
}
.newexambox .names .c{
    font-weight: 400;
}
.newexambox .details .time{
    font-weight: 700;
    font-size: 18px;
    color: #f1b703;
    margin-bottom: 15px;
}
.newexambox .details .infos,
.newexambox .description p{
    color: gray;
    font-size: 12px;
    margin: 0px;
}
.newexambox .graph{
    display: flex;
    flex-direction: column;
    padding-top: 3px;
}
.newexambox .newgraph{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.newexambox .progressbar{
    background: rgba(128, 128, 128, 0.548);
    border-radius: 10px;
    height: 35%;
}
.newexambox .progressbar p{
    background: #2f80ed;
    border-radius: 10px;
    height: 100%;
}
.newexambox .progressbar b{
    position: relative;
    top: -26px;
    left: 46%;
    color: #fff;
    font-size: 12px;
}

.dropbtn {
    float: right;
    padding: 0;
    /* margin-left: 50px !important; */
    background: none;
    border: none;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.shareLink {
    display: none;
    padding: 5px;
    overflow: hidden;
    position: absolute;
    top: 40px;
    right: 15px;
    background-color: #fff;
    box-shadow: 1px 1px 7px 1px rgb(0 0 0 / 20%);
    font-size: 16px;
    z-index: 1000;
    border-radius: 5px;
    width: 100px;
}

.flexbox {
    display: flex;
}

.shareLink .col-4 {
    padding: 0px;
}

.shareLink a {
    color: #0000008a !important;
    padding: 0px 12px !important;
}

.shareLink a:hover {
    color: #000 !important;
}

.dropdown-content {
    display: none;
    overflow: hidden;
    position: absolute;
    top: 15px;
    left: -45px;
    background-color: #fff;
    box-shadow: 1px 1px 7px 1px rgb(0 0 0 / 20%);
    font-size: 10px;
    z-index: 1;
    border-radius: 5px;
}

.dropdown-content a {
    float: none !important;
    color: #0000008a;
    padding: 6px 15px;
    text-decoration: none;
    display: block;
}

.dropdown-content a:hover {
    background: #0000002d;
}

/* .dropdown:hover .dropdown-content {
    display: block;
} */

.accordion-button:focus,
.accordion-body input,
.accordion-body textarea,
.accordion-body select {
    box-shadow: none !important;
    outline: none !important;
}

.form-control:focus,
.form-control input,
.form-control textarea,
.form-control select {
    box-shadow: none !important;
    outline: none !important;
}

.accordion-item {
    margin-bottom: 30px;
    border-radius: 8px !important;
    border: none !important;
    box-shadow: 1px 1px 5px 1px #0000001f;
}

.accordion-button {
    border-radius: 8px !important;
}

.accordion-button::after {
    content: none !important;
}

.accordion-ptext {
    font-size: 18px;
    font-weight: 500;
    padding-bottom: 6px;
    margin: 0;
    color: #767373;
}

.accordion-subtext {
    margin: 0;
    opacity: 0.6;
    font-size: 15px;
}

.accordian-arrow {
    margin-top: 14px;
    opacity: 0.4;
}

.accordian-arrow2 {
    margin-left: 900px;
    margin-top: -33px;
    opacity: 0.4;
}

.previewModal h5 {
    border-radius: 12px;
    text-align: center;
    background: #dee79d;
    color: #6a6a6a;
    font-size: 14px;
    padding: 4px;
}

.regPage h5 {
    opacity: 0.75;
    font-size: 23px;
}

.regPage p {
    opacity: 0.75;
}
.regPage .p{
    margin: 0px;
    padding: 0px;
    text-align: start;
}
.regPage .p:last-child{
    margin: 0px;
    padding: 0px;
    text-align: center;
    padding-bottom: 10px;
}

.regPage h6 {
    border-radius: 9px;
    text-align: center;
    background: #2f80ed;
    color: #fff;
    font-size: 12px;
    padding: 3px;
}

.examPanelNav {
    margin: 0px;
    padding: 0px;
    height: 75px;
    background-color: #9191910f;
    box-shadow: #9191914f 2px 2px 10px 0px;
}

.examPanelNav .logo {
    padding: 10px;
}

.examPanelNav .logo .small {
    display: none;
}

.examPanelTitle {
    font-weight: 700;
    font-size: 24px;
}

.examPanelNav .centerMe{
    padding: 0px;
}

.quemark {
    height: calc(100vh - 105px);
    margin-top: 30px;
    margin-left: -15px;
    background-color: #91919117;
}

.quesboxes {
    padding: 15px;
}

.quesboxes .row {
    margin: 16px;
}
.answerBox{
    margin: 0px;
    padding-top: 20px;
}
.quesContainer {
    background: none;
    box-shadow: 0px 4px 20px 0px var(--ques-shadow);
    border-radius: 8px;
    margin-bottom: 24px;
    color: rgb(78, 78, 78);
    padding: 15px !important;
}
.answerBox0,
.answerBox2{
    padding: 0px;
    padding-right: 5px;
}
.answerBox1,
.answerBox3{
    padding: 0px;
    padding-left: 5px;
}
.answerBox .ansBox{
    display: flex;
    background: none;
    box-shadow: 2px 2px 10px 1px var(--ques-shadow);
    border-radius: 8px;
    margin-bottom: 10px;
    padding: 20px;
    color: gray;
}
.answerBox .ansBox input{
    margin-right: 5px;
}
.answerBox .ansBox p{
    margin: 0px;
}
.queHead .col-8{
    display: flex;
    justify-content: start;
    align-items: center;
}
.queHead p{
    margin: 0px;
    padding: 0px;
    font-size: 18px;
}
.queHead input{
    margin: 0px;
    padding: 0px 10px;
    margin-bottom: 5px;
    height: 35px;
}
.queBox .col-12{
    padding: 0px;
}
.queImage .col-5 p{
    margin: 0px;
    padding: 0px;
    padding-top: 10px;
    font-size: 18px;
}
.queImage .col-7{
    display: flex;
    justify-content: flex-end;
}
.queImage label{
    position: static;
    margin: 0px;
    padding: 0px;
}
.queImage label p{
    margin: 0px;
}

.timeLeft h5,
.timeLeft h6 {
    font-size: 14px;
}

.prebtn,
.skipbtn,
.submitbtn {
    border-radius: 6px !important;
}

.questionbank .col-sm-12:nth-child(1) {
    text-align: center;
}

.questionbank .col-sm-12 h1 {
    font-size: 24px;
    font-weight: 600;
}

.questions {
    width: 100%;
    height: 100%;
    background: none;
}

.questions input,
.questions select,
.questions textarea {
    background: none;
}

.questions input:focus,
.questions textarea:focus,
.questions select:focus {
    background: none;
}

.questions .col-sm-2 input {
    margin-top: -4px;
}

ul {
    list-style-type: none;
}

.floatL {
    float: left;
}

.floatR {
    float: right;
}

.width250 {
    width: 250px;
}

.urlbox {
    margin-top: -30px;
    border-radius: 0 0 10px 10px;
    font-size: 12px;
}

.urlbox button {
    color: #5c5c5c;
    border: none;
    background: none;
}

.urlbox button:focus {
    outline: none;
    font-size: 13px;
}

.urlbox a {
    color: #fff;
    text-decoration: none;
    padding-right: 15px;
}

.flexREnd {
    display: flex !important;
    justify-content: flex-end !important;
}


.examResult svg {
    width: 34%;
    border-radius: 50%;
}
.manageExam svg{
    background: #2f80ed;
    border-radius: 50%;
    height: 50px;
}
.bg-warning-lite{
    background: #ffc100d1 !important;
}
.bg-danger-lite{
    background: #ff4747b0 !important;
}
.bg-success-lite{
    background: #49c949d1 !important;
}
.bg-info-lite{
    background: #2f80edbd !important;
}
.bg-eel{
    background: #2f80ed !important;
}

.examResult {
    min-height: calc(100vh - 75px);
    padding: 0px 200px;
    background: rgb(222 240 247 / 49%);
}

.examResult h5 {
    margin: 0px;
}

.examResult p {
    margin: 0px;
    padding-bottom: 10px;
}

.intheEnd {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.examResult .col-sm-12,
.examResult .col-sm-6 .box,
.examResult .col-sm-6 .row {
    margin-top: 20px;
    padding: 30px;
    box-shadow: rgb(112 112 112 / 19%) 0px 0px 5px 0px;
    background: #fff;
    border-left: 4px solid #2f80ed;
}

.examResult .col-sm-6 .row {
    height: 185px;
}

.midiv {
    padding: 0px;
}

.examResult .midiv .box {
    height: 115px;
}

.examResult .col-sm-12 p,
.examResult .midiv p,
.hed {
    font-size: 14px;
    font-weight: 900;
    opacity: 0.8;
}

.examResult .container,
.examResult .container .col-12 {
    padding: 0px;
}

.examResult .container p {
    padding-bottom: 5px;
}

.resultHead {
    border-radius: 30px 30px 0px 0px !important;
    color: #fff;
    background: #2f80ed !important;
}

.resultFoot {
    border-radius: 0px 0px 30px 30px !important;
    color: #fff;
    background: #2f80ed !important;
}

.saveresult {
    display: flex;
    justify-content: flex-end;
}

.saveresult a {
    background: none;
    color: #fff;
    outline: none;
    font-size: 14px !important;
    border: 1px solid rgba(255, 255, 255, 0.39);
    border-radius: 5px !important;
}

.saveresult a:hover {
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.692);
}

.saveresult button {
    background: none;
    color: #fff;
    outline: none;
    font-size: 14px !important;
    border: 1px solid rgba(255, 255, 255, 0.39);
    border-radius: 5px !important;
}

.saveresult button:hover {
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.692);
}

.centerAlign {
    display: flex;
    align-items: center;
}

.terms {
    min-height: 500px;
}

.terms p {
    padding-top: 10px;
    font-weight: 300 !important;
}

/* table css */
.table-striped tbody tr:nth-of-type(odd) {
    background-color: none !important;
}

.table-striped tbody tr:nth-of-type(even) {
    background-color: #fff !important;
}

.table-striped tbody tr:nth-child(1) {
    background-color: rgb(150 150 150 / 15%) !important;
}

.table-striped thead tr {
    background-color: rgba(150, 150, 150, 0.150) !important;
}

.table td,
.table th {
    padding: 14px !important;
    padding-right: 0px !important;
}

#buttons {
    padding-top: 20px;
}

#buttons input[type="button"] {
    transition: all .3s;
    border: 1px solid #ddd;
    padding: 8px 16px;
    text-decoration: none;
    border-radius: 5px;
    font-size: 15px;
}

#buttons .active {
    background-color: #2f80ed;
    color: #fff;
}

#buttons input[type="button"]:not(.active) {
    background-color: transparent;
}

#buttons input[type="button"]:hover:not(.active) {
    background-color: #ddd;
}

.profile .col-md-4,
.profile .col-md-6,
.profile .col-md-12 {
    margin-bottom: 20px;
}

.picProfile,
.myprofile {
    height: 410px;
}
.studentPicProfile{
    height: 477px;
}
.teacherPicProfile{
    height: 402px;
}

.picProfile {
    display: flex;
    justify-content: center;
    padding: 15px;
    border-radius: 20px 0px 0px 20px;
    background: rgb(0 0 0 / 8%);
}

/* .picProfile img {
    width: 85%;
    padding-bottom: 20px;
} */

/* .picProfile label {
    text-align: center;
    border: 1px solid #fff !important;
    padding: 10px;
    border-radius: 11px;
} */

.picProfile p {
    opacity: 0.6;
    font-size: 18px;
    text-align: center;
}
.picProfile form{
    width: 100%;
    height: 100%;
}

.picProfile .imgBox{
    position: relative;
    min-height: 200px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.picProfile .cpass{
    margin-top: -50px;
}

.profileImg{
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
    /* border-radius: 10px; */
}

.profileImg img{
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: fill;
    border-radius: 10px;
}
.profileHover{
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0, 0, 0, 0.356);
    transition: 0.2s;
    opacity: 0;
    z-index: 10;
    border-radius: 10px;
}
.profileHover p{
    color: #fff;
    opacity: 1;
    text-transform: uppercase;
    font-weight: 700;
}
.imgBox:hover .profileHover{
    opacity: 1;
    cursor: pointer;
}


.highScore {
    margin-bottom: 10px;
}

.highScore img {
    width: 40px;
    border: 3px solid gold;
    border-radius: 50%;
    background: lightgoldenrodyellow;
}

.highScore .col-12 {
    padding: 0px;
}

.highScore p {
    padding: 0px;
    margin: 0px;
}

.highScore b {
    font-size: 14px;
    font-weight: 800;
}

.pzero {
    padding: 0px;
}

.studentfilter {
    display: flex;
    align-items: flex-end;
}

.studentfilter a {
    text-decoration: underline;
}

.table td {
    font-size: 12px;
}

.studentBox {
    margin: 0px;
    width: 100%;
    padding: 20px;
    background: #fff;
    border-radius: 0px 0px 10px 10px;
    margin-bottom: 15px;
}

.stbox, .subbox {
    display: none;
    width: 100%;
}
.btnSmall{
    height: 25px;
    padding: 3px 10px !important;
}

.stbox p {
    margin: 0px;
    opacity: 0.7;
}

.stbox h5 {
    font-size: 16px;
    font-weight: 600;
    opacity: 0.8;
}

.stbox td {
    padding: 0px !important;
}

.padd0 {
    padding: 0px;
}

.showstcard {
    cursor: pointer;
    font-size: 23px !important;
}

.svgBox {
    display: flex;
    align-items: center;
    justify-content: center;
}

.svgBox svg {
    width: 40%;
    border-radius: 50%;
}

.marks,
.marks p,
.attemted,
.attemted p,
.correct,
.correct p {
    border-radius: 10px;
    padding: 3px;
    opacity: 1;
}

.marks,
.attemted,
.correct {
    background: #bccadd;
    padding: 0px !important;
}

.marks p {
    background: red;
}

.attemted p {
    background: blue;
}

.correct p {
    background: green;
}

/* .table-striped tbody tr:hover{
    background: rgba(204, 204, 204, 0.158) !important;
    box-shadow: #ccc 1px 1px 4px 1px;
  } */
.examBody .forMob {
    display: none;
}

.mPadd0 {
    padding: 0px 15px;
}

footer {
    padding: 20px !important;
}

.gradingDiv {
    margin: 15px;
}

.gradingDiv .col-sm-4 {
    padding-bottom: 20px;
}

.active_exam_text {
    opacity: 0.6;
}

.terms {
    border: none !important;
    border-radius: 5px;
}

.terms form {
    text-align: center;
}

.terms input,
.terms span {
    opacity: 0.6;
    float: left;
    font-size: 15px;
}

.terms span {
    margin-top: -2px;
    margin-left: 6px;
}
.alertResult{
    width: 340px;
    border-radius: 10px;
    margin: 180px auto;
}
.qEditCard{
    /* background-color: #ffffff6e;
    box-shadow: 0px 4px 32px 0px var(--ques-shadow); */
    border-radius: 8px;
    margin-bottom: 20px;
    padding: 25px !important;
}
.qEditCard h3{
    text-decoration: underline;
    font-weight: bold;
    font-size: 28px;
}
.qEditCard form{
    width: 100% !important;
}
.quesEditData{
    margin-top: 50px !important;
}
.quesEditData select{
    padding: 10px;
    border: none;
    outline: none;
    color: #000000a1;
    border-bottom: 1px solid #adabab;
    border-radius: 0px;
    margin-bottom: 35px;
    background: none;
}
.quesEditData select:focus{
    outline: none !important;
    border: none !important;
    background: none !important;
    border-bottom: 1px solid #817f7f !important;
}
.quesEditData label {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transition: all 1s ease;
}
.quesEditData select~label,
.quesEditData select:focus~label,
.quesEditData select[data-chosen] label{
    top: -20px;
    opacity: 0.7;
    left: 15px;
    font-size: 14px;
}
.courseCard iframe{
    width: 100%;
    height: 320px;
}
.courseCard i{
    color: #fff;
    font-size: 14px;
    padding: 4px;
    border-radius: 50%;
}
.courseCard h6{
    color: #313131;
    margin: 0px;
    margin-top: 10px;
}
.courseCard input{
    padding: 10px;
    margin-bottom: 10px;
    border: none;
    color: #000000a1;
    border-bottom: 1px solid #adabab;
    border-radius: 0px;
}
.courseCard input:focus{
    border-bottom: 1px solid #696969;
}

.showcourse{
    cursor: pointer;
    font-size: 23px !important;
    padding: 0px !important;
}
.showcourse i{
    margin-left: -30px;
}
.corbox {
    display: none;
    width: 100%;
}
.corbox td p {
    margin: 0px;
    opacity: 0.7;
    font-size: 15px;
    margin-bottom: 5px;
}
.corbox td h5 {
    font-size: 18px;
    font-weight: 600;
    opacity: 0.8;
}
.corbox td {
    padding: 15px !important;
    padding-bottom: 25px !important;
}

/* course view css  */
.chap-container{
    padding: 0px;
    background-color: #fff;
    border-radius: 5px;
    border-color: rgb(0 0 0 / 12%);
    box-shadow: 1px 1px 7px 0px rgb(0 0 0 / 12%);
    overflow-y: scroll;
    overflow-x: hidden;
    height: calc(100vh - 225px);
    z-index: 100;
}
.chap-container::-webkit-scrollbar {
    display: none;
}
.chap-sidebar{
    position: absolute;
    right: 50px;
    max-width: 19% !important;
    /* background: #dddddd; */
    background-color: #2f70edb5;
    color: #fff;
    height: calc(100vh - 225px);
    border-radius: 0px 5px 5px 0px;
}
.chap-sidebar li{
    color: #fff;
    cursor: pointer;
    user-select: none;
}
.chap-sidebar li:hover{
    text-decoration: underline;
}
.chap-sidebar i{
    margin-right: 5px;
}
.chap-nav{
    padding-top: 10px;
}
.chap-nav span{
    padding: 5px 10px;
    margin-right: 10px;
}
.chap,.quiz{
    display: none;
}
.chap0{
    display: block;
}
.notes_btn{
    border-bottom: 2px solid #2f80ed; 
}
.chap iframe{
    width: 100%;
    height: 400px;
}
.quiz .quesboxes{
    padding-top: 0px !important;
}
.cli0{
    text-decoration: underline;
}
.quiz .quesContainer,
.quiz .ansBox{
    box-shadow: 0px 2px 8px 0px #0f192626 !important;
}
.quiz .sol{
    padding: 0px;
}
.quiz .solbtn {
    background: none;
    border: none;
}
.quiz .solution{
    display: none;
}
.quiz .solution .row{
    margin: 0px;
    padding-top: 15px;
}



.quesCard{
    background-color: #fff;
    box-shadow: 0px 4px 32px 0px var(--ques-shadow);
    border-radius: 8px;
    margin-bottom: 24px;
    padding: 32px !important;
}
.ques-dropdown-content {
    display: none;
    overflow: hidden;
    position: absolute;
    top: 15px;
    left: 60px;
    background-color: #fff;
    box-shadow: 1px 1px 7px 1px rgb(0 0 0 / 20%);
    font-size: 10px;
    z-index: 1;
    border-radius: 5px;
}

.ques-dropdown-content a {
    float: none !important;
    color: #0000008a;
    padding: 6px 15px;
    text-decoration: none;
    display: block;
}
.quesCard .row:first-child{
    margin-bottom: 15px;
}
.quesCard .que{
    margin-top: 25px;
}
.quesCard .spans span{
    border-radius: 8px;
    font-weight: 600;
    text-transform: capitalize;
    font-size: 14px;
    line-height: 150%;
    padding: 8px 12px;
    margin-bottom: 12px;
    margin-right: 8px;
    color: #7A8B94;
    background: #fff;
    border: 1px solid #E9EEF2;
}
.quesCard .que p{
    font-size: 16px;
    line-height: 150%;
    color: #3C4852;
}
.quesCard .key h5:first-child{
    font-weight: 600;
    font-size: 16px;
    line-height: 150%;
    color: #3C4852;
}
.ques-dropdown-content a:hover {
    background: #0000002d;
}
.quesCard .col-sm-6:nth-child(1),
.quesCard .col-sm-6:nth-child(3){
    padding-right: 5px;
}
.quesCard .col-sm-6:nth-child(2),
.quesCard .col-sm-6:nth-child(4){
    padding-left: 5px;
}
.quesCard .ansBox{
    background-color: #fff;
    border: 1px solid var(--ques-shadow);
    border-radius: 8px;
    margin-bottom: 10px;
    padding: 20px 32px;
    color: gray;
}
.quesCard .ansBox p{
    margin: 0px;
}
.quesCard .solbtn{
    padding: 0;
    background: none;
    border: none;
}
.quesCard .solution{
    display: none;
}
.quesCard .explanation{
    padding-top: 15px;
    color: #3C4852;
}
.quesCard iframe{
    width: 100%;
}
@media only screen and (max-width:600px) {
    .ques-dropdown-content {
        left: -55px;
    }
    .quesCard .col-sm-6{
        padding: 0px !important;
    }
    .createBtn .btn-info{
        padding: 12px;
    }
    .createBtn .ml-4{
        margin-left: 10px !important;
    }
    .ml5px{
        margin-left: 5px;
    }
    .searchQuesbox .col-6{
        width: 100%;
        padding: 5px;
    }
    .searchQuesbox select{
        width: 100%;
    }
    .studentfilter{
        display: flex;
        justify-content: center;
        margin-top: 10px;
    }
    .searchQuesbox{
        padding: 0px 10px;
    }
    .quesCard .spans .col-12{
        display: flex;
        flex-direction: column;
    }
    .quesCard .spans span{
        font-size: 12px;
        margin-bottom: 5px;
        padding: 5px 10px;
    }
}
@media only screen and (max-width: 1400px) {
    .accordian-arrow2 {
        margin-left: 810px;
    }
    .examResult svg {
        width: 65%;
        border-radius: 50%;
        margin-top: 25px;
    }
}
.removeQue{
    float: right;
}
.removeQue a{
    background: none;
    border: 1px solid #ff7070;
    color: #ff0000a6;
    padding: 0px 5px;
}
.removeQue a i{
    font-size: 14px;
}
.removeQue a:hover{
    background: #ff7070;
    color: #fff;
}
@media only screen and (max-width:600px) {
    .padMedia{
        padding: 10px;
    }
    .overlay-images{
        display: none;
    }
    .studentPicProfile,.picProfile {
        height: 350px;
    }
    .removeQue{
        float: none;
    }
    .removeQue a{
        float: right !important;
    }
    .quesNumber {
        padding: 12px 0px 3px 0px !important;
    }

    .quesNumber h5 {
        font-size: 20px;
    }

    .exambox {
        height: 100%;
    }

    .myprofile {
        height: 100%;
        border-radius: 0px 0px 20px 20px;
    }

    .picProfile {
        border-radius: 20px 20px 0px 0px;
    }

    .examBody .forMob {
        display: block;
        height: 100%;
    }

    .examBody .forMob .row:nth-child(1) {
        padding: 0px 10px;
    }

    .examBody .forMob .row:nth-child(2) {
        padding: 10px 16px;
    }

    .examBody .forPC {
        display: none;
    }

    .searchwhitebox {
        padding: 0px;
    }

    .searchwhitebox .col-sm-3,
    .searchwhitebox .col-sm-1 {
        padding: 10px 0px;
    }

    .searchwhitebox .col-12 {
        display: flex;
        justify-content: center;
    }

    .mPadd0 {
        padding: 0px;
    }

    .examPanelNav .logo img {
        width: 50%;
    }

    .examPanelNav .logo .full {
        display: none;
    }

    .examPanelNav .logo .small {
        display: block;
        width: 35px;
    }

    .timeLeft h4 {
        font-size: 12px;
    }

    .examResult {
        padding: 0px 35px;
    }

    .mob-dis-none {
        display: none !important;
    }

    .lg-dis-none {
        display: block;
    }

    .quesDiv{
        padding-top: 0px;
    }

    .quesboxes .row {
        margin-bottom: 0px;
    }

    .optionDiv{
        margin-top: 0px !important;
    }

    .examResult .midiv {
        padding: 0px !important;
    }

    .examResult .mobPadd {
        padding: 0px 15px !important;
    }

    .saveresult a {
        display: flex;
        letter-spacing: 2px;
    }

    .examResult .hideMe {
        display: none;
    }

    .quemark {
        margin-left: 0px;
    }

    .content-wrapper {
        padding: 30px !important;
    }

    .regwhitebox {
        height: 100%;
        justify-content: center;
        padding: 15px !important;
    }

    .accordian-arrow2 {
        display: none;
    }

    .width250 {
        width: 200px !important;
    }

    .gradingDiv {
        margin: 0px;
    }

    .active_exam_text {
        font-size: 15px;
    }

    #collapseTwo .accordion-body {
        padding: 15px !important;
    }

    #collapseTwo .regwhitebox,
    #collapseTwo form {
        padding: 0px !important;
    }

    #collapseTwo .text-danger {
        font-size: 10px;
    }

    .questionbank .col-sm-12 {
        display: flex;
        justify-content: center;
        padding: 0px;
    }

    #add {
        margin-top: 40px !important;
    }

    .option input {
        width: 120px;
    }

    .pl-4 {
        padding: 10px !important;
    }

    #Qtype .col-2,
    #Qtype .col-1 {
        padding: 0px;
    }

    .exambox .row:nth-child(1) .col-1 {
        margin-left: -2px;
    }

    .navbar-dropdown {
        width: auto !important;
        left: auto !important;
    }

    .searchwhitebox .col-6:nth-child(1) {
        padding-right: 10px;
    }

    .searchwhitebox .col-6:nth-child(2) {
        padding-left: 10px;
    }

    .exambox .row .col-3 button {
        padding: 3px 9px;
    }

    .questionbank {
        margin-right: -10px;
        margin-left: -10px;
    }

    .grid-margin p {
        font-size: 12px;
    }

    .grid-margin h4 {
        margin-bottom: 5px !important;
    }

    .grid-margin .highScore {
        margin-top: 15px !important;
    }

    #Qtype {
        padding: 10px;
    }

    .exambox {
        padding: 15px 15px 0px 5px;
    }
    .urlbox {
        padding: 1px;
        margin-left: -5px;
    }
}

.quesNumber {
    padding: 9px 9px 0px 9px;
    border: 1px solid #000;
    border-radius: 50%;
}

.modal-feature {
    max-width: 860px;
}
.feature-roles {
    margin-bottom: 15px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.feature-role {
    border-radius: 10px;
    padding: 2px 10px;
    color: #fff;
    font-size: 12px;
    font-weight: bold;
} 
.feature-role-all {
    background-color: #2f70edb5;
}
.feature-role-admin {
    background-color: red;
}
.feature-role-accountant {
    background-color: skyblue;
}
.feature-role-student {
    background-color: green;
}
.feature-role-teacher {
    background-color: goldenrod;
}
.feature-role-librarian {
    background-color: blueviolet;
}
.feature-role-idadmin {
    background-color: brown;
}
.feature-role-otherstaff {
    background-color: palevioletred;
}
.feature-about,
.feature-youtube{
    display: none;
}
.feature-about{
    border-top: 1px solid #dadada;
    padding-top: 10px;
}
.feature-header {
    border-bottom: 3px solid #d5d5d5;
    padding-bottom: 5px;
    margin-bottom: 30px;
}
.card-features {
    z-index: 999;
    margin-bottom: 20px;
    padding-bottom: 15px !important;
    padding: 20px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 3px 3px 10px 0px rgb(0 0 0 / 12%);
}
.card-features .feature-content h4 {
    opacity: 1;
    margin: 0px;
}
.card-features .feature-content p{
    color: gray;
    margin-top: 5px;
}
.card-features .buttons{
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}
.card-features .f-btn{
    height: fit-content;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    gap: 10px;
    padding: 5px 15px;
    color: #fff;
    font-weight: bold;
}
.card-features .f-watch{
    background: red;
    border: 1px solid #7b0d0d;
}
.card-features .f-about{
    background: rgb(110 207 0);
    border: 1px solid green;
}
.card-features .f-delete{
    background: orange;
    border: 1px solid rgb(242, 169, 43);
}
.card-features .f-edit{
    background: #979797;
    border: 1px solid gray;
}
.card-features .f-feature{
    background: skyblue;
    border: 1px solid #2f80ed;
}

.feature-bullet-box{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    /* height: 100%; */
}
.feature-bullet{
    background-color: orange;
    height: 70px;
    width: 70px;
    border-radius: 35px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
    z-index: 99;
}
.feature-stick {
    z-index: 1;
    height: 105%;
    width: 5px;
    background-color: #dadada;
    position: absolute;
    left: 50%;
}
.feature-bullet p{
    color: #fff;
    margin: 0px;
    line-height: 18px;
}
.feature-bullet p:first-child{
    font-weight: bold;
    font-size: 22px !important;
}
.feature-bullet p:last-child{
    font-size: 12px !important;
}

.parent-size-maintain{
    display: flex;
}
.child-size-maintain1 {
    flex: 1;
}
.child-size-maintain2 {
    flex: 11;
}

.disabled {
    cursor: not-allowed;
}
.paddingFeature {
    padding: 0px 50px;
}
@media only screen and (max-width:600px){
    .paddingFeature {
        padding: 0px 10px;
    }
    .parent-size-maintain {
        display: block;
    }
    .card-features .buttons {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 5px;
        margin-bottom: 15px;;
    }
    .feature-bullet-box {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
    }
    .feature-stick {
        z-index: 1;
        height: 105%;
        width: 5px;
        background-color: #dadada;
        position: absolute;
        left: 13.3%;
    }
}

@media (max-width:840px) and (min-width:600px) {
    .examResult {
        padding: 0px 50px;
    }

    .examPanelNav .centerMe h5 {
        margin-left: -5px;
    }

    .examPanelNav .timeLeft h4 {
        font-size: 14px;
    }

    .quesNumber {
        padding: 9px 18px 0px 9px;
    }

    .main-panel {
        margin-left: 0px;
    }

    .exambox .dropdown {
        padding: 5px;
        margin-left: -15px;
    }

    .accordian-arrow2 {
        margin-left: 500px;
    }

    .studentfilter {
        margin-left: 15px;
    }

    .navbar-dropdown {
        width: auto !important;
        left: auto !important;
    }

    .exambox .row .col-3 button {
        padding: 1px 9px;
    }

    .urlbox {
        margin-top: 12px;
    }

    .manageExam .col-6 {
        padding: 6px;
    }
}
/* Style the list */
ul.breadcrumb {
    padding: 0px 15px;
    list-style: none;
    background-color: #fff;
    border-radius: 5px;
    border-color: rgb(0 0 0 / 12%);
    box-shadow: 1px 1px 7px 0px rgb(0 0 0 / 12%);
}

/* Display list items side by side */
ul.breadcrumb li {
    display: inline;
    font-size: 18px;
}

/* Add a slash symbol (/) before/behind each list item */
ul.breadcrumb li+li:before {
    padding: 5px;
    color: gray;
    content: "\003E";
    /* color: black;
    content: "/\00a0"; */
}

/* Add a color to all links inside the list */
ul.breadcrumb li a {
    color: #0275d8;
    text-decoration: none;
}

/* Add a color on mouse-over */
ul.breadcrumb li a:hover {
    color: #01447e;
    text-decoration: underline;
}

#webcam {
    width: 100%;
    /* max-width: 200px; */
}

.help-block {
    margin-top: 5px;
    color: #a94442;
    font-size: 13px;
}

.no-btn{
    background: transparent;
    border: none;
    text-align: unset;
    white-space: normal !important;
}