/*Design du fichier Page_Accueil.html*/

/*************Corps de la page*************/
/*************************************/

body
{
	width: 1000px; /* Pour centrer notre page */
	margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
	margin-bottom: 20px;    /* Idem pour le bas du navigateur */
	background-image: url("../images/fond.png"); /* Une petite image de fond pour éviter d'avoir un vieux fond blanc :p */
	margin-right: auto;
	margin-left: auto;
}


/***************L'en-tête***************/
/*************************************/

#en_tete
{
   width: 1000px;
   height: 100px;
   background-image: url("../images/banniereolympicmontdor.png");
   border: 2px solid #007dff; /* Style de bordure */
   background-repeat: no-repeat;
   margin-bottom: none;
}

.publicite
{
   float: right;
   margin-top: 1%;
   margin-right:1%;
}


/***********Inscription newsletter**********/
/*************************************/

#inscription
{
	float: right;
    height: 60px;
	padding: 2% 0 0 0
}

#inscription li 
{
	list-style: none;
	border: none;
}

#inscription li img
{
	float: right;
	border: none;
}

#inscription li a 
{
	display : block;
	width : 130px;
	height : 30px;  /* la moitié de la hauteur totale de l'image */
	background : url(../images/menuhorizontal.png) left top no-repeat;
	font-family: "Trebuchet MS", Arial, "Times New Roman", serif;
	font-weight: bolder;
	color: #B3B3B3;
	text-decoration : none;
	border: none;
	text-align: center;
}

#inscription li a:hover
{
	color : #651000;
}


/************Le menu horizontal************/
/*************************************/

#menu_horizontal
{
	float: left;
	width: 80%;
    height: 60px;
	/*margin-left: 4%;*/
    padding: 2% 0 0 0;
}

#menu_horizontal li 
{ 
	float: left;
	list-style: none;
	margin-right:2%;
	border:none;
}

#menu_horizontal li img
{ 
	float:left;
	border:none;
}

#menu_horizontal li a 
{
	display : block;
	width : 130px;
	height : 30px;  /* la moitié de la hauteur totale de l'image */
	background : url(../images/menuhorizontal.png) left top no-repeat;
	font-family: "Trebuchet MS", Arial, "Times New Roman", serif;
	font-weight:bolder;
	color: #B3B3B3;
	text-decoration : none;
	border:none;
	text-align:center;
}

#menu_horizontal li a:hover
{
	color : #651000;
}


/****************Le menu****************/
/*************************************/

#menu
{
	float:left;
	width:150px;
}

.element_menu 
{
    width:150px;
}
                        
.hg 
{
    width: 15px;
    height: 57px;
}
    
.haut 
{
    margin-top: 0px;
	width: 130px;
    height: 57px;
}
 
.contenu 
{
    width: 145px;
	background-image: url(../images/contenu.png);
	margin-bottom:20px;
}

.contenu  ul
{
	list-style-image: url(../images/puce.png); /* On change l'apparence des puces */
	padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
	padding-left: 30px; /* ... mais on modifie ensuite la marge de gauche, donc celle-là fera finalement 20 pixels */
	margin: 0px; /* Idem pour margin, ça nous évite d'avoir à en écrire 4 (margin-left, margin-right...) */
	margin-bottom: 5px; /* Même chose que tout à l'heure, on modifie ensuite juste margin-bottom, mais tous les autres sont à 0px */
}

.contenu li  /*Tous le texte  des menus */
{   
   color: #B3B3B3;
   font-family: "Trebuchet MS", Arial, "Times New Roman", serif;
   text-align: none;
   font-size: 0.8em;
}

.contenu a
{
	color: #B3B3B3;
}

.contenu a:hover
{
	background-color: #a0c1da;
	color: #8d3835;
}

.element_menu div /* S'apllique à tous les divs de .cadre_arrondi */
{ 
	float: left; 
}
 
.hg, .gauche, .bg   /* Pour passer outre le float des blocs précédents */
{
	clear: left;
}

.hg 
{ 
	background-image: url(../images/haut_gauche.png); 
}

.bg 
{ 
	background-image: url(../images/bas_gauche.png); 
}

.haut 
{   
	color: #B3B3B3;
	font-family: "Trebuchet MS", Arial, "Times New Roman", serif;
	text-align: center; 
	background-image: url(../images/haut.png); 
}

.haut h3
{
	color: #B3B3B3;
	font-family: "Trebuchet MS", Arial, "Times New Roman", serif;
	text-align: center;
	text-decoration:none;
	margin-top: 5px;
}

.haut h3 a
{
	color: #B3B3B3;
	font-family: "Trebuchet MS", Arial, "Times New Roman", serif;
	text-align: center;
	text-decoration:none;
}

.bas 
{ 
	background-image: url(../images/bas.png); 
}

.gauche 
{
	background-image: url(../images/gauche.png); 
}


/**************Corps du site**************/
/*************************************/

#corps
{
	float:left;
	width: 825px;
	margin-left: 1%; /* Une marge à gauche pour pousser le corps, afin qu'il ne passe plus sous le menu */
	margin-bottom: 50px; /* Ca c'est pour éviter que le corps colle trop au pied de page en-dessous */
	min-height:760px;
	padding: 5px; /* Pour éviter que le texte à l'intérieur du corps ne colle trop à la bordure */
	font-family: "Trebuchet MS", Arial, "Times New Roman", serif;
	text-align:justify;
	overflow:auto;
	color: #B3B3B3;
	background-color: #5B5B5B; /* Une couleur de fond pour le corps */
	background-image: url("../images/motif2.png");
	background-repeat: repeat-x; /* Une petite image de fond qui se répètera horizontalement en haut */
	border: 2px solid #007dff; /* Style de bordure */
	position: relative;
}

#corps h1 /* Tous les titres h1 du corps */
{
   color: #8d3835;
   text-align: center;
   font-family: "Trebuchet MS", Arial, "Times New Roman", serif;
   font-size: 1em;
   font-weight: bolder;
   text-transform:uppercase;
}

.introduction h2
{
   color: #B3B3B3;
   font-weight:bolder;
   font-size:20px;
   height: 30px;
   background-image: url("../images/titre.png"); /* Une petite image de fond sur les titres h2 */
   background-repeat: no-repeat; /* L'image ne se répètera pas, elle sera à gauche du titre */
   padding-left: 30px;
   text-align: left;

}

.introduction
{
   float:left;
   width:825px;
   font-size:12px;
}

.introduction p /* Tous les paragraphes p du corps */
{
   max-height:500px;
   overflow: auto;

   color: #B3B3B3;
   text-align: justify;
}

.imagepresentation img /* Toutes les images img du corps */
{
   margin-left: 100px;
   margin-right: 100px;
   border: 2px solid #007dff; /* Style de bordure */
}

#corps form p /*Tous les paragraphes p du corps*/
{
   max-height:695px;
   overflow: auto;
   color: #B3B3B3;
   text-align: center;
   margin-top: 40px;
   margin-left: 20px;
   margin-right: 100px;
}


/*********Formulaire d'inscription***********/
/*************************************/

#formulaire_inscription
{
	color: #556dff;
	width: 500px;
	margin: 5% 0 0 3%;
	padding: 2% 2% 2% 2%;
	font-size: 12px;
	float:left;
}


/****************Page up****************/
/*************************************/

#page_up
{
	float:left;
	font-family: "Trebuchet MS", Arial, "Times New Roman", serif;
	font-size:12px;	
}


/*************Le pied de page*************/
/*************************************/

#pied_de_page
{
	float:left;
	width:1000px;
	padding-bottom: 5px;

	text-align: center;

	color: #8d3835;
	background-color: #626262;
	background-image: url("../images/motif2.png");
	background-repeat: repeat;
   
	font-family: "Trebuchet MS", Arial, "Times New Roman", serif;
	font-weight: bolder;
   
	border: 2px solid #007dff; /* Style de bordure */
}

#pied_de_page a
{
   text-decoration: none; /* Les liens ne seront plus soulignés */
   color: #B3B3B3;
   font-style: italic; /* Les liens seront en italique (pourquoi pas ?) */
}

#pied_de_page a:hover
{
   text-decoration: none; /* Les liens ne seront plus soulignés */
   background-color: #B3B3B3;
   color: black;
   font-style: italic; /* Les liens seront en italique (pourquoi pas ?) */
}

#pied_de_page p
{
	text-align:left;
	color:black;
	font-size:0.6em;
}#MDS09 {
	margin-right: 360px;
	margin-left: 30px;
	float: left;
	overflow: visible;
	visibility: visible;
}
}#MDS2010 {
	margin-right: 360px;
	margin-left: 30px;
	float: left;
	overflow: visible;
	visibility: visible;
}
.afficheMDS09 {
	text-align: center;
}

}
.afficheMDS2010 {
	text-align: center;
}
#formcompetiteur {
	background-color: #89E300;
	border-top-style: groove;
	border-right-style: groove;
	border-bottom-style: groove;
	border-left-style: groove;
	font-family: "Trebuchet MS", Arial, "Times New Roman", serif;
	width: 550px;
}
#coureursMDS09 {
	text-decoration: none;
}
.afficheOPA09 a img {
	position: absolute;
	width: 325px;
	float: none;
	clear: right;
	overflow: visible;
	visibility: visible;
	clip: rect(auto,auto,auto,auto);
	left: 493px;
	top: 67px;
	margin: 0px;
	padding: 0px;
}

