html{width: 100%;height:100%;}
body{background : url("../img/nuage_fond.webp");background-repeat: no-repeat;background-position: top center;background-attachment:fixed;background-size: cover;background-color: #c9eafa;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;min-width: 100%;min-height: 100%;}
.col-md-6{padding: 0!important;}
h2{color:#1d1d44;font-family: 'Indie Flower', cursive;font-size: 2.3vw ;padding-bottom: 1.6%;text-align:center;font-weight: 400;}
.row{margin:0 30px!important;}
a{color:#4b0049;}

/* Bloc - génériques */

h1{text-align:center;color:#1d1d44;font-family: 'Indie Flower', cursive;font-size: 2.3vw ;padding-top:0;padding-bottom:6%;margin-bottom:0!important;margin-top:0;}
#section1 div{text-align: center;}
#section1 div img{width: 100%; ;height: auto;padding-top:10px; padding-bottom: 1.5%;padding-left: 35%;padding-right: 35%;}

#section2{padding-top:2%;padding-bottom: 2em; padding-left: 1em;padding-right: 1em;position: relative;}
#section2 .service{background:white;}
#section2 ul{font-size: 0.8vw;font-family: Century Gothic,CenturyGothic,AppleGothic,sans-serif;padding:0;hyphens: none;margin-top: 0;list-style: none;text-align:center;}
#section2 ul li{font-size: 0.9vw;font-family: 'Indie Flower', cursive;padding-bottom:8%;hyphens: none;margin-top: 0;list-style: none;}
#section2 h3{font-size: 1.6vw;text-align:center;padding:5% 0;font-family: 'Indie Flower', cursive;font-weight: 600;}
#section2 #illustration ul{margin-top:4%;}

#section3 {padding-top:2%;padding-bottom: 2em; padding-left: 1em;padding-right: 1em;position: relative;}
#section3 .id_portfolio{padding:0;background:white;margin:0 1%}
#section3 .id_portfolio img{padding:0;}
#section3 .id_portfolio div{padding: 4% 2%;margin-right:15px;vertical-align: bottom;display: flex;flex-direction: column;justify-content:flex-end;}
#section3 .id_portfolio div:hover{}
#section3 .id_portfolio div p{display: block;font-size: 0.8vw;min-height: 30%;hyphens: none;}
#section3 .slide .row{display:flex;justify-content:center;}
#section3 h3{font-size: 1.4vw;text-align:center;font-family: 'Indie Flower', cursive;font-weight: 600;}

#btnBook{display: flex; align-items: flex-end; justify-content: center;z-index:10;position:absolute;left:0;bottom:0px;min-width: 100%;text-align: center;margin-top:20px;padding:20px; }
#btnBook a {text-decoration:none;color:#1d1d44;}
#btnBook a .button span{color:white;font-family: 'Indie Flower', cursive;font-size:1.5em;}
#btnBook a .button{padding: 10px 20px;border-radius:30px; background: #1d1d44;box-shadow: 0px 0px 16px #3883e0;transition: all 0.4s ease-in-out;}
#btnBook a:hover {color:#1d1d44;}
#btnBook a:hover span{color:white;}
#btnBook a:hover .button{transition: all 0.4s ease-in-out;box-shadow: 0px 0px 40px #3883e0;color:#360154;background: #3883e0;}

#section4{padding-top:2%;padding-bottom: 2em; padding-left: 1em;padding-right: 1em;position: relative;}
#section4 p{color:#1d1d44;font-family: 'Indie Flower', cursive;hyphens: none;font-size:1vw}
#section4 #propos-id{display:flex;align-items:center;justify-content: center;padding-left:3%;padding-right:3%;}
#section4 #propos-id, #section4 #propos-txt{background:white;}
#section4 #propos-txt{padding: 4% 2%;}

#section5{padding-top:2%;padding-bottom: 2em; padding-left: 1em;padding-right: 1em;position: relative;}
#section5 .formulaire{background:white;padding: 4% 2% 0 2%;}
#section5 form, #contactf form col-12, #contactf form col-9, #contactf form col-3{padding: 0;text-align: center;}
#section5 form .form-control{margin-bottom :1%;}
#section5 .btn{padding:0.5% 3%;font-size:1.5em;border-radius:20px;border:none;margin-top:1.5%;background-color: #4b0049;font-family: 'Indie Flower', cursive; }
#section5 .btn:hover{transition: all 0.4s ease-in-out;box-shadow: 0px 0px 40px #7d037c;background: #7d037c;}
#section5 #message-formulaire.ok{color: yellowgreen;font-size: 1.1vw;font-family: 'Indie Flower', cursive;text-align: center;font-weight: bold;padding-bottom:2%;}
#section5 #message-formulaire.no{color:darkred;font-size: 1.1vw;font-family: 'Indie Flower', cursive;text-align: center;font-weight: bold;padding-bottom:2%;}
#section5 form p{color:#1d1d44;font-family: 'Indie Flower', cursive;text-align: center;font-size: 1vw;}
#section5 form #rgpd{color:#1d1d44;font-family: 'Indie Flower', cursive;font-size: 0.8vw;}

#footer{color:#1d1d44;font-family: 'Indie Flower', cursive;font-size: 0.9vw;margin:8% 0 0 0!important;}
#footer div{padding:0;}
#footer #reseaux {width:40px;text-align:right;}
#footer #reseaux a img{width:40px;}

.corps_simple{}
.corps_simple p{color:#1d1d44;}
.corps_simple nav a{color:white;}
.corps_simple nav a:hover{color:#662d91;text-decoration: none;font-weight: 600;}
.corps_simple nav .nav-logo{padding: 0!important;}
.corps_simple nav img{width:50%;height: 50%;}
.corps_simple h1{color:#EBEAC4;font-family: 'Indie Flower', cursive;font-size: 2.0vw ;padding-top:0;padding-bottom: 3%;margin-bottom:0!important;margin-top:0;}

#multilangue{position:absolute;top:1%;right:0;z-index:100;padding:0;}
#multilangue a,#multilangue a img{padding:0!important;}

.menu{list-style:none;padding:0;}
.menu li{}
.menu li  img{width:100px;height:100px;}
.menu .nav-logo{text-align:center;}
.menu li a{font-family: 'Indie Flower', cursive;font-size: 1.4vw ;}
#mentionslegales{padding: 4% 2% 0 2%;background:white;margin-bottom:6%;color:#1d1d44;font-family: 'Indie Flower', cursive;font-size: 0.8vw;}

#fp-nav.fp-left{top:10%;}
#fp-nav ul{list-style-type: circle;color: red;}
#fp-nav ul li a span{background-color:#1d1d44;font-family: 'Indie Flower', cursive;font-size: 2.0vw ;}
#fp-nav ul li .fp-tooltip{top:-6px;color:#1d1d44;font-family: 'Indie Flower', cursive;font-size: 1.0vw ;}
#fp-nav ul li .active  + .fp-tooltip{opacity:1;width: auto;}

.fp-controlArrow.fp-prev:hover{border-color:transparent #1d1d44 transparent transparent;}
.fp-controlArrow.fp-next:hover{border-color:transparent transparent transparent #1d1d44 }


/* ANIMATIONS*/

/* Oiseau*/
#section2 .bird {
	background-image: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/174479/bird-cells.svg);background-size: auto 100%;width: 88px;height: 125px;will-change: background-position;
	animation-name: fly-cycle;animation-timing-function: steps(10);animation-iteration-count: infinite;}
	.bird--one {animation-duration: 1s;animation-delay: -0.5s;}
	.bird--two {animation-duration: 0.9s;animation-delay: -0.75s;}
	.bird--three {animation-duration: 1.25s;animation-delay: -0.25s;}

#section2 .bird-container {
	position: absolute;left: -10%;transform: scale(0) translateX(-10vw);will-change: transform;
	animation-name: fly-right-one;animation-timing-function: linear;animation-iteration-count: infinite;}
	
	.bird-container--one {animation-duration: 15s;animation-delay: 0;top: 10%;}
	.bird-container--two {animation-duration: 16s;animation-delay: 1s;top: 40%;}
	.bird-container--three {animation-duration: 14.6s;animation-delay: 9.5s;top: 60%;}

@keyframes fly-cycle {
	100% {background-position: -900px 0;}
}

@keyframes fly-right-one {
	0% {transform: scale(0.3) translateX(-10vw);}
	10% {transform: translateY(2vh) translateX(10vw) scale(0.4);}
	20% {transform: translateY(0vh) translateX(30vw) scale(0.5);}
	30% {transform: translateY(4vh) translateX(50vw) scale(0.6);}
	40% {transform: translateY(2vh) translateX(70vw) scale(0.6);}
	50% {transform: translateY(0vh) translateX(90vw) scale(0.6);}
	60% {transform: translateY(0vh) translateX(110vw) scale(0.6);}
	100% {transform: translateY(0vh) translateX(110vw) scale(0.6);}
}

@keyframes fly-right-two {
	0% {transform: translateY(-2vh) translateX(-10vw) scale(0.5);}
	10% {transform: translateY(0vh) translateX(10vw) scale(0.4);}
	20% {transform: translateY(-4vh) translateX(30vw) scale(0.6);}
	30% {transform: translateY(1vh) translateX(50vw) scale(0.45);}
	40% {transform: translateY(-2.5vh) translateX(70vw) scale(0.5);}
	50% {transform: translateY(0vh) translateX(90vw) scale(0.45);}
	51% {transform: translateY(0vh) translateX(110vw) scale(0.45);}
	100% {transform: translateY(0vh) translateX(110vw) scale(0.45);}
}


/*Media Queries */
@media screen and (max-device-width: 480px){
	#fp-nav{display: none !important;}
	#btnBook a .button span{font-size:1em;}
	.fp-controlArrow.fp-prev{border-width:25px 20px 25px 0;}
	.fp-controlArrow.fp-next{border-width:25px 0 25px 20px;}
	
	#section1 div{display:flex;flex-direction:column;justify-content:center;}
	#section1 div img{padding:0;}
	#section1 h1{font-size:2em;line-height:140%;padding-top:10%;hyphens:none;font-weight:bold;}
	
	h2{font-size: 18px;}
	#section2 h3{font-size: 12px;padding-top:9%;line-height: 95%;padding-bottom: 4%;}
	#section2 ul li{font-size: 9px;padding-bottom:4%;}
	#section2 .service{margin-bottom:5%}
	#section2 #illustration ul{padding-left: 8%;padding-right: 6%;}
	#section2 .bird, #section2 .bird-container{display:none;}
	
	#section3 .slide .row{margin:0 10px!important;}
	#section3 .id_portfolio{margin-bottom:8%;display:flex;}
	#section3 .id_portfolio div{background: white;justify-content:center;}
	#section3 .id_portfolio div h3{line-height:1.2em;display: block!important;width: 100%;font-size: 1em;font-weight:bold;font-family: 'Indie Flower', cursive;color: #1d1d44;}
	#section3 .id_portfolio div p{display: block!important;font-size: 9px;min-height: 30%;color: #1d1d44;font-family: 'Indie Flower', cursive;hyphens: none;}
	
	#section4 #propos-id img{width:50%;padding:5%;}
	#section4 #propos-txt p{font-size:10px;}
	
	#section5 form p{font-size:10px;margin-top:2%;}
	#section5 form #rgpd{font-size:7px;margin-top:2%;}
	#section5 .btn{font-size:1em;}
	#footer #reseaux a img{width:20px;height:20px;margin:10px;}
	#footer #reseaux{text-align:center;padding-top:10px;}
	#footer{font-size:10px;text-align:center;}
	
	.menu li a{font-size:14px;}
	#mentionslegales{font-size:12px;}
}