
[data-ui-role="content"]{
    height:100%
}
.flexbox-fix-video { height:90vh; }
.flexbox-fix{
    display:-ms-flexbox;
    display:flex;
	position:relative;
}

[data-browser='ie'] .main{
    display:block
}
.clickable{
    cursor:pointer
}
@keyframes animated-hero{
    100%{
        transform:translateY(-5%);
        opacity:1
    }
}


body{
    overflow-x:hidden
}

.hero{
    -ms-flex-align:stretch;
    align-items:stretch;
    background-color:transparent;
    background-position:center;
    background-size:cover;
    display:-ms-flexbox;
    display:flex;
    min-height:80vh;
    padding:120px 0 60px;
    position:relative;
    width:100%
}
@media only screen and (min-width: 768px){
    .hero{
        min-height:80vh;
        transition:min-height 0.25s ease
    }
}
.hero__smokescreen{
    position:absolute;
    top:0;
    width:100%;
    height:100%;
    background:#000;
    opacity:.0;
    z-index:0
}
@media only screen and (min-width: 768px){
    .hero{
        padding-top:140px
    }
}
.hero--video{
    position:relative;
    overflow:hidden
}
.hero__container{
    margin-left:auto;
    margin-right:auto;
    width:74.35897%;
    position:relative;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-align:end;
    align-items:flex-end
}
@media only screen and (min-width: 768px){
    .hero__container{
        width:83.05085%
    }
}
@media only screen and (min-width: 1000px){
    .hero__container{
        width:87.34177%
    }
}
@media only screen and (min-width: 1000px){
    .hero__container{
        width:74.68354%
    }
}
.hero__container>.hero-eyebrow{
    left:0;
    position:absolute;
    top:-90px
}
.hero__content{
    width:100%;
    opacity:1;
    visibility:visible
}
.hero__content--offset{
    position:absolute;
    bottom:0;
    z-index:300
}
.hero__content--hidden{
    opacity:0;
    transition:visibility 0.7s, opacity 0.7s ease
}
.hero__video.video-player{
    background-color:#000
}
@media only screen and (max-width: 767px){
    .hero__video.video-player video{
        position:absolute;
        top:50%;
        left:50%;
        min-width:100%;
        min-height:100%;
        width:auto;
        transform:translateX(-50%) translateY(-50%);
        overflow:hidden
    }
}
@media only screen and (min-width: 768px){
    .hero__video.video-player video{
        width:100% !important;
        height:auto !important
    }

    .page-id-12 .hero__video.video-player video { width:100% !important; height:100% !important }
}
.hero__teaser.video-player{
    background-color:#000
}
.hero__teaser.video-player video{
    position:absolute;
    top:50%;
    left:50%;
    min-width:100%;
    min-height:100%;
    width:auto;
    transform:translateX(-50%) translateY(-50%);
    overflow:hidden
}
.hero__title{
    
    font-size:3.75rem;
    letter-spacing:-.23438rem;
    line-height:1.03333;
    color:#fff;
    text-align:left
}
@media only screen and (min-width: 768px){
    .hero__title{
        
        font-size:6.5rem;
        letter-spacing:-.28125rem;
        line-height:.875
    }
}
@media only screen and (min-width: 1000px){
    .hero__title{
        
        font-size:10.625rem;
        letter-spacing:-.625rem;
        line-height:.99412
    }
}
@media only screen and (min-width: 2000px){
    .hero__title{
        
        font-size:13.75rem;
        letter-spacing:-.75rem;
        line-height:.87273
    }
}
.hero__details{
    color:#fff;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-direction:column;
    flex-direction:column;
    margin-top:25px
}
@media only screen and (min-width: 768px){
    .hero__details{
        -ms-flex-direction:row;
        flex-direction:row
    }
}
@media only screen and (min-width: 768px){
    .hero__details .social-icons__label{
        margin-bottom:20px
    }
}
.hero__teaser{
    position:absolute !important;
    top:0
}
.hero__video{
    position:absolute !important;
    top:0
}
.hero-detail{
    display:-ms-flexbox;
    display:flex;
    -ms-flex-direction:column;
    flex-direction:column;
    margin-bottom:30px;
    width:74.35897%
}
@media only screen and (min-width: 768px){
    .hero-detail{
        margin-bottom:0;
        margin-right:5.06329%;
        width:24.05063%
    }
}
@media only screen and (min-width: 1000px){
    .hero-detail{
        width:17.72152%
    }
}
.hero-detail__title{
    
    font-size:1.125rem;
    letter-spacing:-.01562rem;
    line-height:1.44444;
    opacity:0.5
}
@media only screen and (min-width: 768px){
    .hero-detail__title{
        
        font-size:1.25rem;
        letter-spacing:-.01562rem;
        line-height:1.3;
        opacity:0.5
    }
}
@media only screen and (min-width: 1000px){
    .hero-detail__title{
        
        font-size:1.5rem;
        letter-spacing:-.03125rem;
        line-height:1.5;
        opacity:0.5
    }
}
@media only screen and (min-width: 2000px){
    .hero-detail__title{
        
        font-size:1.5rem;
        letter-spacing:-.03125rem;
        line-height:1.5;
        opacity:0.5
    }
}
.hero-detail__content{
    
    font-size:1.125rem;
    letter-spacing:-.01719rem;
    line-height:1.88889
}
@media only screen and (min-width: 768px){
    .hero-detail__content{
        
        font-size:1.125rem;
        letter-spacing:-.01719rem;
        line-height:1.88889
    }
}
@media only screen and (min-width: 1000px){
    .hero-detail__content{
        
        font-size:1.125rem;
        letter-spacing:-.01719rem;
        line-height:1.88889
    }
}
@media only screen and (min-width: 2000px){
    .hero-detail__content{
        
        font-size:1.5rem;
        letter-spacing:-.03125rem;
        line-height:1.5
    }
}
.hero-eyebrow{
    
    font-size:.875rem;
    letter-spacing:-.04063rem;
    line-height:1.42857;
    display:none;
    margin-bottom:125px
}
@media only screen and (min-width: 768px){
    .hero-eyebrow{
        
        font-size:1rem;
        letter-spacing:-.04063rem;
        line-height:1
    }
}
@media only screen and (min-width: 1000px){
    .hero-eyebrow{
        
        font-size:1rem;
        letter-spacing:-.04063rem;
        line-height:1
    }
}
@media only screen and (min-width: 2000px){
    .hero-eyebrow{
        
        font-size:1.25rem;
        letter-spacing:-.04063rem;
        line-height:1
    }
}
@media only screen and (min-width: 768px){
    .hero-eyebrow{
        display:-ms-flexbox;
        display:flex;
        margin-bottom:0;
        width:40.67797%
    }
}
@media only screen and (min-width: 1000px){
    .hero-eyebrow{
        width:36.70886%
    }
}
.hero-eyebrow__separator{
    background-color:#fff;
    height:1px;
    margin:7px 15px
}
@media only screen and (min-width: 768px){
    .hero-eyebrow__separator{
        width:37.5%
    }
}
@media only screen and (min-width: 1000px){
    .hero-eyebrow__separator{
        width:31.03448%
    }
}
.hero-eyebrow__link{
    color:#fff
}

.video-play-button{
    display:-ms-flexbox;
    display:flex;
    -ms-flex-pack:center;
    justify-content:center;
    left:0;
    margin:0 auto;
    opacity:1;
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%);
    transition:visibility 0.7s, opacity 0.7s ease;
    visibility:visible;
    width:100%;
    z-index:1
}
.video-play-button--hidden{
    opacity:0;
    visibility:hidden
}
.video-play-button__button{
    background:none;
    border:none;
    box-shadow:none;
    cursor:pointer;
    display:block;
    outline:none;
    padding:0
}
.video-play-button__button__background{ width:120px; height:90px; border-radius:10px; box-shadow:0 0 0 0; border:0; background:#fec42f; text-shadow:0; margin:0 auto; display:block; }
@media only screen and (max-width: 767px){
   /* .video-play-button__button__background{
        width:60px;
        height:60px
    }*/
}
.video-play-button__play{
   	width: 0; height: 0; border-left: 30px solid black; border-top: 21px solid transparent; border-bottom: 21px solid transparent; 
    left:50%;
    position:absolute;
    top:50%;
    transform:translate(-50%, -50%);
}
.video-play-text{
    font-size:2.5rem;
    letter-spacing:-.15rem;
    line-height:1.1;
    background:transparent;
    border:0;
    color:#fff;
    cursor:pointer;
    display:block;
    margin:15px 0 0 0;
    opacity:0.7;
    padding:0
}
@media only screen and (min-width: 768px){
    .video-play-text{
        
        font-size:4.5rem;
        letter-spacing:-.3125rem;
        line-height:1.04167
    }
}
@media only screen and (min-width: 1000px){
    .video-play-text{
        
        font-size:5rem;
        letter-spacing:-.3125rem;
        line-height:1.05
    }
}
@media only screen and (min-width: 2000px){
    .video-play-text{
        
        font-size:8.4375rem;
        letter-spacing:-.46875rem;
        line-height:1.03704
    }
}
.video-play-text--hidden{
    display:none
}
@media only screen and (min-width: 768px){
    .video-play-text{
        margin:30px 0 0 0
    }
}
.scrubber{
    z-index:1;
    width:100%;
    max-height:2px
}
.scrubber-wrap{
    position:relative
}
.scrubber-wrap:before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:2px;
    cursor:pointer;
    box-shadow:none;
    border:none;
    margin:0;
    padding:0;
    background-color:rgba(255,255,255,0.2);
    background-color:#999
}
.scrubber-wrap .playback-progress-bar,.scrubber-wrap .load-progress-bar{
    width:100%;
    height:2px;
    cursor:pointer;
    box-shadow:none;
    border:none;
    margin:0;
    padding:0;
    background-color:rgba(255,255,255,0.2);
    position:absolute;
    top:0;
    left:0;
    z-index:0
}
.scrubber-wrap .playback-progress-bar{
    background-color:#fff
}
.scrubber-wrap--thin:before,.scrubber-wrap--thin .playback-progress-bar,.scrubber-wrap--thin .load-progress-bar{
    max-height:1px
}
.scrubber-wrap--thin .load-progress-bar{
    background-color:#fff
}
[type=range].scrubber{
    -webkit-appearance:none;
    width:100%;
    background-color:transparent;
    margin:0;
    padding:0
}
[type=range].scrubber:focus{
    outline:none
}
[type=range].scrubber::-webkit-slider-runnable-track{
    width:100%;
    height:2px;
    cursor:pointer;
    box-shadow:none;
    border:none;
    margin:0;
    padding:0;
    background-color:rgba(255,255,255,0.2);
    background-color:transparent;
    border:none
}
[type=range].scrubber::-webkit-slider-thumb{
    background-color:transparent;
    height:2px;
    width:2px;
    margin:0;
    border:none;
    box-shadow:none;
    -webkit-appearance:none;
    margin-top:0
}
.scrubber-wrap--thin [type=range].scrubber::-webkit-slider-thumb{
    background-color:transparent
}
[type=range].scrubber:focus::-webkit-slider-runnable-track{
    background-color:transparent
}
[type=range].scrubber::-moz-range-track{
    width:100%;
    height:2px;
    cursor:pointer;
    box-shadow:none;
    border:none;
    margin:0;
    padding:0;
    background-color:rgba(255,255,255,0.2);
    background-color:transparent
}
.scrubber-wrap--thin [type=range].scrubber::-moz-range-track{
    height:1px
}
[type=range].scrubber::-moz-range-thumb{
    background-color:transparent;
    height:2px;
    width:2px;
    margin:0;
    border:none;
    box-shadow:none;
    border-radius:0
}
.scrubber-wrap--thin [type=range].scrubber::-moz-range-thumb{
    background-color:transparent
}
[type=range].scrubber::-ms-track{
    width:100%;
    cursor:pointer;
    background:transparent;
    border-color:transparent;
    color:transparent
}
[type=range].scrubber::-ms-fill-lower{
    background:transparent;
    border-color:transparent;
    color:transparent
}
[type=range].scrubber::-ms-thumb{
    background-color:transparent;
    height:2px;
    width:2px;
    margin:0;
    border:none;
    box-shadow:none
}
.scrubber-wrap--thin [type=range].scrubber::-ms-thumb{
    background-color:transparent
}
[type=range].scrubber::-ms-tooltip{
    display:none
}
.video-controls{
    -ms-flex-align:center;
    align-items:center;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-direction:row;
    flex-direction:row;
    padding:20px 22px 20px 30px;
    transition:opacity .5s;
    width:100%
}
.video-controls:before{
    background:linear-gradient(to bottom, transparent 0%, rgba(0,0,0,0.3) 100%);
    bottom:0;
    content:"";
    display:block;
    height:180px;
    left:0;
    pointer-events:none;
    position:absolute;
    right:0
}
@media only screen and (max-width: 767px){
    .video-controls{
        display:none
    }
}
@media only screen and (min-width: 1000px){
    .video-controls--inactive{
        opacity:0
    }
}
.video-controls .duration,.video-controls .current-time{
    display:-ms-inline-flexbox;
    display:inline-flex
}
.video-controls .time-code{
    transform:translate3d(0, 0, 0);
    white-space:nowrap;
    width:200px
}
.video-controls .scrubber-wrap{
    display:-ms-inline-flexbox;
    display:inline-flex;
    -ms-flex-preferred-size:100%;
    flex-basis:100%
}
.video-controls__btn{
    background-color:transparent;
    border:none;
    cursor:pointer;
    -ms-flex:0 0 auto;
    flex:0 0 auto;
    padding:0;
    position:relative;
    text-align:left
}
.video-controls__btn--play{
    width:35px;
    text-align:center
}
.video-controls__btn--audio{
    margin-left:22px;
    width:28px
}
.video-controls__btn--fullscreen{
    margin-left:26px
}
.video-controls__btn--close{
    margin-left:30px
}
.hero__teaser{
    z-index:100;
    width:100%;
    height:100%;
    display:block;
    visibility:visible;
    opacity:1;
    transition:visibility 0.7s, opacity 0.7s ease
}
.hero__teaser .hero-video-loop{
    position:absolute;
    min-width:100%;
    min-height:100%;
    width:auto;
    height:auto;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%)
}
.hidden-delay{
    visibility:hidden;
    opacity:0;
    transition:visibility 0.7s, opacity 0.7s ease;
    transition-delay:.25s
}
.hidden{
    visibility:hidden;
    opacity:0;
    transition:opacity .7s ease
}
.teaser-play-button{
    display:-ms-flexbox;
    display:flex;
    z-index:500
}
video::-webkit-media-controls-start-playback-button{
    display:none !important;
    -webkit-appearance:none
}
.hero__video_img{
    background-position:50% 50%;
    background-size:cover;
    height:100%;
    position:absolute;
    top:0;
    width:100%;
    z-index:100
}
@media only screen and (min-width: 768px){
    .hero__video_img{
        display:block;
        visibility:visible;
        opacity:1;
        transition:visibility 0.7s, opacity 0.7s ease
    }
}
.hero__video_img .hero-video-loop{
    position:absolute;
    min-width:100%;
    min-height:100%;
    width:auto;
    height:auto;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%)
}
.hidden-delay{
    visibility:hidden;
    opacity:0;
    transition:visibility 0.7s, opacity 0.7s ease;
    transition-delay:.25s
}
.hidden{
    visibility:hidden;
    opacity:0;
    transition:opacity .7s ease
}
.video-player{
    background-color:#333;
    height:100%;
    position:relative;
    transition:opacity 0.5s cubic-bezier(0.25, 0.1, 0.25, 1);
    width:100%;
    z-index:1
}
.video-player:before{
    pointer-events:none;
    transition:opacity 0.3s;
    background-color:#000;
    content:'';
    opacity:0;
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    z-index:1
}
.video-player--cover{
    height:auto;
    left:50%;
    min-height:100%;
    min-width:100%;
    overflow:hidden;
    position:absolute;
    top:50%;
    transform:translate(-50%, -50%);
    width:auto
}
.video-player--hidden{
    opacity:0;
    transition:opacity 0.3s cubic-bezier(0.25, 0.1, 0.25, 1),visibility 0s 0.3s;
    visibility:hidden
}
.video-player--dimmed:before{
    background-color:#000;
    content:'';
    opacity:.32;
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    z-index:1
}
.video-player--aspect-ratio-4-3{
    height:100.1%;
    left:50%;
    position:absolute;
    top:50%;
    transform:translateX(-50%) translateY(-50%);
    width:auto
}
@media only screen and (min-aspect-ratio: 4 / 3){
    .video-player--aspect-ratio-4-3{
        height:auto;
        width:100.1%
    }
}
.video-player__controls{
    bottom:0;
    left:0;
    position:absolute;
    right:0;
    transition:transform 0.35s cubic-bezier(0.25, 0.1, 0.25, 1);
    z-index:2
}
.video-player__controls--hidden{
    transform:translateY(100%)
}
.video-player__video{
    display:block;
    height:100%;
    width:100%
}
.video-player__video::-webkit-media-controls-start-playback-button{
    display:none !important;
    -webkit-appearance:none
}
.video-player__loader{
    left:50%;
    pointer-events:none;
    position:absolute;
    top:50%;
    transform:translateX(-50%) translateY(-50%);
    z-index:1
}
.video-player .time-code{
    color:#FFF;
    
    font-size:12px;
    text-align:center
}
.video-player .time-code--dark{
    color:#ccc
}
.video-player .current-time:after{
    content:'/';
    padding:0 0.25rem
}
.video-player__copy{
    margin-left:12.82051%;
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:2;
    width:74.35897%
}
@media only screen and (min-width: 768px){
    .video-player__copy{
        margin-left:8.47458%;
        width:66.10169%
    }
}
@media only screen and (min-width: 1000px){
    .video-player__copy{
        margin-left:12.65823%;
        width:62.02532%
    }
}
.video-player__copy--hidden{
    display:none
}
.video-player__description{
    
    font-size:1.875rem;
    letter-spacing:-.0625rem;
    line-height:1.4;
    color:#fff
}
@media only screen and (min-width: 768px){
    .video-player__description{
        
        font-size:2.625rem;
        letter-spacing:-.0625rem;
        line-height:1.28571
    }
}
@media only screen and (min-width: 1000px){
    .video-player__description{
        
        font-size:3.5rem;
        letter-spacing:-.25rem;
        line-height:1.25
    }
}
@media only screen and (min-width: 2000px){
    .video-player__description{
        
        font-size:4.625rem;
        letter-spacing:-.1875rem;
        line-height:1.21622
    }
}

 