@media(max-width:1536px){
  .why-details-outer {
    padding: 50px 50px;
  }
  .prefooter-image img.desktop-image {
    width: 100%;
  }
}

@media(max-width:1440px){
  .inner-text-section-outer1 {
      right: 11%;
      width: 42%;
   }
}

@media(max-width:1366px){
  .why-details-outer {
    padding: 30px 50px;
  }
}

@media(max-width:1280px){
  .why-title {
      font-size: 23px;
  }
  .why-content {
    font-size: 15px;
  }
  .why-details-outer {
      padding: 50px 50px 40px;
  }
  .why-icon {
    width: 70px !important;
  }
}

@media(max-width:1200px){
  .inner-text-section-outer1 {
    right: 5%;
  }
  .why-details-outer {
/*      padding: 20px 50px;*/
  }
  .about-royale-touche-section1 .col-md-8.offset-md-2 {
    margin-left: 0px;
  }
  .inner-text-section-outer1 {
    width: 50%;
  }
}

@media(max-width:1180px){
  .heroContent {
/*    height: 80%;*/
  }
  .bannerButton {
/*    bottom: 27%;*/
  }
  .heroBanner {
    height: calc(var(--vh, 1vh)* 80);
  }
  .why-details-outer {
      padding: 30px;
  }
  .why-icon {
    width: 50px !important;
  }
  .why-title {
    font-size: 18px;
  }
  .why-content {
    font-size: 14px;
  }
}


@media(max-width:1024px){
  .heroBanner {
    height: calc(var(--vh, 1vh)* 70);
  }
  .why-content {
    font-size: 14px;
  }
  .why-details-outer {
    padding: 40px 30px;
  }
  .logoImg img {
    width: 100px;
  }
  .heroContent h1 {
    font-size: 40px;
  } 
  p span.lifestyle {
    font-size: 15px;
  }
  p.unlock {
    font-size: 18px;
  }
}
/*1024 ends*/

@media (min-width: 1024px) and (min-height: 1366px) {
    .heroBanner {
        height: calc(var(--vh, 1vh)* 43);
    }
}

@media (max-width: 820px) {
  .heroContent h1 {
      font-size: 30px;
  }
  .iconBox img {
    height: 30px;
  }
  .why-choose-single {
    padding: 0px;
  }
  .why-icon {
      width: 35px !important;
  }
  .why-title {
    font-size: 16px;
  }
  .why-details-outer {
      padding: 30px 20px;
  }
  .why-content {
    font-size: 12px;
  }
  .heroBanner {
      height: calc(var(--vh, 1vh)* 41);
  }
  .bannerButton {
      left: auto;
  }
  .iconBox p {
    font-size: 12px;
  }
  .header.my-4.mt-5.mt-md-4 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
  }
  .bannerButton a {
    font-size: 15px;
  }
  .about-rt-bgimage{
    width: 100%;
  }
  .about-royale-touche-small {
    width: 100%;
  }
    .inner-text-section-outer1 {
    position: relative;
    padding-top: 30px;
    margin-top: 20px;
    width: 100%;
    right: 0%;
    padding-bottom: 0px;
            padding: 30px 0px;
  }
  .about-royale-touche-section1 {
    padding: 50px 0px;
  }
}

/* 820 ends */

@media(max-width:768px){
  .logoImg img {
      width: 80px;
  }
  .groupBtn a {
    font-size: 10px;
  }
  .heroBanner {
    height: calc(var(--vh, 1vh)* 44);
  }
  .inner-text-section-outer1 {
    position: relative;
    padding-top: 30px;
    margin-top: 20px;
    width: 100%;
    right: 0%;
    padding-bottom: 0px;
            padding: 30px 0px;
  }
  .about-royale-touche-section1 {
    padding: 50px 0px;
  }
}
/*768 ends*/

@media (max-width: 767px) {
/*  p span.lifestyle{
    font-weight: normal;
  }*/
  .bannerButton {
    bottom: 30px;
    gap: 20px;
    padding-left: 15px;
    left: 0;
  }

  .bannerButton a {
    font-size: 14px;
    color: #ffffff;
    margin: 0px 10px;
  }
  .logoImg img {
    width: 100px;
  }
  .heroContent h1 {
    font-size: 28px;
  }
  p.unlock {
    font-size: 18px;
  }
  .iconBox p {
    color: #ffffff;
    font-size: 12px;
  }
  p span.lifestyle {
    font-size: 14px;
  }
  form#form1 .form-control {
    width: auto !important;
    text-align: center;
    display: grid;
    font-size: 12px;
  }
  form#form1 span#basic-addon1 {
    font-size: 12px;
  }
  form#form1 input#name.form-control,
  input#city_id.form-control {
    width: 100% !important;
    display: block;
  }

  form#form1 .form-control {
    padding: 10px 10px;
  }
  .bannerButton a::after {
    background-color: #cdaf52;
  }
  .mobile-image{
    display: block;
  }
  .desktop-image{
    display: none;
  }
  .heroBanner {
      height: calc(var(--vh, 1vh)* 90);
  }
  .bannerButton {
    bottom: 30px;
        margin: 0 auto;
    display: block;
    text-align: center;
  }
  .iconBox img {
    height: 40px;
  }
  .inner-text-section-outer1 {
      text-align: justify;
      padding: 30px;
  }
  .section-padding {
    padding: 50px 0px;
  }
  .about-royale-touche-section1 {
    padding: 50px 0px;
  }
  .why-details-outer {
    padding: 50px;
  }
  .why-icon {
      width: 80px !important;
  }
   .why-title {
      font-size: 27px;
  }
   .why-content {
      font-size: 18px;
  }
  .prefooter-image img.desktop-image {
    display: none;
  }
  .prefooter-image img.mobile-image {
    width:100%;
  }
  .heroBanner.position-relative {
/*    background: url(../../assets/img/woodden-floor-banner-mob-updated.jpg);*/
/*    background-position: bottom;*/
    background: url(../../assets/img/woodden-floor-banner-mob-updated12.jpg);
    background-position: center top;
  }
  .heroBanner picture {
    display: none;
  }
  .heroContent {
    text-align: center;
  }
  .iconBox {
    width: 33%;
    float: left;
    padding-top: 20px;
  }
  .iconWrapper {
    text-align: center;
    margin: 0;
    display: inline-block !important;
  }
  .groupBtn a {
    color: #ffffff;
  }
}
/*767 ends*/

@media (min-width: 768px) and (max-width: 991px) {
  .bannerButton {
/*    left: 30px;*/
  }
}

@media (min-width: 1200px) {
  .heroBanner {
    align-items: center;
    display: block;
  }

  .heroBanner img.bannerImg {
    width: 100%;
    height: 100vh;
    height: calc(var(--vh, 1vh) * 100);
  }
}

@media (min-width: 1600px) {
  .container {
    max-width: 1600px;
  }
}

@media(max-width:414px){
  .heroBanner {
      height: calc(var(--vh, 1vh)* 80);
  }
   .why-details-outer {
      padding: 25px 50px;
  }
  .why-content {
    font-size: 17px;
  }
  .green-title {
    font-size: 27px;
  }
  .about-title {
    font-size: 1.5rem;
   }
}

@media(max-width:375px){
  .heroBanner {
      height: calc(var(--vh, 1vh)* 90);
  }
}    

@media(max-width:344px){
  .heroBanner {
      height: calc(var(--vh, 1vh)* 72);
  }
} 