/******************************************************************************************************************************************************************************************************/
/* CSS WEST INTERACTIVE                                                                                                                                                                               */
/* Dernière modification le 12/04/2010                                                                                                                                                                */
/******************************************************************************************************************************************************************************************************/

/******************************************************************************************************************************************************************************************************/
/* Elements principaux                                                                                                                                                                                */
/******************************************************************************************************************************************************************************************************/

/* Style partagé */
* {
	font-family: Verdana, Geneva, sans-serif;
	font-size:   12px;
}

/* Corps de la page */
body {
	background: url(../images/fond.jpg) repeat-x #327fae;
	margin:     0px;
	padding:    0px;
}

/* Titres */
h1 {
	display:             none;
}
h2, h3 {
	display:             block;
	margin:              0px;
	padding:             0px;
	background:          url(../images/plusH2.gif) no-repeat 1px 1px;
	height:              16px;
	text-indent:         22px;
	font-size:           14px;
	line-height:         17px;
	padding-bottom:      2px;
	margin-bottom:       14px;
}
h3 {
	font-size:           13px;
	margin-bottom:       0px;
}

/* Séparateurs */
div.separateur {
	background: url(../images/separateur.gif) center no-repeat;
	width:      780px;
	height:     4px;
	margin:     15px 0px 19px 0px;
	padding:    0px;
	border:     0px;
}

/* Différentes couleurs */
.rouge {
	font-weight: bold;
	color:       #bc1d1d;
}
.bleu {
	font-weight: bold;
	color:       #0089a7;
}
.gris {
	font-weight: bold;
	color:       #475251;
}

/* Lettrine */
span.lettrine {
	font-weight: bold;
	color:       #bc1d1d;
	float:       left;
	font-size:   30px;
	line-height: 28px;
	margin:      0px;
	padding:     0px;
}

/* Paragraphe justifié */
div.justifie {
	text-align: justify;
}

/******************************************************************************************************************************************************************************************************/
/* Menu haut                                                                                                                                                                                          */
/******************************************************************************************************************************************************************************************************/

/* Position du fond */
div.fondMenu {
	display:        block;
	width:          800px;
	height:         28px;
	background:     url(../images/menu.jpg);
	margin:         154px auto 0px auto;
}

/* Menu */
ul.menu {
	display:        block;
	position:       absolute;
	left:           50%;
	width:          775px;
	height:         28px;
	line-height:    28px;
	vertical-align: middle;
	padding:        0px 25px 0px 0px;
	margin:         0px 0px 0px -400px;
	list-style:     none;
	top:            154px;
	z-index:        3;
}

/* Position des liens */
ul.menu li {
	float:        right;
	padding-left: 25px;
}

/* Liens */
ul.menu li a {
	color:           #FFF;
	font-weight:     bold;
	font-size:       14px;
	text-decoration: none;
}
ul.menu li a:hover {
	text-decoration: underline;
}

/******************************************************************************************************************************************************************************************************/
/* Titre flash                                                                                                                                                                                        */
/******************************************************************************************************************************************************************************************************/

/* Position du titre flash */
div.titreFlash {
	position:    absolute;
	top:         0px;
	left:        50%;
	margin-left: -490px;
	z-index:     1;
}

/******************************************************************************************************************************************************************************************************/
/* Contenu                                                                                                                                                                                            */
/******************************************************************************************************************************************************************************************************/

/* Zone complète */
div.zoneContenu {
	top:      190px;
	width:    800px;
	left:     50%;
	margin:   0px 0px 0px -400px;
	padding:  0px 0px 20px 0px;
	position: absolute;
	z-index:  2;
}

/* Haut et bas du contenu */
div.hautContenu,
div.basContenu {
	display:    block;
	float:      left;
	background: url(../images/basContenu.gif);
	height:     10px;
	width:      800px;
}

/* Haut du contenu */
div.hautContenu {
	background: url(../images/hautContenu.gif);
}

/* Contenu */
div.contenu {
	display:    block;
	float:      left;
	width:      780px;
	padding:    0px 10px 0px 10px;
	background: url(../images/contenu.gif);
}

/******************************************************************************************************************************************************************************************************/
/* Pied de page                                                                                                                                                                                       */
/******************************************************************************************************************************************************************************************************/

/* Bloc pied de page */
div.pied {
	display:        block;
	width:          800px;
	height:         28px;
	line-height:    28px;
	vertical-align: middle;
	text-align:     center;
	margin:         10px 0px 0px 0px;
	color:          #FFF;
	background:     url(../images/pied.jpg);
	float:          left;
}

/******************************************************************************************************************************************************************************************************/
/* Triptique accueil                                                                                                                                                                                  */
/******************************************************************************************************************************************************************************************************/

/* Bloc principal */
div.triptique {
	background:    url(../images/fondTriptique.gif);
	height:        195px;
	padding:       0px;
	border-bottom: 1px solid #cccccc;
	border-top:    1px solid #cccccc;
}

/* Mise en page des trois blocs*/
div.triptique div.bloc1,
div.triptique div.bloc2,
div.triptique div.bloc3 {
	width:   250px;
	height:  178px;
	float:   left;
	display: inline;
	padding: 7px 0px 0px 0px;
}

/* Détails des blocs */
div.triptique div.bloc1 {
	background: url(../images/chiffre1.jpg) top right no-repeat;
	margin:     0px 0px 0px 10px;
}
div.triptique div.bloc2 {
	background: url(../images/chiffre2.jpg) top right no-repeat;
	margin:     0px 5px;
}
div.triptique div.bloc3 {
	background: url(../images/chiffre3.jpg) top right no-repeat;
	margin:     0px 10px 0px 0px;
}

/* Zones de texte */
div.triptique div.texte {
	height: 114px;
}

/* Liens */
div.triptique a {
	display:         block;
	text-align:      right;
	text-decoration: none;
	width:           100px;
	vertical-align:  middle;
	float:           right;
}