@CHARSET "ISO-8859-1";
/* Reset CSS
 * --------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td {
    padding: 0;
    margin: 0;
}
a{
	text-decoration:none;
}
table {
    border-spacing: 0;
}
fieldset,img {
    border: 0;
}
address,caption,cite,code,dfn,em,strong,th,var {
    font-weight: normal;
    font-style: normal;
}
strong{
	font-weight: bold;
}
ol,ul {
    list-style: none;
    margin:0;
    padding:0;
}
caption,th {
    text-align: left;

}
h1,h2,h3,h4,h5,h6 {
    font-weight: normal;
    font-size: 100%;
    margin:0;
    padding:0;
    color:#444;
}
q:before,q:after {
    content:'';
}
abbr,acronym { border: 0;
}


/* Custom CSS
 * --------------------------------------- */
body{
	font-family: arial,helvetica;
	color: #333;
	color: rgba(0,0,0,0.5);
}
.wrap{
	margin-left: auto;
	margin-right: auto;
	width: 960px;
	position: relative;
}
h1{
	font-size: 6em;
}
p{
	font-size: 2em;
}
.intro p{
	width: 50%;
	margin: 0 auto;
	font-size: 1.5em;
}
.section{
	text-align:center;
}
#menu li {
	display:inline-block;
	margin: 10px;
	color: #000;
	background:#fff;
	background: rgba(255,255,255, 0.5);
	-webkit-border-radius: 10px;
            border-radius: 10px;
}
#menu li.active{
	background:#666;
	background: rgba(0,0,0, 0.5);
	color: #fff;
}
#menu li a{
	text-decoration:none;
	color: #000;
}
#menu li.active a:hover{
	color: #000;
}
#menu li:hover{
	background: rgba(255,255,255, 0.8);
}
#menu li a,
#menu li.active a{
	padding: 9px 18px;
	display:block;
}
#menu li.active a{
	color: #fff;
}
#menu{
	position:fixed;
	top:0;
	left:0;
	height: 40px;
	z-index: 70;
	width: 100%;
	padding: 0;
	margin:0;
}
.twitter-share-button{
	position: fixed;
	z-index: 99;
	right: 149px;
	top: 9px;
}
#download{
	margin: 10px 0 0 0;
	padding: 15px 10px;
	color: #fff;
	text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
	background-color: #49afcd;
	background-image: -moz-linear-gradient(top, #5bc0de, #2f96b4);
	background-image: -ms-linear-gradient(top, #5bc0de, #2f96b4);
	background-image: -webkit-gradient(linear,0 0,0 100%,from( #5bc0de),to( #2f96b4));
	background-image: -webkit-linear-gradient(top, #5bc0de, #2f96b4);
	background-image: -o-linear-gradient(top, #5bc0de, #2f96b4);
	background-image: linear-gradient(top, #5bc0de, #2f96b4);
	background-repeat: repeat-x;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5bc0de', endColorstr='#2f96b4', GradientType=0);
	border-color: #2f96b4 #2f96b4 #1f6377;
	border-color: rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);

	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	vertical-align: middle;
	cursor: pointer;
	display: inline-block;
	-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.05);
}
#download a{
	text-decoration:none;
	color:#fff;
}
#download:hover{
	text-shadow: 0 -1px 0 rgba(0,0,0,.25);
	background-color: #2F96B4;
	background-position: 0 -15px;
	-webkit-transition: background-position .1s linear;
	-moz-transition: background-position .1s linear;
	-ms-transition: background-position .1s linear;
	-o-transition: background-position .1s linear;
	transition: background-position .1s linear;
}
#infoMenu{
	height: 20px;
	color: #f2f2f2;
	position:fixed;
	z-index:70;
	bottom:0;
	width:100%;
	text-align:right;
	font-size:0.9em;
	padding:8px 0 8px 0;
}
#infoMenu ul{
	padding: 0 40px;
}
#infoMenu li a{
	display: block;
	margin: 0 22px 0 0;
	color: #333;
}
#infoMenu li a:hover{
	text-decoration:underline;
}
#infoMenu li{
	display:inline-block;
	position:relative;
}
#examplesList{
	display:none;
	background: #282828;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	padding: 20px;
	float: left;
	position: absolute;
	bottom: 29px;
	right: 0;
	width:638px;
	text-align:left;
}
#examplesList ul{
	padding:0;
}
#examplesList ul li{
	display:block;
	margin: 5px 0;
}
#examplesList ul li a{
	color: #BDBDBD;
	margin:0;
}
#examplesList ul li a:hover{
	color: #f2f2f2;
}
#examplesList .column{
	float: left;
	margin: 0 20px 0 0;
}
#examplesList h3{
	color: #f2f2f2;
	font-size: 1.2em;
	margin: 0 0 15px 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.4);
	-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
	-moz-box-shadow: 0 1px 0 rgba(255,255,255,0.1);
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
	padding: 0 0 5px 0;
}



/* Demos Menu
 * --------------------------------------- */
 #demosMenu{
	position:fixed;
	bottom: 10px;
	right:10px;
	z-index: 999;
 }

 
  .site-slogan{
 	background: rgba(0,0,0,.55);
 	/*position: absolute;
 	width: 100%;
 	height: auto;
 	top: 28%;
 	left: auto;*/
 	padding: 20px 0;
 	z-index: 4;
 }

 .slogan-inner{
 	/*position: relative;*/
 	text-align: center;
 	padding: 0;
 	margin: 0;
 }

 .slogan-inner h2{
 	color: #ffffff;
 	/*font-family: 'proxima_nova_regular';*/
 	font-size: 44px;
 	line-height: 50px;
 	padding: 0;
 	margin: 0;
 }
 
 .btn_order{padding:10px 5px; background-color:#c84c4d; margin-top:20px; width:200px; margin: 0 auto; cursor:pointer;}
  .btn_order a{color:#fff; font-size:28px; font-weight:normal;}
  
  .logo_tel{padding-bottom:80px;}
  .logo_tel table{width:100%;}
  .logo_tel table td{vertical-align:top; text-align:center; width:33%;}
  .logo_tel .logo{text-align:left; padding:10px 0 0 10px;}
  .logo_tel .tel{text-align:right; padding:10px 10px 0 0px;}
  .logo_2{padding-top:40px;}
  .logo_tel .tel span{color:#fff; font-size:21px;}
  .logo_tel .tel a{color:#d76f74; font-size:15px;}
  .logo_tel .tel a:hover{text-decoration:underline;}

#section1 h1{/* position:absolute; */ /* margin-bottom:40px; */ /* font-size:28px; */ /* margin-left: auto; margin-right: auto; left: 0; right: 0; */}
.bg_m{background-color:#000; opacity:0.8; padding:80px 40px; width:80%; margin:0 auto; /* position:relative; top:130px; */}
.bg_m table{color:#fff; font-size:18px; }
.bg_m table td{width:25%;}
.bg_m table strong{font-weight:normal;}
.tb_2{margin: 0 auto; margin-top: 50px;}
.order_liz{background-color:#a4fa70; padding:10px; margin-left:70%; width:200px; /* position:relative; top:130px; right:10px; */}
.order_liz a{color:#000; font-size:16px;}

.skew {border-right:1px solid #323232; height:100%; width:33.2%; position: absolute; display:none;}
.skew1{left:0;}
.skew2{left:33.2%;}
.skew3{left:66.4%;}
.skew1{height:100%; width:33.2%; background-image: url(images/bg1.jpg); background-size:100% 100%;}
.skew2{height:100%; width:33.2%; background-image: url(images/bgg2.jpg); background-size:100% 100%;}
.skew3{height:100%; width:33.2%; background-image: url(images/bgg3.jpg); background-size:100% 100%;}

.bg{ height:100%; width:33%; color:#dedcdc; position: absolute; top:50%; text-align:center; font-size:25px; width:100%;}
.bg span{font-size:30px; font-weight:bold; color:#fff;}
.order_btn{background-color:#f7bd40; padding:20px 20px; width:150px; margin-top: 20px; margin-left: 32%;}
.order_btn1{margin-top: 49px;}
.order_btn2{}
.order_btn a{color:#000000;}
#section2 h1{position:absolute; top:40px; font-size:28px; margin-left: auto; margin-right: auto; left: 0; right: 0; color:#f7bd40; z-index:999;}

#section3{}
#section3 h1{padding:40px; font-size:28px; color:#fff; z-index:999;}
.form-control{    height: 65px;
    padding: 0 20px;
    font-size: 16px;
    color: #ffffff;
    background: none;
    border: 1px solid #b3b3b3;
    border-color: rgba(255,255,255,0.3);
    outline: none;
    -o-transition: all 0.35s;
    -ms-transition: all 0.35s;
    -moz-transition: all 0.35s;
    -webkit-transition: all 0.35s;
    transition: all 0.35s;
	max-width: 530px;
    width: 80%;
	height: 45px;
	}
	
.conf{color:#8c8a8a; font-size:15px;}
.order_btn_b{background-color:#a156c2; padding:30px 40px; width:250px; margin:0 auto;}
.order_btn_b a{color:#fff; font-size:30px;}

.footer{}
.footer .f-right{right:0px; position: absolute; color:#a7a7a7; bottom:0; text-align:right; padding-right:20px; padding-bottom:10px;}
.footer .f-left{left:0px; position: absolute; color:#a7a7a7; bottom:0; text-align:left; padding-left:20px; padding-bottom:10px;}

.aniWrap {
  margin: 200px auto;
  display: block;
  width: 28px;
}

.mouse {
  width: 28px;
  height: 50px;
  border: 2px solid white;
  border-radius: 14px;
}

.scroller {
  width: 4px;
  height: 4px;
  border-radius: 2px;
  background: white;
  position: relative;
  top: 10px;
  left: 12px;
  -webkit-animation: scrolls 1.3s ease-out infinite ; /* Chrome, Safari, Opera */
}


@-webkit-keyframes scrolls {
    0%   {top: 18px; opacity: 1; height: 4px}
    95% {top: 5px; opacity: 0; height: 8px}
  	100% {top: 18px; opacity: 1; height: 4px}
}