@charset "UTF-8";

/*##################################################*/
/*#################### GENERAL #####################*/
/*##################################################*/
html { overflow-x: hidden; overflow-y:scroll; } 
body, html { height: 100%; width: 100%; margin: 0; padding: 0; font-family: OpenSans; font-weight:400; font-style:normal; color: #000; }
@media screen and (max-width: 699px) { body, html { text-size-adjust:none; font-size: 16px; } }
*{ box-sizing: border-box; transition:all 0.5s ease;}
section, #header, #footer { width:100vw; margin:0; padding:0; overflow:hidden; position:relative; }


/*****FONT******/
h1:not(.stylep),h2,h3,p.styleh1,p.styleh2 { text-transform:uppercase; font-weight:bold; }
a.button1,a.button2 { text-transform:uppercase; }
a.button1 { font-weight:bold; }
.font1,.font2,.font4 { text-transform:uppercase; font-weight:bold; }

@media screen and (max-width: 699px) {/*mobile*/
body, html { font-size:16px; }
p,h4 { font-size:16px; }
p+p { margin-top:4vw; }
h1:not(.stylep),p.styleh1 { font-size:40px; margin-bottom:16vw; }
h2,p.styleh2 { font-size:30px!important; margin-bottom:8vw!important; }
#footer p { margin-top:8vw!important; }
p+a.button2 { margin-top:8vw; }
h1.stylep { font-size:18px!important; }
a.button1,a.button2 { font-size:18px; }
.font1 { font-size:40px; }
.font2 { font-size:25px; }
.font3 { font-size:16px; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
body, html { font-size:18px; }
p,h4 { font-size:18px; }
p+p { margin-top:3vw; }
h1:not(.stylep),p.styleh1 { font-size:60px; margin-bottom:20vw; }
h2,p.styleh2 { font-size:40px!important; margin-bottom:6vw!important; }
#footer p { margin-top:0vw!important; }
p+a.button2 { margin-top:6vw; }
h1.stylep { font-size:20px!important; }
a.button1,a.button2 { font-size:20px; }
.font1 { font-size:40px; }
.font2 { font-size:20px; }
.font3 { font-size:20px; }
.font5 { font-size:16px; }
}
@media screen and (min-width: 1350px) { /*desktop*/
body, html { font-size:18px; }
p,h4 { font-size:18px; }
p+p { margin-top:2vw; }
h1:not(.stylep),p.styleh1 { font-size:60px; margin-bottom:5vw; }
h2,p.styleh2 { font-size:40px!important; margin-bottom:3vw!important; }
#footer p { margin-top:0vw!important; }
p+a.button2 { margin-top:3vw; }
h1.stylep { font-size:20px!important; }
a.button1,a.button2 { font-size:20px; }
.font1 { font-size:80px; }
.font2 { font-size:35px; }
.font3 { font-size:20px; }
.font4 { font-size:55px; }
}

/*****BACKGROUND******/
.bgblack { background-color:#000; }
.bgwhite { background-color:#fff; }
.bggris { background-color:#f5f5f5; }
.bgviolet { background-color:#49216C; }
.bgviolet2 { background-color:#5B2A83; }
.bgvert { background-color:#9CCD60; }
/*.bgvioletalpha { background-color:rgba(73,33,108,0.8); }
.bgvertalpha { background-color:rgba(168,200,81,0.8); }*/
.bgimage { background-position:center; background-size:cover; background-repeat:no-repeat; }
.bg3 { background-image:url(../img/img-guillaume-presentation-accueil-mybodycoach.jpg); background-size:contain!important; }
.bg4 { background-image:url(../img/img-guillaume-mon-coaching-mybodycoach.jpg); background-size:contain!important; }
.bg5 { background-image:url(../img/img-guillaume-mes-offres-mybodycoach.jpg); background-size:contain!important; }
.bg12 { background-image:url(../img/salle-equipement-musculation.jpg); background-size:contain!important; }
.bg13 { background-image:url(../img/salle-equipement-cardio.jpg); background-size:contain!important; }

@media screen and (max-width: 699px) {/*mobile*/
.bg1 { background-image:url(../img/img-accueil-et-miniature-haut-de-page-v_small.jpg); }
.bg2 { background-image:url(../img/img-accueil-et-miniature-haut-de-page-v-petite_small.jpg); }
.bg6 { background-image:url(../img/img-contactez-moi-v_small.jpg); }
.bg7 { background-image:url(../img/img-mybodycoach-petite_small.jpg); }
.bg8 { background-image:url(../img/img-mon-coaching-v_small.jpg); }
.bg9 { background-image:url(../img/img-mes-offres-v_small.jpg); }
.bg10 { background-image:url(../img/salle-de-musculation-bandeau_small.jpg); }
.bg11 { background-image:url(../img/salle-muculation_principale_small.jpg); }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
.bg1 { background-image:url(../img/img-accueil-et-miniature-haut-de-page-v_medium.jpg); }
.bg2 { background-image:url(../img/img-accueil-et-miniature-haut-de-page-v-petite_medium.jpg); }
.bg6 { background-image:url(../img/img-contactez-moi-v_medium.jpg); }
.bg7 { background-image:url(../img/img-mybodycoach-petite_medium.jpg); }
.bg8 { background-image:url(../img/img-mon-coaching-v_medium.jpg); }
.bg9 { background-image:url(../img/img-mes-offres-v_medium.jpg); }
.bg10 { background-image:url(../img/salle-de-musculation-bandeau_medium.jpg); }
.bg11 { background-image:url(../img/salle-muculation_principale_medium.jpg); }
}
@media screen and (min-width: 1350px) { /*desktop*/
.bg1 { background-image:url(../img/img-accueil-et-miniature-haut-de-page-v_big.jpg); }
.bg2 { background-image:url(../img/img-accueil-et-miniature-haut-de-page-v-petite_big.jpg); }
.bg6 { background-image:url(../img/img-contactez-moi-v_big.jpg); }
.bg7 { background-image:url(../img/img-mybodycoach-petite_big.jpg); }
.bg8 { background-image:url(../img/img-mon-coaching-v_big.jpg); }
.bg9 { background-image:url(../img/img-mes-offres-v_big.jpg); }
.bg10 { background-image:url(../img/salle-de-musculation-bandeau_big.jpg); }
.bg11 { background-image:url(../img/salle-muculation_principale_big.jpg); }
}

/*****BUTTON******/
a, a:hover { text-decoration:none; }
a.button1 { display:inline-block; margin:0 auto; border:1px solid white; }
a.button2 { display:block; background-image:url(../img/arrow.svg); background-position:right; background-repeat:no-repeat; }
.bgviolet a.button1:hover,.bgviolet2 a.button1:hover,.bgvioletalpha a.button1:hover { background-color:#49216C; }
.bgvert a.button1:hover,.bgvertalpha a.button1:hover { background-color:#86A244; }
.bgviolet a.button2:hover,.bgvioletalpha a.button2:hover { background-image:url(../img/arrow2violet2.svg); }
.bgviolet2 a.button2:hover { background-image:url(../img/arrow2violet.svg); }
.bgvert a.button2:hover,.bgvertalpha a.button2:hover { background-image:url(../img/arrow2vert.svg); }

.bgblack, .bgviolet,.bgviolet2, .bgvert, .bgvioletalpha, .bgvertalpha { color:white; }
.bgblack a, .bgviolet a, .bgviolet2 a, .bgvert a, .bgvioletalpha a, .bgvertalpha a { color:white!important; }
.bgwhite,.bggris { color:black; } 
.bgwhite a,.bggris a { color:black!important; } 

#header ul.droite li:not(.reseaux) a:hover,#header ul.droite li a.current { color:#9CCD60!important; }
#footer a:hover { color:#9CCD60!important; }

@media screen and (max-width: 699px) {/*mobile*/
a.button1 { padding:4vw 8vw!important; }
a.button2 { height:12vw; line-height:12vw!important; background-size:12vw; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
a.button1 { padding:3vw 6vw!important; }
a.button2 { height:6vw; line-height:6vw!important; background-size:6vw; }
}
@media screen and (min-width: 1350px) { /*desktop*/
a.button1 { padding:2vw 4vw!important; }
a.button2 { height:5vw; line-height:5vw!important; background-size:5vw; }
}
/*##################################################*/
/*#################### HEADER ######################*/
/*##################################################*/
#header { position:fixed; top:0; left:0; z-index:50; overflow:hidden; font-weight:100; color:#fff; }
#header nav { width:100vw; margin:0; padding:0; }
#header, #header nav { transition:height 1s ease; }
#logo { display:block; float:left; }
#header ul { display:block; }
#header ul.gauche { position:absolute; top:0; }
#header ul.droite { position:absolute; left:0; text-align:center; }
#header li { overflow:hidden; }
#header ul, #header li, #header a { box-sizing: border-box; }
#header li a { display:block; color:#fff; }
#header li.reseaux img { display:inline; }
#header li.reseaux img+img { display:none; }
@media screen and (max-width: 699px) {/*mobile*/
#header,#header nav,#header ul,#header ul li { height:16vw; }
#burger { display:block; position:absolute; top:0; right:4vw; height:16vw; cursor:pointer; }
#burger img { float:right; }
#burger1 { display:block; }
#burger2 { display:none; }	
#header ul.gauche { left:0;top:0; width:100vw; padding:0 4vw; margin:0; }
#header ul.gauche img { height:16vw; padding:2vw 0; }
#header #logo img { display:inline; }
#header #logo img+img { display:none; }
#header ul.droite li { float:none; border-bottom:1px solid #666; height:16vw; }
#header ul.droite li:first-child { border-top:1px solid #666; }
#header ul.droite li:nth-child(-n+6) a { height:16vw; line-height:16vw; }
#header li.reseaux { height:12vw!important; }
#header li.reseaux img { width:10vw; padding:2vw; }
#header ul.droite { padding:0; width:100vw; display:none; top:16vw; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
#header,#header nav,#header ul,#header ul li { height:10vw; }
#burger { display:block; position:absolute; top:0; right:4vw; height:10vw; cursor:pointer; }
#burger img { float:right; }
#burger1 { display:block; }
#burger2 { display:none; }	
#header ul.gauche { left:0;top:0; width:100vw; padding:0 4vw; margin:0; }
#header ul.gauche img { height:10vw; padding:2vw 0; }
#header #logo img { display:inline; }
#header #logo img+img { display:none; }
#header ul.droite li { float:none; border-bottom:1px solid #666; height:10vw; }
#header ul.droite li:first-child { border-top:1px solid #666; }
#header ul.droite li:nth-child(-n+6) a { height:10vw; line-height:10vw; }
#header li.reseaux img { width:10vw; padding:2vw; }
#header ul.droite { padding:0; width:100vw; display:none; top:10vw; }
}
@media screen and (min-width: 1350px) { /*desktop*/
#header,#header nav,#header ul,#header ul li { height:3vw; }
#burger, #burger img { display:none; width:0; height:0;}
#header ul.gauche { left:5vw; width:90vw; padding:0; margin:0; }
#header ul.gauche a { height:5vw; padding:0; margin:0; margin-top:-1.25vw; display:block; cursor:pointer; }
#header ul.gauche img { height:5vw; padding:0; display:none; }
#header ul.gauche img+img { display:inline; }
#header ul.droite { width:90vw; top:0; left:5vw; padding:0; margin:0; display:block!important; pointer-events:none;}
#header ul.droite li { display:inline-block; margin:0; pointer-events:auto; }
#header ul.droite li.reseaux { position:absolute; top:-0.75vw; }
#header ul.droite li.fmbc { right:0; }
#header ul.droite li.ymbc { right:4vw; }
#header ul.droite li.imbc { right:8vw; }
#header li.reseaux img { width:5vw; height:5vw; padding:1.75vw 1.25vw; }
#header li.reseaux:hover img { display:none; }
#header li.reseaux:hover img+img { display:inline; }
#header ul.droite li:nth-child(-n+6) a { height:5vw; padding:0.5vw 1vw; }
}

/*##################################################*/
/*################# 1ER VIEWPORT ###################*/
/*##################################################*/
.viewport1 { text-align:center; }
@media screen and (max-width: 699px) {/*mobile*/
.viewport1 { height:70vh; padding:22vw 8vw 20vw 8vw; }
.home .viewport1 { height:100vh; padding:22vw 8vw 20vw 8vw; }
.viewport1 p:not(.styleh1),.viewport1 h1.stylep { padding-bottom:16vw!important; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
.viewport1 { height:70vh; padding:30vw 10vw 20vw 10vw; }
.home .viewport1 { height:100vh; padding:30vw 10vw 20vw 10vw; }
.viewport1 p:not(.styleh1),.viewport1 h1.stylep { padding-bottom:20vw!important; }
}
@media screen and (min-width: 1350px) { /*desktop*/
.viewport1 { height:70vh; padding:13vw 10vw 10vw 10vw;}
.home .viewport1 { height:100vh; }
.viewport1 p:not(.styleh1),.viewport1 h1.stylep { padding-bottom:5vw!important; }
}

/*##################################################*/
/*################# H2 + PARAGRAPHE ################*/
/*##################################################*/
.h2paragraphe { text-align:center; }
@media screen and (max-width: 699px) {/*mobile*/
.h2paragraphe { padding:12vw 8vw; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
.h2paragraphe { padding:6vw 4vw; }
}
@media screen and (min-width: 1350px) { /*desktop*/
.h2paragraphe { padding:5vw 10vw; }
}

/*##################################################*/
/*################## GRANDEIMAGE ###################*/
/*##################################################*/
.grandeimage img { opacity:0; }
@media screen and (max-width: 699px) {/*mobile*/
.grandeimage img { width:100vw; height:auto; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
.grandeimage img { width:100vw; height:auto; }
}
@media screen and (min-width: 1350px) { /*desktop*/
.grandeimage img { width:100vw; height:100vh; }
}

/*##################################################*/
/*##################### VIDEO ######################*/
/*##################################################*/
.video #video { cursor:pointer!important; }
.video #play { position:absolute; width:10vw; height:auto; left:45vw; top:22.5vw; cursor:pointer!important; }
.video:hover #play { width:12vw; height:auto; left:44vw; top:21.5vw; }
@media screen and (max-width: 699px) {/*mobile*/
.video #video { width:100%; height:auto; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
.video #video { width:100%; height:auto; }
}
@media screen and (min-width: 1350px) { /*desktop*/
.video #video { width:100%; height:auto; }
}
/*##################################################*/
/*#################### SLIDER ######################*/
/*##################################################*/
.slider { position:relative; float:none; }
.slider p { position:absolute; top:0vw; width:100%; opacity: 0; text-align:center; animation-duration:44s; animation-iteration-count:infinite; }
.slider p+p { margin-top:0!important; }
.slider p:nth-child(1) { animation-name: slider1; }
.slider p:nth-child(2) { animation-name: slider2; }
.slider p:nth-child(3) { animation-name: slider3; }
.slider p:nth-child(4) { animation-name: slider4; }

.bullet { position:relative; float:none; }
.bullet span { display:inline-block; border:1px solid rgba(73,33,108,1); background-color:none; animation-duration:32s; animation-iteration-count:infinite; }
.bullet span:nth-child(1) { animation-name: bullet1; }
.bullet span:nth-child(2) { animation-name: bullet2; }
.bullet span:nth-child(3) { animation-name: bullet3; }
.bullet span:nth-child(4) { animation-name: bullet4; }

@media screen and (max-width: 699px) {/*mobile*/
.slider { margin-bottom:80vw; }
.bullet span { height:4vw; width:4vw; border-radius:4vw; margin:0 1vw; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
.slider { margin-bottom:22vw; }
.bullet span { height:1.5vw; width:1.5vw; border-radius:1.5vw; margin:0 0.5vw; }
}
@media screen and (min-width: 1350px) { /*desktop*/
.slider { margin-bottom:12vw; }
.bullet span { height:1vw; width:1vw; border-radius:1vw; margin:0 0.25vw; }
}


/*##################################################*/
/*##################### BLOC2 ######################*/
/*##################################################*/
.bloc2 { float:left; }
.bloc2 img { opacity:0; }
@media screen and (max-width: 699px) {/*mobile*/
.bloc2 { width:100vw; }
.bloc2 img { width:100vw; }
.texte { padding:12vw 8vw; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
.bloc2 { width:50vw; }
.bloc2 img { width:50vw; }
.texte { padding:6vw 4vw; }
.t-bloc1 { width:100vw; }
.t-bloc1 img { width:100vw; }
}
@media screen and (min-width: 1350px) { /*desktop*/
.bloc2 { width:50vw; }
.bloc2 img { width:50vw; }
.texte { padding:5vw; }
}


/*##################################################*/
/*##################### BLOC3 ######################*/
/*##################################################*/
.bloc3 { float:left; }
.bloc3 p { display:table-cell; vertical-align:middle; text-align:center; }
.bloc3+p { text-align:center; }
.bloc3 br+span { display:inline-block;}
.bloc3>img {max-width:100%; height:auto; }


@media screen and (max-width: 699px) {/*mobile*/
.bloc3 { width:76vw; height:76vw; margin:12vw 12vw 0vw 12vw; }
.bloc3+.bloc3+.bloc3 { margin:12vw 12vw 12vw 12vw; }
.bloc3 p { height:76vw; width:76vw; padding:4vw; }
.bloc3+p { margin:0 12vw 12vw 12vw!important;  }
.bloc3 br+span { padding-top:12vw; }
.displaynonemobile,.displaynonetablette { display:none!important; }
.displaynonemobile+bloc3 { margin-bottom:12vw!important; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
.bloc3 { width:28vw; height:28vw; margin:5vw 1vw 5vw 6vw; }
.bloc3+.bloc3 { margin:5vw 1vw; }
.bloc3+.bloc3+.bloc3 { margin:5vw 6vw 5vw 1vw; }
.bloc3 p { height:28vw; width:28vw; padding:3vw; }
.bloc3+p { margin:0 6vw 6vw 6vw!important; }
.bloc3 br+span { padding-top:0vw; }
.displaynonetablette { display:none!important; } 
}
@media screen and (min-width: 1350px) { /*desktop*/
.bloc3 { width:28vw; height:28vw; margin:5vw 1vw 5vw 6vw; }
.bloc3+.bloc3 { margin:5vw 1vw; }
.bloc3+.bloc3+.bloc3 { margin:5vw 6vw 5vw 1vw; }
.bloc3 p { height:28vw; width:28vw; padding:3vw; }
.bloc3+p { margin:0 5vw 5vw 5vw!important; }
.bloc3 br+span { padding-top:5vw; }
.displaynonedesktop { display:none!important;}
}

/*##################################################*/
/*##################### BLOC4 ######################*/
/*##################################################*/
.bloc4 { float:left; }
.bloc4 p { display:table-cell; vertical-align:middle; text-align:center; }
.bloc4+p { text-align:center; }
.bloc4 br+span { display:inline-block;}


@media screen and (max-width: 699px) {/*mobile*/
.bloc4 { width:76vw; height:64vw; margin:12vw 12vw 0vw 12vw; }
.bloc4+.bloc4+.bloc4+.bloc4 { margin:12vw 12vw 12vw 12vw; }
.bloc4 h3 { width:76vw; padding:4vw; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
.bloc4 { width:43vw; height:37vw;}
.bloc4:nth-child(odd) { margin:5vw 1vw 5vw 6vw; }
.bloc4:nth-child(even) { margin:5vw 6vw 5vw 1vw; }
.bloc4 h3 { width:43vw; padding:3vw; }
}
@media screen and (min-width: 1350px) { /*desktop*/
.bloc4 { width:43vw; height:30vw;}
.bloc4:nth-child(odd) { margin:5vw 1vw 5vw 6vw; }
.bloc4:nth-child(even) { margin:5vw 6vw 5vw 1vw; }
.bloc4 h3 { width:43vw; padding:3vw; }
}

/*##################################################*/
/*##################### BLOC6 ######################*/
/*##################################################*/
.bloc6 { float:left; }
@media screen and (max-width: 699px) {/*mobile*/
.bloc6 { width:41vw; height:54.6vw; margin:8vw 1vw 0vw 1vw; }
.bloc6:nth-child(even) { margin-right:8vw; }
.bloc6:nth-child(odd) { margin-left:8vw; }
.bloc6:last-child { margin-bottom:8vw; }
.bloc6 img { width:41vw; height:54.6vw; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
.bloc6 { width:41vw; height:54.6vw; margin:8vw 1vw 0vw 1vw; }
.bloc6:nth-child(even) { margin-right:8vw; }
.bloc6:nth-child(odd) { margin-left:8vw; }
.bloc6:last-child { margin-bottom:8vw; }
.bloc6 img { width:41vw; height:54.6vw; }
}
@media screen and (min-width: 1350px) { /*desktop*/
.bloc6 { width:14vw; height:18.6vw; margin:5vw 0.5vw 0 0.5vw; }
.bloc6:nth-child(1),.bloc6:nth-child(7) { width:14vw; height:18.6vw; margin-left:5.5vw; }
.bloc6:nth-child(6),.bloc6:nth-child(12) { margin-right:5.5vw; }
.bloc6:last-child { margin-bottom:5vw; }
.bloc6 img { width:14vw; height:18.6vw; }
}

/*##################################################*/
/*#################### BLOCKLIEN ###################*/
/*##################################################*/
.bloclien { text-align:center; }
@media screen and (max-width: 699px) {/*mobile*/
.bloclien { padding:12vw 8vw; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
.bloclien { padding:6vw 4vw; }
}
@media screen and (min-width: 1350px) { /*desktop*/
.bloclien { padding:5vw 10vw; }
}


/*##################################################*/
/*################# FORMULAIRE #####################*/
/*##################################################*/
#formulaire input:not(#rgpd), #formulaire textarea { box-sizing:border-box; border:1px solid #000; font-family:OpenSans,Arial,Helvetica,sans-serif; font-size:18px; font-weight:normal; font-style:normal; font-weight:100; color:#000; border-radius:0!important; resize:none; }
#formulaire input[type=submit] { border:none; color:white; background:#49216C; }
#formulaire input[type=url] { display:none; }
#formulaire input:focus, #formulaire textarea:focus { outline:none; }
#formulaire input.error,#formulaire textarea.error { border:1px solid #49216C; background:#49216C; color:white; }
#error, #success { position:absolute; color:white; text-align:center; z-index:10; }
#formulaire span.error { width:0!important; visibility:hidden!important; }
#formulaire label { padding-left:0vw!important; }
@media screen and (max-width: 699px) {
#formulaire input:not(#submit), #formulaire textarea, #formulaire label { width:84vw; margin:4vw 0; padding:2vw; }
#formulaire input { height:12vw; line-height:12vw; }
#formulaire textarea { height:24vw; padding:2vw; }
#formulaire input[type=submit] { height:12vw; line-height:12vw; margin-top:4vw; padding:0 8vw!important; }
#error, #success { top:1vw; height:12vw; width:84vw; float:left; line-height:12vw; padding:0 2vw; }
#formulaire label.cbox { padding-left:10vw!important;padding-top:0vw!important; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { 
#formulaire input:not(#submit), #formulaire textarea, #formulaire label { width:42vw; margin:1vw 0; padding:1vw; }
#formulaire input { height:6vw; line-height:6vw; }
#formulaire textarea { height:12vw; padding:1vw; }
#formulaire input[type=submit] { height:6vw; line-height:6vw; margin-top:1vw; padding:0 6vw!important; }
#error, #success { top: 2vw; height:6vw; width:42vw; float:left; line-height:6vw; padding:0 1vw; }
#formulaire label.cbox { padding-left:3vw!important;padding-top:0vw!important; }
}
@media screen and (min-width: 1350px) {
#formulaire input:not(#submit), #formulaire textarea, #formulaire label { width:40vw; margin:1vw 0; padding:1vw; }
#formulaire input { height:5vw; line-height:5vw; }
#formulaire textarea { height:10vw; padding:1vw; }
#formulaire input[type=submit] { height:5vw; line-height:5vw; margin-top:1vw; padding:0 4vw!important; }
#formulaire input[type=submit]:hover { background-color:#5B2A83; }
#error, #success { top: 2vw; height:5vw; width:40vw; float:left; line-height:5vw; padding:0 1vw; }
#formulaire label.cbox { padding-left:3vw!important;padding-top:0vw!important; }
}

.cbox { display: block; position: relative; padding-left: 35px; margin-bottom: 12px; cursor: pointer; }
.cbox input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0!important; top: 0; left: 0; }
.checkmark { position: absolute; top: 0; left: 0; height: 25px; width: 25px; background-color: #fff; border:1px solid black; box-sizing: border-box; }
.cbox:hover input ~ .checkmark { background-color: #ccc; }
.cbox input:checked ~ .checkmark { background-color: #49216C; }
.checkmark:after { content: ""; position: absolute; display: none; }
.cbox input:checked ~ .checkmark:after { display: block; }
.cbox .checkmark:after { left: 8px; top: 4px; width: 5px; height: 10px; border: solid white; border-width: 0 3px 3px 0; transform: rotate(45deg); }

#logocouleur { width:210px; height:auto; opacity:1!important; }


/*##################################################*/
/*#################### POPUP  ######################*/
/*##################################################*/
@media screen and (max-width: 699px) {/*mobile*/
#popup { display:inline-block; position:fixed; bottom:0; right:-120vw; background-color:#86A244; padding:2vw 5vw 2vw 3vw; color:white; text-transform: uppercase; font-size:16px; font-weight:bold; animation-duration: 2s; animation-timing-function:ease; animation-fill-mode:forwards; }
#popup:hover { background-color:#9CCD60; }

@keyframes pop1 { from { right: -120vw; } 50% { right: 0vw; } 75% { right: -5vw; } to { right: -2vw; } } 
@keyframes pop2 { from { right: -2vw; } 27% { right: -5vw; } 50% { right: 0; } to { right: -120vw; } }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
#popup { display:inline-block; position:fixed; bottom:0; right:-70vw; background:#86A244; padding:2vw 5vw 2vw 3vw; color:white; text-transform: uppercase; font-size:16px; font-weight:bold; animation-duration: 2s; animation-timing-function:ease; animation-fill-mode:forwards; }
#popup:hover { background:#9CCD60; }

@keyframes pop1 { from { right: -70vw; } 50% { right: 0vw; } 75% { right: -5vw; } to { right: -2vw; } } 
@keyframes pop2 { from { right: -2vw; } 27% { right: -5vw; } 50% { right: 0; } to { right: -70vw; } } 
}
@media screen and (min-width: 1350px) { /*desktop*/
#popup { display:inline-block; position:fixed; bottom:0; right:-40vw; background:#86A244; padding:2vw 5vw 2vw 3vw; color:white; text-transform: uppercase; font-size:16px; font-weight:bold; animation-duration: 2s; animation-timing-function:ease; animation-fill-mode:forwards; }
#popup:hover { background:#9CCD60; }

@keyframes pop1 { from { right: -40vw; } 50% { right: 0vw; } 75% { right: -5vw; } to { right: -2vw; } } 
@keyframes pop2 { from { right: -2vw; } 27% { right: -5vw; } 50% { right: 0; } to { right: -40vw; } } 
}
/*##################################################*/
/*#################### FOOTER ######################*/
/*##################################################*/
#footer a img+img { display:none; }
#legacy { cursor:pointer; }
@media screen and (max-width: 699px) {/*mobile*/
#footer { padding:12vw 8vw; }
#footer p { float:none; width:76vw; text-align:center; }
#footer a img { width:12vw; height:12vw; padding:2vw 0; }
}
@media screen and (min-width: 700px) and (max-width: 1349px) { /*tablette*/
#footer { padding:6vw 4vw; }
#footer p { float:none; width:50vw; height:3vw; line-height:3vw; }
#footer p+p { text-align:left; margin-top: 3vw !important; }
#footer p+p+p { text-align:right; position:absolute; top:6vw; right:4vw; }
#footer a img { width:6vw; height:6vw; padding:0.5vw; }
}
@media screen and (min-width: 1350px) { /*desktop*/
#footer { padding:2.5vw 5vw; }
#footer p { float:left; width:50vw; height:5vw; line-height:5vw; }
#footer p+p { text-align:center;width:30vw; }
#footer p+p+p { text-align:right; width:10vw; line-height:3.5vw; }
#footer a img { width:3vw; height:2vw; }
#footer a:hover img { display:none; }
#footer a:hover img+img { display:inline; }
}


/****MYDEVICE****/
#mydevice {display:none;}
@media screen and (max-width: 699px) { #mydevice { float:left;} }
@media screen and (min-width: 700px) and (max-width: 1349px) { #mydevice {float:right;} }
@media screen and (min-width: 1350px) { #mydevice {float:none;} }
img { vertical-align: bottom; }


/****NPROGRESS****/
#nprogress { pointer-events: none; }
#nprogress .bar { background: #A8C851; position: fixed; z-index: 1031; top: 0; left: 0; width: 110vw; height: 2px; }
#nprogress .peg { display: none!important; }

/****ANIMATIONS****/
/* Animation Header Desktop only */
.d-effetheader1,.d-effetheader1 nav,.d-effetheader1 ul,.d-effetheader1 ul li { height:7vw!important; transition:all ease 1s; }
.d-effetheader1 ul { top:1vw!important; transition:all ease 1s; }
.d-effetheader1 ul.gauche img { display:inline!important; }
.d-effetheader1 ul.gauche img+img { display:none!important; }
.d-effetheader1 ul.gauche a { margin-top:0vw!important; transition:all ease 1s; }
.d-effetheader1 ul.droite li.reseaux { top:0vw!important; transition:all ease 1s; }
.d-effetheader1 li.reseaux img { padding:1.25vw!important; transition:all ease 1s; }
.d-effetheader1 ul.droite li:nth-child(-n+6) a { padding:2vw 1vw!important; transition:all ease 1s; }

/* Apparition simple opacity */
.effetapparition1 { opacity:0; transition:opacity ease 1s, background-position ease 1s; }
.effetapparition2 { opacity:0; transition:opacity ease 1s 0.5s, background-position ease 1s; }

/* Animation Carrousel */
@keyframes slider1 { from { opacity: 1; } 20% { opacity: 1; } 25% { opacity: 0; } to { opacity: 0; } } 
@keyframes slider2 { from { opacity: 0; } 20% { opacity: 0; } 25% { opacity: 1; } 45% { opacity: 1; } 50% { opacity: 0; } to { opacity: 0; } } 
@keyframes slider3 { from { opacity: 0; } 45% { opacity: 0; } 50% { opacity: 1; } 70% { opacity: 1; } 75% { opacity: 0; } to { opacity: 0; } } 
@keyframes slider4 { from { opacity: 0; } 70% { opacity: 0; } 75% { opacity: 1; } to { opacity: 1; } } 
           
@keyframes bullet1 { from { background-color:rgba(73,33,108,1); } 20% { background-color:rgba(73,33,108,1); } 25% { background-color:rgba(73,33,108,0); } to { background-color:rgba(73,33,108,0); } }
@keyframes bullet2 { from { background-color:rgba(73,33,108,0); } 20% { background-color:rgba(73,33,108,0); } 25% { background-color:rgba(73,33,108,1); } 45% { background-color:rgba(73,33,108,1); } 50% { background-color:rgba(73,33,108,0); } to { background-color:rgba(73,33,108,0); } }
@keyframes bullet3 { from { background-color:rgba(73,33,108,0); } 45% { background-color:rgba(73,33,108,0); } 50% { background-color:rgba(73,33,108,1); } 70% { background-color:rgba(73,33,108,1); } 75% { background-color:rgba(73,33,108,0); } to { background-color:rgba(73,33,108,0); } }
@keyframes bullet4 { from { background-color:rgba(73,33,108,0); } 70% { background-color:rgba(73,33,108,0); } 75% { background-color:rgba(73,33,108,1); } to { background-color:rgba(73,33,108,1); } }



