@import url(https://fonts.googleapis.com/css?family==Source+Sans+Pro);
/************************************************************************************
RESET
*************************************************************************************/
html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre,  ul,
dd, dt, li, tfoot, button, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, tt, var, legend, fieldset {
	margin: 0;
	padding: 0;
}

img, fieldset {
	border: 0;
}

/* set image max width to 100% */
 

/* set html5 elements to block */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
    display: block;
}
::selection {
	background: #2a7391;
	color:#FFF;  
	}
::-moz-selection {
	background: #2a7391;
	color:#FFF; 
}

/************************************************************************************
GENERAL STYLING
*************************************************************************************/
body {
	font-family: Arial, Helvetica, sans-serif;
	color:#000;
	font-size:12px;
	background:url(../images/bg.jpg) repeat;
	border-top:3px solid #90352a;
	 
}
a {
	color: #757171;
	text-decoration: none;
	outline: none;
}

p {
	margin: 0 0 1.2em;
	padding: 0;
}
A:focus{
	outline:none;
}
*:focus{
	outline:none;
}


/* reset webkit search input styles */
input[type=search] {
	-webkit-appearance: none;
	outline: none;
}
input[type="search"]::-webkit-search-decoration, 
input[type="search"]::-webkit-search-cancel-button {
	display: none;
}
/************************************************************************************
FONT FACE
*************************************************************************************/

/************************************************************************************
STRUCTURE
*************************************************************************************/

.wrapper{
	width:1200px;
	margin:0 auto;
}
.wrapper2{
	width:1177px;
	margin:0 auto;
	padding:77px 2% 19px 2%;
}
header{
	width:100%;
	height:auto;
	position:relative;
	background-color:#FFF;
}
.logo{
	float:left;
	position:relative;
	padding-top:1em;
	padding-bottom:1.3em;
}
.logo img{
	width:auto;
	height:100px;
}

@media (max-width: 500px) {
.logo{
	padding-top:0.4em;
	padding-bottom:0.4em;
}
.logo img{
	width:auto;
	height:80px;
}
}
.menutop{
	width:680px;
	height:auto;
	float:right;
	padding-top:20px;
}
.menutopph{
	width:auto;
	height:auto;
	font-family: 'Source Sans Pro';
	font-size:18px;
	margin-top:12px;
	padding-left:3.5%;
	color:#8b8b8b;
	background:url(../images/contactimg.jpg) no-repeat left center;
	float:left;
}
.menutopsoc{
	width:auto;
	height:auto;
	float:left;
	margin-top:12px;
	margin-right:2%;
	
	display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;	
}
.menutopsoc:hover, .menutopsoc:focus, .menutopsoc:active {
  -webkit-transform: translateY(-8px);
  transform: translateY(-8px);
}

.menutopsearchbox{
	width:221px;
	height:35px;
	float:left;
	border-radius:5px;
	border:1px solid #dfdfdf;
}
#search           { float:left;padding:10px 0 0 17px;}
#search .tfl      {
background-image:url(../images/google_custom_search_watermark.gif);
       background-repeat:no-repeat;
       background-position:2px;
       color:transparent; 
	    border:1px solid #d9d9d9; padding:2px 0 2px 5px; width:184px;
}
#search .tfl:focus{background-image:none;color:black;}
#search .sbt-btn  { border:0; width:20px; height:17px; background:url(../images/search-icon.png) no-repeat transparent; 
                                     color:ffffff; font-size:0px; position:relative; margin-left:10px; top:-7px; cursor:pointer}
									 
.menutopform{
	width:144px;
	height:24px;
	float:left;
	border:none;
	outline:none;
	margin-left:1%;
	border-right:5px;
	margin-top:2px;
}
.menutopsrchicon{
	width:auto;
	height:auto;
	float:right;
	margin-top: 8px;
	margin-right: 2%;
	margin-bottom: 0;
	margin-left: 0%;
}
.menutopmail{
	width:auto;
	height:auto;
	float:left;
	margin:12px 3% 2% 3%;
	border-left:1px solid #d9d9d9;
	border-right:1px solid #d9d9d9;
	padding:0 3%;
}
.buttonbg{
	height:auto;
	float:right;
	margin-top:26px; 
}

	
.boxesmain{
	width:100%;
	height:auto;
	background-color:#f3f3f3;
}
.boxesmain2{
	width:100%;
	height:auto;
	background-color:#FFF;
}
.box{
	width:22.6%;
	height:auto;
	float:left;
	padding-bottom:20px;
	background-color:#FFF;
	margin:0 1.2% 38px 1.2%;
}

.wrapper2 .box img{
	width:100%;
	height:200px;
	display:block;
	
}


.box1{
	width:30%;
	height:auto;
	float:left;
	padding-bottom:20px;
	background-color:#FFF;
	margin:0 1.2% 38px 1.2%;
}

.wrapper .box1 img{
	width:100%;
	height:200px;
	display:block;
	
}


.boximgbg{
	width:100%;
	height:auto;
	float:left;
	background-color:#036;
}
.boximgbg img{
	width:100%;
	height:auto;
	display:block;
	
}

@media screen and (max-width:685px){
.wrapper2 .box img{
	height:140px;
	
}

.wrapper .box1 img{
	height:140px;
	
}
	}
.box h1{
	width:100%;
	height:32px;
	font-family: 'Source Sans Pro';
	font-size:16px;
	color:#b04545;
	line-height:14px;
	font-weight:bold;
	float:left;
	text-align:center;
	padding-top:20px;
}

.box h4{
	width:80%;
	font-family: 'Source Sans Pro';
	font-size:12px;
	color:#878585;
	margin:0 10%;
	line-height:14px;
	font-weight:normal;
	float:left;
	text-align:center;
}

.box1 h1{
	width:100%;
	height:32px;
	font-family: 'Source Sans Pro';
	font-size:16px;
	color:#b04545;
	line-height:14px;
	font-weight:bold;
	float:left;
	text-align:center;
	padding-top:20px;
}

.box1 h4{
	width:80%;
	font-family: 'Source Sans Pro';
	font-size:12px;
	color:#878585;
	margin:0 10%;
	line-height:14px;
	font-weight:normal;
	float:left;
	text-align:center;
}

.redbg{
	width:100%;
	height:auto;
	background-color:#a91f27;
	overflow-y: hidden;
}
.workshopbg{
	width:33.6%;
	height:166px;
	float:left;
}
.workshoplt{
	width:55.6%;
	height:auto;
	float:left;
}
.workshoplt img{
	display:block;
	width:100%;
	height:auto;
}
.workshoprt{
	width:44%;
	height:auto;
	float:left;
	font-family: 'Source Sans Pro';
	font-weight:bold;
	font-size:36px;
	padding-top:14.5%;
	color:#FFF;
	line-height:30px;
}
.semitext{
	font-family: 'Source Sans Pro';
	font-weight:bold;
	font-size:30px;
}
.workshop_subhed{
	width:17.6%;
	height:auto;
	float:left;
	padding:9px 0 9px 1%;
	margin-top:4.3%;
	font-family: 'Source Sans Pro';
	font-weight:bold;
	font-size:18px;
	color:#FFF;
}

.workshop_subhedrt{
	width:17.7%;
	height:auto;
	float:left;
	padding:9px 0 9px 1%;
	margin-top:4.3%;
	font-family: 'Source Sans Pro';
	font-weight:bold;
	border-left:1px solid #be555b;
	font-size:18px;
	color:#FFF;
}
.workshop_mapbg{
	width:25.1%;
	height:auto;
	float:right;
}
.workshop_mapbg iframe{
display:block;	box-shadow: 0 0 60px -15px #000;

}
.clientslidermain{
	width:100%;
	height:auto;
	background-color:#fff;
}
.clientslider{
	width:100%;
	height:auto;
	padding:45px 0 63px 0px;
}
footer{
	width:100%;
	height:192px;
	background-color:#231f20;
}

.ftrleft{
	width:590px;
	height:auto;
	margin-top:50px;
	float:left;
}
.ftrleft_common{
	width:100%;
	height:auto;
}
.ftrbtn{
	width:auto;
	height:auto;
	float:left;
	font-family: 'Oswald-Regular';
	font-size:14px;
	color:#696565;
	padding:10px 20px;
}
.ftrbtn a{
	font-family: 'Oswald';
	font-size:14px;
	color:#696565;
}
.copy{
	width:96.5%;
	height:auto;
	float:left;
	font-family: 'Source Sans Pro';
	font-size:14px;
	padding-left:3.5%;
	margin-top:30px;
	color:#757171;
}

.ftrlogo{
	width:auto;
	height:auto;
	float:right;
	margin-top:62px;
}
	
/*=======================INNER STYLE STARTING====================*/

.innerbanner{
	width:100%;
	height:236px;
	background:url(../images/download/dasar.jpg) no-repeat center;
}
.innerbanner h1{
	width:100%;
		font-family: 'Oswald';
	font-weight:bold;

	font-size:14px;
	padding-top:48px;
	color:#FFF;
}
.innerbanner h2{
	width:100%;
	font-family: 'Source Sans Pro';
	font-weight:bold;
	font-size:60px;
	line-height:48px;
	padding-top:15px;
	color:#FFF;
}
.innerlt{
	width:79.3%;
	height:auto;
	position:relative;
	float:left;
	
}

.innerlt_imagebg{
	width:42.4%;
	height:auto;
	float:left;
	background-color:#060;
	margin:0 4% 4% 0;
}
.innerlt_imagebg img{
	width:100%;
	height:auto;
	display:block;
}

#commondiv{
	width:100%;
	height:auto;
	float:left;
}

.innerlt_imagebg2{
	width:100%;
	height:auto;
	float:right;
	background-color:#060;
	margin:0 0 4% 4%;
}
.innerlt_imagebg2 img{
	width:100%;
	height:auto;
	display:block;
}
.innerlt_imagebg3{
	width:37%;
	height:auto;
	float:right;
	background-color:#060;
	margin:0 0 4% 4%;
}
.innerlt_imagebg3 img{
	width:100%;
	height:auto;
	display:block;
}

.innerlthed{
	width:100%;
	height:auto;
	float:left;
	font-family: 'Source Sans Pro';
	font-weight:bold;
	font-size:56px;
	color:#90352a;
	padding:58px 0 38px 0;
}

.innerlthedbtnbg{
	width:195px;
	height:30px;
	position:absolute;
	right:0;
	font-family: 'Source Sans Pro';
	font-size:14px;
	color:#000000;
	top:75px;
}
#active{
	color:#b64747;
}
.innercontentbg{
	width:97%;
	height:auto;
	float:left;
	padding:23px 3% 30px 0;
	border-right:1px solid #dedede;
	border-top:1px solid #dedede;
	color:#545253;
	line-height:24px;
	font-family: 'Source Sans Pro';
	font-size:14px;
}

@media (max-width: 500px) {
.innercontentbg{
	width:100%;
	padding:53px 3% 100px 0;
	line-height:24px;
	text-align:justify;
	font-family: 'Source Sans Pro';
	font-size:14px;
}
.innercontentbg ul li{
margin-left:15px;
}
}
.textbold{
	color:#000000;
	font-family: 'Source Sans Pro';
	font-size:18px;
}

.inner_rt{
	width:19.2%;
	height:auto;
	float:right;
	padding-top:42px;
}
	
.inner_rtbox{
	width:100%;
	height:auto;
	float:left;
	-webkit-filter: grayscale(0);
	filter: grayscale(0);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.inner_rtbox img{
	width:auto;
	height:180px;
}
.inner_rtbox:hover{
-webkit-filter: grayscale(30%);
	filter: grayscale(100%);
}


.bulletbg{
	width:36%;
	height:auto;
	padding:5px 0 5px 5%;
	background:url(../images/bulleticon.jpg) no-repeat left top 10px;
	margin-bottom:1px;
}

.bulletbg2{
    width:45%;
    height:auto;
    float:left;
    padding:5px 0 5px 5%;
    background:url(../images/bulleticon.jpg) no-repeat left top 10px;
    margin-bottom:1px;
}

.bulletbg3{
    width:80%;
    height:auto;
    padding:5px 0 5px 5%;
    background:url(../images/bulleticon.jpg) no-repeat left top 10px;
    margin-bottom:1px;
}

.bulletbg3 a{
	color:#545253;
}

.gallery_bg{
	width:57%;
	height:auto;
	float:right;
	padding:15px;
}

.gallery_bg2{
	width:57%;
	height:auto;
	float:right;
	margin:0 0 3% 3%;
}
.productbox{
	width:29.8%;
	height:auto;
	float:left;
	position:relative;
	margin:0 3.5% 3.5% 0;
	background-color:#999;	
}




.productbox img{
	width:100%;
	height:200px;
	display:block;
}

.mid-top {
	width:100%;
	position:relative;
	z-index:10;
	float:left;
	overflow: hidden;
	-webkit-transition: all 700ms ease;
	-moz-transition: all 700ms ease;
	-ms-transition: all 700ms ease;
	transition: all 700ms ease;
}
.mid-top img {
	width:100%;
	height:200px;
	display:block;
	-webkit-transition: all 700ms ease;
	-moz-transition: all 700ms ease;
	-ms-transition: all 700ms ease;
	transition: all 700ms ease;
}
.mid-top:hover img {
	-moz-transform:scale(1.1);
	-webkit-transform:scale(1.1);
	-o-transform:scale(1.1);
}

.productbox_caption{
	width:98%;
	height:auto;
	z-index:50;
	position:absolute;
	bottom:0px;
	padding:2px 1%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	text-align:center;
	color:#FFF;
  background: rgba(188, 10, 19, 0.7);
}
@media screen and (max-width: 500px) {

.gallery_bg{
	width:100%;
	height:auto;
	float:right;
	margin:0;	padding:0;

}
.productbox img{
	width:100%;
	height:160px;
	display:block;
}
}
.clientsbg{
	width:22.5%;
	height:auto;
	float:left;
	margin:0 1% 1% 0;
}
.clientsbg img{
	width:100%;
	height:auto;
	display:block;
}
.contactlt{
	width:48%;
	height:auto;
	float:left;
}
.contactrt{
	width:48%;
	height:auto;
	float:right;
}
.map_bg{
	width:100%;
	height:auto;
	float:left;
	margin-top:15px;
}
	
/*  Clearfix
------------------------------------------------------------------------------*/
.clearfix:before,
.clearfix:after {
	content: "";
	display: table;
}
.clearfix:after {
	clear: both;
}
.clearfix {
	zoom: 1;
}
.clear {
	clear:both;
	height:0;
}