.blue {
    color:#39b5fb;
}

/* ==============================
HERO
============================== */

#pdp #panel-hero {
    background-size:cover;
    margin-top:0;
    min-height:600px;
    overflow:hidden;
    position:relative;
    width:100%;
    transform:translateZ(0);
    -webkit-transform:translateZ(0);padding:0;
    z-index:1;
}

#pdp #panel-hero video {
    display:block;
    left: 50%;
    min-height: 100%;
    position:absolute;
    top: 50%;
    transform:translate(-50%,-50%);
    z-index:0;
}


#pdp #panel-hero .hero-content-container {
    background:rgba(0,0,0,.6);
    display:table;
    min-height:800px;
    position:relative;
    width:100%;
}

#pdp #panel-hero .wrapper {
    display:table-cell;
    min-height:0;
    position:relative;
    vertical-align:middle;
    z-index:1;
}

#pdp #panel-hero h1 {
    font-size:5em;
    text-shadow:0 1px 10px rgba(0,0,0,.5);
}

@keyframes hero-animation{
    0%{
        top:-100;
    }

    100%{
        top:0%;
    }
}

#pdp #panel-hero.panel-template p {
	font-weight:400;
    letter-spacing:0.5em;
    margin:2em 0;
	text-shadow:0 1px 10px rgba(0,0,0,.5);
}

#pdp #panel-hero .cta:link,
#pdp #panel-hero .cta:visited {
    background-color:#fecb00;
    color:#000;
}

#pdp #panel-hero .cta:hover,
#pdp #panel-hero .cta:active {
    background-color:#f6dc73;
}





@media only screen and (max-width:992px) {
    #pdp .wide-460 .col-third h1{
        font-size:1.8em !important;
    }

    #pdp #panel-hero h1{
        font-size: 5em !important;
    }

}


@media only screen and (max-width:768px) {

    /* ==============================
    HERO
    ============================== */

    #pdp #panel-hero{
    }

    #pdp #panel-hero.panel-template .wrapper {
        background:rgba(0,0,0,.4);
    }

    #pdp #panel-hero video {
        display:none !important;
    }

    #pdp #panel-hero h1{
        font-size:5em !important;
    }

    #pdp #panel-hero p{
        font-size:1.5em;
    }

    #pdp #panel-hero .product-container{
        height:auto;
        width:100%;
    }

    #pdp #panel-hero .product-container .relative-container{
        height:auto;
    }

    #pdp #panel-hero .background {
        display:block;
    }

    #pdp #panel-hero .background img{
        height:auto;
        width:100%;
    }
}


@media only screen and (max-width:570px) {

    /* ==============================
    HERO
    ============================== */

    #pdp #panel-hero.panel-template .wrapper {
        padding:2vw 0;
    }

    #pdp #panel-hero h1{
        font-size:4em !important;
        margin:0 auto;
        width:calc(100% - 20px);
    }

    #pdp #panel-hero p{
        font-size:1.5em;
        margin:2em auto;
        width:calc(100% - 20px);
    }



}

@media only screen and (max-width: 479px) {
    #pdp #panel-hero {
        min-height:140vw;
    }
}