/* data-anijs="if: scroll, on:window, do: flipInY animated, before: scrollReveal, after: removeAnim" 
	<!-- Début du script pour le fondu des images -->
<script src="js/anijs.js"></script>
<script src="js/scrollReveal.min.js"></script> */

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  -ms-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
  }

  70% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  
}

@keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -ms-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -ms-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
  }

  70% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    -ms-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  100% {
    -webkit-transform: perspective(400px);
    -ms-transform: perspective(400px);
    transform: perspective(400px);
  }
  
}
/* ////////////////////////////////// */

#animated-example
{
	width:100px;
	height:50px;
	background-color:#00F;
	margin-left:400px;
}
/* Bounce */
.animated-infinited { 
     -webkit-animation-duration: 3s; 
    animation-duration: 3s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
    animation-iteration-count:infinite; 
    -webkit-animation-iteration-count:infinite; 
} 

.animated-infinited-next-prev { 
     -webkit-animation-duration: 3s; 
    animation-duration: 3s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
    animation-iteration-count:infinite; 
    -webkit-animation-iteration-count:infinite; 
} 
.animated-titre { 
     -webkit-animation-duration:3s;
animation-duration:3s;
-webkit-animation-fill-mode:both;
animation-fill-mode:both;
} 

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

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

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

/* Bounce In */
.animated { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

@-webkit-keyframes bounceIn{0%{opacity:0.6;-webkit-transform:scale(.1);transform:scale(.1);

	
	}
50%{opacity:0.3;-webkit-transform:scale(1);transform:scale(1)}
70%{opacity:0.6;-webkit-transform:scale(1);transform:scale(1)}
100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}

@keyframes bounceIn{0%{opacity:0;-webkit-transform:scale(.1);-ms-transform:scale(.1);transform:scale(.1)}
50%{opacity:0.3;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}
70%{opacity:0.6;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}
100%{opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}

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

/* Bounce In Up */
.animated { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

@-webkit-keyframes bounceInUp { 
    0% { 
        opacity: 0; 
        -webkit-transform: translateY(2000px); 
    } 
    60% { 
        opacity: 1; 
        -webkit-transform: translateY(-30px); 
    } 
    80% { 
        -webkit-transform: translateY(10px); 
    } 
    100% { 
        -webkit-transform: translateY(0); 
    } 
} 

@keyframes bounceInUp { 
    0% { 
        opacity: 0; 
        transform: translateY(2000px); 
    } 
    60% { 
        opacity: 1; 
        transform: translateY(-30px); 
    } 
    80% { 
        transform: translateY(10px); 
    } 
    100% { 
        transform: translateY(0); 
    } 
} 

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

/* Bounce In Down */
.animated { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

@-webkit-keyframes bounceInDown { 
   0% { 
       opacity: 0; 
        -webkit-transform: translateY(-2000px); 
    } 
    60% { 
        opacity: 1; 
        -webkit-transform: translateY(30px); 
    } 
    80% { 
        -webkit-transform: translateY(-10px); 
    } 
    100% { 
        -webkit-transform: translateY(0); 
    } 
} 

@keyframes bounceInDown { 
    0% { 
        opacity: 0; 
        transform: translateY(-2000px); 
    } 
    60% { 
        opacity: 1; 
        transform: translateY(30px); 
    } 
    80% { 
        transform: translateY(-10px); 
    } 
    100% { 
        transform: translateY(0); 
    } 
} 

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

/* Bounce In Left */
.animated { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

@-webkit-keyframes bounceInLeft { 
    0% { 
        opacity: 0; 
        -webkit-transform: translateX(-2000px); 
    } 
    60% { 
        opacity: 1; 
        -webkit-transform: translateX(30px); 
    } 
    80% { 
        -webkit-transform: translateX(-10px); 
    } 
    100% { 
        -webkit-transform: translateX(0); 
    } 
} 

@keyframes bounceInLeft { 
    0% { 
        opacity: 0; 
        transform: translateX(-2000px); 
    } 
    60% { 
        opacity: 1; 
        transform: translateX(30px); 
    } 
    80% { 
        transform: translateX(-10px); 
    } 
    100% { 
        transform: translateX(0); 
    } 
} 
.bounceInLeft { 
    -webkit-animation-name: bounceInLeft; 
    animation-name: bounceInLeft; 
}

/* Bounce In Right */
.animated { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

@-webkit-keyframes bounceInRight { 
    0% { 
        opacity: 0; 
        -webkit-transform: translateX(2000px); 
    } 
    60% { 
        opacity: 1; 
        -webkit-transform: translateX(-30px); 
    } 
    80% { 
        -webkit-transform: translateX(10px); 
    } 
    100% { 
        -webkit-transform: translateX(0); 
    } 
} 

@keyframes bounceInRight { 
    0% { 
        opacity: 0; 
        transform: translateX(2000px); 
    } 
    60% { 
        opacity: 1; 
        transform: translateX(-30px); 
    } 
    80% { 
        transform: translateX(10px); 
    } 
    100% { 
        transform: translateX(0); 
    } 
} 

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

/* Bounce Out */
.animated { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

@-webkit-keyframes bounceOut { 
    0% { 
        -webkit-transform: scale(1); 
    } 
    25% { 
        -webkit-transform: scale(.95); 
    } 
    50% { 
        opacity: 1; 
        -webkit-transform: scale(1.1); 
    } 
    100% { 
        opacity: 0; 
        -webkit-transform: scale(.3); 
    } 
} 
@keyframes bounceOut { 
    0% { 
        transform: scale(1); 
    } 
    25% { 
        transform: scale(.95); 
    } 
    50% { 
        opacity: 1; 
        transform: scale(1.1); 
    } 
    100% { 
        opacity: 0; 
        transform: scale(.3); 
    } 
} 
.bounceOut { 
    -webkit-animation-name: bounceOut; 
    animation-name: bounceOut; 
}

/* Bounce Out Up */
.animated { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

@-webkit-keyframes bounceOutUp { 
    0% { 
        -webkit-transform: translateY(0); 
    } 
    20% { 
        opacity: 1; 
        -webkit-transform: translateY(20px); 
    } 
    100% { 
        opacity: 0; 
        -webkit-transform: translateY(-2000px); 
    } 
} 
@keyframes bounceOutUp { 
    0% { 
        transform: translateY(0); 
    } 
    20% { 
        opacity: 1; 
        transform: translateY(20px); 
    } 
    100% { 
        opacity: 0; 
        transform: translateY(-2000px); 
    } 
} 
.bounceOutUp { 
    -webkit-animation-name: bounceOutUp; 
    animation-name: bounceOutUp; 
}

/* Bounce Out Down */
.animated { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

@-webkit-keyframes bounceOutDown { 
    0% { 
        -webkit-transform: translateY(0); 
    } 
    20% { 
        opacity: 1; 
        -webkit-transform: translateY(-20px); 
    } 
    100% { 
        opacity: 0; 
        -webkit-transform: translateY(2000px); 
    } 
} 
@keyframes bounceOutDown { 
    0% { 
        transform: translateY(0); 
    } 
    20% { 
        opacity: 1; 
        transform: translateY(-20px); 
    } 
    100% { 
        opacity: 0; 
        transform: translateY(2000px); 
    } 
} 
.bounceOutDown { 
    -webkit-animation-name: bounceOutDown; 
    animation-name: bounceOutDown; 
}

/* Bounce Out Left */
.animated { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

@-webkit-keyframes bounceOutLeft { 
    0% { 
        -webkit-transform: translateX(0); 
    } 
    20% { 
        opacity: 1; 
        -webkit-transform: translateX(20px); 
    } 
    100% { 
        opacity: 0; 
        -webkit-transform: translateX(-2000px); 
    } 
} 
@keyframes bounceOutLeft { 
    0% { 
        transform: translateX(0); 
    } 
    20% { 
        opacity: 1; 
        transform: translateX(20px); 
    } 
    100% { 
        opacity: 0; 
        transform: translateX(-2000px); 
    } 
} 
.bounceOutLeft { 
    -webkit-animation-name: bounceOutLeft; 
    animation-name: bounceOutLeft; 
}

/* Bounce Out Right */
.animated { 
    -webkit-animation-duration: 1s; 
    animation-duration: 1s; 
    -webkit-animation-fill-mode: both; 
    animation-fill-mode: both; 
} 

@-webkit-keyframes bounceOutRight { 
    0% { 
        -webkit-transform: translateX(0); 
    } 
    20% { 
        opacity: 1; 
        -webkit-transform: translateX(-20px); 
    } 
    100% { 
        opacity: 0; 
        -webkit-transform: translateX(2000px); 
    } 
} 
@keyframes bounceOutRight { 
    0% { 
        transform: translateX(0); 
    } 
    20% { 
        opacity: 1; 
        transform: translateX(-20px); 
    } 
    100% { 
        opacity: 0; 
        transform: translateX(2000px); 
    } 
} 
.bounceOutRight { 
    -webkit-animation-name: bounceOutRight; 
    animation-name: bounceOutRight; 
}

@-webkit-keyframes fadeIn{0%{opacity:0.6}100%{opacity:1}}
@keyframes fadeIn{0%{opacity:0.6}100%{opacity:1}}

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

/* Boutons rectangulaire avec border animés */
.button-anime{width:auto;display:inline-block;text-align:center;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;font-family:"garamond-premier-pro-display",serif;position:relative;height:48px;font-size:18px;line-height:noraml;padding:0 25px;
text-decoration:none;
text-transform:uppercase;


}
.button-anime:hover{
	color: #95b8e2;
	
-webkit-transition: all 0.3s ease-out; /*compatibilité chrome*/
   -moz-transition: all 0.3s ease-out; /*compatibilité firefox*/
   -o-transition: all 0.3s ease-out; /*compatibilité opéra*/
   transition: all 0.3s ease-out; /* Autre navigateur */
}
   
.button-anime:not(.h-auto){line-height:48px}

/*@media only screen and (min-width: 1281px){.button{height:68px;font-size:21px;line-height:normal;padding:0 35px}.button:not(.h-auto){line-height:68px}}*/

@media only screen and (min-width: 1281px){
	.button-anime{height:38px;font-size:12px;line-height:normal;padding:0px 15px;}

.button-anime:not(.h-auto){line-height:38px}}


@media only screen and (min-width: 1025px){.button-anime{-webkit-transition:.3s background ease-in-out;-moz-transition:.3s background ease-in-out;-ms-transition:.3s background ease-in-out;-o-transition:.3s background ease-in-out;transition:.3s background ease-in-out}}

.button-anime.light{background:transparent;color:95b8e2;}.button-anime.light:after{position:absolute;top:0;left:0;content:'';border:1px solid rgba(218,191,111,0.6);display:block;width:100%;height:100%;-moz-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box}.button-anime.light .top:after,.button-anime.light .top:before,.button-anime.light .bottom:before,.button-anime.light .bottom:after{background-color:#7b631a}

@media only screen and (min-width: 1025px){.button-anime{position:relative}.button-anime .top:after,.button-anime .top:before,.button-anime .bottom:after,.button-anime .bottom:before{content:'';position:absolute;display:block;background-color:#fff;z-index:1}.button-anime .top,.button-anime .bottom{display:block;width:100%;height:100%;position:absolute;top:0;left:0}

.button-anime .top:before{top:0;left:0;width:0;height:1px}.button-anime .top:after{bottom:0;right:0;width:1px;height:0}.button-anime .bottom:before{bottom:0;right:0;width:0;height:1px}.button-anime .bottom:after{top:0;left:0;width:1px;height:0}.button-anime .top:before,.button-anime .top:after,.button-anime .bottom:before,.button-anime .bottom:after{-webkit-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);-moz-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);-ms-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);-o-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);transition:1s all 0s cubic-bezier(.645, .045, .355, 1)}.button-anime:hover .top:before{width:100%}.button-anime:hover .top:after{height:100%}.button-anime:hover .bottom:before{width:100%}.button-anime:hover .bottom:after{height:100%}}





/* Smartphone horizontal */
@media only screen
and (max-width : 740px) {
.button-anime{height:35px;font-size:8px;line-height:normal;padding:0px 15px!important;}.button-anime:not(.h-auto){line-height:35px!important;}


.button-anime{position:relative!important;}.button-anime .top:after,.button-anime .top:before,.button-anime .bottom:after,.button-anime .bottom:before{content:'';position:absolute;display:block;background-color:#fff;z-index:1!important;}.button-anime .top,.button-anime .bottom{display:block;width:100%;height:100%;position:absolute;top:0;left:0!important;}

.button-anime .top:before{top:0;left:0;width:0;height:1px!important;}.button-anime .top:after{bottom:0;right:0;width:1px;height:0!important;}.button-anime .bottom:before{bottom:0;right:0;width:0;height:1px!important;}.button-anime .bottom:after{top:0;left:0;width:1px;height:0!important;}.button-anime .top:before,.button-anime .top:after,.button-anime .bottom:before,.button-anime .bottom:after{-webkit-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);-moz-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);-ms-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);-o-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);transition:1s all 0s cubic-bezier(.645, .045, .355, 1)!important;}.button-anime:hover .top:before{width:100%!important;}.button-anime:hover .top:after{height:100%!important;}.button-anime:hover .bottom:before{width:100%!important;}.button-anime:hover .bottom:after{height:100%!important;}
}


/* Ipad vertical */
@media only screen
and (min-width : 768px)
and (max-width : 1024px)
and (orientation : portrait) {
	
	.button-anime{height:38px;font-size:12px;line-height:normal;padding:0px 15px}.button-anime:not(.h-auto){line-height:38px}
	
.button-anime{position:relative!important;}.button-anime .top:after,.button-anime .top:before,.button-anime .bottom:after,.button-anime .bottom:before{content:'';position:absolute;display:block;background-color:#fff;z-index:1!important;}.button-anime .top,.button-anime .bottom{display:block;width:100%;height:100%;position:absolute;top:0;left:0!important;}

.button-anime .top:before{top:0;left:0;width:0;height:1px!important;}.button-anime .top:after{bottom:0;right:0;width:1px;height:0!important;}.button-anime .bottom:before{bottom:0;right:0;width:0;height:1px!important;}.button-anime .bottom:after{top:0;left:0;width:1px;height:0!important;}.button-anime .top:before,.button-anime .top:after,.button-anime .bottom:before,.button-anime .bottom:after{-webkit-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);-moz-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);-ms-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);-o-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);transition:1s all 0s cubic-bezier(.645, .045, .355, 1)!important;}.button-anime:hover .top:before{width:100%!important;}.button-anime:hover .top:after{height:100%!important;}.button-anime:hover .bottom:before{width:100%!important;}.button-anime:hover .bottom:after{height:100%!important;}
}


/* iPad horizontal */
@media only screen
and (min-width : 768px)
and (max-width : 1024px)
and (orientation : landscape) {
	
	.button-anime{height:38px;font-size:12px;line-height:normal;padding:0px 15px}
	.button-anime:not(.h-auto){line-height:38px}
	
	.button-anime{position:relative!important;}
	.button-anime .top:after,.button-anime .top:before,.button-anime .bottom:after,.button-anime .bottom:before{content:'';position:absolute;display:block;background-color:#fff;z-index:1!important;}
	.button-anime .top,.button-anime .bottom{display:block;width:100%;height:100%;position:absolute;top:0;left:0!important;}

.button-anime .top:before{top:0;left:0;width:0;height:1px!important;}
.button-anime .top:after{bottom:0;right:0;width:1px;height:0!important;}
.button-anime .bottom:before{bottom:0;right:0;width:0;height:1px!important;}
.button-anime .bottom:after{top:0;left:0;width:1px;height:0!important;}
.button-anime .top:before,.button-anime .top:after,.button-anime .bottom:before,.button-anime .bottom:after{-webkit-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);-moz-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);-ms-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);-o-transition:1s all 0s cubic-bezier(.645, .045, .355, 1);transition:1s all 0s cubic-bezier(.645, .045, .355, 1)!important;}
.button-anime:hover .top:before{width:100%!important;}.button-anime:hover .top:after{height:100%!important;}.button-anime:hover .bottom:before{width:100%!important;}.button-anime:hover .bottom:after{height:100%!important;}
}

/* Trait animé allant de gauche à droite */
.traitanime a{position:relative;padding:0 3px 2px;}
.traitanime a:hover {color:#95b8e2;
}
.traitanime a::after{position:absolute;content:"";height:1px;bottom:0;right:0;left:0;display:block}
.traitanime a::after{z-index:1;background:#95b8e2;-webkit-transform:scaleX(0);-moz-transform:scaleX(0);-ms-transform:scaleX(0);transform:scaleX(0);-webkit-transition:transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);-moz-transition:transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);-ms-transition:transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);transition:transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);-webkit-transform-origin:bottom right;-moz-transform-origin:bottom right;-ms-transform-origin:bottom right;transform-origin:bottom right}
.traitanime a:hover::after{
-webkit-transform:scaleX(1);-moz-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1);-webkit-transform-origin:bottom left;-moz-transform-origin:bottom left;-ms-transform-origin:bottom left;transform-origin:bottom left}