@charset "utf-8";
/* CSS Document */
#wid{ width:25%; height:auto; float:left;}
#mar { margin-top:30px;}
.logo{ width:30%; height:auto; float:left; margin-top:10px; margin-bottom:10px;}
 .logo1{ width:70%; height:auto; float:right; margin-top:10px; margin-bottom:10px;}
 .logo1a{ width:36%; height:auto; float:left; margin-left:0px; margin-top:20px;}
 .logo1aa{ width:15%; height:auto; float:left; }
 .logo1ab{ width:70%; height:auto; float:left; }
 .logo1ab p{ font-size:12px; color:#1c6eb4; padding-top: 0px; font-weight:800;
    padding-bottom: 0px;}
 .logo1ab h3{ font-size:15px; color:#000;}
 
 
 .logo1b{ width:28%; height:auto; float:left; }
 .logo1ba{ width:100%; height:auto; float:left; }
 .logo1bb{ width:45%; height:auto; float:left;  }
 .logo1bb p{ font-size:8px; color:#000;  padding:0px; text-align:center; text-transform:uppercase; font-weight:700;}
 
 
.parallelogram1{ width: 100%; height: 5px; float:left; margin-top:5px; margin-bottom:10px;} 
#parallelogram {
	width: 30px;
	height: 5px;
	-webkit-transform: skew(20deg);
	   -moz-transform: skew(20deg);
	     -o-transform: skew(20deg);
	background:#3a80bb; float:left;
}
 
#parallelogram2 {
	width: 30px;
	height: 5px;
	-webkit-transform: skew(20deg);
	   -moz-transform: skew(20deg);
	     -o-transform: skew(20deg);
	background: #000; float:left;
} 
#parallelogram3 {
	width: 30px;
	height: 2px;
	-webkit-transform: skew(20deg);
	   -moz-transform: skew(20deg);
	     -o-transform: skew(20deg);
	background: #3a80bb; float:left;
} 

#parallelogram4 {
	width: 30px;
	height: 2px;
	-webkit-transform: skew(20deg);
	   -moz-transform: skew(20deg);
	     -o-transform: skew(20deg);
	background: #000; float:left;
} 
.parallelogram5{
width: 100%; height: 2px; float:left;
} 

.smalban{ width:100%; height:auto; float:left; background:#6e6e70;}
.smalban1 { width:100%; height:auto; float:left; text-align:center;}
.smalban1 h3 { font-size:22px; color:#fff; padding-top:10px; }
.smalban1 p { font-size:12px; color:#fff; }

.smalbanl{ width:100px; height:2px; margin-left:494px; background: #fff; margin-top: 10px;}
.client{ width:100%; height:auto; float:left;}
.client1 { width:200px; height:120px; float:left; border:2px solid #1c6eb4; margin-top:20px; margin-bottom:20px;}
.client2 { width:200px; height:120px; float:left; margin-left:30px; border: 2px dotted #6e6e70;; margin-top:20px; margin-bottom:20px;}
.client3 { width:200px; height:120px; float:left; margin-left:30px; border: 2px solid #1c6eb4; margin-top:20px; margin-bottom:20px;}
.client1:hover{ border:2px dotted #6e6e70;}
.client2:hover{ border:2px solid #1c6eb4}
.client3:hover{ border:2px dotted #6e6e70;}

.contact1{ width:300PX; height:auto; float:left;  border: 1px solid #e8e8e8;  border-top: 3px solid #6e6e70; padding:0.86667rem; transition: all .1s ease-out; text-align:center; margin-top:30px; margin-bottom:100px;}
.contact1 h3{ font-size:18px; color:#000; font-weight:800; }
.contact1 p{ font-size:16px; color:#000; font-weight:600; }
.contact1:hover{  border: 1px solid #e8e8e8;  border-top: 3px solid #1c6eb4; padding: 0.86667rem; transition: all .1s ease-out; box-shadow: 0 4px 16px 0 rgba(0,0,0,.05), 0 2px 6px 0 rgba(0,0,0,.12);  }
.contact1 i{ font-size:35px; color:#1c6eb4; text-align:center;}
.contact2 i{ font-size:35px; color:#1c6eb4; text-align:center;}

.contact2 { width:300PX; height:auto; float:left; margin-left:40PX; border: 1px solid #e8e8e8;  border-top: 3px solid #6e6e70; padding:0.86667rem; transition: all .1s ease-out; text-align:center; margin-top:30px; margin-bottom:100px;}

.contact3 { width:403PX; height:auto; float:left; margin-left:40PX; border: 1px solid #e8e8e8;  border-top: 3px solid #6e6e70;  transition: all .1s ease-out; text-align:center; margin-top:30px; margin-bottom:100px;}
.contact3:hover{  border: 1px solid #e8e8e8;  border-top: 3px solid #1c6eb4; transition: all .1s ease-out; box-shadow: 0 4px 16px 0 rgba(0,0,0,.05), 0 2px 6px 0 rgba(0,0,0,.12);  }
.contact3 iframe { width:400PX; height:273PX; frameborder:0; }

.contact2 h3{ font-size:18px; color:#000; font-weight:800; }
.contact2 p{ font-size:16px; color:#000; font-weight:400; /*font-family:Arial,Verdana,Helvetica,sans-serif;*/ }
.contact2:hover{  border: 1px solid #e8e8e8;  border-top: 3px solid #1c6eb4; padding: 0.86667rem; transition: all .1s ease-out; box-shadow: 0 4px 16px 0 rgba(0,0,0,.05), 0 2px 6px 0 rgba(0,0,0,.12);  }

  .text7
{
font-size:14px;
}
.names p
{
display: block;
	padding: 20px 0 0px 0;
	font-size:15px; 	margin-left:20px;
	}
	.names1 p
{
display: block;

	padding: 39px 0 14px 0;
	font-size:14px;
	margin-left:20px;
	}
	.txtbox
{	
    font: 14px;
	width: 60%;
	height:40px;
	margin-left:20px;

	color: #666666;
	background: #fff;
	border: 1px solid #ddd;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	-webkit-transition: 200ms;
	-moz-transition: 200ms;
	}
	.txtbox2
{ margin-left:20px;
    font: 14px;
	width: 60%;
	height:60px;
	padding: 9px;
	color: #666666;
	background: #fff;
	border: 1px solid #ddd;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	-webkit-transition: 200ms;
	-moz-transition: 200ms;
	}
	.txtbox1

{ margin-left:20px;
    font: 14px;
	width: 60%;
	height:120px;
	padding: 9px;
	color: #666666;
	background: #fff;
	border: 1px solid #ddd;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	-webkit-transition: 200ms;
	-moz-transition: 200ms;
	}
.txtarea
{
margin-top:-25px;
margin-left:760px;

}

.txtarea p
{
color:#ff0000;
font-size:18px;
font-weight:500;
}
.txtarea1
{
margin-top:-140px;
margin-left:650px;
}
.txtarea1 p
{
color:#006362;
font-size:14px;
font-weight:500;
}
.submit
{
border: 1px solid #ddd;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
width:100px;
height:40px;
margin-top:45px;
text-align:center;
font-size:14px;
background:#003b5b;
padding:10px 3px;
color:#FFFFFF;
margin-bottom:40px;
margin-left:20px; font-weight:500;
}

.about1 { width:22%; height:auto; float:left; margin-top:20px; margin-bottom:20px;}
.about1a { width:100%; height:auto; float:left;}
.about1a  h3{ color:#fff; background:#1c6eb4; padding:10px; font-size:16px; font-weight:800;}
.about1b { width:100%; height:auto; float:left; margin-top:5px; }
.about1b  h3{ color:#333;  padding:8px; border: 1px solid #e6e6e6; font-size:14px; background:#fff; font-weight:800;}

.about2 { width:73%; height:auto; float:right;margin-top:20px; margin-bottom:20px;}

.sp { width:100%; height:auto; float:left; margin-bottom:10px;}
.sp1 { width:20%; height:70px; float:left;}
.sp2 { width:70%; height:auto; float:left; margin-left:20px;}

.about2 h3{ font-size:16px; text-align:justify; padding-top:0px; color:#1c6eb4; padding-bottom:5px; font-weight:800; text-transform:uppercase;}
.about2 p{ font-size:13px; text-align:justify; padding-top:0px; line-height:23PX;}
.about2 i { color:#1c6eb4; font-size:12px;}	

.about1b h3:hover { background:#f5f5f5;}
.facility { width:100%; height:auto; float:left; margin-top:10px; margin-bottom:20px;}
.facility iframe { width:800px; height:1150px;}
.facility1 { width:22%; height:auto; float:left;}
.facility2 { width:75%; height:auto; float:left; margin-left:15px;}
.facility2 p{ font-size:13px; text-align:justify; padding-top:0px;}
.facility2 h3{ font-size:16px; text-align:justify; padding-top:0px; color:#1c6eb4; padding-bottom:5px; font-weight:800; text-transform:uppercase;}
.facility2 i { color:#1c6eb4; font-size:12px;}	

.vision1 { width:400px; height:100px; float:left; }
.vision2{ width:53%; height:auto; float:left; margin-left:10px;}
.vision2 p{ font-size:13px; text-align:justify; padding-top:0px;}
.vision2 h3{ font-size:16px; text-align:justify; padding-top:0px; color:#1c6eb4; padding-bottom:5px; font-weight:800; text-transform:uppercase;}

.mision1 { width:400px; height:100px; float:right; }
.mision2{ width:53%; height:auto; float:left; margin-right:0px;}
.mision2 p{ font-size:13px; text-align:justify; padding-top:0px;}
.mision2 h3{ font-size:16px; text-align:justify; padding-top:0px; color:#1c6eb4; padding-bottom:5px; font-weight:800; text-transform:uppercase;}


.sp4 { width:69%; height:auto; float:left; }
.sp3 { width:30%; height:auto; float:right; }
.product1{ width:250px; height:auto; float:left; margin-top:0px; margin-bottom:20px;}
.product1a { width:100%; height:auto; float:left;}
.product1b { width:100%; height:auto; float:left;}
.product1b h3{ font-size:15px;  padding:6px; color:#fff;  font-weight:800; background:#1c6eb4;  text-transform: initial; text-align: center; LETTER-SPACING: 0.5PX;}
.product2{ width:250px; height:auto; float:left; margin-top:0px; margin-bottom:20px; margin-left:20px;}
#hide1{ display:inherit;}
#hide{ display:none;}

@media all and (max-width: 768px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {

#hide{ display:inherit;}
#hide1{ display:none;}


#wid{ width:100%; height:auto; float:left;}
#mar { margin-top:0px;}
.logo{ width:60%; height:auto; float:left; margin-top:5px; margin-bottom:5px;}
 .logo1{ width:30%; height:auto; float:right; margin-top:10px; margin-bottom:10px;}
 .logo1a{ display:none;}
 .logo1aa{ width:15%; height:auto; float:left; }
 .logo1ab{ width:70%; height:auto; float:left; }
 .logo1ab p{ font-size:12px; color:#1c6eb4; padding-top: 0px; font-weight:800;
    padding-bottom: 0px;}
 .logo1ab h3{ font-size:15px; color:#000;}
 
 
 .logo1b{ width:100%; height:auto; float:none; }
 .logo1ba{ width:100%; height:auto; float:left; }

  .logo1bb{ width:80%; height:auto; float:left;  }
 .logo1bb p{ font-size:6px; color:#000;  padding:0px; text-align:center; text-transform:uppercase; font-weight:700;}
 
.parallelogram1{ width: 100%; height: 5px; float:left; margin-top:5px; margin-bottom:10px;} 
#parallelogram {
	width: 30px;
	height: 5px;
	-webkit-transform: skew(20deg);
	   -moz-transform: skew(20deg);
	     -o-transform: skew(20deg);
	background:#3a80bb; float:left;
}
 
#parallelogram2 {
	width: 30px;
	height: 5px;
	-webkit-transform: skew(20deg);
	   -moz-transform: skew(20deg);
	     -o-transform: skew(20deg);
	background: #000; float:left;
} 
#parallelogram3 {
	width: 30px;
	height: 2px;
	-webkit-transform: skew(20deg);
	   -moz-transform: skew(20deg);
	     -o-transform: skew(20deg);
	background: #3a80bb; float:left;
} 

#parallelogram4 {
	width: 30px;
	height: 2px;
	-webkit-transform: skew(20deg);
	   -moz-transform: skew(20deg);
	     -o-transform: skew(20deg);
	background: #000; float:left;
} 
.parallelogram5{
width: 100%; height: 2px; float:left;
} 

.smalban{ width:100%; height:auto; float:left; background:#6e6e70;}
.smalban1 { width:100%; height:auto; float:left; text-align:center;}
.smalban1 h3 { font-size:18px; color:#fff; padding-top:10px; }
.smalban1 p { font-size:12px; color:#fff; }

.smalbanl{ width:100px; height:2px; margin-left:494px; background: #fff; margin-top: 10px;}
.client{ width:100%; height:auto; float:left;}
.client1 { width:200px; height:120px; float:left; border:2px solid #1c6eb4; margin-top:20px; margin-bottom:20px;  margin-left:30px;}
.client2 { width:200px; height:120px; float:left; margin-left:30px; border: 2px dotted #6e6e70;; margin-top:20px; margin-bottom:20px;}
.client3 { width:200px; height:120px; float:left; margin-left:30px; border: 2px solid #1c6eb4; margin-top:20px; margin-bottom:20px; }
.client1:hover{ border:2px dotted #6e6e70;}
.client2:hover{ border:2px solid #1c6eb4}
.client3:hover{ border:2px dotted #6e6e70;}

.contact1{ width:88%; height:auto; float:left;  border: 1px solid #e8e8e8;  border-top: 3px solid #6e6e70; padding:0.86667rem; transition: all .1s ease-out; text-align:center; margin-top:30px; margin-bottom:20px; margin-left:7px;}
.contact1 h3{ font-size:18px; color:#000; font-weight:800; }
.contact1 p{ font-size:14px; color:#000; font-weight:400; }
.contact1:hover{  border: 1px solid #e8e8e8;  border-top: 3px solid #1c6eb4; padding:0.86667rem; transition: all .1s ease-out; box-shadow: 0 4px 16px 0 rgba(0,0,0,.05), 0 2px 6px 0 rgba(0,0,0,.12);  }
.contact1 i{ font-size:35px; color:#1c6eb4; text-align:center;}
.contact2 i{ font-size:35px; color:#1c6eb4; text-align:center;}

.contact2 { width:88%; height:auto; float:left; margin-left:8PX; border: 1px solid #e8e8e8;  border-top: 3px solid #6e6e70; padding: 0.86667rem; transition: all .1s ease-out; text-align:center; margin-top:30px; margin-bottom:20px;}
.contact2 h3{ font-size:18px; color:#000; font-weight:800; }
.contact2 p{ font-size:14px; color:#000; font-weight:400; }
.contact2:hover{  border: 1px solid #e8e8e8;  border-top: 3px solid #1c6eb4; padding: 0.86667rem; transition: all .1s ease-out; box-shadow: 0 4px 16px 0 rgba(0,0,0,.05), 0 2px 6px 0 rgba(0,0,0,.12);  }

.contact3 { width:88%; height:auto; float:left; margin-left:8PX; border: 1px solid #e8e8e8;  border-top: 3px solid #6e6e70;  transition: all .1s ease-out; text-align:center; margin-top:30px; margin-bottom:100px;}
.contact3:hover{  border: 1px solid #e8e8e8;  border-top: 3px solid #1c6eb4; transition: all .1s ease-out; box-shadow: 0 4px 16px 0 rgba(0,0,0,.05), 0 2px 6px 0 rgba(0,0,0,.12);  }
.contact3 iframe { width:100%; height:320PX; frameborder:0; }



  .text7
{
font-size:14px;
}
.names p
{
display: block;
	padding: 20px 0 0px 0;
	font-size:15px; 	margin-left:20px;
	}
	.names1 p
{
display: block;

	padding: 9px 0 14px 0;
	font-size:14px;
	margin-left:20px;
	}
	.txtbox
{	
    font: 14px;
	width: 80%;
	height:40px;
	margin-left:20px;

	color: #666666;
	background: #fff;
	border: 1px solid #ddd;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	-webkit-transition: 200ms;
	-moz-transition: 200ms;
	}
	.txtbox2
{ margin-left:20px;
    font: 14px;
	width: 80%;
	height:60px;
	padding: 9px;
	color: #666666;
	background: #fff;
	border: 1px solid #ddd;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	-webkit-transition: 200ms;
	-moz-transition: 200ms;
	}
	.txtbox1

{ margin-left:20px;
    font: 14px;
	width: 80%;
	height:120px;
	padding: 9px;
	color: #666666;
	background: #fff;
	border: 1px solid #ddd;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	-webkit-transition: 200ms;
	-moz-transition: 200ms;
	}
.txtarea
{
margin-top:0px;
margin-left:30px;

}

.txtarea p
{
color:#ff0000;
font-size:18px;
font-weight:500;
}
.txtarea1
{
margin-top:-140px;
margin-left:650px;
}
.txtarea1 p
{
color:#006362;
font-size:14px;
font-weight:500;
}
.submit
{
border: 1px solid #ddd;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
width:100px;
height:40px;
margin-top:5px;
text-align:center;
font-size:14px;
background:#003b5b;
padding:10px 3px;
color:#FFFFFF;
margin-bottom:0px;
margin-left:20px; font-weight:500;
}

.about1 { width:95%; height:auto; float:none; margin-top:20px; margin-bottom:20px; margin-left:7px; }
.about1a { width:100%; height:auto; float:left;}
.about1a  h3{ color:#fff; background:#1c6eb4; padding:10px; font-size:16px; font-weight:800;}
.about1b { width:100%; height:auto; float:left; margin-top:5px; }
.about1b  h3{ color:#333;  padding:8px; border: 1px solid #e6e6e6; font-size:14px; background:#fff; font-weight:800;}

.about2 { width:95%; height:auto; float:none;margin-top:20px; margin-bottom:20px; margin-left:7px;}
.about2 h3{ font-size:16px; text-align:justify; padding-top:0px; color:#1c6eb4; padding-bottom:5px; font-weight:800; text-transform:uppercase;}
.about2 p{ font-size:13px; text-align:justify; padding-top:0px;}
.about2 i { color:#1c6eb4; font-size:12px;}	

.about1b h3:hover { background:#f5f5f5;}
.facility { width:100%; height:auto; float:left; margin-top:10px; margin-bottom:20px;}
.facility iframe { width:100%; height:1150px;}
.facility1 { width:95%; height:auto; float:left; margin-left:7px;}
.facility1 img{ width:100%;}
.facility2 { width:100%; height:auto; float:left; margin-left:7px;}
.facility2 p{ font-size:13px; text-align:justify; padding-top:0px;}
.facility2 h3{ font-size:16px; text-align:justify; padding-top:0px; color:#1c6eb4; padding-bottom:5px; font-weight:800; text-transform:uppercase;}
.facility2 i { color:#1c6eb4; font-size:12px;}	

.vision1 { width:95%; height:100px; float:none; border:1px solid #ccc; margin-left:7px; margin-bottom:10px;}
.vision2{ width:95%; height:auto; float:none; margin-left:7px;}
.vision2 p{ font-size:13px; text-align:justify; padding-top:0px;}
.vision2 h3{ font-size:16px; text-align:justify; padding-top:0px; color:#1c6eb4; padding-bottom:5px; font-weight:800; text-transform:uppercase;}
.vision1 img{ width:100%;}

.mision1 { width:95%; height:100px; float:none; border:1px solid #ccc; margin-left:7px; margin-bottom:10px;}
.mision1 img{ width:100%;}
.mision2{ width:95%; height:auto; float:left; margin-right:0px; margin-left:7px;}
.mision2 p{ font-size:13px; text-align:justify; padding-top:0px;}
.mision2 h3{ font-size:16px; text-align:justify; padding-top:0px; color:#1c6eb4; padding-bottom:5px; font-weight:800; text-transform:uppercase;}
.product1{ width:95%; height:auto; float:left; margin-top:20px; margin-bottom:20px; margin-left:10px;}
.product1a { width:100%; height:auto; float:left;}
.product1a img{ width:100%;}
.product1b { width:100%; height:auto; float:left;}
.product1b h3{ font-size:15px;  padding:6px; color:#fff;  font-weight:800; background:#1c6eb4;  text-transform: initial; text-align: center; LETTER-SPACING: 0.5PX;}
.product2{ width:95%; height:auto; float:left; margin-top:20px; margin-bottom:20px; margin-left:10px;}

.sp4 { width:100%; height:auto; float:left; }
.sp3 { width:100%; height:auto; float:left; }
.sp { width:100%; height:auto; float:left; margin-bottom:10px;}
.sp1 { width:100%; height:AUTO; float:left;}
.sp2 { width:100%; height:auto; float:left; margin-left:0px;}