@charset "utf-8";
/* FEUILLE de STYLE N°1 - Etoile du Berger */
/* Navigation toutes pages + Page d'accueil */

* { /* Réinitialisation des comportements par défaut de certains éléments : p, h1, ... */
	margin: 0;
	padding: 0; }
	
*a {
	position:relative;
	}

img { /* Enlève la bordure pour toutes les images (notamment pour celles représentant des liens) */
	border-width: 0;
	border-style: none;
  vertical-align: middle;  /* Permet d'éviter une marge de 4 pixels sous les images avec Chrome... */ }
/*behavior: url("pngbehavior.htc"); } /*Bidouille pour l'affichage des arrières-plans PNG transparents dans IE6 */

.bloc {
	display: block;  /* Pour les images des pages spéciales, pour éviter la marge de 4 pixels en dessous... */
}

body { /* Ensemble de la fenêtre de l'explorateur */
	background: #E8EDEE; /* Couleur entourant la page, lorsque la fenêtre est plus grande */
	margin: 10px 0 0 0; /* Marge (entre le bord de la fenêtre et le début de la "page") de 10 pixels en haut et en bas, 0 sur les côtés */
	padding: 0; /* Ecart entre le contenu de la page et le bord de la page */
	text-align: center; /* La page est centrée dans la fenêtre : ne marche pas pour Firefox */
	font-family: arial, helvetica, sans-serif; } 

#conteneur_principal { /* Ensemble de la page */
	width: 980px; /* Largeur totale de la page*/
	background: #FFF; /* Fond de la page */
	margin-left: auto;  /* Centrage de la page : ne marche pas sous IE */
  margin-right: auto;
	text-align:left; }

#banniere_haute { /* Bannière du haut... */
	height: 166px; } /* Hauteur réservée à la bannière haute */

#conteneur_secondaire { /* Partie principale de la page, entre les bannières du haut et du bas */
	position: relative;  /* Pour que le positionnement des éléments enfants se fasse par rapport à ce bloc */
	background: #FFF; /* Fond de la page */
	margin: 0;
	padding: 5px 5px; }

#menu_principal { /* Bloc du MENU de gauche */
	position: absolute;
	margin: 0;
	padding: 0; }
#menu_principal ul.largeur_1 {width: 230px; }
#menu_principal ul.largeur_2 {width: 290px; }
#menu_principal ul.largeur_3 {width: 250px; }
#menu_principal ul.largeur_4 {width: 300px; }
#menu_principal ul.largeur_5 {width: 270px; }
	
#menu_principal li { /* Lignes du MENU */
	text-align: left; 
	vertical-align: middle; 
	height: 21px; 
	margin: 0 0 2px 0;
	padding: 2px 0;
	list-style: none;
	font-size: 17px;
	font-weight: 600; }
	
#menu_principal li.ligne_blanche { /* Astuce pour que IE6 reviennent au blanc pour les images sous le menu */
	height: 0px;
	background-color: #FFFFFF; }

#menu_principal li.normal_1 {background: #E5F0DC; color: #005A92; } /* Ligne normale, non sélectionnée */
#menu_principal li.normal_2 {background: #C3DCAE; color: #005A92; } /* Ligne normale, sélectionnée */
#menu_principal li.valeur_1 {background: #E5F0DC; color: #D85A5A; } /* Ligne "produits", non sélectionnée */
#menu_principal li.valeur_2 {background: #C3DCAE; color: #D85A5A; } /* Ligne "produits", sélectionnée */
#menu_principal li.specia_1 {background: #C6D3D6; color: #005A92; } /* Ligne "espace Etoile", non sélectionnée */
#menu_principal li.specia_2 {background: #B0BBCC; color: #005A92; } /* Ligne "espace Etoile", sélectionnée */

#menu_principal li a {text-decoration:none; } /* Pas de soulignement, quel que soit le lien */
#menu_principal li.normal_1 a:link {color: #005A92; } /* Liens normaux + visités, hors "Produits" */
#menu_principal li.specia_1 a:link {color: #005A92; }
#menu_principal li.normal_1 a:visited {color: #005A92; }
#menu_principal li.specia_1 a:visited {color: #005A92; }
#menu_principal li.normal_1 a:hover {color: #4F7E92; } /* Liens survolés, hors "Produits" */
#menu_principal li.specia_1 a:hover {color: #4F7E92; }
#menu_principal li.valeur_1 a:link, a:visited {color: #BF2D2D; } /* Liens normaux + visités, catégories "Produits" */
#menu_principal li.valeur_1 a:hover {color: #D85A5A; } /* Liens survolés, catégories "Produits" */
#menu_principal li.normal_2 a:link {color: #005A92; } /* Liens normaux + visités, hors "Produits" */
#menu_principal li.normal_2 a:visited {color: #005A92; }
#menu_principal li.normal_2 a:hover {color: #4F7E92; } /* Liens survolés, hors "Produits" */

#menu_principal li.specia_2 a:link {color: #005A92; }  /* Cas des liens forcés... */
#menu_principal li.specia_2 a:visited {color: #005A92; }
#menu_principal li.specia_2 a:hover {color: #4F7E92; }

/* SOUS-MENUS */
#menu_principal li.soumen_1 {font-size: 15px; font-weight: 400; padding: 2px 0px; background: #F8FBF4; color: #005A92; } /* Ligne non sélectionnée */
#menu_principal li.soumen_2 {font-size: 15px; font-weight: 400; padding: 2px 0px; background: #F7DBDB; color: #005A92; } /* Ligne sélectionnée */

#menu_principal li.soumen_1 a:link {color: #005A92; } /* Liens normaux + visités */
#menu_principal li.soumen_1 a:visited {color: #005A92; }
#menu_principal li.soumen_1 a:hover {color: #D85A5A; } /* Liens survolés */
#menu_principal li.soumen_2 a:link {color: #005A92; } /* Liens normaux + visités */
#menu_principal li.soumen_2 a:visited {color: #005A92; }
#menu_principal li.soumen_2 a:hover {color: #D85A5A; } /* Liens survolés */

#menu_principal li.souspe_1 {font-size: 14px; font-weight: 400; padding: 2px 0px; background: #ECF1F2; color: #005A92; } /* Ligne non sélectionnée */
#menu_principal li.souspe_2 {font-size: 14px; font-weight: 400; padding: 2px 0px; background: #F7DBDB; color: #005A92; } /* Ligne sélectionnée */
#menu_principal li.souspe_3 {font-size: 14px; font-weight: 400; padding: 2px 0px; background: #ECF1F2; color: #BBB; } /* Ligne grisée */

#menu_principal li.souspe_1 a:link {color: #005A92; } /* Liens normaux + visités */
#menu_principal li.souspe_1 a:visited {color: #005A92; }
#menu_principal li.souspe_1 a:hover {color: #D85A5A; } /* Liens survolés */

#menu_principal li.souspe_2 a:link {color: #005A92; } /* Cas des liens forcés... */
#menu_principal li.souspe_2 a:visited {color: #005A92; }
#menu_principal li.souspe_2 a:hover {color: #D85A5A; } 

#visite { /* Carte de visite */
	position: absolute;
	top: 335px;
	left: 40px;
	padding: 0; }
	
#sous_menu_1 { /* Eléments sous le menu */
	text-align: center;
	width: 230px; /* Largeur définie nécessaire pour centrage sous FF */
	margin: auto; /* Pour centrage FF */
	padding: 20px 0; }

#corps_de_page { /* Partie HAUTE de la page (à droite du menu) */
	position: relative;
	text-align: center;
	/*min-height: 500px; */
}

#corps_de_page.etoile  { /* Cas de l'Espace ETOILE avec menu réduit... */
	min-height: 200px; }

/*
div.fond_1 { 
	background-image: url(../images/fond_1.png);
	background-repeat: no-repeat;
	background-position: right top; } */
	
div.largeur_1 {margin-left: 235px; width: 740px; } /* = 980 - 235 - 10 pixels de marge */
div.largeur_2 {margin-left: 295px; width: 680px; }
div.largeur_3 {margin-left: 255px; width: 715px; }
div.largeur_4 {margin-left: 305px; width: 665px; }
div.largeur_5 {margin-left: 275px; width: 695px; }

#corps_de_page_bas { /* Partie BASSE de la page (sous le menu) */
	margin: 5px 10px 10px 10px;
	background: #FFF; }

#banniere_basse {
	height: 33px; }	/* Hauteur réservée à la bannière basse */

#accueil_intro {
	position: relative;
	margin: 5px 0 0 0;
	height: 150px;
	font-size: 18px; 
	font-weight: normal; 
	font-style: italic; 
	line-height: 30px;
	color: #05355C;
	text-align: center;
	vertical-align: middle; }

.accueil_boutons {
	position: relative;
	text-align: left;
	height: 85px;
	padding: 3px 0 3px 0;
	background-image: url(../../images/fond_boutons_accueil.png)!important; 
	background-image: url(../no-image); /* Correctif IE5.5 et IE6 pour transparence PNG... Ligne non lue par les navigateurs "normaux" */
	background-repeat: no-repeat;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/fond_boutons_accueil.png', sizingMethod='scale'); /* Correctif IE5.5 et IE6 */
	background-position: left;
	border: 1px dotted #666; }

.boutons_gauche {  /* 15 275 0 60 lorsque répartition droite-gauche */
	margin: 15px 255px 0 40px; }

.boutons_droite {
	margin: 15px 55px 0 240px; }
	
.texte_boutons {
	position: absolute;
	top: 16px;
	left: 130px;
	width: 300px; }
	
.texte_boutons p.item_bouton_index_1 {
	position: relative;
	font-size: 20px; 
	font-weight: normal; 
	color: #005A92;
	line-height: 32px; }
	
.texte_boutons p.item_bouton_index_2 {
	position: relative;
	font-size: 14px; 
	font-weight: 500; 
	font-style: italic; 
	color: #7AAB4E; 
	line-height: 24px; }

.accueil_boutons a {
	text-decoration: none; }

.accueil_boutons a img {
	border: none; }

#mise_jour { /* Ligne de mise à jour */
	text-align: center;
	font-size: 12px;
	color: #999999;
	font-weight: normal;
	padding: 10px 0; }

p.construction { /* Page en CONSTRUCTION */
	font-family: Trebuchet MS, Arial, Helvetica, Sans-serif;
	color: #336699;
	font-size: 1.1em;
	padding: 0.5em;
	text-align: center; }

img.construction { /* Page en CONSTRUCTION */
	text-align: center;
	margin: auto;
	display: block; }

div.page_speciale {
	text-align: center;
	width: 800px;
	margin: 20px auto 0 auto;
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25);
}

#images_bas_page { /* Bannière bulletin, en bas de page */
	position: relative;
	text-align: left;
	margin: 20px 15px 20px 30px; }
	
#images_droite { /* Images à droite de la page */
	position: absolute;
	top: 169px;
	left: 513px;
	padding: 0;  }

#images_gauche { /* Image sous les menus */
	position: absolute;
	top: 335px;
	left: 23px;
	padding: 0; }

img.menu_rond_gauche { /* Arrondis du menu */
  float: left; }

img.menu_rond_droite { /* Arrondis du menu */
  float: right; }

div#carousel {
	display: block;
	position: relative;
	width: 626px; /* Largeur définie nécessaire pour centrage sous FF */
	height: 122px;
	margin: auto; /* Pour centrage FF */
	margin-bottom: 5px;
	margin-top: 15px;
	padding: 0; }

/**************************************************************/
/***  Cadre TRIPLE, en bas de page d'Accueil  *****************/
/**************************************************************/

div.cadre_triple {  /* Zone des trois cadres, en bas de page d'Accueil... */
	margin-top: 10px;
	margin-bottom: 15px;
	height: 220px;  /* Nécessaire pour que la suite reste à sa place... */
}

.cadre_triple .cadre {
	float: left;  /* Alignement, plus "propre" qu'avec 'text-align'... */
	width: 320px;
}

.cadre_triple .accueil_infos {
	background: url(../../images/cadre_infos_prov.png) top center no-repeat;
	height: 220px;  /* Sinon ne s'affiche pas correctement... */
}
