@charset "iso-8859-1";
/*---------------------------------------------------*/
/*----------- le style général de la page -----------*/
/*---------------------------------------------------*/
body {
    margin: 0;
	font-family: verdana, arial, sans-serif;
	font-size: 75%;
	text-align:center;
	}
/*---------------------------------------------------*/
/*------- le style global qui centre la page --------*/
/*---------------------------------------------------*/
.conteneur {
     position:absolute;
     left: 50%; 
     width: 800px;
     margin-top:10px;
     margin-left: -400px; /* moitié de la largeur */
	 padding: 10px;
     border: 2px solid #000000; 
	 border-style: dotted;
	 text-align: left; 
     }	 
/*---------------------------------------------------*/
/*----------- le style en flux normal ---------------*/
/*---------------------------------------------------*/	
.blocnormal {
	width:150px ;
	height:150px ;
	background-color : #FF0000;	
	border: 1px solid #000000;
	}
.blocnormal2 {
	width:250px ;
	height:100px ;
	background-color : #33cccc ;
	border : 1px solid #000000;
	}
.bloclignejaune {
	background-color: #FFFF66;
	}
.bloclignevert {
	background-color: #00FF66;
	}  

.boitebleue {
  background-color: #6699FF;
  width:100px;
  
}
.boiterouge {
  background-color: #FB6E7C;
  width:100px;
}

/*---------------------------------------------------*/
/*----------- le style en flux flottant -------------*/		
/*---------------------------------------------------*/	 	
.gauchefloat {
	background-color: #ffff00;
  	float: left;
  	width: 500px;
}
.droitefloat {
	background-color: #CC99FF;
  	float: right;
  	width: 400px;
}
.troplarge {
	float:left ;
	background-color : red ;
	width: 200px ;
	height: 150px ;
	border: 1px solid black;
	}
.troplarge2 {
	float: left ;
	background-color : black ;
	width: 250px ;
	height: 150px ;
	border: 1px solid black;
	}
.troplarge3 {
	float: left ;
	background-color : blue ;
	width: 400px ;
	height: 150px ;
	border: 1px solid black;
	}
.troplarge4 {
	float: left ;
	background-color : white ;
	width: 450px ;
	height: 150px ;
	border: 1px solid black;
	}
.troplarge5 {
	float: left ;
	background-color : red ;
	width: 500px ;
	height: 150px ;
	border: 1px solid black;
	} 
.boiteA {
   margin:15px;
   padding:5px;
   background-color:#ddd;
	} 
.boiteB {
	float:right;
	width:50%;
	margin:15px;
	padding:5px;
	background-color:#99CC33;
	}	
.boiteC {
	margin:10px;
	padding:5px;
	background-color:#99CCFF
	}
.Gauche {
	width:28%;
	float:left;
	background:#B0E0E6;
	padding-bottom:10px;
	padding-top:10px;
	padding-left:1%;
	padding-right:1%;
}
.Centre {
	width:48%;
	float:left;
	background:#FFEBCD;
	padding-bottom:10px;
	padding-top:10px;
	padding-left:1%;
	padding-right:1%;	
}
.Droite {
	width:18%;
	float:left;
	background:#98FB98;
	padding-bottom:10px;
	padding-top:10px;
	padding-left:1%;
	padding-right:1%;	
}
.spacer {
  clear: both;
}

/*---------------------------------------------------*/
/*----------- le style en flux absolue --------------*/		
/*---------------------------------------------------*/	
.global {
/*position: relative;	 */
background-color: #6699FF;
width: 600px;
padding-right: 5px;
}
.jaune {
position: absolute;
background-color: #ffff00;
width: 80px;
}
.global_relatif {
position: relative;	 
background-color: #B5EEFF;
width: 600px;
left:50% ;
margin-left:-300px ; 
padding:5px ;
}
.global_relatif2 {
position: relative;	 
background-color: #B5EEFF;
width: 600px;
left:50% ;
margin-left:-300px ; 
padding-top:5em ;
padding-bottom:5px ;
padding-left:5px ;
}
/*---------------------------------------------------*/
/*---------------------- Le Code --------------------*/
/*---------------------------------------------------*/
.lebloccodecentre {
	border: 1px solid #000000;
	background-color : white; 
	font-family : arial;
	font-size : 12px;
	text-align:center;

}
.lebloccode {
	border: 1px solid #000000;
	width: 91%;

	background-color : #ffff99; 
	font-family : arial;
	font-size : 12px;
	text-align:left;
	padding-top:5px;
	padding-left:10px;
	padding-right:10px;
	margin:5px;

}
.lebloccode2 {
	border: 1px solid #000000;
	width: 300px;
	background-color : #ffff99; 
	font-family : arial;
	font-size : 12px;
	text-align:left;
	padding-top:5px;
	/*padding-left:10px;
	padding-right:10px;
	margin:5px;*/

}
.lebloccode3 {
	width: 300px;
	border-left:5px double #6699FF;
	background-color : #FFFFFF; 
	font-family : arial;
	font-size : 12px;
	text-align:left;
	padding-top:5px;
	padding-left:5px ;
}
.lebloccode4 {
	width: 300px;
	border-left:5px double blue;
	background-color : #FFFFFF; 
	font-family : arial;
	font-size : 12px;
	text-align:left;
	padding-top:5px;
}



h1, h2, h3 { color: #005A9C; background: white }
h1 { font: 150% sans-serif } 

.textblanc {color: white ; }

/*
float + relatif
*/


.conteneur__ {
width:800px;
border:1px solid black;
	}

.bloc_relatif{
position:relative;
right:400px;
float:right;
width:300px;
height:50px;

border:1px solid black;
background-color:yellow;

}

.bloc_marge {
position:relative;
left:100px;
margin-right:400px;
float:right;
width:300px;
height:50px;

border:1px solid black;
background-color:yellow;
z-index:0;
}