/*  font-family: 'PT Sans', sans-serif;
    font-family: 'Archivo Narrow', sans-serif;*/


*, html { box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
body {
  font-family: 'PT Sans', sans-serif;
  font-size: 15px;
  line-height: 1.62857143;
  color: #666;
  background: #fff url(../images/body-bg.jpg) repeat;
  
}

ul, ul li { list-style:none; padding:0; margin:0 }
.fl { float:left}
.fr { float:right}
.clear { clear:both}
strong {  font-family: 'PT Sans', sans-serif; font-weight:600}
em {  font-family: 'PT Sans', sans-serif; font-weight:400; font-style:italic}

.font-large { font-size:18px; font-family: 'open_sanssemibold';}

.alpha { padding-right:0}
.beta { padding-left:0}

.m-t-20 { margin-top:30px;}
.m-b-0 { margin-bottom:0 !important;}
.p-b-0 { padding-bottom:0 !important;}

a { color:#333}
a:hover { color:#1bb0e7}
a, a:hover { cursor:pointer; text-decoration:none; transition:all linear 0.3s; -moz-transition:all linear 0.3s; -webkit-transition:all linear 0.3s}
:focus  { outline:none !important; text-decoration:none !important}

.img-brd { border:1px solid #ccc;}


h1 { color:#19aee1; font-size:30px; text-transform:uppercase; margin-bottom:30px; font-family: 'Archivo Narrow', sans-serif; font-weight:600}
h4 { margin:30px 0 20px 0; padding:0; font-weight:600; color:#1bb0e7}
.section-spacing { padding-top:30px; padding-bottom:50px}

.breadcrumb { background-color:transparent; padding: 8px 0;}
.breadcrumb > li + li::before {
    padding: 0 5px;
    color: #888;
    content: ">";
}
.breadcrumb >li a { color:#888; font-size:14px}
.breadcrumb >li a:hover { color:#000; }
.breadcrumb > .active { color: #585858; font-size:14px}

/*----header-----*/
header { background:#fff; border-top:3px solid #ededed; width:100%; height:90px;} 
.logo { padding-top:5px}
.top-links { margin-top:5px; text-align:right}
.top-links li { text-align:right; background:url(../images/toplink-seprator.jpg) no-repeat right 8px; display:inline-block; margin-right:10px; padding-right:13px;}
.top-links li:last-child { background:none; margin-right:0; padding-right:0}
.top-links li a { font-size:13px; color:#888888}
.top-links li a:hover { font-size:13px; color:#1bb0e7}

.top-contact {margin-top:20px; text-align:right}
.top-contact  li { display:inline-block; color:#666666; font-size:16px; margin-left:20px}
.top-contact  li a {color:#666666;}
.top-contact  li a:hover {color:#1bb0e7;}
.top-contact  li i { color:#1bb0e7; margin-right:3px}
.top-contact  li i.fa-phone { font-size:18px; margin-top:2px} 
.top-contact  li i.fa-envelope { font-size:16px} 

/*----nav----*/
.menubar { background:#2a2a2a; height:46px}

/* Carousel base class */
.carousel {
  height:465px;
  margin-bottom: 30px;
  margin-top:1px;
  -webkit-box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.2); -moz-box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.2); box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.2);
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item {
  height: 465px;
  background-color: #777;
  border:1px solid #ededed
}
.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 465px;
}
/*.carousel-caption { background-color:rgba(0,0,0,0.7); bottom: 150px; }*/
.carousel-caption { background-color:rgba(0,0,0,0.7); padding: 20px; bottom: -1px; right: auto; left: 0;  }
.carousel-caption h3 {font-family: 'Archivo Narrow', sans-serif; font-size:36px; margin:0; padding:0; font-weight:600; color:#fff; text-transform:uppercase; text-shadow:none; line-height:46px}
.carousel-caption h3 span { color:#19aee1}
.carousel-indicators { width:auto; right:30px; left:auto; bottom:0; margin-left:0;}
.carousel-indicators li { background:#2a2a2a;  width: 15px; height: 15px;  border:2px solid #2a2a2a; cursor:pointer}
.carousel-indicators .active { background:#19aee1; border:2px solid #fff; width: 15px; height: 15px; cursor:pointer}


/*----Middle----*/
.mid-white { background:url(../images/shadow-bg.png) repeat-y center top; width:1190px; margin:0 auto; padding-bottom:60px;   }
	
.welcome { margin-bottom:20px}
		
.gray-bg { background:#f8f8f8; margin:0 -15px 10px -15px; padding:10px 15px} 
.prd-gallery-home li { width:24.4%; float:left; background:#fff; margin-right:0.8%; text-align:center; border:1px solid #ededed;
-webkit-box-shadow: 0px 0px 5px 1px rgba(236,236,236,1);
-moz-box-shadow: 0px 0px 5px 1px rgba(236,236,236,1);
box-shadow: 0px 0px 5px 1px rgba(236,236,236,1);}

.prd-gallery-home li:last-child { margin-right:0}

/*------image hover------*/
.caption-style-1{
		list-style-type: none;
		margin: 0px;
		padding: 0px;
		
	}

	.caption-style-1 li{
		float: left;
		padding: 0px;
		position: relative;
		overflow: hidden;
		text-align:center
	
	}

	.caption-style-1 li:hover .caption{
		opacity: 1;

	}


	.caption-style-1 img{
		margin: 0px;
		padding: 0px;
		float: left;
		text-align:center;
		z-index: 4;
	}


	.caption-style-1 .caption{
		cursor: pointer;
		position: absolute;
		opacity: 0;
		-webkit-transition:all 0.45s ease-in-out;
		-moz-transition:all 0.45s ease-in-out;
		-o-transition:all 0.45s ease-in-out;
		-ms-transition:all 0.45s ease-in-out;
		transition:all 0.45s ease-in-out;

	}
	.caption-style-1 .blur{
		background-color: rgba(0,0,0,0.65);
		height: 222px;
		width: 276px;
		z-index: 5;
		position: absolute;
	}

	.caption-style-1 .caption-text h1{
		text-transform: none;
		font-size: 18px;
		 font-weight:400;
		 padding:0px 0 7px;
		 margin:0 25px 10px 25px;
		 font-family: 'PT Sans', sans-serif; border-bottom:1px solid rgba(255,255,255,0.5)
	}
	.caption-style-1 .caption-text{
		z-index: 10;
		color: #fff;
		position: absolute;
		width: 276px;
		height: 222px;
		text-align: center;
		top:80px;
	}
	.caption-style-1 .caption-text a i { font-size:18px; color:#19aee1}
	.caption-style-1 .caption-text a:hover i { color:#fff}


/*---------contact-------*/
.contact-detail { background:#2a2a2a; width:100%; padding:20px 25px 20px 25px; height:333px}
.contact-detail li { color:#cdcdcd; font-size:15px; margin-bottom:20px; margin-left:60px; position:relative; line-height: 28px;}
.contact-detail li a {color:#cdcdcd;}
.contact-detail li a:hover {color:#19aee1;}
.contact-detail li:before {color:#fff; font-size:18px; position:absolute; left:-50px; width:30px; height:30px; border-radius:100%; background:#19aee1; font-family: 'FontAwesome'; text-align:center; vertical-align:middle; padding-top:1px}
.contact-detail li.address:before { content:'\f124';}
.contact-detail li.phone:before { content:'\f095';}
.contact-detail li.fax:before { content:''; background-image:url(../images/fax-icon.jpg); background-repeat:no-repeat; background-position: center}
.contact-detail li.email:before { content:'\f0e0'; font-size:15px}

.social { padding-left: 30px; float: right; font-size: 13px; color: #c1c1c1;}
.social a { margin-right:10px;}
.social a i { background:#888888; width:30px; height:30px; text-align:center; color:#fff; font-size:16px; border-radius:100%; padding-top:6px }

.map { width:100%; height:333px;} 

/*------footer-------*/
footer { width:100%; background:#2a2a2a; border-top:2px solid #cfcfcf; padding:20px 0}
.footer-links { margin-bottom:15px; text-align:center} 
.footer-links li { display:inline; background:url(../images/footlink-seprator.jpg) no-repeat right 7px; }
.footer-links li a { margin:0 4px; padding-right:7px; font-size:13px; color:#c1c1c1}
.footer-links li:last-child a { margin-right:0; padding-right:0}
.footer-links li a:hover { color:#fff}
.copyright { width:50%; float:left; font-size:13px; color:#c1c1c1}
.fb-share { float:right; text-align:right; width:50%} 


/*------inner pages-------*/
.page-banner { width:100%; float:left;  height:197px; margin-top:1px; position:relative; overflow: hidden;
  -webkit-box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.2); -moz-box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.2); box-shadow: 0px 3px 4px 0px rgba(0,0,0,0.2); }
 .page-banner img { width:100%; position:relative} 
.page-banner .blur-black { position:absolute; width:100%; left:0; top:0; background-color:rgba(0,0,0,0.3); z-index:99; height:200px}
/*.page-banner .page-name { font-size:48px; color:#fff; font-weight:600; text-transform:uppercase; position:absolute; z-index:999; top:60px; background-color:transparent; width:100%; text-align:center;}*/
.page-banner .page-name { font-size:48px; color:#fff; font-weight:600; text-transform:uppercase; position:absolute; z-index:999; bottom:0; background-color:rgba(0,0,0,0.7); width:auto; padding: 0 20px; text-align:center;}
.page-content p { margin-bottom:15px;}
.page-content li { margin-bottom:10px; background:url(../images/bullet.jpg) no-repeat left 10px; padding-left:15px;}
.page-content li ul { margin-top:15px; margin-left:10px}


.top-management .img-box{  border:2px solid #5e5e5e; width:100%; position:relative }
.top-management .img-box img { width:100%}
.top-management .img-box .img-caption { position:absolute; left:0; width:100%; bottom:0; background-color:rgba(0,0,0,0.8); text-align:center; color:#fff; font-size:13px; padding:5px 5px 5px;}
.top-management .img-box .img-caption h5 { font-size:18px; padding:0; margin:0 0 3px 0;}
.top-management .img-box .img-caption p { line-height:18px; margin-bottom:5px}

.product-gallery li { background-image:none; margin-bottom:20px;}
.product-gallery li div {margin-left:0; height:200px; border:1px solid #ccc; text-align:center; padding:1px}
.product-gallery li img { width:100%; max-height:200px; height:auto; }
.product-gallery li p { color:#444; font-weight:600; color:#666; margin-bottom:0; text-align:center; margin-top:5px}


.equipments-table { border:1px solid #ccc; margin-bottom:20px}
.equipments-table th { padding:7px 10px;  background:#19aee1; color:#fff; text-transform:uppercase; font-weight:600; border-right:1px solid #5fd3fb}
.equipments-table tr { background:#fff}
.equipments-table tr:nth-child(2n) { background:#f7f7f7}
.equipments-table td { padding:7px 10px; border-top:1px solid #eee; border-right:1px solid #eee; font-size:14px}
.equipments-table td:last-child { border-right:0}

.manufacturing-process li { margin-left:50px; margin-bottom:15px; padding-left:0; background-image:none; position:relative}
.manufacturing-process li span { margin-left:-30px; position:absolute}