@charset "utf-8";
/* CSS Document */
@media(min-width:1300px) and (max-width:2200px){
    .container{
        width: 1300px;
    }
    .site-search-container.open {
        clip-path: circle(5000px at 90% -10%);
        -webkit-clip-path: circle(5000px at 90% -10%);
    }


}
@media (min-width: 2200px){
    .site-search-container.open {
        clip-path: circle(6000px at 90% -10%);
        -webkit-clip-path: circle(6000px at 90% -10%);
    }


}
@media (min-width: 1550px){

    .title-container{
        height:15vh;
    }
    .container{
        width: calc(1550px - 6rem);
    }
    .slider-detail {
        height: 70vh;
    }
    .slider-detail img {
        height:100%
    }
    .club-banner{
        height:40vh;
    }
    .activity-banner{
        height:35vh;
    }

}
@media (max-width: 1549px) and (min-width: 1170px){
    .site-search-container.open {
        clip-path: circle(2000px at 90% -10%);
        -webkit-clip-path: circle(2000px at 90% -10%);
    }
}
@media (min-width:1200px){

}


@media (min-width: 992px) and (max-width: 1199px) {

    .footer-logo,.footer-quick-links, .footer-contact {
        width: 30%;
    }
    .socia-media-icons ul li{
        padding-right:8px;
    }



}
@media (min-width: 768px) and (max-width: 991px) {
    .header-top {
        height:6rem;
    }
    .header-logo-container {
        width: 100px;
        padding: 5px;
        height: 100%;
    }
    .header-logo{
        height: 100%;
    }

    .notice-highlight {
        /*height:40px;*/
        margin: 0;
        padding: 10px;
        display: flex;
        display: -webkit-flex;
        box-shadow: none;
    }
    .notice-highlight span{
        font-size: 12px;
        letter-spacing: 1px;
        padding: 10px 0;
    }
    .notice-highlight ul {
        float: none;
        padding-left: 10px;
    }
    .notice-highlight ul li {
        line-height: 40px;
        text-overflow: ellipsis;
        overflow: hidden;
        display: inline-block;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
    }
    .header-bottom{
        height: 6rem;

    }
    .bot-curve{
        display: none;
    }
    .mb-menu-btn-container{
        display: flex;
        display: -webkit-flex;
    }
    .mb-main-menu-btn{
        display: block;
        height: 100%;
        padding: 6px 10px;
        font-size: 34px;
    }
    .menu-detail{
        -webkit-transform: unset;
        -moz-transform: unset;
        -ms-transform: unset;
        -o-transform: unset;
        transform: unset;
        top:0;
        left:auto;
        right:-100%;
        border-radius: 0;
        width:100%;
        background: linear-gradient(90deg, #b71a06, #581004 );
        box-shadow: none
    }

    #menu-close{
        display:none;
    }

    .header-bottom .main-menu{
        position: relative;
        top:100%;
        height: 100vh;
        padding: 0;
        background: linear-gradient(to right, #e52107 30%, #bb1a06);
        width:0;
        opacity:0;
        transition: all .5s ease-in-out;

    }
    .header-bottom .main-menu>li{
        display: none;
        position: unset;
    }
    .header-bottom .main-menu.opn>li{
        display: block;
    }
    .header-bottom .main-menu.opn{
        height:100vh;
        width:50%;
        opacity:1;
        padding: inherit;
        transition: all .5s ease-in-out;
    }

    .header-bottom ul .nav-heading {
        margin-left:0;
        width:100%;
        position: unset;
    }
    .header-bottom .nav-heading .nav-title{
        display: block;
    }
    .sub-menu-detail {
        margin: 15px 0 0;
        position: relative;
        top: 0;
        width: 100%;
        right: 0;
        border-radius: 0;
        background: #112248;
        box-shadow: none
    }
    .dev .sub-menu-detail {
        left: 0;
    }
    p img{
        max-width: 100%!important;
        object-fit: contain;
        height: auto!important;
    }

    .footer-logo,.footer-quick-links, .footer-contact {
        width: 30%;
    }
    .socia-media-icons {
        /*display: flex;*/
        /*display: -webkit-flex;*/
        /*justify-content: center;*/
        width: 100%;
    }
    .socia-media-icons ul {
        float: none;
        text-align: center;
    }
    /*.header-social-media-icon{*/
    /*display: none;*/
    /*}*/
    .mb-none{
        display: none;
    }
    .mb-show{
        display: block;
    }
    .footer-search-bar form{
        width:100%
    }
    .footer-search-bar input{
        width:80%;
    }
    .footer-search-btn{
        width:15%;
    }

}
@media (min-width: 200px) and (max-width: 767px) {
    .tab-content ul, .tab-content ol {
        margin-left: 30px;
    }
    .header-top {
        height:6rem;
    }
    .header-logo-container {

        display: none;
    }
    .mb-header-logo-container{
        display: block;
    }
    .header-logo{
        height: 100%;
    }

    .notice-highlight {
        /*height:40px;*/
        width:100%;
        margin: 0;
        padding: 10px;
        display: flex;
        display: -webkit-flex;
        box-shadow: none;
    }
    .notice-highlight span{
        font-size: 12px;
        letter-spacing: 1px;
        padding: 10px 0;
    }
    .notice-highlight ul {
        float: none;
        padding-left: 10px;
    }
    .notice-highlight ul li {
        line-height: 40px;
        text-overflow: ellipsis;
        overflow: hidden;
        display: inline-block;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
    }
    .contact-form{
        padding:0;
    }
    .bot-curve{
        display: none;
    }
    .site-search-container.open{
        padding: 150px 10px;
        width:100%;
        height:100%;
    }
    .site-search-container{
        padding: 0;
        width:100%;
        height:0;
        z-index: 1055;

    }
    .site-search-container .rel {
        height: 6rem;
    }
    .site-search-container input{
        font-size: 16px;
    }
    .site-search-container button{
        font-size: 20px;
    }
    .srch-close {
        right: 20px;
        top: 20px;
    }
    .site-search-container.open {
        clip-path: circle(1000px at 90% -10%);
        -webkit-clip-path: circle(1000px at 90% -10%);
    }
    .header-bottom{
        height: 6rem;

    }
    .mb-menu-btn-container{
        display: flex;
        display: -webkit-flex;
    }
    .mb-main-menu-btn{
        display: block;
        height: 100%;
        padding: 6px 10px;
        font-size: 34px;
    }
    .menu-detail{
        -webkit-transform: unset;
        -moz-transform: unset;
        -ms-transform: unset;
        -o-transform: unset;
        transform: unset;
        top:0;
        left:auto;
        right:-100%;
        border-radius: 0;
        width:100%;
        background: linear-gradient(90deg, #b71a06, #581004 );
        box-shadow: none
    }
    .nws .menu-detail{
        max-height:none;
        overflow-y: unset;
    }

    #menu-close{
        display:none;
    }

    .header-bottom .main-menu{
        position: relative;
        top:100%;
        height: 100vh;
        padding: 0;
        background: linear-gradient(to right, #e52107 30%, #bb1a06);
        width:0;
        opacity:0;
        transition: all .5s ease-in-out;

    }
    .header-bottom .main-menu>li{
        display: none;
        position: unset;
    }
    .header-bottom .main-menu.opn>li{
        display: block;
    }
    .header-bottom .main-menu.opn{
        height:100vh;
        width:50%;
        opacity:1;
        padding: inherit;
        transition: all .5s ease-in-out;
    }

    .header-bottom ul .nav-heading {
        margin-left:0;
        width:100%;
        position: unset;
    }
    .header-bottom .nav-heading .nav-title{
        display: block;
    }
    .sub-menu-detail {
        margin: 15px 0 0;
        position: relative;
        top: 0;
        width: 100%;
        right: 0;
        border-radius: 0;
        background: #112248;
        box-shadow: none
    }
    .dev .sub-menu-detail {
        left: 0;
    }
    .header-social-media-icon{
        display: none;
    }


    .default-container{
        padding: 20px 0;
    }

    .title-container {
        background-position: right;
        padding: 20px;
    }
    p img{
        max-width: 100%!important;
        object-fit: contain;
        height: auto!important;
    }
    .essentials{
        bottom:-90%;
        right:5px;
    }


    .h1, h1 {
        font-size: 28px;
    }
    .h2, h2 {
        font-size: 24px;
    }
    .h3, h3{
        font-size: 20px;
    }
    p{
        font-size: 16px;
    }
    .mb-none{
        display: none!important;
    }
    .mb-show{
        display: block!important;
    }
    .anfa-nav-tab>li{
        margin-right:8px;
    }
    .anfa-nav-tab>li.active>a, .anfa-nav-tab>li.active>a:focus, .anfa-nav-tab>li.active>a:hover{
        border-radius: 100%;
        border-top-right-radius: none;
        border-top-left-radius: 0;
    }
    .anfa-nav-tab>li>a{
        border-radius: 100%;
    }
    .anfa-nav-tab>li>a:hover{
        border-radius: 100%;
        border-top-right-radius: none;
        border-top-left-radius: 0;
    }




    .footer{
        padding: 20px 0;

    }
    .footer-search-bar {
        padding: 5px 10px;
    }
    .footer-search-bar form{
        width:100%
    }
    .footer-search-bar input{
        width:80%;
    }
    .footer-search-btn{
        width:15%;
    }
    .footer-container {
        padding: 5px;
    }
    .footer-img {
        height: 100px;
        width: auto;
    }
    .footer-logo{
        width:100%;
        display: flex;
        display: -webkit-flex;
        justify-content: center;
    }
    .footer-quick-links, .footer-contact {
        width: 100%;
        text-align: center;
        word-wrap: break-word;
    }
    .footer-quick-links{
        border-bottom: 1px solid #a9a9a9;

    }
    .footer-contact .flex{
        display: block;
    }
    .socia-media-icons {
        width: 100%;
        display: flex;
        display: -webkit-flex;
        justify-content: center;
    }
    .socia-media-icons ul {
        float: none;
    }
    .footer-contact .fa{
        display: none;
    }
    .footer-bottom{
        font-size: 12px;
    }

}
