/* @group Font Face */

@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: 'MenschRegular';
	src: url('././font/mensch-wf.eot');
	src: url('././font/mensch-wf.eot?#iefix') format('embedded-opentype'),
	url('././font/mensch-wf.woff') format('woff'),
	url('././font/mensch-wf.ttf') format('truetype'),
	url('././font/mensch-wf.svg#MenschMenschRegular') format('svg');

}

@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: 'MenschBold';
	src: url('././font/mensch-bold-wf.eot');
	src: url('././font/mensch-bold-wf.eot?#iefix') format('embedded-opentype'),
	url('././font/mensch-bold-wf.woff') format('woff'),
	url('././font/mensch-bold-wf.ttf') format('truetype'),
	url('././font/mensch-bold-wf.svg#MenschMenschBold') format('svg');
}

/* @end */
/* @group scrollup */
.scrollup{
	width: 40px;
	height: 40px;
	position: fixed;
	right: 10px;
	bottom: 10px;
	background: url("../layoutImg/scrollup.png") 10px 12px no-repeat;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	opacity:0.5;
	z-index: 998;
	cursor: pointer;
	display: none;	
}
.lab .scrollup{
	background-position: 9px -39px;
}
.no-js .scrollup {
	display: none;	
}
.no-touch .scrollup:hover{
	background-position: 10px 10px;
}
.no-touch .lab .scrollup:hover{
	background-position: 9px -42px;
}
.container.lab .scrollup{
	background-color: #f6f6f6;
}

.container.pro .scrollup{
	background-color: #3a3a3a;
}
/* @end */

/* @group Boilerplate */

html,
button,
input,
select,
textarea {
color: rgb(35,35,35);
-webkit-font-smoothing: antialiased;
}
hr {
display: block;
margin: 1em 0;
padding: 0;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
}
img {
vertical-align: middle;
}
fieldset, ul, li, a {
margin: 0;
padding: 0;
border: 0;
}
textarea {
resize: vertical;
}

a{
	outline: none;
}

/* @end */

/* @group Mes styles */

/* @group General */

#map {
	position: relative;
	display: block;
	width:800px; height: 500px;
}
strong, h1, h2, h3, h4 {
	font-weight: normal;
}

a, a:visited, a:active, a:hover, a:focus {
	outline: none;
}

::-moz-selection {
	background: rgb(255,255,0);
	color: rgb(0,0,0);
	text-shadow: none;
}
::selection {
	background: rgb(255,255,0);
	color: rgb(0,0,0);
	text-shadow: none;
}

body.section-pro{background: #f6f6f6;}
body.section-lab, .no-js body.nojs-page{background: #3a3a3a;}

body {
	background-color: #f6f6f6;
	line-height: 1.6;
	text-rendering: optimizeLegibility;
}
ul.main-nav{
	display: block;
	margin-right: auto;
	margin-left: auto;
	padding-bottom: 10px;
	width: 117px;
}
.containerNav{
	position: absolute;
	bottom: 0;
	padding-top: 10px;
	width: 100%;
}

ul.main-nav li{

	position: relative;
	display: inline-block;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 10px;
	padding-top: 0;
	padding-bottom: 0;
	padding-left: 0;
	width: 25px;
	height: 25px;
}
ul.main-nav a {
	display: block;
	margin: 0;
	padding: 0;
	text-indent: -9999px;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	-webkit-border-radius: 13px 13px 13px 13px;
	border-radius: 13px 13px 13px 13px;
}
ul.main-nav .infos a {
	background: url("../layoutImg/picto-menu.png") no-repeat -1px -1px;
}
ul.main-nav .links a {
	background: url("../layoutImg/picto-menu.png") no-repeat -39px -1px;
}
ul.main-nav .contact a{
	background: url("../layoutImg/picto-menu.png") no-repeat -78px -1px;
}
.no-touch ul.main-nav .infos a:hover  {
	background: url("../layoutImg/picto-menu.png") no-repeat -1px -30px;
}
.no-touch ul.main-nav .links a:hover  {
	background: url("../layoutImg/picto-menu.png") no-repeat -39px -30px;
}
.no-touch ul.main-nav .contact a:hover  {
	background: url("../layoutImg/picto-menu.png") no-repeat -78px -30px;
}
a.img-main {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
}
a.img-main .videoMask {
	position: absolute;
	background: rgba(0, 0, 0, 0.25);
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 20;
	display: block;
	opacity: 0;
}

a.img-main .videoMask.loadedVid {
	opacity: 1;
}

a.img-main .videoMask span {
	width: 75px;
	height: 75px;
	background: url("../layoutImg/icone-play.png") no-repeat 0 0;
	top: 50%;
	left: 50%;
	margin-top: -37px;
	margin-left: -37px;
	display: block;
	position: absolute;
	opacity: 0.7;
	-webkit-transition: opacity 0.2s ease-in-out;
	-moz-transition: opacity 0.2s ease-in-out;
	-ms-transition: opacity 0.2s ease-in-out;
	-o-transition: opacity 0.2s ease-in-out;
	transition: opacity 0.2s ease-in-out;
}

.no-touch a.img-main:hover .videoMask.loadedVid span {
	opacity: 1;
}

.no-js a.img-main .videoMask {
	opacity: 1;
}
	
/* @end */
/* @group INDEX PRO*/

	.container {
		position: relative;
		margin: 0 auto;
	}

	/* @group header */
		.header, #nav-categ-main {
			position: fixed;
			top: 0;
			left: 50%;
			display: block;
			margin: 0 0 0 -600px;
			width: 1200px;
		}
		#nav-categ-main{
			z-index: 50;
		}
		.nav-portfolio{
			z-index: 90;
		}
		.bloc-logo{
			z-index: 100;
		}
		.nav-categ a{
			height: 100%;
		}
		.bloc-logo {
			position: absolute;
			top: 50px;
			right: 0;
		}
		.logo{
			display: block;
			margin: 0 0 110px 0;
			padding: 0;
			width: 48px;
			height: 25px;
		}
		.logo a{
			display: block;
			width: 100%;
			height: 100%;
		}
	
		#nav-categ {
			position: absolute;
			top: 186px;
			right: 3330px;
			left: auto;
			z-index: 90;
			padding-right: 4px;
			width: 56px;
			text-align: right;
		}
			
		.no-js #nav-categ {
			left: auto;
			right: 5px;
			top: 300px;
			width: 140px;
			padding-left: 0;
			text-align: left;
			padding-top: 20px;
			border-top: solid 1px rgba(174, 177, 162, 0.5);
		}
		
		.no-js #nav-categ li a span {
			display: none;
		}
	
		#nav-categ li {
			right: 0;
			left: 0;
			margin: 0 0 148px 0;
			height: 20px;
			list-style-type:none;
		}
		
		.no-js #nav-categ li {
			margin: 0 0 5px 5px;
			text-align: left;
		}
	
		#nav-categ li a h4{
			display: inline-block;
			margin: 0 6px;
			padding-top: 0;
			padding-right: 0;
			padding-bottom: 0;
			color: #aeb1a2;
			vertical-align: top;
			text-decoration:none;
			text-transform: uppercase;
			font: normal normal 100 0.85em 'MenschBold', Arial, sans-serif;
			-webkit-transition: color 0.2s ease-in-out;
			-moz-transition: color 0.2s ease-in-out;
			-ms-transition: color 0.2s ease-in-out;
			-o-transition: color 0.2s ease-in-out;
			transition: color 0.2s ease-in-out;
			
		}
		
		.no-touch #nav-categ li a:hover h4 {
			color: #898b7f;
		}
	
		#nav-categ .active a {
			cursor: default;
		}
		
		#nav-categ .active a h4 {
			color: #e44500;
		}
		.no-touch #nav-categ .active a h4, #nav-categ li.active a:hover h4  {
			color: #e44500;
		}
		.no-touch #nav-categ li.active a span,#nav-categ li.active a:hover span{
			background-color: #e44500;
		}
	
		#nav-categ li a span {
			display: inline-block;
			margin: 5px 0 0 0;
			padding: 0;
			width: 8px;
			height: 2px;
			background-color: #aeb1a2;
			vertical-align: top;
		}
		.no-touch #nav-categ li a:hover span {
			background-color: #898b7f;
			-webkit-transition: background-color 0.2s ease-in-out;
			-moz-transition: background-color 0.2s ease-in-out;
			-ms-transition: background-color 0.2s ease-in-out;
			-o-transition: background-color 0.2s ease-in-out;
			transition: background-color 0.2s ease-in-out;
		}
		.nav-portfolio {
			position: absolute;
			top: 186px;
			width: 180px;
		}
		.nav-portfolio {
			text-align: left;
		}
		.js .lab .nav-portfolio {
			text-align: right;
		}
		
		.nav-portfolio li{
			display: block;
			margin: 0 0 0 0px;
			padding-top: 0;
			padding-bottom: 0;
			padding-left: 0;
			list-style-type:none;
			opacity: 0.3;
		}
		.nav-portfolio li:first-child {
			opacity: 1;
		}
		.no-js .nav-portfolio li, .nav-portfolio.allLoaded li {
			opacity: 1;
		}		
		.nav-portfolio a {
			display: block;
			width: 100%;
			height: 100%;
			outline: none;
			color: #000000;
			text-decoration: none;
			line-height: 0.5;
			cursor: default;
			pointer-events:none;
		}
		.no-js .nav-portfolio a, .nav-portfolio.allLoaded a {
			cursor: pointer;
			pointer-events:auto;
		}
		.nav-portfolio li a span {
			display: inline-block;
			margin: 5px 0 0 0;
			padding: 0;
			width: 3px;
			height: 2px;
			background-color: #e3e8d4;
			vertical-align: top;
			-webkit-transition: all 0.5s ease-in-out;
			-moz-transition: all 0.5s ease-in-out;
			-ms-transition: all 0.5s ease-in-out;
			-o-transition: all 0.5s ease-in-out;
			transition: all 0.5s ease-in-out;
			
		}
	
		.no-touch .nav-portfolio.allLoaded li a:hover span {
			width: 10px!important;
			background-color: #e44500!important;
			-webkit-transition: all 0.05s ease-in-out;
			-moz-transition: all 0.05s ease-in-out;
			-ms-transition: all 0.05s ease-in-out;
			-o-transition: all 0.05s ease-in-out;
			transition: all 0.05s ease-in-out;
		}
	
		.nav-portfolio li a:focus span, .nav-portfolio li.active a span {
			width: 10px;
			background-color: #e44500;
		}
		.nav-portfolio li a h4 {
			display: inline-block;
			color: #898b7f;
			vertical-align: top;
			text-transform: uppercase;
			font: 0.85em 'MenschBold', Arial, sans-serif;
		
		}
		.nav-portfolio li a h4 {
			margin: 0;
		}
		.js .lab .nav-portfolio li a h4 {
			margin: 0 6px 0 0;
			text-align: right;
		}
		
		.js .lab .nav-portfolio li a span {
			float: right;
		}
	
		.js .lab .nav-portfolio li.active a h4 {
			padding: 0;
		}

		/* @group content */
			.content img{
				margin-bottom: 40px;
				width:100%;
				height: auto;
			}
			.content div:first-child{
				padding-top: 189px;
			}

		/* @end */

	/* @end */

/* @end */

/* @group INDEX LAB */

	.lab .container {
		position: relative;
	}
	
	.lab .header {
		position: fixed;
		top: 0;
		display: block;
		margin: 0 0 0 -600px;
		width: 1200px;
	}
	
	.lab .bloc-logo {
		position: absolute;
		left: 0px;
	}

/* @end */


/* @group HOME CHOICE */
	.baselinehome {
		display: block;
		margin: 49px 0 0;
		padding-left: 11px;
		width: 90px;
		color: #aeb1a2;
		text-align: center;
		text-transform: uppercase;
		font-family: 'MenschRegular', Arial, sans-serif;
		line-height: 0.8;
	}
	
	#content-choice {
		width: 100%;
		overflow: hidden;
		display: block;
		position: relative;
		white-space:nowrap;
	}
	
	.container-home {
		position: relative;
		margin: 0 auto;
		width: 1050px;
		overflow: hidden;
	}
	
	.baselinechoice {
		display: block;
		margin: 49px auto 0 auto;
		width: 90px;
		color: #aeb1a2;
		text-align: center;
		text-transform: uppercase;
		font-family: 'MenschRegular', Arial, sans-serif;
		line-height: 0.8;
		text-indent: -25px;
	}
.baselinehome a{
  color: #aeb1a2; text-decoration: none
}
	
	.baselinehome h1, .baselinechoice h1 {
		margin: 0;
		padding: 0;
		letter-spacing: -0.06em;
		font-weight: normal;
		font-style: normal;
		font-size: 1.875em;
	}
	
	.baselinechoice h1 a {
		color: #aeb1a2;
		text-decoration: none;
	}
	
	.baselinehome h2, .baselinechoice h2{
		margin:5px 0 56px 0;
		padding: 0;
		word-spacing: -0.2em;
		letter-spacing: -0.05em;
		font-weight: normal;
		font-style: normal;
		font-size: 0.75em;
		font-family: 'MenschBold', Arial, sans-serif;
	}
	
	#lab-choice {
		display: inline-block;
		height: 500px;
		margin-right:20px ;
	}
	
	#pro-choice {
		display: inline-block;
		height: 500px;
	}
	
	#pro-choice, #lab-choice {
		position: relative;
		overflow: hidden;
		width: 48%;
		height: 500px;
		-webkit-transition: all 0.4s ease-in-out;
		-moz-transition: all 0.4s ease-in-out;
		-o-transition: all 0.4s ease-in-out;
		transition: all 0.4s ease-in-out;
	}
	
	.content-choice img {
		opacity: 1;
		-webkit-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
	}
	
	#lab-choice img {
		position: absolute;
		top: 50%;
		left: -20px;
		margin-top: -295px;
		width: 830px;
		height: 587px;
		-webkit-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
	}
	
	.no-touch a#lab-choice:hover img {
		left: 0px;
	}
	
	#pro-choice img {
		position: absolute;
		top: 50%;
		right: -30px;
		left: auto;
		margin-top: -325px;
		height: 587px;
		-webkit-transition: all 0.5s ease-in-out;
		-moz-transition: all 0.5s ease-in-out;
		-o-transition: all 0.5s ease-in-out;
		transition: all 0.5s ease-in-out;
	}
	
	.no-touch a#pro-choice:hover img {
		top: 50%;
		right: -10px;
		left: auto;
		margin-top: -325px;
	}
	
	.nav-home {
		-webkit-transition: all 0.4s ease-in-out;
		-moz-transition: all 0.4s ease-in-out;
		-o-transition: all 0.4s ease-in-out;
		transition: all 0.4s ease-in-out;
		zoom: 1;
		background: none;
		outline: none;
	}
	
	#nav-home-right {
		position: absolute;
		bottom: 35%;
		z-index: 997;
	  	right:  -30%;
	}
	  	
	.no-touch a:hover #nav-home-right{
		right:  4%;
	}
	
	#nav-home-left {
		position: absolute;
		bottom: 35%;
		z-index: 997;
	 	left:  -30%;
	}
	
	.no-touch a:hover #nav-home-left{
		 left:  4%;
	}
	
	#content-choice a h3{
		display: inline-block;
		margin: 0;
		outline: none;
		color: white;
		text-decoration: none;
		text-transform: uppercase;
		font: normal 5.250em 'MenschRegular', Arial, sans-serif;
		font-weight: 400;
		opacity:  0;
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
	}
	
	.no-touch #content-choice a:hover h3{
		opacity: 1;
		-webkit-transition-delay: 0.4s;
		transition-delay: 0.4s;
	}
	
	#content-choice a span{
		display: inline-block;
		margin-bottom: 20%;
		width: 20px;
		height: 2px;
		background-color: white;
		opacity: 0;
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
	}
	
	.no-touch #content-choice a:hover span{
		opacity: 1;
		-webkit-transition-delay: 0.2s;
		transition-delay: 0.2s;
	}

	a#lab-choice span {
		margin-right: 25px;
		margin-left: 0;
	}
	
	a#pro-choice span {
		margin-right: 0;
		margin-left: 30px;
	}
	
	a#pro-choice.large, a#lab-choice.large {
		width:65%;
		background:#000;
	}
	
	a#pro-choice.etroit, a#lab-choice.etroit {
		width: 31%;
	}

/* @end */


/* @group OTHER */
	#otherContent{
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 90;
		display: none;
		margin: 0;
		padding: 0;
		width: 0;
		height: 0;
		opacity: 0;
	}
	.no-js .nojs-page #otherContent{
		display: block;
		opacity: 1;
		padding-left: 50px;
	}
	.bgOther{
		position: fixed;
		top: 0;
		z-index: 20;
		display: none;
		margin: 0;
		padding: 0;
		width: 100%;
		height: 100%;
		background-color: rgb(0, 0, 0);
		opacity: 0;
	}
	.other{
		z-index: 100;
		display: block;
		margin-right: auto;
		margin-left: auto;
	}
	.other h3{
		overflow: hidden;
		padding-bottom: 6px;
		border-bottom-width: 2px;
		border-bottom-style: solid;
		font: normal normal 1.2em 'MenschBold', Arial, sans-serif;
	}
	.other h4{
		font: normal normal 0.9em 'MenschBold', Arial, sans-serif;
	}
	#otherContent p{
		font-size: 0.8em;
	}
	#otherContent .blocInfo{
		position: relative;
		margin-right: 15px;
		margin-left: 15px;
		padding-top: 110px;
		padding-bottom: 100px;
		color: #898B7F;
	}
	.no-js .nojs-page #otherContent .blocInfo {
		padding-top: 0;
		display: none;
	}
	.no-js #infoPage #otherContent .blocInfo.infosContent, .no-js #linkPage #otherContent .blocInfo.linkscontent, .no-js #contactPage #otherContent .blocInfo.contactContent {
		padding-top: 110px;
		display: block;
	}
	.other-nav-close {
		position: relative;
		display: inline-block;
		width: 100%;
	}
	.no-js .other-nav-close {
		display: none;
	}
	.blocInfo .side.last{
		margin-right: 0;
	}
	.blocInfo .side ul{
		margin: 20px 0 0;
		padding: 0;
		font-size: 0.8em;
	}
	.blocInfo .side ul li{
		margin: 0;
		padding: 0;
		list-style-type:none;
	}
	.blocInfo .side ul li a{
		margin: 0;
		padding: 0;
		color: #898B7F;
		text-decoration: none;
	}
	.no-touch .blocInfo .side ul li a:hover{
		color: #e2e8d3;
	}
	
	/* @group portraits */
	
	 .blocInfo .side ul li a.lien-friend{
	 	text-decoration: underline;
	 }
	
	.ligne-portrait{
		display: block;
		width: 100%;
		margin-bottom: 20px;
		background: #fff;
	}
	
	.imgPortrait{
		display: block;
		width: 55%;
		height: auto;
		position: relative;
		float: left;
	}
	
	.ligne-portrait.txt-gauche .imgPortrait{
		float: right;
	}
	
	.imgPortrait img{
		display: block;
		position: relative;
		width: 100%;
		height: auto;
		
	}
	
	.descPortrait{
		display: block;
		width: 35%;
		height: auto;
		padding: 5%;
		float: right;
	}
	
	.ligne-portrait.txt-gauche .descPortrait{
		float: left;
	}

	.descPortrait h4{
		margin-top: 0;
	}
	
	/* @end */
	
	.blocInfo .side img{
		display: inline-block;
		width: 50%;
		height: auto;
	}
	.blocInfo .side h4{
		display: inline-block;
		margin: 0 0 0 15px;
		vertical-align:bottom;
	}
	.blocInfo.linkscontent .side  h4{
		margin-left: 0;
	}
	.infoStudio img{
		margin-bottom: 2%;
		margin-left: 0;
	}
	.infoStudio img.full{
		width: 100%;
		height: auto;
	
	}
	.infoStudio img.half{
		margin-right: 2%;
		width: 49%;
		height: auto;
	}
	.infoStudio img.half.last{
		margin-right: 0;
		width: 49%;
	}
	.contactContent img.full{
		position: relative;
		display: block;
		width: 100%;
		height: auto;
	}
	.adresse{
		font: normal normal 1.2em/1.2em 'MenschBold', Arial, sans-serif;
	}
	.adresse a{
		color: #e2e8d3;
		text-decoration: none;
	}
	.no-touch .adresse a:hover{
		text-decoration: underline;
	}
	.adresse a span{
		font-family: 'Helvetica', Arial, sans-serif;
	}
/* @end */

/* @group ZOOM */

	.zoom {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 999;
		display: block;
		overflow: hidden;
		margin: 0;
		padding: 0;
		width: 100%;
		height: 100%;
		background: rgb(246,246,246) url("../layoutImg/loader.gif") no-repeat 45% 45%;
	}
	
	#zoom-content.lab .zoom {
		background: rgb(58,58,58) url("../layoutImg/loader2.gif") no-repeat 45% 45%;
	}
	
	#container-zoom {
		position: fixed;
		width: 100%;
		height: 100%;
		margin: 0;
	}
	#zoom-content{
		z-index: 160;
	}
	.zoom-nav-left, .zoom-nav-right, .zoom-nav-close {
		position: absolute;
	}
	
	.leftZoom{
		position: absolute;
		top: 140px;
		left: -50px;
		z-index: 10;
		width: 50px;
		height: 300px;
	}
	
	.rightZoom{
		position: absolute;
		top: 140px;
		right: -200px;
		width: 200px;
		height: 300px;
	}
	/*animations de transition pour les boutons de zoom*/
	.zoom-nav-left .arrow,.zoom-nav-right .arrow{
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	.zoom-nav-right {
		overflow: hidden;
		width: 45px;
		height: 45px;
	}
	
	.zoom-nav-right .firstArrow{
		position: absolute;
		left: 13px;
		display: inline-block;
		width: 13px;
		height: 23px;
		background: url("../layoutImg/zoom-nav-right.png") no-repeat -52px 0;
		opacity: 1;
	}
	.zoom-nav-right .lastArrow{
		position: absolute;
		left: -5px;
		display: inline-block;
		width: 13px;
		height: 23px;
		background: url("../layoutImg/zoom-nav-right.png") no-repeat 0 0;
		opacity: 0;
	}
	.no-touch .zoom-nav-right:hover .firstArrow{
		left: 36px;
		opacity: 0;
	}
	.no-touch .zoom-nav-right:hover .lastArrow{
		left: 18px;
		opacity: 1;
	}
	
	.zoom-nav-left{
		display: block;
		overflow: hidden;
		width: 50px;
		height: 22px;
	}
	.zoom-nav-close, .other-nav-close{
		display: block;
		overflow: hidden;
		width: 28px;
		margin-top: -4px;
		height: 28px;
		background: url("../layoutImg/zoom-nav-close.png") no-repeat -38px 6px;
	}
	
	.zoom-nav-close:hover, .other-nav-close:hover{
		background: url("../layoutImg/zoom-nav-close.png") no-repeat 6px 6px;
	}
	
	.zoom-nav-left .firstArrow{
		position: absolute;
		left: 13px;
		display: inline-block;
		width: 12px;
		height: 23px;
		background: url("../layoutImg/zoom-nav-left.png") no-repeat 0 0;
		opacity: 1;
	}
	.zoom-nav-left .lastArrow{
		position: absolute;
		left: 40px;
		display: inline-block;
		width: 13px;
		height: 23px;
		background: url("../layoutImg/zoom-nav-left.png") no-repeat -52px 0;
		opacity: 0;
	}
	.zoom-nav-left:hover .firstArrow{
		left: -10px;
		opacity: 0;
	}
	.zoom-nav-left:hover  .lastArrow{
		left: 13px;
		opacity: 1;
	}
	.zoom-nav-close {
		right: 25px;
	}
	
	.zoom-social {
		position: absolute;
		bottom: 0;
		left: 15px;
	}
	
	.zoom-social h4 {
		margin: 0 0 14px 0;
		padding-left: 12px;
		height: 15px;
		background: url("../layoutImg/zoom-icon-share.png") no-repeat 0 2px;
		color: #898B7F;
		font: normal normal 100 0.9em 'MenschBold', Arial, sans-serif;
	}
	
	.zoom-social ul, .zoom-social li {
		margin: 0;
		padding: 0;
	}
	
	.zoom-social li {
		display: inline-block;
		margin-right: 5px;
		width: 28px;
		height: 28px;
	}
	
	.zoom-social ul li a.zoom-facebook, .zoom-social ul li a.zoom-twitter{
		display: block;
		width: 28px;
		height: 28px;
		-webkit-border-radius: 25px;
		-moz-border-radius: 25px;
		border-radius: 25px;
		-webkit-transition: all 0.2s ease-in-out;
		-moz-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		-o-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
	}
	
	.zoom-social ul li a.zoom-facebook{
		background: url("../layoutImg/zoom-sprite-fcb.png") no-repeat;
		-webkit-transition: all 0.4 ease-in-out;
		-moz-transition: all 0.4 ease-in-out;
		-ms-transition: all 0.4 ease-in-out;
		-o-transition: all 0.4 ease-in-out;
		transition: all 0.4 ease-in-out;
	}
	
	.zoom-social ul li a.zoom-facebook:hover {
		background: url("../layoutImg/zoom-sprite-fcb.png") no-repeat 0 bottom;
	}
	
	.zoom-social ul li a.zoom-twitter{
		background: url("../layoutImg/zoom-sprite-twitter.png") no-repeat;
		-webkit-transition: all 0.4 ease-in-out;
		-moz-transition: all 0.4 ease-in-out;
		-ms-transition: all 0.4 ease-in-out;
		-o-transition: all 0.4 ease-in-out;
		transition: all 0.4 ease-in-out;
	}
	
	.zoom-social ul li a.zoom-twitter:hover {
		background: url("../layoutImg/zoom-sprite-twitter.png") no-repeat 0 bottom;
	}
	
	.zoom-nav-visuel{
		position: absolute;
		top: 40px;
		left: 15px;
	}
	
	.zoom-nav-visuel span{
		display: inline-block;
		margin: 5px 0 0 0;
		padding: 0;
		width: 8px;
		height: 2px;
		background-color: #aeb1a2;
		vertical-align: top;
		
	}
	
	.zoom-nav-visuel h3{
		display: inline-block;
		margin: 0 0 0 4px;
		padding: 0;
		color: #898b7f;
		vertical-align: top;
		text-align:left;
		text-transform: uppercase;
		font: normal 0.9em 'MenschBold', Arial, sans-serif;
	}
	
	.zoom-nav-visuel ul {
		margin: 0;
		padding: 0;
	}
	
	.zoom-nav-visuel li {
		display: inline-block;
		margin-right: 5px;
		list-style:none;
		vertical-align:middle;
	}
	
	.zoom-nav-visuel li a {
		display: block;
		width: 2px;
		height: 2px;
		background: url("../layoutImg/zoom-bullet.png") no-repeat;
	}
	
	.zoom-nav-visuel li a.zoom-active {
		width: 4px;
		height: 4px;
		background: url("../layoutImg/zoom-bullet-hover.png") no-repeat;
	}
	
	.zoom-visuel, a.zoom-visuel {
		position: absolute;
		top: 20px;
		left: 50px;
		margin: 0;
		width: auto;
		height: auto;
		cursor: default;
		cursor:zoom-out;
		cursor: -webkit-zoom-out;
		cursor: -moz-zoom-out;
		display: block;
	}
	
	.zoom-visuel img{
		width: 100%;
	}

	.zoom-visuel img.oldimg{position: absolute;display: block;
	}
/* @end */

.js .bloc-logo {
	left: -2000px;
}
.js .nav-portfolio {
	opacity: 0;
}

/* @group Non semantic Boilerplate */

/* remplacement image */
.ir {
	overflow: hidden;
	/* IE 6/7 fallback */
	border: 0;
	background-color: transparent;
	*text-indent: -9999px;
}
.ir:before {
	display: block;
	width: 0;
	height: 100%;
	content: "";
}

/* masquage de texte, alternative (buggé?) */
.hide-text {
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
}

/* masqué */
.hidden {
	display: none !important;
	visibility: hidden;
}

/* masqué juste sur l'écran (pas sur RSS ou moteurs) */
.visuallyhidden {
	position: absolute;
	overflow: hidden;
	clip: rect(0 0 0 0);
	margin: -1px;
	padding: 0;
	width: 1px;
	height: 1px;
	border: 0;
}

/* clearfix */
.clearfix:before,
.clearfix:after {
	display: table; /* 2 */
	content: " "; /* 1 */
}
.clearfix:after, .clear {
	clear: both;
}

/* @end */



/* ******************************************  MOBILE  ******************************************* */


@media only screen and (min-width: 50px) and (max-width: 850px) {
	

	/* @group Home */
	#lab-choice {
		display: block;
		height: 300px;
		margin-right:0;
		margin-bottom: 20px;
		width: 100% !important;
		background: #000;
	}
	
	#pro-choice {
		display: block;
		height: 300px;
		width: 100% !important;
		background: #000;
	}
	
	#content-choice {
		width: 100%;
		white-space:normal;
	}
	
	.baselinechoice {
		text-indent: 0;
	}
	
	#content-choice a h3{
		opacity: 1;
		font: normal 5em 'MenschRegular', Arial, sans-serif;
	}
	
	#content-choice a span {
		opacity: 1;
	}
	
	#nav-home-right {
		right:  4%;
	}
	
	#nav-home-left {
		 left:  4%;
	}
	
	#lab-choice img, #pro-choice img {
		opacity: 0.75 !important;
	}


	/* @end */
	
	.content {
		width: 90%;
		position: relative;
		padding: 0 5%;
	}
	
	.pro .content {
		margin: 0;
	}
	
	.js .lab .content {
		margin: 0;
	}
	
	
	.content div:first-child{
		padding-top: 320px;
	}
	
	ul.main-nav .infos a, ul.main-nav .links a, ul.main-nav .contact a {
		background-image: url("../layoutImg/picto-menu-touch.png");
		background-size: 104px 60px;
	}
	
	a.img-main {
		cursor: default;
	}
	
	/* @group INDEX */

		.pro .header, .lab .header  {
			position: static  !important;
			margin: 0 !important;
			width: auto;
			padding: 0;
			height: 0;
		}
		
		#nav-categ-main {
			top: 0 !important;
			z-index: 3;
			margin: 0 auto !important;
			width: 150px !important;
			padding: 0;
			text-align: center;
		}
		
		.bloc-logo {
			margin: 30px auto  !important;
			width: 100%  !important;
		}
		

		.logo{
			display: block;
			margin: 20px 0 20px 0;
			padding: 0;
			width: 100%;
		}

		.logo a{
			display: block;
			width: 100%;
			height: 100%;
		}
		
		.isTouch #nav-categ {
			margin: 0 auto;
			padding: 0;
			top: 270px;
			left: 50%;
			right: auto;
			margin-left: -151px;
			width: 150px;
			z-index: 5;
		}
		.isTouch #nav-categ li {
			display: inline-block;
			padding: 0 !important;
			margin: 0 !important;
			width: 75px;
			background: none;
			float: left;
			z-index: 998;
		}
		.isTouch .pro #nav-categ li, .isTouch .lab #nav-categ li {
			text-align: left;
		}
		.isTouch .pro #nav-categ li:first-child, .isTouch .lab #nav-categ li:first-child {
			text-align: right;
		}
		.isTouch #nav-categ li {
			border-bottom: 1px solid #ccc;
		}
		.isTouch #nav-categ li.active {
			border-bottom: 1px solid #e44500;
		}
		.isTouch #nav-categ li span {
			display: none;
		}
		.isTouch .nav-portfolio{
			display: none;
		}
	/* @end */

	/* @group HOME */
		.logo-home {
			display: block;
			margin: 20px auto 10px auto;
			padding: 0;
			width: 24px;
			height: 13px;
		}
		
		.logo-home a {
			background: url("") no-repeat;
			display: block;
			width: 100%;
			height: 100%;
		}
		
		.header {
			top: 0;
			left: 0;
			display: block !important;
			margin: 0;
			padding-top: 80px;
		}
		
		#nav-categ-main {
			position: absolute;
		}
		
		.baselinehome {
			margin: 15px 0 0;
			padding-left: 0;
			width:100%;
		}
		.baselinehome h3{
			margin-bottom: 19px;
		}
	
	/* @end */
	
	.no-js .nav-portfolio {
		display: none;
	}
	
	.no-js #nav-categ {
		border: 0 none;
		top: 230px;
		right: auto;
		left: 50%;
		margin-left: -110px;
	}
	
	.no-js #nav-categ li {
		display: inline-block;
		text-align: center;
	}
}



/* ******************************************       RETINA        ***************************************** */

/* retina */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (min-width: 50px) and (max-width: 850px) { 
       ul.main-nav .infos a, ul.main-nav .links a, ul.main-nav .contact a {
	       	background-image: url("../layoutImg/picto-menu-touch-retina-1-5.png");
       }
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 50px) and (max-width: 850px) {
       ul.main-nav .infos a, ul.main-nav .links a, ul.main-nav .contact a {
	       	background-image: url("../layoutImg/picto-menu-touch-retina-2.png");
       }
}


/* ******************************************       SMALLSCREEN         ******************************************* */
@media only screen and (max-width: 850px) {
	/* @group portraits */
		
		
		.imgPortrait{
			display: block;
			width: 100%;
			height: auto;
			position: relative;
			float: none;
		}
		
		.ligne-portrait.txt-gauche .imgPortrait{
			float: none;
		}
		
		.imgPortrait img{
			display: block;
			position: relative;
			width: 100%;
			height: auto;
		}
		
		.descPortrait{
			display: block;
			width: 90%;
			height: auto;
			padding: 5%;
			float: none;
		}
		
		.ligne-portrait.txt-gauche .descPortrait{
			float: none;
		}
	
		.descPortrait h4{
			margin-top: 0;
		}
		
		/* @end */
}

@media only screen and (min-width: 851px) {

		/* @group portraits */
		
		.imgPortrait{
			width: 100%;
			float: none;
		}
		
		.ligne-portrait.txt-gauche .imgPortrait{
			float: none;
		}
		
		.descPortrait{
			display: block;
			width: 90%;
			height: auto;
			padding: 5%;
			float: none;
		}
		
		.ligne-portrait.txt-gauche .descPortrait{
			float: none;
		}
		
		/* @end */

	a.img-main {
		cursor: pointer;
		cursor:zoom-in;
		cursor: -webkit-zoom-in;
		cursor:-moz-zoom-in
	}
	
	body {
		-webkit-transition: background 0.9s ease-out;
		-moz-transition: background 0.9s ease-out;
		-ms-transition: background 0.9s ease-out;
		-o-transition: background 0.9s ease-out;
		transition: background 0.9s ease-out;
	}
	
	.container, .main {
		width: 550px;
	}
	
	ul.main-nav {
		display: block;
		padding-top: 17px;
		width: 100%;
		border-top: solid 1px rgba(174, 177, 162, 0.5);
		list-style: none;
		border-top-radius: 25px;
	}
	
	ul.main-nav li {
		margin: 0;
		padding: 0;
	}
	
	ul.main-nav a {
		display: block;
		-webkit-border-radius: 0px 0px 0px 0px;
		border-radius: 0px 0px 0px 0px;
	}
	
	ul.main-nav a:hover {
		color: #898b7f;
	}

	/* @group INDEX */
		.header {
			position: fixed;
			top: 0;
			display: block;
			margin: 0 0 0 -384px;
			width: 768px;
		}
			
		#nav-categ-main {
			margin-left: -300px;
		}
			
		.bloc-logo {
			position: absolute;
			top: 50px;
			width: 150px;
		}
			
		.baselinehome {
			margin: 49px 0 0;
			padding-left: 11px;
			width: 90px;
		}
			
		.logo {
			display: block;
			margin: 0 0 116px 0;
			padding: 0;
		}
			
		.logo a {
			display: block;
			width: 100%;
			height: 100%;
		}
			
		.containerNav {
			position: relative;
			bottom: 0;
			padding-top: 0;
			background-color: rgba(255, 255, 254, 0);
		}
		
		.nav-portfolio {
			position: absolute;
			top: 186px;
			width: 140px;
		}
	

	/* @end */

	ul.main-nav {
		display: block;
		padding-top: 17px;
		width: 100%;
		border-top: solid 1px rgba(174, 177, 162, 0.5);
		list-style: none;
		border-top-radius: 25px;
	}

	ul.main-nav li {
		display: block;
		margin: 0;
		padding: 0;
	}

	ul.main-nav a {
		display: block;
		margin-bottom: 6px;
		margin-left: 13px;
		width: 100px;
		color: #aeb1a2;
		text-decoration: none;
		text-indent: 0;
		text-transform: uppercase;
		font: normal normal 0.85em 'MenschBold', Arial, sans-serif;
		-webkit-transition: color 0.2s ease-in-out;
		-moz-transition: color 0.2s ease-in-out;
		-ms-transition: color 0.2s ease-in-out;
		-o-transition: color 0.2s ease-in-out;
		transition: color 0.2s ease-in-out;
	}

	ul.main-nav li.infos a, ul.main-nav li.links a, ul.main-nav .contact a, ul.main-nav li.infos a:hover, ul.main-nav li.links a:hover, ul.main-nav .contact a:hover {
		background-image: none;
	}

	ul.main-nav a:hover {
		color: #898b7f;
		background-image: none;
	}
	.no-touch ul.main-nav .infos a:hover, ul.main-nav .infos a:hover  {
	background-image: none;	}
	.no-touch ul.main-nav .links a:hover , ul.main-nav .links a:hover  {
	background-image: none;	}
	.no-touch ul.main-nav .contact a:hover, ul.main-nav .contact a:hover  {
	background-image: none;	}
	.other {
		width: 491px;
	}

	.content{width: 370px;}
	.content{margin-left: 35px;}
	.js .lab .content{margin-left: 182px;}
	.nav-portfolio{right: 100px;}
	.js .lab .nav-portfolio{left: 355px;}
	.lab .bloc-logo{left:200px;}

	.blocInfo .side {
		display: inline-block;
		margin-right: 5%;
		width: 47.5%;
		vertical-align: top;
	}

	/* @end */
	.no-js #nav-categ-main {
		margin: 0;
		width: 140px;
		left: 50%;
		margin-left: 245px;
	}

}


@media only screen and (max-width: 1100px) {
	.container-home {
		width: 90%;
	}
}


/* ******************************************       DESKTOP                  **************************************** */

@media only screen and (min-width: 993px) {

		/* @group portraits */
		.ligne-portrait{
			position: relative;
			padding-top: 5px;
		}
		
		.imgPortrait{
			width: 60%;
			float: left;
			position: relative;
			position: absolute;
			bottom: 0;
			left: 0;
			margin-top: 10px;
		}

		.ligne-portrait.txt-gauche .imgPortrait{
			float: right;
			position: absolute;
			bottom: 0;
			right: 0;
			left: inherit;
		}
		
		.descPortrait{
			width: 30%;
			padding: 5%;
			float: right;
			height: 379px;
		}
		
		.ligne-portrait.txt-gauche .descPortrait{
			float: left;
		}
		
		/* @end */
		
	.main {
		width: 720px;
	}
	
	.container {
		padding-right: 0;
		width: 720px;
	}
	
	.js .container.lab .content {
		padding-right: 60px;
	}
	
	/* @group INDEX */
		#nav-categ-main {
			position: fixed;
			top: 0;
			display: block;
			margin: 0 0 0 -335px;
			width: 993px;
		}
		
		.header {
			position: fixed;
			top: 0;
			display: block;
			margin: 0 0 0 -496px;
			width: 993px;
		}
	
		.lab .header {
			margin-left: -475px;
		}
	
		.bloc-logo {
			position: absolute;
			top: 50px;
		}
	
		.nav-portfolio {
			position: absolute;
			right: 0;
			width: 140px;
		}
		
		.no-js .nav-portfolio {
			top: 186px;
		}
	
		.content{width: 480px;}
		.content{margin-left: 40px;}
		.js .lab .content{margin-left: 180px;}
	
		.nav-portfolio{right: 150px;}
		.js .lab .nav-portfolio{left: 125px;}
		.pro #nav-categ { left: -85px;}
	
		.other {
			width: 644px;
		}
	/* @end */
	.no-js #nav-categ-main {
		margin: 0;
		width: 140px;
		left: 50%;
		margin-left: 360px;
	}
}


/* ******************************************       WIDE        ***************************************** */


@media only screen and (min-width: 1383px) {
	.container, .main {
		width: 1200px;
	}
	
		/* @group portraits */
		
		.ligne-portrait{
			display: block;
			width: 100%;
			margin-bottom: 20px;
			background: #fff;
		}
		
		.imgPortrait{
			display: block;
			width: 55%;
			height: auto;
			position: relative;
			float: left;
		}
		
		.ligne-portrait.txt-gauche .imgPortrait{
			float: right;
			position: relative;
		}
		
		.imgPortrait img{
			display: block;
			position: relative;
			width: 100%;
			height: auto;
		}
		
		.descPortrait{
			display: block;
			width: 35%;
			height: auto;
			padding: 5%;
			float: right;
		}
		
		.ligne-portrait.txt-gauche .descPortrait{
			float: left;
		}
	
		.descPortrait h4{
			margin-top: 0;
		}
		
		/* @end */
	
	/* @group INDEX */
		.header, .header, #nav-categ-main {
			position: fixed;
			top: 0;
			display: block;
			margin: 0 0 0 -600px;
			width: 1200px;
		}
	
		.lab .header {
			margin-left: -600px;
		}
	
		.nav-portfolio {
			position: absolute;
			top: 186px;
			width: 140px;
		}
	
		.nav-portfolio {    right: 190px;  }
		.js .lab .nav-portfolio {    left: 195px;  }
		.content{width: 795px;}
		.content{margin-left: 65px;}
		.js .lab .content{margin-left: 345px;}
	/* @end */

	.pro #nav-categ {
		left: 0;
	}
	.other {
		padding-right: 190px;
		width: 878px;
	}
	
	.no-js #nav-categ-main {
		margin: 0;
		width: 140px;
		left: 50%;
		margin-left: 460px;
	}
}



/* ==|== print styles =======================================================
========================================================================== */

@media print {
	* { background: transparent !important; color: black !important; text-shadow: none !important; -ms-filter: none !important; filter:none !important; } /* Black prints faster: h5bp.com/s */
	a, a:visited { text-decoration: underline; }
	a[href]:after { content: " (" attr(href) ")"; }
	.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
	pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
	thead { display: table-header-group; } /* h5bp.com/t */
	tr, img { page-break-inside: avoid; }
	img { max-width: 100% !important; }
	@page { margin: 0.5cm; }
	p, h2, h3 { orphans: 3; widows: 3; }
	h2, h3 { page-break-after: avoid; }
}

/* ==========================================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */