html, body {margin:0;padding:0;width:100%;font-family: Century Gothic, Segoe UI, Calibri, Arial;font-style: normal;color:#4d4d4d;}
img, object, canvas, video, audio, picture {display: block;float: left;margin: 0 auto;margin-top: 10px;margin-right: 20px;margin-bottom: 20px;max-width: 100%;height: auto;}
h1 {font-size: 1.2em;text-transform: uppercase; font-style:normal;font-weight:normal;color: #223fa3/*couleur*/;clear:both;}
h2 {font-size: 1em;text-transform: uppercase; font-style:normal;font-weight:normal;color: #bf0000/*couleur*/;clear:both;}
h3 {font-size: 0.9em; font-style:normal;font-weight:bold;color: #bf0000/*couleur*/;clear:both;text-indent:20px;}
p {line-height: 150%;font-size: 1em;margin-top: 10px;}
ul {text-decoration: none;list-style-type: none;}
li{font-size: 1em;line-height: 175%;text-decoration: none;text-indent:-25px;color: black;}
a{text-decoration: none;color: black;}
a:visited{text-decoration: none;color: gray;}
a:hover, a:focus, a:active{text-decoration: none;color: red;}
.a-page{text-decoration: none;color: blue;}
.image-gauche {float:left;margin-top:10px;margin-right:30px;margin-bottom:30px;margin-left:0px;max-width:50%;}
.vers_galerie {font-style:italic; color: #596e8b;font-weight: bold;font-size: 1.1em;}
.strong {color: #596e8b;font-weight: bold;font-size: 1em;}
.strong-calltoaction {padding:10px;color:orange/*couleur*/;font-weight: bold;font-size: 1em;}
.animate-right{position:absolute;animation:animateright 2s}@keyframes animateright{from{right:-300px;opacity:0.8} to{right:0;opacity:0.8}}
.animate-top{position:absolute;animation:animatetop 2s}@keyframes animatetop{from{top:-300px;opacity:0.8} to{top:0;opacity:0.8}}
.animate-opacity{animation:opac 4s}@keyframes opac{from{opacity:0} to{opacity:0.8}}
.animate-zoom{animation:animatezoom 5s}@keyframes animatezoom{from{transform:scale(0.8)} to{transform:scale(1)}}
.animate-fading{animation:fading 10s infinite}@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.ul-page{list-style-type: none;font-size: 1em;color:#4d4d4d;}
.ul-page li:before {margin-top:0px;line-height:0.15;font-size: 0.9em;content:"\2752";color:#596e8b;display:inline-block;width:-1.5em;margin-left:2.3em;}
div#bloc_menu{float: left;padding-left: 10px;padding-top:60px;padding-right:10px;margin-left:10%;margin-top:0px;width: 25%;min-height:1500px;text-align:left;background-color:white;filter:alpha(opacity=80); opacity:0.8;box-shadow: 0px 0px 10px #333; /* décalage droite, décalage horizontal, largeur, couleur */ z-index: 10;position: fixed;}
div#calltoaction{float: left;padding-left:1%;margin-left:70%;margin-top:5%;width: 29%;z-index: 13;position: fixed;text-align:left;background-color:white;filter:alpha(opacity=80); opacity:0.8;box-shadow: 0px 0px 10px #333;}
div#logo_menu{float: left;padding-left: 15px;padding-top:0px;/* modifier ici pour la distance du logo au top */padding-right:10px;margin-left:10%;margin-top:6%;/* modifier ici pour la distance du logo au top */width:25%;position: fixed;z-index: 20;}
div#texte_menu{ font-family: Century Gothic, Segoe UI, Calibri, Arial;font-size: 0.9em;font-style: normal;color:black;float: left;padding-left: 15px;padding-top: 80px; /* modifier ici pour la distance texte menu au top */padding-right:10px;margin-left:10%;margin-top:16%;/* modifier ici pour la distance texte menu au top */width:25%;position: fixed;z-index: 30;}
div#image{float: left;padding: 0%;margin-top:20px;width: 100%;position: relative;z-index: 2;}
div#image-entete{float: left;padding: 0%;margin-top:20px;width: 100%;position: relative;z-index: 2;}
div#contenu{float: left;padding: 0%;margin-top:25px;/* modifier ici pour la distance du logo au top */margin-right:13%;margin-left:40%;width: 52%;min-height: 1800px;background-color:ffffff;position: relative;z-index: 3;}
div#copyright{font-family: Century Gothic, Segoe UI, Calibri, Arial;font-size: 0.8em;font-style: normal;color: #596e8b;text-align:center;}

#menu-accordeon{text-align: left;}
#menu-accordeon ul{list-style:none;text-align: left;}
#menu-accordeon li {margin-bottom:2px;}
#menu-accordeon li li {max-height:0;overflow: hidden;transition: all 2s;margin-left: -60px;}
#menu-accordeon a {display:block;text-decoration: none;margin-left: 0px;}
#menu-accordeon ul li a, #menu-accordeon li:hover li a{margin-left:45px;color: #596e8b;}
#menu-accordeon li:hover li {max-height: 15em;}

/* application d'un responsive-design pour ecran en-dessous de 800 pixels */ 

@media screen and (max-width:800px) {
li {padding-bottom: 2px;padding-top: 2px;margin-left: 1%;}
div#calltoaction{display:none;float: left;padding-left:0%;margin-left:0%;margin-top:0%;width: 0%;z-index: 13;position: absolute;text-align:left;background-color:white;filter:alpha(opacity=70); opacity:0.7;box-shadow: 0px 0px 10px #333;}
div#bloc_menu{display:none; /* Supprime le div */}
div#logo_menu{float: left;padding-left: 1%;padding-top: 1%;padding-right: 1%;padding-bottom: 1%;margin-left:1%;margin-top:1%;margin-right:1%;margin-bottom:1%;width:97%;position: relative;}
div#texte_menu{font-size: 1,5em;font-style:normal;color:black;float: left;padding-left: 1%;padding-top: 0%;padding-right:1%;margin-left:1%;margin-top:0%;margin-right:1%;width:97%;position: relative;}
div#image{float: left;padding: 1%;margin-top: 0%;width: 97%;position: relative;}
div#image-entete{max-height:1px;visibility:hidden;}
div#contenu{float: left;padding-left: 2%;padding-top: 0%;padding-right:1%;margin-left:1%;margin-top:0%;margin-right:1%;width: 96%;min-height: 200px;position: relative;}
.strong {color: #0000FF;font-weight: bold;}
.image-gauche {float:left;margin-top:10px;margin-right:10px;margin-bottom:10px;margin-left:10px;height: auto;clear:both;}
}