/* CSS reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
html,body {
	height: 100%;
	margin:0;
	padding:0;
	
	
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
input{
	border:1px solid #b0b0b0;
	padding:3px 5px 4px;
	color:#979797;
	width:190px;
}
address,caption,cite,code,dfn,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}

em {
	font-style:normal;

}

u {
	text-decoration: none;
}

/* ---------------------------------------------------------------------- */
/*	General Style
/* ---------------------------------------------------------------------- */
body{
	font-family: 'Droid Sans', sans-serif;
	background: #000;
	overflow-y: scroll;
	overflow-x: hidden;
}
.ie7 body{
	overflow:hidden;
}

a{
	text-decoration: none;
}

.clr{
	clear: both;
}

img {
    border: 0;
	height: auto;
	max-width: 100%;
	-ms-interpolation-mode: bicubic;
}

/* ---------------------------------------------------------------------- */
/*	Typographie
/* ---------------------------------------------------------------------- */

h1 {
    
	
	font-family: 'Vast Shadow', cursive;
    font-weight: 600;
	font-size: 8em;
    line-height: 1.5em;    
	color: rgba(255,255,255,1);
    margin: 0;
	padding: 0;
}



header {
	margin: 0 8%;
	margin-top: 0%;
	margin-bottom: 5%;
	padding-bottom: 2%;
	border-bottom: 1px solid rgba(255, 174, 0, 1);
	text-align: center;
}


h2, h3 {
    font-family: 'Droid Serif', serif;
    font-weight: normal;
	color: #333;    
}



h2 {
    text-transform: uppercase;
    font-size: 1.4em;
	font-weight: 600;
    line-height: 1.2em;
    letter-spacing: 0.1em;
    margin: 0;
	padding: 0;
}

h3  {
    text-transform: lowercase;
    font-size: 1em;
	font-weight: 300;
    line-height: 1em;
    margin: 0 6%;
	margin-bottom: 1em;	
	padding-bottom: 1em;
	border-bottom: 1px solid rgba(255, 174, 0, 1);
}

body.single .content_bloc h2 {
	font-size: 2em;
	line-height: 1.6em;
}

body.single h3 {
	font-size: 1.6em;
}

body.single h4 {
	font-size: 1.5em;
	text-transform: uppercase;
	font-weight: 400;
	text-align: center;
	padding-bottom: 1.2em;
}	
	
p, ul {
    font-size: 0.9em;
    line-height: 1.4em;
    margin: 0;
	margin-bottom: 0.6em;
	padding: 0 6%;
	color: #444;
}

p strong {
	font-weight: 400;

}

p.center {
	text-align: center;
}

body.single p, body.single ul {
	font-size: 1.2em;
	padding-bottom: 1.4em;
}

body.single p strong {
	font-weight: 600;

}

header h2 {
	font-family: 'EB Garamond', serif;
	color: white;
	position: relative;
    font-size: 1.75em;
	font-weight: 200;	    
	letter-spacing: 0.34em;
	text-transform: uppercase;
    margin: 0;
	padding: 0;
}

.color {
	color: #ff9900;
}

.content_bloc ul {
	padding-left: 30%;
	color: #ff9900;
	list-style-type:square;

}

.content_bloc ul li span, .content_bloc a {
	color: #444;
}

/* -----------------------   BUTTONS   ---------------------------------- */

.button_container {
	position: absolute;
	text-align: center;
	z-index: 1000;
	left: 0;
	bottom: -3%;
	width: 100%;
}

.button {
	margin: 0 auto;
	width: 40%;	
	padding: 3% 6%;
	background-color: #ff9900;
	color: white;
	vertical-align: baseline;
	font-size: 0.9em;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: 0.1em;	
	border: 1px solid #d28410;
	border-top: 1px solid #ff9900;
	-webkit-border-radius: 6px;
			border-radius: 6px;
	-webkit-transition: all 0.5s ease;
			transition: all 0.5s ease;
	-moz-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.6);
		-webkit-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.6);
		-o-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.6);
		box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.6);
	filter:progid:DXImageTransform.Microsoft.Shadow(color=rgba(0,0,0,0.6), Direction=180, Strength=3);	
}

.button:hover {
	background-color: #fff;
	color: #ff9900;
	border: 1px solid #ff9900;

}




/* ---------------------------------------------------------------------- */
/*	Section
/* ---------------------------------------------------------------------- */

#container {
	position: relative;
	min-height: 100%;
	height: auto;
	margin: 0 auto -26px;

}


#content {
		position: relative;
		top: 0;
		left: 5%;
		width: 90%;
		height: 100%;
		z-index: 2;
		text-align: center;
		margin: 0 0 0px 0;
	}
	
	.content_bloc {
		display: inline-block;
		position: relative;
		vertical-align:top;
		
		width: 22%;
		min-height: 480px;
		height: auto;
		margin-top: 0;
		margin-right: 6%;
		margin-bottom: 2%;
		padding: 1%;
		padding-bottom: 3%;
		
		border-radius: 6px;
		background-color: rgba(255, 255, 255, 0.8);
		text-align: justify;
		color: #222;
		-moz-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.6);
		-webkit-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.6);
		-o-box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.6);
		box-shadow: 0px 2px 3px 0px rgba(0,0,0,0.6);
		filter:progid:DXImageTransform.Microsoft.Shadow(color=rgba(0,0,0,0.6), Direction=180, Strength=3);
		
	}	

	.content_bloc.last {
		margin-right: 0;	
	}
	
	.content_bloc.full {
		width: 80%;
		padding: 2%;
		max-width: 910px;
		margin: 0 8%;
		margin-bottom: 20%;
		padding-bottom: 8%;	
	}
	
	
	.content_bloc .work-item {
		position: relative;
		width: 100%;
		height: 3px;
		padding-bottom: 56%;
		margin-bottom: 1em;
		
		-moz-box-shadow: 0px 2px 3px 0px #656565;
		-webkit-box-shadow: 0px 2px 3px 0px #656565;
		-o-box-shadow: 0px 2px 3px 0px #656565;
		box-shadow: 0px 2px 3px 0px #656565;
		filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=180, Strength=3);
	}
	
	.content_bloc img {		
		margin: 0;
		padding: 0;		
	}
	
	
	.content_bloc h2, .content_bloc h3 {
		text-align: center;
		
	}
	
	
	
	
	
	
	
	/* -------------------------------------------------- */
	/*	Container 
	/* -------------------------------------------------- */
	
	.work-item {
			position: relative;
			overflow: hidden;
		}
		
			.work-item img {
				display: block;
				-webkit-transition: -webkit-transform .25s ease-in-out;
						transition: transform .25s ease-in-out;
			}
			
			.work-item:hover img {
				-webkit-transform: scale(1.2);
						transform: scale(1.2);
			}
		
			.image-extra {
				position: absolute;
				top: 0;
				left: 0;
				z-index: 3;
				overflow: hidden;
				width: 100%;
				height: 100%;
				text-align: center;
				opacity: 0;
				filter: alpha(opacity = 0);
				background-color: rgba(255, 174, 0, 0.1);
				
				-webkit-transition: opacity .25s ease, background-color .45s ease;
						transition: opacity .25s ease, background-color .45s ease;
			}
			
			.ie8 .image-extra { visibility: hidden; }

			.work-item.touched .image-extra,
			.work-item:hover .image-extra {
				background-color: #00c2a9;
				background-color: rgba(255, 174, 0, 0.8);
				opacity: 1;
				filter: alpha(opacity = 80);
			}

			.ie8 .work-item:hover .image-extra { visibility: visible; }
				
				.extra-content {
					display: table;
					overflow: hidden;
					width: 100%;
					height: 100%;
					vertical-align: middle;
					text-align: center;
				}	

					.inner-extra {
						display: table-cell;
						margin: 0;
						padding: 0 10px;
						width: 100%;
						height: 100%;
						vertical-align: middle;
					}
					
					.link-icon .curtain,
					.plus-icon .curtain {
						display: inline-block;
						width: 50px;
						height: 50px;
						border: 1px solid #fff;
						
						-webkit-border-radius: 50%;
								border-radius: 50%;	
						-webkit-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1);
						-webkit-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
						   -moz-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
							-ms-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
							 -o-transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
								transition: all 500ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
					}
				
					.single-image.link-icon .curtain {
						-webkit-transform: translateX(-300%);
								transform: translateX(-300%);
					}

					.single-image.plus-icon .curtain {
						-webkit-transform: translateX(300%);
								transform: translateX(300%);
					}
					
					.work-item:hover .link-icon .curtain,
					.work-item:hover .plus-icon .curtain {
						-webkit-transform: translateX(0);
								transform: translateX(0);
					}
					
					.link-icon .curtain:hover,
					.plus-icon .curtain:hover {
						border-color: transparent;
						background-color: rgba(255,255,255,.9);
					}

					.link-icon .curtain:after,
					.plus-icon .curtain:after {
						position: absolute;
						left: 0;
						top: 0;
						display: block;
						width: 100%;
						height: 100%;
						color: #fff;
						text-align: center;
						font-size: 20px;
						font-family: 'fontello';
						line-height: 50px;

						-webkit-border-radius: 50%;
								border-radius: 50%;
						-webkit-transition: color .25s ease-in-out;
								transition: color .25s ease-in-out;
					}

					.plus-icon .curtain:after  { content: '\e9a1'; font-size: 28px; }
					.link-icon .curtain:after  { content: '\e84f'; }
					
					.link-icon .curtain:hover:after,
					.plus-icon .curtain:hover:after { color: #ff9900; }

						.extra-title  { 
							margin-bottom: 6px;
							color: #fff;
							font-family: 'Roboto Condensed', sans-serif;
							text-transform: uppercase;
						}

						.extra-category {
							margin-bottom: 0;
							color: #fff;
							font-weight: 300;
						}

						
	/* -------------------------------------------------- */
	/*	Images
	/* -------------------------------------------------- */
	
	.single-image {
		position: relative;
		display: block;
		margin: 0;
		cursor: pointer;
		font-size: 0;
		
		-webkit-backface-visibility: hidden;
			-ms-backface-visibility: hidden;
				backface-visibility: hidden;
	}
	
	.image-extra .single-image { 
		display: inline-block;
		margin: 20px 5px 0;
	}
	
	.touch .image-extra .single-image { pointer-events: none; }
	.touch .touched .single-image     { pointer-events: auto; }
	
		.single-image img { display: block; }
		
		/* Team Plus Icon */
		
		.team-plus-icon .curtain {
			position: absolute;
			z-index: 5;
			top: 0;
			left: 0;
			display: block;
			width: 100%;
			height: 100%;
			text-align: center;
			opacity: 0;
			filter: alpha(opacity = 0);

			-webkit-transition: all .3s ease-in;
					transition: all .3s ease-in;  
		}		
		
		.team-plus-icon .curtain:after {
			position: absolute;
			left: 50%;
			top: 50%;
			display: block;
			margin: -30px 0 0 -30px;
			width: 60px;
			height: 60px;
			color: #fff;
			text-align: center;
			font-size: 28px;
			font-family: 'fontello';
			line-height: 60px;
			
			-webkit-border-radius: 50%;
					border-radius: 50%;
			-webkit-transition: all .3s ease-in;
					transition: all .3s ease-in;  					
		}	
		
		.team-plus-icon .curtain:after {
			background-color: #00c2a9;
			background-color: rgba(0,194,169, .8);
			font-size: 38px;
			content: '\e9a1';
		}
		
		.team-plus-icon:hover .curtain {
			visibility: visible;
			opacity: 1;
		}
		
		.not-ie .open .team-plus-icon .curtain:after {
			-webkit-transform: rotate(45deg);
					transform: rotate(45deg);
		}
						
						

/* Footer */
footer{
	position: relative;
	z-index: 9999;
	width: 98%;
	left: 0;
	bottom: 0;
	
	
	background: rgba(100,100,100,0.25);
	color: #fff;
	
	line-height: 24px;
	font-size: 11px;	
	text-transform: uppercase;
	padding: 0 1%;
	
}

footer, .push {
	height: 26px;
	text-align: center;
}





footer a{
	padding: 0;
	letter-spacing: 1px;
	color: #fff;
	font-weight: 400;
	
}
footer a:hover{
	text-decoration: underline;
	color: #ff9900;
	-webkit-transition: all 0.5s ease;
			transition: all 0.5s ease;
}

footer span.left{
	float: left;
}


footer span.right{
	float: right;
}

footer span.right a.color {
	color: #584324;
	background-color: #ff9900;
	font-weight: 400;
	padding: 3px 4px;
}


footer span.middle{
	float: none;
	text-align: center;
}
	
footer span.left a, footer span.right a, footer span.middle a{
	float: none;
	display: inline;
	font-weight: 200;
}

/* Media Queries */
@media screen and (max-width: 767px) {
	.container > header{
		text-align: center;
	}
	pfooter-demos {
		position: relative;
		top: auto;
		left: auto;
	}
}