/* Extra small devices */
@media (max-width: 375px) {
    .h1,
    h1 {
      font-size: 32px;
    }
    .hero-style3 .hero-title {
      font-size: 30px;
      line-height: 40px;
    }
    .hero-style3 {
      padding: 200px 0 115px 0;
    }
    .header-layout3 .header-logo {
      padding: 0;
      max-width: 150px;
      margin-left: -40px;
    }
    .bsop-dark, .bsop-white {
      display: none !important;
    }
    .nav-menu {
      width: 300px;
      top: 50px;
    }
  }

  /* iPhone 14 Pro Max */
  @media (max-width: 430px) and (min-width: 376px) {
    .header-layout3 .header-logo {
      margin-left: -30px; /* Điều chỉnh cho iPhone 14 Pro Max */
    }
     
    .titlenum5::before {
      font-size: 40px;
      left: -30px;
    }

    .sub-title:before {
      width: 25px;
    }
    .sub-title:after {
      width: 25px;
    }
    .nav-menu {
      width: 300px;
      top: 50px;
    }
  }
  
  /* iPhone 12 */
  @media (max-width: 390px) and (min-width: 376px) {
    .header-layout3 .header-logo {
      margin-left: -70px; /* Điều chỉnh cho iPhone 12 */
    }
  }
  
  /* Samsung S8 */
  @media (max-width: 360px) and (min-width: 375px) {
    .header-layout3 .header-logo {
      margin-left: -40px; /* Điều chỉnh cho Samsung S8 */
    }
  }
  
  /* Samsung S20 */
  @media (max-width: 412px) and (min-width: 376px) {
    .header-layout3 .header-logo {
      margin-left: -30px; /* Điều chỉnh cho Samsung S20 */
    }
  }


  @media (max-width: 480px) {
    .img-box1 .img3 {
      display: none;
    }
    .bsop-dark, .bsop-white {
      display: none !important;
    }
  }
  
  /* Extra small devices */
  @media (max-width: 575px) {
    .h1,
    h1 {
      font-size: 34px;
      line-height: 1.35;
    }
    .h2,
    h2 {
      font-size: 28px;
    }
    .fs-48 {
      font-size: 30px;
    }
    .bsop-dark, .bsop-white {
      display: none !important;
    }
    
  }
  
  /* Small devices */
  @media (max-width: 767px) {
    .h1,
    h1 {
      font-size: 30px;
    }
    .h2,
    h2 {
      font-size: 25px;
      line-height: 1.3;
    }
    .h3,
    h3 {
      font-size: 20px;
    }
    .h4,
    h4 {
      font-size: 22px;
    }
    .h5,
    h5 {
      font-size: 18px;
    }
    .h6,
    h6 {
      font-size: 16px;
    }
    .hero-style3 .hero-title {
      font-size: 22px;
      line-height: 30px;
    }
    .hero-style3 .hero-title2 {
        font-size: 22px;
        line-height: 75px;
        margin-top: -10px;
        margin-bottom: 10px;
      }
    .hero-style3 .hero-text {
        font-size: 14px;
        line-height: 30px;
      }
      .bannerso2 {
        margin-top: -400px;
      }
      .booking-form.style2 {
        min-width: 85%;
        box-shadow: 0px 20px 20px rgba(204, 204, 204, 0.15);
        border-radius: 16px;
        padding: 20px 30px 20px 35px;
        margin: 0 auto;
      }
      .image-container {
        width: 100%;
        margin-top: -60px;
      }
      .sec-text2:before {
        font-size: 35px;
        left: 3%;
      }
    .img-box1 .img3 {
      right: 0%;
    }
    .fs-48 {
      font-size: 40px;
    }
    .bsop-dark, .bsop-white {
      display: none !important;
    }
    .sec-text {
        font-size: 14px;
        line-height: 30px;
        text-align: justify;
    }
    .titlenum2 {
        text-align: justify;
        border: 2px solid #fff;
        padding: 20px 20px 1100px;
        font-size: 15px;
        line-height: 25px;
    }
    .titlenum3 {
        font-family: 'SVN-GeorgiaBoldItalic';
        max-width: 270px;
        font-size: 14px;
        float: right;
        padding-top: 15px;
    }
    .titlenum3::before {
        content: '“';
        font-size: 35px;
        position: absolute;
        font-family: 'CooperBlack';
        opacity: 0.6;
    }
    .min-width {
        min-width: 350px;
    }
    .borderleft {
        height: 370px;
        margin-top: 24px;
        margin-left: 20px;
        min-width: 0px;
    }
    .img.bg10 {
        min-height: 500px;
    }
    .border3 {
        border: 15px solid #fff;
        max-width: 80%;
        margin: 0 auto;
    }
    .height320 {
        height: 490px !important;
    }
    .titlenum4 {
        font-family: 'SVN-GeorgiaBoldItalic';
        max-width: 400px;
        font-size: 14px;
        float: left;
        margin-top: 5px;
        margin-left: 40px;
        line-height: 20px;
        text-align: justify;
    }
    .mt-80 {
        margin-top: 100px;
    }
    .titlenum5 {
        font-family: 'SVN-GeorgiaBoldItalic';
        max-width: 800px;
        font-size: 14px;
        float: left;
        margin-top: -65px;
        margin-left: 40px;
    }
    .imgfooter {
        margin-top: -60px;
        scale: 0.7;
        margin-bottom: 100px;
    }
    .widget-area {
        padding-top: 100px;
        padding-bottom: 300px;
    }
  }
  
  /* iPad Mini (768px) */
@media (min-width: 768px) and (max-width: 1024px) {
    .header-layout3 .header-logo {
      margin-left: -450px; /* Điều chỉnh cho iPad Mini */
    }
    .min-width {
        min-width: 700px;
    }
    .titlenum2 {
        text-align: justify;
        border: 2px solid #fff;
        padding: 40px 40px 860px;
        font-size: 15px;
        line-height: 25px;
    }
    .titlenum3 {
        font-family: 'SVN-GeorgiaBoldItalic';
        max-width: 400px;
        font-size: 18px;
        float: right;
        padding-top: 25px;
    }
    .titlenum3::before {
        content: '“';
        font-size: 60px;
        position: absolute;
        font-family: 'CooperBlack';
        opacity: 0.6;
        left: 33%;
    }
    .h3, h3 {
        font-size: 30px;
        margin-bottom:30px;
    }
    .borderleft {
        border-top: 2px solid black;
        border-right: 2px solid black;
        height: 220px;
        margin-top: 22px;
        margin-left: -60px;
        min-width: 490px;
    }
    .img.bg10 {
        width: 100%;
        min-height: 550px;
        object-fit: cover;
    }
    .border3 {
        border: 15px solid #fff;
        max-width: 80%;
        margin: 0 auto;
    }
    .titlenum4 {
        margin-top: -25px;
    }
    .titlenum5 {
        margin-left: 40px;
    }
    .bsop-dark, .bsop-white {
        display: none !important;
      }
  }
/* iPad Pro 12.9 inch (dọc) */
@media (min-width: 1024px) and (max-width: 1366px) {
    .header-layout3 .header-logo {
      margin-left: -680px; /* Điều chỉnh cho iPad Pro 12.9 inch ở chế độ dọc */
    }
    .bannerso2 {
        margin-top: -610px;
    }
    .borderleft {
        height: 240px;
        margin-top: 22px;
        margin-left: 20px;
        min-width: 470px;
    }
  }

  /* Medium devices */
  @media (max-width: 991px) {
    .sec-text.style2 {
      display: block;
      margin: auto auto 50px auto;
      text-align: center;
    }
    .hero-style3 {
      text-align: center;
      padding: 145px 0 500px 0;
    }
    .hero3Thumbs {
      display: none;
    }
    .hero3-swiper-custom {
      bottom: 0;
    }
    .hero3-wrapper {
      margin-top: 0;
    }
    .hero3-wrapper .container {
      max-width: 100%;
    }
    .img-box1 .img3 {
      right: 20%;
    }

    .sec-text2 {
      font-size: 14px;
      line-height: 23px;
    }
    .space,
    .space-top {
      padding-top: var(--section-space-mobile);
    }
    .space,
    .space-bottom {
      padding-bottom: var(--section-space-mobile);
    }
    .space-extra,
    .space-extra-top {
      padding-top: calc(var(--section-space-mobile) - 30px);
    }
    .space-extra,
    .space-extra-bottom {
      padding-bottom: calc(var(--section-space-mobile) - 30px);
    }
    .space-top-md-none {
      padding-top: 0;
    }
    .space-extra2,
    .space-extra2-top {
      padding-top: 70px;
    }
    .space-extra2,
    .space-extra2-bottom {
      padding-bottom: 70px;
    }
    .bsop-dark, .bsop-white {
      display: none !important;
    }
  }
  
  /* Large devices */
  @media (max-width: 1199px) {
    .h1,
    h1 {
      font-size: 54px;
      line-height: 1.3;
    }
    .h2,
    h2 {
      font-size: 36px;
      line-height: 1.3;
    }
    .h4,
    h4 {
      font-size: 24px;
    }
    .h5,
    h5 {
      font-size: 20px;
      min-width: 250px;
    }
    .h6,
    h6 {
      font-size: 16px;
    }
    .header-layout3 .menu-area {
      padding: 0;
    }
    .backtobsop::before {
      top: -27px !important;
    }
    .header-layout3 .header-right-button {
      top: 25px;
      right: 20px;
    }
    .blog-list-single {
      gap: 25px;
    }
    .hero-style3 {
      padding: 150px 0 530px 0;
    }
    .hero3Thumbs {
      bottom: 65px;
    }
    .hero3-swiper-custom .swiper-button-next,
    .hero3-swiper-custom .swiper-button-prev {
      top: var(--swiper-navigation-top-offset, 55%);
    }
    .img-box1 .img3 {
      right: 40%;
    }
    .booking-form {
      padding: 20px 20px;
    }
    .booking-form.style2 .input-wrap .form-group {
      height: 100%;
      padding-bottom: 20px;
      padding-left: 13px;
    }
    .booking-form.style2 .input-wrap .form-group .search-input {
      min-width: 95%;
    }
    .booking-form.style2 .input-wrap .form-group:not(:first-child) {
      border-left: none;
      padding-left: 12px;
    }
    .booking-form.style2 .input-wrap .form-btn .th-btn {
      width: 100%;
    }
    .booking-form.style2 .input-wrap .form-group .nice-select:after {
      right: 20px;
    }
  }

  @media (min-width: 1920px) {
    .sec-text2:before {
      left: 3%;
    }
  }