﻿





#menu-container{ height:120px; margin-top:110px;}

#menu-huazhuangpin{ height:169px; margin-top:60px;}

.templatemorow	{ /*margin: 0px 30px;*/ }

.templatemo_servicerow	{ margin: 0px; }

.blok	{ position: absolute; }

.hex	{ width: 20%; float: left; }

.hex-offset	{ margin-left: 10%; }

.hexagon2, .hexagonteam {

	position: absolute;

	width: 200px;

	height: 400px;

	top: -85px;

}

.hexagonteam {

	position: absolute;

	width: 150px;

	height: 300px;

	top: -85px;

}

.hexagon {

	overflow: hidden;

	visibility: hidden;



	-webkit-transform: rotate(120deg);

	-moz-transform: rotate(120deg);

	-o-transform: rotate(120deg);

	-ms-transform: rotate(120deg);

	transform: rotate(120deg);

	cursor: pointer;

}



.hexagon-in1 {

	overflow: hidden;

	width: 100%;

	height: 100%;



	-webkit-transform: rotate(-60deg);

	-moz-transform: rotate(-60deg);

	-o-transform: rotate(-60deg);

	-ms-transform: rotate(-60deg);

	transform: rotate(-60deg);

}



.hexagon-in2 {

	background-color:#01a7f2;

	/*-webkit-box-shadow: inset 0 0 0 200px rgba(176, 218, 212, 0.48);

	box-shadow: inset 0 0 0 200px rgba(176, 218, 212, 0.48);*/

	overflow: hidden;

	width: 100%;

	height: 100%;

	background-repeat: no-repeat;

	background-position: 50%;



	-webkit-background-size: 125%;

	-moz-background-size: 125%;

	background-size: 125%;

	visibility: visible;



	-webkit-transform: rotate(-60deg);

	-moz-transform: rotate(-60deg);

	-o-transform: rotate(-60deg);

	-ms-transform: rotate(-60deg);

	transform: rotate(-60deg);



	-webkit-transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

	-o-transition: all 0.5s ease;

	-ms-transition: all 0.5s ease;

	transition: all 0.5s ease;

}



.hexagon-in2:hover {

	webkit-box-shadow: inset 0 0 0 200px rgba(36,36,36, 0.7);

	box-shadow: inset 0 0 0 200px rgba(36,36,36, 0.7);

}

.s_top	{ margin-top: 8%; }



.templatemo_hexteam .gallery-item .templatemo_overlay1 a { top: 50%; /*left: 15%;*/ background: none; border: none; }

.templatemo_hexteam .gallery-item .templatemo_overlay2 a { top: 50%; left: 37%; background: none; border: none; }

.templatemo_hexteam .gallery-item .templatemo_overlay3 a { top: 50%; left: 58%; background: none; border: none; }

.templatemo_hexteam .gallery-item .templatemo_overlay4 a { top: 50%; left: 80%; background: none; border: none; }



.smallhexagon {

	width: 150px;

	height: 46px;

	background: #b69e40;

	position: relative;

	background: url(../images/templatemo_teamhexa.png) no-repeat;

	margin-bottom: 10px;

}

.smallhexagon:before {

	position: absolute;

	left: 0;

	width: 0;

	height: 46px;



}

.smallhexagon:after {

	content: "";

	position: absolute;

	left: 0;

	width: 0;

	height: 46px;

}

.smallhexagon .fa { font-size: 16px; color: #ffffff; line-height: 46px; }

.templatemo_overlaytxt	{ margin-top: 105%; text-align: center; width: 100%; }



.hexagon-a {

	margin-top: 63px;

	position: absolute;

	z-index: 300;

	margin-left: -65px;

}

.hexagon-a a {

  margin: 0 auto;

  width: 26%;

  display: block;

  position: relative;

  

}

.hexagon-a a.hlinktop:hover .hexa-a {

  background: #cfb652;

  color: #fff;

}



.hexagonservices {

	height: 160px;

	margin-top: 60px;

}

.hexagonservices a.hlinkbott {

  margin: 0 auto;

  display: block;

  min-width: 120px;

  position: relative;

}



.hexagonservices a.hlinkbott:hover .hexa {

  background: #b69e40;

}

.templatemo_servicetext	{ float: left; margin-top: 230px; }

.templatemo_hexservices	{ width: 20%; margin-top: -10%; }

.templatemo_hexservices p{ text-align: center; }



/* mid hexa */

.hexa-a {

  width: 100%;

  min-width: 110px;

  height: 0;

  padding-bottom: 57.7%;

  background: #393e42;

  position: absolute;

  color: #b69e40;

  font-family: Futura, "Trebuchet MS", Arial, sans-serif;

  font-size: 42px;

  -webkit-transition: all 0.2s ease-in-out;

  -webkit-transition-delay: 0s;

  -moz-transition: all 0.2s ease-in-out 0s;

  -o-transition: all 0.2s ease-in-out 0s;

  transition: all 0.2s ease-in-out 0s;

  border-radius: 0%;

}



.hexa-a:before, .hexa-a:after {

  content: "";

  display: block;

  width: inherit;

  height: inherit;

  padding: inherit;

  background: inherit;

  -webkit-transform: rotate(60deg);

  -moz-transform: rotate(60deg);

  -ms-transform: rotate(60deg);

  -o-transform: rotate(60deg);

  transform: rotate(60deg);

  z-index: 0;

  position: absolute;

  border-radius: inherit;

}



.hexa-a:after {

  -webkit-transform: rotate(-60deg);

  -moz-transform: rotate(-60deg);

  -ms-transform: rotate(-60deg);

  -o-transform: rotate(-60deg);

  transform: rotate(-60deg);

}



.hcontainer-a {

  position: absolute;

  left: 0;

  top: 0;

  height: 100%;

  width: 100%;

  z-index: 10;

}



.vertical-align-a {

  display: table;

  height: 100%;

  width: 100%;

}



.texts-a {

  display: table-cell;

  vertical-align: middle;

  text-align: center;

} 

.copyrights{text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;}



/* main Hexa */ 

.hexa {

  width: 100%;

  min-width: 120px;

  height: 0;

  padding-bottom: 57.7%;

  margin: 0;

  background: #b69e40;

  position: absolute;

  color: #FFF;

  font-family: Futura, "Trebuchet MS", Arial, sans-serif;

  font-size: 14px;

  -webkit-transition: all 0.2s ease-in-out;

  -webkit-transition-delay: 0s;

  -moz-transition: all 0.2s ease-in-out 0s;

  -o-transition: all 0.2s ease-in-out 0s;

  transition: all 0.2s ease-in-out 0s;

  border-radius: 0%;

}



.hexa:before, .hexa:after {

  content: "";

  display: block;

  width: inherit;

  height: inherit;

  padding: inherit;

  background: inherit;

  -webkit-transform: rotate(60deg);

  -moz-transform: rotate(60deg);

  -ms-transform: rotate(60deg);

  -o-transform: rotate(60deg);

  transform: rotate(60deg);

  z-index: 0;

  position: absolute;

  border-radius: inherit;

}



.hexa:after {

  -webkit-transform: rotate(-60deg);

  -moz-transform: rotate(-60deg);

  -ms-transform: rotate(-60deg);

  -o-transform: rotate(-60deg);

  transform: rotate(-60deg);

}







/*------------------------------------------------------

	Gallery Styles 

--------------------------------------------------------*/

.gallery-item {

  background-color: white;

  -webkit-box-shadow: inset 0 0 1px #666;

  -moz-box-shadow: inset 0 0 1px #666;

  margin-bottom: 30px;

  /*position: relative;*/

  overflow: hidden;

}

.gallery-item .content-gallery {

  text-align: center;

}

.gallery-item .content-gallery h3 {

  color: #b10021;

  font-size: 16px;

  font-weight: 300;

  margin-top: 5px;

  padding-bottom: 5px;

  display: inline-block;

}

.gallery-item img {

  width: 100%;

}

.gallery-item .overlay {

	  background-position: 50% center;

    background-repeat: no-repeat;

    background-size: 125% auto;

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  min-width: 100%;

  min-height: 100%;

  height: 100%;

  display: block;

  -webkit-transition: all 50ms ease-in-out;

  -moz-transition: all 50ms ease-in-out;

  -ms-transition: all 50ms ease-in-out;

  -o-transition: all 50ms ease-in-out;

  transition: all 50ms ease-in-out;

}

.gallery-item  a {

  color: #f1f1f1;

  width: 90px;

  height: 32px;

  font-size:16px;

  font-weight:bold;

  /*background-color: #d3b850;*/

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  -ms-border-radius: 3px;

  border-radius: 3px;

  text-align: center;

  line-height: 32px;

  position: absolute;

  top: 50%;

  /*left: 50%;*/

  margin-top: -16px;

  /*margin-left: -16px;*/

}

.templatemo_gallerygap { margin-bottom: 13%; }

.templatemo_gallerygap img{ margin-top: 30px; }

.templatemo_gallerygap span.fa	{ font-size: 22px; margin-bottom: 15px; }

.templatemo_gallerytop	{ margin-top: 11%; }

.templatemo_loadmore	{ 

	margin: 0 auto; 

	padding: 7px 0px; 

	background: #b79e41; 

	margin-top: 15%; 

	text-align: center; 

	font-size: 16px; 

	width: 200px; 

	margin-bottom:10%;

	}



.templatemo_loadmore button{ 

	border: none; 

	background: #b79e41; 

	color: #ffffff; 

	text-transform: uppercase;

	width: 100%;

	}

.templatemo_contacttitle	{ 

	font-size: 16px; 

	color: #ffffff; }	

.templatemo_contactmap	{ 

	width: 332px; 

	height: 388px; 

	margin: 0 auto; }





.templatemo_contactmap img{ 

	position: absolute;

	top: 0px;

	left: 29px;

	}

.templatemo_address	ul{ 

	float: left;

	width: 100%;

	padding: 0;

	margin-top: 20px;

	}

.templatemo_address	ul li{ list-style: none; display: inline; padding: 0px; float: left; }

.templatemo_address	ul li.left{

	float: left;

	width: 40px;

	color: #b69e40;

	font-size: 22px;

}

.templatemo_address	ul li.rigth{

	float: left;

}



.templatemo_address	ul li.clear	{ height: 10px; width: 100%; }



.templatemo_form	{  width: 100%; }

.templatemo_form input{ 

	float: left; 

	height: 34px; 

	padding: 6px 12px; 

	border-radius: 0px; 

	background: #343536; 

	border: 1px solid #4b5257; 

	width: 100%;  

	margin-top: 10px;

	color: #cccccc;

	}

.templatemo_form textarea{

	float: left; 

	padding: 6px 12px; 

	height: 130px;

	border-radius: 0px; 

	background: #343536; 

	border: 1px solid #4b5257; 

	margin-top: 10px; 

	color: #cccccc;

}

.templatemo_form button.btn-primary{

	float: left; 

	width: 100%;

	line-height: 34px;

	text-align: center;

	color: #ffffff;

	border-radius: 0px;

	background: #b69e40;

	border: none;

	text-transform: uppercase;

	font-size: 14px;

	font-weight: 600;

	margin-top: 10px;

}

.templatemo_contactmap	{ width: 332px; height: 388px; float: left; }

.templatemo_contactmap img { position: absolute; width: 332px; height: 388px; top: 0px; left: 15px; }

#templatemo_map {

    width: 100%;

    height: 388px;

}



.templatemo_footer { background: #343536; padding: 20px 0px; width: 100%; margin-top: 100px; }

.templatemo_footer .hex_footer	{ float: left; margin-right: 5px; height: 40px; }



/* Smartphones (portrait and landscape) ----------- */



@media(min-width:992px) and (max-width: 1200px){

	.hexagon-a	{ margin-left: 5px; }

	.hexagon-a a	{ min-width: 140px; }

	.hexagonservices a.hlinkbott	{ width: 150px; }

	.templatemo_servicerow	{ margin: 0px 30px; }

	.templatemo_contactmap	{ width: 250px; height: 292px; float: left; }

	.templatemo_contactmap img{ position: absolute; width: 250px; height: 292px; top: 0px; left: 15px; }

	#templatemo_map {

   	 width: 100%;

    height: 292px;

	}

	}



	.templatemo_gallerytop	{ margin-top: 15%; }

	



 



	.templatemorow	{ /*margin: 0px 30px;*/ }

	.hexagon2 {

	position: absolute;

	width: 90px;

	height: 113px;

	top: -85px;

}

	.templatemo-hex-top1	{ margin-top: 80px; }

	.hexagon-a	{ left: 35%; }

	.hexagon-a a	{ min-width: 190px; }

	.hexagonservices a.hlinkbott	{ width: 200px; }

	.templatemo_servicerow	{ margin: 30px 30px; }







  



.content { display: none; height: auto; }

.homepage	{ display: block; }

.leftalign	{ float: left; }
