@media (max-width:1199px) {
    
}
@media (max-width:1040px) {
    /* Start reports-2 css */

    .report-chart-list{
        display: none;
    }
    .mood-chart-main-box.well-chart-main {
        grid-template-columns: 1fr;
        column-gap: 30px;
    }
    .chart-title-menu.well-reports-title-menu{
        display: none;
    }
    .well-chart-img{
        justify-content: center;
    }
    .mood-chart-box {
        padding: 0 16px;
    }
    .report-chart-list-sm ul {
        padding-top: 20px;
    }
    .well-menu-box h2 {
        display: none;
    }
    .brand-not-working.brand-not-working-sm{
        display: block;
    }
    .well-box {
        height: 20px;
        width: 20px;
    }
    .well-chart-img {
        grid-template-columns: auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto auto;
        column-gap: 2px;
        row-gap: 2px;
        height: fit-content;
    }

    /* End reports-2 css */
}
.d-mo-none {
    display: none;
}
@media (max-width:991px) {
    .d-mo-none {
        display: block;
    }

    .web-nav-lg{
        display: none;
    }
    .web-nav-sm {
        display: flex;
        justify-content: space-between;
        padding: 25px 40px 17px;
        align-items: center;
        box-shadow: 0px 4px 5px #44444440;
    }
    .web-nav-sm h5 {
        font-size: 22px;
        line-height: 28px;
        color: #121417;
        font-weight: 700;
    }
    .web-nav-sm button {
        padding: 0;
        outline: none !important;
    }
    .web-nav-modal .modal-dialog {
        max-width: 100%;
        padding: 0;
        margin: 0 !important;
        width: 100% !important;
        position: fixed;
        bottom: 0;
        left: -1px;
    }
    .web-nav-modal .modal-content {
        width: 100.5%;
        padding: 0 !important;
        margin: 0 !important;
        border-radius: 24px 24px 0 0;
    }
    .web-nav-modal.show {
        transform: translateY(2px);
        transition: 0.1s;
    }
    .web-nav-modal {
        transform: translateY(200px);
        transition: 0.1s;
    }
    .web-nav-modal .modal-header {
        justify-content: space-between;
        padding: 33px 36px 0 !important;
        border: none !important;
    }
    .web-nav-modal .modal-body{
        padding: 16px 36px 33px;
    }
    .web-nav-modal .modal-body ul li a {
        display: flex;
        column-gap: 12px;
        padding: 8px 12px;
        font-size: 14px;
        line-height: 21px;
        font-weight: 500;
        border-radius: 12px;
        color: rgba(79, 79, 79, 1);
    }
    .web-nav-modal .modal-body ul li a.active {
        background-color: rgba(28, 140, 214, 0.05);
        color: #1C8CD6;
        font-weight: 700;
    }
    .web-nav-modal .modal-body ul {
        display: grid;
        row-gap: 8px;
    }

    /* End mood tracker css */

    /* Start reports css */
    .mood-chart-box{
        padding:16px 8px 16px;
    }
    .mood-chart-box > h2{
        display: none;
    }
    .chart-title-menu h5 {
        display: none;
    }
    .mood-chart-info {
        display: flex;
        column-gap: 8px;
        justify-content: center;
        padding-top: 27px;
    }
    .mood-track-used h2, .mood-track-days h2 {
        font-size: 30px;
        line-height: 48px;
        padding-bottom: 10px;
    }
    .chart-title-menu div:last-child {
        justify-content: space-between;
        width: 100%;
    }
    .chart-title-menu div:last-child .by-grade-select{
        width: fit-content;
    }
    .mood-chart-main-box{
        display: block;
        margin: 0 !important;
    }
    .mood-chart-main-box,
    .mood-chart-info,
    .mood-chart-img {
        padding: 0;
    }
    /* End reports css */
    .report-chart-list-sm {
        display: block;
    }
    .select-dropdown3.select-weekly {
        width: fit-content !important;
    }
}

@media (max-width:767px) {
    /* Start mood tracker css */

    .mood-track-box {
        display: none;
    }
    .mood-track-box.mood-track-box-sm {
        display: grid;
        grid-template-columns: auto auto auto;
        align-items: center;
        column-gap: 35px;
        padding: 52px 0 0;
    }
    .mood-track-box-item {
        display: grid;
        row-gap: 26px;
    }
    .radio ~ .mood-box .mood-svg svg {
        max-width: 35px;
    }
    .radio ~ .mood-box .mood-svg{
        width: 50px;
        height: 50px;
    }
    .mood-track-box-main h2 {
        font-size: 20px;
        font-weight: 500;
        line-height: 24px;
        padding: 20px 0 0;
    }
    .mood-track-box-bottom {
        border-top: 0;
        margin: 0;
    }
    .mood-track-box-main {
        padding: 0 16px;
    }
    .mood-track-box-bottom h6 {
        padding: 19px 16px 16px;
    }
    .need-help-btn-sm {
        display: grid !important;
        row-gap: 9.5px;
        padding: 40px 0;
    }
    .need-help-btn-sm a {
        font-size: 16px;
        line-height: 21px;
    }
    .need-help-btn-sm a:nth-child(1) {
        font-weight: 400;
        color: #828282;
    }
    .need-help-btn-sm a:nth-child(2) {
        font-weight: 700;
        color: #1C8CD6;
    }
    .item{
        margin: 0 auto;
    }
    /* End mood tracker css */

    /* Start resources css */

    .mood-chart-menu-ul.resources-chart-menu-ul {
        justify-content: center;
        border: 0;
    }
    .resources-search-btn{
        display: none;
    }
    .stress-info-box,
    .resources-info-box {
        box-shadow: 0px 0px 4px 0px #0000001A;
        display: block;
        border-radius: 12px;
        height: 100%;
    }
    .stress-info-box-main h6, .resources-info-box h6{
        padding: 23px 16px;
    }
    .stress-info-box-main p,.resources-info-box p{
        display: none;
    }
    .stress-info-box-main h2, .resources-box-main h2 {
        padding: 32px 0 24px;
    }
    .stress-info-box-main {
        padding-top: 0;
    }
    /* End resources css */
}

@media (max-width:575px) {
    /* Start select user css */

    .admin-box-title{
        display: none;
    }
    .welcome-box h2 {
        font-size: 22px;
        line-height: 28px;
        padding: 92px 0 32px 0;
    }
    .welcome-box {
        padding: 0 16px;
    }
    .web-next-btn a {
        background-color: #1C8CD6;
        display: block;
        text-align: center;
        padding: 12px;
        font-size: 16px;
        line-height: 24px;
        font-weight: 700;
        color: #fff;
        margin: 0 24px;
        border-radius: 12px;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 65px;
    }
    .create-access-box{
        display: grid;
    }
    .create-access-box.send-otp-sm{
        display: none;
    }
    .create-access-box-code.enter-code-otp-box{
        display: block !important;
    }
    .admin-panel-content.enter-with-code-2 .web-next-btn.select-user{
        display: none;
    }
    .admin-panel-content.enter-with-code-2 .web-next-btn-2{
        display: block !important;
    }
    .admin-panel-content .web-next-btn-2{
        display: none !important;
    }

    .web-next-btn-2 {
        display: grid !important;
        row-gap: 12px;
        position: fixed;
        width: calc(100% - 32px);
        bottom: 23px;
        margin: 0 16px;
    }
    .web-next-btn-2.enter-with-code-btn a:first-child{
        background-color: #1C8CD6;
        color: #fff;
    }
    .web-next-btn-2.enter-with-code-btn a{
        color: #1C8CD6;
    } 
    .log-in-box.log-in-box-desktop{
        display: none;
    }
    /* End select user css */

    /* Start enter code css */

    .create-acc-teg{
        display: none;
    }

    .log-in-box {
        position: fixed;
        width: 87.5%;
        left: 0;
        bottom: 12px;
        margin: 0px 24px;
    }
    .log-in-box.log-in-box-3,
    .log-in-box.log-in-box-2{
        display: block;
    }
    .log-in-box.log-in-box-3 a,
    .log-in-box.log-in-box-2 a{
        color: #828282 !important;
    }
    .log-in-box.log-in-box-3 .web-login-btn,
    .log-in-box.log-in-box-2 .web-login-btn{
        background-color: #E0E0E0;
    }
    .log-in-box a {
        font-size: 14px;
        line-height: 21px;
    }

    /* End enter code css */

    /* Start login css */

    .create-access-box-code.login-box h6 {
        display: none;
    }
    .create-access-box-code.login-box{
        padding-top: 0;
    }
    .admin-box-title.admin-box-title-sm{
        display: block;
        padding: 57px 40px 14px 40px;
    }
    .admin-box-title.admin-box-title-sm h5{
        font-size: 22px;
        font-weight: 700;
        line-height: 28px;
        color: #121417;
    }
    .admin-box-title.admin-box-title-sm h6{
        display: none;
    }
    .main-admin-box.main-admin-box-sm h2{
        display: none;
    }   
    .log-in-box.log-in-box-3 p {
        display: block;
        font-size: 14px;
        color: #61758A;
        line-height: 21px;
        font-weight: 400;
    }
    .admin-box-title.admin-box-title-sm h5{
        display: block;
    }
    /* End login css */

    /* Start create-account css */

    .log-in-box.log-in-box-4{
        position: relative;
    }
    .log-in-box.log-in-box-4 .web-login-btn{
        background-color: #E0E0E0;
    }
    .login-btn-sm{
        display: block !important;
        color: #1C8CD6 !important;
    }
    .log-in-box.log-in-box-4 {
        position: relative;
        padding-top: 24px;
        margin: 0;
        width: 100%;
    }
    .welcome-select-box.login-code-box.create-account-box {
        padding-bottom: 68px;
    }
    .admin-box-title.admin-box-title-sm a {
        display: none;
    }

    /* End create-account end */

    /* Start reports css */

    .mood-chart-menu-ul{
        column-gap: 17px;
        border: 0;
    }

    /* End reports css */

    /* Start profile css */

    .profile-box-main h2{
        display: none;
    }
    .pas-change-btn {
        padding: 17px 16px;
        border: 1px solid rgba(28, 140, 214, 0.05);
        color: #1C8CD6;
        width: 100%;
        background-color: rgba(28, 140, 214, 0.05);
    }
    .account-select-box.account-select-box-2 .dropdown-toggle::before {
        border-top: 0.5em solid #637887;
        border-right: .4em solid transparent;
        border-left: .4em solid transparent;
    }
    .account-select-box.account-select-box-2 .dropdown-toggle::after {
        margin-left: 32px;
        border-top: 0.5em solid #637887;
        border-right: .4em solid transparent;
        border-left: .4em solid transparent;
    }
    /* End profile css */

    /* Start help css */

    .help-submit{
        padding-bottom: 55px;
        border-bottom: 1px solid #C7C7C7;
    }
    .help-submit-btn{
        display: block;
        background-color: #1C8CD6 !important;
        border-radius: 12px;
        color: #fff !important;
        padding: 12px;
        border: none;
        width: 100%;
     }
    .help-box-select-list h2 {
        display: none;
    }
    .help-box-main .btn-group{
        padding-top: 16px;
    }
    .help-box-des h5{
        padding-top: 24px;
        padding-bottom: 24px;
    }
    .help-box-des ul li {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    /* End help css */

    /* Start help-2 css */

    .help-submit-btn.help-submit-btn-2{
        padding: 12px;
        width: 100%;
    }
    .help-box-main.help-box-main-2 {
        max-width: 674px;
        margin-top: 24px;
    }

    /* End help-2 css */

    /* Start admin create account css*/

    .profile-checkbox.profile-checkbox-2{
        white-space: wrap;
    }

    /* End admin create account css*/

    /* Start admin set up css */

    .set-up-btn{
        display: none;
    }
    .log-in-box .set-up-btn{
        display: block;
    }
    .grade-level-box-done label{
        padding-top: 12px !important;
    }
    /* End admin set up css */

    /* Start add grade levels css */

    .grade-level-box-done h6{
        display: flex !important;
        justify-content: start !important;
        padding: 12px 0 20px !important;
    }
    .grade-level-box-done h6 img {
        display: none;
    }
    .view-all-grade h6{
        justify-content: center !important;
    }

    /* End add grade levels css */

    /* Start admin add course css */

    .grade-level-box-done.grade-level-box-done-2 h6 {
        padding-top: 12px !important;
    }
    .course-save-btn{
        max-width: 100% !important;
    }
    .grade-level-box-done.grade-level-box-done-2 h6 {
        padding-top: 12px !important;
        justify-content: space-between !important;
        margin: 0;
        max-width: 100%;
    }
    .set-up-btn.set-up-btn-2 {
        margin-top: 57px !important;
    }

    /* End admin add course css */
    
    /* Start admin list of student 2 css */

    .list-student-sm-title h6{
        display: flex !important;
        justify-content: start;
        padding: 30px 0 0;
    }
    .list-of-student {
        border: 0;
        padding: 0;
    }
    .view-all-grade.view-all-grade-select{
        padding: 0;
        border: none;
    }
    .grade-level-box-done.course-btn-box {
        padding: 0;
        border: none;
        margin: 0;
    }
    .grade-level-box-done.course-btn-box label{
        padding-bottom: 30px !important;
        display: block;
    }
    .grade-level-box-done.course-btn-box .form-label-group input:focus~label, .grade-level-box-done.course-btn-box .form-label-group input:not(:placeholder-shown)~label, .form-label-group select~label, .form-label-group textarea:focus~label, .form-label-group textarea:not(:placeholder-shown)~label {
        transform: translateY(-43%) translateX(20%) scale(.8);
    }
    .list-of-student{
        margin-top: 0;
    }
    /* End admin list of student 2 css */
    .mood-chart-menu-ul.mood-chart-menu-ul-2 .all-student{
        border: none !important;
        padding: 10px 0 !important;
    }
    .mood-chart-box {
        padding: 16px 16px 16px;
    }
    .mood-chart-menu{
        overflow-x: scroll;
        overflow-y: hidden;
    }
    .main-requests-box h2{
        display: none;
    }
    .main-requests-box .nav .nav-item .nav-link{
        padding: 12px !important;
    }
    .main-requests-box ul{
        border: none;
        justify-content: center;
    }
    .main-requests-box .nav .nav-item .nav-link:hover, .main-requests-box .nav .nav-item .nav-link.active{
        border: none;
        background-color: #1C8CD6;
        color: #fff;
        border-radius: 12px;
    }
    .tab-pane-content-box ul li button{
        display: grid;
        row-gap: 8px;
    }
    .tab-pane-content-box ul li button p:last-child{
        color: #828282;
    }
    .tab-pane-content-box ul li button{
        padding: 10px 16px !important;
    }
    .personal-info{
        display: none;
    }
    .setting-sm{
        display: block;
    }
    .personal-change-password-btn{
        border: none;
    }
    .personal-info-box {
        grid-template-columns: 1fr;
    }
    .personal-info-box form {
        padding: 0;
    }
    .personal-change-password-btn a {
        width: 100%;
        padding: 17px;
        background-color: rgba(28, 140, 214, 0.05);
        border: none;
    }
}

@media (max-width:479px) {

    /* Start select user css */

    .welcome-box {
        text-align: left;
    }
    .welcome-box h6 {
        text-align: left;
        max-width: 326px;
        margin: 0 auto;
    }
    .create-access-box-code.enter-code-otp-box h6 {
        max-width: 326px;
        margin: 0 auto;
    }
    
    /* End select user css */

    /* Start admin add course css */

    .create-access-box-code.login-box.login-box-2.add-course-main {
        padding: 0;
    }

    /* End admin add course css */
}