/* #region Header */
.hero-banner {
    position: relative;
    overflow: hidden;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.hero-banner h1 {
    margin-bottom: 3.5rem;
}
@media only screen
and (min-width : 768px ) {
    .hero-banner > .row {
        position: relative;
        z-index: 4;
        height: 62rem;
    }
    .hero-banner h1 {
        width: 73rem;
    }
    .hero-banner__bttn-container,
    .hero-col p {
        max-width: 58rem;
    }
    .hero-banner__bttn-container {
        margin-top: 4rem;
        text-align: right;
    }
    .hero__background {
        display: none;
    }
    
}
@media only screen
and (max-width : 767px ) {
    .hero-banner {
        background-image: none!important;
    }
    .hero__background {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
    }
    .hero__background-image {
        width: 100%;
        height: auto;
    }
    .hero-banner > .row {
        position: relative;
        z-index: 4;
        height: 72rem;
        align-items: flex-start;
    }
    .hero-col {
        padding-top: 12rem;
        max-width: 64rem;
    } 
    .hero-banner__bttn-container {
        margin-top: 2.5rem;
        text-align: right;
    }
}


/* #endregion */