#hero-top p .color-red { color: #f40a62; }
#hero-top p .text-shadow { text-shadow: none; background-color: #f40a62; }
#hero-top p .font-size-24 { font-size: 9vw; }
/* Tablet and up */
@media screen and (min-width: 768px) {
#hero-top p .font-size-32 { font-size: 5vw; }
#hero-top .aem-hero__copy { margin: 0 12px; }
}
/* Mobile and tablet */
@media screen and (max-width: 768px) {
#hero-top .aem-hero__copy { margin: 0; }
#hero-top .aem-hero__copy .aem-hero__paragraph { margin: 0; }
}
/* Laptop and down */
@media screen and (max-width: 992px ) {
#hero-top .aem-hero__foreground { top: auto; bottom: 0; margin-bottom: 0.5rem; }
}

@media screen and (min-width: 1400px) {
#hero-top .aem-hero__foreground .aem-hero__image-1 { width: 38% !important; }
}

@media screen and (min-width: 1542px) {
#hero-top .aem-hero__foreground { height: 95%; }
}


/* Hero at the bottom of the page */
#hero-bottom a.aem-hero__button { 
   background: linear-gradient(to right, #ff3059 50%, #f40a62 50%); 
   background-position: 100%;
   background-size: 200% 100%; 
   background-color: #f40a62; 
   max-width: none; 
   width: fit-content; 
   line-height: 2; 
}
#hero-bottom a.aem-hero__button:hover, 
#hero-bottom a.aem-hero__button:active {
    background-position: 0 100%;
}
@media screen and (min-width: 1384px) {
#hero-bottom .aem-hero__foreground .aem-hero__image-1 { width: 536px !important; }
#hero-bottom .aem-hero__copy { margin: 60px 24px; }
}

#hero-bottom .font-size-24 { font-size: 1.75vw; }
#hero-bottom .aem-hero__foreground { top: auto; bottom: 0; }
@media screen and (max-width: 998px ) {
#hero-bottom .aem-hero__button { margin: 0 0 1rem; }
}
#hero-bottom-mobile-text {
background-color: #070710;
color: white;
padding: 1rem;
}
@media screen and (min-width: 576px ) {
#hero-bottom-mobile-text { padding: 2rem; }
}
@media screen and (min-width: 768px ) {
#hero-bottom-mobile-text { display: none; }
}