/* CSS Document */


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.box_defilante{
	position: relative;
	width: 100%;
	overflow: hidden;
}

.box_defilante.fond{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    min-height: 100%;
    margin:0px;
    padding: 0px;
    overflow: hidden;
}

.box_defilante_contenu{
	position:relative;
	min-width:100%;
	min-height:100%;
	white-space:nowrap;
	overflow:visible;
	left:0px;
	/*font-size: 0px;*/
	/*cursor: e-resize;*/

	-webkit-transition: left 0.8s ease-in-out;
	-moz-transition: left 0.8s ease-in-out;
	-ms-transition: left 0.8s ease-in-out;
	-o-transition: left 0.8s ease-in-out;
	transition: left 0.8s ease-in-out;
}

.box_defilante_contenu_vitesse_rapide{
	-webkit-transition: left 0.4s ease-in-out;
	-moz-transition: left 0.4s ease-in-out;
	-ms-transition: left 0.4s ease-in-out;
	-o-transition: left 0.4s ease-in-out;
	transition: left 0.4s ease-in-out;
}

.box_defilante_contenu_draggable{
	-webkit-transition: left 0s;
	-moz-transition: left 0s;
	-ms-transition: left 0s;
	-o-transition: left 0s;
	transition: left 0s;
}

.box_defilante .cellule{
	position:relative!important;
	display:inline-block!important;
	float: none!important;
	white-space: normal;
	overflow: hidden;
	min-height: 100%;
	vertical-align: top;
}

.box_defilante .cellule_contenu_contenu{
	width:100%;
	white-space: normal;
	min-height: 100%;
	overflow: hidden;
}

.box_defilante_prev,.box_defilante_next{
	position:absolute;
	z-index: 5;
	height: 60px;
	width: 30px;/*auto*/
	top:0px;
	
	background-color:#000001/*couleur2*/;
	
	-webkit-background-size:contain;
	-moz-background-size:contain;
	-ms-background-size:contain;
	-o-background-size:contain;
	background-size:contain;
	background-position:center;
	background-repeat:no-repeat;
	
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-ms-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
}

.box_defilante_prev{
	left:0px;
	margin-left: 20px;
	
	-webkit-mask:url(../../images/prev.svg) no-repeat 50% 50%;
	-moz-mask:url(../../images/prev.svg) no-repeat 50% 50%;
	-ms-mask:url(../../images/prev.svg) no-repeat 50% 50%;
	-o-mask:url(../../images/prev.svg) no-repeat 50% 50%;
	mask:url(../../images/prev.svg) no-repeat 50% 50%;
}

.box_defilante_next{
	right:0px;
	margin-right: 20px;
	
	-webkit-mask:url(../../images/next.svg) no-repeat 50% 50%;
	-moz-mask:url(../../images/next.svg) no-repeat 50% 50%;
	-ms-mask:url(../../images/next.svg) no-repeat 50% 50%;
	-o-mask:url(../../images/next.svg) no-repeat 50% 50%;
	mask:url(../../images/next.svg) no-repeat 50% 50%;
}
/*
@media (max-width: 800px){
	.box_defilante_prev,.box_defilante_next{
		margin-top:-30px;
		height: 60px;
		width: 30px;
		left:15px;
	}
	
	.box_defilante_next,.titre_section_visible .box_defilante_next{
		left: auto;
		right:15px;
	}
}
*/
@media (max-width: 800px){
	.box_defilante_prev,.box_defilante_next{
		margin-left:0px;
		margin-right: 0px;
	}
	
	.box_defilante_prev{
		left: 25px;
	}
	
	.box_defilante_next{
		right:25px;
	}
	
	.box_defilante{
		width: auto;
		margin-left: 50px;
		margin-right: 50px;
	}
}

@media (max-width: 500px){
	.box_defilante_prev,.box_defilante_next{
		margin-left:0px;
		margin-right: 0px;
	}
	
	.box_defilante_prev{
		width: 25px;
		height: 50px;
		left: 15px;
	}
	
	.box_defilante_next{
		width: 25px;
		height: 50px;
		right:15px;
	}
	
	.box_defilante{
		width: auto;
		margin-left: 35px;
		margin-right: 35px;
	}
}

@media (max-width: 450px){
	.box_defilante.disposition_portfolio_brief{
		width: 190px;
		margin:auto;
	}
}

@media (max-width: 400px){
	.box_defilante_prev{
		width: 20px;
		height: 40px;
		left: 15px;
	}
	
	.box_defilante_next{
		width: 20px;
		height: 40px;
		right:15px;
	}
	
	.box_defilante{
		width: auto;
		margin-left: 24px;
		margin-right: 24px;
	}
}


.box_defilante_prev:hover,.box_defilante_next:hover{
	cursor: pointer;
	background-color:#000002;
	
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-ms-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
}

/*

.box_defilante.variante1 .cellule{
	width:32.6%;
	margin-right:1.1%;
}

@media (max-width: 1000px){
	.box_defilante.variante1 .cellule{
		width:50%;
		margin-right:2%;
	}
}

@media (max-width: 600px){
	.box_defilante.variante1 .cellule{
		width:100%;
		margin-right:3%;
	}
}
*/
.disposition_2colonnes .cellule{
	width:48%;
	margin-right: 4%;
}

.disposition_3colonnes .cellule{
	width:32%;/*32%*/
	margin-right: 2%;
}

.disposition_references .cellule{
	width:16%;
	margin-right: 4%;
}

.disposition_references .cellule.big {
	width: 40%;
}

.disposition_references .cellule img{
	max-width: 112px!important;
	width: 80%;
}


@media(max-width:800px){
	.disposition_3colonnes .cellule{
		width: 48%;
		margin-right:4%;
	}
	
	.disposition_2colonnes .cellule{
		width: 100%;
		margin-right:4%;
	}
}

@media(max-width:700px){
	.disposition_references .cellule{
		width:21%;
		margin-right: 4%;
	}
	
	.disposition_references .cellule.big {
		width: 50%;
	}
}

@media(max-width:500px){
	.disposition_3colonnes .cellule{
		width: 100%;
		margin-right:4%;
	}
	
	.disposition_references .cellule{
		width:29.33%;
		margin-right: 6%;
	}
	
	.disposition_references .cellule.big {
		width: 64%;
	}
}

@media(max-width:400px){
	.disposition_3colonnes .cellule{
		width: 100%;
		margin-right:4%;
	}
	
	.disposition_references .cellule{
		width:45%;
		margin-right: 10%;
	}
	
	.disposition_references .cellule img{
		max-width: 80px!important;
	}
	
	.disposition_references .cellule.big {
		width: 100%;
	}
}

@media(max-width:400px){
	.disposition_3colonnes .cellule{
		width: 100%;
		margin-right:4%;
	}
	
	.disposition_references .cellule{
		width:45%;
		margin-right: 10%;
	}
	
	.disposition_references .cellule.big {
		width: 100%;
	}
}

.disposition_portfolio_brief .cellule{
	width:190px;/*32%*/
	margin-right: 22px;
}

@media(max-width:230px){
	.disposition_portfolio_brief .cellule{
		width: 100%;
		margin-right:4%;
	}
}


/*--------------------------------------------------------------*/

/*désactivation du changement de couleur de la flêche pour IE et EDGE*/
@supports (-ms-ime-align: auto) {
   /* Microsoft EdgeV13&14 CSS styles go here */
	.box_defilante_prev{
		background-color:transparent;
		background-image:url(../../images/prev.svg);
	}
	.box_defilante_next{
		background-color:transparent;
		background-image:url(../../images/next.svg);
	}
	.box_defilante_prev:hover{
		background-color:transparent!important;
		background-image:url(../../images/prev_couleur1.svg);
	}
	
	.box_defilante_next:hover{
		background-color:transparent!important;
		background-image:url(../../images/next_couleur1.svg);
	}
}

@supports (-ms-accelerator: true) {
    /* Microsoft EdgeV13 CSS styles go here */
	.box_defilante_prev{
		background-color:transparent;
		background-image:url(../../images/prev.svg);
	}
	.box_defilante_next{
		background-color:transparent;
		background-image:url(../../images/next.svg);
	}
	.box_defilante_prev:hover{
		background-color:transparent!important;
		background-image:url(../../images/prev_couleur1.svg);
	}
	
	.box_defilante_next:hover{
		background-color:transparent!important;
		background-image:url(../../images/next_couleur1.svg);
	}
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10 & IE11 CSS styles go here */
	.box_defilante_prev{
		background-color:transparent;
		background-image:url(../../images/prev.svg);
	}
	.box_defilante_next{
		background-color:transparent;
		background-image:url(../../images/next.svg);
	}
	.box_defilante_prev:hover{
		background-color:transparent!important;
		background-image:url(../../images/prev_couleur1.svg);
	}
	
	.box_defilante_next:hover{
		background-color:transparent!important;
		background-image:url(../../images/next_couleur1.svg);
	}
}

.box_defilante_full_width .box_defilante{
    width: calc(100% - 120px);
    margin-left: auto;
    margin-right: auto;
}


@media(max-width:800px){
    .box_defilante_full_width .box_defilante{
        width: calc(100% - 50px);
    }
}

@media(max-width:500px){
    .box_defilante_full_width .box_defilante{
        width: calc(100% - 50px);
    }
}



.box_defilante_full_width .box_defilante_prev{
    left: 0px!important;
}
	
.box_defilante_full_width .box_defilante_next{
    right:0px!important;
}