/* 
    QC Registry 
    Website CSS - Responsive
    By: Glimsol Web & Digital Solutions (PH)
*/

@media screen and (max-width: 576px) {
  /* NAVBAR */
  nav#block-qcregistry-main-navigation li { margin-left: auto; margin-right: auto;}
  header .header-navbar ul.navbar-nav .nav-link { margin-left: auto;}
  header nav.header-navbar ul.navbar-nav  { align-items: end;}
  #block-qcregistry-main-navigation li.nav-item { padding-right: 0;}
  header nav.header-navbar ul.navbar-nav { align-items: center;}
    /* HOME PAGE */
  .region-header {
    display: none;
  }
  .navbar .region-nav-branding {
    display: block;
  }
  .navbar .region-nav-branding img {
    width: 120px;
    height: auto;
    /* content:url("/sites/default/files/brand logo.png") */
  }
  footer.mt-auto > .container {
    flex-wrap: wrap;
    justify-content: center;
  }
  .banner-section .owl-carousel .owl-item img {
    aspect-ratio: 9 / 12;
  }
  header .navbar #navbarSupportedContent .region-nav-main{
    align-items: start;
    flex-direction: column;
  }
  #block-qcregistry-secondarynavigation li:first-child {
    border: none;
  }
  #block-qcregistry-secondarynavigation li.nav-item{
    padding: 8px;
  }
  #block-qcregistry-secondarynavigation li.nav-item a { padding-left: 0; padding-right: 0;}

  div.layout-need-support .container {flex-wrap: wrap; row-gap: 8px; }
  div.layout-need-support .container .right-col { text-align: start;}

  /* DATABASE */
  .content-database-page .db-page-content { height: 85dvh; padding: 0;}
  .db-page-content .container { padding: 20px;}

  /* ABOUT */
  .content-about-page .hero-section .row > div:last-child { text-align: center;}
  .registration-cards-basic { flex-wrap: wrap;}
  .registration-cards-basic .registration-card-basic { flex: 1 0 100%;}
  .content-about-page .hero-section > .row > div:last-child { padding-left: unset; padding-right: unset;}
  .main-content .layout-alternate-strip .cards { grid-template-columns: 1fr;}
  .layout-alternate-strip .cards .content-basic-card { padding: 1.5em;}
  .content-about-page .qualification-wrapper-check { grid-template-columns: 1fr;}
  .content-about-page .texts-w-cta .right-text { text-align: left;}
  .content-about-page .main-content .layout-two-column .row { flex-direction: column-reverse;}
  .content-about-page .main-content .layout-two-column:last-of-type .row { flex-direction: column}

  .content-application-process .application-step-outer {padding: 0;}

  .content-landing-page .rbanner-info .rbanner-title {width: 100%;}
  .rbanner-info .rbanner-title { font-size: 2rem;}

  .section-row + .field-group-wrapper > div:not(.field--type-markup),
  .section-row + .field-group-wrapper > fieldset { width: 100%;}
  .engagements + .field-group-wrapper .fieldset-wrapper > div > div { width: 100%;}

  .page-node-type-homepage .alert { padding: 20px;}

  article.content-registration .content-application-requirements .qualification-wrapper-check { grid-template-columns: repeat(1, 1fr); }
  .content-error-page .container-fluid .banner-content img { aspect-ratio: 3 / 4; object-fit: cover;}
  div.registry-banner img{ aspect-ratio: 3 / 4; object-fit: cover; }
  div.registry-banner .container {padding-right: calc(var(--bs-gutter-x) * 0.5); padding-left: calc(var(--bs-gutter-x) * 0.5); }
  div.content-application-requirements .container .grid-basic-cards { grid-template-columns: repeat(2, 1fr);}

  div.content-help-desk .form-container { padding: 0;}

  .description-section .logo-wrapper { padding-left: 4rem; padding-right: 4rem;}
  div.qc-database-search > img { aspect-ratio: 3 / 4; object-fit: cover;}

  div.db-page-content img { aspect-ratio: 3 / 4; object-fit: cover; }


}

@media screen and (max-width: 768px) {
  /* .main-content .layout-alternate-strip .cards { grid-template-columns: 1fr 1fr;} */
  div.content-application-requirements .grid-basic-cards { grid-template-columns: repeat(3, 1fr);}
}

@media screen and (max-width: 992px) {
  /* xxx */
}

@media screen and (max-width: 1200px) {
  /* xxx */
}