body { width: auto;  height:auto; }
body { background-image: none; font-size: 18px; width: auto; height: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 empecher les débordements de boîtes dus aux border ou padding */
#page 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 a la ligne forcé */
   -webkit-hyphens: auto; /* césure propre */
   -moz-hyphens: auto;
   hyphens: auto;
 }
.mobileNo 	{ display: none; }
.mobileYes, .mobile 	{ display: block; }
#page { position: relative; width:auto; clear: both; overflow: hidden; padding: 0px; border: 0px; border-radius:0px; margin: 0px; }
#haut-mobile{ width:auto; background-image: url(/images/haut-mobile.jpg); background-repeat: no-repeat; background-position: center top; height: 90px; position: relative; display: block; }
#haut { display: none; }

#menu-mobile { color: #fff; cursor: pointer; display: block; font-size:24px; font-weight: bold; text-align: center; position: fixed; position: relative; background:#333333 url(images/menu-responsive.png) no-repeat 90% center; height: 24px; padding: 8px; width: 100%; z-index: 1000; }

#nav-mobile { width:100%; position: relative; top: -16px; text-align: center; background-image: none; z-index: 5000; left: 0px; }
#nav-mobile ul  { clear: both; position: absolute; width:100%; height:auto; z-index: 10000; display: none; background-color:#FFFFFF;  box-shadow : 1px 1px 22px #555;  padding-top: 1px; padding-right: 0px; padding-bottom: 12px; padding-left: 0px; }
#nav-mobile ul li { float: none; display: block; height: auto; line-height: 30px; width:100%; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #bbb; margin: 0px; padding: 0px; background-image: none; background-color: #FFFFFF;  border-left-width: 10px; border-left-style: solid; border-left-color: #e53727; }
#nav-mobile ul .mobileYes { display: block;  }
#nav-mobile ul .mobileNo { display: none;  }
#nav-mobile ul a, #nav-mobile ul a:link { float: none; white-space: nowrap; font-size: 18px; width:auto; display: block; color: #333333; text-align: left; padding-top: 2px; padding-bottom: 2px; padding-left: 10px; margin: 0px; padding-right: 0px; text-decoration: none; background-image: url(images/menu-fleche.png); background-attachment: scroll; background-repeat: no-repeat; background-position: 94% center; }

#nav-mobile ul a:hover { background-color: #7ec8e8; color: #990000; text-decoration: none; background-image: none; }
#nav-mobile .active  { background-image: none; border-left-color: #009900; }
#nav-mobile ul .active a, #nav-mobile ul .active a:link { font-weight: bold; background:#F6DFC0 url(images/menu-current.png) no-repeat 94% center; }

#contenu { width:auto; padding-right: 10px; padding-left: 10px;  padding-bottom: 10px;  padding-top:10px; }
#bas { display:none;}
#bas-mobile { display:block; background-color: #e53727; padding: 12px 12px 40px; color: #f4dfbf; font-size: 20px; }
#bas-mobile a, #bas-mobile a:link {  color: #f4dfbf; }
#contenu .photos  { margin-top: 0px; margin-bottom: 0px; }
#contenu .photos td { display: block; }
#contenu .photos img { margin-top: 16px;  }
h1, .titre, .titreCentre { font-size: 17px; }

.imgMobile  { margin-right: auto; margin-bottom: 10px; margin-left: auto; float: none; display: block; }