nav ul{
padding: 0px;
margin: 0px;
margin-top : -10px; 
}

nav li{
display:inline-block;
width:12%;
height:25px;
margin:0px;
padding:0px;
border-right:0px solid #CCCCCC;
vertical-align:top;
}

nav li a{
color:#769261;
display:inline-block;
}

li.grosse-puce
{
	float:left;
	font-size:30px;
	color:#D99594;
	line-height:20px;
}

li.puce {
float:left;
 font-family: 'Open Sans Condensed', sans-serif;
 font-size: 100%;
 list-style-type: none;
 list-style-position: inside;
 background-image: url(puce.jpg);
 background-repeat: no-repeat;
 background-position:100px 65%;
} 

.example-image-link {
  display: inline-block;
  padding: 2px;
  margin: 0 0.5rem 1rem 0.5rem;
  background-color: #fff;
  line-height: 0;
  border-radius: 4px;
  transition: background-color 0.5s ease-out;
  vertical-align: middle;  }
  
  .example-image-link:hover {
    background-color: #4ae;
    transition: none; }

.example-image {
  width: 7rem;
  border-radius: 4px; 
  text-align: center;
  vertical-align: middle; }
  


h1, h2, h3, h4, h5 {
  color: #222;
  line-height: 1.2em;
  font-family: "Roboto", "Helvetica", "lucida grande", sans-serif;
  font-weight: 400; }

h3 {
  margin-bottom: 1rem;
  text-align: center;
  font-size: 20px;
  font-weight: 400; 
  color: #D99594;
  }
  
 hr {
  box-sizing: content-box;
  height: 0; }
  
  /* Elements
 * ========================================================================== */
hr {
  width: 50%;
  border: 0;
  text-align: center;
  border-top: 2px solid whitesmoke;
  border-color: #F8EDF3;  }


@font-face {
  font-family: 'Indie Flower';
  font-style: normal;
  font-weight: 400;
  src: local('Indie Flower'), local('IndieFlower'), url(https://fonts.gstatic.com/s/indieflower/v8/10JVD_humAd5zP2yrFqw6ugdm0LZdjqr5-oayXSOefg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

/* cyrillic-ext */
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Cond Light'), local('OpenSans-CondensedLight'), url(https://fonts.gstatic.com/s/opensanscondensed/v10/gk5FxslNkTTHtojXrkp-xJwNa6kgmw9HIHjUBPkzL2f3rGVtsTkPsbDajuO5ueQw.woff2) format('woff2');
  unicode-range: U+0460-052F, U+20B4, U+2DE0-2DFF, U+A640-A69F;
}
/* cyrillic */
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Cond Light'), local('OpenSans-CondensedLight'), url(https://fonts.gstatic.com/s/opensanscondensed/v10/gk5FxslNkTTHtojXrkp-xKdGPpWTn2kPFru4k7T0T-v3rGVtsTkPsbDajuO5ueQw.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Cond Light'), local('OpenSans-CondensedLight'), url(https://fonts.gstatic.com/s/opensanscondensed/v10/gk5FxslNkTTHtojXrkp-xN9i7v7U2vZkHC55NWxtqfn3rGVtsTkPsbDajuO5ueQw.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Cond Light'), local('OpenSans-CondensedLight'), url(https://fonts.gstatic.com/s/opensanscondensed/v10/gk5FxslNkTTHtojXrkp-xK1ueDcgZDcfV3TWANvdPLj3rGVtsTkPsbDajuO5ueQw.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Cond Light'), local('OpenSans-CondensedLight'), url(https://fonts.gstatic.com/s/opensanscondensed/v10/gk5FxslNkTTHtojXrkp-xC3qj1XlvLGj0jktnJzWu233rGVtsTkPsbDajuO5ueQw.woff2) format('woff2');
  unicode-range: U+0102-0103, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Cond Light'), local('OpenSans-CondensedLight'), url(https://fonts.gstatic.com/s/opensanscondensed/v10/gk5FxslNkTTHtojXrkp-xC8hAQ4ocbp44gFQt8tMfcH3rGVtsTkPsbDajuO5ueQw.woff2) format('woff2');
  unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Open Sans Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Cond Light'), local('OpenSans-CondensedLight'), url(https://fonts.gstatic.com/s/opensanscondensed/v10/gk5FxslNkTTHtojXrkp-xBEur64QvLD-0IbiAdTUNXE.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

.gauche {float: left}
.droite {text-align: right}

#Compte{
  text-align: center;
  font-weight: bold;
  height:10px;
  color:#D99594;
   vertical-align:middle;
	font-family: 'Indie Flower', cursive;
	width: 50px;
}

.date 
{
font-size :20px; 
color:#D99594;
font-weight: bold;
font-family: 'Indie Flower', cursive;
}

.titre_vert
{
color: #C2D69B;
word-spacing: -5px;
  font-family: 'Indie Flower', cursive;
  text-align: center;
      margin: 0 auto;
	  font-size: 45px;
	  font-weight: bold;
}

.titre_bordeau
{
color: #943634;
word-spacing: -5px;
font-family: 'Indie Flower', cursive;
text-align: center;
margin: 0 auto;
font-size: 45px;
font-weight: bold;
}

.texte_accueil
{
font-size: 18px; 
color: #000000;
font-weight: bold;
font-family: 'Open Sans Condensed';
vertical-align: top;
text-align: center;
width: 100%;
overflow : auto;
}

.texte_lieu_reception_vert
{
font-size: 18px;
color: #769261;
font-weight: bold;
font-family: 'Open Sans Condensed';
text-align: center;
}

.texte_hebergement_vert
{
font-size: 17px;
color: #769261;
font-weight: bold;
font-family: 'Open Sans Condensed';
text-align: center;
}
.texte_lieu_reception_rose
{
font-size: 25px;
color: #D99594;
font-weight: bold;
font-family: 'Open Sans Condensed';
text-align: center;
}

.texte_hebergement_rose
{
font-size: 25px;
color: #D99594;
font-weight: bold;
font-family: 'Open Sans Condensed';
text-align: center;
}

.texte_hebergement_lien
{
font-size: 20px;
color: #000000;
font-weight: bold;
font-family: 'Open Sans Condensed';
text-align: center;
}

.texte_liste_rose_petit
{
font-size: 15px;
color: #D99594;
font-weight: bold;
text-align: center;
}

.texte_liste_rose_grand
{
font-size: 20px;
color: #D99594;
font-weight: bold;
text-align: center;
}

.texte_liste_vert
{
font-size: 15px;
color: #769261;
font-weight: bold;
text-align: center;
    vertical-align: middle;
}

table td, table td * {
    vertical-align: top;
	text-align : center;
}

table {
 text-align : center;
 width:60%;
 margin: 0 auto;
 }

p {
  text-align: center;
}

html, body {
  height : 100%;
  margin : 0;
  padding :0;
  background      : #FFFFFF fixed repeat-x 0 20px;
}

img.displayed {
    display: block;
    margin-left: auto;
    margin-right: auto;
	text-align : center; 
}

img.accueil {
	display:inline-block; 
	vertical-align: middle;
	margin-right: 60px;
	margin-left: 5%;
	width: 250px;
	height: 250px;
}


#page {
  min-height : 100%;
  text-align: center;
}

#footer{
  margin-top : 5px;     /* - hauteur pied de page */
  height : 20%;
  overflow:hidden;
    text-align: center;
}

#contenu{

  overflow : auto;
  width:100%;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

#entete{
  height : 20%;
  padding:0px;
  overflow:hidden;
  vertical-align: top;
  text-align: center;
}

@media (max-width: 1024px) {
   /* CSS appliqué aux petits écrans */
   #footer {
      float: none;
      width: auto;
   }
   #contenu {
      margin-right: 0px;
	        float: none;
			word-wrap: break-word; 
			display: block;
		width: auto;
   }
   table, tbody { display: block; width: 100%; float: none;}
tr { display: table; }
td { display: table-row; }
	* {
		box-sizing: border-box;
	}
	
img,
	table,
	td,
	blockquote,
	code,
	pre,
	textarea,
	input,
	iframe,
	object,
	embed,
	video {
		max-width: 100%;
				float: none;
				 position: static; 
	}

	
	img.accueil {
			height: auto;
		float: none;
		width: 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;
	}
	.texte_hebergement_vert
{
font-size: 40px;
color: #769261;
font-weight: bold;
font-family: 'Open Sans Condensed';
text-align: center;
}

.texte_hebergement_rose
{
font-size: 45px;
color: #D99594;
font-weight: bold;
font-family: 'Open Sans Condensed';
text-align: center;
}

.texte_hebergement_lien
{
font-size: 60px;
color: #000000;
font-weight: bold;
font-family: 'Open Sans Condensed';
text-align: center;
}
}