/* ==============================================
   FEUILLE DE STYLES DES GABARITS HTML/CSS --- 10
   ? Elephorm & Alsacreations.com
   Conditions d'utilisation:
   http://creativecommons.org/licenses/by/2.0/fr/
   ============================================== */


/* --- COULEURS --- */

/* Note: vous pouvez modifier simplement l'aspect de ce gabarit en modifiant
   uniquement les couleurs de fond (propri?t?s background) et les couleurs
   du texte (propri?t? color).
   Pour modifier la disposition des blocs, voir plus bas dans la feuille de
   styles la partie ?positionnement?. */

/* G?n?ral */
body {
	background-image:url(../img/fond.png);
	background-repeat:repeat-x;
	background-color:#9ACD32;
}
a {
	color: #edffd9;
}
a:hover, a:focus {
	color: #FFAE80;
}
strong {
	color: #A1B55D;
}
br {
color: #363B29;
}
.span {
}
#centre {
	background: url(../img/fond_centre.png) repeat-y;
}
/* Global */
#global {
	 /*border-right: 20px solid #004040	; Voir -> Note 1 ci-dessous */
	color: #F0E39E;
	background-color: #f0f8ff; /* -> 1 */
}

/* En-tête */
#entete {
	background: #004040	;
/* 	background-image:url(../img/header.png);
	background-repeat: no-repeat; */
}
#entete a:hover {
/* 	background: #000000;
	color:#a52a2a; */
}

#menu {
	background: #004040	;
	color:black;
	background-image:url(../img/fond_menu1.png);
	background-repeat: x-repeat;
}
#menu a {
	color: #edffd9;
}
#menu a:hover, #menu a:focus {
	color:#6E5122;
	background:YellowGreen;
	background-image:url(../img/fond_menu2.png);
	background-repeat: x-repeat;
}
#menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
#menu li {
	display: inline; /* -> 3 */
}
#menu a {
	padding: 6px;
	line-height: 1.5;
	font-size: .9em;
	text-decoration: none;
}

/* Navigation */
#navigation {
	background: #9ACD32;
}
#navigation a {
	color: #edffd9;
	background:#228B22;
	border-bottom:1px solid #9ACD32;
}
#navigation a:hover, #navigation a:focus {
	color:#6E5122;
	background:#9ACD32;
}
#navigation a.selected{
	color:#6E5122;
	background:#9ACD32;
}
/* Contenu principal */
#contenu {
	color: #363B29;
	/*background: url(img/06-coin.png) no-repeat left top;*/
}
#contenu a {
	color: #332510;
}
#contenu a:hover, #contenu a:focus {
	color: #6E5122;
}
#contenu strong {
	color: #181A12;
}
#contenu img{
	border: 3px solid #004040;
}
#contenu img:hover {
	border: 3px solid YellowGreen;
}
.intitule {
	color: #004040;
	font-size:1em;
}
.texte{
	font-size:1.1em;
	color: Olive;
}
.titre{
	font-size:2em;
	color: Olive;
	font-weight:bold;
}
#copyright {
	color: white;
	vertical-align: top;
}
/* --- POSITIONNEMENT --- */

/* Page */
body {
	padding: 0px 10px 0 10px;
}
#global {
	width: 1024px;
	margin-left: auto;
	margin-right: auto;
}

/* En-t?te */
#entete {
	padding-bottom: 40px;
	height:110px;
}
#entete div form {
	padding-top:20px;
}
#entete h1 {
	margin: 0;
}
#entete h1 img {
	float: left;
	margin: 7px 20px 10px 0;
}
#entete .sous-titre {
	margin: 4px 0 15px 0;
}

#menu {
	padding-left:180px;
	height:25px;
	font-weight:bold;
}

/* Bloc central */
#centre {
	width: 100%;
	overflow: hidden;
	min-height:600px;
}

/* Menu de navigation */
#navigation {
	width: 198px;
	float: left; /* -> 5 */
}
#navigation ul {
	margin: 0;
	padding: 20px 10px;
	list-style: none;
}
#navigation a {
	display: block;
	height: 1%; /* -> 6 */
	padding: 3px 0px 0px 5px;
	line-height: 1.5;
	font-size: .9em;
	text-decoration: none;
	font-family: "Times New Roman",Verdana, "Bitstream Vera Sans", "Lucida Grande", sans-serif; /* 3 */
}

/* Contenu principal */
#principal {
	float: left;
	width: 802px;
	padding-left:20px;
}
#principal > :first-child {
}
#principal p, #principal li {
	line-height: 1.5;
}

/* Contenu secondaire */
#secondaire {
	margin-left: 1000px;
	margin-right: 0px;
}
#contenu {
	margin-top: 20px;
}
/* Pied de page */
#pied {
	margin-top:0px;
}

/* Mention de copyright */
#copyright {
	font-size: 1em;
	text-align: center;
	background: #004040	;
	background-image:url(../img/fond_menu.png);
	background-repeat: x-repeat;
}
.illustration {
	float: left;
	width: 350px; /* important */
	height:450px;
	border-collapse: collapse; /* cosm?tique */
	text-align:center;
	overflow:auto;
	margin-left:10px;
	margin-bottom:10px;
}
.illustration td {
	padding: 5px; /* cosm?tique */
	vertical-align : top;
	padding: 5px; /* cosm?tique */
	vertical-align : top;

}
.illustration td:hover {
	padding: 5px; /* cosm?tique */
	vertical-align : top;
	background-color : #D9FFB2; 
}
.illustration2 {
	float: left;
	width: 230px; /* important */
	height:150px;
	border-collapse: collapse; /* cosm?tique */
	text-align:center;
}
.illustration2 td {
	padding: 5px; /* cosm?tique */
	vertical-align : top;
	/*padding: 5px; /* cosm?tique */
	vertical-align : top;
}
.illustration2 td:hover {
	padding: 5px;  /*cosm?tique */
	vertical-align : top;
	background-color : #D9FFB2; 
}

.loupe {
width:35px;
height:28px;
background: url(../img/icone-loupe-blanc.png) no-repeat center center;
border: none;
}

/* slider specific CSS */
.sliderGallery {
overflow: hidden;
position: relative;
padding: 10px;
height: 140px;
width: 320px;
}

.sliderGallery UL {
position: absolute;
list-style: none;
overflow: none;
white-space: nowrap;
padding: 0;
margin: 0;
}

.sliderGallery UL LI {
display: inline;
}
.sliderGallery2{
overflow: hidden;
position: relative;
padding: 10px;
height: 140px;
width: 320px;
}

.sliderGallery2 UL {
position: absolute;
list-style: none;
overflow: none;
white-space: nowrap;
padding: 0;
margin: 0;
}

.sliderGallery2 UL LI {
display: inline;
}
.sliderGallery3 {
overflow: hidden;
position: relative;
padding: 10px;
height: 140px;
width: 320px;
}

.sliderGallery3 UL {
position: absolute;
list-style: none;
overflow: none;
white-space: nowrap;
padding: 0;
margin: 0;
}

.sliderGallery3 UL LI {
display: inline;
}
.sliderGallery4 {
overflow: hidden;
position: relative;
padding: 10px;
height: 140px;
width: 320px;
}

.sliderGallery4 UL {
position: absolute;
list-style: none;
overflow: none;
white-space: nowrap;
padding: 0;
margin: 0;
}

.sliderGallery4 UL LI {
display: inline;
}

.sliderGallery5 {
overflow: hidden;
position: relative;
padding: 10px;
height: 140px;
width: 320px;
}

.sliderGallery5 UL {
position: absolute;
list-style: none;
overflow: none;
white-space: nowrap;
padding: 0;
margin: 0;
}

.sliderGallery5 UL LI {
display: inline;
}


.slider {
width: 296px;
height: 17px;
margin-top: 120px;
margin-left: 5px;
padding: 1px;
position: relative;
background: url(../img/productbrowser_scrollbar_20070622.png) no-repeat;
}

.handle {
position: absolute;
cursor: move;
height: 17px;
width: 181px;
top: 0;
background: url(../img/productbrowser_scroller_20080115.png) no-repeat;
z-index: 100;
}

.slider span {
color: #bbb;
font-size: 80%;
cursor: pointer;
position: absolute;
z-index: 110;
top: 3px;
}

.slider .slider-lbl1 {
left: 50px;
}

.slider .slider-lbl2 {
left: 107px;
}

.slider .slider-lbl3 {
left: 156px;
}

.slider .slider-lbl4 {
left: 280px;
}

.slider .slider-lbl5 {
left: 455px;
}

input {
background-color:#f0f8ff;
}
#contenu input {
background-color: white;
}
.disclaimer {
	font-size:small ;
}



/* 
* ajouté par Zazou 
*/
#search_nav {
	background:#F0F8FF;
	padding:2px 0px 16px 6px;
	color:olive;
	-moz-border-radius: 0px 0px 0px 26px;  
	-webkit-border-radius: 0px 0px 0px 26px;  
	-khtml-border-radius: 0px 0px 0px 26px  
	border-radius: 0px 0px 0px 26px;	
}

/* contenu de l'info-bulle Retour vers l'accueil avec lien sur l'image de Tramil
dans l'entête (partie gauche) => http://dypso.free.fr/tech/css_infobulle.php */
a.lien_retour_accueil span{	display: none	}
a.lien_retour_accueil:hover span{ 
/*le contenu de la balise span ne 
sera visible que pour l'état a:hover */
	display:block;
	top:3em; left:2em; width:10em;
	background-color:#eeeeee; color:#6699cc;
	text-align: center;
	text-decoration:none;
	font-weight:none;
	padding:1px;
}
a.lien_retour_accueil{
	width:150px; height:148px;
	display:block;
}
/*
* fin Zazou
*/