@charset "utf-8";
/* CSS Document */

/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */

body {
  padding-bottom: 40px;
  color:#000;
}

@font-face {
    font-family: 'arsenalregular';
    src: url('../fonts/arsenal-regular-webfont.eot');
    src: url('../fonts/arsenal-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/arsenal-regular-webfont.woff2') format('woff2'),
         url('../fonts/arsenal-regular-webfont.woff') format('woff'),
         url('../fonts/arsenal-regular-webfont.ttf') format('truetype'),
         url('../fonts/arsenal-regular-webfont.svg#arsenalregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'bernard_mt_condensedregular';
    src: url('../fonts/bernard-mt-condensed-webfont.eot');
    src: url('../fonts/bernard-mt-condensed-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/bernard-mt-condensed-webfont.woff2') format('woff2'),
         url('../fonts/bernard-mt-condensed-webfont.woff') format('woff'),
         url('../fonts/bernard-mt-condensed-webfont.ttf') format('truetype'),
         url('../fonts/bernard-mt-condensed-webfont.svg#bernard_mt_condensedregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'oswaldextralight';
    src: url('../fonts/oswald-extralight-webfont.eot');
    src: url('../fonts/oswald-extralight-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/oswald-extralight-webfont.woff2') format('woff2'),
         url('../fonts/oswald-extralight-webfont.woff') format('woff'),
         url('../fonts/oswald-extralight-webfont.ttf') format('truetype'),
         url('../fonts/oswald-extralight-webfont.svg#oswaldextralight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'quicksandregular';
    src: url('../fonts/quicksand-regular-webfont.eot');
    src: url('../fonts/quicksand-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/quicksand-regular-webfont.woff2') format('woff2'),
         url('../fonts/quicksand-regular-webfont.woff') format('woff'),
         url('../fonts/quicksand-regular-webfont.ttf') format('truetype'),
         url('../fonts/quicksand-regular-webfont.svg#quicksandregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */

/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 100;
  font:normal 16px/20px oswaldextralight;
}

/* Flip around the padding for proper display in narrow viewports */
.navbar-wrapper > .container {
  padding-right: 0;
  padding-left: 0;
}
.navbar-wrapper .navbar {
  padding-right: 15px;
  padding-left: 15px;
}
.navbar-wrapper .navbar .container {
  width: auto;
}
nav h1{
	font:normal 36px/40px bernard_mt_condensedregular;
	padding-left:20px;
	color:#000;
	
}

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  height: 715px;
  margin-bottom: 60px;
}
/* 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:775px;
  background-color: #777;
}
.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 775px;
}


/* MARKETING CONTENT
--------------------------------------------------  */
.marketing{
	padding:25px 0px 45px;
}

.marketing img{
	display:table;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:-100px;
}
.marketing .product a img{
	border:1px solid #a1a294;
	border-radius:50%;
	transition:.3s;
}
.marketing .product a:hover img{
	border:10px solid #a1a294;
	border-radius:50%;
}

.marketing .quality a img{
	border:1px solid #a1a294;
	border-radius:50%;
	transition:.3s;
}
.marketing .quality a:hover img{
	border:10px solid #a1a294;
	border-radius:50%;
}

.marketing .achive a img{
	border:1px solid #a1a294;
	border-radius:50%;
	transition:.3s;
}
.marketing .achive a:hover img{
	border:10px solid #a1a294;
	border-radius:50%;
}

.marketing .client a img{
	border:1px solid #a1a294;
	border-radius:50%;
	transition:.3s;
}
.marketing .client a:hover img{
	border:10px solid #a1a294;
	border-radius:50%;
}

.marketing h2{
	text-align:center;
	color:#FFF;
	padding: 138px 0px 58px;
	font: normal 30px/30px oswaldextralight;
	margin-bottom:0px;
}
.marketing .btn-product{
	background-color:#a1a294;
	transition:.8s;
}
.marketing .btn-product:hover{
	background-color:#7E8070;
	border-right:3px solid #585954;
	border-bottom:3px solid #585954;
	text-decoration:none;
}

.marketing .btn-quality{
	background-color:#737776;
	transition:.8s;
}
.marketing .btn-quality:hover{
	background-color:#7E8070;
	border-right:3px solid #585954;
	border-bottom:3px solid #585954;
	text-decoration:none;
}

.marketing .btn-achive{
	background-color:#464646;
	transition:.8s;
}
.marketing .btn-achive:hover{
	background-color:#6C6B6B;
	border-right:3px solid #5D7522;
	border-bottom:3px solid #5D7522;
	text-decoration:none;
}
.btn-client{
	background-color:#9ac039;
	transition:.8s;
}
.btn-client:hover{
	background-color:#77952D;
	border-right:3px solid #585954;
	border-bottom:3px solid #585954;
	text-decoration:none;
}
.button{
	padding:25px 30px;
	color:#FFF;
}

.marketing .bgcol{
	background-color:#f0f2f1;
	padding: 40px 25px;
	margin-bottom: 23px;
	text-align:justify;
	color:#000;
}
.marketing .bgcol ul{
	padding-left:0px;
}


/* aboutus
------------------------- */
.aboutus{
	padding:10px 0px;
}

.aboutus h1{
	font:normal 42px/45px arsenalregular ;
	text-align:left;
	color:#959292;
}
.aboutus h4{
	font:normal 20px/20px quicksandregular;
	text-align:left;
}
.aboutus img{
	border-radius:50%;
	float:left;
	padding: 10px 12px 10px 0px;
}
.aboutus p{
	color:#000;
	text-align:justify;
	margin-bottom:30px;
}
.aboutus p br{
	margin-bottom:15px;
}
.aboutus .green{
	color:#9cc037;
}

/* Director speech
------------------------- */
.speech{
	background-color:#000;
	padding: 30px 0px 15px;
}
.speech img{
	width:110px;
	max-width:100%;
	height:auto;
	border-radius:100px;
}
.speech h1{
	color:#FFF;
	text-align:center;
	margin: 35px;
}
.speech h4{
font: 18px/30px Arial,Helvetica,sans-serif;
text-align: center;
color: #FFCE1A;
border-bottom: 1px solid #FFF;
padding-bottom: 20px;
margin-bottom: 15px;
}
.speech p{
	padding:15px;
	background-color:#FFCE1A;
	color:#000;
	border-radius:3px;
	margin-bottom:0px;
}
.speech .arrow{
	margin-left:35px;
	width:0px;
	border-top: 10px solid #FECE1A;
	border-left: 20px outset transparent;
	border-right: 20px outset transparent;
}
.speech img{
	margin:10px 10px 25px;
	float:left;
}
.speech h5{
	color:#FECE1A;
	font-size: 16px;
	font-weight:600;
	margin-bottom:0px;
}
.speech h6{
	color:#FECE1A;
	font-size: 12px;
	margin-top:5px;
}
/* News and Announcement
------------------------- */
.news{
	padding: 30px 0px 15px;
}
.news h1{
	color:#3c4348;
	text-align:center;
	border-bottom:3px solid #d05b3a;
	padding-bottom:18px;
	margin-bottom: 30px;
}
.news h3{
	color: #3C4348;
	text-align: center;
	border-bottom: 2px solid #EAEAEA;
	padding-bottom: 5px;
	margin-bottom: 30px;
	font: 22px arsenalregular;
}

.news img{
	margin:20px auto;
	display:table;
	max-width:100%;
	border: 1px solid #A1A1A1;
	border-radius:5px;
}
.news p{
	color:#969695;
	margin:0 7%;
	text-align:justify;
}
.news p span{
	text-align:right;
	clear:both;
}

/* footer
-------------------------------------------------- */
footer{
	background-color:#484747;
	padding:70px 0px 25px;
	color:#969695;
	font-size:13px;
}
footer h5{
	font-size:16px;
	color:#FFF;
	text-align:left;
	font-weight:600;
}
footer ul{
	padding:0px;
}
footer ul li{
	list-style:none;
}
footer ul li a{
	text-decoration:none;
	color:#969695;
}
footer ul li a:hover {
	color:#e95617;
	text-decoration:none;
}
footer .online{
	border-left: 1px solid #5b5b5b;
	padding-left:12px;
}
footer .online ul{
	clear:both;
}
footer .online ul li{
	float:left;
	padding: 7px 20px 55px 0px;
}
footer .online a{
	text-decoration:none;
	font-size:30px;
	font-weight:600;
	color:#FFF;
}
footer .online a:hover{
	color:#CCC;
}
footer .online ul li i{
	color:#FFF;
	font-size:30px;
	padding-top:7px;
}
footer .online ul li i:hover{
	color:#CCC;
}
footer .online .btn{
	background-color:#dd6226;
	height:41px;
	color:#FFF;
}
footer .centre{
	text-align:center;
	padding: 15px 0px 10px;
	color:#696969;
}

/* achievement CSS
-------------------------------------------------- */
.achievement{
	background-color:#EFE4FE;
	padding:30px 0px;
}
.achievement h1{
	font:normal 37px/40px arsenalregular;
	text-align:center;
	color:#000;
}
.achievement h4{
	font:normal 18px/30px arsenalregular;
	text-align:center;
	color:#000;
	border-bottom: 1px solid #000;
	padding-bottom:20px;
	margin-bottom:15px;
}

.achievement p{
	width:100%;
	background-color:#000;
	display:block;
	color:#FFF;
	padding:5px;
	text-align:justify;
	font-size:12px;
}

.achievement img{
	max-width:100%;
	margin:auto;
	display:table;
}

/* RESPONSIVE CSS
-------------------------------------------------- */
.contact {
	padding:30px 0px;
}
.contact h5 {
	font-weight:600;
	color:#A2A2A2;
	font-size:18px;
}


.contactbg {
	background-image:url(../images/contact-banner.jpg);
	background-size:cover;
	display:block;
}
.aboutbg {
	background-image:url(../images/banner3.jpg);
	background-size:cover;
	display:block;
}
.productbg{
	background-image:url(../images/production-banner.jpg);
	background-size:cover;
	display:block;
}
.achievementbg{
	background-image:url(../images/achievment-banner.jpg);
	background-size:cover;
	display:block;
}
.qualitybg{
	background-image:url(../images/quality-control.jpg);
	background-size:cover;
	display:block;
}
.clientbg{
	background-image:url(../images/client-banner.jpg);
	background-size:cover;
	display:block;
}
.banner h1 {
	text-align:center;
	font: 600 40px arsenalregular;
	color:#FFF;
	vertical-align:middle;
	line-height:350px;
	margin:0px;
	text-shadow: 0 0 6px #000;
}


/*Quality Control
-------------------------------------------------- */
.qualitycontrol{
	background-color:#FEECFE;
	padding:35px 0px 20px;
}
.qualitycontrol h1{
	text-align:center;
	font:37px/40px arsenalregular;
}
.qualitycontrol ol{
	padding: 5px 10px;
	font: normal 16px arsenalregular;
	list-style-type:square;
}
.qualitycontrol ol li{
	padding-bottom:10px;
	text-align:justify;
}
.qualitycontroltable{
}

/* client CSS
-------------------------------------------------- */
.client{
	background-color:#FEFAEF;
}

.client h2{
	text-align:center;
	font: normal 36px/45px Arial, Helvetica, sans-serif;
}
.client h3{
	text-align:center;
	font: normal 16px/20px arsenalregular;
}

#owl-demo .item{
        margin: 10px 0px 5px;
    }
.client #owl-demo .item img{
        display: block;
		width:210px;
        max-width: 100%;
        height: auto;
		border: 3px solid #EDECEC;
		border-radius:7px;
		padding: 5px;
		margin:auto;
    }


/* products CSS
-------------------------------------------------- */
.product{
	background-color:#FEFAEF;
}

.product h2{
	text-align:center;
	font: normal 36px/45px Arial, Helvetica, sans-serif;
}
#owl-demo .item{
        margin: 10px 0px 5px;
    }
    #owl-demo .item img{
        display: block;
        max-width: 100%;
        height: auto;
		border:6px solid #E4E4E4;
    }
	
	
/* RESPONSIVE CSS
-------------------------------------------------- */
@media (max-width: 767px) {
  /* Navbar positioning foo */
  nav h1 {
    font: 26px/30px bernard_mt_condensedregular;
    padding-left: 20px;
    color: #000;
  }

}

@media (min-width: 768px) {
  /* Navbar positioning foo */
  .navbar-wrapper {
    margin-top:0px;
  }
  .navbar-wrapper .container {
    padding-right: 15px;
    padding-left: 15px;
  }
  .navbar-wrapper .navbar {
    padding-right: 0;
    padding-left: 0;
  }

  /* The navbar becomes detached from the top, so we round the corners */
  .navbar-wrapper .navbar {
    border-radius: 4px;
  }

  /* Bump up size of carousel content */
  .carousel-caption p {
    margin-bottom: 20px;
    font-size: 21px;
    line-height: 1.4;
  }

  .featurette-heading {
    font-size: 50px;
  }
}

@media (min-width: 992px) {
  .featurette-heading {
    margin-top: 120px;
  }
}