body {

	margin:0;

	color:#030303;

	font:400 13px/19px 'Open Sans',Arial, Helvetica, sans-serif;

	background:#fff;

}

img {border-style:none;}

a {

	text-decoration:none;

	color:#00abf1;

}

a:hover {text-decoration:underline;}

a:active {background-color: transparent;}

input,

textarea,

select {

	font:100% Arial, Helvetica, sans-serif;

	vertical-align:middle;

	color:#000;

}

form, fieldset {

	margin:0;

	padding:0;

	border-style:none;

}

header, footer, article, section, hgroup, nav, figure, aside { display: block; }

#header{

	width: 1140px;

	margin: 0 auto;

	padding:50px 0 20px;

}

.social-networks{

	text-transform: uppercase;

	font-weight: 700;

	font-size: 11px;

	line-height: 13px;

	text-align: center;

	padding: 0 0 54px;

}

.social-networks ul{

	padding: 0;

	margin: 0;

	list-style: none;

}

.social-networks a{ color: #a9a8a8;}

#header .social-networks{

	text-align: center;

} 

#header .social-networks li{

	display: inline;

	padding: 0 3px;

}

.design-info{

	display: block;

	text-align: center;

	color: #231f20;
	
	font-weight:600;
	
	font-style:italic;

	text-transform: uppercase;

	padding: 0 0 30px;
	

}

.design-info strong{

	display: block;

	font-weight: 700;
	
	font-style: italic;

	font:600 20px/22px 'azo-sans-web', serif;

	margin:40px 10px 55px;

}

.ie8 .design-info strong{margin:-4px 0 -4px;}

.win7.gecko .design-info strong{margin:-4px 0 -4px;}

.mac .design-info strong{margin:-4px 0 -4px;}

.design-info em{

	font:700 11px/30px 'Open Sans',Arial, Helvetica, sans-serif;

	display: block;

}

.introducing{

	border-top: 1px solid #bfbebe;

	text-align: center;

	color: #231f20;

	font: 300 19px/26px 'azo-sans-web', serif;
	
	font-weight: light; 

	padding: 115px 200px 0;

}

.introducing p{ margin: 0 0 35px;}

.introducing .featured-work{

	display: inline-block;

	background:url(../images/sprite.png) no-repeat 65% 21px;

	text-transform: uppercase;

	font:700 11px/15px 'Open Sans',Arial, Helvetica, sans-serif;

	padding: 0 0 15px;

	background-size: 30px 250px;

}

#main section{

	border-top: 1px solid #d0cfcf;

	position: relative;

	padding: 0 0 43px;

}

#main section .gallery .holder{

	width: 1280px;

	margin: 0 auto;

	position: relative;

	padding: 85px 0 8px;

}

#main section .gallery .holder:after{

	display: block;

	clear: both;

	content:'';

}

#main section .text-holder{

	width: 1280px;

	margin: 0 auto;

	position: absolute;

	z-index: 200;

	left: 50%;

	top: 0;

	margin: 0 0 0 -640px;

}

#main section .text{

	left: 69px;

	position: absolute;

	top: 99px;

	width: 25%;

	vertical-align: top;

}

#main section h2{

	margin: 0;

	text-transform: uppercase;

	font: 700 20px/40px 'azo-sans-web', serif;

	padding:0 0 17px;

}

.ie8 #main section h2{padding: 9px 0 8px;}

.win7 #main section h2{padding: 9px 0 8px;}

.win7.webkit #main section h2,

.win7.presto #main section h2{padding: 2px 0 17px;}

.mac #main section h2{padding: 9px 0 8px;}

#main section h2 span{

	display: block;

	margin: 0 0 -21px;

}

#main section h3{

	margin: 0 0 4px;

	font:700 13px/19px 'Open Sans',Arial, Helvetica, sans-serif;

}

#main section p{ margin: 0 0 15px;}

#main section .text ul{

	padding: 0 0 15px;

	margin: 0;

	list-style: none;

	line-height: 18px;

}

#main section .site-link{text-transform: uppercase;}

#main section .gallery{

	width: 100%;

	position: relative;

}

#main section .gallery:after{

	display: block;

	clear: both;

}

#main section .gallery .mask{

	width: 100%;

	overflow: hidden;

	padding: 0 0 20px;

}

#main section .gallery .mask ul{

	padding: 0;

	margin: 0;

	list-style: none;

	width: 99999px;

	float: left;

}

#main section .gallery .mask ul li{

	padding: 0;

	float: left;

	overflow:hidden;

}

#main section .gallery .mask img{ 

	vertical-align: top;

	width: 100%;

	height:auto;

}

#main section .gallery .mask .img-holder{

	margin: 0 5% 0 32%;

	width: 64%;

}

#main section .gallery .pagination{

	width: 1280px;

	overflow: hidden;

	margin: 0 auto;

}

#main section .gallery .pagination ul{

	padding: 0 32.3% 0 0;

	margin: 0;

	list-style: none;

	float: right;

}

#main section .gallery .pagination ul li{

	float: left;

	padding: 0 0 0 7px;

}

#main section .gallery .pagination ul a{

	float: left;

	background:url(../images/sprite.png) no-repeat -18px -49px;

	width: 11px;

	height: 11px;

	text-indent: -9999px;

	overflow: hidden;

}

#main section .gallery .pagination ul .active a,

#main section .gallery .pagination ul a:hover{ background-position: 0 -49px;}

#main section .gallery .btn-next {

	position: absolute;

	right: 0;

	top: 44.5%;

	background:url(../images/normal.png);

	width: 100px;

	height: 100px;

}

#main section .gallery .btn-next:hover{ background:url(../images/pressed.png);}

#main section .gallery .btn-next span{

	background:url(../images/sprite.png) no-repeat 55% -80px;

	display: block;

	height: 100%;

	text-indent: -9999px;

	overflow: hidden;

}

.colour-01{

	background: #eee;

}

.colour-01 h2{

	color: #231f20;

}

.colour-02{

	background: #484a4d;

	color: #e2e2e2;

}

.colour-03{

	background: #d4d7d7;

}

#main .director-info{

	overflow: hidden;

	position: relative;

	width: 1140px;

	margin: 0 auto;

	padding:68px 0 148px;

	border: 0;

}

.director-info .alignleft{

	float: left;

	max-width: 100%;

}

#main .director-info .text{

	float: right;

	position: static;

	top: 0;

	left: 0;

	margin: -3px 5.4% 0 0;

	width: 64%;

}

#main .director-info .text h2{

	font: 400 20px/26px 'azo-sans-web', serif;

	margin: 0 0 23px;

	color: #231f20;

	text-transform: none;

}

#main .director-info .text .holder{

	width: 100%;

	overflow: hidden;

	padding: 0;

}

.director-info .text .col{

	float: left;

	margin: 0 0 0 7%;

	width: 43%;

}

.director-info .text .col:first-child{ margin: 0;}

#main .director-info .text p{ margin: 0 0 19px;}

#footer {

	border-top: 1px solid #bfbebe;

	width: 1140px;

	margin: 0 auto;

	overflow: hidden;

	padding: 38px 0 0;

}

#footer .social-networks{

	float: right;

	padding: 13px 0 0;

}

#footer .social-networks li{

	float: left;

	padding: 0 0 0 9px;

}

#footer .back-top{

	background:url(../images/bg-grey.png);

	width: 113px;

	height: 76px;

	float: left;

}

#footer .back-top span{

	text-transform: uppercase;

	display: block;

	background:url(../images/sprite.png) no-repeat  60% -207px;

	font-size: 11px;

	font-weight: 700;

	color: #fff;

	padding: 48px 0 0;

	text-align: center;

	background-size: 30px 250px;

}



@media (max-width: 1310px){

	#header{

		width: 100%;

	}

	#main section{

		padding: 0 3% 43px;

		min-height: 710px;

	}

	#main section .gallery .holder{

		width: 100%;

	}

	#main section .gallery .mask{

		width: 100%;

	}

	#main section .gallery .mask .img-holder {

		display: table;

		margin: 0 0 0 28%;

		width: 72%;

	}

	#main section .text-holder{

		width: 100%;

		margin: 0 0 0 -50%;

	}

	#main section .text{

		left: 0;

		width: 27%;

		padding: 0 0 0 2%;

		top: 85px;

	}

	#main section .gallery .btn-next{

		right: -3%;

	}

	#main .director-info{

		width: 100%;

	}

	#main .director-info .text{

		width: 52%;

		margin-right: 0;

	}

	#footer{

		width: 90%;

		margin: 0 5%;

	}

	#main section .gallery .pagination{

		width: 100%;

		margin: 0 0 20px;

	}

}



@media (max-width: 1139px){

	#header{

		width: 100%;

	}

	#main section .holder{

		padding: 29px 0 43px;

	}

	.introducing{

		margin: 0 5%;

		padding: 55px 4% 0;

	}

	#main .director-info{

		padding:68px 5% 148px;

		width: 90%;

	}

}



@media (max-width: 678px){

	#header{

		padding: 44px 0 59px;

	}

	.design-info{

		padding: 0 0 48px;

	}

	.social-networks{

		font-size: 15px;

		line-height: 17px;

		padding: 0 0 55px;

	}

	.introducing{

		padding: 55px 7% 0;

		margin: 0 5%;

	}

	.introducing p {

		margin: 0 0 39px;

	}

	#main section{

		min-height: 1px;

	}

	#main section .text-holder{

		position: static;

		width: 100%;

		margin: 0;

	}

	#main section .text-holder .text{

		position: static;

		width: 98%;

		margin: 0 0 0 2%;

	}

	#main section h2{

		line-height: 20px;

		padding:0;

	}

	#main section h2 span{

		display: inline;

		margin: 0;

	}

	#main section .gallery .mask ul li{

		padding: 0;

		width: auto;

	}

	#main section .gallery .mask .img-holder {

		display: table;

		width: 100%;

		margin: 0;

	}

	#main section .gallery .pagination ul{

		padding: 0;

		text-align: center;

		float: none;

	}

	#main section .gallery .pagination ul li{

		float: none;

		display: inline-block;

		padding:0 2px;

	}

	#main section .gallery .pagination ul li a{

		display: block;

		float: none;

	}

	#main section .gallery .btn-next{ display: none;}

	#main section h2{

		margin: 0 0 17px;	

	}

	#main .director-info{

		padding: 52px 5% 7px;

	}

	.director-info .alignleft{

		display: block;

		float: none;

		margin: 0 auto 40px;

	}

	#main .director-info .text{

		float: none;

		margin: 0;

		width: 100%;

	}

	.director-info .text .col{

		width: 100%;

		margin: 0;

		display: none;

	}

	.director-info .text .col:first-child{ display: block;}

	#footer .social-networks {

		float: right;

		font-size: 11px;

		line-height: 13px;

		padding: 24px 3% 0 0;

	}

	

}