.banner-video{
    background-image: url(/images/bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 460px;


}

.banner-content{
    padding: 40px 40px 20px 40px;
    background-color: rgba(0,0,0,0.65);
    position: absolute; top:0; left: 0; bottom: 0; right: 0; margin: auto;
    display: -webkit-flex;	display: flex;
    -webkit-justify-content:center;  justify-content:center;
    -webkit-align-items:center; align-items:center;
    -webkit-flex-direction:column; flex-direction:column;
}

.banner-video video{ display: none}

.banner-content h1{  text-align: center; color: #fff; font-size: 22px; text-transform: uppercase; line-height: 1.4em;
    margin-bottom: 20px; padding-bottom: 20px; display: block; position: relative }
/*
.banner-content h1:after{ content: ""; display: block; position: absolute; height: 1px; width: 50%; max-width: 200px;
    bottom: 0; left: 0; right: 0; margin: auto; background: #fff;  background: linear-gradient(259.45deg, #CAB57F 21.61%, #F4DFA4 50.2%, #CBB580 80%), linear-gradient(259.45deg, #CAB57F 21.61%, #F4DFA4 50.2%, #CBB580 80%); opacity: 0.4}
    
 */
.banner-content p{  text-align: center; color: #fff; font-size: 16px; text-transform: uppercase;
    line-height: 1.6em; font-weight: 300; text-shadow: 1px 1px 3px #000;
     }
.banner-content .button-wrap{ padding: 40px 0;}
.banner-content .button{ width: 250px; letter-spacing: normal;   }


@media only screen and (min-width: 480px) {


}

@media only screen and (min-width: 768px) {
    .banner-content{ background-color: rgba(0,0,0,0.55);}

    .banner-content video{ display: block;  opacity: 0; -webkit-transition: all 0.3s ease; transition: all 0.3s ease;}
    .banner-content video.playing{opacity: 1;}

    .banner-video{ height: 460px; position: relative; overflow: hidden;  background-image: url(/images/bg-desctop.jpg);}

    .banner-video video{ display: block; min-width: 100%; min-height: 100%;
        position: absolute; top:50%; left: 50%; transform: translate(-50%, -50%);
    }
    .banner-content h1{ font-size: 28px;}
    .banner-content p{ font-size: 18px;}


}

@media only screen and (min-width: 1024px) {
    .banner-video{ height: 500px;}
    .banner-content h1{ font-size: 36px;}
    .banner-content p{ font-size: 22px;}
}

@media only screen and (min-width: 1300px) {
    .banner-video{ height: 650px;}
}