@media (-webkit-min-device-pixel-ratio: 1.5) {
    .container {
      width: 100%;
      max-width: 1140px;
    }
 }
@media only screen and (min-width: 1381px) and (max-width: 1440px) {

}
@media only screen and (min-width: 992px) and (max-width: 1380px) {
    .container {
        width: 100%;
        max-width: 1140px;
    }
}

@media only screen and (min-width: 992px) and (max-width: 1024px) {
    .header .navbar .navbar-brand{ max-width: 200px;}
    .header .navbar-nav .nav-item .nav-link{padding: 30px 10px; font-size: 14px;}
    .header .top-right a{margin-right: 8px; padding: 10px 15px;}
    .header .top-right a.ar-link{margin-right: 8px;}
}

@media only screen and (min-width: 768px) and (max-width: 992px) {
    .header{margin: 0 auto; position: relative !important;}

    .header .navbar .navbar-brand{ max-width: 200px; padding: 10px 0 !important;}
    .header .top-right{height: 80px; width: 100%; justify-content: end; border-bottom: 1px solid rgba(var(--primary1),0.3);}
    .header .top-right a{padding: 10px; margin: 0 0 0 10px; font-size: 14px;}
    .header .top-right a.ar-link{margin-right: 0;}

    .header .navbar-nav .nav-item .nav-link{padding: 10px 15px; font-size: 14px;}
    .header .navbar-nav .nav-item ul li a{font-size: 14px;}
    #main-menu{margin-top: 0;}

    #banner{margin-top: 0 !important;}
    #banner .container{width: 90%;}



}


@media only screen and (max-width:767px){
    .header{margin: 0 auto; position: relative !important;}

    .header .navbar .navbar-brand{ max-width: 200px; padding: 10px 0 !important;}
    .header .top-right{height: 80px; width: 100%; justify-content: end; border-bottom: 1px solid rgba(var(--primary1),0.3);}
    .header .top-right a{padding: 10px; margin: 0 0 0 10px; font-size: 14px;}
    .header .top-right a.ar-link{margin-right: 0;}

    .header .navbar-nav .nav-item .nav-link{padding: 10px 15px; font-size: 14px;}
    .header .navbar-nav .nav-item ul li a{font-size: 14px;}
    #main-menu{margin-top: 0;}

    #banner{margin-top: 0 !important;}
    #banner .slider .item::before{content: ""; width: 100%; height: 100%; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background-color: rgba(var(--primary1),0.3);}
    #banner .container{width: 100%;}
    #banner .slider .owl-nav{display: none;}

    .challenge .card{height: auto;}
    .challenge .card-outer:hover .card{height: auto;}
    .challenge .card .number{bottom: 0;}
    .challenge .card-outer:hover{padding-top: 50px;}
    .challenge-content{margin-top: 30px;}
    .challenge .card .card-body .btn{display: block; color: rgb(var(--color_base));}
    .challenge .card:hover .card-body .btn{color: rgb(var(--color_white));}

    .owl-carousel.sttye01 .owl-nav{top: auto; bottom: -60px;}
    #counter{top: auto; bottom: -50px;}

    .challenge-block{padding: 30px 30px 0;}
    .join-challenge-block .child-pic{position: relative; right: 0; margin: 50px auto 0; max-width: 300px;}
    .challenge-block::after{position: relative; display: none;}

    .main-container{margin-top: 0 !important;}

    .step-form .form-check .form-check-label{padding: 14px;}

    footer .footer-links{flex-wrap: wrap;}
    footer .footer-links li a{margin-right: 20px; margin-bottom: 20px;}
    footer .copyright{font-size: 12px;}
    .footer .bottom{padding: 30px 0;}


}

@media only screen and (max-width:767px) and (orientation: landscape) {
    #banner,#banner .slider .item{height: 100vh;}
}

@media only screen and (min-width:320px) and (max-width:480px){

}