/*
# Copyright notice
# © 2020-2024
# Christian ECKENSPIELLER
#
modifié le 08-11-2024
*/
html {
	font-size: 100%;
	height: 100%;
}
body {
	margin-top: 10px;
	padding: 0;
	height: 100%;
	font-family: Verdana, "Bitstream Vera Sans", "Lucida Grande", sans-serif; /* 3 */
	line-height: 1.25;
	color: #333;
	background: url(../img/filigrane.gif) top; 
/*   background-image:url(../img/filigrane.gif); */
    background-attachment:fixed;
}
h1, h2, h3, h4, h5, h6 {
	font-family:Arial, Helvetica, sans-serif; /* Trebuchet MS, sans-serif; */
/*	color:#555; */
	margin: 0 0 .25em 0;
}
h1 { font-size:1.6em; }
h2 { font-size:1.5em; }
h3 { font-size:1.4em; }
h4 { font-size:1.3em; }
h5 { font-size:1.2em; }
h6 { font-size:1em; }
h1 {
   color: #A76726;
   text-transform: uppercase;
}

/* Paragraphes */
p {
	font-size: 1em;
	margin: .75em 0;
	text-align: justify;
	line-height: 18px;
}
/* #################################################################### */

/* style des liens (avec liens externes) */
a {
   color: #A76726;
   text-decoration: none ;
}
a:visited {
   color: #882222 ;
}
a:hover {
   color: #DF6D14;
   transition: transform 0.6s ease-out;
   -webkit-transition: color 0.6s ease-out;
   -moz-transition: color 0.6s ease-out;
   -o-transition: color 0.6s ease-out;
   text-decoration: underline ;
}
a:focus {
   outline: thin dotted ;
}
a:hover, a:active {
   outline: 0 ;
}
/* add icon to links with class external */
a.external span {
   position: absolute;
   left: -5000px;
   width: 4000px;}
a.external {
   padding: 0 12px 0 0;
}
/* colors for external links */
a.external:link {
   color: #A76726;
   background: url(../img/external.gif) no-repeat 100% -100px;
}
a.external:visited {
   color: #5B3C11 ;
   background: url(../img/external.gif) no-repeat 100% -100px;
}a.external:hover {
   color: #DF6D14 ;
   background: url(../img/external.gif) no-repeat 100% 0;
   background-color: inherit;
}
/* #################################################################### */
.bouton {
   border-top: 1px solid #b0edad;
   background: #48db5e;
   background: -webkit-gradient(linear, left top, left bottom, from(#3b7a57), to(#48db5e));
   background: -webkit-linear-gradient(top, #3b7a57, #48db5e);
   background: -moz-linear-gradient(top, #3b7a57, #48db5e);
   background: -ms-linear-gradient(top, #3b7a57, #48db5e);
   background: -o-linear-gradient(top, #3b7a57, #48db5e);
   padding: 11.5px 23px;
   -webkit-border-radius: 21px;
   -moz-border-radius: 21px;
   border-radius: 21px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: #f5ed56;
   font-size: 21px;
   font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif;
   text-decoration: none;
   vertical-align: middle;
   width:400px;
   }
.bouton:hover {
   border-top-color: #2e8b56;
   background: #2e8b56;
   color: #0fffff;
   }
.bouton:active {
   border-top-color: #1b435e;
   background: #1b435e;
   }

/* ------------ Menu Breadcrumb -------------- */
#breadcrumb p {
   margin: 0;
   padding: 0 0 5px 0;
   list-style: none;
   font-size: .85em;
   line-height: 10px;
   text-align:center;
}
#breadcrumb a {
   text-decoration: none;
}
/* ##################################################################
----------           bloc conteneur global : vitrine       ----------
################################################################## */
#vitrine {
	min-height: 100%;
	width: 800px;
	overflow: hidden;
	margin: 0 auto;
}
/* ##################################################################
----------                  bloc entete                    ----------
################################################################## */
#entete {
	margin: 0;
	padding: 0;
	height: 150px;
	width: 800px;
   font-size: 0.8em;
	background: #888888;
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
}
#entete a {color: #fff;text-decoration: none;}
#entete a:visited {color: #ccc;}
#entete a:hover {color: #ff0;transition: transform .4s ease-out;-webkit-transition: color .4s ease-out;-moz-transition: color .4s ease-out;-o-transition: color .4s ease-out;text-decoration: underline;}
#entete a:focus {outline: thin dotted;color: #f88;}
#entete a:hover, #entete a:active {outline: 0;}
#entete_logo {
	height: 150px;
	width: 260px;
	float: left;
}
#entete_texte_milieu {
	height: 150px;
	width: 270px;
	float: left;
}
#entete_texte_droite {
	height: 150px;
	width: 260px;
	float: right;
}
#entete_texte_milieu h1, #entete_texte_droite h1 {
	font-family:Arial,Sans-serif;
	font-size:1.6em;
	color:#fff;
	text-align: center;
/*	text-shadow: -1px 0 white, 0 1px white, 1px 0 white, 0 -1px white;   */
	margin-top: 20px;
}
#entete_texte_milieu hr, #entete_texte_droite hr {
	height: 1px;
	margin: 10px 8px;
	padding: 0;
	color: #ccc;
	background-color: #ccc;
	border: 0;
	background-image: -webkit-linear-gradient(left, #333, #ccc, #333); 
	background-image:    -moz-linear-gradient(left, #333, #ccc, #333); 
	background-image:     -ms-linear-gradient(left, #333, #ccc, #333); 
	background-image:      -o-linear-gradient(left, #333, #ccc, #333);
}
#entete_texte_milieu p, #entete_texte_droite p {
	font-family:Arial,Sans-serif;
	font-size:1.3em;
	color:#fff;
	margin: 0 10px;
	text-align: center;
/*	text-shadow: 0px 1px 0px #fff;   */
}
/* ##################################################################
----------           bloc entete > navigation              ----------
################################################################## */
#navigation {
	background: #3f9c68;
	padding: 12px 15px;
   font-size: 0.7em;
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
}
#navigation ul {
	margin: 0;
	list-style: none;
   text-align: center;
}
#navigation li {
	display: inline;
}
#navigation a {
	padding: 15px 20px;
	line-height: 1.5;
	font-size: 1.3em;
	text-decoration: none;
	color: #fff;
}
#navigation a:hover, #navigation a:focus {
	background: #8f8;
	color: #080808;
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
}
/* ##################################################################
----------                 blocs conteneurs                ----------
################################################################## */
#contenu {
	padding: 20px;
	min-height: 300px;
	background: #e8e8e8;
	border:1px solid #666;
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
}
#contenu > :first-child {
/*	margin-top: 10px;		*/
}
#contenu hr {
	height: 1px;
	margin: 10px 14px;
	padding: 0;
	color: #4a4;
	background-color: #4a4;
	border: 0;
	background-image: -webkit-linear-gradient(left, #ada, #444, #ada); 
	background-image:    -moz-linear-gradient(left, #ada, #444, #ada); 
	background-image:     -ms-linear-gradient(left, #ada, #444, #ada); 
	background-image:      -o-linear-gradient(left, #ada, #444, #ada);
}
#contenu .bloc_horizontal {
	width: 700px;
	margin: 20px auto;
	padding: 10px 16px;
	background-color: #d8d8d8;
	color: #000;
	border:1px solid #333;
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
	opacity: 0.8;
}
.bloc_adjacent_gauche {
	width: 330px;
	padding: 10px 10px;
}
.bloc_adjacent_gauche p {
   text-align: justify;
}
.bloc_adjacent_droit {
	width: 330px;
	float: right;
	padding: 10px 16px;
}
.bloc_adjacent_droit p {
   text-align: justify;
}
#contenu .bloc_gauche {
	width: 330px;
	padding: 10px 10px;
	margin-top: 10px;
	background-color: #d8d8d8;
	color: #000;
	border:1px solid #333;
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
	opacity: 0.7;
}
#contenu .bloc_gauche table {
	margin: 0 auto;
	border: none;
	border-spacing: 0;
}
#contenu .bloc_gauche td, #contenu .bloc_gauche th {
	border: 1px solid #ccc;
   color: #000;
   font-size:0.8em;
}
#contenu .bloc_gauche th {
	text-align:center;
	padding: 8px 0;
}
#contenu .bloc_gauche td {
	padding: 8px 4px;
}
#contenu .bloc_gauche td.jour {
	font-weight: bold;
}
#contenu .bloc_droit {
	width: 330px;
	float: right;
	margin: 0;
	padding: 10px 16px;
	background-color: #d8d8d8;
	color: #000;
	border:1px solid #333;
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
	opacity: 0.8;
}
#contenu .bloc_droit table {
	margin: 0 auto;
	border: none;
	border-spacing: 0;
}
#contenu .bloc_droit td, #contenu .bloc_droit th {
	border: 1px solid #ccc;
   color: #000;
   font-size:0.8em;
}
#contenu .bloc_droit th {
	text-align:center;
	padding: 8px 0;
}
#contenu .bloc_droit td {
	padding: 8px 4px;
}
#contenu .bloc_droit td.jour {
	font-weight: bold;
}
/* ##################################################################
----------                  bloc pied                      ----------
################################################################## */
#pied {
	background: #2e8b57;
/*	background-image:url(../img/pied.png); */
	background-repeat:repeat-x;
	height: 180px;
   font-size:0.8em;
	border-radius:10px 10px 0 0;
	-moz-border-radius:10px 10px 0 0;
	-webkit-border-radius:10px 10px 0 0;
   margin-bottom: 10px;
	clear:both;
}
#pied a {color: #fff;text-decoration: none;}
#pied a:visited {color: #ccc;}
#pied a:hover {color: #ff0;transition: transform .4s ease-out;-webkit-transition: color .4s ease-out;-moz-transition: color .4s ease-out;-o-transition: color .4s ease-out;text-decoration: underline;}
#pied a:focus {outline: thin dotted;color: #fa8;}
#pied a:hover, #pied a:active {outline: 0;}
#pied  h1 {
	text-align: center;
	font-weight: bold;
	font-size: 1.4em;
   color: #fff;
}
#pied div.colonne_du_pied {
   display: block;
	width: 266px;
	float: left;
	margin: 15px 0;
}
#pied div.colonne_du_pied hr {
	height: 1px;
	margin: 10px;
	padding: 0;
	color: #ccc;
	background-color: #ccc;
	border: 0;
	background-image: -webkit-linear-gradient(left, #333, #ccc, #333); 
	background-image:    -moz-linear-gradient(left, #333, #ccc, #333); 
	background-image:     -ms-linear-gradient(left, #333, #ccc, #333); 
	background-image:      -o-linear-gradient(left, #333, #ccc, #333);
}
#pied div.colonne_du_pied ul {
	list-style: none;
   font-size: 1.1em;
   color: #fff;
	margin: 0;
	padding: 0 50px;
}

/* ##################################################################
----------          bloc banniere horizontale              ----------
################################################################## */
#banniere_horizontale {
	display: block;
	height: 250px;
	width: 750px;
	margin: 10px auto 30px auto;
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
}
/* ##################################################################
----------            bloc banniere verticale              ----------
################################################################## */
#banniere_verticale {

	float: right;
	margin: 10px 20px 20px 0;
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
}
/* ##################################################################
----------            bloc banniere du_logo                ----------
################################################################## */
#banniere_du_logo {
	display: block;
	height: 146px;
	width: 256px;
	float: right;
	margin: 2px 20px 20px 0;
	border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
}
/* ##################################################################
----------                plan google maps                 ----------
################################################################## */
#google_maps {
	display: block;
	height: 550px;
	width: 750px;
	margin: 0 auto;
	opacity: 0.85;
   border:1px solid #333;
   border-radius:10px 10px 10px 10px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
}