.correct-box svg {
    color: #39c8c9 !important;
}

.incorrectbox svg {
    color: #ff0084;
}

#solve {
    border: 2px solid rgba(233, 30, 100, 100%);
    border-radius: 4px;
    padding: 10px;
    margin-bottom: 20px;
    background-color: rgba(233, 30, 100, 1%);
    color: #000;
    font-size: 18px;
    -webkit-box-shadow: rgb(255 166 166 / 75%) 6px 6px 0px 0px;
    box-shadow: rgb(255 166 166 / 75%) 6px 6px 0px 0px;
}

.solve-box .correct-answer {
    font-size: 200%;
}

.quest-send-btns input {
    font-size: 20px;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.quest label::before {
    visibility: hidden;
}

.font-warning {
    color: #FF9800;
}

.font-success {
    color: #1dc973;
}

.font-info {
    color: #39c8c9;
}

.font-red {
    color: #a90514;
}

.font-purp {
    color: #673ab7;
}

p.ar {
    text-align: right;
}

.y-answer p {
    color: #a90514;
    font-size: 100%;
    margin-bottom: 0;
}

.y-answer img {
    margin-top: 5px;
    margin-bottom: 5px;
    border: 1px solid #a90514;
}

.c-answer p {
    color: #006516;
    font-size: 100%;
    margin-bottom: 0;
}

.c-answer img {
    margin-top: 5px;
    margin-bottom: 5px;
    border: 1px solid #006516;
}

/* radio question btns */

.questbtns label::before {
    visibility: hidden;
}

.custom-radio .custom-control-input:checked~.custom-control-label::after {
    background-image: none;
}


/*aria div role radio */

div[name="answer"] {
    display: inline-block;
    margin-right: 5px;
}

div[role="radio"][aria-checked="true"].btn-info {
    background-color: #ef8157;
    border-color: #ef8157;
}


/* imgBtn type2 */

.imgBtn {
    border: 4px solid #b0b0b0;
    box-shadow: 10px 10px 10px #ccc;
    border-radius: 4px;
}

.imgBtn:hover,
.imgBtn:checked,
.imgBtn:focus,
.imgBtn.focus {
    border: 6px solid #6dd1ff;
    border-radius: 4px;
    transition: .1s all ease-in-out;
    box-shadow: none;
}


/*radio btns

section {
    display: flex;
    flex-flow: row wrap;
}*/

div.questBtnsWrap>div.questbtns {
    flex: 1;
    padding: 0.5rem;
    float: left;
    min-width: 150px;
}

div.questBtnsWrap>div.questbtns h2 {
    margin-bottom: 20px;
    text-transform: capitalize;
}

input[type="radio"] {
    display: none;
}

input[type="radio"]:not(:disabled)~label {
    cursor: pointer;
}

input[type="radio"]:disabled~label {
    color: #bcc2bf;
    border-color: #bcc2bf;
    box-shadow: none;
    cursor: not-allowed;
}

label {
height: 100%;
    display: block;
    background: transparent;
    border: 2px solid #cacaca;
    border-radius: 20px;
    padding: 1rem;
    margin-bottom: 1rem;
    text-align: center;
    position: relative;
    /*-webkit-box-shadow: rgb(83 83 83 / 40%) 6px 6px 0px 0px;
    box-shadow: rgb(83 83 83 / 40%) 6px 6px 0px 0px;*/
}

input[type="radio"]:checked+label, input.hiegh-light-btn+label  {
    border-color: rgba(0 179 90 / 100%);
    -webkit-box-shadow: rgba(0 179 90 / 40%) 6px 6px 0px 0px;
    box-shadow: rgba(0 179 90 / 40%) 6px 6px 0px 0px;
}

input[type="radio"][disabled]:checked~label {
    border-color: rgb(179, 0, 0)!important;
    -webkit-box-shadow: rgba(179, 0, 0, 0.4) 6px 6px 0px 0px;
    box-shadow: rgba(179, 0, 0, 0.4) 6px 6px 0px 0px;
}

/*input.hiegh-light-btn+label {
    border-color: rgba(0 179 90 / 100%);
    -webkit-box-shadow: rgba(0 179 90 / 40%) 6px 6px 0px 0px;
    box-shadow: rgba(0 179 90 / 40%) 6px 6px 0px 0px;
}*/


input[type="radio"]:disabled~label {
    border-color: rgba(83 83 83 / 100%) !important;
    /*filter: grayscale(1);*/
    -webkit-box-shadow: rgba(83 83 83 / 40%) 6px 6px 0px 0px;
    box-shadow: rgba(83 83 83 / 40%) 6px 6px 0px 0px;
}

input[type="radio"].hiegh-light-btn:disabled~label {
    border-color: #00b35a !important;
    filter: grayscale(0);
    -webkit-box-shadow: rgba(0 179 90 / 40%) 6px 6px 0px 0px;
    box-shadow: rgba(0 179 90 / 40%) 6px 6px 0px 0px;
}

.input-container {
        width: 200px; /* Set the desired width for the input container */
    }
    
.answer-input {
    width: 25%; /* Set the desired width for the input element */
    min-width: 35px;
    box-sizing: border-box; /* Include padding and border in the width calculation */
}

.modal-dialog {
    min-width: 80%;
}

@media (max-width:991px) {
    .quest-imgs-wrap {
        padding-top: 1em;
        padding-bottom: 1em
    }
    .quest-img img {
        max-width: 115px;
    }
    .quest button,
    .quest a {
        margin-top: 15px;
    }
    .rank h2 {
        font-size: 16px;
    }
}

/*********- katex - ******
pat5: .que-value.answer-input {z-index: 999999 !important; width:50px; padding-left: 5px; padding-right: 5px;}
*****/
.katex, .quiz-body.skill > p {
    font-size: 1.6em !important;
    font-family: 'KaTeX_Math';
}
.vlist {
    height: 0.02em !important;
}
.que-value.answer-input {
    z-index: 999999 !important;
    font-family: 'KaTeX_Math';
    position: relative;
    width: 50px;
    padding-left: 5px;
    padding-right: 5px;
    display: inline-block;
    top: 5px;
    background-color: #ebf7f9;
    border: 2px solid #00d5ff;
    border-radius: 4px;
}
.mord.mtight {
    padding-left: 10px;
    padding-right: 10px;
}


#pageTitle {
    display: none !important;
}

.btn.btn-custom:disabled {
    background-color: #989898;
    border-color: #ff0054;
    -webkit-box-shadow: rgb(83 83 83 / 40%) 6px 6px 0px 0px;
    box-shadow: rgb(83 83 83 / 40%) 6px 6px 0px 0px;
}

#pauseButton,
#startButton {
    display: inline-block;
    border-radius: 4px;
    -webkit-box-shadow: rgba(255, 221, 166, 0.4) 1px 1px 0px 2px;
    box-shadow: rgba(255, 221, 166, 0.4) 1px 1px 0px 2px;
}

#pauseButton:hover,
#startButton:hover {
    cursor: pointer;
}


#dashboardContent > div.container-fluid.quiz-info > div > div {
  width: 18rem;
}
@media (max-width: 1230px) {
  #dashboardContent > div.container-fluid.quiz-info > div > div {
    width: 8rem;
  }
}