@charset "utf-8";
/* CSS Document - Site INSP - Particules-interactives - H-Laclavetine */

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin:auto;
	background-color:#5d8ba2;
}


/* -------------style de la home ------------ */

#conteneur {
	width:955px;
	height:100%;
	margin:auto;
	background-color:#deecff;
}

#bandeau {
	position:relative;
	width:955px;
	height:206px;
}

#logo {
	position: absolute;
/*	width:204px;*/
	width:184px;
/*	height:67px;*/
	height:172px;
	top:0;
}

#recherche {
	position: absolute;
/*	width:239px;*/
	width:259px;
	height:51px;
	top:0;
/*	left:204px;*/
	left:184px;
	background-image: url(../medias/commun/recherche_new.png);
	background-repeat: no-repeat;	
}

#recherche form{
	margin:25px 0 0 20px;
}

#recherche label{
	color:#3076B9;
	font-weight:bold;
}

#recherche .text{
width:80px; 
height:13px;
left:98px;
margin-top:25px; 
border: 1px inset;
}

#recherche .validation{
float:right; 
margin-right:35px;
}

#navig_haut {
	position: absolute;
	width:502px;
	height:38px;	
	top:0;
	left:443px;	
	background-image:url(../medias/commun/navig_haut_new.jpg);
	color:#3076b9;
	padding-left:10px;
}

.texte_haut {
	position: relative;
	float:left;
	width: auto;
	height:18px;
	top:18px;
	background-image:url(../medias/commun/trait_vertical.gif);
	background-repeat: repeat-y;
	background-position:right bottom;
}

.texte_htst {
	position: relative;
	float:left;
	width: auto;
	height:18px;
	top:18px;
}

.texte_lang {
	position: absolute;
	right:10px;
	width: 150px;
	top:-2px;
}

/*
.masque {
	position: relative;
	float:left;
	width:4px;
	height:36px;
	left:-4px;
	background-color:#deecff;
}
*/
#transparent {
	position: absolute;
	width: auto;
	height:34px;
	top:172px;
	left:184px;
	filter:alpha(opacity=60);   /* Internet Explorer 6     */
   -moz-opacity:0.6;           /* Mozilla 1.6 et infér.   */
   opacity: 0.6;               /* CSS3 et Mozilla récents */
}

#insp {
	position: absolute;
	width:178px;
	height: auto;
	top:132px;
	left:770px;
	z-index:6;
	text-align:right;
	font-size:15px;
	font-weight: bold;
	color:#ffffff;
}

#blanc {
	position: absolute;
	width:150px;
	height:10px;
	top:196px;
	left:184px;
}

#nav_gauche_haut {
	position: absolute;
	width:150px;
	height:75px;
	bottom:0px;
//	background-image:url(../medias/commun/haut_nav.gif);
	background-repeat:no-repeat;
	
}

#contenant_gauche {
	position: relative;
	float:left;
	width:184px;
	height: auto;
	top:0px;
	background-color:#deecff;
	z-index:2;
}

#onglet_nav {
	position: absolute;
	width:184px;
	height:10px;
/*	top:140px;*/
	top:162px;
	background-image:url(../medias/commun/onglet_nav.gif);
	background-repeat:no-repeat;
	z-index:2;
}

/*#nav_gauche {
	position: absolute;
	width:150px;
	height:600px;
	top:200px;
	background-image:url(../medias/commun/haut_nav.gif);
	background-repeat:no-repeat;
	background-color:#deecff;
	padding-top:10px;
	z-index:3;
}*/

#nav_gauche {
	position: absolute;
	width:184px;
	height:700px;
/*	top:150px;*/
	top:172px;
//	background-image:url(../medias/commun/haut_nav.gif);
	background-repeat:no-repeat;
	background-color:#deecff;
	padding-top:10px;
	z-index:3;
}

/* fond blanc pour le menu */ 
div#nav_gauche a {color:#3076B9;}
div#nav_gauche ul {padding: 0; width: 184px; margin:0px; background-color:#DEECFF;}

/* fond different au survol de la souris pour les sous menu et les "basiques"*/ 
div#nav_gauche li:hover {/*background: #EDD*/}
div#nav_gauche li.sousmenu:hover {/*color: #4180a3;*/}

/* Rajout d'une petite fleche pour les sous menu */ 
div#nav_gauche li.sousmenu {background-image:url("../medias/commun/trait_menu.gif");background-position:center bottom;background-repeat:no-repeat;cursor:pointer;}

div#nav_gauche ul li {position:relative; list-style: none;}
div#nav_gauche ul ul {position: absolute; top: -1px; left: 100px; display:none}

/* on rajoute une bordure a gauche et des padding, on doit donc r?ajuster la taille 100-(8 de bordure + 8 de padding) =84 */ 
div#nav_gauche li a {text-decoration: none; padding: 0.5em 0 0.5em 6px; display:block; width:178px;}
div#nav_gauche ul.niveau2{background-color:#5d8ba2; width:340px; margin-left:84px;}
div#nav_gauche ul.niveau1 li.sousmenu:hover ul.niveau2, 
div#nav_gauche ul.niveau2 li.sousmenu:hover ul.niveau3 {display:block;}

/* la bordure de chaque hauteur a une couleure de survol*/ 
div#nav_gauche li a:hover {color: #286583;}
div#nav_gauche ul ul li a{display:block; width:320px;color:#fff;}
div#nav_gauche ul ul li a:hover {color:#8dc9e8;}
div#nav_gauche ul ul ul li a:hover {border-left-color: #0000FF;}

#logos_gauche {
	position: relative;
	top:40px;
	width:150px;
	height:auto;
	bottom:2px;
}

#centre {
	position: relative;
	float:left;
	width:567px;
	height:700px;
	top:0px;
	padding:3px 10px 5px 10px;
	background-color: #FFFFFF;
	z-index:2;
}

html>body #centre {
	height: auto;
	min-height:700px;
}

#centre h4 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.3em;
	text-indent: 0px;
	color:#3076b9;
}

#droite {
	position: relative;
	float:left;
	width:184px;
	height: auto;
	top:0px;
	background-image:url(../medias/commun/degrade_dt.jpg);
	background-repeat:no-repeat;
	background-color: #deecff;
}

#footer {
	position: absolute;
	bottom:6px;
	left:0px;
	padding:0px;
	width:150px;
	height:16px;
	z-index:4;
}

.clearfloat {
    	clear:both;
        height:0;
        font-size: 0px;
        line-height: 0px;
}


.trait {
	position: relative;
	float:left;
}

.separation {
	background-image: url(../medias/commun/separation.gif);
	background-repeat:no-repeat;
	margin-top:-6px;
}

.padd_txt {
	padding:0px 3px 0px 8px;
}

.padd_img {
	padding:15px 0px 15px 0px;
}

/* -------------style de la page ------------ */

#bandeau_page {
	position:relative;
	width:751px;
	height:206px;
}

#transparent_page {
	position: absolute;
	width: auto;
	height:34px;
	top:172px;
	left:150px;
	filter:alpha(opacity=60);   /* Internet Explorer 6     */
   -moz-opacity:0.6;           /* Mozilla 1.6 et infér.   */
   opacity: 0.6;               /* CSS3 et Mozilla récents */
}

#chemin_fer {
	position: absolute;
	width:750px;
	height:34px;
	top:178px;
	left:194px;
	z-index:2;
	font-size:11px;
}

#insp_page {
	position: absolute;
	width:178px;
	height: auto;
	top:140px;
	left:570px;
	z-index:6;
	text-align:right;
	font-size:15px;
	font-weight: bold;
	color:#ffffff;
}

#contenant_gauche_page {
	position: relative;
	float:left;
	width:150px;
	height: auto;
	top:0px;
	background-color:#deecff;
	z-index:2;
}

#onglet_nav_page {
	position: absolute;
	width:150px;
	height:10px;
	top:129px;
	background-image:url(../medias/commun/onglet_nav.gif);
	background-repeat:no-repeat;
	z-index:2;
}

#nav_gauche_page {
	position: absolute;
	width:150px;
	height:700px;
	top:139px;
//	background-image:url(../medias/commun/haut_nav.gif);
	background-repeat:no-repeat;
	background-color:#deecff;
	padding-top:10px;
	z-index:3;
}

#centre_page{
	position: relative;
	float:left;
	width:581px;
	height:700px;
	top:0px;
	left:0px;
	padding:3px 10px 5px 10px;
	background-color: #FFFFFF;
	z-index:2;
}

html>body #centre_page {
	height: auto;
	min-height:700px;
}

#droite_page {
	position: relative;
	float:right;
	width:151px;
	height:auto;
	top:-3px;
	right:-10px;
	background-color: #deecff;
}

#footer_page {
	position: absolute;
	bottom:20px;
	left:0px;
	padding:0px;
	width:190px;
	height:16px;
	z-index:4;
}

.separation_long{
	background-image: url(../medias/commun/separation_long.gif);
	background-repeat:no-repeat;
	margin-top:-6px;
}

.haut_page{
	background-image: url(../medias/commun/haut_page.gif);
	clear:both;
	background-repeat:no-repeat;
	text-align:right;
	width:562px;
	height:19px;
}

/* -------------style des liens ------------ */


a:link{
	color:#3076b9;
	font-weight:bold;
	text-decoration:none;
}

a:visited{
	color:#3076b9;
	font-weight:bold;
	text-decoration:none;
}

a:hover{
	color:#286583;
	font-weight:bold;
	text-decoration:none;
}

a:active{
	color:#3076b9;
	font-weight:bold;
	text-decoration:none;
}

a:link.titre{
	color:#3076b9;
	font-weight:bold;
	text-decoration:none;
	font-size:14px;
}

a:visited.titre{
	color:#3076b9;
	font-weight:bold;
	text-decoration:none;
	font-size:14px;
}

a:hover.titre{
	color:#286583;
	font-weight:bold;
	text-decoration:none;
	font-size:14px;
}

a:active.titre{
	color:#3076b9;
	font-weight:bold;
	text-decoration:none;
	font-size:14px;
}

a:link.lien, a:visited.lien, a:hover.lien, a:active.lien{
	color:#3076b9;
	text-decoration:underline;
	font-weight:lighter;
	font-size:12px;
}

a:link.haut, a:visited.haut, a:hover.haut, a:active.haut{
	color:#3076b9;
	font-size:11px;
	text-decoration:none;
	font-weight: normal;
}

a:link.chemin, a:visited.chemin, a:hover.chemin, a:active.chemin{
	color:#ffffff;
	text-decoration: none;
	font-size:11px;
	font-weight:normal;
}

a:link.archives, a:visited.archives, a:hover.archives, a:active.archives{
	color: #000000;
	text-decoration: underline;
	font-size:11px;
	font-weight:normal;
}

a:link.focus_petit, a:visited.focus_petit, a:hover.focus_petit, a:active.focus_petit{
	color: #3076b9;
	text-decoration: none;
	font-size:12px;
	font-weight:bold;
}

/* -------------style du texte ------------ */

.blanc {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color:#FFFFFF;
}

.rouge{
    color:#9a1952;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.3em;
	text-indent: 0px;
}

.bodystyle {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.small {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
}

.medium {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	line-height: normal;
	text-indent: 0px;
	color:#5d8ba2;
}

.xbig {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
}

.expanded {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 24px;
	letter-spacing: 2px;
}

.titre{
	color:#3076b9;
	font-weight:bold;
	text-decoration:none;
	font-size:16px;
}

.focus{
	
	font-weight:bold;
	text-decoration:none;
	font-size:18px;
	
}

.fin_rouge{
    color:#9a1952;
	text-decoration:none;
	text-indent: 0px;
}

.titre_fin_bleu{
	color:#3076b9;
	text-decoration:none;
	font-size:14px;
}

.surtitre {
	font-family: Arial, Helvetica, sans-serif;
	color:#000000;
	font-weight:bold;
	font-size: 12px;
	line-height: 2.9em;
}

.titreune {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	line-height: normal;
	text-indent: 0px;
	color:#3076b9;
}

h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.3em;
	text-indent: 0px;
}

h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 1.3em;
	text-indent: 0px;
	
}

h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	line-height: normal;
	text-indent: 0px;
	color:#9a1952;
}

h4 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.3em;
	text-indent: 0px;
	color:#3076b9;
}

h5 {
	color:#3076b9;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 1.3em;
	text-indent: 0px;
}

h6 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	line-height: normal;
	text-indent: 0px;
	color:#3076b9;
}

img { margin: 0; padding: 0; border: none;  }

a.on { 
	color:#286583;
	font-weight:bold;
	text-decoration:none;
}


/*----------------*/

#decoupe_haut {
	text-align:right;
}

#decoupe_bas {
	text-align:right;
}