section.vid{height: 3000px;}
section.vid video{width: 100%;}
section.vid div.holder{position: sticky; top: 0;}


#hero{
/*background: url(../images/hero-bg.jpg);
background-size: cover;
background-position: center center;
background-repeat: no-repeat;*/
background: rgb(24,86,93);
background: linear-gradient(191deg, rgba(24,86,93,1) 0%, rgba(17,50,72,1) 100%);
text-align: left;
padding: 80px 0 20px;
margin: 0 auto;
overflow: hidden;

}


#hero .text {
text-align: left;
color: #fff;
width: 50%;
display: inline-block;
vertical-align: middle;
position: relative;
z-index: 2;
max-width: 700px;
}
#hero .phone{width: 48%;display: inline-block; vertical-align: middle; position: relative; z-index: 999;
}
#hero .phone img{width: 80%;-webkit-filter: drop-shadow(50px 80px 80px rgba(0,0,0,.3));
    filter: drop-shadow(50px 80px 80px rgba(0,0,0,.3))}

#hero h1 {
color: #fff;
margin-bottom: 30px;
font-size: 70px;
font-weight: 600;
}

#hero h2 {
color: #fff;
margin-bottom: 40px;
font-size: 28px;
text-align: left;
font-weight: normal;

}

#hero a img{height: 50px; margin-right: 15px;}

#hero .videoWrapper{width: auto; max-height: 800px;position: absolute; top: 10%; left: 36%; transform: translate3d(0,0,0); mix-blend-mode: screen;transform: translate3d(0,0,0); z-index: 1;  }

#hero video{width: 100%;

}


.as_seen{display: block; margin: 0px 0 40px 0; width: 400px;}

.university{background: white; color: var(--primary); text-align: center;}
.university .container{padding-bottom: 100px; max-width: 1200px;}
.university img{ width: 160px;display: inline-block;  vertical-align: middle; margin: 0 2%; }


@media (max-width: 1792px) {

    #hero .container{padding: 0px 180px;}

    #hero h1{font-size: 60px; margin-top: 0;}
    #hero h2{font-size: 20px;}
    #hero .videoWrapper{ width: 500px; left: 49%;  }
}

@media (max-width: 1400px) {
    #hero h1{font-size: 60px;}
    #hero h2{font-size: 20px;}
    #hero .videoWrapper{ width: 500px; left: 48%;  }
    #hero .container{padding: 50px 50px;}

}

@media (max-width: 960px) {
#hero{
background-size: 100%;
background-position: bottom center;
background-repeat: no-repeat;
text-align: left;
padding: 20px 0 0px;
max-width: none;
margin: 0 auto;
overflow: hidden;
}
#hero .container{padding: 80px 30px 0 30px;}

#hero .text{width: 100%;}
#hero h1{font-size: 44px;}
#hero h2{font-size: 20px;}

#hero .videoWrapper{ width: 80%; left: 10%; overflow: hidden; }

#hero .phone{width: 90%;display: block; vertical-align: middle; margin-left: 0%;}
#hero .phone img{width: 110%;}

.as_seen{width: 70%;}
.university img{ margin: 10px 30px; width: 140px;}

}

@media (max-width: 640px) {
    .university img{ margin: 20px 40px; }
    
    }
    
 @media (max-width: 540px) {
        .university img{ margin: 20px ; width: 120px; }
        
        }
        


@media (max-width: 430px) {
#hero{background-size: 490px;
padding: 20px 0 20px;}
#hero .text{width: 100%;}
#hero h1{font-size: 36px;}
#hero h2{font-size: 16px;}
.as_seen{width: 100%;}
.university .container {padding: 50px 10px 90px;}
.university h1{margin-bottom: 40px;}
.university img{ margin: 10px;}

}

@media (max-width: 768px) {

}

@media (max-width: 640px) {

}

@media (max-width: 560px) {
}

@media (max-width: 390px) {

}
