@media (max-width: 576px) {
    .container {
        max-width: 97% !important;
    }
    #banner .ban-text{
        max-width: 97% !important;
    }
}

@media (min-width: 576px) {
    .container {
        max-width: 97% !important;
    }
    #banner .ban-text{
        max-width: 97% !important;
    }
}

@media (min-width: 768px) {
    .container {
        max-width: 95% !important;
    }
    #banner .ban-text{
        max-width: 95% !important;
    }
}

@media (min-width: 992px) {
    .container {
        max-width: 90% !important;
    }
    #banner .ban-text{
        max-width: 90% !important;
    }
}

@media (min-width: 1200px) {
    .container {
        max-width: 1000px !important;
    }
    #banner .ban-text{
        max-width: 1000px !important;
    }
}

@media (min-width: 1400px) {
    .container {
        max-width: 1100px !important;
    }
    #banner .ban-text{
        max-width: 1100px !important;
    }
}

@media (min-width: 1600px) {
    .container {
        max-width: 1100px !important;
    }
    #banner .ban-text{
        max-width: 1100px !important;
    }
}

@media (min-width: 1920px) {
    .container {
        max-width: 1200px !important;
    }
}

@media (min-width: 2560px) {
    .container {
        max-width: 2000px !important;
    }
}

@media only screen and (max-width:1500px){
    #banner .ban-text h1{
        font-size: 80px;
        margin-bottom: 20px;
    }
    #banner .ban-text p{
        margin-bottom: 25px;
    }
    #banner{
        height: 650px;
    }
    #banner img{
    height: 650px;
    }
    .heading h1{
        font-size: 60px;
    }
}

@media only screen and (max-width:1300px){
    #banner .ban-text h1{
        font-size: 70px;
        margin-bottom: 20px;
    }
    #banner .ban-text{
        padding-right: 400px;
    }
    #banner{
        height: 600px;
    }
    #banner img{
    height: 600px;
    }
    .heading h1{
        font-size: 50px;
    }
    .heading h1 br{
        display: none;
    }
    .heading p{
        line-height: 1.7;
    }
}

@media only screen and (max-width:1099px){
     .heading h1{
        font-size: 40px;
    }
    #block{
        padding: 70px 0;
    }
     #banner{
        height: 550px;
    }
    #banner img{
    height: 550px;
    }
}


@media only screen and (max-width:991px){
    section{
        padding: 50px 0;
    }
   #about .a-img{
    aspect-ratio: 4 / 3;
    margin-bottom: 20px;
   }
   #about .a-img img{
    object-position: top;
   }
   .heading span.top-heading{
    margin-bottom: 12px;
   }
   .heading h1{
    margin-bottom: 25px;
   }
   .heading p{
    margin-bottom: 25px;
   }
   #about .signature{
    margin-top: 20px;
   }
   #collection .col-wrap {
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
#feel .f-vid{
    aspect-ratio: 5 / 4;
    margin-bottom: 20px;
}
#space .s-img{
    aspect-ratio: 1 / 1;
}
#space .s-img img{
    object-position: top;
}
#footer .f-wrap{
    text-align: center;
    margin-bottom: 15px;
}
#footer ul{
    justify-content: center;
}
    
}

@media only screen and (max-width: 850px){
    #banner .ban-text{
        padding: 0 100px;
        text-align: center;
        top: 55%;
    }
    #banner .ban-text h1{
        font-size: 50px;
    }
     #banner{
        height: 500px;
    }
    #banner img{
    height: 500px;
    }
    #banner .all-btn2 a{
        padding: 10px 15px;
    }
    .logo img{
        height: 40px !important;
    }
}

@media only screen and (max-width: 700px){
    section{
        padding: 40px 0;
    }
    #banner .ban-text{
        padding: 0 50px;
        text-align: center;
        top: 55%;
    }
    #banner .ban-text h1{
        font-size: 50px;
    }
     #banner{
        height: 450px;
    }
    #banner img{
    height: 450px;
    }
    #footer{
        padding-top: 30px;
    }
}

@media only screen and (max-width: 650px){
    #collection .col-wrap {
  grid-template-columns: repeat(1, 1fr);
  gap: 20px;
}
}

@media only screen and (max-width: 480px){
     #banner .ban-text{
        padding: 0 12px;
    }
    #banner .top-head{
        margin-bottom: 15px;
    }
    #banner .ban-text h1{
        font-size: 45px;
    }
    #banner .ban-text p{
        font-size: 15px;
        margin-bottom: 20px;
    }
    .heading h1{
        font-size: 30px;
    }
    #about .signature{
        font-size: 20px;
        margin-top: 0;
    }
    .heading p{
        margin-bottom: 20px;
    }
     section {
    padding: 30px 0;
  }
  #feel .features {
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 30px;
}
#feel .feature strong{
    font-size: 18px;
}
#feel .feature{
    padding-top: 10px;
}
#feel .feature p{
    margin: 3px 0 0;
}
}

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