html, body {
height: 100%
}

body {
	margin : 0 ;
	padding : 0 ; 
	background :  url(images/bg-all.png) #fff repeat-x; 
	text-align : center;
	font-size : 0.8em;
	font-size:12px;
	color:#000;
	font-family : arial,verdana;	
	background:url(bg-vieux-lyon.jpg) repeat-x;
	background-color:#131927;
}
  
/**********
*  SITE  **
**********/
 
#site { 
	width : 887px;
	margin : 0 auto;
	text-align : justify;
	min-height : 100%; 
	
}
     
     
/*  HEADER
**************/
#header {
	position : relative ; 
	height : 321px;
	background : url(top.jpg) #20283f; 
	border-bottom:solid 0px #212842;
}

/*  HEADER >> TITRE DU SITE >> H1 + P slogan
*****************************************/
#header h1 {
	position : absolute; 
	top : 10px ; 
	right : 20px ; 
	margin : 0;
	padding : 0 ; 
	font-size : 10px;
	text-transform : uppercase;
	font-weight : normal ;
	letter-spacing : 6px ; 
	display:none; 
}

#header h1 a {
	color : #9D9D9D;
	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 HAUT
********************************************************************/
/*  HEADER >> MENU PRINCIPAL - MENU HAUT
********************************************************************/
#menu {

	position : absolute ; 
	bottom : 10px ;
	margin-left : 250px; 
}
	
	
#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;  
	font-size:11px;
}
	

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


#menu li a:hover {

	color:#ffcc33;
	back_ground-color:#000;
}
/*****************************	
 SOUS-MENU HAUT - Menu déroulant
*******************************/
/* nivo 2 */

#haut li ul {
	position: absolute;
	width: 150px;
	left: -999em;
	margin:0px;
	border:solid 1px #212842;
}

#haut li ul li {
	marging:0px;
	padding:5px 0px 5px 0px;
	border-top: solid 1px #333b55;
	text-align:center;
	background-color:#212940;	
	
}

#haut li ul li:first-child{
	border-top : 0; 
}
#haut li ul li a
{
	margin:0px;
	padding:0px;
	font-size:90%;
	color:#fff;
	width: 150px;
}
#haut li ul li a:hover
{
	color:#ffcc33;
	background-color:#212940;	

}
#haut li:hover ul {
	left: auto;
	
}


/* masquer les cadres des nivo 2 et + [li.sfhover pour IE] */

ul ul, li:hover ul ul {
	left: -999em;
}

li:hover ul, li:hover li:hover ul {
	display:block;	

}
/******************************
****  Colonne Gauche - menu
********************************************************************/
   
   
#col1 
{
	width : 196px ;
	min-height:445px;
	_height:445px;
	float  : left ;
	padding :  0  ;
	text-align : justify; 
	background : url(bg-menugauche.jpg) top no-repeat #141a28;
	
 }
	
#menugauche
{
	
	background:##141a28;
}	

/* Nivo 1 */
#menuvertical
{
	
	font-size : 1em ;
	margin : 30px 0px 0px 0px  ;
	padding :  0 0 0 0px ; 
	color : #fff ; 
	line-height : 27px;
	text-transform: uppercase;

	font-weight : normal;
	text-decoration : none ;


}
	
#menuvertical li
{
	list-style:none;
        
	color : #fff; 

	background : url(pixel.gif);

}
#menuvertical li a
{
	text-decoration:none;
	color:#fff;
color: #ffcc33;
	letter-spacing : 0.5px ;
	text-align:left; 
	padding : 0 0px 0 10px; 
	font-size:80%;

}
	
/* Nivo 2 */
#menuvertical ul{
	

	list-style : none ; 
	margin :  0px; 
	padding : 0; 
	color : #1A1A1A;
	font-size : 0.9em;

        display: block;
	background : url(pixel.gif);
}
 
#menuvertical ul li{
	margin : 0 ; 
	padding : 0;
	list-style : none ; 
	border-top : 0px solid #E6E6E6; 
	background: url(pixel.gif );
}
  
  
#menuvertical ul li a{
	padding : 0 0px 0 20px; 
	display : block ;
	font-size:11px;
	height : 25px;
	line-height : 25px; 
	text-decoration : none ; 
	color : #fff; 
	text-transform: lowercase;
	text-align:left;
	letter-spacing : 1px ; 
	background : url(pixel.gif);
}
#menuvertical a{
	color:#fff;
}
#menuvertical .menusel a
{
	color: #fffff;
	background: url(bg-left-menu.jpg ) no-repeat;
	filter:alpha(opacity=90);
  	/* CSS3 standard */
  	opacity:0.9;
	border-bottom:solid 1px #4b556c;
	border-top:solid 1px #4b556c;
}
#menuvertical li:first-child{
	border-top : 0;  
}

#menuvertical li a:hover{
	color : #ffcc33;

}



/*  CONTENT / Contenu
********************************************************************/

#content {
	overflow : auto ;

	background : url(bg.jpg) left top #fff repeat-y; 

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

#centrage {
	padding : 0px;
}
	
	
/*  CONTENU
********************************************************************/	
	

#contenu 
{
	width : 466px; 
	background : transparent; 
	letter-spacing:0.05em;
	float  : left;
	margin : 10px;
	padding : 0px 0px 0 0px  ;
	font-family : verdana, arial;
	font-size:11px;
}
  

#contenu h1 
{
	font-family: Arial,Verdana, Helvetica;
	font-size : 120% ; 
	padding :  5px 0px ; 
	margin: 0 ;
	color : #141b2a; 
	font-weight : bold;
	font-variant:small-caps; 
        	text-align:center;
        	border-bottom:solid 1px #c6c6c6;
} 

#contenu h2
{

	font-family: Arial,Verdana, Helvetica;
	font-size:100%;
	letter-spacing:0.1em;
	padding : 0;
	padding-top:4px;
	margin : 0;
	margin-top:5px;
	height:20px;
	color:#212842;
        border-bottom:solid 1px #212842;
	font-weight : normal;
	_background-color:#212842;
	text-align:center;
	
}
#contenu h2 a
{
	color:#fff;

}
#contenu h3
{
	font-family: Arial,Verdana, Helvetica;
	color:#424242;
	font-size:90%;
	font-weight:normal;
	margin:0px 0px 5px 0px;
	padding:0px;
}
#contenu ul
{
	list-style-image:url(puce.gif);
	list-style-type:none;
	margin-top:0px;
	margin-bottom:0px;
	padding-bottom:10px;
	text-align:left;
	padding-left:15px;
	margin-left:15px;
	padding-top:0px;
	margin-bottom:5px;

}



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


#contenu a:hover
{
	text-decoration:underline;
}
.cadreaccueil
{
	width:100%;

}
.cadreaccueil td
{
	vertical-align:top;
	align:left;

}
/* IMAGES 
*****************************************************/

/* par défaut, alignée à droite du texte */

#contenu img
{
	padding:0px;
	text-align:right;

	float:left;
	margin-left:0px;
	border: solid 1px #525769;;
	border-left:solid 1px #525769;
	border-top:solid 1px #525769;

	bo-rder-right:solid 5px #131927;
	margin-top:5px;
	
}
/* sinon à gauche ou haut */
.imgtxt
{
	padding:0px;
	text-align:right;

	float:left;
	margin-right:10px;
	b_order:solid 1px #fff;
	margin-top:5px;
}
.imgtop
{
	float:top;
	margin-bottom:5px;
	margin-top:5px;
	border:1px solid #212842;
}

/****************************   
/*  Colonne droite
********************************************************************/
   
   
#col2 
{
	width : 204px ;
	min-height:445px;
	_height:445px;
	float  : left ;
	padding :  5px 0 0px 0px ;
	text-align : center; 
	color : #A3A3A3;
	background : url(bg-col2.jpg) top no-repeat;
}
  

#col2 img
{

 	border:solid 1px #454c5b;
}



#col2  p 
{
	margin : 0 0 5px 0;
	padding : 0;  
}


#col2 .cadre-droit
{
	text-align:center;
	height:301px;
	width:160px;
	margin:50px 0px 0px 10px;
	padding : 10px 0 10px 0px;
}
   
#col2 h2 
{
	font-size : 100%;
	margin : 0px 0 10px 0px  ;
	padding :  0 ; 
	color : #ffffff ; 
}
#col2 a
{
	color:#fff;
	text-decoration:none;
}
#col2 a:hover
{
	text-decoration:underline;
}
 	
/*  FOOTER
*******************************************************************/ 
   
#footer { 
	height :63px;
	text-align : center ;
 	background: #141b2a;
}


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



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

#footer a:hover { 
	text-decoration : underline ;  
}