@charset "utf-8";
/* auteur: CedricC 
 Date de creation: 22/07/2008 */
/******************************************************************
	COULEURS
*******************************************************************
******************
    GB
*******************
#1a171b => noir
#867d72 (#9b9184) => gris -> pointilles, contact
#f29400 (#e3621e) => orange -> liens, bandeau
#eb690b => orange fonce
#9b9184 => background de page
/******************
    CC
*******************
#90806e => gris/marron -> input, bordure de tables
#f5f3f0 => gris tres clair -> fond graphes, tableaux
#eb9152 => orange clair ->
#fdeece => blanc casse -> fond table1
******************************************************************
	Taille par defaut ds la plupart des navigateurs : 16px
******************************************************************/
body {
	margin: 1px;
	padding: 1px;
	font: 80% Verdana, Arial, Helvetica, sans-serif;
	color:#000000;
    background: url(images/fond.gif) repeat-x #9b9184;
    /*background-attachment: fixed;*/
}
#conteneur {
    position: relative;
    width: 990px;
    margin: 10px auto auto auto;
	
    background-color: #ffffff;
}
#conteneur_logo_stats{
    position: relative;
    width: 990px;
    margin: 10px auto auto auto;
    /*background-color: #9b9184;*/
}
/*******************************************************************************
    BANDEAU
*******************************************************************************/
#header {
    margin: 5px 0px 0px 0px;
    height: 116px;
    width: 990px;
    background: url(images/bandeau.gif) left bottom no-repeat;
    margin: 0 0;
    padding-bottom: 0;
}
#header h1{
    text-indent: -5000px;
    margin: 0;
    padding-bottom: -10em;
    line-height: 0;
}
/*******************************************************************************
    BAS DE PAGE
*******************************************************************************/
#logo_stats {
    margin-top: 20px;
    margin-bottom: 0px;
    padding: 0;
    float: right;
}
/*****************************
 a utiliser avec un <hr>
 23/12/09 => NE PLUS UTILISER
******************************/
#footer_separateur {
    clear: both;
    display: block;
    height: 1px;
    margin: 5px 10px 0px 10px;
    padding: 0;
    color: #867d72;
    border-style: dashed;
}
#footer_conteneur{
	width: 100%;
	background-color: #000000;
	text-align:center;
}
#footer1 {
    clear: both;
    float: left;
    height: 40px;
    width: 40%;
    background: url(images/contact.gif) left center no-repeat;
    margin: 0px 0px 5px 10px;
}
/*#footer2_1 {
    float: left;
    height: 47px;
    background: url(images/glossaire.gif) left center no-repeat;
    margin: 0px 0px 5px 10px;
}
#footer2_2 {
    float: left;
    height: 47px;
    background: url(images/mentions_legales.gif) left center no-repeat;
    margin: 0px 0px 5px 10px;
}
#footer2_3 {
    float: left;
    height: 47px;
    background: url(images/plan_site.gif) left center no-repeat;
    margin: 0px 0px 5px 10px;
}*/
#footer3 {
    float: right;
    height: 40px;
    background: url(images/logo_ccin.gif) right center no-repeat;
    width: 30%;
    margin: 0px 10px 5px 0px;
}
/****************************************************/
ul #footer{
    text-align:center;
    display: inline;
	padding: 0px;
    margin: 2px 0px 0px 0px;
    /*list-style-image: url(images/fleche.gif);*/
    list-style-type: none;
}
#footer li {
    margin: 0px;
	padding: 0px;
}
#footer a {
	color:#FFFFFF;
}
/*******************************************************************************
    MENU
*******************************************************************************/
#menu {
    float: left;
}
ul #menu {
    list-style-type: none;
    margin: 0;
    padding: 0;
    position:absolute;
}
#menu li {
	display: inline;
	float:left;
}
#menu a {
	display: block;
	border: 0px;
	margin: 0;
	background-color: #FFF;
	color: #FFF;
	text-decoration: none;
	text-align: center;
}
#menu a:hover #menu a:focus{
	color: #000;
}
#menu a span {
	display: none
}
/*******************************************************************************
*******************************************************************************/
#separateur {
	clear: both;
    visibility: hidden;
}
/* utile ? */
#separateur_gauche{
    clear: left;
    visibility: hidden;
}
.separateur {
	clear: both;
    visibility: hidden;
}	
/*******************************************************************************
*******************************************************************************/
a img {
    border-width: 0;
    border-style: none;
}
.img_larg1 {
    width: 280px;
}
/*******************************************************************************
    ACCUEIL
    Structure de page sur 3 col avec largeur definie
*******************************************************************************/
#illustration{
	width: 440px;/*100%; 440px*/
}
div #colonne_gauche{
    float: left;
    width: 28%;/*240px;*/
    height: 100%;
    padding: 10px 10px 0px 20px;
	margin: 0px;
}
div #colonne_centre{
    /*float: left;*/
    /*width: 42%;*/
    height: 100%;
    padding: 10px 10px 0px 10px;
	margin: 0px;
}
div #colonne_droite{
    float: right;
    width: 22%;/*200px;*/
    height: 100%;
    padding: 10px 10px 0px 10px;
	margin: 0px;
}
div #colonne1 p, #colonne2 p, #colonne3 p {
    text-align: justify;
}
div #indic_conj_haut {
    height: 44px;
    width: 209px;	
	background: url(images/indic_conj_haut.gif) no-repeat;
    padding: 0px;
	margin: 0px;
}
div #indic_conj_bas {
    height: 13px;
	width: 209px;
    background: url(images/indic_conj_bas.gif) no-repeat;
	border-width: 0px;
    padding: 0px;
	margin: -1px 0px 0px 0px;
}

div #indic_conj {
    width: 189px;/* 209px - 10px (marge gauche) - 10px (marge droite) */
    background-color: #f29400;
    border-width: 0px;
    padding: 10px;
	margin: -1px 0px 0px 0px;
    text-align: left;
}
div #indic_conj a {
	font: 12pt bold;
	color: #000000;
	text-align: center;
}
div #indic_act_haut {
    height: 44px;
    width: 209px;	
	background: url(images/indic_act_haut.gif) no-repeat;
    padding: 0px;
	margin: 0px;
}
div #indic_act_bas {
    height: 14px;
	width: 209px;
    background: url(images/indic_act_bas.gif) no-repeat;
	border-width: 0px;
    padding: 0px;
	margin: -1px 0px 0px 0px;
}

div #indic_act {
    width: 189px;/* 209px - 10px (marge gauche) - 10px (marge droite) */
    background-color: #9b9084;
    border-width: 0px;
    padding: 10px;
	margin: -1px 0px 0px 0px;
    text-align: left;
}
div #indic_act a {
	font: 12pt bold;
	color: #000000;
	text-align: center;
}
div #indicateurs_texte1 {
    font: 10pt bold;
    color: #FFFFFF;
    text-align:center;
}
div #indicateurs_texte2 {
    font: 8pt bold;
    color: #000000;
    text-align:center;
}
#indicateurs_texte3 {/* utiliser avec span */
    font-style: italic;
}
/*******************************************************************************
 - La 1ere col n a pas de marge gauche contrairement aux autres
 - les col n ont pas de largeur contrairement aux colonnes (dessus)
*******************************************************************************/
/* A SUPPR */
div #gauche{
    float: left;
    margin-right: 10px;
}
/*****************************************
La classe permet de combiner les styles
=> class="gauche img_larg1"
******************************************/
.gauche {
    float: left;
    margin-right: 5px;
}
.droite_avec_margegauche {
    float:right;
    margin-left:20px
}
.droite_liens {
    height:100%;
    padding:10px;
    background:#f5f3f0;
}
/**********/
div #col_gauche_prem {
    float: left;
    height: 100%;
    margin: 10px 20px 10px 20px;
}
div #col_gauche_suiv {
    float: left;
    height: 100%;
    margin: 10px 20px 10px 20px;
}
div #col_droite {
    float: right;
    height: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 20px;
    margin-right: 20px;
}
div #justify{
    text-align: justify;
}
/******************************************************************************/
p {
    text-align: justify;
}
#p1 {
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 3px;
    margin-right: 3px;
}
#p_bord1{
    border-style: solid;
    border-width: 1px;
    border-spacing: 0px;
    border-color: #000000;
    margin-left: 0px;
    margin-right: 20px;
    background-color: #F5F3F0;
}
/******************************************************************************/
#pointilles{
    display: block;
    /*width: 100%;*/
    height: 1px;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 0;
    color: #867d72;
    border-style: dashed;
}
em {
    text-align: justify;/* marche pas */
    margin-left: 10px;
    margin-right: 10px;
    padding: 0;
}
/*******************************************************************************
    LIENS
*******************************************************************************/
a, a:visited {
   color: #f29400;
   text-decoration: none;
}
a:hover, a:active {
   font : bold;
   color: #f29400;
   text-decoration: underline;
}
/********************************************/
.a_coul0 {
    color: #1a171b;
}
.a_coul0:hover,.a_coul0:active,.a_coul0:visited {
   font : bold;
   color: #1a171b;
   text-decoration: underline;
}
/*******************************************************************************
    TITRES
*******************************************************************************/
.titre_accueil {
    margin: 3px 0px 0px 5px;
    font:13pt bold;
    color: #eb690b;
    text-align:left    
}
h1 {
    font:15pt bold;
    color: #f29400;
    text-align:left
}
h2 {
    font:13pt bold;
    color: #867d72;
    text-align:left
}
h3 {
    font:11pt bold;
    color: #f29400;
    text-align:left
}
h4 {
    font:9pt bold;
    color: #eb690b;
    text-align:left
}
.h_sans_sautdeligne {
    /* ex d utilisation : <h4 class="h_sans_sautdeligne">*/
    margin-bottom: 2px;
}
/*******************************************************************************
*******************************************************************************/
.source {
    font: 8pt bold;
    color: #867d72;
}
.texte_centre {
    text-align: center;
}
.texte_justifie {
    text-align: justify;
}
.gras {
    font: bold;
}
/**********************************************************
 <div class="texte_centre texte_sans_sautdeligne""></div>
***********************************************************/
.texte_sans_sautdeligne {
    margin-bottom: -20px;
}
/*******************************************************************************
    TABLES
*******************************************************************************/
#table1 {
    width: 80%;
    border-style: solid;
    border-width: 1px;
    border-color: #90806e;
    background-color: #fdeece;
}
/********************************************************
    Les classes sont preferables aux identifiants car
    elles sont combinables (contrairement aux id)
    => class="table_bord1 table_larg1"
*********************************************************/
.table2 {
    width: 100%;
}
.table_fond_coul1{
    background-color: #f5f3f0;
}
.table_bord1{
    border-style: solid;
    border-width: 1px;
    border-spacing: 0px;
    border-color: #000000;
}
.table_bord2{
    border-style: solid;
    border-width: 1px;
    border-spacing: 0px;
    border-color: #000000;
    
}
.table_bord3{
	border-collapse: collapse;
	width: 100%;
}
.table_larg1{
    width: 100%;
}
.col_9_1{
	text-align: left;
	border-style: solid;
    border-width: 1px;
    border-spacing: 0px;
    border-color: #777777;
	width: 25%;
}
.col_9_2_c{
	text-align : center;
	border-style: solid;
    border-width: 1px;
    border-spacing: 0px;
    border-color: #777777;
	width: 9%;
}
.col_9_2_d{
	text-align : right;
	border-style: solid;
    border-width: 1px;
    border-spacing: 0px;
    border-color: #777777;
	width: 9%;
}
.col_14_1{
	text-align: left;
	border-style: solid;
    border-width: 1px;
    border-spacing: 0px;
    border-color: #777777;
	
}
.col_14_2_c{
	text-align : center;
	border-style: solid;
    border-width: 1px;
    border-spacing: 0px;
    border-color: #777777;
	width: 7%;
}
.col_14_2_d{
	text-align : right;
	border-style: solid;
    border-width: 1px;
    border-spacing: 0px;
    border-color: #777777;
	width: 7%;
}
.td_gras1{
    font-weight: bold;
}
.td_titre1 {
    font-weight: bold;
    text-align: right;
}
.td_r {
    text-align: right;
}
.td_left {
    text-align: left;
}
.td_larg0 {
    width: 12%;
}
.td_larg1 {
    width: 15%;
}
.td_larg2 {
    width: 20%;
}
.td_larg3 {
    width: 30%;
}
.td_larg4 {
    width: 50%;
}
/*
table #table2 {
        border-style:none;
        border-width:0px;
        border-spacing:0px;
        background-color:#FFFFFF;
        background-image:url(images/fond.gif);
        background-repeat:no-repeat;
        background-position:right bottom;
        margin:0px }
*/
/*******************************************************************************
*******************************************************************************/
.fond_coul1 {
    background-color: #eb9152;
}
.fond_coul2 {
    background-color: #F9BB67;
}
/*******************************************************************************
*******************************************************************************/
.no_print{
    
}
/*******************************************************************************
    FORMULAIRES
/******************************************************************************/
#select0 {
    width: 170px;
    background-color: #f5f3f0;
}
#select1 {
    width: 320px;
    background-color: #f5f3f0;
}
#select2 {
    width: 340px;
    background-color: #f5f3f0;
}
#input1 {
    width: 220px;
    background-color: #f5f3f0;
    color: #90806e;
}
/*******************************************************************************
    LISTES
/******************************************************************************/
ol.ol1 {
    list-style-type:upper-alpha;
}
.ul_sanspuce {
    list-style-type: none;
}
#liste1{
    margin-left: 30px;
    padding-left: 0;
    list-style-image: url(images/puce1.jpg);
}
.liste2 {
    font: bold;
}
/******************************************************************/
.source {

}
/*******************************************************************************
    PUB
*******************************************************************************/
div #pub {
	position: absolute;
	left: 38%;
	top: 160px;
	visibility:visible;
	background: url(images/pub.gif) no-repeat;
	width: 604px;/*357px;*/
	height: 329px;/*222px;*/
	margin: auto;
}
div #pub_texte{
	position: relative;
	margin: 10px;
	padding: 0px;/*padding: 0px;*/
	visibility:visible;
	display:block;
}
div #pub_bouton_fermer{
	position: absolute;
	left: 85%;
	top: -5px;
	visibility: visible;
}
div #pub460x250 {
	position: absolute;
	left: 52%;
	top: 160px;
	visibility:visible;
	background: url(images/pub460x250.gif) no-repeat;
	width: 463px;
	height: 254px;
	margin: auto;
}
div #pub460x250_bouton_fermer{
	position: absolute;
	left: 85%;
	top: -5px;
	visibility: visible;
}