@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600');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%;}
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;}
* 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:5px;}
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%;}
.spacer-30{display:block;width:100%;clear:both;min-height:30px;}
.spacer-20{display:block;width:100%;clear:both;min-height:20px;}
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:#fff;-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; }
.wrapper { max-width:1300px; margin:0 auto; }
.wrapper1 { max-width:890px; margin:0 auto; }

/* layout */
#layout { float:left; width: 100%; height:100%; position:relative; padding:60px 0 0;}


/*********Header Css*********/
header{ float:left; width:100%; background:#151515; text-align:center;  position:fixed; z-index:999999; left:0; top:0;   }
header .header_inner{float:left; width:100%; padding:0 20px; border-top:5px solid #bce2f1; position:relative; min-height:60px; box-shadow:0 2px 4px rgba(0,0,0,0.5); -webkit-box-shadow:0 2px 4px rgba(0,0,0,0.5); -moz-box-shadow:0 2px 4px rgba(0,0,0,0.5); z-index:99;}

header a.logo{ display:inline-block;margin:0; padding:0; width:126px; float:left; margin:12px 0 0;}
header a.logo img{ vertical-align:top;}

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; font-weight:600; background:#bce2f1; padding:0 5px 3px 5px; 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 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:10px;}
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:35px; height:35px; border-radius:50%; border:3px 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:17px; line-height:30px; color:#fff; display:inline-block; }
header ul.social_icon li a:hover{opacity:0.7;}


a.menuToggle {transition: all 0.3s; -webkit-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; height:56px; display: block; text-decoration: none; line-height: 52px; text-align: right; background: none; width: 60px; z-index: 10; position: relative; float: right; margin:0 0 0 -30px; display: none; position: absolute; bottom: 1px; left: 50%; font-size: 0px; line-height: 0px; }
a.menuToggle span { width: 32px; height: 3px; display: block; position: absolute; right: 15px; top: 28px; background: #fff; transition: all 0.3s; -webkit-transition: all 0.3s; z-index:9999;}
a.menuToggle span:after { width: 32px; height: 3px; position: absolute; left: 0px; top: -11px; content:''; background: #fff; transition: all 0.3s; -webkit-transition: all 0.3s;} 
a.menuToggle span:before { width: 32px; height: 3px; position: absolute; left: 0px; bottom: -11px; content:''; background: #fff; transition: all 0.3s; -webkit-transition: all 0.3s;}
a.menuToggle.active span{ background: transparent; }
a.menuToggle.active span:after { transform: rotate(45deg); -webkit-transform: rotate(45deg); top: 0; border-radius: 0px; -webkit-border-radius: 0px; }
a.menuToggle.active span:before { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); bottom: 0px; border-radius: 0px; -webkit-border-radius: 0px; }



.nav-bar { width: 100%; margin: 0px; background: #fff; clear: both; overflow: hidden;}
.nav-bar ul { padding: 0px; margin: 0px; list-style-type: none; overflow: hidden; }
.nav-bar li { width: 16.66%; /*width: 33.33%;*/ float: left; border-left: 1px solid #d3d3d3; text-transform: uppercase; text-align: center;font-family: 'HelveticaNeueLTStdBdCn'; font-size: 21px; line-height: 25px; letter-spacing: 0.3px; }
.nav-bar li a { padding: 10px 0 10px 0; display:block; color: #000; }
.mac-os .nav-bar li a { padding: 13px 0 7px 0; }
.nav-bar li a:hover, .nav-bar li.active > a { background: #ea0506; color: #ffffff; }
.nav-bar li:first-child { border: 0px; }




/********************************************Banner Css******************************************************************/
.banner{ float:left;width:100%;height:100%;/*min-height:450px;*/ max-height:700px; position:relative; overflow:hidden;background:#000;}

.banner video{position:absolute;top:50%;left:50%;min-width:100%;min-height:100%;width:auto;height:auto;z-index:1; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); background-color:rgba(0,0,0,0);background-size:cover !important;}
.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 .banner_caption{ position:absolute; width:100%; left:0; top:50%; transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); z-index:9999; }
.banner .banner_caption .wrapper{ max-width:1060px; }
.banner_caption .caption_cont{ float:left; width:100%; position:relative;}

.caption_cont h1{ font-family: 'HelveticaNeueLTStdBdCn'; font-size:110px; line-height:114px; color:#FF0000; letter-spacing:11.48px;}
.caption_cont h1 span{ font-family:Georgia, "Times New Roman", Times, serif; font-size:38px; line-height:42px; color:#000; letter-spacing:0.26px; display:block; padding:5px 0 0;}
.caption_cont a.acc_logo{ display:inline-block; width:328px; margin-top:45px; /*margin-left:-35px;*/}

.caption_cont a.acc_logo img{ vertical-align:top;}
.caption_cont a.scroll_for_more{ position:absolute; right:0; bottom:-10px; width:85px;}
.caption_cont a.scroll_for_more img{ vertical-align:top;}




.mid_sec{float:left;width:100%;min-height:400px; background:#fff;}

.mid_sec .left_sec{float:left;width:67%; margin:-127px 0 0; box-shadow:-5px 0 5px rgba(0,0,0,0.05); -webkit-box-shadow:-5px 0 5px rgba(0,0,0,0.05); -moz-box-shadow:-5px 0 5px rgba(0,0,0,0.05);}

.left_sec .img_box{ float:left; width:100%; position:relative; min-height:524px; z-index:999;}
.left_sec .video_box{ float:left; width:100%; position:relative;}
.left_sec .video_box .img_box{ border:14px solid #000;}

.left_sec .img_box a.more{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:999;}
.left_sec .video_box .img_box a.more:after{ content:""; position:absolute; left:0; top:0; width:100%; height:100%;z-index:999; background: url(../images/play_btn.png) no-repeat center 120px; background-size:154px; }

.left_sec .img_box .img_part{position:absolute; width:100%; height:calc(100% - 50px); left:0; top:0; background-size:cover !important; z-index:9; overflow:hidden;}
.left_sec .img_box figure{ background-size:cover !important; width:100%; height:100%; position:absolute; left:0; top:0; transition:all ease 0.3s; -webkit-transition:all ease 0.3s; -moz-transition:all ease 0.3s; }
.left_sec .img_box:hover figure{ transform:scale(1.1,1.1); -webkit-transform:scale(1.1,1.1); -moz-transform:scale(1.1,1.1);}

.left_sec .img_box h3{ position:absolute; width:calc(100% - 140px); left:0; bottom:0; background:#fff; color:#ff0000; z-index:99; padding:30px 15px 30px 40px; font-family:Georgia, "Times New Roman", Times, serif; font-size:34px; line-height:42px; letter-spacing:0.25px; transition:all ease 0.3s; -webkit-transition:all ease 0.3s; -moz-transition:all ease 0.3s;}
.left_sec .img_box:hover h3{ color:#000000;}
.left_sec .video_box .img_box h3{ width:calc(100% - 126px); padding:30px 15px 30px 26px;}


.left_sec .img_box span.read_more{ position:absolute; width:140px; right:0; bottom:0; background:#ff0000; color:#fff; z-index:99; text-transform:uppercase; font-family: 'HelveticaNeueLTStdCn'; font-size:24px; line-height:28px; letter-spacing:1.5px;  padding:12px 15px 12px 25px;
transform: perspective(1px) translateZ(0px); -webkit-transform: perspective(1px) translateZ(0px); -moz-transform: perspective(1px) translateZ(0px); -ms-transform: perspective(1px) translateZ(0px); -o-transform: perspective(1px) translateZ(0px);   transition-duration: 0.3s; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-property: color; -webkit-transition-property: color; -moz-transition-property: color; }
.mac-os .left_sec .img_box span.read_more{padding:15px 15px 8px 25px;}

.left_sec .video_box .img_box span.read_more{width:126px; padding:12px 15px 12px 17px;}
.mac-os .left_sec .video_box .img_box span.read_more{ padding:15px 15px 8px 17px;}

.left_sec .img_box span.read_more:before{ background: #000000 none repeat scroll 0 0; bottom: 0; content: ""; left: 0; position: absolute; right: 0; top: 0; transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transition-duration: 0.3s; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-property: transform; -webkit-transition-property: transform; -moz-transition-property: transform; transition-timing-function: ease-out; -webkit-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; z-index: -1;}
.left_sec .img_box:hover span.read_more:before{transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1);}

.left_sec .img_box span.read_more:after{ content:""; position:absolute; width:24px; height:24px; background: url(../images/watch_btn.png) no-repeat center center; background-size:24px; top:14px; right:27px;}
.left_sec .video_box .img_box span.read_more:after{ right:7px; }



.left_sec .video_box .video_thumbs{ float:left; width:100%; border-left:6px solid #000; border-right:6px solid #000; border-bottom:14px solid #000; background:#000;}
.video_box .video_thumbs .video_thumb{ float:left; width:33.33%; min-height:147px; border-left:8px solid #000; border-right:8px solid #000; position:relative; overflow:hidden; }
.video_box .video_thumbs .video_thumb .video_thumb_img{position:absolute; left:0; top:0; width:100%; height:100%; z-index:99; background-size:cover !important; transition:all ease 0.3s; -webkit-transition:all ease 0.3s; -moz-transition:all ease 0.3s;}
.video_box .video_thumbs .video_thumb:hover .video_thumb_img{ transform:scale(1.1,1.1); -webkit-transform:scale(1.1,1.1); -moz-transform:scale(1.1,1.1);}
.video_box .video_thumbs .video_thumb a{position:absolute; left:0; top:0; width:100%; height:100%; z-index:999; background: url(../images/play_btn.png) no-repeat center center; background-size:77px;}


.mid_sec .right_sec{ float:right; width:33%; box-shadow:5px 0 5px rgba(0,0,0,0.05); -webkit-box-shadow:5px 0 5px rgba(0,0,0,0.05); -moz-box-shadow:5px 0 5px rgba(0,0,0,0.05);}

.right_sec .ad_box{ float:left; width:100%; padding:23px 0 10px;}
.right_sec .ad_box .ad{ display:block; margin:0 auto; width:300px; min-height:250px; background-size:cover !important;}

.right_sec .listing{ float:left; width:100%;}
.listing .list_box{ float:left; width:100%; border-top:1px solid #d8d8d8; padding:20px 20px 20px 20px;}
.listing .list_box a{ float:left; width:100%; }
.listing .list_box:first-child{border-top:none;}
.listing .list_box:last-child{ padding-bottom:0;}
.listing .list_box .img_part{float:left; width:100px; height:100px; margin:0 20px 0 0; position:relative; overflow:hidden;}
.listing .list_box figure{ background-size:cover !important; width:100%; height:100%; position:absolute; left:0; top:0; transition:all ease 0.3s; -webkit-transition:all ease 0.3s; -moz-transition:all ease 0.3s; }
.listing .list_box:hover figure{ transform:scale(1.1,1.1); -webkit-transform:scale(1.1,1.1); -moz-transform:scale(1.1,1.1); }
.listing .list_box .text_box{ float:left; width:calc(100% - 120px); position:relative; min-height:100px; padding:0 0 26px;}
.list_box .text_box h3{  font-family: 'helvetica_neueregular'; font-size:25px; line-height:25px; letter-spacing:0.21px; color:#000; padding:0;}
.list_box .text_box h3 span{ font-family: 'HelveticaNeueLTStdCn'; font-size:15px; line-height:19px; letter-spacing:0.94px; text-transform:uppercase; color:#ff0000; display:block; padding:0 0 4px; }


.list_box .text_box span.read_more{ position:absolute; width:26px; height:26px; background:#ff0000; left:0; bottom:0; 
transform: perspective(1px) translateZ(0px); -webkit-transform: perspective(1px) translateZ(0px); -moz-transform: perspective(1px) translateZ(0px); -ms-transform: perspective(1px) translateZ(0px); -o-transform: perspective(1px) translateZ(0px);   transition-duration: 0.3s; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-property: color; -webkit-transition-property: color; -moz-transition-property: color; }

.list_box .text_box span.read_more:before{ background: #000 none repeat scroll 0 0; bottom: 0; content: ""; left: 0; position: absolute; right: 0; top: 0; transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transition-duration: 0.3s; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-property: transform; -webkit-transition-property: transform; -moz-transition-property: transform; transition-timing-function: ease-out; -webkit-transition-timing-function: ease-out; -moz-transition-timing-function: ease-out; z-index: -1;}
.list_box:hover .text_box span.read_more:before{transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1);}

.list_box .text_box span.read_more:after{ content:""; position:absolute; width:18px; height:17px; background: url(../images/read_btn.png) no-repeat center center; background-size:18px; top:5px; left:5px;}




.inner_banner{ float:left; width:100%; min-height:545px; background-size:cover !important; margin:44px 0 0; }


.bodycontent{float:left;width:100%; background:#fff; position:relative; padding:0 0 30px;}


.heading_part{ position:absolute; width:100%; display:block; left:0; bottom:100%; text-align:center; }
.heading_part h1{ display:inline-block; font-family: 'HelveticaNeueLTStdBdCn'; font-size:58px; line-height:50px; color:#000; text-transform:uppercase; letter-spacing:6px; padding:40px 55px 0 55px; background:#fff; min-width:830px;  }

.content_part{ float:left; width:100%; padding:0 30px;}

.content_part.colored_bg{ background:rgba(234,5,6,0.05); padding:30px 30px 10px; margin:10px 0 40px;}

span.sub_text{ font-family:Georgia, "Times New Roman", Times, serif; font-size:22px; line-height:26px; font-style:italic; display:block; text-align:center; padding:17px 15px 0;}

.content_part h2{ font-family:Georgia, "Times New Roman", Times, serif; font-size:18px; line-height:26px; color:#000; padding:53px 0 30px; }
.content_part h2 span.first_letter{ font-family: 'HelveticaNeueLTStdBdCn'; font-size:100px; line-height:100px; letter-spacing:11px; color: #ea0506; float: left; margin:-10px 0 -15px; padding:0;}
.mac-os .content_part h2 span.first_letter{ margin:5px 0 -30px;}

.content_part h3{ font-family: 'HelveticaNeueLTStdBdCn'; font-size:32px; line-height:36px; letter-spacing:1.8px; color: #ea0506; padding:0 0 25px;}

.content_part p{ font-family:Georgia, "Times New Roman", Times, serif; font-size:18px; line-height:26px; color:#000; padding:0 0 25px;}

.content_part p strong{ font-weight:normal; font-family: 'HelveticaNeueLTStdBdCn'; font-size:24px; line-height:26px; color:#ea0506; letter-spacing:1.8px; }

.bodycontent blockquote{ float:left; width:100%; font-style:normal; margin:25px 0 50px; padding:25px 57px 25px 57px; text-align:center; position:relative; font-family: 'HelveticaNeueLTStdBdCn'; font-size:29px; line-height:45px; color:#ea0506; letter-spacing:2.27px; text-transform:uppercase;}
.mac-os .bodycontent blockquote{ padding:28px 57px 22px 57px; }

.bodycontent blockquote:before{ content:""; width:475px; height:1px; background:#000; position:absolute; top:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); }
.bodycontent blockquote:after{ content:""; width:475px; height:1px; background:#000; position:absolute; bottom:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); }


.ad_container{ float:left; width:100%;}
.ad_container .ad{ display:block; width:728px; max-width:100%; margin:10px auto 35px; min-height:90px; /*background:#d8d8d8;*/}




/********************************************Footer Css******************************************************************/
footer{ float:left; width:100%; background:#151515; padding:20px 0; text-align:center;}
footer a.footer_logo{ display:inline-block;}
a.footer_logo img{ vertical-align:top; width:166px;}
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 ul li a.ad_choices img{ vertical-align:middle; margin-left:3px; transition:all .15s ease-in-out 0s;}
footer ul li a.ad_choices:hover img,footer ul li a.ad_choices:focus img{ opacity:0.5;}



.v_box { position: relative; height: 0; width: 100%; padding-bottom: 56.25%; overflow: hidden; background: none;}
.video-js { height: 100%; width: 100%; position: absolute; top: 0; left: 0; }


/******* CSS LIGHTBOX *******/
/*Eliminates padding, centers the thumbnail */
/* Styles the lightbox, removes it from sight and adds the fade-in transition */
.vid_box {
    position: fixed;
    top: 100%;
    background: rgba(0, 0, 0, .75);
    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;
    z-index: 999999;
    width: 100%;
    max-width: 100%;
    padding:2.5vh 2.5% 0;
}

.vid_box_inner { display: block; width: 100%; position: relative; max-width: 100%; }

/* Styles the lightbox image, centers it vertically and horizontally, adds the zoom-in transition and makes it responsive using a combination of margin and absolute positioning */
.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 */
a.vid-close {
    /*border-radius:50%; border:2px solid #fff;*/
    display: block;
    width: 40px;
    height: 40px;
    box-sizing: border-box;
    background: none;
    color: black;
    text-decoration: none;
    position: absolute;
    top: -60px;
    right: 3px;
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}


/* Provides part of the "X" to eliminate an image from the close link */
a.vid-close:before {
    content: "";
    display: block;
    height: 40px;
    width: 4px;
    background: white;
    position: absolute;
    left: 17px;
    top: 3px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* Provides part of the "X" to eliminate an image from the close link */
a.vid-close:after {
    content: "";
    display: block;
    height: 40px;
    width: 4px;
    background: white;
    position: absolute;
    left: 17px;
    top: 3px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.vid_box.active { opacity: 1;  top: 0; bottom: 0; }
.vid_box.active .v_box { padding-bottom:0; height:95vh; }
.vid_box.active .video-js{ background:#000;}
.vid_box.active video { max-height: 100%;  max-width: 100%; }
.vid_box.active a.vid-close { top: 3px;}


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