/* CSS Document */
/* CSS Document */
body,td,th {
	font-family: Bookman Old Style;
	font-size: 12px;
}
body {
	
	background-image: url(../image/fond.jpg); /* mon image de fond du livre d'or */
    background-attachment: fixed; /* Fixera l'image  */
	font-family: Bookman Old Style;
	font-size: 1em;
	margin: auto; /* Pour centrer notre page */
	margin-top: 5px; /* créer un ecart avec le haut de la fenêtre du navigateur.  */
	margin-bottom: 20px;    /* Pareil pour en bas */
	width: 800px;
	cursor: url(../../astuces-informatiques/css/moncurseur.cur) auto; 
	}
	
.imageflottante {
   float: left;
}

#table {
		width: 180px;
		margin-left: 20px;
		float: left;
		margin-top: 5px;
}
#table1 {
	width: auto;
	margin-left: 10%;
	margin-right: 10%;
	font-size: 13px;
	color: #990000;
	font-weight: bold;
	text-align: left;
}

#Haut/* l'include pour la page droite.php3 */
{
	height: 93px;
	width: 800px;
	margin-left: auto;margin-right: auto;
	margin-top: -5px;
}
.mot{  background-color:#660033; color: #FFCC99; } 


#logo{
	border: none;
}
#total{
	border: medium dotted #999900;
}

#contenu2 /* l'include pour la page Bord_gauche.php3 */
{
	background: url(../image/logo-cuisine.gif); /* mettre a gauche */
	background-repeat: repeat-y; /* taille image */
	height: 100%;
	background-position: left;
	margin-bottom: -18px;
	text-align: center;
}

#contenu/* l'include pour la page droite.php3 */
{
background: url(../image/logo-cuisine.gif);
   background-position: right; /* mettre a droite*/
   background-repeat: repeat-y;
   /*width: 60px; /* taille de l'image */ 
 height  : 100%;
 margin-bottom: -18px;
}
fieldset{
	border: none;
}

h1 {
	font-size: 16px;
	color: #660000;
	text-transform: uppercase;
	text-align: center;
}

/* LA BALISE UL *
 * ------------ *
 * La balise UL va servir de conteneur global pour le menu 
 * NOTE : Dans le cadre de ce menu, les balises LI ne nous servent
 *        a rien, elle ne seront donc pas redefinie
 */
 ul {
	/* La balise est déclaré en position "relative" afin que les futurs balises A
  * utilisent la balise UL comme point de repère de leurs propres coordonnés absolus
  * NOTE : la position "relative" est preférée a la position "absolute" afin 
  *        de conserver le menu dans le flux HTML
  */
  position:relative;
	/* On supprime les puces pour les elements LI de la balise */
  list-style:none;
	/* On s'assure qu'il n'y aura aucun décalage autour du menu
  * NOTE : il faut définir le padding ET le margin car dans le cadre des listes à
  *        puces. Les différents navigateurs utilisent l'une ou l'autre des valeurs
  *        pour afficher les puces et assurer les retraits des elements.
  */
	padding: 0px;
	margin: 0px;
	/* On définie la largeur et la hauteur de la balise en fonction des dimensions de l'image de fond	*/
	width:800px;
	height:130px;
}


/** LA BALISE A **
 * ------------- *
 * La balise A va nous permettre de définir les attributs communs à chaque element du menu 
 */
ul a {
 /* La balise est déclarée en position "absolute" afin de pouvoir positionner nos elements
  * de menu au pixel près à l'interieur de la balise UL.
  */
  position:absolute;
	margin: auto;
 /* En temps normal, la balise A est une balise "inline". Pour les besoin de ce menu, nous
  * la transformons en balise "block"
  */
  display:block;
	
 /* Quoi qu'il arrive, les balises A auront toutes une hauteur de base de 29px et une largeur de base de 80px
  * NOTE : Cette hauteur dépend de l'image de fond qui sera utilisée.
  */
  width:100px;
  height:40px;
	
 /* On supprime le soulignement par défaut des liens */
  text-decoration:none;
	
 /* On definie les valeurs typographiques du texte de la balise */
  font: bold 13px Helvetica,sans-serif;
  text-transform: uppercase;
  color:#660000;
}


/** LA PSEUDO-CLASS :hover **
 * ------------------------ *
 * La pseudo-class :hover va nous permettre de définir les attributs communs à chaque balise A 
 * survolée par la souris
 * NOTE : IE comprend la pseudo-class :hover uniquement lorsqu'elle est appliquée a la balise A
 */
ul a:hover{
 /* On redéfinie les attributs de la police typographique */
  font-size:18px;
  color:#660000;
	
 /* On modifie la largeur et la hauteur de la balise 
  * NOTE : Cette largeur dépend de l'image de fond utilisée.
  */
  width:180px;
  height:50px;
}


/** LE CAS PAR CAS **
 * ---------------- *
 * Les modifications globals de balises etant définies, nous allons maintenant nous attaquer
 * aux cas particuliers grace à l'utilisation des identifiants uniques de classes
 * NOTE : Tous les identifiants suivant sont appliqués à des balises A, ils héritent donc tous des
 *        comportements definis ci-dessus pour la balise A et pour la pseudo-classe associée :hover
 */

#entree {
 /* Cet element de menu sera placé à 60px du bord haut de son conteneur : la balise UL */
  top: 60px;
	
 /* Cet element de menu sera placé à 42px du bord gauche de son conteneur : la balise UL */
  left: 42px;
	
 /* Le texte sera décallé de 10px vers le bas et de 10px vers la droite tout en laissant 
  * apparaitre le background de la balise 
  * NOTE : La syntaxe courte de padding dans l'ordre est : 
  *        padding: padding-top padding-right padding-bottom padding-left
  */
  padding: 10px 0px 0px 10px;
	

}

#entree:hover {
 /* Lors du survol de la balise, la portion de background visible sera plus importante, on modifie donc
  * la proriété top et left de la balise
  */
  top:57px;
  left:30px;
	
 /* La taille du texte et de l'image de fond etant différant, il faut modifier le décalage du texte */
	padding: 14px 0px 0px 15px;
	
 /* Dans le cas spécifique de cet element de menu, la largeur est inférieur à celle normalement prévue */
  width:150px;
 /* On redéfinie le background de la balise */
	background: url(image/quiches.gif);
	background-repeat: no-repeat;

}

/* Il ne reste plus qu'à répéter ces opérations pour chaque element de menu individuel */

#plat {
	top:30px;
	left:250px;
	padding: 7px 0px 0px 34px;

}

#plat:hover {
	top:25px;
	left:250px;
	padding: 10px 0px 0px 48px;
	background: url(image/plat.gif);
	background-repeat: no-repeat;

}

#dessert {
	top:70px;
	left:470px;
	padding: 7px 0px 0px 34px;

}

#dessert:hover {
	top:80px;
	left:460px;
	padding: 9px 0px 0px 42px;
	background: url(image/dessert.gif);
	background-repeat: no-repeat;

}

#poisson {
	top:15px;
	left:540px;
	padding: 7px 0px 0px 40px;

}

#poisson:hover {
	top:10px;
	left:550px;
	padding: 9px 0px 0px 45px;
	width:125px;
	background: url(image/poisson.gif);
	background-repeat: no-repeat;

}
a:visited {
	color: #660000;
}
a:hover {
	color: #990000;
}
a:active {
	color: #FF9900;
}
a:link {
	color: #993300;
}
hr
{
	width: 60%;
	color: #FF9900; /* couleur trait horizontal */
	height: 3px;
}