/*
Open Sans 400,600,700
green text #6E9F82
*/
html,body {position:relative;height:100%;margin:0;padding:0;border:0;}
html {overflow-y:scroll;overflow-x:hidden;height:100%;} 
* {margin:0;padding:0;border:0;box-sizing:border-box;}
body {font-family: 'Lato', sans-serif;font-size:1.0em;font-weight:400;color:#231F20;text-align:center;}
.clear {clear:both;font-size:1%;overflow:hidden;width:100%;height:0px;}
.clrfx:after {content:".";display:block;height:0;clear:both;visibility:hidden;}
hr {background-color:#D3D3D3;height:1px;width:100%;clear:both;border:0;border-bottom:1px solid #D3D3D3;padding:0px;margin:10px 0px 20px 0px;}
p.sml {font-size:90%;}

.hwrapper {position:relative;width:100%;height:100vh;margin:0 auto;text-align:center;z-index:1;background-color:#00B5DC;}
.hwrapper h1 {color:#FFFFFF;font-weight:700;font-size:240%;text-transform:uppercase;position:relative;top:50%;transform:translateY(-50%);padding-bottom:50px;}
.wrapper {position:relative;width:100%;height:auto;margin:0 auto;text-align:left;z-index:1;padding-top:140px;}
.powered {position:absolute;bottom:36px;left:0;right:0;margin:0 auto;}
.powered p {color:#FFFFFF;font-weight:700;font-size:90%;text-transform:uppercase;padding:0px;text-align:center;line-height:1.6em;}
.powered p.link {color:#FFFFFF;text-transform:none;}
.powered p a {color:#FFFFFF;text-decoration:none;}
.powered p a:hover {color:#FFFFFF;text-decoration:underline;}

.header {position:fixed;top:0px;left:0px;width:100%;height:100px;z-index:800;background-color:#FFFFFF;border-bottom:1px solid #E8E8E8;-moz-transition:all 0.3s;-webkit-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
.header .inner {padding:10px 0px 10px 0px;}
.logo {position:relative;width:auto;float:left;display:inline;height:auto;z-index:2;}
.logo img {width:auto;height:auto;max-height:80px;display:block;-moz-transition:all 0.3s;-webkit-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
.openmenu {display:block;position:relative;float:right;width:40px;height:40px;margin:30px 0px 0px 0px;position:relative;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
.menuicon {background:#5E5C5D none repeat scroll 0 0;display:inline-block;height:4px;margin:9px 0;position:relative;transition-duration:0.4s;transition-property:background;width:40px;}
.menuicon:before, .menuicon:after {background:#5E5C5D none repeat scroll 0 0;content:"";display:block;height:4px;left:0;position:absolute;transition:all 0.4s ease 0s;width:40px;}
.menuicon:before {top:-9px;}
.menuicon:after {bottom:-9px;}
#bt.menuon .menuicon {background:#FFFFFF;}
#bt.menuon .menuicon:before {transform:rotateZ(-45deg) translate(-7px, 6px);background:#5E5C5D;}
#bt.menuon .menuicon:after {transform:rotateZ(45deg) translate(-7px, -6px);background:#5E5C5D;}
.openmenu .menutext:hover, .openmenu .menutext:focus {text-decoration:none;}
.openmenu:hover {text-decoration:none;}

.header.small {height:72px;}
.header.small .logo img {max-height:52px;}
.header.small .openmenu {margin:16px 0px 0px 0px;}

.video {padding:56.25% 0 0 0;position:relative;margin-bottom:12px;}
.chat {padding:56.25% 0 0 0;position:relative;margin-bottom:20px;}
iframe {position:absolute;top:0;left:0;width:100%;height:100%;}

section {position:relative;width:100%;height:100vh;min-height:740px;z-index:1;}
.inner {position:relative;width:100%;height:100%;max-width:1040px;margin:0 auto;text-align:left;z-index:3;}
.mask {position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;z-index:2;background:url(images/mask.png) top left repeat;}

.sectioncontent {position:relative;top:50%;transform:translateY(-50%);padding-right:50%;}
.sectioncontent h1 {font-weight:300;font-size:300%;padding:0 0 10px 0;letter-spacing:-1px;}
.sectioncontent h2 {font-weight:700;font-size:130%;padding:0 0 16px 0;letter-spacing:0px;}
.sectioncontent p {font-weight:400;font-size:90%;padding:0 0 14px 0;line-height:1.4em;}
section.drk h1, section.drk h2, section.drk p {color:#231F20;}
section.lte h1, section.lte h2, section.lte p {color:#FFFFFF;}

@media screen and (max-width: 1040px) {
	.header {padding:20px 3% 20px 3%;
}	
@media screen and (max-width: 768px) {
	.hwrapper {width:auto;padding:0px 3% 0px 3%;}
	.logo {position:relative;width:240px;height:auto;float:none;display:block;margin:0 auto;padding-bottom:20px;}
	
}