@media screen and (max-width: 760px){

	.toTop , .owl-page {
		display:none
	}
	
	.toTop img {
		display:none
	}
	
	.section-0 li{
		float:left;
		width:50%;
		border-collapse: collapse;
		border:1px solid #7f7f7f;
		text-align: center;
		height: 35px;
		line-height: 35px;
		vertical-align: middle;
		margin:0;
	}

	.section-0 img{
		vertical-align: middle;
		max-height: 20px;
	}
	
	.absolute h3{
		font-size: 1.2em;
		padding:0;
	}
	
	.section-2 p {
		font-size: 0.80em;
		padding: 0;
	}
	
	.videopreview {
		width: 100%;
    	text-align: center;
	}
	
	.violet-gauche {
		margin: 0 auto;
    	text-align: center;
		padding:100px 10px 30px !important;
	}

	.violet-droite {
		padding:10px 10px 30px 10px !important;
		width:auto;
	}
	
	.violet-contenu {
		font-size: 24px;
		line-height: 1.3em;
	}

	.js-content .video_embed_ctn iframe{
		width: 100%;
		margin: 0;
	}

	.js-content .video-texte{
    	background-color:black;
    	padding:0 0 25px 25px;
	}
	
}

@media only screen and (min-width:761px) and (max-width : 1000px) {

	.section-0 li{
		float:left;
		width:50%;
		border-collapse: collapse;
		border:1px solid #7f7f7f;
		text-align: center;
		height: 50px;
		line-height: 50px;
		vertical-align: middle;
		margin:0;
	}

	.section-0 img{
		vertical-align: middle;
	}
	
	.absolute h3{
		font-size: 1.4em;
		padding:0;
	}
		
	.section-2 p {
		font-size: 1em;
		padding: 0;
	}
	
	.violet-gauche {
		width:300px;
		padding:100px 10px 30px !important;
		float:left;
	}

	.violet-droite {
		padding:100px 10px 30px 10px !important;
		width:auto;
	}
	
	.violet-contenu {
		font-size: 26px;
		line-height: 1.4em;
	}

	.js-content .video_embed_ctn iframe{
		width: 100%;
		margin: 20px 0 0 0;
	}

	.js-content .video-texte{
    	background-color:black;
    	padding:25px 0 40px 25px;
	}
	
}

@media screen and (max-width: 1000px){
	body > *,.container{
		max-width: 100%;
	}

	.container{
		width:auto;
	}

	.contenu-image{
		width:100%;
	}

	img,
	video,
	iframe{
		max-width: 100%;
	}

	.trame_play_content{
	    top:25px;
	}

	.trame_play_content a,.trame_play img{
		width:40px;
	}


	.gris{
		margin-top:0;
	}

	.section-1,
	.section-3,
	.section-4,
	.section-5,
	.section-5-bis,
	.section-6,
	.section-8 .sociaux,
	.hidden-s,
	.haut
	{
		display: none;
	}

	.only-sm{
		display: block;
	}
	
	/***************** section-0 ******************/
	.section-0 ul,
	.section-0{
		height: auto;
		padding:0;
		border:none;
	}

	.section-0 li + li{
		margin-left: 0;
	}

	.section-0 li:nth-child(odd){
		border-left:none;
	}

	.section-0 li:nth-child(even){
		border-right:none;
	}

	.section-0 li:nth-child(n+3){
		border-top:none;
	}

	.section-0 span{
		display: none;
	}

	/********************** header ******************/

	.contenu-nav{
		position: relative;
		padding-left:1em;
		height:90px;
		padding-bottom:0;
		padding-left:0;
	}

	#bandeau{
		max-width: 100%;
		width:100%;
		height: auto;
		padding-left:0;
	}

	.wrapper{
		width:auto;
		max-width: 100%;
	}

	.logo{
		margin-top: 10px;
		padding-left:15px;
	}

	.sociaux.entete{
		top : 60px;
		left: 110px;
		right: auto;
		padding-left:15px;
	}

	.sociaux a.zocial.facebook{
		height:23px;
		width:25px;
		padding-top:2px;
	}

	.sociaux.entete a.zocial.twitter,
	.sociaux.entete a.zocial.linkedin{
		height:23px;
		width:25px;
		padding-top:2px;
	}

	.zocial::before{
		font: 100%/1.65 zocial;
	}

	.sociaux ul{
		display: inline-block;
	}

	.sociaux li{
		margin-left:8px;
	}

	.view-search img{
		display: none;
	}

	.tools{
		width:45px;
		height: 90px;
	}

	.tools > div{
		height: 45px;
		line-height: 0;
	}

	.tools-search { 
	    float:right;
	   	margin-right:0;
	}

	.tools-search > div{
		display: block;
	}

	.tools-search > div.search-form-conteneur{
		position: absolute;
		top:-35px;
		left:0;
		width:100%;
		height:25px;
		display: none;
	}

	.search-form-conteneur input{
		width:90%;
		padding:0 3% 0 7%;
		height: 33px;
		line-height: 33px;
		border:1px solid #737373;
		border-left:none;
		border-right:none;
		background-image:none;
	}

	.search-form-conteneur:after{
		clear:both;
	}


	.search-btn-conteneur{
	    width:45px;
	    height: 45px;
	}

	.view-search, .aff_top_mobile{
		display: inline-block;
		width:100%;
		height:45px;
		background:black url(../img/search-mobile.jpg) no-repeat 50% 50%;
	}

	.aff_top_mobile{
		background:#933cd9 url(../img/affmenu-mobile.jpg) no-repeat 50% 50%;	
	}

	.lighter{
		margin-top:0;
	}

	.navigation{
		display: none;
		position: relative;
		padding:0;
		margin:0;
		height: auto;
		width:100%;
		background-color:#933cd9;
		padding-top:10px;
		padding-bottom:30px;
		border-left:none;
	}

	.navigation li{
		float:left;
		width:45%;
		padding-left:5%;
		padding-top:5px;
	}

	.navigation li a{
		color:white;
		font-family: "MontserratLight";
		font-size:14px;
	}

	/*********************** overlayed ****************/
	.overlayed > div{
		max-width: 90%;
		padding:2em 5% 2em 5% !important;
		margin-left:0;
		margin-right:0;
	}
	
	/******************* section 1 ******************/
	.section-1{
		background-color:#e6e6e6;
		padding:1em;
	}

	.section-1 .container{
		padding:1em;
		background-color: white;
	}

	.flottant-titre,
	.flottant-texte{
		float:none;
		width:auto;
		margin:0;
		padding: 0;
	}

	.flottant-titre br{
		display: none;
	}

	/******************section 2*******************/
	.col1-3,
	.col2-3{
		width:50%;
		overflow: hidden;
		position: relative;
	}

	.col1-3.clickable:before,
	.col2-3.clickable:before{
		content: "";
	    display: block;
	    padding-top: 100%;
	}

	.contenu-crea{
		position: absolute;
		top:0;
		left:0;
		right:0;
		bottom:0;
		background-size:cover;
	}

	.contenu-crea,
	.col1-3,
	.col2-3{
		height:auto;
	}

	.contenu-crea > div{
		display: table;
	   	width: 100%;
	   	height: 100%;
	   	line-height: 100%;
	}

	.contenu-crea span{
		display: table;
	   	width: 100%;
	   	height: 100%;
	}

	.contenu-crea .entete{
		display: table-cell;
		vertical-align: middle;
		text-align: center;
		width:100%;
		height: 100%;
		background-color: white;
	}

	.contenu-crea .absolute{
		position: relative;
	}

	.contenu-crea .entete img{
		display: none;
	}

	.js-content .article-nav{
		position: relative;
		background-color:white;
		left:0;
		width: 100%;
		top:0;
		text-align: center;
		border:1px solid #7f7f7f;
		border-left:none;
		border-right:none;
		height:50px;
		line-height: 50px;
		vertical-align: middle;
	}

	.article-nav img,
	.js-content .croix img,
	.overlayed-intro .croix img{
		display: none;
	}

	.article-nav a{
		background-size:cover;
		display: inline-block;
		height:21px;
		width:12px;
		line-height: 50px;
		vertical-align: middle;
	}

	.article-nav .gauche{
		background-image:url(../img/fleche_gauche.png);
	}

	.article-nav .droite{
		background-image:url(../img/fleche_droite.png);
		margin-left:90px;
	}

	.js-content .croix,
	.overlayed-intro .croix{
		display: block;
		height:50px;
		width:50px;
		border-left:1px solid #7f7f7f;
		right:0;
		left:none;
		top:1px;
		line-height: 50px;
		vertical-align: middle;
		text-align: center;
	}
	.js-content .croix a,
	.overlayed-intro .croix a{
		display: inline-block;
		background-image:url(../img/croix_noir-ptit.png);
		background-size:cover;
		width:17px;
		height: 17px;
		line-height: 50px;
		vertical-align: middle;
	}

	.js-content .entete{
		position: relative;
	}

	.js-content .entete img{
		display:none;
	}

	.js-content .entete .absolute{
		position: relative;
		background-color:white;

	}

	.js-content .entete h3{
		margin:0;
		padding:1em 0 0;
		font-size:1.25em;
		text-align: center;
	}

	.js-content .entete p{
		font-size:0.75em;
		text-align: center;
		padding:0 0 2em;
	}

	.js-content .projet-content{
		position: relative;
		bottom:auto;
		top:0;
		background-color:white;
		padding-left:1.5em;
		margin:0;
	}

	.js-content .projet-content h4{
		padding:1em 0 0;
		font-size : 0.94em;
	}

	.js-content .projet-content p{
		font-size : 0.8125em;
		padding: 0;
	}

	.js-content .projet-content p:last-child{
		padding-bottom:2em;
	}

	/*.js-content .relative + .first{
		margin-top:0;
	}*/

	/********************** section 3 *********************/
	.section-3{
		background-color:#e6e6e6;
		padding:1em;
	}

	.section-3 .container{
		padding:1em;
		background-color: white;
	}

	.photo-bloc{
		margin-top:1em;
		max-width:100%;
		overflow: hidden;
	}

	.photo-ligne:nth-child(even){
	    left:50px;
	}

	.photo-ligne:nth-child(odd){
	    left:-50px;
	}

	.photo-ligne{
		width:auto;
	}

	/******************* section 5 ************************/
	.section-5,.section-5-bis{
		background-color:#e6e6e6;
		padding:1em;
	}

	.section-5{
		padding-bottom:0;
	}

	.section-5-bis{
		padding-top:0;
	}

	.section-5 .container,.section-5-bis .container{
		padding:1em;
		background-color:white;
	}

	.section-5 .container{
		padding-bottom:2em;
	}

	.section-5-bis{
		background-image:none;
	}

	.section-5-bis .container{
		background:url(../img/clients_fond.jpg) repeat 0 15px;
	}


	/********************* section 7 *********************/
	.flottant-left,
	.flottant-right{
		float:none;
		text-align: center;
	}

	.section-7 h1{
		text-align: center;
		text-transform: lowercase;
	}


	/********************** section 8**********************/
	.section-8{
		background-color:#e6e6e6;
		text-align: center;
		padding-bottom:0;
	}

	.toTop{
		display: none;
	}


	/********************* overlayed ************************/

	.overlayed-content{
		padding:1em;
		margin:1em;
		width:100%;
	}

	.overlayed-intro .croix{
		border:none;
		/*top:-20px;*/
	}

	/********************** recrutement *********************/
	.recrutement .overlayed-content,
	.recrutement-plus .overlayed-content{
		background-color:#e6e6e6;
		margin-top:0;
	}

	.recrutement .overlayed-intro,
	.recrutement-plus .overlayed-intro{
		padding-bottom:0 !important;
	}

	.recrutement-plus .overlayed-content > div{
		padding:1em;
		background-color: white;
	}

	.recrutement .overlayed-intro h3, 
	.recrutement-plus .overlayed-intro h3{
		font-size:2em;
		line-height: 1em;
		margin: 1em 0 0.3em;
	}

	.recrutement .overlayed-intro p,
	.recrutement-plus .overlayed-intro p{
	    line-height: 1.3em;
    	text-transform: none;
    	margin-bottom:0;
	}

	.bloc-recrutement{
		background-color:white;
		padding:1em;
	}

	.bloc-recrutement + .bloc-recrutement{
		margin-top:0;
		padding-top:10px;
	}

	/******************** cestnous ********************/
	
	.overlayed.cestnous{
		background-color:white;
	}

	.cestnous-content .croix{
		top:50px;
	}

	.cestnous-content .titrepage{
		margin:50px 0 70px 0;
	}

	.cestnous-right,.cestnous-left{
		width:100%;
		background-color:white;
	}

	.cestnous-content .date, .violet-date{
		font-size:45px;
	}

	.cestnous-right{
		margin-left:0;
	}

	.cestnous-left-bloc.alaune, 
	.cestnous-right-bloc.alaune{
		border-width: 1.3em;
    	margin-left: -1.3em;
    	margin-right:-1.3em;
	}

	.violet-overlay{
		display: block;
		margin-left:-5%;
	}

	.violet-overlay > div{
		display: block;
	}
	
}