@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300i,400,600');
span.demofont {
    font-family: 'Source Sans Pro', sans-serif;
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
    display: block;
}

table,
th,
td {
    border: none
}

table {
    border-collapse: separate;
    border-spacing: 0;
    border-width: 1px 0 0 1px;
    margin: 0 0 1.6em;
    table-layout: fixed;
    width: 100%;
}

.nowrap{
    white-space: nowrap;
}

caption,
th,
td {
    font-weight: normal;
    text-align: left;
}

th {
    border-width: 0 1px 1px 0;
    font-weight: 700;
}

td {
    border-width: 0 1px 1px 0;
}

th,
td {
    padding: 0.4em;
}

th {
    font-size: 24px;
    letter-spacing: 1px;
    line-height: 28px;
}

* {
    margin: 0;
    padding: 0;
    border: none;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    line-height: normal
}

input {
    border: 0;
    outline: none
}

img {
    border: none;
    outline: none;
    max-width: 100%;
    height: auto
}

ul,
ul li {
    list-style: none;
}

ol,
ol li {
    list-style: decimal;
}

input[type="submit"],
input[type="button"] {
    cursor: pointer
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0
}

.clearfix {
    display: inline-block
}

.clear {
    display: block;
    width: 100%;
    height: 1px;
    background: none;
    clear: both;
}

.block-link{display: block;}

* html .clearfix {
    height: 1%;
}

.clearfix {
    display: block
}

textarea,
input[type="text"],
input[type="button"],
input[type="submit"] {
    -webkit-appearance: none;
    border-radius: 0;
    resize: none;
    max-width: 100%;
}

p,
span,
a,
small,
blockquote,
ul,
li {
    line-height: normal;
}

figure {
    max-width: 100%;
    position: relative;
}

blockquote,
q {
    quotes: """";
    font-size: 26px;
    font-style: italic;
    line-height: 1;
    color: #000;
    font-family: Arial, Helvetica, sans-serif;
    padding: 20px 0;
}

a {
    text-decoration: none;
    color: inherit;
    outline: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    line-height: normal;
    color: #151515;
    padding-bottom: 0;
}

h1 {
    font-size: 34px;
    line-height: 36px;
}

h2 {
    font-size: 30px;
    line-height: 32px;
}

h3 {
    font-size: 24px;
    line-height: 28px;
}

h4 {
    font-size: 20px;
    line-height: 24px;
}

h5 {
    font-size: 18px;
    line-height: 20px;
}

h6 {
    font-size: 16px;
    line-height: 18px;
}

hr {
    background-color: #ccc;
    border: 0;
    height: 1px;
    margin-bottom: 1.625em;
}

p {
    margin-bottom: 0;
}

dl {
    margin: 0 1.625em;
}

dt {
    font-weight: bold;
}

dd {
    margin-bottom: 1.625em;
}

strong {
    font-weight: bold;
}

cite,
em,
i {
    font-style: italic;
}

sup,
sub {
    font-size: 70%;
    height: 0;
    line-height: 1;
    position: relative;
    vertical-align: baseline;
}

sup {
    bottom: 1ex;
}

sub {
    top: .5ex;
}

blockquote {
    font-style: italic;
    font-weight: normal;
    margin: 0 1em;
}

blockquote em,
blockquote i,
blockquote cite {
    font-style: normal;
}

blockquote cite {
    color: #666;
    font: 12px "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 300;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

blockquote:before,
blockquote:after,
q:before,
q:after { content: ""; }

blockquote,
q { quotes: """"; }

a img { border: 0; }

pre {
    background: #f4f4f4;
    font: 13px "Courier 10 Pitch", Courier, monospace;
    line-height: 1.5;
    margin-bottom: 1.625em;
    overflow: auto;
    padding: 0.75em 1.625em;
}

sup,
sub {
    font-size: 70%;
    height: 0;
    line-height: 1;
    position: relative;
    vertical-align: baseline;
}
sup { bottom: 1ex; }
sub { top: .5ex; }

a { text-decoration: none; transition: all .15s ease-in-out 0s; }

a:focus,
a:active,
a:hover { text-decoration: none; }

:focus { outline: 0; }

table { border-collapse: separate; border-spacing: 0; }

caption,
th,
td { font-weight: normal; text-align: left; vertical-align: top; }

th,
td { color: #000; font-size: 16px; line-height: 19px; text-align: left; }

table img { margin: 0 !important; width: 100%; }

html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; height: 100%; }

body { font-size: 14px; color: #000; font-family: 'Source Sans Pro', sans-serif; font-weight: 400; background: #151515; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; height: 100%; overflow-x: hidden; -webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: auto; }
body.popup_view { overflow: hidden; }
body > img{ position:absolute; left:0; bottom:0; z-index:-1;}



.mob-show { display: none !important; }


/* layout */
#layout { display:block; width: 100%; position: relative; z-index:9; background:#fff; }
#layout img{ vertical-align:top; }
#layout sup { font-size: 70% !important; height: 0; line-height: 1; position: relative; vertical-align: baseline; bottom: 1ex; display:inline-block; }

.wrapper { width: 100%; max-width: 1310px; padding: 0 15px; margin: 0 auto; position: relative; }


.head-wrap { /*float: left;*/ display:block; overflow:hidden; width: 100%; position: relative; padding-bottom:55px; z-index:999999; }

.ad_container { min-height: 110px; float: left; width: 100%; }
.head-wrap .ad_container{ background:#fff; }
.ad_container .ad { display: block; width: 100%; text-align: center; max-width: 100%; margin: 10px auto 10px; max-height: 90px; max-width:728px; background:#ccc; }
.ad_container .ad img { vertical-align: top; }

/*header { float: left; width: 100%; background: #000; text-align: center; position:absolute; z-index:999999; left:0; bottom:0; }*/
header { float: left; width: 100%; background: #000; text-align: center; position:absolute; z-index:999999; left:0; bottom:0; }
header.show { position: fixed; top:0; bottom: auto; }

/*********Header Css*********/
header .header_inner{float:left; width:100%; padding:0 20px 0 30px; border-top:4px solid #bce2f1; position:relative; min-height:55px; z-index:99;}

header ul.left_logos { float: left; padding: 8px 0 0 0; font-size:0; }
header ul.left_logos li { display: inline-block; vertical-align: middle; }
header ul.left_logos li a { display: block; vertical-align: top; }
header ul.left_logos li a img { vertical-align: top; }
header ul.left_logos li.fiberone_logo { background: url(../images/plus-icon.png) no-repeat right center; padding: 0 23px 0 0; background-size: 11px; }
header ul.left_logos li.fiberone_logo a { width: 36px; }
header ul.left_logos li.ew_logo { padding: 0 0 0 10px; }
header ul.left_logos li.ew_logo a { width: 156px; }


header a.paid_logo{ display:inline-block;width:auto;  margin:0 auto;vertical-align:top; color:#000; text-transform:uppercase; font-family: 'Source Sans Pro', sans-serif; font-size:13px; line-height: 18px; font-weight:600; background:#bce2f1; padding:0 10px 3px 10px; position:absolute; top:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%);}
a.paid_logo i{ padding:0 0 0 5px; font-size:13px; }
header .show_text { float:left; width:100%; font-family: 'Source Sans Pro', sans-serif; font-size:11px; font-weight:600; color:#151515; text-transform:uppercase; text-align:center; background:#fff; padding:8px 20px; margin:0; position:relative; display:none; line-height:14px}
header .show_text a { color: #003865; }
header .show_text span.close{ position:absolute; right:2px; top:10px; width:20px; height:20px; cursor:pointer;}
header .show_text span.close:before, header .show_text span.close:after { position:absolute; left:10px; content:""; height:13px; width:1px; background-color:#151515; }
header .show_text span.close:before { transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); }
header .show_text span.close:after { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); }

header ul.social_icon { list-style: none; float: right; width: auto; margin-top: 11px; }
header ul.social_icon li { list-style: none; display: inline-block; float: left; margin-left: 10px; }
header ul.social_icon li:first-child { margin-left: 0; }
header ul.social_icon li a { display: block; width: 30px; height: 30px; border-radius: 50%; border: 2px solid #fff; opacity: 1; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; }
header ul.social_icon li a i { font-size: 15px; line-height: 27px; color: #fff; display: inline-block; }
header ul.social_icon li a:hover { opacity: 0.7; }


/****Top Banner*************************/
.banner{ display:block; width:100%; position:relative; background-size:cover !important; height:calc(100vh - 55px); /*overflow:hidden;*/ }
/*.banner:after{ content:""; position:absolute; width:100%; height:100%; left:0; top:0; background:rgba(0,0,0,0); z-index:99;  }*/
.home .banner{ display:block; width:calc(100% - 20px); height:auto; max-width:1025px; margin:40px auto 0; }
.banner img{ vertical-align:top; }
.banner > img{ display:none; }


.banner video::-webkit-media-controls{display:none !important;-webkit-appearance:none;}
.banner video::-webkit-media-controls-panel{display:none!important;-webkit-appearance:none;}
.banner video::--webkit-media-controls-play-button{display:none!important;-webkit-appearance:none;}
.banner video::-webkit-media-controls-start-playback-button{display:none!important;-webkit-appearance:none;}

.banner .audio_btn{ position:absolute; right:24px; top:16px; width:98px; font-size:0;  z-index:9999; }
.banner .audio_btn li{ display:inline-block; vertical-align:top; width:50%; }
.banner .audio_btn li a{ display:block; min-height:42px; border-color:#fff; border-style:solid; }
.banner .audio_btn li a.sound_on{ background:rgba(0,0,0,0) url(../images/sound-on.png) no-repeat center center; background-size:16px auto !important; border-radius: 20px 0px 0px 20px; border-width:1px 0 1px 1px; }
.banner .audio_btn li a.sound_on.active{ background:rgba(255,255,255,1) url(../images/sound-on-active.png) no-repeat center center; background-size:16px auto !important; }

.banner .audio_btn li a.sound_off{ background:rgba(0,0,0,0) url(../images/sound-off.png) no-repeat center center; background-size:24px auto !important; border-radius: 0px 20px 20px 0px; border-width:1px 1px 1px 0; }
.banner .audio_btn li a.sound_off.active{ background:rgba(255,255,255,1) url(../images/sound-off-active.png) no-repeat center center; background-size:24px auto !important; }

.banner .bookmark_icon{ display:block; position:absolute; width:217px; right:16px; bottom:13px; z-index:9999; font-size:0; }
.banner .bookmark_icon img{display:inline-block; vertical-align:top; width:100%; max-width:100%; }

.banner .bookmark_cont{ display:block; position:absolute; left:0; top:0; width:100%; height:100%; z-index:9999; background: rgba(255, 255, 255, 0.5); backdrop-filter: blur(17px); }
.banner .bookmark_cont .bookmark_inner{ display:flex; flex-wrap:wrap; align-items:center; position:absolute; width:100%; top:50%; left:50%; max-width:1043px; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); }
.banner .bookmark_cont .bookmark_inner .bookmark_img{ width:240px;}
.banner .bookmark_cont .bookmark_inner .bookmark_img figure{ width:100%; min-height:240px; border-radius:50%; background-size:100% auto !important; overflow:hidden; }
.banner .bookmark_cont .bookmark_inner .bookmark_text{ width:calc(100% - 240px); padding:0 0 0 40px; text-align:left; }
.banner .bookmark_cont h2{ font-family: 'OriginalSans-Four'; font-size:80px; line-height:84px; color:#fff; text-transform:uppercase; padding:0 0 18px; }
.banner .bookmark_cont p{ font-family: 'CaslonDoric-Regular'; font-size:25px; line-height:35px; color:#000; }


@-moz-keyframes scrollMore {
0%{ -moz-transform:translateY(-4px); opacity:1; }
20%{ -moz-transform:translateY(3px); }
40%{ -moz-transform:translateY(-4px); }
60%{ -moz-transform:translateY(3px); }
100%{ -moz-transform:translateY(-4px);opacity:1; }
}
@-webkit-keyframes scrollMore{
0%{ -webkit-transform:translateY(-4px); opacity:1; }
20%{ -webkit-transform:translateY(3px); }
40%{ -webkit-transform:translateY(-4px); }
60%{ -webkit-transform:translateY(3px); }
100%{ -webkit-transform:translateY(-4px);opacity:1; }
}
@keyframes scrollMore{
0%{ transform:translateY(-4px); opacity:1; }
20%{ transform:translateY(3px); }
40%{ transform:translateY(-4px); }
60%{ transform:translateY(3px); }
100%{ transform:translateY(-4px);opacity:1; }
}
.banner .scroll_bottom{ display: block; position: absolute; width: 76px; left: 50%; bottom: -35px; font-size: 0; margin: 0 0 0 -38px; z-index: 9999; }
.banner .scroll_bottom img{ -webkit-animation: scrollMore 1.2s linear infinite; animation: scrollMore 1.2s linear infinite; -moz-animation: scrollMore 1.2s linear infinite;
 -webkit-animation-delay:1s;-moz-animation-delay:1s;-o-animation-delay:1s;animation-delay:1s; }

.banner .jumpstart-poster{ display:none !important; }

.timestamp{ display:block; width:70px; position:absolute; right:0; bottom:0; background:#000; font-family: 'Gotham-Bold'; font-size: 16px; line-height: 21px; text-align: center; color: #FFFFFF; padding:5px 0; }

/****Top Banner*************************/


.intro_sec{ display:block; width:100%; max-width:960px; margin:0 auto; padding:0 30px; text-align:center; position:relative; }
.intro_sec .desc_sec{ width:100%; padding:77px 0 98px; text-align:center; }
.intro_sec .desc_sec p:last-of-type{ padding:0; }

.intro_sec h1{ font-family: 'OriginalSans-Four'; font-size:55px; line-height:66px; color:#000; padding:0 0 32px; }
.intro_sec p{ font-family: 'CaslonDoric-Regular'; font-size:20px; line-height:35px; color:#000; padding:0 0 34px; text-align:left;}
.intro_sec p strong{ font-weight:normal; font-family: 'CaslonDoric-Bold'; font-size:inherit; line-height:inherit; }
.intro_sec p a{ color:inherit; text-decoration:underline; }
.intro_sec p a:hover{ text-decoration:none; }
.intro_sec ul.the_logos { padding: 40px 0 48px 0; font-size:0; }
.intro_sec ul.the_logos li { display: inline-block; vertical-align: middle; }
.intro_sec ul.the_logos li a { display: block; vertical-align: top; }
.intro_sec ul.the_logos li a img { vertical-align: top; }
.intro_sec ul.the_logos li.fiberone_logo { background: url(../images/plus-icon-dark.png) no-repeat right center; padding: 0 33px 0 0; background-size: 13px; }
.intro_sec ul.the_logos li.fiberone_logo a { width: 52px; }
.intro_sec ul.the_logos li.ew_logo { padding: 0 0 0 20px; }
.intro_sec ul.the_logos li.ew_logo a { width: 207px; }


.card_sec{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start; width:100%; /*max-width:1056px;*/ max-width:1408px; margin:0 auto; }
.card_sec img{ vertical-align:top; }
.card_sec .card{ /*width:calc(33.33% - 32px);*/ width:calc(25% - 32px); padding:0 0 0; position:relative; margin:0 16px 29px; }
.card_sec .card.inactive{ display:none; }
.card_sec .card figure{ display:block; width:100%; min-height:213px; background-size:cover !important; position:relative; }
.card_sec .card figure:after{ content:""; position:absolute; width:48px; height:48px; background: url(../images/play-icon.png) no-repeat center center; background-size:48px auto !important; left:50%; top:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); }
.card_sec .card .card_cont{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; width:100%; background:#e33d30; min-height:87px; padding:10px 16px; text-align:center; }
.card_sec .card .card_cont p{ font-family: 'Gotham-Bold'; font-size:20px; line-height:21px; color:#fff; }
.card_sec .card a{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:999; font-size:0; }

.card_sec .card .tip_cont{ display:block; width:100%; text-align:left; box-shadow:5px 10px 20px rgba(0, 0, 0, 0.22); padding:14px 15px 20px 15px; }
.card_sec .card .tip_cont.tip_cont1{ min-height:456px; }
.card_sec .card .tip_cont.tip_cont2{ min-height:360px; }
.card_sec .card .tip_cont.tip_cont3{ min-height:331px; }
.card_sec .card .tip_cont.tip_cont4{ min-height:360px; }
.card_sec .card .tip_cont.tip_cont5{ min-height:459px; }





.card_sec .card .tip_cont h2{ font-family: 'OriginalSans-Four'; font-size:25px; line-height:35px; color:#000; position:relative; padding:0 0 15px;  margin:0 0 12px; }
.card_sec .card .tip_cont h2:after{ content:""; position:absolute; width:76px; min-height:2px; background:#000; left:0; bottom:0; }
.card_sec .card .tip_cont p{ font-family: 'CaslonDoric-Regular'; font-size:18px; line-height:32px; color:#000;  }
.card_sec .card .tip_cont p em{ font-style:normal; font-family: 'CaslonDoric-RegularItalic'; margin:0; padding:0; font-size:inherit; line-height:inherit; }

.card_sec .card .img_cont{ display:block; width:100%;  min-height:500px; background-size:cover !important; }

.card_sec .card .ad_cont{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; width:100%;  min-height:300px; background:#e33d30; position:relative; }
.card_sec .card .ad_cont:before{ content:""; position:absolute; left:0; top:0; width:212px; height:71px; background: url(../images/stamp-left.png) no-repeat center top; background-size:212px auto !important; }
.card_sec .card .ad_cont:after{ content:""; position:absolute; right:0; bottom:0; width:229px; height:65px; background: url(../images/stamp-right.png) no-repeat center bottom; background-size:229px auto !important; }
.card_sec .card .ad_cont .ad_cont_inner{ display:block; width:100%; text-align:center; padding:0 15px; }
.card_sec .card .ad_cont h2{ font-family: 'OriginalSans-Four'; font-size:27px; line-height:29px; color:#000; padding:0 0 7px; }
.card_sec .card .ad_cont p{ font-family: 'Gotham-Book'; font-size:19px; line-height:29px; color:#fff; }


.slider_sec{ display:block; width:100%; background:#282954; padding:66px 0 63px; }
.slider_sec .product_slider{ display:block; width:100%; max-width:900px; /*max-width:300px;*/ margin:0 auto; }
.slider_sec .product_slide{ display:block; }
.slider_sec .inner_cont{ display:block; width:100%; padding:0 12px; }
.slider_sec .inner_cont figure{ display:block; width:100%; background:#86d3ed; /*border-top-left-radius:10px; border-top-right-radius:10px;*/ min-height:226px; padding:14px 0 0; overflow:hidden; text-align:center; }
.slider_sec .inner_cont figure img { vertical-align: top; display: inline-block; margin: 0 0 12px 0; max-width: 207px; padding: 0; }



.slider_sec .inner_cont .product_desc{ display:block; width:100%; background:#fff; min-height:121px; padding:21px 18px 10px 16px; /*border-bottom-left-radius:10px; border-bottom-right-radius:10px;*/ }
.slider_sec .inner_cont h2{ font-family: 'Gotham-Medium'; font-size:18px; line-height:22px; color:#000; padding:0 0 5px; }
.slider_sec .inner_cont .shop_now{ font-family: 'Gotham-Bold'; font-size:18px; line-height:24px; color:#e33d30; }

.slider_sec .product_slider .slick-prev{ position:absolute; font-size:0; width:88px; height:20px; margin:0; left:-105px; top:50%; margin:-10px 0 0; cursor:pointer; border-radius:0; border:none; z-index:999; background: url(../images/arr-left.png) no-repeat left center; background-size:88px auto !important; }
.slider_sec .product_slider .slick-prev.slick-disabled{ opacity:0;  cursor:default;}
.slider_sec .product_slider .slick-prev:before{ content:"";}

.slider_sec .product_slider .slick-next{ position:absolute; font-size:0; width:88px; height:20px; margin:0; right:-105px; top:50%; margin:-10px 0 0; cursor:pointer; border-radius:0;  border:none; z-index:999; background: url(../images/arr-right.png) no-repeat right center; background-size:88px auto !important; }
.slider_sec .product_slider .slick-next.slick-disabled{ opacity:0; cursor:default;}
.slider_sec .product_slider .slick-next:before {content:"";}


.cta{ display:block; width:100%; text-align:center; background:#00a3d1; padding:20px 30px 25px; }
.cta p{ font-family: 'OriginalSans-Four'; font-size:24px; line-height:35px; color:#000; max-width:885px; margin:0 auto; }
.cta p a{ font-size:inherit; line-height:inherit; color:inherit; text-decoration:underline; }
.cta p a:hover{ text-decoration:none; }



/**************************************Footer Css**************************************************/
footer { display:block; width: 100%; background: #000000; padding: 20px 0; text-align: center; z-index: 9999; overflow:hidden; position: relative; }
footer a.footer_logo { display: inline-block; }
a.footer_logo img { vertical-align: top; width: 160px; }

footer ul { list-style: none; padding: 12px 0 0; }
footer ul li { display: inline-block; font-family: 'Source Sans Pro', sans-serif; font-size: 12px; line-height: 16px; font-weight: 600; 
color: #fff; padding: 0 5px 0 8px; background: url(../images/link_sep.jpg) no-repeat left center; }
footer ul li:first-child { background: none; }
footer ul li a { display: block; color: #fff; }
footer ul li a:hover, footer ul li a:focus { color: #888888; }
/**************************************Footer Css**************************************************/ 

#div-gpt-interstitial { height: 1px; overflow: hidden; position:absolute; left:0; bottom:0; z-index:-1; }
#div-gpt-wallpaper { height: 1px; overflow: hidden; position:absolute; left:0; bottom:0; z-index:-1; }

html { -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */ }


/****************************Video Popup Css********************************************/
.v_box { position: relative; height: 0; width: 100%; /*padding-bottom:0%;*/ padding-bottom: 56.25%; }
.video-js { height: 100%; width: 100%; position: absolute; top: 0; left: 0; }

/******* CSS LIGHTBOX *******/
.vid_box {
    position: fixed;
    top: 100%;
    background: rgba(0, 0, 0, .85);
    opacity: 0;
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    -o-transition: opacity .5s ease-in-out;
    transition: opacity .5s ease-in-out;
    overflow-y: scroll;
    z-index: 999999;
    width: 100%;
    max-width: 100%;
    padding: 0 15px 0;
	display:flex; 
	align-items:center; 
	justify-content: center; 
	flex-wrap: wrap;
}

.vid_box_inner {
    display: block;
    /*width:100%;*/
    width: 1100px;
    /*margin: 0 auto;*/
    padding: 10px 0 10px;
    position: relative;
    max-width: 100%;
}

.vid_box video {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 100%;
    max-width: 100%;
    border: none;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, .3);
    box-sizing: border-box;
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}

/* Styles the close link, adds the slide down transition */
.vid-close {
    display: block;
    width: 16px;
    text-decoration: none;
    position: absolute;
    top: -80px;
    right: -30px; cursor:pointer;
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
.vid-close img{ vertical-align:top; width:14px; }

.vid_box.active { opacity: 1; top: 0; bottom: 0; }
.vid_box.active .v_box { padding-bottom: 56.25%; border:2px solid #fff; }
.vid_box.active .video-js { background: #000; }
.vid_box.active video { max-height: 100%; max-width: 100%; }
.vid_box.active .vid-close { top: 0; }


/*.banner .v_box {  display:block; width:100%; position:relative; height:calc(100vh - 55px); padding-bottom:0; }
.banner .video-js { position:absolute;top:0; left:0; min-height:640px; height:72vh; width:100%; overflow:hidden; }*/
.home .banner video{   margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 100%;
    max-width: 100%;
    border: none;
    box-sizing: border-box;
	 background-color:rgba(0,0,0,0); background-size:cover !important; }


