@charset "UTF-8";
/* CSS Document */





.hideme{
	opacity:0;
	-webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
	-moz-transition: -moz-transform 0.5s, opacity 0.5s;
	transition: transform 0.5s, opacity 0.5s;
}

.hideme.appearLeft{	
	-webkit-transform: translateX(-80px);
	-moz-transform: translateX(-80px);
	transform: translateX(-80px);}
	
.hideme.appearRight {
	-webkit-transform: translateX(80px);
	-moz-transform: translateX(80px);
	transform: translateX(80px);
}

.hideme.appearFade {
	-webkit-transform: translateY(80px);
	-moz-transform: translateY(80px);
	transform: translateY(80px);
}
	
	

.showme, .appearLeft.showme, .appearRight.showme,  .appearFade.showme {
	-webkit-transform: translate(0px);
	-moz-transform: translate(0px);
	transform: translate(0px);
	opacity: 1;}
	
 .parallax .showme{z-index:1}


/* HAUT DE PAGE  */
.haut-page {
  display: inline-block;
  height: 60px;
  width: 60px;
  position: fixed;
  bottom: 40px;
  right: 10px;
  border-radius:30px;
  border:6px solid #fff;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: rgba(135, 191, 47, 0.9) url(../img/up.png) no-repeat center 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
}
.haut-page.cd-is-visible, .haut-page.cd-fade-out, .no-touch .haut-page:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}

.haut-page.cd-is-visible {visibility: visible;opacity: 1;}
.haut-page.cd-fade-out {opacity: .7;}
.no-touch .cd-top:hover {background-color: #e86256;opacity: 1;}





.slideshow,
.slideshow:after { 
    position: relative;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 0; 
	margin:0
}


.slideshow li {
	position: absolute;
	width: 101%;
	height: 101%;
	top: -0.5%;
	left: -0.5%;
	opacity: 0;
	-webkit-transition: opacity 1s;
	-moz-transition: opacity 1s;
	transition: opacity 1s;
	padding:0
}


.slideshow li img {display: block;width: 100%;}
.slideshow li div img {display: block;width: 100px;}

.slideshow li:nth-child(1){background:url(../img/slider/slider-01.jpg) no-repeat center; background-size:cover}
.slideshow li:nth-child(2){background:url(../img/slider/slider-02.jpg) no-repeat center; background-size:cover}
.slideshow li:nth-child(3){background:url(../img/slider/slider-03.jpg) no-repeat center; background-size:cover}



.slideshow-control {
	position: absolute;
	width: 100%;
	height: 100px;
	top: 45%;
}

.slideshow-control span {
	float: left;
	margin:0 40px;
	position: relative;
	cursor: pointer;
	color:#fff;
	font-size:100px;
}

.slideshow-control span:before {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	text-align: center;
	color: #fff;
	-webkit-font-smoothing: antialiased;
	opacity: 0.7;
}


.slideshow-control span.slide-next {float: right;}

.slideshow li .cont{height:100%;max-width:1200px;margin:0 auto;padding:0 40px;display:block;}
.slideshow li .cont h2{color:#fff;font-weight:700;font-size:100px;text-align:center;margin-top:25%;}


.fleche{position:absolute;bottom:150px;left:0;width:100%;text-align:center;}
.fleche a{display:ineline-block;margin-left:3%;}

.animated-infinite { 
    -webkit-animation-duration: 1.5s; 
    animation-duration: 1.5s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
    animation-iteration-count:infinite; 
    -webkit-animation-iteration-count:infinite; 
} 

@-webkit-keyframes bounce { 
    0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(0);} 
    40% {-webkit-transform: translateY(-30px);} 
    60% {-webkit-transform: translateY(-15px);} 
} 

@keyframes bounce { 
    0%, 20%, 50%, 80%, 100% {transform: translateY(0);} 
    40% {transform: translateY(-30px);} 
    60% {transform: translateY(-15px);} 
} 



.bounce { 
    -webkit-animation-name: bounce; 
    animation-name: bounce; 
}






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

.slideshow li .cont h2, .slideshow-control span {font-size:50px}
.slideshow li .cont h2{margin-top:40%;}

}


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

.slideshow li .cont h2, .slideshow-control span {font-size:35px;margin-top:40%;}
.slideshow-control {top:25%}

.haut-page {width:40px;height:40px;right:5px}

.fleche a{display:ineline-block;margin-left:0%;}
}