html {
	height: 100%;
	background-color: #ffffff;
	
}

body {
	background-color: #ffffff;
	width: 780px;
	min-height: 600px;
	margin:20px auto 0;
}

@media (max-width: 640px) {

 /* passer tous les éléments de largeur fixe en largeur automatique */
 body, element1, element2 {
   width: auto;
   margin: 0;
   padding: 0;
 }

 /* fixer une largeur maximale  de 100 % aux éléments potentiellement problématiques */
 img, table, td, blockquote, code, pre, textarea, input, iframe, object, embed, video {
   max-width: 100%;
 }
/* conserver le ratio des images et empêcher les débordements de boîtes dûs aux border ou padding */
 img {
   height: auto; width: auto;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }

 /* gestion des mots longs */
 textarea, table, td, th, code, pre, samp {
   word-wrap: break-word; /* passage à la ligne forcé */
   -webkit-hyphens: auto; /* césure propre */
   -moz-hyphens: auto;
   hyphens: auto;
 }
 code, pre, samp {
   white-space: pre-wrap; /* passage à la ligne spécifique pour les éléments à châsse fixe */
 }

 /* Passer à une seule colonne (à appliquer aux éléments multi-colonnes) */
 element1, element2 {
   float: none;
   width: auto;
 }

 /* masquer les éléments superflus */
 .hide_mobile {
   display: none !important;
 }

 /* Un message personnalisé */
 body:before {
   content: "Version mobile du site";
   display: block;
   color: #777;
   text-align: center;
   font-style: italic;
 }
}

@media (max-device-width:768px) and (orientation: landscape) {
  html {
   -webkit-text-size-adjust: 100%;
  }
}

/* Navigateur */

.nav, .nav2 {
	width: 100%;
	margin: 0;
	padding: 0;
	text-align: center;	
}

.nav td, .nav2 td {
	text-align: center;	
}

.nav a {
    color: #000000;
	font-family: Calibri, sans-serif;
	font-size: 1.4em;
	font-weight: bold;
	text-decoration: none;	
}

.nav a:hover {
    color: #e70545;
	font-family: Calibri, sans-serif;
	font-size: 1.4em;
	font-weight: bold;
	text-decoration: none;
}

.nav2 a {
    color: #000000;
	font-family: Calibri, sans-serif;
	font-size: 1em;
	font-weight: bold;
	text-decoration: none;	
}

.nav2 a:hover {
    color: #e70545;
	font-family: Calibri, sans-serif;
	font-size: 1em;
	font-weight: bold;
	text-decoration: none;
}

/* Corps de texte */

td {
	font-family: Tahoma, Arial;
	font-style: normal;
	color: #000000;
}

td img {
	display: block;
    margin-left: auto;
    margin-right: auto;
	margin-bottom: 10px;
}

h1, h2, h3, h4, h5 {
	font-family: Tahoma, Arial;
	font-style: normal;
    margin: 0px;
}


h1 {
    font-size: 0.9em;
	text-align: center;
	color: #e70545;
}

h2 {
    font-size: 0.7em;
	text-align: left;
}

h3 {
    font-size: 1.2em;
}

.corps td p{
	font-family: Tahoma, Arial;
	font-style: normal;
	font-size: 0.8em;
	color: #000000;
	text-align: justify;
}

.liste td p{
	font-family: Tahoma, Arial;
	font-style: normal;
	font-size: 0.8em;
	color: #000000;
	text-align: justify;
}

/* Liens "en savoir plus ..." */
p a {
	font-size: 1em;
}

p a:hover {
	font-size: 1em;
}

a {
font-family: Tahoma, Arial;
font-style: normal;
font-size: 0.7em;
color: #797979;
text-decoration: underline;
}

a:hover {

font-family: Tahoma, Arial;
font-style: normal;
font-size: 0.7em;
color: #797979;
text-decoration: none;

}

a.black-link {	
	text-decoration: none;
	font-family: Tahoma, Arial;
	font-style: normal;
	color: #000000;
}

#lirelasuite1, #lirelasuite2, #lirelasuite3, #lirelasuite, #lirelasuite4, #lirelasuite5, 
#lirelasuite6, #lirelasuite7, #lirelasuite8, #lirelasuite9, #lirelasuite10, #lirelasuite11, 
#lirelasuite12, #lirelasuite13, #lirelasuite14, #lirelasuite15, #lirelasuite16, #lirelasuite17, 
#lirelasuite18, #lirelasuite19, #lirelasuite20, #lirelasuite21, #lirelasuite22, #lirelasuite23
{
	display:none;
}

/* Pied de page */

.footer td p{
	font-family: Tahoma, Arial;
	font-style: normal;
	font-size: 0.7em;
	color: #000000;
	text-align: center;	
}