@media only screen and (max-width: 1550px) {
  header .side-bar ul {
    padding-right: 40rem;
  }

  section.main-banner .splide__arrows .splide__arrow--next {
    left: 30px;
  }

  section.main-banner .bg2 h2, section.main-banner .bg-3 h2, section.main-banner .bg-4 h2{
    font-size: 2.5rem;
  }

  section.main-banner .grid .extra-space {
    padding-left: 8rem;
  }

}

@media only screen and (max-width: 1399px) {
  /* section.main-banner .bg2 h2,
  section.main-banner .bg-3 h2,
  section.main-banner .bg-4 h2 {
    font-size: 3rem;
  } */
  section.main-banner .bg2 p,
  section.main-banner .bg-3 p,
  section.main-banner .bg-4 p {
    font-size: 2rem;
  }

  section.main-banner .bg2 .last-para,
  section.main-banner .bg-3 .last-para,
  section.main-banner .bg-4 .last-para {
    font-size: 2.5rem;
  }
  section.heirloom  .line-1{
    width: 79%;
    }
  section.heirloom  .line-2{
    width: 73%;
    }

  
}

@media only screen and (max-width: 1282px) {
  header .side-bar ul {
    padding-right: 35rem;
  }

  section.main-banner .bg-1 .container {
    max-width: 90%;
  }
  section.main-banner .bg-1 h1 {
    font-size: 3.5rem;
  }
  section.main-banner .bg-1 p {
    font-size: 2.5rem;
  }
  section.main-banner .bg2 .last-para,
  section.main-banner .bg-3 .last-para,
  section.main-banner .bg-4 .last-para {
    font-size: 1.5rem;
  }

  section.main-banner .bg2 h2, section.main-banner .bg-3 h2, section.main-banner .bg-4 h2{
    font-size: 2.5rem;
  }

  section.main-banner .grid .extra-space {
    padding-left: 12rem;
    padding-top: 3rem;
  }

}

@media only screen and (max-width: 1199px) {
  section.main-banner .grid .extra-space {
    padding-top: 3rem;
  }
  section.main-banner .bg2 h2,
  section.main-banner .bg-3 h2,
  section.main-banner .bg-4 h2 {
    font-size: 2rem;
  }
  section.main-banner .bg2 p,
  section.main-banner .bg-3 p,
  section.main-banner .bg-4 p {
    font-size: 1.5rem;
  }
  section.emperors p{
   font-size: 18px;
   
  }
  section.heirloom  .line-1{
    width: 75%;
    }
  section.heirloom  .line-2{
    width: 68%;
    }

}

@media only screen and (max-width: 1050px) {
  header .side-bar .img-box {
    width: 55%;
  }

  section.main-banner .bg-1 h1 {
    font-size: 3rem;
  }
  section.main-banner .bg-1 p {
    font-size: 2rem;
  }
}

@media only screen and (max-width: 990px) {
  header .side-bar ul {
    padding-right: 25rem;
  }
  section.main-banner .bg-1 h1 {
    font-size: 2.5rem;
  }
  section.main-banner .bg-1 p {
    font-size: 1.7rem;
  }
  section.main-banner .grid .extra-space {
    padding-left: 0;
  }
  section.main-banner .bg-4 .grid .extra-space {
    padding-right: 0.5rem;
  }
  section.main-banner .bg2 h2,
  section.main-banner .bg-3 h2,
  section.main-banner .bg-4 h2 {
    font-size: 2rem;
  }
  section.main-banner .bg2 p,
  section.main-banner .bg-3 p,
  section.main-banner .bg-4 p {
    font-size: 1.5rem;
  }
  section.main-banner .bg2 .last-para,
  section.main-banner .bg-3 .last-para,
  section.main-banner .bg-4 .last-para {
    font-size: 1.4rem;
  }
  footer{
    padding: 3rem 1.5rem;
   }
   section.emperors{
    padding: 10rem 0 0 0;
  }
  section.heirloom  .heading h2{
    font-size: 1.8rem;
    margin-right: 1rem !important;
    }
    section.heirloom  .line{
      width: 40vw;
    }
    section.heirloom{
      padding: 10rem 0 4rem 0;
    }

    section.looks .heading img{
      width: 45%;
    }
    section.heirloom  .line-1{
      width: 70%;
      }
    section.heirloom  .line-2{
      width: 61%;
      }
}

@media only screen and (max-width: 851px) {
  section.main-banner .bg-1 h1 {
    font-size: 2rem;
  }
  section.main-banner .bg-1 p {
    font-size: 1.5rem;
  }
  section.main-banner .bg-1 .container {
    max-width: 97%;
    bottom: 150px;
  }
  
}

@media only screen and (max-width: 768px) {
  header .side-bar ul {
    padding-right: 20rem;
  }

}

@media only screen and (max-width: 767px) {
  header .side-bar ul {
    padding-right: 10rem;
  }
  section.main-banner .bg-1 h1 {
    font-size: 1.8rem;
  }
  section.main-banner .bg-1 p {
    font-size: 2rem;
  }

  section.main-banner .bg-1 .line {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin: 1rem 0;
  }
  section.main-banner .bg2 p,
  section.main-banner .bg-3 p,
  section.main-banner .bg-4 p {
    margin: 0.5rem 0 !important;
  }
  section.main-banner .bg2 img,
  section.main-banner .bg-3 img,
  section.main-banner .bg-4 img {
    width: 250px;
    margin: 0 auto;
  }
  nav img{
    max-width: 60% !important;
  }
  nav.navbar {
    padding: 0.5rem 1.5rem;
  }
  section.heirloom  .heading{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    }
  section.heirloom  .heading .dot{
  display: none;
    }

    
section.heirloom .size{
  width: 250px;
  height: 250px; 
}

section.heirloom  .line{
  width: 100%;
  } 

  section.looks .heading img{
    width: 35%;
  }
  section.heirloom  .line-1 ,   section.heirloom  .line-2,   section.heirloom  .line-3{
    width: 100%;
    }

}

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

  header .side-bar ul {
    padding-right: 5rem;
    padding-top: 12rem;
  }
  header .side-bar .img-box {
    display: none;
  }

  header .side-bar {
    align-items: flex-start;
  }
  nav {
    padding: 0.5rem 1.6rem;
  }
  section.main-banner .bg-1 h1 {
    font-size: 1.5rem;
  }

  section.main-banner .bg-1 p {
    font-size: 1.5rem;
  }
  section.main-banner .bg-4 .grid .extra-space{
    padding-right: 1.5rem;
  }

  section.main-banner .grid , section.main-banner .bg-4 .grid  {
    grid-template-columns: 1fr;
    gap: 5px;
    padding-left: 12px;
  }
  section.main-banner .line-design2{
margin-bottom:0.8rem;
  }
  .splide__arrows--ttb .splide__arrow--next{
    display: none;
  }

  section.heirloom .size{

    width: 300px;
    height: 300px; 
  }

  section.looks .heading img{
    width: 40%;
  } 


}

@media only screen and (max-width: 480px) {
  header .side-bar ul {
    padding-right: 1rem;
    padding-top: 7rem;
  }
  header .side-bar a {
    font-size: 1.5rem;
  }

  header .side-bar {
    align-items: flex-start;
  }
  .C-carousel--horizontal .C-navigation {
    bottom: 50px;
  }

  header .bar-box span{
    width: 5px;
    height: 5px;
  }
  header .bar-box > div{
    gap: 7px;
  }
   section.main-banner .bg-4 .grid{
    margin-top: 1rem;
  } 

  section.treasures{
    background-color: #2a275c;
    color: #fff;
    padding: 10rem 0 10rem 0;
  }

  section.treasures{
    padding: 8rem 0 5rem 0;
  }
  section.contact-us{
    padding: 8rem 0 5rem 0;
  }

  section.looks .heading img{
    top: 134px;
  }
  section.looks{
    padding: 8rem 0 4rem 0;
  }
  section.main_artists , section.heirloom{
    padding: 8rem 0 0rem 0;
}

section.queens{
  padding: 8rem 0 2rem 0;
}

section.emperors , section.emperors{
  padding: 8rem 0 0 0;
}



}
@media only screen and (max-width: 380px) {
  section.main-banner .bg2 img,
  section.main-banner .bg-3 img,
  section.main-banner .bg-4 img {
    width: 200px;
    margin: 0 auto;
  }

  section.main-banner .bg-4 img {
    width: 150px;
    margin: 0 auto;
  }

  section.main-banner .bg2 p,
  section.main-banner .bg-3 p,
  section.main-banner .bg-4 p {
    font-size: 1.2rem;
  }
  section.main-banner .bg2 h2,
  section.main-banner .bg-3 h2,
  section.main-banner .bg-4 h2 {
    font-size: 1.5rem;
    margin-bottom: 0rem !important;
  }

  section.main-banner .bg-1 .container {
    max-width: 97%;
    bottom: 100px;
  }
  nav img{
    max-width: 50% !important;
  }

 footer .social{
  margin-top: 1rem;
 }
}