@media only screen and (max-width:500px){
    .logins-section{
        flex-wrap: wrap;
        padding: 10px;
        gap: 6px;
    }
    .top-bar-inner{
        flex-direction: column;
    }
    .learn{
        width: 200px;
    }
    .logo-search{
        flex-direction: column;
        gap: 0;
        width: fit-content;
    }
    .content{
        width: 90%;
    }
    .notices{
        flex-wrap: wrap;
        width: 100%;
        gap: 20px;
        justify-content: unset;
    }
    /* .notice-container{
        width: 199px;
    } */
    .notice-container{
        padding: 61px 19px;
    }
    .n-text h2{
        font-size: 0.938rem;
    }
    .n-date p{
        font-size: 0.900rem;
    }
    .n-text h4,p{
        font-size: 0.800rem;
    }
    .principle-desk-about{
        align-items: baseline;
        width: fit-content;
        padding: 35px 0;
        gap: 64px 0;
        flex-direction: column-reverse;
    }
    .principle-desk{
        flex-direction: column;
        align-items: baseline;
        width: 96%;
    }
    .principle-img img{
        width: 22.125rem;
        height: 297px;
    }
    .principle-told{
        width: fit-content;
        padding: 35px 0 0 0;
        width: 93.2%;
    }
    .principle-told h1{
        font-size: 2.5rem;
        width: fit-content;
    }
    .principle-told p{
        width: 95%;
        font-size: 1.2rem;
    }
    .about-us{
        width: 21.780rem;
        height: 302px;
        margin: 0 15px;
    }
    .events-inner{
        flex-direction: column;
        gap: 30px 30px;
    }
    .date-read-more{
        gap: 0 66px;
    }
    .logo h1{
        font-size: 1.2rem;
    }
    .logo p{
        font-size: 0.770rem;
    }
    .event{
        width: 90%;
    }
    .event img{
        width: -webkit-fill-available;
        width: -moz-available;
    }
    .scontainer{
        width: -webkit-fill-available;
        width: -moz-available;
    }
    .navbar-toggler{
        border: 1px solid #fff;
    }
    .navbar-toggler-icon svg path{
        fill: #fff;
    }
    .navbar>.container-fluid{
        justify-content: end;
    }
    .row{
        flex-wrap: nowrap;
    }
    .footer-inner{
        flex-direction: column;
        padding: 28px;
    }
    .mission,ul.links,.vission{
        width: auto;
    }
    .useful-link-inner{
        flex-direction: column;
    }
    .footer-inner{
        gap: 34px;
    }
    .events-section h1,.notice-section-inner,.galleryinner h1{
        padding-left: 10px;
        padding-right: 10px;
    }
    .cop-right-inner{
        font-size: 0.870rem;
    }
    .dropdown-menu.show{
        margin-right: 10px;
    }
}
@media only screen and (min-width:768px) and (max-width:1023px) {
    .scontainer{
        width: -webkit-fill-available;
    }
    .navbar-toggler{
        border: 1px solid #fff;
    }
    .learn{
        width: -webkit-fill-available;
    }
    .top-bar-inner{
        flex-wrap: wrap;
    }
    .logins-section{
        padding: 0;
        flex-wrap: nowrap;
        padding-left: 10px;
    }
    .login h1{
        font-size: 0.870rem;
    }
    .logo-search{
        gap: 0 10px;
    }
    .content h1{
        font-size: 1.200rem;
    }
    .content p{
        font-size: 0.870rem;
    }
    .notices{
        flex-wrap: wrap;
        justify-content: center;
        gap: 25px;
    }
    .notice-container{
        width: 22.625rem;
    }
    .principle-desk{
        flex-direction: column-reverse;
        padding: 0 0 10px 0;
    }
    .principle-desk-about{
        flex-direction: column-reverse;
        padding: 0 0 10px 0;
    }
    .events-inner{
        flex-wrap: wrap;
        justify-content: center;
        gap: 30px;
    }
    .row{
        flex-wrap: nowrap;
    }
    .navbar-nav{
        flex-wrap: wrap;
    }
    .footer-inner{
        flex-wrap: wrap;
        padding: 28px 15px;
    }
    .mission{
        width: auto;
    }
    .vission{
        width: 48%;
    }
    .about-us{
        margin: 0 15px;
    }
    .principle-told{
        padding: 50px 31px;
    }
    .notice-section-inner h1, .events-section h1, .galleryinner h1{
        padding: 0 15px;
    }
}
@media only screen and (min-width:1024px) and (max-width:1440px) {
    .learn{
        width: -webkit-fill-available;
        width: -moz-available;
        padding: 18px;
    }
    .logo-search{
        gap: 0 100px;
        padding: 18px 17px;
    }
    .navbar-nav{
        flex-wrap: wrap;
    }
    .notice-container{
        width: 431px;
    }
    .notices{
        flex-wrap: nowrap;
        gap: 20px;
    }
    .principle-desk-about{
        flex-direction: column;
    }
    .about-us {
        margin: 0 15px;
    }
    .principle-desk {
        flex-direction: column;
        align-items: baseline;
        width: 96%;
        gap: 10px;
        padding: 0 0 10px 0;
    }
    .principle-desk-about{
        padding: 20px 0;
    }
    .principle-told p {
        width: 95%;
    }
    .principle-told{
        padding: 0 31px 0 31px;
    }
    .scontainer{
        width: -webkit-fill-available;
        width: -moz-available;
    }
    .principle-img img{
       width: 978px;
       height: 644px;
    }
    .events-inner{
        flex-wrap: wrap;
        justify-content: center;
        gap: 30px;
    }
    /*.row{
        gap: 0 20px;
        flex-wrap: nowrap;
    }*/
    .footer-inner{
        flex-wrap: wrap;
        padding: 28px 17px;
    }
    .mission{
        width: auto;
    }
    .vission{
        width: 48%;
    }
    .notice-section-inner{
        padding: 50px 17px;
    }
    .events-section,.galleryinner h1{
        padding: 0 17px;
    }
}