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

    .card-body-custom-1{
        min-height: 200px;
        max-height: 200px;
        overflow: auto;
    }

    .custom-height-scroll-1{
        min-height: 40px;
        max-height: 190px;
        overflow: auto;
    }

    .custom-height-scroll-3{

        min-height: 190px;
        max-height: 190px;
        overflow: auto;
    }

    .custom-height-scroll-4{

        min-height: 240px;
        max-height: 240px;
        overflow: auto;
    }

    .card-title-custom-1{

        font-size: 20px !important;
        color: white !important;
        display: block;
        width: 100%;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .move-up-option{
        margin-top: -29px;
    }

    .move-up-question{
        margin-top: -60px;
    }
    .card-margin-padding{
         margin-bottom: -20px;
     }

    .chat-fixed {
        margin-bottom : -1px;
        position: fixed;
        width: 84%;
        bottom: 0px;
        opacity: 1;
        background-color: white;
    }

    .message-input-remove{

        border: 1px solid black;
        border-radius: 19px !important;
        height: 48px;
    }

    #isOnline{

        display:inline-block;
        width:200px;
        white-space: nowrap;
        overflow:hidden !important;
        text-overflow: ellipsis;
    }

    .preview-chat-message{

        display:inline-block;
        width:350px;
        white-space: nowrap;
        overflow:hidden !important;
        text-overflow: ellipsis;

    }



}

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

    .page-content-header>h5 {
        text-align: center;
        font-size: 15px;
    }

    .move-up-option{
        margin-top: -29px;
    }

    .move-up-question{
        margin-top: -60px;
    }

    .chat-fixed {
        margin-bottom : -1px;
        position: fixed;
        z-index: 1;
        width: 100%;
        bottom: 0px;
        opacity: 1;
        background-color: white;
    }

    .message-input-remove{

        border: 1px solid black;
        border-radius: 19px !important;
        height: 45px;
    }

    #isOnline{

        display:inline-block;
        width:150px;
        white-space: nowrap;
        overflow:hidden !important;
        text-overflow: ellipsis;
    }

    .preview-chat-message{

        display:inline-block;
        width:250px;
        white-space: nowrap;
        overflow:hidden !important;
        text-overflow: ellipsis;

    }

}

.ct-series-a .class-average-chart {

    stroke: white !important;
    stroke-width: 5px !important;
    stroke-linecap: round;
}

.color-avg-gp-0{
    background-color: #926AA6;
}
.color-avg-gp-1{
    background-color: #6B5876 ;
}
.color-avg-gp-2{
    background-color: #577284;
}
.color-avg-gp-3{
    background-color: #578CA9;
}
.color-avg-gp-4{
    background-color: #4C6A92 ;
}
.color-avg-gp-5{
    background-color: #BC70A4 ;
}

.custom-height-scroll-3{

    min-height: 190px;
    max-height: 190px;
    overflow: auto;
}

.page-content-header{

    color: #0b97c4;
}

.sidenav::-webkit-scrollbar {
    width: 0.0em;
}

.sidenav::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}

.no-scrollbar::-webkit-scrollbar {
    width: 0.0em;
}

.no-scrollbar::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}

.sidenav::-webkit-scrollbar-thumb {
    background-color: darkgrey !important;
    outline: 1px solid blue !important;
}


.card-title-custom-1{

    font-size: 20px !important;
    color: white !important;
}

.card-title-custom-2 {
    font-size: 15px !important;
    display: block;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.card-body-custom-1{

  overflow: unset !important;
}
.card-body-content-head-custom-1{
  color: yellow;
}
.class-status{
    color: yellowgreen;
    font-weight: bolder;
}

.card-body-content-tail-custom-1{

    font-style: italic;
    color: white;
    font-weight: lighter;
}

.show-student-modal-trigger{
    color: floralwhite !important;
}

.card-action-custom-1{
    min-height: 54px;
}

.btn-outline-custom-1{

    border-bottom: 1px solid white;
    padding: 2px;
}



/* label color */
.input-field label {

    color: blue;
}

.input-field input[type="number"] {

    border-bottom: 1px solid blue;
    box-shadow: 0 1px 0 0 blue;
}

.unique-color-input-1 label {
    color: #4ca20b !important;
}


.unique-color-input-1 input[type="text"] {
    color: #4ca20b;
    border-bottom: 1px solid white !important;
    box-shadow: 0 1px 0 0 white !important;
}

.input-field input[type="text"] {

    border-bottom: 1px solid blue;
    box-shadow: 0 1px 0 0 blue;
}

.input-field select {

    border-bottom: 1px solid blue;
    box-shadow: 0 1px 0 0 blue;
}

.class-submit-button{

    width: 200px;
}

.question-option{
    padding-right: 10px;
}
.selected-receipt{
    background-color: #00caff;
}

.blink_me {
    animation: blinker 1s linear infinite;
}

#totalAddedQuestion {
    position: fixed;
    right: 0px;
    bottom: 0px;
    border: 1px solid #444;
    background: #f00;
    padding: 3px;
    color: #fff;
    z-index: 100;
}


/*Chartist JS control*/
.ct-series-a .ct-line {
    /* Set the colour of this series line */
    stroke: white;
    /* Control the thikness of your lines */
    stroke-width: 2px;
    /* Create a dashed line with a pattern */
    /*stroke-dasharray: 10px 20px;*/
}

.ct-series-a .ct-point {
    /* Colour of your points */
    stroke: white;
    /* Size of your points */
    stroke-width: 2px;
    /* Make your points appear as squares */
    stroke-linecap: round;
}

.ct-label {
    fill: rgba(255, 255, 255, 255);
    color: rgba(255, 255, 255, 255);
}

/*New Dev*/

.border-exam{
    border-radius: 10px;
}
.card-title-exam-custom{
    text-align: center;

}
.btn-round-custom{
    border-radius: 20px;
}

.card-chart{
    transition: 300ms;
}

.card-content:hover .card-chart{
    transform: translate(0, -70px);
    z-index: 2;
}
.action-panel{
    margin-top: -80px;
}

.box-gradient-color-1{

    background-image: linear-gradient(to right, #21a149 , #27b866);
}
.box-gradient-color-2{

    background-image: linear-gradient(to right, #a1215e , #b8275c);
}
.box-gradient-color-3{

    background-image: linear-gradient(to right, #c28800 , #dfb500);
}
.box-gradient-color-4{

    background-image: linear-gradient(to right, #4221a1 , #5c27b8);
}

.left-nav-background-active-color-main{

    background-color: #501f87 !important;
}

.left-nav-background-active-color-sub{
    background-color: #6b268c;
}

.result-table thead .left-most{
    border-radius: 10px 0px 0px 0px;
}
.result-table thead .right-most{
    border-radius: 0px 10px 0px 0px;
}


/*
*  Gradient defined by view result
*/
.gradient-1{

   background-image: linear-gradient(to right, #600f87 , #400781);
}

.hover-behave-1:hover{

    color: #f0b500;
}

/*
 Offline download
 */

.hard-border{

    border: 1px solid black;
    page-break-after:always;
}

@media print {

    /*.move-up-question{*/
    /*    margin-top: -60px;*/
    /*}*/
    /*.move-up-option{*/
    /*    margin-top: -29px;*/
    /*}*/
    .print-hidden {
        display: none;
    }

    .question {
        page-break-inside: unset !important;
        page-break-after: auto !important;
    }
}

.px-12{
    font-size: 12px !important;
}
.px-13{
    font-size: 13px !important;
}
.px-14{
    font-size: 14px !important;
}
.px-15{
    font-size: 15px !important;
}
.px-16{
    font-size: 16px !important;
}
.px-17{
    font-size: 17px !important;
}
.px-18{
    font-size: 18px !important;
}
.px-19{
    font-size: 19px !important;
}
.px-20{
    font-size: 20px !important;
}

.px-21{
    font-size: 21px !important;
}
.px-22{
    font-size: 22px !important;
}

.px-23{
    font-size: 23px !important;
}
.px-24{
    font-size: 24px !important;
}
.px-25{
    font-size: 25px !important;
}
.px-26{
    font-size: 26px !important;
}
.px-27{
    font-size: 27px !important;
}

.card-row-space{
    /*margin-top: -200px;*/
    /*margin-bottom: -20px;*/
    /*padding-bottom: -1000px;*/
}

#bar-chart{
    background-color: rgb(55, 71, 79);
    width: 800px;
    height: 350px;
    font-family: Lato, Helvetica-Neue, monospace;
}

.ct-series-a .ct-bar {
    /* Colour of your bars */
    stroke:  #CCFFF5;
}
.ct-series-b .ct-bar {
    /* Colour of your bars */
    stroke:  #EBCCFF;
}
.ct-series-c .ct-bar {
    /* Colour of your bars */
    stroke:  #CCE0FF;
}
.ct-series-d .ct-bar {
    /* Colour of your bars */
    stroke:  #FFD9CC;
}

.ct-series-e .ct-bar {
    /* Colour of your bars */
    stroke:  #FFCCCC;
}
.ct-series-f .ct-bar {
    /* Colour of your bars */
    stroke:  #FFCCE6;
}
.ct-series-g .ct-bar {
    /* Colour of your bars */
    stroke:  #E0E0EB;
}

.ct-series-h .ct-bar {
    /* Colour of your bars */
    stroke:  #CCFFFF;
}

.ct-series-i .ct-bar {
    /* Colour of your bars */
    stroke:  #FFE0CC;
}


.ct-label {
    color: white;
}

.message-right {

    border-radius: 18px 18px 0px 18px;
}
.message-left {

    border-radius: 0px 18px 18px 18px;
}
.message-box{

    padding-top: 6px !important;
}

.upper-chat{
    margin: 1px !important;
}

.chat-date{
    border-radius: 12px;
}

.input-field-message textarea[id="message"]{

    border-bottom: 0px solid grey !important;
    border: 2px solid grey !important;
    border-radius: 18px;
    padding-left: 8px;
    max-height: 99px;
}

.input-field-message textarea[id="message-edit"]{

    border-bottom: 0px solid grey !important;
    border: 2px solid grey !important;
    border-radius: 18px;
    padding-left: 8px;
}

.file-input-custom{
   display: none;
}
.chat-text{
    font-size: medium;
    white-space: pre-line;
}

#isOnline{
    font-size: 12px;
}
.image1 {
    padding-top: 100px;
    margin-left: auto;
    margin-right: auto;
    z-index: 1;
}

.fontAiFaculty {
   font-size: 17px;
}
.cmd-font{
    font-size: 15px;
}