/* 
Mobile - S - 320px
Mobile - M - 375px
Mobile - L - 425px

@media only screen and (max-width: 600px) {
} */

/* X-Small	None	<576px  :-moz-broken


Small	sm	≥576px  table


Medium	md	≥768px
Large	lg	≥992px
Extra large	xl	≥1200px
Extra extra large	xxl	≥1400px */

/* https://css-tricks.com/snippets/css/media-queries-for-standard-devices/ */

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  .hideOverflowOnMobile {
    overflow: hidden;
  }
  h1,
  h2 {
    font-size: 1.5rem;
  }
  h3 {
    margin-left: 0.125rem;
    margin-right: 0.125rem;
    font-size: 1.4rem;
  }
  p {
    font-size: 1rem;
    line-height: 1.7rem;
    margin-bottom: 1.5rem;
  }
  .nav_p {
    text-align: center;
  }
  .dropdown-menu,
  .dropdown-item {
    background-color: #ffffff;
    color: #131313;
    padding-left: 0.5rem;
    border-left-width: 1rem;
  }
  .dropdown-item.active {
    color: var(--color-theme);
    background-color: #e7e7e7;
  }
  .mb-5 {
    margin-bottom: 1rem !important;
  }

  .contentHeader,
  .contentSubHeader {
    padding: 1.2rem 0.5rem !important;
  }

  .mobile-frame {
    margin: 0;
    position: sticky;
  }

  .content-banner-image {
    padding: 1.5rem 0;
  }
  .container-main {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
  .img_wrap {
    margin: 0;
    margin-bottom: 1.5rem;
  }
  .flex-direction {
    flex-direction: column;
  }
  .img-icon-dark {
    margin-bottom: 1rem;
  }

  /* general scrollx style */
  .scrollx p {
    font-size: 1rem;
    line-height: 1.6rem;
    padding-left: 0.25rem;
    padding-right: 0.25rem;
    margin-bottom: 1rem;
  }
  .scrollx .card-body {
    padding: 1rem 0.25rem;
  }
  .scrollx .card-title {
    margin-bottom: 1.5rem;
  }
  .scrollx > section {
    width: 100vw;
  }
  .scrollx .card {
    width: 85vw;
    height: 100% !important;
    max-height: 95vh !important;
  }

  .img_radius_rr35,
  .img_radius_r35 {
    border-radius: 0 !important;
  }

  /* vertical scroll panel */
  .scrollx-about-team .card,
  .scrollx-socio .card {
    width: 90vw !important;
  }

  /* convert horizontal card into vertica in aboutus, healthcare */
  .scrollx-healthcare .card,
  .scroll_advantage .card {
    width: 90vw !important;
  }
  .scrollx-healthcare row,
  .scroll_advantage row {
    flex-direction: column !important;
  }
  .scrollx-healthcare .img-container,
  .scroll_advantage .img-container {
    max-height: 25svh !important;
    width: 100% !important;
  }
  .scrollx-healthcare img,
  .scroll_advantage img {
    width: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
  }
  .scrollx-healthcare .body-container,
  .scroll_advantage .body-container {
    height: 100% !important;
    padding: 0.25rem !important;
  }

  /* healthcare horizontal card */
  .scrollx-healthcare .img-container {
    max-height: 25svh !important;
  }
  .scrollx-healthcare p {
    font-size: 0.9rem;
    line-height: 1.5rem !important;
  }

  #hc_images img {
    width: 85vw !important;
  }

  /* virtual medical */
  .icon_image {
    width: 10rem !important;
    height: 10rem !important;
  }

  /* .scroll_advantage .img-container {
    display: flex;
    flex-direction: column;
    flex: 1;
  }
  #advantage_scroll .img-container {
    max-height: 20svh;
    height: auto;
    overflow: hidden;
  } */

  /* .scrollx-socio .card{
    width: 92vw;
    height: 85svh;
    max-height: -webkit-fill-available;
  } */
  /* .scrollx-socio .scrollx-image{
    min-height: 20svh;
    max-height: 30svh;
    height: auto;
    overflow: hidden;
  } */
  /* general scrollx style */
}