html, body {
height: 100%
}


/********** Vide autour de site **************/
body {
margin : 0 ;
padding : 0 ; 
background : black /*url(images/fond.jpg)*/; 
text-align : center;
font-size : 0.7em;
color : #777474 ;
font-family : arial ;
}
  

/******************Tout les conteneurs du site****************/
 
#site { 
width : 950px;
margin : 0 auto;
text-align : left;
background : #191919 ;
min-height : 100%; 

}
  
	 

 
/***************Bandeau du bas************************/
   

#header {
margin-top : 70px;
position : relative ; 
height : 208px;
background : #DDDDDD; 
color : #000000;
padding-bottom : 0px;
}

#header a { 
font-size: 13px;
color : red;
text-decoration : none ;  
}

#header a:hover { 
color : blue; 
}

/********************* cadre d'une news *********************/

#total{
	background: #FFCCCC;
	position:relative;
	text-align:center;
	border: solid red 4px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 5px Opx 5px 0px;
	width : 100px;
	}
	
#facture{
	padding-top : 0px;
	background: white;
	position:relative;
	text-align:center;
	border: solid black 1px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: Opx Opx Opx 0px;
	width : 700px;
	}	
	
#grand_titre{
	background: red;
	position:relative;
	text-align:center;
	border: solid red 2px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 50px 50px 50px 50px;
	width : 250px;
	}
	
#grand_titre2{
	background: red;
	position:relative;
	text-align:center;
	border: solid red 2px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 50px 50px 50px 50px;
	width : 500px;
	}	
	
#validation{
	background: grey;
	position:relative;
	text-align:center;
	border: solid black 1px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 10px 10px 0px 0px;
	width : 600px;
	}
	
#rech_titre{
	background: black;
	position:relative;
	text-align:center;
	border: solid red 2px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 50px 50px 0px 0px;
	width : 1000px;
	}	

#titre_inscrip{
	background: #4B4B4B;
	position:relative;
	text-align:center;
	border: solid #4B4B4B 2px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 15px 15px 0px 0px;
	width : 600px;
	}	
	
#contenu_inscrip{
	padding-left: 70px;
	padding-right: 70px;
	background: white;
	position:relative;
	text-align:center;
	border: solid #4B4B4B 2px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 0px 0px 15px 15px;
	width : 460px;
	}	
	
#titre_contact{
	background: red;
	position:relative;
	text-align:center;
	border: solid red 2px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 15px 15px 0px 0px;
	width : 650px;
	}	
	
#contenu_contact{
	padding-left: 70px;
	padding-right: 70px;
	background: white;
	position:relative;
	text-align:center;
	border: solid red 2px ;
	text-transform : uppercase;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 0px 0px 15px 15px;
	width : 510px;
	}		
	
#titre_contenu_panier{
	background: #FFCCCC;
	position:relative;
	text-align:center;
	border: solid red 2px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 15px 15px 0px 0px;
	width : 650px;
	}
	
#programme{
	background: grey;
	position:relative;
	text-align:center;
	border: solid grey 2px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 40px 40px 40px 40px;
	width : 650px;
	}	

#titre_list_com{
	background: #DDDDDD;
	position:relative;
	text-align:center;
	border: solid black 2px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 15px 15px 0px 0px;
	width : 650px;
	}	
	
#contenu_adresse{
	background: white;
	position:relative;
	text-align:center;
	border: solid black 2px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 5px 5px 5px 5px;
	width : 500px;
	}	
	
#contenu_panier{
	background: white;
	position:relative;
	text-align:center;
	border: solid black 2px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 5px 5px 5px 5px;
	width : 650px;
	}
	
#contenu_validation{
	background: white;
	position:relative;
	text-align:center;
	border: solid black 1px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 0px 0px 0px 0px;
	width : 600px;
	}	
	
#contenu_commande{
	background: white;
	position:relative;
	text-align:center;
	border: solid black 1px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 0px 0px 0px 0px;
	width : 400px;
	}	

#titre_profil{
	background: grey;
	position:relative;
	text-align:center;
	border: solid grey 1px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 5px 5px 0px 0px;
	width : 180px;
	}	
	
#profil{
	background: white;
	position:relative;
	text-align:center;
	border: solid grey 1px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 0px 0px 5px 5px;
	width : 180px;
	}		
	
#commande_globale{
	background: #FF99FF;
	position:relative;
	text-align:center;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 0px 0px 0px 0px;
	width : 430px;
	}
	
#list_commentaire{
	background: white;
	position:relative;
	text-align:center;
	border: solid black 2px ;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 5px 5px 5px 5px;
	width : 650px;
	}	

#ajout_panier{
	background: white;
	position:relative;
	text-align:center;
	border: solid black 2px ;
	color: #CCFF00;
	overflow-x: auto;
	overflow-y: hidden;
	font-size: 12px;
	-moz-border-radius: 30px 30px 30px 30px;
	width : 100px;
	}

#panier{
	background: #C0C0C0;
	position:relative;
	text-align:center;
	border: solid black 4px ;
	color: black;
	overflow-x: auto;
	overflow-y: hidden;
	font-size: 18px;
	-moz-border-radius: 20px 20px 20px 20px;
	width : 100px;
	}

#resultat{
	background: #CCCC99;
	position:relative;
	text-align:center;
	border: solid black 2px ;
	color: black;
	overflow-x: auto;
	overflow-y: hidden;
	font-size: 18px;
	-moz-border-radius: 2px 2px 2px 2px;
	width : 500px;
	}

#news{
	background: #FF6699;
	margin-left:0cm;
	padding:0cm;
	position:relative;
	text-align:center;
	border: solid red 2px ;
	color: black;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 0px 0px 7px 7px;
	width : 500px;
	}

#titrenews{
	background:#FF0033;
	margin-left:0cm;
	padding:0cm;
	position:relative;
	text-align:center;
	border: solid red 2px ;
	color:white;
	-moz-border-radius: 7px 7px 0px 0px;	
    font-size: 18px;
	width : 500px;
	}
	
#cdc{
	background: #66FF33;
	margin-left:0cm;
	padding:0cm;
	position:relative;
	text-align:center;
	border: solid green 2px ;
	color: black;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 0px 0px 7px 7px;
	width : 180px;
	height : 280px;
	}

#titrecdc{
	background:#66FF00;
	margin-left:0cm;
	padding:0cm;
	position:relative;
	text-align:center;
	border: solid green 2px ;
	color:white;
	-moz-border-radius: 7px 7px 0px 0px;	
    font-size: 18px;
	width : 180px;	
	}	
	
#fichecdc{
	background: #66FF33;
	margin-left:0cm;
	padding:0cm;
	position:relative;
	text-align:center;
	border: solid green 2px ;
	color: black;
	overflow-x: auto;
	overflow-y: hidden;
	-moz-border-radius: 0px 0px 7px 7px;
	width : 400px;
	}

#fichetitrecdc{
	background:#66FF00;
	margin-left:0cm;
	padding:0cm;
	position:relative;
	text-align:center;
	border: solid green 2px ;
	color:white;
	-moz-border-radius: 7px 7px 0px 0px;	
    font-size: 18px;
	width : 400px;	
	}	
	
/*  HEADER >> TITRE DU SITE >> H1 + P slogan
********************************************************************/


#header h1 {
position : absolute; 
top : 10px ; 
right : 20px ; 
margin : 0;
padding : 0 ; 
font-size : 2em ;
text-transform : uppercase;
font-weight : normal ;
letter-spacing : 6px ;  
}



#header h1 a {
color : #FF0000;
text-decoration : none; 
}


#header p {
position : absolute; 
top : 40px ; 
right : 33px ; 
margin : 0;
padding : 0 ; 
text-transform : uppercase;
font-weight : normal ;
letter-spacing : 6px ;
color : #fff; 
}


   
   
/*  HEADER >> MENU PRINCIPAL
********************************************************************/
   
   
   
#menu {
position : absolute ; 
bottom : 10px ;
left : 0; 
}
	
	
#menu  ul{
list-style : none ;
margin : 0; 
padding : 0 ;
}


#menu  li{
float : left ;
text-transform : uppercase ;
background : url(images/bg-li-menu.jpg) right no-repeat;  
}
	
	

#menu  li a{
margin : 0 ; 
padding : 0 15px  ; 
text-decoration : none ;    
color : #9D9D9D ;
font-weight : bold ;
}


#menu li a:hover {
color : #9D9D9D
}
	


/***************conteneur au dessus de la barre de recherche*********************/

#content {
overflow : auto ;
background : #DDDDDD; 

 }
 
 
 
 /*  CONTENT >> CENTRAGE
********************************************************************/

#centrage {
padding : 0 ;
}
	
	
/****************Contenu principal de la page au centre*******************/	
	

#content-recherche {
width : 724px ;
background : white; 
float  : left ;
margin-top : 46px;
padding : 10px 10px 0 20px  ;
}	
	
#contenu {
width : 724px ; 
background : white; 
float  : left ;
margin : 0;
padding : 20px 10px 0 20px  ;
}

#contenu a { 
color : red;
text-decoration : none ;  
}

#contenu a:hover { 
color : #000080; 
}

 
   

/*************** Deuxieme parti du contenu principal ***********************/	


.post {
padding : 0 0 20px 0;
 

}   

.post  h2 {
font-size : 1.6em ; 
padding :  0 ; 
margin: 0 ;
color : #000; 
font-weight : normal;
text-transform : uppercase;  
}

.post  .sous-h2 {
margin : 0 ;
padding : 0;
color : #B68036 ;
font-size : 110%; 
font-weight : bold ;  
}
   
.post img {
float  : right ;
margin : 0 10px 5px 20px;
}

.post a {color : #000}
   
   
/***************bandeau de gauche**************/
   
/* partie principale*/   
   
#side {
width : 196px ;
float  : left ;
padding :  0  ;
text-align : justify; 
background : #DDDDDD;
font-size : 90%;  
margin-top : 41px;
padding-bottom : 454px;
}
	
/*Ent?e du bandeaux de gauche*/
	
#side h2 {
font-size : 1em ;
margin : 0;
padding :  0 0 0 15px ; 
color : #000 ; 
background : #FF0000;
height : 37px;
line-height : 37px;
text-transform : uppercase;
font-weight : normal;
}
	
	
	
#side ul{
list-style : none ; 
margin :  10px 0 ; 
padding : 0; 
color : #1A1A1A;
}
 
#side li{
margin : 0 ; 
padding : 0;
border-top : 1px solid #E6E6E6; 
}
  
  
#side li a{
padding : 0 0 0 15px; 
display : block ;
height : 25px;
line-height : 25px; 
text-decoration : none ; 
color : #000; 
text-transform : uppercase;
 
}


#side li:first-child{
border-top : 0;  
}


/***** change la couleur des liens du menu de gauche ******/

#side li a:hover{
background-color: pink;
color : #000080 ;

}


#side p{
margin : 10px 0 25px 0 ; 
padding : 0;  
}


#side form {
margin : 0;
padding : 20px 0 0 0;
height : 50px;  
}


#side input {
float : left ; 
margin : 0;
padding : 0; 
}


#side .champ {
width : 115px ;
height : 23px;
border-top  : 1px solid #E2E2E2;
border-left  : 1px solid #E2E2E2;
border-bottom  : 1px solid #E2E2E2;
border-right : 0;   
 }


#side .recherche {
background : url(images/search.jpg);
height : 25px;
width : 67px;
border : 0; 
}

 
 	
/************************* footer, pied de page ************************/
   
#footer { 
margin-bottom : 100px;
height :50px;
text-align : center ;
background : #969696;
}


#footer p { 
margin : 0 ;
padding : 15px 0 0 0;  
color : #868686; 
}



#footer a { 
color : #000000;
text-decoration : none ;  
}

#footer a:hover { 
color : #000080; 
}
   
/********************bandeau de gauche stylo *******************************/
   
/* partie principale*/   
   
#side_stylo {
width : 196px ;
float  : left ;
padding :  0  ;
text-align : justify; 
background : #DDDDDD;
font-size : 90%;  
margin-top : 41px;
padding-bottom : 454px;
}
	
/*Ent?e du bandeaux de gauche*/
	
#side_stylo h2 {
font-size : 1em ;
margin : 0;
padding :  0 0 0 15px ; 
color : #000 ; 
background : #FF0000;
height : 37px;
line-height : 37px;
text-transform : uppercase;
font-weight : normal;
}
	
	
	
#side_stylo ul{
list-style : none ; 
margin :  10px 0 ; 
padding : 0; 
color : #1A1A1A;
}
 
#side_stylo li{
margin : 0 ; 
padding : 0;
border-top : 1px solid #E6E6E6; 
}
  
  
#side_stylo li a{
padding : 0 0 0 15px; 
display : block ;
height : 55px;
line-height : 25px; 
text-decoration : none ; 
color : #000; 
text-transform : uppercase;
 
}


#side_stylo li:first-child{
border-top : 0;  
}


/***** change la couleur des liens du menu de gauche ******/

#side_stylo li a:hover{
background-color: pink;
color : #000080 ;

}


#side_stylo p{
margin : 10px 0 25px 0 ; 
padding : 0;  
}


#side_stylo form {
margin : 0;
padding : 20px 0 0 0;
height : 50px;  
}


#side_stylo input {
float : left ; 
margin : 0;
padding : 0; 
}


#side_stylo .champ {
width : 115px ;
height : 23px;
border-top  : 1px solid #E2E2E2;
border-left  : 1px solid #E2E2E2;
border-bottom  : 1px solid #E2E2E2;
border-right : 0;   
 }


#side_stylo .recherche {
background : url(images/search.jpg);
height : 25px;
width : 67px;
border : 0; 
}