/************** Import CSS Reset  *****************/
@import url("reset.css");

/********************************* General Seting *********************************/
body{
	font-size: 15px;
	color: #616060;
	background:url(../images/bg.jpg) no-repeat fixed center top;
	font-family:Arial, Helvetica, sans-serif;
	line-height: 15px;
	background-color: #c6c6c6;
}


a{
	color:#0474b6;
	text-decoration: none;
	transition: color 0.1s linear;
	-moz-transition: color 0.1s linear; 
	-webkit-transition: color 0.1s linear;
	-o-transition: color 0.1s linear;	
}
a:hover{color:#666666;}


h1,
h2,
h3,
h4,
h5,
h6{
	color: #0474b6;
	line-height: 1.1em; 
	font-weight: normal;
	text-transform:uppercase;
}

h1{
	font-size: 48px;
	margin-bottom: 15px;
	background:url(../images/divider-one-two.png) no-repeat bottom center;

}
h2{
	font-size: 40px;
	margin-bottom:13px;
}
h3{
	font-size: 25px;
	margin-bottom:10px;
}
h4{
	font-size: 19px;
	margin-bottom:7px;
	line-height: 24px;
	}
h5{
	font-size: 12px;
	margin-bottom:5px;
	}
h6{
	font-size: 20px;
	margin-bottom: 3px;
	text-transform: capitalize;
	}
h7{
	font-size: 13px;
	margin-bottom:3px;
	color: #696969;
	font-family:Arial, Helvetica, sans-serif;
	line-height: 10px;
	}
h8{
	font-size: 15px;
	margin-bottom:3px;
	color: #696969;
	font-family:Arial, Helvetica, sans-serif;
	line-height: 18px;
	font-weight: bold;
	text-transform:uppercase;
	}
h9{
	font-size: 9px;
	vertical-align: super;
	line-height: 2px;
	}
h10{
	font-size: 14px;
	line-height: 17px;
	}


h1,
h2,
h3,
h4,
h5,
h6,
#menu a,
.bt,
.font{
	font-family: 'Oswald', sans-serif;
}

p{
	line-height: 20px;
	margin-bottom: 10px;
}

p2{
	line-height: 13px;
	margin-bottom: 0px;
}

ul{list-style:none;}


.left{float: left;}
.right{float: right;}
.last{margin-right: 0 !important;}


.clearfix:after{
	content:  ".";
	display:  block;
	height:  0;
	clear:  both; 
	visibility:  hidden;
}

.clearfix{display:  inline-block;}
.clearfix{display:  block;} 
.clear{clear:both;}

.wrapper{
	width:960px;
	margin:0 auto;
}
.wrapper2{
	width: 650px;
	margin: 0 auto;
}
.portfolio-wraper{
	padding:0 10px;
}
.scrol-page{
	margin-bottom:600px;
	padding-top:80px;
	position:relative;
	}
.scrol-page.last{margin-bottom:100px;}
	
.font{
	color:#7a7a7a;
}

.loading{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:100000;
	background:url(../images/loader.gif) no-repeat center center #fff;
}
.vertical-line {
	position:absolute;
	height:400px;
	width:23px;
	margin-left: 370px;
	background:url(../images/line.png) no-repeat;
	margin-top: 50px;
}
.vertical-line2 {
	position:absolute;
	top:100px;
	left:370px;
	height:400px;
	width:23px;
	background:url(../images/line.png) no-repeat;
}
	
.divider{
	height:2px;
	margin-top:30px;
	margin-bottom:30px;
	background:url(../images/page-title-divider.jpg) no-repeat bottom center;
}
/********************************* End General Seting *********************************/


/********************************* Start Header *********************************/
#header{
	width:100%;
	height:62px;
	margin-bottom:50px;
	position:fixed;
	z-index:1100;
	background:url(../images/header-bg.png) repeat-x;
}
	
	/*LOGO*/
	#logo{
		float:left;
		margin-top:18px;
	}
	
	/*MENU*/
	#menu{
		float:right;
		margin-top:23px;
	}
	#menu li{
		float:left;
		margin-left:15px;
		text-transform:uppercase;
	}
	#menu a{
		color:#ffffff;
		font-size:13px;
		}
	#menu a:hover, #menu a.active{color:#0474b7;}
/********************************* End Header *********************************/


/********************************* Start Home *********************************/

}
.home-name{text-align:right;}
.home-name p{
	margin-bottom:0px !important;
	margin-top:90px;
}
.home-text p{margin-top:10px;}
.home-foto .image{margin-left:15px;}
.space{height:50px;}

	/*ROUND IMAGE*/
	.foto{
	width:500px;
	height:360px;
	margin-left:3px;
	overflow:hidden;
	padding-top: 20px;	
	}
	.foto2{
	width:500px;
	height:330px;
	margin-left:3px;
	overflow:hidden;
	padding-top: 20px;	
	}
	}
	.fotosmall{
	width: 100px;
	height: 150px;
	margin-left: 3px;
	padding-top: 10px;
	padding-right: 20px;
	}
	.foto3{
	width:500px;
	height:450px;
	margin-left:3px;
	overflow:hidden;
	padding-top: 20px;	
}
	.foto4{
	width:500px;
	height:380px;
	margin-left:3px;
	overflow:hidden;
	padding-top: 20px;	
}
	.foto5{
	width:500px;
	height:403px;
	margin-left:3px;
	overflow:hidden;
	padding-top: 20px;	
	}
	.foto img{
		position:relative;
		z-index:-1;
		margin:1px 0 0 1px;
	}

	/*RECENT WORK*/
	.recent-work{
		height:240px;
		position:relative;
		background:url(../images/recent-work-bg.png) no-repeat;
	}
	.recent-work ul{padding-left:30px;}
	.recent-work li{
	float:left;
	margin:41px 30px 0 0;
	position:relative;
	}
	.recent-work img{
	position:relative;
	z-index:1;
	}
	.recent-work .title{
		position:absolute;
		top:-27px;
		left:50%;
		margin-left:-95px;
		height:35px;
		width:216px;
		text-align:center;
		text-transform:uppercase;
		font-size:12px;
		color:#cccccc;
		line-height:33px;
		background:url(../images/recent-work-title.png) no-repeat;
	}
	.backtotop{
	height:35px;
	width:151px;
	text-align:center;
	text-transform:uppercase;
	font-size:13px;
	margin-left: 800px;
	margin-top: 60px;
	margin-bottom: 30px;
	padding-top: 5px;
	background:url(../images/back_to_top.png) no-repeat;
	}
	.recent-work .promo1text{
		position:absolute;
		top:15px;
		text-align:center;
		text-transform:uppercase;
		font-size:16px;margin-left:20px;
		height:125px;
		width:125px;
		color:#aaaaaa;
		line-height:18px;
	}
	.recent-work .promo1{
	position:absolute;
	top:40px;
	left:40px;
	margin-left:-20px;
	height:131px;
	width:125px;
	color:#cccccc;
	line-height:33px;
	z-index: 100;
	background:url(../images/promo1.png) no-repeat;
			
}	
	.recent-work .promo1text2{
		position:absolute;
		top:177px;
		text-align:center;
		font-family:Arial, Helvetica, sans-serif;
		font-size:12px;margin-left:20px;
		width:140px;
		color:#cbcbcb;
		line-height:14px;
	}
	.recent-work .promo2text{
		position:absolute;
		top:15px;
		text-align:center;
		text-transform:uppercase;
		font-size:16px;margin-left:180px;
		width:180px;
		color:#aaaaaa;
		line-height:18px;
	}
	.recent-work .promo2{
		position:absolute;
		top:40px;
		left:210px;
		height:131px;
		width:125px;
		color:#cccccc;
		line-height:33px;
		z-index: 100;
		background:url(../images/promo2.png) no-repeat;
			
}	
	.recent-work .promo2text2{
		position:absolute;
		top:177px;
		text-align:center;
		font-family:Arial, Helvetica, sans-serif;
		font-size:12px;margin-left:180px;
		width:180px;
		color:#cbcbcb;
		line-height:14px;
	}
	.recent-work .promo3text{
		position:absolute;
		top:15px;
		text-align:center;
		text-transform:uppercase;
		font-size:16px;margin-left:370px;
		width:190px;
		color:#aaaaaa;
		line-height:18px;
	}
	.recent-work .promo3{
		position:absolute;
		top:40px;
		left:400px;
		height:180px;
		width:135px;
		color:#cccccc;
		line-height:33px;
		z-index: 100;
		background:url(../images/promo3.png) no-repeat;
			
}	
	.recent-work .promo3text2{
	position:absolute;
	top:177px;
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	margin-left:390px;
	width:145px;
	color:#cbcbcb;
	line-height:14px;
	}
	.recent-work .promo4text{
	position: absolute;
	top: 16px;
	text-align: center;
	text-transform: uppercase;
	font-size: 16px;
	margin-left: 540px;
	width: 230px;
	color: #aaaaaa;
	line-height: 18px;
	}
	.recent-work .promo4{
		position:absolute;
		top:40px;
		left:600px;
		height:131px;
		width:125px;
		color:#cccccc;
		line-height:33px;
		z-index: 100;
		background:url(../images/promo4.png) no-repeat;
			
}	
	.recent-work .promo4text2{
		position:absolute;
		top:177px;
		text-align:center;
		font-family:Arial, Helvetica, sans-serif;
		font-size:12px;margin-left:600px;
		width:135px;
		color:#cbcbcb;
		line-height:14px;
	}
	.recent-work .promo5text{
		position:absolute;
		top:15px;
		text-align:center;
		text-transform:uppercase;
		font-size:16px;margin-left:770px;
		width:180px;
		color:#aaaaaa;
		line-height:18px;
	}
	.recent-work .promo5{
		position:absolute;
		top:40px;
		left:800px;
		height:131px;
		width:125px;
		color:#cccccc;
		line-height:33px;
		z-index: 100;
		background:url(../images/promo5.png) no-repeat;
			
}	
	.recent-work .promo5text2{
		position:absolute;
		top:177px;
		text-align:center;
		font-family:Arial, Helvetica, sans-serif;
		font-size:12px;margin-left:800px;
		width:135px;
		color:#cbcbcb;
		line-height:14px;
	}
	.view-image,
	.view-video{
		position:absolute;
		top:40%;
		left:50%;
		margin-top:-14px;
		margin-left:-14px;
		width:71px;
		height:71px;
		display:none;
		text-indent:-9999px;
	}
	.view-image{background:url(../images/view.png) no-repeat;}
	.view-video{background:url(../images/video.png) no-repeat;}
	.view-image:hover,
	.view-video:hover{background-position:0 -71px;}
		
	.recent-work-shadow{
	height:47px;
	margin-bottom:0px;
	background:url(../images/recent-work-shadow.png) no-repeat;
	}
	
	/*Copyright*/
	.copyright{
		text-align:center;
		font-size:11px !important;
		color:#888888;
	}
/********************************* End Home *********************************/



/********************************* Start Page *********************************/
.page-title{
	padding-bottom:30px;
	margin-bottom:50px;
	background:url(../images/page-title-divider.jpg) no-repeat bottom center;
}
.page-title h1{
	float:left;
	padding-right:40px; margin-right:20px;
	background:url(../images/page-title-arrow.png) no-repeat right center;
}
.page-title p{
	padding-top:10px;
	color:#7a7a7a;
}


	/*SERVICES PAGE*/
	.services{
		width:990px;
	}
	.services h2{
		font-size:18px;
		padding-top:10px;
		}
	.services .one-two{margin-bottom:40px;}
	.services .icon{
		float:left;
		margin:0 15px 10px 0;
		}
	
	
	
	/*ABOUT PAGE*/
	.foto.left{margin-right:0px;}
	.about-title{
		float:left;
		width:455px;
		position:relative;
		margin-bottom:15px;
		padding-bottom:10px;
	}
	.info-bt{
		float:right;
		margin-top:-45px;
	}
	.info-bt .font{
		display:inline-block;
		margin:0 10px;
		width:73px;
		text-align:center;
		background:url(../images/or.jpg) no-repeat center center;
	}
	
	/*PORTFOLIO*/
	.portfolio{
		width:970px;
	}
	.portfolio li{
	float:left;
	width:309px;
	height:293px;
	position:relative;
	overflow:hidden;
	padding-left: 20px;
	}
	/*}
	.portfolio li{
		float:left;
		width:192px;
		height:154px;
		position:relative;
		overflow:hidden;
	}*/
	
	/*CONTACT PAGE*/
	.map{padding:7px; background-color:#fff;}

	#contact-form{margin-top:15px;}
	#contact-form textarea{
		padding:10px; 
		width:94%; 
		height:120px;
	}
	#contact-form input[type = "text"]{ 
		font-size:11px; 
		color:#828282; 
		font-style:italic; 
		width:200px; 
		padding:5px; 
	}
	#contact-form p{margin-bottom:10px !important;}
	#contact-form .yellow{
		border:0 !important;
		padding-bottom:3px;
	}
/********************************* End Page *********************************/


/********************************* OTHER *********************************/
/* Column*/
.one-two,
.one-third,
.one-four,
.one-five{
	margin-right: 30px; 
	float: left; 
}

.one-two{width:465px;}
.one-third{width:330px;}
.one-four{width:300px;}
.one-five{width:240px;}


/*BT*/
.bt{
	width:109px;
	height:29px;
	text-align:center;
	line-height:27px;
	display:inline-block;
	text-transform:uppercase;
}
.bt.red{
	color:#fff;
	text-shadow:1px 1px #b13737;
	background:url(../images/red.png) no-repeat;
}
.bt.yellow{
	color:#464646;
	background:url(../images/submit_button.png) no-repeat;
}
.bt.yellow:hover{color:#000;}
.bt.red:hover{color:#d6d6d6;}