/*RESETS*/
.group:before, .group:after { content: ""; display: table; } 
.group:after { clear: both; }
.group { zoom: 1; }
.text-center{text-align:center;}
.text-left{text-align:left;}
.text-right{text-align:right;}
.valign_m{vertical-align: middle;}
.vspacer{margin-bottom:30px;}

.font_roboto{font-family: 'Roboto', sans-serif;}
.font_opensans{font-family: 'Open Sans', sans-serif;}

body{background:#fff;padding:0;margin:0;font-family: 'Open Sans', sans-serif;overflow-x:hidden;transition: all 0.4s ease;position:relative;
	-webkit-text-size-adjust: none;
}
body.nav_active{padding-right:300px;overflow:hidden}


h1,h2,h3{font-family: 'Montserrat', sans-serif;margin:0 0 30px;color:#0062b2;text-transform:uppercase;}
h1{font-size:70px;font-weight:700;letter-spacing:0.03em;}
h2{font-size:44px;}
h3{font-size:40px;font-weight:100;}

/*HEADER(s)
=================================================*/
#header ul,
#footer ul{padding:0;margin:0;list-style:none;}
#header a,
#footer a{text-decoration:none;}
#header h1{margin:0;}

#header{position:absolute;width:100%;top:0;;left:0;z-index:10;font-family: 'Gentium Basic', serif;transition: all 0.4s ease;}
#header .logo{width:217px;height:36px;position:absolute;top:40px;left:55px;z-index:2;background:url(../images/layout/header/logo2.png) center center no-repeat;background-size:contain;text-indent:-9999px;transition: all 0.4s ease;}
#header .logo>a{width:100%;height:100%;display:block;position:relative;}
.mainMenuFixed #header{height:60px;background-color:rgba(0, 98, 178, 0.8);}
.mainMenuFixed #header .logo{width:150px;height:20px;top:18px;left:12px;}


#nav_btn{width:50px;height:50px;position:absolute;top:30px;right:36px;z-index:100;background:url(../images/layout/header/btn_nav.png) center center no-repeat;cursor:pointer;transition: all 0.4s ease;}
#nav_btn:active{top:30px;}

.mainMenuFixed #nav_btn{width:40px;height:40px;top:8px;right:18px;}
.mainMenuFixed #nav_btn:active{top:9px;}


#nav_main{width:0;position:absolute;top:0;right:0;transition: all 0.4s ease;overflow:hidden;z-index:101;}
.nav_active #nav_main{width:300px;}
#nav_main>.inner{width:300px;height:100%;position:absolute;top:0;left:0;background:#fff;}
#nav_main>.inner>.deep{position:relative;padding:60px 40px;z-index:1;}
#nav_main .navlist{margin-bottom:36px;position:relative;}
#nav_main .navlist>li{position:relative;margin:20px 0;}
#nav_main .navlist>li>a{display:block;text-transform:uppercase;font-weight:bold;font-family: 'Roboto', sans-serif;color:#000;font-size:18px;}
#nav_main .navlist>li>a:hover{color:#0062b2;}
#nav_main .navlist.alt>li>a{color:#a1a1a1;}
#nav_main .navlist.alt>li>a:hover{color:#0062b2;}
#nav_main .nav_logo{display:block;margin-bottom:50px;}
#nav_main .nav_logo img{display:block;}
#nav_main .nav_close{width:70px;height:70px;position:absolute;top:0;right:0;background:url(../images/layout/header/btn_nav_close.png) center center no-repeat;cursor:pointer;z-index:2;}
#nav_main .nav_close:active{top:1px;}
#nav_main .navsocial{position:absolute;bottom:40px;left:40px;overflow:hidden;z-index:2;}
#nav_main .navsocial>li{float:left;display:inline;margin:0 20px 0 0;position:relative;}
#nav_main .navsocial>li a,
#nav_main .navsocial>li img{display:block;}

@media screen and (max-width:670px){
	h1{font-size:40px;}
	h2{font-size:30px;margin-bottom:20px;}
	h3{font-size:25px;}

	#header .logo{width:140px;top:20px;left:25px;}
	#nav_btn,
	#nav_btn:active{top:10px;right:15px;}

	body.nav_active{padding-right: 0;}
}

/*HEADER(e)
=================================================*/


/*FOOTER(s)
=================================================*/
#footer{position:relative;color:#919191;font-size:12px;text-align:center;background:#000;}
#footer>.inner{padding:60px 15px;position:relative;}
#footer>.inner .logo{vertical-align:middle;margin-right:25px;}

@media screen and (max-width:670px){
	#footer>.inner{padding:30px 15px;}
	#footer>.inner .logo{display:block;margin:0 auto 20px;}
}
/*FOOTER(e)
=================================================*/





.layer{position:relative;overflow:hidden;z-index:1;}
.layer>.bg{width:100%;height:100%;position:absolute;top:0;left:0;z-index:1;background:center center no-repeat;background-size:cover;background-attachment:fixed;}
.layer>.inner{width:80%;position:absolute;top:50%;left:10%;z-index:2;-webkit-transform: translateY(-50%);-ms-transform: translateY(-50%);transform: translateY(-50%);text-align:center;color:#fff;}
.layer h1{color:#1696ff;margin:110px 0 24px;}
.layer>.inner>.desc{font-size:20px;font-weight:300;letter-spacing:.05em;}
.layer_desc{background:#fff;text-align:center;font-size:18px;line-height:36px;}
.layer_desc>.inner{max-width:700px;margin:0 auto;padding:120px 15px 100px;}
.layer_feature{width:100%;position:absolute;bottom:0;left:0;background:#fff;transition: all 1.2s ease;z-index:2;opacity:0;}
.FeatureFixed .layer_feature{opacity:1;bottom:0;left:0;background:#0062b2;}
.layer_feature>.inner{position:relative;padding:56px;}
.layer_feature .item{width:23.3%;padding:0 5%;float:left;display:inline;position:relative;text-align:center;font-size:16px;color:#fff;line-height:24px;font-weight:300;margin-bottom:-11px;}
.layer_feature .item:before{height:100%;width:1px;border-left:1px solid #2d7bbb;content:"";position:absolute;top:0;left:0;}
.layer_feature .item:first-child:before{display:none;}
.layer_feature .item>.inner{max-width:320px;margin:0 auto;position:relative;}
.layer_feature .item h3{color:#fff;letter-spacing:normal;}

.layer_games{position:relative;background:#000;}
.layer_games .item{width:50%;height:50%;position:absolute;top:0;left:0;}
.layer_games .item.i1{height:100%;top:0;left:0;}
.layer_games .item.i2{height:100%;top:0;left:25%;}
.layer_games .item.i3{top:50%;left:50%;}
.layer_games .item.i4{top:50%;left:50%;}
.layer_games .item .link{width:100%;height:100%;position:absolute;top:0;left:0;display:block;overflow:hidden;}
.layer_games .item .cover{width:110%;height:110%;position:absolute;top:-5%;left:-5%;z-index:1;background:#000;z-index:2;opacity:0;transition: all 0.4s ease;}
.layer_games .item .bg{width:100%;height:100%;position:absolute;top:0;left:0;background:center center no-repeat;background-size:cover!important;transition: all 0.4s ease;transform:scale(1,1);}
.layer_games .item .desc{max-width:540px;height:230px;padding:0 15px;position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;z-index:3;text-align:center;font-size:16px;color:#a1a1a1;line-height:32px;transition: all 0.4s ease;opacity:0;transform:scale(1.15,1.15);}
.layer_games .item .desc h4{font-size:30px;letter-spacing:.1em;font-weight:300;font-family: 'Roboto', sans-serif;margin:40px 0 15px;color:#fff;}
.layer_games .item .desc p{margin-bottom:0;}
.layer_games .item .desc img{display:block;max-width:90%;margin:0 auto;}
.layer_games .item:hover .desc{opacity:1;transform:scale(1,1);}
.layer_games .item:hover .cover{opacity:.6;}
.layer_games .item:hover .bg{transform:scale(1.05,1.05);}

@media screen and (max-width:670px){
	.layer_games{height:auto!important;}
	.layer_games .item{width:100%!important;height:auto!important;top:auto!important;left:auto!important;position:relative;}
	.layer_games .item .link{width:auto;height:auto;position:relative;text-decoration: none;}
	.layer_games .item .desc{height:auto;position:relative;transform:scale(1,1);opacity:1;padding:60px 15px;line-height:22px;}
	.layer_games .item .desc h4{font-size:22px;margin:20px 0 0;}
	.layer_games .item .cover{opacity:.5}
	.layer_games .item .desc img{width:75%;}

	.layer{}
	.layer>.bg{background-attachment:scroll!important;}
	.layer.mobile_alt{height:auto!important;}
	.layer.mobile_alt>.bg{height:300px;position:relative;}
	.layer_feature{opacity:1;position:relative;bottom: auto!important;left:auto!important;background:#0062b2;}
	.layer_feature>.inner{padding:0 20px;}
	.layer_feature .item{width:auto;float:none;display:block;margin:0;padding:30px 0;border-top:1px solid #2d7bbb }
	.layer_feature .item:before{border:none;}
	.layer_feature .item:first-child{border-top: none;}
	.layer_feature .item>.inner .icon{width:120px;}
	.layer_desc{font-size:18px;line-height:30px;}
	.layer_desc>.inner{padding:40px 30px;}
	.layer_desc>.inner p:last-child{margin-bottom:0;}
	.layer_desc h2{font-size:26px;line-height:36px;margin-bottom:14px;}
	
	.layer>.inner{width:96%;left:2%;}
	.layer h1{font-size:32px;margin:95px auto 12px;width:75%;}
	.layer>.inner>.desc {font-size:15px;width:85%;margin:auto;}

}