@media (max-width: 992px) {
    #nav{
        background: var(--white-color);
        padding: 0;
    }
    #nav .container{
        box-shadow: none;
        border-radius: 0;
    }
    #navbarSupportedContent {
        background: #fff;
        max-height: 500px;
        left: 0;
        padding: 0 20px 0;
        position: absolute;
        z-index: 99;
        top: 100%;
        width: 100%;
        /* overflow: auto; */
        box-shadow: 0px 10px 35px 0px rgba(0, 0, 0, 0.1);
        border-radius: 20px;
    }
    .title-section.title-home{
        font-size: 25px;
    }
    #btn-default.ask-Order{
        margin-bottom: 1rem;
        width: 100%;
    }

}
@media (max-width: 768px) {
    #home-banner{
        min-height: 60vh;
        padding: 100px 0;
    }
    .mt-section{
        margin-top: 0 !important;
        padding: 50px 0 !important;
    }
    .breatcome h1{
        font-size: 40px;
    }
    #modal-enroll .modal-dialog {
        max-width: 700px;
    }
    .feedback .card{
        padding: 20px;
    }
    .feedback .card .person i{
        font-size: 40px;
    }
    .breatcome{
        min-height: 300px;
    }
}
@media (max-width: 650px) {
    .icon-whyus img{
        width: 60px;
    }
    .single-blog .content{
        padding: 15px;
    }
    .event-details-list .list-wrap li{
        width: 100%;
    }
    .comment-area li{
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }
    .comment-area li .blog-thumb-info{
        width: auto;
        padding: 15px 0 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .comment-area li .blog-content{
        width: auto;
        padding: 0;
    }
}
@media (max-width: 567px) {
    .breatcome h1{
        font-size: 30px;
    }
    .feedback .card p{
        font-size: 13px;
    }
    #card-updates{
        padding: 0.1rem;
    }
    #card-video-update{
        padding: 0.2rem;
    }
    #card-video-update iframe{
        height: 200px;
    }
    #btns-coursesSwiper .swiper-button-next,
    #btns-coursesSwiper .swiper-button-prev{
        width: 30px;
        height: 30px;
        padding: 3px;
    }
    #btns-coursesSwiper .swiper-button-next::after,
    #btns-coursesSwiper .swiper-button-prev::after{
        font-size: 10px;
    }
    .client .img img{
        width: 60px;
    }
    #cardarticle #topimg-article{
        height: 300px;
    }
}
@media (max-width: 425px) {
    #home-banner{
        padding-bottom: 50px;
    }
}