@charset "utf-8";
/* CSS Document */
@import url(http://fonts.googleapis.com/css?family=Lato|Roboto:300,400|Roboto+Condensed:300,400);

body{ background:#e4e5fd; margin:0px; padding:0px; font-family: 'Roboto', sans-serif; font-size:16px;}
h1, h2, h3, h4, h5, h6, p, figure, a{ margin:0px; padding:0px;}

.Fixwidth{ width:1000px; margin:0px auto; position:relative;}
.clear{ clear:both;}
.FloatLeft{ float:left;}
.FloatRight{ float:right;}

.col_1{ width:10%;}
.col_2{ width:20%;}
.col_3{ width:30%;}
.col_4{ width:40%;}
.col_5{ width:50%;}
.col_6{ width:60%;}
.col_7{ width:70%;}
.col_8{ width:80%;}
.col_9{ width:90%;}

/*--------------------------------------- Header ST ----------------------------------------*/

header{ background:#2e3192;}
header figure{ margin-top:30px; margin-bottom:25px;   margin-left: 7px;}
header .header_contact{ font-family: 'Lato', sans-serif; color:#FFF; font-size:20px; margin-top:55px;}
header .header_contact a{
  color: #fff;
  text-decoration: none;
}
header .header_contact a:hover{
  color: #fff;
   text-decoration: underline;
}

header .header_contact p{ margin-bottom:15px;}
header .header_contact p:last-child{ margin-bottom:0px;}
header .header_contact p img{ vertical-align:middle; margin-right:30px;}

/*--------------------------------------- Header EN ----------------------------------------*/

/*--------------------------------------- Menu ST ----------------------------------------*/

nav{ background:#000; width:100%; position:relative;}
nav ul{ margin:0px; padding:0px; list-style:none;  text-align:center;}
nav ul li{ float: none; font-size:19px; font-weight:bold; margin: 0px 12px;  display:inline;}
/*nav ul li:last-child{ float:left; font-size:19px; font-weight:bold; margin:0px 0px;   display:block;}*/
nav ul li a{padding: 17px 21px; color:#ffcd03; text-decoration:none; text-transform: uppercase;  display: inline-block;}
nav ul li a:hover, nav ul li a.active{ background:#ffcd03; color:#2e3192;}




/*--------------------------------------- Menu EN ----------------------------------------*/

/*--------------------------------------- Middle ST ----------------------------------------*/
#middle{
	float: left;
	width: 100%;
}
#middle .mdl_con{
	float: left;
	width: 100%;
	min-height: 325px;
	padding-bottom: 60px;
	background-image:url(../image/mdlBgImg.png);
	background-repeat:no-repeat;
	background-position:bottom center;
}

#middle .bannerMdl{
	float: left;
	width: 100%;
	position: relative;
}
#middle .bannerMdl .bannerImg{
	float: left;
	width: 100%;
}
#middle .bannerMdl .bannerFix{
  float: none;
  width: 100%;
  position: absolute;
  text-align: center;
  top: 30px;
}
#middle .bannerMdl .workImg{
	float: none;
	width: 365px;
	padding: 14px;
	display: inline-block;
	background-image:url(../image/workImgBg.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 100%;
}
#middle .bannerMdl .workImg img{
	width: 100%;
}
#middle .bannerMdl .workHeeadLine{
  float: left;
  width: 248px;
  padding: 88px 0px;
  position: absolute;
  right: 180px;
  bottom: -50px;
  color: #1b1b1b;
  font-family: 'Roboto Condensed', sans-serif;
  letter-spacing: -1px;
  font-size: 28px;
  text-align: center;
  line-height: 35px;
  text-transform: uppercase;
  background-image: url(../image/workTxtBg.png);
  background-repeat: no-repeat;
  background-position: left top;
}
#middle .bannerMdl .workHeeadLine img{
	padding-top: 5px;
}
.serBoxMian{
	float: left;
	width: 100%;
	padding: 35px 0px 60px 0px;
}
.serBox{
	float: left;
	width: 18%;
	padding: 0px 1%;
	text-align: center;
}
.serBox .serImg1{
	float: none;
	width: 108px;
	height: 108px;
	display: inline-block;
	/*background-image:url(../image/ser1nor.png);
	background-repeat:no-repeat;
	background-position: center top;*/
}
/*.serBox .serImg1:hover{
	background-image:url(../image/ser1hov.png);
	background-repeat:no-repeat;
	background-position: center top;
}*/
.serBox .serText{
	float: left;
	width: 100%;
	color: #1b1b1b;
	font-family: 'Roboto', sans-serif;
	font-size: 18px;
	text-transform: uppercase;
	padding-top: 15px;
}
.serBox .serText a{
	color: #1b1b1b;
	text-decoration: none;
}
.serBox .serText a:hover{
	color: #1b1b1b;
	text-decoration: underline;
}
.serBox .serImg2{
	float: none;
	width: 108px;
	height: 108px;
	display: inline-block;
/*	background-image:url(../image/ser2nor.png);
	background-repeat:no-repeat;
	background-position: center top;*/
}
/*.serBox .serImg2:hover{
	background-image:url(../image/ser2hov.png);
	background-repeat:no-repeat;
	background-position: center top;
}*/
.serBox .serImg3{
	float: none;
	width: 108px;
	height: 108px;
	display: inline-block;
	/*background-image:url(../image/ser3nor.png);
	background-repeat:no-repeat;
	background-position: center top;*/
}
/*.serBox .serImg3:hover{
	background-image:url(../image/ser3hov.png);
	background-repeat:no-repeat;
	background-position: center top;
}
*/
.serBox .serImg4{
	float: none;
	width: 108px;
	height: 108px;
	display: inline-block;
	/*background-image:url(../image/ser4nor.png);
	background-repeat:no-repeat;
	background-position: center top;*/
}
/*.serBox .serImg4:hover{
	background-image:url(../image/ser4hov.png);
	background-repeat:no-repeat;
	background-position: center top;
}*/
.serBox .serImg5{
	float: none;
	width: 108px;
	height: 108px;
	display: inline-block;
	/*background-image:url(../image/ser5nor.png);
	background-repeat:no-repeat;
	background-position: center top;*/
}
/*.serBox .serImg5:hover{
	background-image:url(../image/ser5hov.png);
	background-repeat:no-repeat;
	background-position: center top;
}*/
#middle h1{ color:#2e3192; padding-bottom: 10px;}
#middle p{ font-family: 'Roboto', sans-serif; font-size:16px;}

.contactFrom{
	float: left;
	width: 100%;
}
.contactBox {
	float: left;
	width: 100%;
	padding-bottom: 15px;
}
.contactBox .name {
  float: left;
  width: 100px;
  font-size:16px;
  padding: 10px 0px;
}

.contactBox .txtFd {
  float: left;
  width: 350px;
  padding: 10px;
  border-radius: 5px;
  border: solid 1px #999;
}
.contactBox .subBtn {
  float: left;
  width: auto;
  font-size: 18px;
  color: #fff;
  padding: 7px 30px;
  border-radius: 5px;
  border: 0px none;
  cursor: pointer;
  background-color: #2e3192;
  margin-bottom: 20px;
  text-transform: uppercase;
  font-family: 'Roboto', sans-serif;
}
.contactBox .subBtn:hover {
  color: #FFF;
  background-color: #000000;
}
#middle .innerCon{
	float: left;
	width: 100%;
	padding-top: 30px;
}
.innerCon ul{
	margin: 10px 0px 0px 30px;
	padding: 0px;
}
.innerCon ul li{
	padding-bottom: 13px;
}
.testimonials{
	float: left;
	width: 100%;
	margin-bottom: 25px;
    border-bottom: 1px dashed #555151;
}
.testimonials p {
  margin:0px 0px 15px 0px;
}
.testimonials .name{
	float: left;
	width: 100%;
	color: #2e3192;
	font-weight: bold;
	padding-bottom: 10px;
}
.testimonials .secName {
 	float: left;
	width: 100%;
	font-size: 14px;
	color: #2e3192;
	font-weight: bold;
	padding-bottom: 10px;
}
.testimonials:last-child{
	border-bottom: none;
}
/*--------------------------------------- Middle EN ----------------------------------------*/

/*--------------------------------------- Footer ST ----------------------------------------*/
#footer{
	float: left;
	width: 100%;
	padding-top: 75px;
	font-family: 'Roboto', sans-serif;
	background-image:url(../image/footerBgImg.png);
	background-repeat:no-repeat;
	background-position: left top;
	background-size: 100%;
	margin-top: -35px;
}
#footer .address{
  float: left;
  width: 100%;
  font-size: 18px;
  text-align: center;
  color: #ffcd03;
  padding-bottom: 30px;
  line-height: 30px;
}
#footer .address a{
  color: #ffcd03;
  text-decoration: none;
}
#footer .address a:hover{
   color: #ffcd03;
   text-decoration: underline;
}
#footer .nav{
	float: left;
	width: 100%;
	padding: 17px 0px;
	text-align: center;
	background-color: #ffcd03;
}
#footer .nav ul{
	margin:0px;
	padding:0px;
	text-align:center;
	list-style-type: none;
}
#footer .nav ul li{
	float: none;
	width:auto;
	color: #9d8015;
	display:inline;
}
#footer .nav ul li a{
	float: none;
	width:auto;
	color: #9d8015;
	margin: 0px 15px;
	display: inline-block;
	text-decoration: none;
}
#footer .nav ul li a:hover{
	margin: 0px 15px;
	color: #444444;
}
#footer .nav ul li a.active{
	color: #444444;
}
#footer .copyTxt{
	float: left;
	width: 100%;
	color: #a7a7a7;
	font-size: 14px;
	padding: 17px 0px;
	text-align: center;
	background-color: #2e3192;
}

/*--------------------------------------- Footer EN ----------------------------------------*/




/*--------------------------------------- Responsive HTML ----------------------------------------*/
.mobileMenu, .checkboxMob{ display:none;}
@media only screen and (min-width:768px) and (max-width:1024px) and (orientation:portrait){
	.Fixwidth{ width:90%;}
	nav ul li{margin: 0 5px;}
	nav ul li a{padding: 17px 12px;}
	#middle .bannerMdl .workImg{width: 200px;margin-left: -140px;}
	#middle .bannerMdl .bannerFix{top:10px;}
	#middle .bannerMdl .workHeeadLine{ width:210px; bottom:-100px; background-size:contain; font-size:23px; background-position:center center;}
	.serBox .serText{font-size:16px;}
}
@media only screen and (min-width:768px) and (max-width:1024px) and (orientation:landscape){
	.Fixwidth{ width:90%;}
	nav ul li{}
	nav ul li a{}
	#middle .bannerMdl .workImg{width: 260px;}
	#middle .bannerMdl .bannerFix{top:10px;}
	#middle .bannerMdl .workHeeadLine{ width:210px; bottom:-100px; background-size:contain; font-size:23px; background-position:center center;}
}
@media only screen and (min-width:320px) and (max-width:767px){
	.Fixwidth{ width:90%;}
	header figure.FloatLeft{width:30%;margin:0px;text-align:left; float:none; display:inline-block; vertical-align:middle;}
	header figure.FloatLeft a{ display:block;}
	header figure.FloatLeft img{margin:20px 0;max-width:100%;}
	header .header_contact.FloatRight{font-size: 16px; margin-top:0px; text-align:left; padding:10px 0px; width:65%;word-wrap: break-word; font-size:14px; float:none; display:inline-block; vertical-align:middle; padding-left:5px;}
	#middle p{/* text-align:center*/}
	#middle h1{/*text-align:center*/}
	.testimonials .name, .testimonials .secName, .testimonials .secName{/*text-align:center*/}
	header .header_contact p{ font-size:12px;}
	header .header_contact p img{ margin-right:5px; max-width:15px;}
	header .header_contact a{display:initial;vertical-align:middle;width:calc(100% - 35px);}
	nav ul li{ font-size:15px;}
	.mobileMenu{ display:block;}
	.checkboxMob{ position:absolute; display:block; opacity:0;}
	.mobileMenu{ position:relative; cursor:pointer; width:30px; height:50px; padding:0px 20px; margin:0px auto;}
	.mobileMenu span{ position:absolute; width:30px; height:4px; background-color:#FFF;cursor:pointer;}
	nav .Fixwidth{-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out; overflow:hidden; max-height:0px;}
	.mobileMenu span{-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;-webkit-transform: rotate(0deg);-moz-transform: rotate(0deg);-o-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg);}
	.mobileMenu span:nth-child(1){ top:14px;}
	.mobileMenu span:nth-child(2){ top:24px; opacity:1;}
	.mobileMenu span:nth-child(3){ top:34px;}
	nav input[type=checkbox]:checked ~ div.Fixwidth{ max-height:500px;}
	nav input[type=checkbox]:checked ~ label span:nth-child(1){-webkit-transform: rotate(-135deg);-moz-transform: rotate(-135deg);-o-transform: rotate(-135deg);-ms-transform: rotate(-135deg);transform: rotate(-135deg); top:24px;}
	nav input[type=checkbox]:checked ~ label span:nth-child(2){-webkit-transform: scale(2);-moz-transform: scale(2);-o-transform: scale(2);-ms-transform: scale(2);transform: scale(2); opacity:0;}
	nav input[type=checkbox]:checked ~ label span:nth-child(3){-webkit-transform: rotate(135deg);-moz-transform: rotate(135deg);-o-transform: rotate(135deg);-ms-transform: rotate(135deg);transform: rotate(135deg); top:24px;}
	nav ul{border-top:rgba(255,255,255,0.1) 1px solid;}
	nav ul li{ display:block; width:100%; margin:0px; text-align:left; border-bottom:rgba(255,255,255,0.1) 1px solid;}
	nav ul li a{ display:block;}
	nav ul li a:hover{ background-color:transparent;}
	nav ul li:last-child{ border-bottom:0px;}
	#middle h1{ font-size:20px;}
	.contactBox .txtFd{ width:calc(100% - 22px);}
	.contactBox .name_none{ display:none}
	#footer{ background-size:cover; padding-top:40px;}
	#footer .address{ font-size:15px; padding-bottom:20px;}
	#footer .nav ul li a{ padding:0px 10px; line-height:2; margin:0;}
	#footer .nav ul li a:hover{ margin:0;}
	#footer .nav{ padding:10px 0px;}
	#footer .copyTxt{line-height: 1.5;padding: 20px 0;}
	.serBox{ width:100%;}
	.serBox .serText{ font-size:15px; padding-top:10px; margin-bottom:20px;}
	.serBox .serText a br{ display:none;}
	#middle .bannerMdl .bannerImg{ height:250px;}
	#middle .bannerMdl .workImg{ display:none;}
	#middle .bannerMdl .workImg{width: 200px;margin-left: -140px;}
	#middle .bannerMdl .bannerFix{top:10px;}
	#middle .bannerMdl .workHeeadLine{ width:210px;background-size:contain; font-size:23px; background-position:center center; bottom:auto; right:0px; top:auto; margin-top:-15px; left:50%;-webkit-transform: translate(-50%, 0px);-moz-transform: translate(-50%, 0px);-o-transform: translate(-50%, 0px);-ms-transform: translate(-50%, 0px);transform: translate(-50%, 0px);}
}
@media only screen and (min-width:320px) and (max-width:767px) and (orientation:landscape){
	.serBox{ width:48%;}
	.serBox .serText a br{ display:block;}
}