@charset "UTF-8";
 @-webkit-keyframes fondu {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fondu {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes fondu1 {
0% {
opacity: 0;
-webkit-transform: translate(5px, 10px);
transform: translate(5px, 10px)
}
100% {
opacity: 1;
-webkit-transform: translate(0px, 0px);
transform: translate(0px, 0px)
}
}
@keyframes fondu1 {
0% {
opacity: 0;
-webkit-transform: translate(5px, 10px);
transform: translate(5px, 10px)
}
100% {
opacity: 1;
-webkit-transform: translate(0px, 0px);
transform: translate(0px, 0px)
}
}
@-webkit-keyframes fondu2 {
0% {
opacity: 0;
-webkit-transform: translate(5px, 10px);
transform: translate(5px, 10px)
}
20% {
opacity: 0;
-webkit-transform: translate(5px, 10px);
transform: translate(5px, 10px)
}
100% {
opacity: 1;
-webkit-transform: translate(0, 0);
transform: translate(0, 0)
}
}
@keyframes fondu2 {
0% {
opacity: 0;
-webkit-transform: translate(5px, 10px);
transform: translate(5px, 10px)
}
20% {
opacity: 0;
-webkit-transform: translate(5px, 10px);
transform: translate(5px, 10px)
}
100% {
opacity: 1;
-webkit-transform: translate(0, 0);
transform: translate(0, 0)
}
}
@-webkit-keyframes fondu3 {
0% {
opacity: 0;
-webkit-transform: translate(0, 20px);
transform: translate(0, 20px)
}
40% {
opacity: 0;
-webkit-transform: translate(0, 20px);
transform: translate(0, 20px);
}
100% {
opacity: 1;
-webkit-transform: translate(0, 0);
transform: translate(0, 0)
}
}
@keyframes fondu3 {
0% {
opacity: 0;
-webkit-transform: translate(0, 20px);
transform: translate(0, 20px)
}
40% {
opacity: 0;
-webkit-transform: translate(0, 20px);
transform: translate(0, 20px);
}
100% {
opacity: 1;
-webkit-transform: translate(0, 0);
transform: translate(0, 0)
}
}
@-webkit-keyframes fondu4 {
0% {
opacity: 0;
-webkit-transform: translate(0, -20px);
transform: translate(0, -20px)
}
50% {
opacity: 0;
-webkit-transform: translate(0, -20px);
transform: translate(0, -20px)
}
100% {
opacity: 1;
-webkit-transform: translate(0, 0);
transform: translate(0, 0)
}
}
@keyframes fondu4 {
0% {
opacity: 0;
-webkit-transform: translate(0, -20px);
transform: translate(0, -20px)
}
50% {
opacity: 0;
-webkit-transform: translate(0, -20px);
transform: translate(0, -20px)
}
100% {
opacity: 1;
-webkit-transform: translate(0, 0);
transform: translate(0, 0)
}
}
@-webkit-keyframes fondu5 {
0% {
opacity: 0;
-webkit-transform: translate(5px, -10px);
transform: translate(5px, -10px)
}
30% {
opacity: 0;
-webkit-transform: translate(5px, -10px);
transform: translate(5px, -10px)
}
100% {
opacity: 1;
-webkit-transform: translate(0px, 0px);
transform: translate(0px, 0px)
}
}
@keyframes fondu5 {
0% {
opacity: 0;
-webkit-transform: translate(5px, -10px);
transform: translate(5px, -10px)
}
30% {
opacity: 0;
-webkit-transform: translate(5px, -10px);
transform: translate(5px, -10px)
}
100% {
opacity: 1;
-webkit-transform: translate(0px, 0px);
transform: translate(0px, 0px)
}
}
@-webkit-keyframes fondu6 {
0% {
opacity: 0;
-webkit-transform: translate(-5px, 10px);
transform: translate(-5px, 10px)
}
45% {
opacity: 0;
}
100% {
opacity: 1;
-webkit-transform: translate(0px, 0px);
transform: translate(0px, 0px)
}
}
@keyframes fondu6 {
0% {
opacity: 0;
-webkit-transform: translate(-5px, 10px);
transform: translate(-5px, 10px)
}
45% {
opacity: 0;
}
100% {
opacity: 1;
-webkit-transform: translate(0px, 0px);
transform: translate(0px, 0px)
}
}
@-webkit-keyframes fondu7 {
0% {
opacity: 0;
-webkit-transform: translate(0px, -10px);
transform: translate(0px, -10px)
}
10% {
opacity: 0;
}
100% {
opacity: 1;
-webkit-transform: translate(0px, 0px);
transform: translate(0px, 0px)
}
}
@keyframes fondu7 {
0% {
opacity: 0;
-webkit-transform: translate(0px, -10px);
transform: translate(0px, -10px)
}
10% {
opacity: 0;
}
100% {
opacity: 1;
-webkit-transform: translate(0px, 0px);
transform: translate(0px, 0px)
}
}
.apparition {
-webkit-animation: fondu 2s ease-out;
animation: fondu 2s ease-out;
}
.apparition1 {
-webkit-animation: fondu1 1.5s ease-out;
animation: fondu1 1.5s ease-out;
}
.apparition2 {
-webkit-animation: fondu2 3s ease-out;
animation: fondu2 3s ease-out;
}
.apparition3 {
-webkit-animation: fondu3 2s ease-out;
animation: fondu3 2s ease-out;
}
.apparition4 {
-webkit-animation: fondu4 1.5s ease-out;
animation: fondu4 1.5s ease-out;
}
.apparition5 {
-webkit-animation: fondu5 1s ease-out;
animation: fondu5 1s ease-out;
}
.apparition6 {
-webkit-animation: fondu6 2.5s ease-out;
animation: fondu6 2.5s ease-out;
}
.apparition7 {
-webkit-animation: fondu7 3s ease-out;
animation: fondu7 3s ease-out;
}
@-webkit-keyframes tourne {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
30% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
50% {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
80% {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes tourne {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
30% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
50% {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
80% {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.tourne {
-webkit-animation-name: tourne;
animation-name: tourne;
-webkit-animation-duration: 10s;
animation-duration: 10s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-delay: 4s;
animation-delay: 4s;
}
@-webkit-keyframes monte {
0% {
top: 90vh;
opacity: 0;
height: 0;
padding-bottom: 0px;
}
60% {
top: 90vh;
opacity: 0;
height: 0;
padding-bottom: 0px;
}
100% {
top: calc(15vh + 7vw - 55px);
opacity: 1;
height: auto;
padding-bottom: 100px;
}
}
@keyframes monte {
0% {
top: 90vh;
opacity: 0;
height: 0;
padding-bottom: 0px;
}
60% {
top: 90vh;
opacity: 0;
height: 0;
padding-bottom: 0px;
}
100% {
top: calc(15vh + 7vw - 55px);
opacity: 1;
height: auto;
padding-bottom: 100px;
}
}
@-webkit-keyframes droit {
0% {
left: -50vw;
}
100% {
left: 5vw;
}
}
@keyframes droit {
0% {
left: -50vw;
}
100% {
left: 5vw;
}
}
.droite {
-webkit-animation: droit 2.5s ease-out;
animation: droit 2.5s ease-out;
}
@-webkit-keyframes roul {
0% {
left: -20vw;
-webkit-transform: rotate(-1000deg);
transform: rotate(-1000deg);
}
60% {
left: -20vw;
-webkit-transform: rotate(-1000deg);
transform: rotate(-1000deg);
}
100% {
left: 4vw;
-webkit-transform: rotate(-0deg);
transform: rotate(-0deg);
}
}
@keyframes roul {
0% {
left: -20vw;
-webkit-transform: rotate(-1000deg);
transform: rotate(-1000deg);
}
60% {
left: -20vw;
-webkit-transform: rotate(-1000deg);
transform: rotate(-1000deg);
}
100% {
left: 4vw;
-webkit-transform: rotate(-0deg);
transform: rotate(-0deg);
}
}
.roule {
-webkit-animation: roul 5.5s ease-out;
animation: roul 5.5s ease-out;
}
@media only screen and (max-width: 1024px) {
@-webkit-keyframes monte {
0% {
top: 90vh;
opacity: 0;
height: 0;
padding-bottom: 0px;
}
60% {
top: 90vh;
opacity: 0;
height: 0;
padding-bottom: 0px;
}
100% {
top: 25vh;
opacity: 1;
height: auto;
padding-bottom: 100px;
}
}
@keyframes monte {
0% {
top: 90vh;
opacity: 0;
height: 0;
padding-bottom: 0px;
}
60% {
top: 90vh;
opacity: 0;
height: 0;
padding-bottom: 0px;
}
100% {
top: 25vh;
opacity: 1;
height: auto;
padding-bottom: 100px;
}
}
@-webkit-keyframes droit {
0% {
left: -50vw;
}
100% {
left: 25px;
}
}
@keyframes droit {
0% {
left: -50vw;
}
100% {
left: 25px;
}
}
@-webkit-keyframes roul {
0% {
left: -80px;
-webkit-transform: rotate(-720deg);
transform: rotate(-720deg);
}
60% {
left: -80px;
-webkit-transform: rotate(-720deg);
transform: rotate(-720deg);
}
100% {
left: 25px;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
}
@keyframes roul {
0% {
left: -80px;
-webkit-transform: rotate(-360deg);
transform: rotate(-360deg);
}
60% {
left: -80px;
-webkit-transform: rotate(-360deg);
transform: rotate(-360deg);
}
100% {
left: 25px;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
}
}
@media only screen and (max-width: 480px) {
@-webkit-keyframes roul {
0% {
left: -80px;
-webkit-transform: rotate(-360deg);
transform: rotate(-360deg);
}
60% {
left: -80px;
-webkit-transform: rotate(-360deg);
transform: rotate(-360deg);
}
100% {
left: 15px;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
}
@keyframes roul {
0% {
left: -80px;
-webkit-transform: rotate(-360deg);
transform: rotate(-360deg);
}
60% {
left: -80px;
-webkit-transform: rotate(-360deg);
transform: rotate(-360deg);
}
100% {
left: 15px;
-webkit-transform: rotate(-0deg);
transform: rotate(-0deg);
}
}
}
.monte {
-webkit-animation: monte 5.5s ease;
animation: monte 5.5s ease;
}
@-webkit-keyframes monte2 {
0% {
margin-top: 100vh;
opacity: 0;
}
50% {
margin-top: 100vh;
opacity: 0;
}
100% {
margin-top: 42vh;
opacity: 1;
}
}
@keyframes monte2 {
0% {
margin-top: 100vh;
opacity: 0;
}
50% {
margin-top: 100vh;
opacity: 0;
}
100% {
margin-top: 42vh;
opacity: 1;
}
}
.monte2 {
-webkit-animation: monte2 3s ease;
animation: monte2 3s ease;
}
@-webkit-keyframes descend {
0% {
top: -90px;
opacity: 0;
}
60% {
top: -90px;
opacity: 1;
}
100% {
top: 0;
opacity: 1;
}
}
@keyframes descend {
0% {
top: -90px;
opacity: 0;
}
60% {
top: -90px;
opacity: 1;
}
100% {
top: 0;
opacity: 1;
}
}
.home .descend {
-webkit-animation: descend 4s ease-out;
animation: descend 4s ease-out;
}
@-webkit-keyframes anim-photos {
0% {
bottom: 110vh;
-webkit-transform: rotate(-15deg);
transform: rotate(-15deg);
}
50% {
bottom: 0;
-webkit-transform: rotate(-0deg);
transform: rotate(-0deg);
}
60% {
bottom: 5vh;
-webkit-transform: rotate(-4deg);
transform: rotate(-4deg);
}
70% {
bottom: 0;
-webkit-transform: rotate(-0deg);
transform: rotate(-0deg);
}
80% {
bottom: 3vh;
-webkit-transform: rotate(-1deg);
transform: rotate(-1deg);
}
87% {
bottom: 0;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
bottom: 0;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
}
@keyframes anim-photos {
0% {
bottom: 110vh;
-webkit-transform: rotate(-15deg);
transform: rotate(-15deg);
}
50% {
bottom: 0;
-webkit-transform: rotate(-0deg);
transform: rotate(-0deg);
}
60% {
bottom: 5vh;
-webkit-transform: rotate(-4deg);
transform: rotate(-4deg);
}
70% {
bottom: 0;
-webkit-transform: rotate(-0deg);
transform: rotate(-0deg);
}
80% {
bottom: 3vh;
-webkit-transform: rotate(-1deg);
transform: rotate(-1deg);
}
87% {
bottom: 0;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
bottom: 0;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
}
.phototombe {
-webkit-animation: anim-photos 1s ease-in;
animation: anim-photos 1s ease-in;
bottom: 0;
-webkit-transform: rotate(-0deg);
transform: rotate(-0deg);
}
@keyframes espace {
0% {
margin: 5vh 0;
opacity: 0;
}
100% {
margin: 15px 0;
opacity: 1;
}
}
.espace p {
-webkit-animation: espace 2s ease-out;
animation: espace 2s ease-out;
margin: 15px 0;
}