﻿/* ========================================*/
/*       FEUILLE DE STYLES HTML/CSS  	   */
/*=========================================*/

body {
	color: #8B747F;
}

hr {
	clear: both;
	visibility:hidden;
	margin: 0;
	padding: 0;
}

.floatRight {
	float: right; 
	margin: 0 10px 10px 10px; 
}



.floatLeft {
	float: left;
	margin : 0 10px 10px 0;
}

.centerImage {
	margin-left : 70px;
}

.margeGauche {					/* Pages actualité et solutions */
	margin-left:50px; 
}

.back_red {
	background-color: #DA2A26;
}

em {
	font-style: italic;
}

.red {
	font-weight: bold;
	color: #DA2A26;
}

.white {
	font-weight:normal;
	list-style:none;
	color: #FFF;
}

.smallFont {
	font-size: 0.8em;
}

.mediumFont {
	font-size: 1.2em;
	margin:10px 0;
}

.margeBas {
	margin-bottom: 20px; 
}

.margeHaut {
	margin-top: 20px; 
}
.borderTop {
	border-top:1px solid #FFF; 
}
.borderBottom {
	border-bottom:1px solid #DA2A26; 
}

.fondGris {
	background-color:#8B747F; 	
}

.defile {
	overflow-y: scroll ;	
	height:715px;
}

	

/* ----------------------------- */
/*            Positionnement     */
/* ----------------------------- */

#global {
	/*background: FFF;*/
	width: 90%;
	max-width: 90em;
	min-width: 850px;
	margin-left: auto;
	margin-right: auto;
}

/* ----------------------------- */
/*           header            */
/* ----------------------------- */

#header, #header_admin {
	padding: 0;	
	margin: 0;
	margin-right: 11px;
	margin-left:0px;
	padding-bottom: 5px;
	border-bottom: 1px solid #DA2A26;
	
}

#header {
	/*Suppression du background pour laisser place au swf*/	
}
#header_admin {
	/*background: url(../images/header_bg.png) repeat-x;*/	
}
#header .titre, #header_admin .titre {
	top:50px;
	right:130px;
	/*position:absolute, fixed;*/
	font-family:Verdana, Geneva, sans-serif;
	font-weight:normal;
	font-size: 1.8em;
	font-variant:normal;
	color:#FFF;
	background-color:#000;
	font-style: italic;
}

#header .sous-titre, #header_admin .sous-titre {
	top:120px;
	right:110px;
	position: absolute;
	font-family:Banff rounded MT Bold;
	background-attachment: fixed;
	font-size: 1.8em;
	margin: 0;
	padding: 0;
	color: #FFF;
}

#header img, #header_admin img{
	margin: 0;
	padding: 0 ;
}



/* ----------------------------- */
/*    Bloc central et fond       */
/* ----------------------------- */

#centre {
	width:1090px;
	background-color:#FFF;
	padding: 0;	
	margin:0;
}

.top-bloc {
	background:url(../images/top.png) no-repeat;
	width:1160px; 
	height: 10px;
	}
	
#centre-bis {
	width: 100%;
	overflow: hidden;
	background: url(../images/body.png) repeat-y ; 
	padding: 0;	
	margin:0;	
}

.bas-bloc {
	background:url(../images/bottom.png) no-repeat;
	width:1160px; 
	height:69px;
	clear:both;
}

/* ----------------------------- */
/*            Partie gauche      */
/* ----------------------------- */

#blocLeft {
	float: left;
	padding: 0;
	margin: 0; 
	width: 202px;
}

/* ----------------------------- */
/*            menu               */
/* ----------------------------- */

#menu {
	padding:0;
	margin: 50px 20px;
	background-color:#FFF;
	width:160px;
}

#menu a {
	display: block;
	line-height: 2;
	text-decoration: none;
  	color: #8B747F;
  	font-size: 1em;
  	font-weight: bold;
  	font-variant:small-caps;
	
}

#menu a:hover, #menu a:focus {
	background: #DA2A26;
    color: #FFF;
}

#menu ul {
	padding: 0; 
	margin: 0; 
	border-top: 1px solid #DA2A26;  /* la première ligne */
}

/* fond different au survol de la souris pour les sous menu et les "basiques" */ 
#menu li, li:hover{
	border-bottom: 1px solid #DA2A26;
	list-style-type: none;
}

#menu li.niveau2{
	border-bottom: 1px solid #FFF;
	list-style-type: none;
}

.CollapsiblePanelTabM a:hover{
	background: #DA2A26;
    color: #FFF;
}

.CollapsiblePanelTabM a:focus{
	background: #DA2A26;
    color: #FFF;
}

.CollapsiblePanelContentM {
	background: #8B747F;
}

#menu a.sousmenu{
	color: #FFF;
	text-decoration: none;
	border-bottom: 1px solid #FFF;
	display:block;
}

#menu a.sousmenu:hover, #menu a.sousmenu:focus {
	background: #DA2A26;
    color: #FFF;
}

/* on rajoute une bordure a gauche et des padding, on doit donc réajuster la taille 160-(0 de bordure + 20 de padding) =152 */ 
#menu li a {
	padding: 4px 10px; 
	display:block; 
	width:140px;
	/*  border-left: 4px solid #DA2A26;  */
}

/* ----------------------------- */
/*            Contact            */
/* ----------------------------- */

#contact {
	clear: both;
	background-color:#FFF;
	padding:0;
	margin: 20px;
	width:160px;
}

#contact p{
	font-size: 0.9em;
}

#contact a  {
	text-decoration: none; 
	color: #DA2A26;
}

#contact a:hover{
	text-decoration: underline; 
}

#contact img {
    float: left; 
    padding-right: 5px; 
}
/* ----------------------------- */
/*    Principal&blocRight           */
/* ----------------------------- */
#principal_blocRight{
	margin-left: 200px;
	border-left: 1px solid #DA2A26;
	/*overflow: hidden;  marche pour ie mais pas avec chrome*/
	/*position: relative;*/
	/*max-height: inherit;*/

}

#principal_blocRight:after{
	content: "";
	display: block;
	clear: both;
}

/* ----------------------------- */
/*            Principal             */
/* ----------------------------- */

#principal {
	min-width: 594px;
	min-height:650px;
	margin: 0;
	/*margin-left: 200px;*/
	margin-right: 251px;
	padding: 20px;
	background-color:#FFF;
	/*border-left: 1px solid #DA2A26;*/
	border-right: 1px solid #DA2A26;

}

#principal2, #lien, #info, #admin {
	min-height:400px;
	background-color:#FFF;
	margin-left: 200px;
	margin-right: 11px;  /* marge pour l'image de fond du centre */
	padding: 20px;
	border-left: 1px solid #DA2A26;
}

#principal p, #principal2 p{
	line-height: 1.5;
}

#principal ul{
 	display: list-item;
	line-height: 1.5;
	list-style-type:none;
}
#principal li{
	border: none;
	margin: 0 0 0 10px;  /* retrait entre marge et puce */
	padding-left: 10px;  /* retrait entre puce et texte */
	/* background: url(../images/puce_red.png) no-repeat 0 50%;  --- Ne s'aligne pas sur la première ligne --- */
	list-style-image: url(../images/puce_red.png);
}

#principal a{
	color: #8B747F;
	text-decoration:underline;
}
#principal a:hover, #principal a:focus{
	font-weight: bold;
	text-decoration:underline;
}

#principal img, #principal2 img{
	padding : 10px 2px;
}

#principal table{
	width:80%;
	margin: 20px 0; 
}

#principal table td, #principal table tr{
	font-size: 12px;
}

#principal table img{
    float: left; 
    padding : 0 8px 0 0; 
	border:none;
}
#principal form table {
	width:100%;
	margin: 0; 
	margin-bottom: 20px; 
}

#principal2 table {  
	width:90%;
	margin: 5px 5px;
	padding-top:30px; 
}
#principal2 td { 
	padding: 5px 5px; 
}

#action{
	width: 350px;
}

#actionRight{
	width: 450px;
	float: right;
	overflow: hidden;
}

#action form{
	width: 300px;
}

#action table{
	width:195px;
	margin: 0px, 0px;
	padding-top: 0px;
}

#action td{
	paddind: 0px 0px;
	margin: 0px 0px;
}

/* ----------------------------- */
/*    Références (canton)        */
/* ----------------------------- */
#encart {
	width:400px;
}

#encartRight{
	width:400px;
	float:right;
}

#encartBord {
	border-bottom: 1px solid #8B747F;
	border-left:   1px solid #8B747F;
	border-right:  1px solid #8B747F;
}

#encartRight ul, #encart ul{
	display : list-item;
	line-height: 1.5;
	list-style-type: none;
}

#encartRight li , #encart li  {
	border:none; 
	background: none; 
	list-style-type: none;
}

#encartRight li a, #encart li a{
	color:#8B747F;
	text-decoration:underline;
}
#encartRight li a:hover, #encartRight li a:focus,
#encart li a:hover, #encart li a:focus{
	color:#DA2A26;
	font-weight: bold;
	text-decoration:none;
}

/* ----------------------------- */
/*			 Emploi				 */
/* ----------------------------- */

#emploi ul{
	display : list-item;
	line-height: 1.5;
	list-style-type: none;
}

#emploi li{
	border:none; 
	background: none; 
	list-style-type: none;
}

#emploi li a{
	color:#8B747F;
	text-decoration:underline;
}
#emploi li a:hover, #emploi li a:focus{
	color:#DA2A26;
	font-weight: bold;
	text-decoration:none;
}

/* ----------------------------- */
/*            Secondaire         */
/* ----------------------------- */

#blocRight {
	width: 240px;
	float: right;
	padding:0;
	margin: 0 11px 0 0;
	/*margin-right: 11px;*/
	border-left: 1px solid #DA2A26;
}

#blocRight p{
	padding:20px;	
}
#blocRight table{   /* tableau des références (canton) */
	width:90%;
	margin: 20px 20px;
	padding: 0;
}
#blocRight td{ 
	padding: 5px 5px; 
}
#blocRight table img{
	border:none;
	padding: 0;
	margin: 0;
}

#blocRight table a{
	color:#8B747F; 
}
#blocRight table a:hover, #blocRight table a:focus{
	text-decoration:underline;
}

#secondaire {
	background-color:#8B747F; 
	padding:0;
	margin:0; 
}

#secondaire p {
	line-height: 1em;
	font-size: 0.9em;
	margin: 0;
	padding: 3px 20px; 
	color:#FFF;
}
#secondaire  a {
	color: #DA2A26;
	text-decoration: underline;
}
#secondaire  a:hover, #secondaire  a:focus {
	text-decoration: underline;
}

/* ----------------------------- */
/*       Page login et admin     */
/* ----------------------------- */
#secondaire ol {
 	display : list-item;
	line-height: 1.5;
	padding: 20px 0;
	color:#FFF;
}
#secondaire ol li {
	line-height: 1.5;
	padding: 0 20px;
	border:none;
	
}
#secondaire p {
	line-height: 1.5;
	color:#FFF;
}

/* ----------------------------- */
/*        Sous-navigation        */
/* ----------------------------- */

#nav_sec {
	padding: 0;
	margin: 0; 
}

#nav_sec ul {
	background-color:#DA2A26; 	
	list-style-type: none;
	line-height: 2;
	margin: 0; 
}

#nav_sec li {
	border-bottom: 1px solid #FFF; 
	padding: 5px 20px; 
	margin: 0; 
	font-weight:bold;
	color: #FFF;
}

#nav_sec li a {
	display:block;
	color: #FFF;
	text-decoration: none;
	font-weight: normal;
}

.CollapsiblePanelContent { /*Menu Aide en ligne + Nouveauté dans l'espace réservé au client (menu déroulant) */
	color: #FFF;
	font-weight: normal;
	background-color:#FFF;
	padding-left: 10px;
}

#nav_sec a:hover, #nav_sec a:focus {
	text-decoration: none;
	font-weight: bold;
}

.sousMenu {					/* Navigation Solutions - Sous modules */
	padding-left:70px; 
}


/* ----------------------------- */
/*            Footer             */
/* ----------------------------- */

#footer {
	width: 1080px;
	clear: both;
	min-height: 20px;
	font-size: 0.8em;
	margin: 0; 
	padding: 0;
	border-top:1px solid #DA2A26 ;
}

#footer a {
  text-decoration: none;
}

#footer a:hover, #footer a:focus, #footer a:active {
  text-decoration: underline;
}

/* Espace entre liens secondaires et pied */
#footer-menu {
	margin: 0; 
	padding: 0;
}

#footer-menu p {
  margin: 0;
  padding: 0;
}

/* Mise en page des liens secondaires */
#footer-menu ul {
  text-align: right;
  padding: 20px 20px 20px 0;
}

#footer-menu ul li {
  display: inline;
  margin-left: 30px; /* espacement entre les liens */
  border:none;
}

#footer-menu ul a {
  text-decoration: none;
  color:  #DA2A26;    
  font-size: 1em;
  font-weight: bold;
  font-variant: small-caps;
}

#footer-menu ul a:hover, #footer-menu ul a:focus, #footer-menu ul a:active {
	font-size: 1.2em;
}

#footer-end #presentation {
  width: 1080px;
  float: left;
  line-height: 1px;
  padding: 0;
  margin: 0; 
  background-color: #DA2A26 ;
}

#footer-end #presentation p {
  	padding: 10px;
	color: #FFF;
	text-align: center; 
}
	
#footer-end #footer-menu div.spacer {
  clear: both;
  padding: 0;
  margin: 0; 
}

/* ----------------------------------------------------------- */
/*        Affichage des images en premier plan (lightbox)      */
/* ----------------------------------------------------------- */

#filter
{
	display: none;
	position: absolute;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	background-color: #000FFF;
	z-index:10;
	Opacity:0.5;
	filter: Alpha(Opacity=50);
}


#box 
{
	display: none;
	position: absolute;
	top: 20%;
	left: 20%;
	width: 60%;
	height: 60%;
	padding: 0;
	margin:0;
	border: 1px solid black;
	background-color: white;
	z-index:11;
}


#boxcontent
{
	left:0;
	right:0;
	bottom:0;
	margin:0;
	padding: 8px;
	overflow: auto;
	width:100%;
	height:100%;
	cursor:hand;
}

#boxtitle
{
	left:0%;
	width:100%;
	height:20px;
	padding:0;
	margin:0;
	color:black;
	text-align:center;
}

