/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */

/* Small devices (tablets, 768px and up) */
/* Small devices (tablets, 768px and up) */
/* Medium devices (desktops, 992px and up) */
/* Large devices (large desktops, 1200px and up) */

/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */

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

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

}

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

}

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

}

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

}

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

}

/*  (min-width:1280px)+++ */
@media only screen and (max-width:1280px) {

}

/*  (min-width:1200px)+++ */
@media only screen and (min-width:1200px) {
}

/*  (max-width:1200px)+++ */
@media only screen and (max-width:1200px) {

}

/* (min-width:992px) (max-width: 1199.98px) // Large devices (desktops, less than 1200px) */
@media only screen and (max-width: 1199.98px) {/* ExTra Class Start*/

}

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

}

/* Medium devices (min-width:768px) (max-width: 991.98px) // (tablets, less than 992px) */
@media only screen and (max-width:991px) {/* ExTra Class Start*/

}

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

}

/* Small devices (min-width: 576px) (max-width: 767.98px) // (landscape phones, less than 768px) */
@media only screen and (max-width: 767.98px) {/* ExTra Class Start*/


}

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

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

/* Extra small devices (min-width:361px) (max-width: 575.98px) // (portrait phones, less than 576px) */
@media only screen and (max-width: 575.98px) {

}

/* (min-width:361px) (max-width:520px) */
@media only screen and (max-width:520px) {

}

/* (min-width:480px) (max-width:500px) */
@media only screen and (max-width:500px) {

}

/* (min-width:361px) (max-width:479px) */
@media only screen and (max-width:479px) {

}

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

}

@media only screen and (max-width:400px) {/* ExTra Class Start*/

}

/* (min-width:321px) (max-width:360px) */
@media only screen and (max-width:360px) {

}

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

}

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

}

/* ============================================ */
/* Mobile Header Transparent Style for stylehome1 */
/* ============================================ */

/* Make mobile header background transparent and fixed position */
@media (max-width: 992px) {
  /* Make mobile menu fixed and transparent */
  .mobilie_header_nav.stylehome1 .mobile-menu {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 9999;
    transition: all 0.3s ease-in-out;
  }

  /* Default for all pages: White background with shadow */
  .mobilie_header_nav.stylehome1 .mobile-menu .header.innerpage-style {
    background-color: rgba(255, 255, 255, 0.95) !important;
    box-shadow: 0px 8px 32px rgba(24, 26, 32, 0.1) !important;
    -webkit-box-shadow: 0px 8px 32px rgba(24, 26, 32, 0.1) !important;
    -moz-box-shadow: 0px 8px 32px rgba(24, 26, 32, 0.1) !important;
    -o-box-shadow: 0px 8px 32px rgba(24, 26, 32, 0.1) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transition: all 0.3s ease-in-out;
  }

  /* Exception for home and about pages: Transparent background */
  body.home-page .mobilie_header_nav.stylehome1 .mobile-menu .header.innerpage-style,
  body.about-page .mobilie_header_nav.stylehome1 .mobile-menu .header.innerpage-style {
    background-color: transparent !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    -o-box-shadow: none !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
  }

  /* Make mobile menu bar background transparent */
  .mobilie_header_nav.stylehome1 .mobile_menu_bar {
    background-color: transparent;
  }

  /* Body content starts from top - overlapped by nav */
  .mobilie_header_nav.stylehome1 ~ .body_content,
  .mobilie_header_nav.stylehome1 + .wrapper,
  .mobilie_header_nav.stylehome1 ~ .wrapper {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  /* Add padding for mobile header - default for all pages */
  .mobilie_header_nav.stylehome1 {
    padding-top: 44px !important;
  }

  /* Remove padding for index.html and about.html only */
  body.home-page .mobilie_header_nav.stylehome1,
  body.about-page .mobilie_header_nav.stylehome1 {
    padding-top: 0 !important;
  }

  /* Hero sections should start from absolute top */
  .mobilie_header_nav.stylehome1 ~ .body_content .home-one,
  .mobilie_header_nav.stylehome1 ~ .body_content .hero-style-one,
  .mobilie_header_nav.stylehome1 ~ .wrapper .home-one,
  .mobilie_header_nav.stylehome1 ~ .wrapper .hero-style-one {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* === SCROLL EFFECTS === */
  /* When scrolled - add white background and shadow (only for home and about pages) */
  body.home-page .mobilie_header_nav.stylehome1 .mobile-menu.mobile-scrolled .header.innerpage-style,
  body.about-page .mobilie_header_nav.stylehome1 .mobile-menu.mobile-scrolled .header.innerpage-style {
    background-color: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0px 8px 32px rgba(24, 26, 32, 0.1) !important;
    -webkit-box-shadow: 0px 8px 32px rgba(24, 26, 32, 0.1) !important;
    -moz-box-shadow: 0px 8px 32px rgba(24, 26, 32, 0.1) !important;
    -o-box-shadow: 0px 8px 32px rgba(24, 26, 32, 0.1) !important;
  }

  /* Logo switching on scroll */
  /* Default for all pages: Show dark logo (logo2) */
  .mobilie_header_nav.stylehome1 .mobile_logo .logo1 {
    display: none;
  }

  .mobilie_header_nav.stylehome1 .mobile_logo .logo2 {
    display: inline-block;
  }

  /* Exception for home and about pages: Show white logo (logo1) by default */
  body.home-page .mobilie_header_nav.stylehome1 .mobile_logo .logo1,
  body.about-page .mobilie_header_nav.stylehome1 .mobile_logo .logo1 {
    display: inline-block;
  }

  body.home-page .mobilie_header_nav.stylehome1 .mobile_logo .logo2,
  body.about-page .mobilie_header_nav.stylehome1 .mobile_logo .logo2 {
    display: none;
  }

  /* When scrolled: Show dark logo (logo2) for home and about pages */
  body.home-page .mobilie_header_nav.stylehome1 .mobile-menu.mobile-scrolled .mobile_logo .logo1,
  body.about-page .mobilie_header_nav.stylehome1 .mobile-menu.mobile-scrolled .mobile_logo .logo1 {
    display: none;
  }

  body.home-page .mobilie_header_nav.stylehome1 .mobile-menu.mobile-scrolled .mobile_logo .logo2,
  body.about-page .mobilie_header_nav.stylehome1 .mobile-menu.mobile-scrolled .mobile_logo .logo2 {
    display: inline-block;
  }

  /* Menu icon switching on scroll */
  /* Default for all pages: Show dark menu icon (img-2) */
  .mobilie_header_nav.stylehome1 .menubar .img-1 {
    display: none;
  }

  .mobilie_header_nav.stylehome1 .menubar .img-2 {
    display: inline-block;
  }

  /* Exception for home and about pages: Show white menu icon (img-1) by default */
  body.home-page .mobilie_header_nav.stylehome1 .menubar .img-1,
  body.about-page .mobilie_header_nav.stylehome1 .menubar .img-1 {
    display: inline-block;
  }

  body.home-page .mobilie_header_nav.stylehome1 .menubar .img-2,
  body.about-page .mobilie_header_nav.stylehome1 .menubar .img-2 {
    display: none;
  }

  /* When scrolled: Show dark menu icon (img-2) for home and about pages */
  body.home-page .mobilie_header_nav.stylehome1 .mobile-menu.mobile-scrolled .menubar .img-1,
  body.about-page .mobilie_header_nav.stylehome1 .mobile-menu.mobile-scrolled .menubar .img-1 {
    display: none;
  }

  body.home-page .mobilie_header_nav.stylehome1 .mobile-menu.mobile-scrolled .menubar .img-2,
  body.about-page .mobilie_header_nav.stylehome1 .mobile-menu.mobile-scrolled .menubar .img-2 {
    display: inline-block;
  }

  /* Smooth transitions for all elements */
  .mobilie_header_nav.stylehome1 .mobile_logo img,
  .mobilie_header_nav.stylehome1 .menubar img {
    transition: opacity 0.3s ease-in-out;
  }

  /* === HIDE ON SCROLL DOWN, SHOW ON SCROLL UP === */
  /* Hide header when scrolling down */
  .mobilie_header_nav.stylehome1 .mobile-menu.mobile-hide {
    transform: translateY(-100%);
    transition: transform 0.3s ease-in-out;
  }

  /* Show header when scrolling up */
  .mobilie_header_nav.stylehome1 .mobile-menu.mobile-show {
    transform: translateY(0);
    transition: transform 0.3s ease-in-out;
  }
}