body
{
padding: 0%;
margin: 0%;
font-family: Segoe UI, Calibri, Arial;
font-size: 0.8em;
color: #333024;
background: f5f1e9#;
}

img, object, canvas, video, audio, picture
{
display: block;
margin: 0 auto;
max-width: 100%;
height: auto;
}

h1
{
font-size: 1.2em; 
font-weight: bold;
color: #333024;
}

h2
{
font-size: 1em;
font-weight: bold;
color: #333024;
}

ul
{
padding:13%;
color:#1c69b4 ;
}

li
{
line-height: 200%;
text-decoration: none;
list-style-type: square;
list-style-type: #1c69b4;
}

a
{
text-decoration: none;
color: #f5f1e9;
}

a:visited
{
text-decoration: none;
color: #f5f1e9;
}

a:hover, a:focus, a:active
{
text-decoration: none;
color: #1c69b4;
}

div#menu
{
margin-top: 3%;
margin-left: 4%;
padding-top: 5%;
padding-right: 1%;
padding-left: 1%;
float: left;
width: 20%;
min-height: 1000px;
background: #333024;
color: #f5f1e9;
box-shadow: 0px 0px 15px #000; /* décalage droite, décalage horizontal, largeur, couleur */ 
position: relative;
z-index: 2;
}

div#contenu
{
padding-top: 8%;
margin-right: 3%;
margin-left: 3%;
float: right;
width: 67%;
min-height: 1000px;
position: relative;
z-index: 1;
}

a.texte_bleu 
{
color: #1c69b4;
}

/* responsive-design pour ecran en-dessous de 800 pixels */ 

@media screen and (max-width:800px) {

li {
font-size: 1.8em;
padding-bottom: 5px;
padding-top: 5px;
margin-left: 1%;
}

h1{
font-size: 1.8em; 
font-weight: normal;
padding-bottom: 0%;
}

div#contenu
{
margin:1%;
padding: 3%;
width:94%;
min-height: 1px;
color: #333024;
background: f5f1e9#;
box-shadow: none;
float:none;
}

div#menu
{
margin:1%;
padding: 1%;
width:94%;
min-height: 1px;
background: #333024;
color: #f5f1e9;
box-shadow: none;
float:none;
}