.hero .break-out {
    width: 100vw;
    position: relative;
    left: calc(-1 * (100vw - 100%) / 2);
}

.hero .gradient {
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 75%);
    width: 100%;
    height: 125px;
}

.hero .gradient.hide {
    background: rgb(0,0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 75%);
    width: 100vw;
    height: 125px;
}




.hero .heroBG .heroContainer {
    height: 28vw;
    min-height: 315px;
    max-height: 830px;
}
@media (min-width: 768px) {
    .hero .heroBG .heroContainer {
        height: calc(32vw - 125px);
        max-height: 830px;
    }
}
@media (min-width: 992px) {
    .hero .heroBG .heroContainer {
        height: calc(32vw - 125px);
        max-height: 830px;
    }
}
@media (min-width: 1200px) {
    .hero .heroBG .heroContainer {
        height: calc(32vw - 125px);
        max-height: 830px;
    }
}







.hero .heroBG {
    background-position: center 0;
    background-repeat: no-repeat;
    background-size: cover;
    height: 215vw;
    min-height: 875px;
    max-height: 1000px;
    margin-top: -460px;
    color: #fff;
    padding-top: 315px;
}
@media (min-width: 768px) {
    .hero .heroBG {
        height: 32vw;
        min-height: 525px;
        max-height: 900px;
        color: #fff;
        margin-top: -215px;
        padding-top: 65px;
    }
}
@media (min-width: 992px) {
    .hero .heroBG {
        height: 32vw;
        min-height: 525px;
        max-height: 900px;
        color: #fff;
        margin-top: -150px;
        padding-top: 0px;
    }
}
@media (min-width: 1200px) {
    .hero .heroBG {
        background-position: center 30%;
        background-repeat: no-repeat;
        background-size: cover;
        height: 32vw;
        min-height: 525px;
        max-height: 900px;
        margin-top: -50px;
        color: #fff;
        padding-top: 0px;
    }
}









.hero .container h1 {
    font-size: 2.25rem;
}
@media (min-width: 768px) {
    .hero .container h1 {
        font-size: 2.5rem;
    }
}
@media (min-width: 992px) {
    .hero .container h1 {
        font-size: 2.75rem;
    }
}
@media (min-width: 1200px) {
    .hero .container h1 {
        font-size: 3rem;
    }
}





.hero .container h2 {
    font-size: 1.3rem;
}
@media (min-width: 768px) {
    .hero .container h2 {
        font-size: 1.45rem;
    }
}
@media (min-width: 992px) {
    .hero .container h2 {
        font-size: 1.6rem;
    }
}
@media (min-width: 1200px) {
    .hero .container h2 {
        font-size: 1.75rem;
    }
}



.hero .editor-styles-wrapper p {
    line-height: 1.2rem !important;
}

.hero .font-weight-light {
    font-weight: 300 !important;
}

.hero .container strong {
    font-weight: 900;
}
@media (min-width: 768px) {
    .hero .container strong {
        font-weight: 900;
    }
}
@media (min-width: 992px) {
    .hero .container strong {
        font-weight: 900;
    }
}
@media (min-width: 1200px) {
    .hero .container strong {
        font-weight: 900;
    }
}