/* - -----------------------------------------------------------------------------------------------------------
|                  FEUILLE DE STYLE ACTIVE LORSQUE JAVASCRIPT EST ACTIF                								|
|                  CREE PAR ADELINE LETESSIER -- TRUCHON LE 21/09/2006												    	|
|                              			    																							|
--------------------------------------------------------------------------------------------------------------*/

/* - ------------------------------------------------------------------------------------------------------------
|                                         Design général : Body et liens            			                   |
---------------------------------------------------------------------------------------------------------------*/

body{
	margin: 0px 0px 0px 1.2%;
	padding: 10px 0px 0px 0px;
	width: 98%;
	background: rgb(255,231,0) ;
	font-family: "Comic Sans MS",Arial,Helvetica,Geneva,Swiss,SunSans-Regular,serif;
	font-weight: bold;
	color: rgb(0,126,210);
	text-align: justify;
}

a, a:visited, a:active {
	color: rgb(214,123,0);
	text-decoration: none;
}

a:hover, a:focus {
    color: black;
    text-decoration: underline;
}

a img
{
   border: none;
}

/* - ------------------------------------------------------------------------------------------------------------
|                           Message dans le cas ou Javascript n'est pas activé                                	 |
---------------------------------------------------------------------------------------------------------------*/
.noJs{
	display:none
}

/* - ------------------------------------------------------------------------------------------------------------
|                                  Menu  du haut (correspodant au menu.php)   	                             	 |
---------------------------------------------------------------------------------------------------------------*/

#barre_haut{
	margin: 0px;
	/* partie dynamique */
	/*padding:0 0 0 25px;*/
	padding:0 0 180px 25px;
	height: 45px;
	background: url("images/design/degrade_haut_gauche.png") top left no-repeat;
}
#barre_haut #barre_haut-droite{
	margin: 0px;
	padding:0 25px 0 0;
	height: 45px;
	background: url("images/design/degrade_haut_droite.png") top right no-repeat;
}

/*Les Drapeaux*/
#barre_haut #langue{
	margin:0;
	padding:12px 5px 18px 0 !important;
	padding:12px 5px 10px 0;
	width: 11%;
	height: 15px;
	background: url("images/design/degrade_haut_millieu.png") top left;
	float: left;
	text-align: center;
}
#barre_haut #langue a:hover, #barre_haut #langue a:focus {
    text-decoration: none;
}
#barre_haut #langue .drapeau{
	margin:0;
	padding:0;
	width: 18%;
	height: 15px;
}

/*Les menus déroulants*/
#barre_haut .menu { 
	width: 17.5%;
	margin:0;
	padding: 12px 0 11px 0; 
	height:22px;
	background: url("images/design/degrade_haut_millieu.png") top left repeat-x;
	float: left;
}

/* Titres des menus déroulants*/
#barre_haut .menu .menu_titre {
	display:block;
	margin:auto;            
	padding:0 12px 0 0;
	height: 22px;
	width: 14.5% !important;
	width: 88%;
	background: url("images/design/bouton_droite.png") top right no-repeat;
	position: absolute;
	text-align: center;
}
#barre_haut .menu .menu_titre .menu_titre-gauche{ 
	margin:0;
	padding:1px 0 7px 12px;
	height: 14px;
	background: url("images/design/bouton_gauche.png") top left no-repeat;
	font-size: 13.5px;
	font-weight: bold;
}
#barre_haut .menu .menu_titre  a {
	margin:0;
	border: 0 none;
	color: rgb(0,126,210);
	text-decoration: none;
}

/*Les sous menus*/
#barre_haut .menu #menu_smenu1, #barre_haut .menu #menu_smenu2, #barre_haut .menu #menu_smenu3, #barre_haut .menu #menu_smenu4, #barre_haut .menu #menu_smenu5{
	display:block;
	margin:auto;
	margin-top: 15px;
	padding: 10px 0 0 0; 
	width: 15.4% !important;
	width: 93%;
	/* partie dynamique */
	/*display:none;*/
	position: absolute;
	z-index:100;
}
#barre_haut .menu .menu_smenu{
	margin:0;
	padding: 0 0 0 10px;
	background: url("images/design/menu_gauche.png") top left no-repeat;
	height:auto !important;
	height:0px;
}
#barre_haut .menu .menu_smenu .menu_smenu-haut {
	margin: 0;
	padding: 10px 0 0 0;
	background: url("images/design/menu_haut.png") top right no-repeat;
}
#barre_haut .menu ul{
	margin:0;
	padding:0 12px 0 0;
	background: url("images/design/menu_droite.png") top right no-repeat;
	list-style-type: none;
}
#barre_haut .menu ul li {
	margin:0;
	padding:0 3px 0 1px;
	background: url("images/design/bouton.jpg");
	border-bottom: 1px gray solid;
	cursor: pointer;
	text-align: center;
	font-size: 15px;
	font-weight: bold;
}
#barre_haut .menu ul .prem{
	border-top: 1px gray solid;
}

#barre_haut .menu ul .avant_petit{
	border-bottom: 0 none !important;
}
#barre_haut .menu ul .petit{
	font-size: 13px !important;
}
#barre_haut .menu ul .petit a{
	display:inline !important;
}

#barre_haut .menu .menu_smenu-bas-droite{
	margin:0;
	padding:0 12px 0 0;
	background: url("images/design/menu_bas_droite.png") top right no-repeat;
}
#barre_haut .menu .menu_smenu-bas{
	margin:0;
	padding: 0;
	height:12px;
	background: url("images/design/menu_bas.png") top left no-repeat;
}


/* liens */
#barre_haut .menu ul li a{
	margin:0;
	padding:0;
	height: 100%;
	background: url("images/design/bouton.jpg");
	border: 0 none;
	color: rgb(0,126,210);
	text-decoration: none;
	display: block;
}

/* liens survolés */
#barre_haut .menu ul li a:hover, #barre_haut .menu .menu_titre a:hover { 
	background: rgb(255,231,0);
}

/* - ------------------------------------------------------------------------------------------------------------
|                                          Design de la page centrale				                   	 |
---------------------------------------------------------------------------------------------------------------*/

/* Cadre central*/
#contenu{
	margin: 5px 0;
	padding: 0 0 0 1px;
	background: url("images/design/contenu_gauche.png") top left no-repeat;
	clear:both;
	height:auto !important;
	height:0px;
}
#titre_page{
	margin: 0 0 0 24px;
	padding: 15px 24px 0 0;
	background: url("images/design/contenu_haut.png") top right no-repeat;
	height:120px;
	overflow:hidden;
	text-align: center;
	color: blue/*rgb(153,0,0)*/;
	font-weight: bold;
}
#corps_page{
	margin: -25px 0 0 0;
	padding: 0 3px 0 0;
	background: url("images/design/contenu_droite.png") top right no-repeat;
}

#corps_page_index{
	margin: -25px 0 0 0;
	padding: 0 3px 0 0;
	background: url("images/design/contenu_droite.png") top right no-repeat;
}
#page{
	margin :0;
	padding: 25px 25px;
	background: url("images/design/fond-jaune.gif");
}
#copyright_droite{
	margin: 0;
	padding: 0 25px 0 0;
	background: url("images/design/contenu_bas_droite.png") top right no-repeat;
}
#copyright{
	margin: -25px 0 0 0 !important;
	margin: -5px 0 0 0;
	padding:0;
	height:25px;
	background: url("images/design/contenu_bas.png") top left no-repeat;
}

/*Titres*/
#corps_page_index h1,h2,#corps_page_index h3,h4,h5,h6{
	clear:both;
	text-align: center;
	color: blue/*rgb(153,0,0)*/;
	font-weight: bold;
}
#contenu #corps_page h1{
	text-align: center;
	color: blue/*rgb(153,0,0)*/;
	font-weight: bold;
}

/* Les Illustrations des titres*/
.illustration_titre{
	margin: 0 0 0 30px;
	float: right;
}
.illustration_titre img{
	max-height: 120px;
	float: left;
	border: 1px black solid;
}
.illustration_titre p{
	text-indent: 0 !important;
	margin: 0;
	border: none;
	font-size: 0.5em;
	color: black;
	text-align: left;
}

/*Les Paragraphes*/
#contenu #corps_page h3{
	margin: 30px 0 0 0;
	clear:both;
	text-align: left;
	font-size:1.2em; 
	font-weight: bold;
	color: rgb(153,0,0);
}
#contenu #page p
{
   text-indent: 4%;
}
#contenu #page ul
{
   padding-left: 12%;
}

/*Les Illustrations des paragraphes*/
.illustration{
	margin: 0 0 0 30px;
	height:150px;
	float: right;
	clear:both;
	text-align:right;
}
.illustration img{
	height:100px;
	border: 1px black solid;
}
.illustration p{
	text-indent: 0 !important;
	margin: 0;
	padding: 0;
	font-size: 0.7em;
	text-align: center;
}



/* - ------------------------------------------------------------------------------------------------------------
|                                    Design de la page d'accueil (index.php)			                   	 |
---------------------------------------------------------------------------------------------------------------*/

.images_accueil{
	margin: 0px;
	height: 117px;
	border: 1px black solid;
}

.images_gif{
	margin: 0px;
	height: 117px;
	border: 1px black solid;
}

/* - ------------------------------------------------------------------------------------------------------------
|                             Design de la page nouvelles (nouvelles .php)			                   	 |
---------------------------------------------------------------------------------------------------------------*/

.nouvelles{
	margin: 0 0 0 8%;
	padding: 2%;
	width: 80%;
	border: 1px rgb(222,214,0) solid;
}

.titre_nvelles{
	margin: 10px 0 0 10%;
	padding: 5px 2% 0 2%;
	width: 76%;
	height: 40px;
	background-image: url("images/design/degrade_nouvelles.gif"); 
	border: 1px rgb(222,214,0) solid;
}

.illustration_titre_nvelles{
	margin-left: 10px;
	height: 35px;
	border: 1px black solid;
	float: left;
}

.date_nouvelles{
	display: block;
	float: right;
	font-size: 0.5em;
	font-weight: bold;
}

.nouvelles p{
	min-height: 140px;
}

/* - ------------------------------------------------------------------------------------------------------------
|                                              Design de la page cv(cv .php)			                   	 |
---------------------------------------------------------------------------------------------------------------*/

#cv {
	margin: 15px 0 0 0 ;
	clear: both;
	border: 1px rgb(222,214,0) solid;
}

#cv  th{
	padding: 5px;
	vertical-align: top;
	text-align: center;
	width: 22%;
	height: 22px;
	font-weight: bold;
	background-color: rgb(238,234,127);
}

#cv  td{
	padding: 5px;
	width: 78%;
	height: 22px;
	border-top: 1px rgb(238,234,127) solid;
	border-bottom: 1px rgb(238,234,127) solid;
}

/* - ------------------------------------------------------------------------------------------------------------
|                                              Design de la page tarifs(tarifs .php)			                   	 |
---------------------------------------------------------------------------------------------------------------*/

#tarifs{
	margin: 15px 0 0 0 ;
	clear: both;
	text-align: center;
	border: 1px rgb(222,214,0) solid;
}

#tarifs th{
	width: 16%;
	height: 22px;
	font-weight: bold;
	background-color: rgb(238,234,127);
}

#tarifs td{
	width: 17%;
	height: 22px;
	border: 1px rgb(222,214,0) solid;
}

/*Paragraphe avec couleur de fond et cadre*/

.cadre {
	margin:auto;	
	width:95%
}  

.cadre p {
	margin: 10px 5% 10px 5%;
	padding: 20px;
	width: 19%;
	height:350px;
	border: 1px rgb(222,214,0) solid;
	background-color: rgb(238,234,127) ;
	text-align: center;
	float:left;
	text-indent:0 !important;
}  
                                                         


/* - ------------------------------------------------------------------------------------------------------------
|                            Design de la page plandacces(plandacces .php)		                   	 |
---------------------------------------------------------------------------------------------------------------*/

#itineraire {
	margin: 15px 0;
	width: 100%;
	clear: both;
	float: left;
	border: 1px rgb(222,214,0) solid;
}

#itineraire  th{
	border-top: 1px rgb(238,234,127) solid;
	border-bottom: 1px rgb(238,234,127) solid;
	width: 15%;
	height: 22px;
	vertical-align: top;
	font-weight: bold;
	background-color: rgb(238,234,127);
}

#itineraire  td{
	border-top: 1px rgb(238,234,127) solid;
	border-bottom: 1px rgb(238,234,127) solid;
	width: 35%;
}

.itinerairedepart {
	margin: 10px 10% 10px 10%;
	width: 30%;
	float:left;
	border: 1px rgb(222,214,0) solid;
}

.itinerairedepart  th{
	height: 22px;
	vertical-align: top;
	font-weight: bold;
	background-color: rgb(238,234,127);
}

.itinerairedepart  td{
	border-top: 1px rgb(238,234,127) solid;
	border-bottom: 1px rgb(238,234,127) solid;
	height: 22px;
}
 .important{
	width: 50%;
	margin: 15px 0 0 0 ;
}


/* - ------------------------------------------------------------------------------------------------------------
|                                              Design de la page équipe(equipe .php)			                   	 |
---------------------------------------------------------------------------------------------------------------*/

#equipe{
	margin: 15px 0 0 0 ;
	width: 100%;
	clear: both;
	text-align: center;
	border: 1px rgb(222,214,0) solid;
}

#equipe td{
	padding: 15px 0 15px 0; 
	width: 33%;
	height: 22px;
	border: 1px rgb(222,214,0) solid;
}

/* - ------------------------------------------------------------------------------------------------------------
|                                              Design du tableau planning(famille_nl .php)			                   	 |
---------------------------------------------------------------------------------------------------------------*/

.planning{
	background: url("images/design/fond_liege.gif") repeat;
	margin: 15px 0 0 10% ;
	width: 80%;
	height: 500px;
	clear: both;
	text-align: center;
	border: 0;
}

.planning td{
	width: 20%;
	border: 0;
}

.planning td img{
	height:200px;
	border: 0;
}

/* - ------------------------------------------------------------------------------------------------------------
|                                              Design de la page photos(photos .php)			                   	 |
---------------------------------------------------------------------------------------------------------------*/

#photos{
	margin: 15px 0 0 0 ;
	width: 100%;
	clear: both;
	text-align: center;
	border: 1px rgb(222,214,0) solid;
}

#photos td{
	padding: 15px 0 15px 0; 
	width: 16%;
	height: 22px;
	border: 1px rgb(222,214,0) solid;
}



/*
html>body body {
Style appliqué pour tous les navigateurs excepté IE 
}

* html body {
Style appliqué seulement pour IE
}
*/