html {
   font-size: 16px;
   font-family :  Arial, Helvetica, Verdana; 
}

body {
   border: 0px;
   padding: 20px 0px 0px 0px;
   margin: 0px;
/*   background-image: url("Degrade_bleu.jpg");  */
/*   background-repeat: repeat-x; */  
/*   background-color: #FFFF00; */
   text-align: center;   
} 

#centrage_ecran{
   position: relative;
   width: 100%;
   margin: 0 auto;
   text-align: left;
}

#logo {
   position: absolute;
   left: 5px;
   top: 0px;
   width: 238px;
   height: 220px;
   z-index: 2;
   text-align: center;
}

#en_tete {
   position: absolute;
   left: 290px;
   top: 0px;
   width: 70%;
   height: 200px;
   z-index: 3;
}

#coordonnees {
   float: right;
   width: 175px;
   height: 60px;
   border: 1px solid gray;
   z-index: 4;
   margin-top: 30px;
   margin-left: 90%;
   margin-right: 30px;
}

#menu {
   position: absolute;
   left: 290px;
   top: 60px;
   width: 70%;
   height: 100px;
   z-index: 5;
}

#corps {
   padding-top: 130px;
   width: 95%;
   background-color: DDDD00;
   z-index: 5;
}

/#corps_pos {
   left: 2%;
   width: 97%;
}
   
#pied_de_page {
   float: left;
   width: 100%;
   margin-top: 10px;
   z-index: 1;
}

#logotrad {
   float: left;
   width: 24px;
   height: 22px;
   margin: 5px;
   z-index: 2;
}

p{
   border: 0px;
   padding: 0px;
   margin: 15px;
   font-size : 100%; 
   color : black;
}

ul{
   font-weight: normal;
   font-size : 100%; 
   color : black;
   text-align: justify;
}

li {
   font-size : 100%; 
   color : black; 
   text-align: justify;
}

h1 {
   border: 0px;
   padding: 0px;
   margin: 0px;
   font-size : 160%; 
   color : #404040; 
   text-align: center;
}

h2 {
   font-size : 140%; 
   color : #01447f; 
   padding-left: 15px;
   padding-top: 5px;
}

h3 {
   font-size : 125%; 
   color : #0069b4; 
   padding-left:25px;
}

th {
   background-color : #c2c2c2;
}

td {
   border: 1px solid #000000;
}

a:link {color: #01447f; text-decoration:underline;}
a:visited {color: #0069b4; text-decoration:underline;}
a:hover {color:orange; text-decoration:none;}

a.lien_gris:link {color: #e0e0e0; text-decoration:underline;}
a.lien_gris:visited {color: #c0c0c0; text-decoration:underline;}
a.lien_gris:hover{color: orange; text-decoration:underline;}

a.lien_bleu:link {color: #b0b0b0; text-decoration:underline;}
a.lien_bleu:visited {color: #404040; text-decoration:underline;}
a.lien_bleu:hover{color: orange; text-decoration:underline;}

.titre {
   width: 100%;
}

.slogan {
   border: 0px;
   padding: 0px;
   margin: 0px;
   font-size : 70%; 
   font-style: italic;
   text-align: left;
}

.langues {
   border: 0px;
   padding: 0px;
   margin: 0px;
   position: absolute;
   top: 92px;
   right: 157px;
   height: 30px;
   width: 265px;
   font-size : 130%; 
   font-style: bold, underline;
   color : #404040; 
   text-align: right;
}

.bord_gauche {
   position: absolute;
   left: 696px;
   top: 137px;
   width: 34px;
   height: 30px;
}

.titre-menu {
   width: 100%;
   height: 20px;
   border-top: 1px solid gray;
   border-left: 1px solid gray;
   border-right: 1px solid gray;
   padding-top: 10px;
   background-color: #FFFFFF;
   text-align: center;
}

.ligne-menu {
   border: 0px;
   padding: 0px;
   margin: 8px;
   font-size : 100%; 
   color : black;
}

.boutons-menu  {
   width: 100%;
   height: 30px;
   border: 1px solid gray;
   background-color: #FFFFFF;
   text-align: center;
   vertical-align: middle;
   font-size : 80%; 
   color : black; 
}

.coord  {
   float: left;
   width: 100%;
   height: 60%;
   background-color: #FFFFFF;
   text-align: left;
   vertical-align: middle;
   font-size : 70%; 
   color : black; 
   text-align: center;
}

.text {
   text-align: justify;
}

.outils{
   font-weight: bold;
   padding-top: 10px;
   padding-bottom: 10px;
}

.client{
   font-style: italic;
   text-align: right;
   padding-top: 2px;
   padding-bottom: 25px;
}

.presentation_jeux_pair {
   float:left;
   margin: 10px;
   border: 2px solid #000000;
   padding: 20 px;
   width: 400px;
   height: 500px;
   background-color: white;
}

.presentation_jeux_impair {
   float:left;
   margin: 10px;
   border: 2px solid #000000;
   padding: 20 px;
   width: 400px;
   height: 500px;
   background-color: #d9d9d9;
}

.nom_jeu {
   font-size: 140%;
   font-weight: bold;
}

.nouveau {
   color: red;
   font-weight: bold;
}

.rubrique {
   font-weight: bold;
}

.retour {
clear: left;
}

.renvois_jeux {
   width: 20%;
   margin-top: 15px;
   padding-left: 30px;
   font-size: 100%;
   font-weight: bold;
   float: left;
}

.infos_jeux {
   width: 75%;
   margin-top: 15px;
   font-size: 100%;
   padding-left: 15px;
   vertical-align: top;
   float: left;
}

.centrage_col {
   height: 285px;
   width: 785px;
   text-align: center;
   margin-left: auto;
   margin-right: auto;
}

.col1 {
   height: 280px;
   width: 235px;
   border: 1px solid black;
   float: left;
}

.col2  {
   height: 280px;
   width: 235px;
   border: 1px solid black;
   float: left;
   margin-left: 10px;
}

.col3 {
   height: 280px;
   width: 240px;
   float: left;
   margin-left: 10px;
   margin-top: 25px;
}

.legende {
   margin-top: 25px;
   margin-bottom: 25px;
}

#bloc_vert {
   height: 30px;
   width: 30px;
   background-color: #b5f1d4;
   float: left;
}

#bloc_jaune {
   height: 30px;
   width: 30px;
   background-color: #fbf663;
   float: left;
}

#bloc_rouge {
   height: 30px;
   width: 30px;
   background-color: #f67c7c;
   float: left;
}

.texte_legende {
   font-size: 80%;
   text-align: left;
   margin-left: 50px;
}

.nbre_mots {
color: black;
font-weight: normal;
font-size: 90%;
}

.type_travail {
color: #404040;
font-weight: bold;
font-size: 115%;
}

.fra {
color: #0070FF;
}

.eng {
color: navy;
}

.esp {
color: #F05000;
}

.engesp {
color: black;
}

.eng1 {
color: black;
}

.esp1 {
color: black;
}

label {
	margin-top: 20px;
	display:block;
}

#nom {
   vertical-align: top;
   margin-left: 50px;
   width: 150px;
}

#email {
   vertical-align: top;
   margin-left: 50px;
   width: 200px;
}

#objet {
   vertical-align: top;
   margin-left: 50px;
   width: 250px;
}

#message {
   vertical-align: top;
   margin-left: 50px;
}

#fichier {
   vertical-align: top;
   margin-left: 50px;
}

#submit {
   margin-left: 50px;
   width: 74px;
   height: 24px;
}

#verif {
   display: none;
}

.focus {
   background-color: #f67c7c;
}

.petit {
   font-size: 80%;
}

.alerte {
   font-weight: bold;
}

.infos {
   font-size: 70%;
   text-align: left;
   color: black;
}
/* + -----------------------------------------------------
	Styles appliqués au Calendrier
+ ----------------------------------------------------- */

#calendrier li{
	list-style-type: none;	
}

#libmois1, #libmois2 {
	width: 210px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0;
	margin-bottom: 10;
	padding: 0;
	list-style-type: none;
	font-size: 150%;
	font-weight: bold;
}

#libelle1, #libelle2 {
	width: 210px;
	margin: auto;
	padding: 0;
	list-style-type: none;
	font-size: 130%;
}

.ligne {
	width: 210px;
	margin: 0 auto;
	padding: 0;
	list-style-type: none;
	font-size: 100%;
} 

#libelle1 li, #libelle2 li {
	float : left;
	width : 30px; 
	list-style-type: none;
}

.joursem {
	font-size: 80%;
} 

.ligne li {
	color: #000;
	float : left; 
	width : 30px; 
	list-style-type: none;
}

.ligne li a:hover{
	list-style: none;
	text-decoration: none;
	list-style-type: none;
}

li.vide, li.joursem {
	width: 30px;
	height: 30px;
	color: black;
	list-style-type: none;
}

li.Courantlibre {
	width: 30px;
	height: 30px;
	color: blue;
    background-color: #b5f1d4;
	list-style-type: none;
}

li.Courantoccup {
	width: 30px;
	height: 30px;
	color: blue;
    background-color: #f67c7c;
	list-style-type: none;
}

li.Courantpart_occup {
	width: 30px;
	height: 30px;
	color: blue;
    background-color: #fbf663;
	list-style-type: none;
}

li.Existantlibre {
	width: 30px;
	height: 30px;
	color: black;
    background-color: #b5f1d4;
	list-style-type: none;
}

li.Existantoccup {
	width: 30px;
	height: 30px;
	color: black;
    background-color: #f67c7c;
	list-style-type: none;
}

li.Existantpart_occup {
	width: 30px;
	height: 30px;
	color: black;
    background-color: #fbf663;
	list-style-type: none;
}

/* + -----------------------------------------------------
	Styles appliqués à la partie d'administration
+ ----------------------------------------------------- */

#result_rech {
    width: 100%;
}

table {
   font-size:90%;
   border:medium solid;
   border-collapse:collapse;
}

th {
   font-size:90%;
   font-weight:bold;
   border:thin solid;
   width:6%;
   padding: 5px;
   text-align: center;
}

td {
   font-size:90%;
   border:thin solid;
   width:6%;
   padding: 5px;
   text-align: center;
}

.col_a1 {
   height: 600px;
   width: 320px;
   border: 1px solid black;
   padding-left: 20px;
   float: left;
   margin-bottom: 10px;
}

.col_a2  {
   height: 600px;
   width: 320px;
   border: 1px solid black;
   padding-left: 20px;
   float: left;
   margin-left: 10px;
   margin-bottom: 10px;
}

.col_a3 {
   height: 170px;
   width: 320px;
   border: 1px solid black;
   padding-left: 20px;
   float: left;
   margin-left: 10px;
   margin-top: 10px;
}

.intitule {
   width: 100px;
   text-align: left;
   float: left;
}

.champ {
   width: 200px;
   text-align: right;
   float: left;
}