/* ==========================================================================
   RESPONSIVE STYLES - STGO21K
========================================================================== */

/* ==========================================================================
    SMALL SCREENS (576px - 767px)
========================================================================== */
@media only screen and (min-width: 576px) {
    .hero__logo {
        max-width: 300px;
        height: auto !important;
      }

}


/* ==========================================================================
    MEDIUM SCREENS (768px - 991px)
========================================================================== */
@media only screen and (min-width: 768px) {


}


/* ==========================================================================
    LARGE SCREENS (991px - 1999px)
========================================================================== */
@media only screen and (min-width: 992px) {
    .navbar-collapse {
        background-color: transparent;
        padding: 1rem;
    }

    .navbar-nav {
        justify-content: space-around;
        align-items: center;
        width: 100%;
    }

    .hero__logo {
        max-width: 350px;
        height: auto !important;
      }

      .hero__content {
        max-width: 580px;
      }
}


/* ==========================================================================
    X-LARGE SCREENS (1200px - 1399px)
========================================================================== */
@media only screen and (min-width: 1200px) {
    .nav-logo {
        width: 120px;
        height: auto!important;
    }

    .hero__logo {
        max-width: 450px;
        height: auto !important;
      }

    
}


/* ==========================================================================
    XX-LARGE SCREENS (1400px - 1599px)
========================================================================== */
@media only screen and (min-width: 1400px) {
    .hero__title {
        font-size: 5.25rem;
    }

}


/* ==========================================================================
    DESKTOP MEDIUM SCREENS (1600px - 1899px)
========================================================================== */
@media only screen and (min-width: 1600px) {
    .hero__logo {
        max-width: 542px;
        height: auto !important;
      }
}


/* ==========================================================================
    FULL HD SCREENS (>1900px)
========================================================================== */
@media only screen and (min-width: 1900px) {
    .title__primary {
        font-size: 3.125rem;
    }
}