﻿@import url(https://fonts.googleapis.com/css?family=Lato);

.no-js #loader { display: none;  }

.js #loader { display: block; position: absolute; left: 0; top: 0; }

.se-pre-con {

	position: fixed;

	left: 0px;

	top: 0px;

	width: 100%;

	height: 100%;

	z-index: 9999;

	background: url(../images/cube.gif) center no-repeat #EAE5DA;

}

.preload_img{height:0; overflow:hidden;}



html, body{height:100%;}

body{

	margin:0;

	padding:0;

	height:100%;

	font-size:15px;

	font-family: 'Lato', sans-serif;

	color: #888;

	background-color:#999;

	overflow-y: scroll;

}

a{ text-decoration:none;}



/*=[hover effect]==============================*/

*:link, *:visited, *:hover, *:active, *:focus , * {

-o-transition: color .20s linear, background-color .20s linear, border-color .20s linear;

-webkit-transition: color .20s linear, background-color .20s linear, border-color .20s linear;

-moz-transition: color .20s linear, background-color .20s linear, border-color .20s linear;

transition: color .20s linear, background-color .20s linear, border-color .20s linear;}



img{vertical-align: middle; border: none;}



#pageWrapper{

	position:relative;

	display:table;

	width:100%;

	min-height:600px;

	height:100%;

	line-height:30px;

	overflow:hidden;

}



.head{

	background:url(../images/bg_gradient.png) no-repeat;

	padding-bottom:18px;

}

.head.fixed{

	position: fixed;

	width: 55%;

	top: 0;

	left: 45%;

	padding: 60px;

	box-sizing: border-box;

	z-index: 10;

}



.mobile_header{

	display: none;

	background-color:#EAE5DA;

}

.mobile_header .topbar{

	background-color:#5a5655;

	padding: 15px 20px;

}

.mobile_header .topbar i{

	color:#FFF;

}

.mobile_header .topbar .nav_contact{
	display: inline-block;
	width: 150px;
	text-align: right;
	color:#FFF;
	float:right;
}

.mobile_header .logo{

	margin: 20px;

}





/*=[nav]=========*/

nav{}

nav .nav_close{

	text-align: left;

	padding: 10px;

	font-size: 20px;

	color: #666;

	display: none;

}



nav a{

	font-size:16px;

	margin:0 10px 0 0;

	color: #9b9a9a;

	padding-bottom: 5px;

}

nav a:hover{color: #EAE5DA; border-bottom: 1px #E60012 solid;}

nav a.current{color: #EAE5DA; border-bottom: 1px #E60012 solid;}

nav a.home{display: none;}

nav a.download{display: none;}



nav a.btn_download{float: right; opacity: .5;}

nav a.btn_download:hover{opacity: 1; border: none !important;}

nav .nav_wrapper{

	display: inline-block;

	width: calc(100% - 90px);

}





#subnav{

	margin-top: 200px;

}

#subnav .subnav_title{

	font-size: 16px;

	line-height: 28px;

	display: none;

}

#subnav .item{

	font-size: 16px;

	line-height: 36px;

	letter-spacing: 3px;

	display: block;

}

#subnav .item.current{color: #E60012;}



#subnav .item b{font-weight:400;cursor: pointer;}

#subnav .item b:hover{color: #E60012;}



/*=[nav_contact]=========*/

#col2 #nav_contact{

	display:inline-block;

	color:#FFF;

	border:2px #FFF solid;

	padding:3px 0;
	width: 150px;

	text-align:center;

	float:right;

}

#col2 #nav_contact:hover{

	color:#E60012;

	border:2px #E60012 solid;

}





/*=[col]=========*/

#col1{

	position:absolute;

	top:-100%;

	left:0;

	display:table-cell;

	color:#FFF;

	/*background-color:#333;*/

	width:45%;

	height:100%;

	box-sizing: border-box;

	padding:50px;

	opacity: 0;

	filter:alpha(opacity=0);

}

#col2{

	position:absolute;

	top:100%;

	right:0;

	display:table-cell;

	background-color:#EAE5DA;

	width:55%;

	min-height: 100%;

	box-sizing: border-box;

	padding:60px;

	line-height:27px;

	opacity: 0;

	filter:alpha(opacity=0);

}



/*=[footer]==============================*/

footer{

	position:absolute;

	left:60px;

	bottom:30px;

	color: #727171;

	font-size:14px;

}

footer a{

	color: #727171;

	text-decoration:underline;

}





/*=[scrollup]==============================*/

#scrollup {

	color:#666;

	text-align: center;

	font-size: 14px;

	padding-top: 20px;

	cursor:pointer;

	display: none;

}

#scrollup img{

	width: 36px;

}



/*=[pages]==============================*/

#pages{

	text-align: right;

	padding:20px;

}

#pages a{

	display:inline-block;

	padding: 10px 15px;

	margin:0 5px;

	color: #CCC;

	border:1px #CCC solid;

}

#pages a.current{

	color: #FFF;

	background-color:#d53f22;

}



/*=[data table]==============================*/

.tableBorder{

    border-collapse: collapse;

	border: 1px #ccc solid;

	background-color:#FFF;

}

.tableBorder th{color:#333; padding: 10px;}

.tableBorder td{border: 1px #ccc solid; padding: 10px;}



/*=[common]==============================*/

.line{border-top:1px #DDD solid;}

.color1{color:#d53f22;}



.center{text-align:center;}

.left{text-align:left;}

.right{text-align:right;}

.fl_right{ float:right;}

.fl_left{ float:left;}

.clear{clear:both;}





/*=[media screen]==============================*/

@media screen and (max-width: 1180px) {



}



@media screen and (max-width: 800px) {

	#col1{

		position:static;

		display:block;

		width:100%;

		height:200px;

		padding:10px;

		box-sizing: border-box;

	}

	#col2{

		position:static;

		display:block;

		width:100%;

		padding:20px 20px 80px;

		box-sizing: border-box;

		text-align: center;

	}



	.head{display: none}

	.mobile_header{display: block;}



	nav{

		position: fixed;

		width: 100%;

		height: 100%;

		background-color:#EAE5DA;

		top: 0;

		left: 0;

		z-index: 100;

		text-align: center;

		display: none;

	}



	nav a{

		display: block;

		font-size: 20px;

		padding:8px;

	}

	nav .nav_close{display: block;}

	nav a:hover{color: #000; font-weight: bold; border:none;}

	nav a.current{color: #000; font-weight: bold; border:none;}

	nav a.home{display: block;}

	nav a.download{display: block;}

	nav a.btn_download{display: none;}

	

	nav a.current span{border-bottom: 1px #E60012 solid;}



	nav .fixed{

		position: absolute;

		top: 0;

		bottom: 0;

		z-index: 100;

		

		width: 100%;

		height: 240px;

		padding-bottom: 20px;

		margin: auto;

	}



	#subnav{

		margin-top: 10px;

		text-align: center;

	}

	#subnav .subnav_title{display: block;}

	#subnav .item{

		font-size: 16px;

		line-height: 26px;

		padding: 0 10px;

		cursor: pointer;

	}



	#subnav .item.hidden{display: none;}



	#scrollup {display: block;}



	footer{

		left:0;

		bottom:10px;

		padding: 0 10px;

		text-align: center;

		line-height: 24px;

	}

}



@media screen and (max-width: 600px) {

	#subnav .item{

		font-size: 14px;

	}

}