html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  overscroll-behavior-x: none;
}

img,
svg,
video,
canvas {
  max-width: 100%;
  height: auto;
}

@media only screen and (max-width: 1199.98px) {
  .header-area {
    padding-top: 8px;
  }

  body.theme-color-1 .header-area {
    background-color: transparent;
    border-bottom-color: transparent;
  }

  body.theme-color-1 .header-area.is-sticky {
    background: rgba(255, 255, 255, 0.92);
    border-bottom-color: var(--border-color);
  }

  .header-area .main-responsive-nav > div {
    gap: 12px;
  }

  .header-area .main-responsive-nav {
    height: 68px;
    line-height: 52px;
  }

  .header-area .main-responsive-nav .logo {
    flex: 0 1 auto;
    min-width: 0;
  }

  .header-area .main-responsive-nav .logo img,
  .header-area .main-navbar .navbar-brand img {
    display: block;
    width: auto;
    max-width: 140px;
    max-height: 42px;
  }

  .header-area .menu-toggler {
    flex: 0 0 auto;
    margin-inline-start: auto;
  }

  body.theme-color-1 .header-area:not(.is-sticky) .menu-toggler span {
    background: #ffffff;
  }

  body.theme-color-1 .header-area.is-sticky .menu-toggler span {
    background: var(--color-primary);
  }

  .mobile-menu {
    max-width: 100vw;
  }

  .mobile-menu .mobile-menu-wrapper,
  .mobile-menu .navbar-nav,
  .mobile-menu .more-option {
    min-width: 0;
  }
}

@media only screen and (max-width: 767.98px) {
  .hero-banner.hero-banner-1.bg-img {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
  }

  .tabs-navigation,
  .swiper,
  .swiper-wrapper {
    max-width: 100%;
  }

  .hero-banner .banner-content,
  .footer-area .footer-widget,
  .footer-area .newsletter-form,
  .footer-area .newsletter-form input,
  .header-area .main-responsive-nav > div {
    min-width: 0;
  }

  .menu-mobile-element,
  .menu-mobile-element .container,
  .mobile-menu {
    max-width: 100%;
  }

  .video-area .video-inner {
    max-width: 100%;
  }
}