.hero *, .hero p.ingress{
    color: var(--white);
}

.product-Hero * {
    color: var(--primary);
}

.hero h1 {
    color: var(--fourth);
}

.product-Hero h1 {
    color: var(--primary);
}

.overlay-True {
    position: relative;
}

.overlay-True:after {
    content: "";
    position:absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.2);
}

.overlay-True .text {
    position:relative;
    z-index: 1;
}

.overlap-True > div {
    position:relative;
    top: 5%;
}

.hero video {
    height: 100%;
}

.hero.show-symbol {
    background-image: url(/icons/symbol_light.svg);
    background-repeat: no-repeat;
    background-position: right -10% center;
}

@media (max-width:1440px) {
    .overlap-True > div {
        top: 10%;
    }
}

@media (max-width:1024px) {
    .min-lg-vh-70 {
        min-height: 33vh;
    }
    
    .overlap-True > div {
        top: 15%;
    }
}

@media (max-width:860px) {
    .hero-bg {
        height: 50vh;
        margin-left:auto;
    }
}

@media (max-width:560px) { 
    .hero-bg {
        height: 35vh;
    }
    
    .hero video {
        height: 35vh;
    }
    
    .hero .ph-5 {
        padding: 0rem !important;
    }
    
    .overlap-True > div {
        top: 0;
    }
    
    .hero > div > div:first-child { 
        order: 2;
    }
    
    .hero > div > div:last-child {
        order: 1;
        margin-top: 2rem;
    }
}

@media (max-width:360px) { 
    .hero a {
        padding: 10px 15px;
    }
}