body {
margin:0;
font-family: Arial,Helvetica, sans-serif;
font-size:1em; 
color:#404040;
letter-spacing:0.005em;
}


/*RESPONSIVE GRID*/
* { /*Makes sure that the padding and border are included in the total width and height of the elements*/
box-sizing: border-box;
}

[class*="col-"] { /*All the columns should be floating to the left, and have a padding of 15px:*/
float: left;
padding: 0.9375em;
border: 0.0625em;
}

.row::after { /*The columns inside a row are all floating to the left, and are therefore taken out of the flow of the page, and other elements will be placed as if the columns do not exist. To prevent this, we will add a style that clears the flow:*/
content: "";
clear: both;
display: table;
}

[class*="col-"] { /* For mobile phones: */
  width: 100%;
}

@media only screen and (min-width: 600px) { /* For tablets: */
.col-s-1 {width: 8.33%;}
.col-s-2 {width: 16.66%;}
.col-s-3 {width: 25%;}
.col-s-4 {width: 33.33%;}
.col-s-5 {width: 41.66%;}
.col-s-6 {width: 50%;}
.col-s-7 {width: 58.33%;}
.col-s-8 {width: 66.66%;}
.col-s-9 {width: 75%;}
.col-s-10 {width: 83.33%;}
.col-s-11 {width: 91.66%;}
.col-s-12 {width: 100%;}
}

@media only screen and (min-width: 600px) { /* For desktop: */
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}
}
/*END OF RESPONSIVE GRID*/



.centre {
max-width:75em;
margin:auto;
}

ul {
list-style-type: none;
border: 1px solid #f1f1f1;
}

li {
margin:20px 0px;
text-align:left;
font-size:1.1250em;
}

a.menu:link, a:visited {
color:#404040;
text-decoration: none;
}

a.menu:hover, a:active {
color:#ff0000;
text-decoration:underline;
}

h1 {
font-size:1.3750em;
text-align:left;
color:#ff0000;
margin-top:14px;
margin-left:10px;
margin-right:0px;
margin-bottom:0px;
}

.grey{color:#979797;}
.red{color:#ff0000;}

.titre {
font-size:1.0625em; 
font-weight:bold; 
}

.contents {
margin-left:10px;
text-align:justify;
}

.contents_left {
margin-left:10px;
}

.flag {
margin-top:0px;
margin-bottom:10px;
text-align:center;
}

a:link, a:visited {
color:#404040;
text-decoration: underline;
}

a:hover {
color:#ff0000;
text-decoration: underline;
}

a:active {
color:#404040;
text-decoration: underline;
}