@charset "utf-8";
/* CSS Document */
.fill {
	width: 100%;
	height: auto;
	min-height:300px;
	background-position: center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-o-background-size: cover;
}
.carousel-caption {
	position: absolute;
	width:100%;
	right: auto;
	top:0;
	left:0;
	padding-top: 1.25rem;
	padding-bottom: 1.25rem;
	color: #fff;
	text-align: center;
	background-color: #283a80;
}
.carousel-indicators {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
	display: flex;
	justify-content: left;
	padding: 0;
	margin-right: 15%;
	margin-bottom: 1rem;
	margin-left: 15%;
	list-style: none;
}
.div-carr{position:relative;height:280px;overflow:hidden;padding-top:30px;}
#myCarousel-home{height:400px;overflow:hidden;}
#myCarousel-home .carousel-item{height:400px;}

#myCarousel-conf{height:200px;overflow:hidden;}
#myCarousel-conf .carousel-item{height:150px;}
#myCarousel-conf .block{background-color:transparent;height:150px;}
#myCarousel-conf .block .img-responsive{max-height:100px;margin:0 auto;}


.fill.bg-img{height:400px;overflow:hidden;}
.div-un p{margin:0;padding:0;font-size:90%;}
.div-deux p{margin:0;padding:0;font-size:110%;}
.div-un{position:absolute;left:200%;width:45%;animation-duration: 1s;animation-delay:1s;animation-iteration-count:1;animation-fill-mode:forwards;}
.div-deux{position:absolute;top:80px;left:0%;width:45%;animation-duration: 1s;animation-delay: 0;animation-iteration-count: 1;animation-fill-mode:forwards;}
.div-trois{position:absolute;top:600px;left:0%;width:45%;animation-duration: 1s;animation-delay:2s;animation-iteration-count:1;animation-fill-mode:forwards;}
/*
.div-trois a:before{display:block;position:absolute;z-index:0;
		width:30px;
		height: 30px;
		content: '';
		opacity: 0.2;
		background-color: var(--w-white);
		transform-origin: center;
		transform: translate(-40px,-10px)rotate(-23deg);
}*/

@keyframes  cube {
		from {transform: translate(120px,-200%) rotate(0deg);} to {transform:translate(120px,-200%) rotate(360deg);}
	}
/*CAROUSEL PRODUITS*/

@media (min-width:10px){

	.fond{position:absolute;top:0;width:50%;opacity:0.9;left:-100px;}
}
@media (min-width:300px){


	.div-deux h2,.div-un h2{font-size:1em;}
	.div-deux h3,.div-un h3{font-size:1em;}
	.div-deux p,.div-un p{font-size:90%;}
	.div-car-img{top:0px;left:0%;max-width:100%;max-height:160px;height:160px;}
	.div-car-img .img-responsive{ max-height:160px;}.div-car-img2 .img-responsive{ max-height:160px;margin:0 auto;}
	.div-car-img2{top:auto;bottom:0;max-width:100%;max-height:auto;display:block;}
}

@media (min-width:526px){


	.div-deux,.div-un h2{font-size:1em;}
	.div-deux p,.div-un p{font-size:90%;}
	.div-car-img{top:0px;left:0;max-width:70%;max-height:300px;}
	.div-car-img2{top:auto;bottom:0;max-width:100%;max-height:300px;display:block;}
	.div-car-img .img-responsive{ max-height:300px;}.div-car-img2 .img-responsive{ max-height:300px;margin:0 auto;}
}
@media (min-width:590px){
	#myCarousel-home {height: 330px;}
	.fill{ min-height:300px;}
	.fond {width: 105%;left: -30%;}
	.div-un{width:90%;animation-name: anim-un}
	.div-deux{width: 80%;animation-name: anim-deux}
	.div-trois{width:90%;animation-name: anim-trois}
	.div-un h1,.div-un h1{font-size:1.8rem;}

	.div-deux,.div-un h2{font-size:1em;}
	.div-deux p,.div-un p{font-size:90%;}
	.div-car-img{top:0px;left:0;max-width:70%;max-height:200px;}
	.div-car-img2{top:auto;bottom:0;max-width:540px;width:100%;height:230px;bottom:0;z-index:2;}

	@keyframes  anim-un {
		from {left:100%;opacity:1; }to {left:0;opacity:1;}
	}
	@keyframes  anim-deux {
		from {top:-300%;} to {top:180px;}
	}
	@keyframes  anim-trois {
		from {top:450px;} to {top:110px;}
	}
}
@media (min-width:600px){
}
@media (min-width:700px){
	.div-car-img{max-width:60%;}
}
@media (min-width:760px){
	#myCarousel-home {height: 330px;}
	.fill{ min-height:300px;}
	.fond {width: 100%;left: -30%;}
	.div-un{width:70%;animation-name: anim-un}
	.div-deux{width: 70%;animation-name: anim-deux}
	.div-trois{width: 70%;animation-name: anim-trois}
	.div-un h1,.div-un h1{font-size:1.8rem;}

	.div-deux,.div-un h2{font-size:1.1em;}
	.div-deux p,.div-un p{font-size:90%;}
	.div-car-img{top:0;bottom:auto;left:-10%;width:100%;max-width:100%;height:300px;max-height:300px;z-index:1;}
	.div-car-img .img-responsive{ max-height:300px;}.div-car-img2 .img-responsive{ max-height:300px;margin:0 auto;}
	.div-car-img2{top:250px;bottom:auto;max-width:760px;width:100%;height:300px;bottom:0;z-index:2;}
	@keyframes  anim-un {
		from {left:100%;opacity:1; }to {left:0;opacity:1;}
	}
	@keyframes  anim-deux {
		from {top:-300%;} to {top:220px;}
	}
	@keyframes  anim-trois {
		from {top:450px;} to {top:130px;}
	}
}
@media (min-width:800px){
	#myCarousel-home {height: 380px;}
	.fill{ min-height:380px;}
	.fond {width: 100%;left: -30%;}
	.div-un{width:70%;animation-name: anim-un}
	.div-deux{width: 70%;animation-name: anim-deux}
	.div-trois{width: 70%;animation-name: anim-trois}
	.div-un h1,.div-un h1{font-size:1.8rem;}

	.div-deux,.div-un h2{font-size:1em;}
	.div-deux p,.div-un p{font-size:90%;}
	.div-car-img{top:0;bottom:auto;left:0;width:100%;max-width:100%;height:300px;z-index:1;}
	.div-car-img .img-responsive{ max-height:300px;}.div-car-img2 .img-responsive{ max-height:300px;margin:0 auto;}
	.div-car-img2{top:250px;bottom:auto;max-width:100%;width:100%;height:300px;bottom:0;z-index:2;}

	@keyframes  anim-un {
		from {left:100%;opacity:1; }to {left:0;opacity:1;}
	}
	@keyframes  anim-deux {
		from {top:-300%;} to {top:220px;}
	}
	@keyframes  anim-trois {
		from {top:450px;} to {top:130px;}
	}
}
@media (min-width:980px){
	#myCarousel-home {height: 380px;}
	.fill{ min-height:380px;}
	.fond {width: 80%;left: -170px;}
	.div-un{width:60%;animation-name: anim-un}
	.div-deux{width: 60%;animation-name: anim-deux}
	.div-trois{width: 60%;animation-name: anim-trois}
	.div-un h1,.div-un h1{font-size: 2rem;}

	.div-deux h2,.div-un h2{font-size:1.2em;}
	.div-deux p,.div-un p{font-size:90%;}
	.div-car-img{top:0;bottom:auto;left:0;width:100%;max-width:100%;height:300px;z-index:1;}
	.div-car-img .img-responsive{ max-height:300px;}.div-car-img2 .img-responsive{ max-height:300px;margin:0 auto;}
	.div-car-img2{top:auto;bottom:0;max-width:100%;width:100%;height:300px;bottom:0;z-index:2;}

	@keyframes  anim-un {
		from {left:100%;opacity:1; }to {left:0;opacity:1;}
	}
	@keyframes  anim-deux {
		from {top:-300%;} to {top:220px;}
	}
	@keyframes  anim-trois {
		from {top:450px;} to {top:130px;}
	}
}
@media (min-width:1024px){
	#myCarousel-home {height: 380px;}
	.fill{ min-height:380px;}
	.fond {width: 68%;left: -100px;}
	.div-un{width:60%;animation-name: anim-un}
	.div-deux{width: 60%;animation-name: anim-deux}
	.div-trois{width: 60%;animation-name: anim-trois}
	.div-un h1,.div-un h1{font-size: 2.1rem;}
	.div-deux h2,.div-un h2{font-size:1.15em;}
	.div-deux p,.div-un p{font-size:90%;}
	.div-car-img{top:0;bottom:auto;left:-5%;max-width:100%;height:30px;z-index:1;}
	.div-car-img .img-responsive{ max-height:300px;}.div-car-img2 .img-responsive{ max-height:300px;margin:0 auto;}
	.div-car-img2{top:auto;bottom:0;max-width:100%;height:300px;bottom:0;z-index:2;}

	@keyframes  anim-un {
		from {left:100%;opacity:1; }to {left:0;opacity:1;}
	}
	@keyframes  anim-deux {
		from {top:-300%;} to {top:220px;}
	}
	@keyframes  anim-trois {
		from {top:450px;} to {top:130px;}
	}
}
@media (min-width:1100px){
	#myCarousel-home {height: 380px;}
	.fill{ min-height:380px;  }
	.fond {width: 67%;}
	.div-un{width:60%;animation-name: anim-un}
	.div-deux{width: 60%;animation-name: anim-deux}
	.div-trois{width: 60%;animation-name: anim-trois}
	.div-un h1,.div-un h1{font-size: 2.25rem;}

	.div-deux h2,.div-un h2{font-size:1.3em;}
	.div-deux p,.div-un p{font-size:90%;}
	.div-car-img{top:0;bottom:auto;left:-5%;max-width:60%;height:299px;z-index:1;}
	.div-car-img .img-responsive{ max-height:320px;}.div-car-img2 .img-responsive{ max-height:210px;margin:0 auto;}
	.div-car-img2{top:auto;bottom:0;max-width:50%;height:210px;bottom:0;z-index:2;}

	@keyframes  anim-un {
		from {left:100%;opacity:1; }to {left:0;opacity:1;}
	}
	@keyframes  anim-deux {
		from {top:-300%;} to {top:220px;}
	}
	@keyframes  anim-trois {
		from {top:450px;} to {top:130px;}
	}
}
@media (min-width:1200px){
	#myCarousel-home {height: 380px;}
	.fill{ min-height:380px;  }
	.fond {width: 62%;}
	.div-un{width: 55%;animation-name: anim-un}
	.div-deux{width: 45%;animation-name: anim-deux}
	.div-trois{width: 45%;animation-name: anim-trois}
	.div-un h1,.div-un h1{font-size: 2.25rem;}
	.div-deux h2,.div-un h2{font-size:1.3em;}
	.div-deux p,.div-un p{font-size:90%;}
	.div-car-img{top:0;bottom:auto;left:-5%;max-width:60%;height:325px;z-index:1;}
	.div-car-img .img-responsive{ max-height:320px;}.div-car-img2 .img-responsive{ max-height:210px;margin:0 auto;}
	.div-car-img2{top:auto;bottom:0;max-width:60%;height:210px;bottom:0;z-index:2;}

	@keyframes  anim-un {
		from {left:100%;opacity:1; }to {left:0;opacity:1;}
	}
	@keyframes  anim-deux {
		from {top:-300%;} to {top:220px;}
	}
	@keyframes  anim-trois {
		from {top:450px;} to {top:130px;}
	}
}
@media (min-width:1300px){
		#myCarousel-home {height: 380px;}
	.fill{ min-height:380px;  }
	.fond {width: 62%;}
	.div-un{width: 50%;animation-name: anim-un}
	.div-deux{animation-name: anim-deux}
	.div-trois{animation-name: anim-trois}
	.div-un h1,.div-un h1{font-size: 2.30rem;}
	.div-deux h2,.div-un h2{font-size:1.2em;}
	.div-deux p,.div-un p{font-size:0.9em;}
	.div-car-img{top:0;left:-5%;max-width:50%;z-index:1;}
	.div-car-img .img-responsive{ max-height:350px;}.div-car-img2 .img-responsive{ max-height:270px;margin:0 auto;}
	.div-car-img2{top:auto;bottom:0;max-width:60%;height:270px;bottom:0;z-index:2;}
	@keyframes  anim-un {
		from {left:100%;opacity:1; }to {left:0;opacity:1;}
	}
	@keyframes  anim-deux {
		from {top:-300%;} to {top:220px;}
	}
	@keyframes  anim-trois {
		from {top:450px;} to {top:130px;}
	}
}
@media (min-width:1400px){
	#myCarousel-home {height: 380px;}
	.fill{ min-height:380px;  }
	.div-un{width: 45%;animation-name: anim-un}
	.div-deux{animation-name: anim-deux}
	.div-trois{animation-name: anim-trois}
	.div-deux h2,.div-un h2{font-size:1.3em;}
	.div-deux p,.div-un p{font-size:90%;}
	.div-car-img{top:0;left:-5%;max-width:50%;z-index:1;}
	.div-car-img2{top:auto;bottom:0;max-width:50%;height:270px;bottom:0;z-index:2;}
	@keyframes  anim-un {
		from {left:100%;opacity:1; }to {left:0;opacity:1;}
	}
	@keyframes  anim-deux {
		from {top:-300%;} to {top:220px;}
	}
	@keyframes  anim-trois {
		from {top:450px;} to {top:130px;}
	}
}
@media (min-width:1500px){
	#myCarousel-home {height: 400px;}
	.fill{ min-height:400px;  }
		.fond {width: 50%;}
	.div-un{animation-name: anim-un}
	.div-deux{animation-name: anim-deux}
	.div-trois{animation-name: anim-trois}
	.div-un h1,.div-un h1{font-size: 2.35rem;}
	.div-deux h2,.div-un h2{font-size:1.3em;}
	.div-deux p,.div-un p{font-size:95%;}
	.div-car-img{top:0;left:0;max-width:70%;z-index:1;}
	.div-car-img .img-responsive{ max-height:400px;}.div-car-img2 .img-responsive{ max-height:280px;margin:0 auto;}
	.div-car-img2{top:auto;bottom:0;max-width:52%;height:280px;bottom:0;z-index:2;}
	@keyframes  anim-un {
		from {left:100%;opacity:1; }to {left:0;opacity:1;}
	}
	@keyframes  anim-deux {
		from {top:-300%;} to {top:220px;}
	}
	@keyframes  anim-trois {
		from {top:450px;} to {top:130px;}
	}
}
@media (min-width:1600px){
	.div-un{animation-name: anim-un}
	.div-deux{animation-name: anim-deux}
	.div-trois{animation-name: anim-trois}
	.div-un h1,.div-un h1{font-size: 2.35rem;}
	.div-deux h2,.div-un h2{font-size:1.3em;}
	.div-deux p,.div-un p{font-size:95%;}
	.div-car-img{top:0;left:0;max-width:45%;z-index:1;}
	.div-car-img .img-responsive{ max-height:400px;}.div-car-img2 .img-responsive{ max-height:280px;margin:0 auto;}
	.div-car-img2{top:auto;bottom:0;max-width:52%;height:280px;bottom:0;z-index:2;}

	@keyframes  anim-un {
		from {left:100%;opacity:1; }to {left:0;opacity:1;}
	}
	@keyframes  anim-deux {
		from {top:-300%;} to {top:220px;}
	}
	@keyframes  anim-trois {
		from {top:450px;} to {top:130px;}
	}
}

@media (min-width:1800px){
	.div-un{animation-name: anim-un}
	.div-deux{animation-name: anim-deux}
	.div-trois{animation-name: anim-trois}

	.div-un h1,.div-un h1{font-size: 2.4rem;}
	.div-deux h2,.div-un h2{font-size:1.3em;}
	.div-deux p,.div-un p{font-size:95%;}
	.div-car-img .img-responsive{ max-height:400px;}.div-car-img2 .img-responsive{ max-height:280px;margin:0 auto;}
	.div-car-img2{top:auto;bottom:0;max-width:52%;height:280px;bottom:0;z-index:2;}
	@keyframes  anim-un {
		from {left:100%;opacity:1; }to {left:0;opacity:1;}
	}
	@keyframes  anim-deux {
		from {top:-300%;} to {top:220px;}
	}
	@keyframes  anim-trois {
		from {top:450px;} to {top:130px;}
	}
}

.carousel-caption a.a-bouton{text-shadow: none;}
.carousel-fade .carousel-inner .item {
  opacity: 0;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
}
.carousel-fade .carousel-inner .active {
  opacity: 1;
}
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}
.carousel-fade .carousel-control {
  z-index: 200;height: 80%; 
}
.carousel-fade .carousel-control span{
   display:none;
}
#myCarousel-home .img-responsive{padding:0!important;}