/* Fichier CSS principal */

body{
	font-family:"helvetica neue",helvetica,arial,sans-serif;
	font-size: 90%;
	background: #FFFFFF url("../images/fond-degrade2.png") repeat-x top;
	background: -webkit-linear-gradient(top, #e3ecf1 0%, #bccedc 35%);
	background:  -moz-linear-gradient(top, #e3ecf1 0%, #bccedc 35%);
	background:  -ms-linear-gradient(top, #e3ecf1 0%, #bccedc 35%);
	background:  -o-linear-gradient(top, #e3ecf1 0%, #bccedc 35%);
	color: rgb(69,69,69);
}
h1, h2, h3, h4, h5, h6, pre, form, body, html, blockquote, fieldset
{
	margin: 0px;
	padding: 0px;
}
table{
	border-collapse:collapse;
}
img {
	border: 0;
}
a {
	text-decoration: none;
	color: rgb(55,96,146);
}
a:hover {
	text-decoration: underline;
}

a.nodeco {
	text-decoration: none;
}
div.centrale {
	width: 980px;
	margin: 0 auto;
	z-index: 1;
}

div.cleaner {
	clear:both;
	min-height: 0px;
	font-size: 1px;
	border:none;
	margin:0; padding:0;
	background:transparent;
}

/* Autocomplete */

.ui-autocomplete-loading { background: white url('../images/ui-anim_basic_16x16.gif') right center no-repeat; }

.ui-autocomplete {
	font-size: 90%;
	width: 350px;
	max-height: 200px;
	overflow-y: auto;
	overflow-x: hidden;
	padding-right: 10px;
	z-index: 9999;
}

.ui-menu {
	background: #ffffff;
	border: 1px solid rgb(55,96,146);
}
.ui-menu-item {
	border:0;
}

.ui-menu-item a {
	color: rgb(55,96,146);
}
.ui-menu-item a:hover {
	background: #659CD8;
	color: #ffffff;
	font-weight: bold;
}


/* Style des infobulles */
a.info{
    position:relative; /*this is the key*/
    color: rgb(69,69,69);
    text-decoration:none;
	font-weight: bold;
	}
 
a.info:hover{z-index:25; background-color:LightBlue;}
 
a.info span{
	display: none;
	text-align: left;
	position:absolute;
    top:2em; left:-2em; width:350px;
    border:1px solid rgb(120,120,120);
    background-color:#fff; color: rgb(120,120,120);
    font-weight: normal;
    font-size: 90%;
    padding: 10px;
	font-weight: normal;
	}
 
a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
}

/* Pave de recherche */
.recherche{
	float: right;
	width: 340px;
	margin-top: 10px;
	padding: 5px 15px 2px 5px;
    background: #95B3D7 url("../images/degrade-boite2.png") repeat-x top;
    border: 1px solid #bfbfbf;
	/* Do rounding (native in Firefox and Safari) */
    -webkit-border-radius: 12px;
    -moz-border-radius: 12px;
	border-radius: 12px;
}

/* CHART LISTS */
.chartlist {
	font-weight: normal; 
	text-align: left;
	background: White;
	padding: 0;
	margin: 0;
}
.chartlist li { 
	position: relative;
	display: block;
	border-bottom: 1px solid #EEE; 
	_zoom: 1;
	margin: 0.1em 0 0.1em 0;
	font-size: 70%;
}
.chartlist li a {
	display: block; 
	padding: 0.2em 4.5em 0.2em 0.5em;
	position: relative; 
	z-index: 2;
	color: #FFFFFF;
}
.chartlist li a:hover {
	text-decoration: none;
	color: White;
}	
.chartlist .count { 
	display: block; 
	position: absolute; 
	top: -0.3em; 
	right: 0;
	text-align: right; 
	color: Black;
	font-weight: bold;
	line-height: 2em;
	padding: 0;
}
.chartlist .index { 
	display: block; 
	position: absolute; 
	top: 0; 
	left: 0; 
	height: 100%; 
	background: CornflowerBlue; 
	text-indent: -9999px; 
	overflow: hidden; 
	line-height: 2em;
}

.chartlist .index2 { 
	display: block; 
	position: absolute; 
	top: 0; 
	left: 0; 
	height: 100%; 
	background: #c00000; 
	text-indent: -9999px; 
	overflow: hidden; 
	line-height: 2em;
}
.chartlist li:hover { 
	background: #969696; 
}
.chartlist li:hover .count { 
	color: White;
}
.chartlist li:hover .index { 
	background: Black; 
}

/* TIMELINE CHARTS */
.timeline { 
	margin: 0; 
	padding: 0; 
	list-style-type: none;
}
.timeline {
	font-size: 0.75em; 
	height: 200px; 
	padding-bottom: 10px;
	margin-top: 20px;
}
.timeline li { 
	position: relative;
	float: left;
	margin: 0 2px;
	height: 85%;
}
.timeline li a { 
	display: block;
	height: 100%;
	text-decoration: none;
}
.timeline li .label { 
	display: block; 
	position: absolute; 
	bottom: -30px; 
	left: 0; 
	background: #fff; 
	width: 100%;
	height: 30px;
	line-height: 15px; 
	text-align: center;
	vertical-align: middle;
}	
.timeline li a .count { 
	color: White;
	font-weight: bold;
	display: block; 
	position: absolute; 
	bottom: 0; 
	left: 0; 
	height: 0; 
	width: 100%;
	text-align: center;
	background: CornflowerBlue;
	overflow: hidden; 
}
.timeline li a .count2 { 
	display: block; 
	position: absolute; 
	bottom: 0; 
	left: 0; 
	height: 0; 
	width: 100%; 
	background: #c00000; 
	text-indent: -9999px; 
	overflow: hidden; 
}	
.timeline li:hover { 
	background: #969696; 
}
.timeline li a:hover .count { 
	background: Black; 
}

.button2 {
   font-size: 14px;
   font-weight: bold;
   border-top: 1px solid #661616;
   background: #c93c3c;
   background: -webkit-gradient(linear, left top, left bottom, from(#9c3e3e), to(#c93c3c));
   background: -webkit-linear-gradient(top, #9c3e3e, #c93c3c);
   background: -moz-linear-gradient(top, #9c3e3e, #c93c3c);
   background: -ms-linear-gradient(top, #9c3e3e, #c93c3c);
   background: -o-linear-gradient(top, #9c3e3e, #c93c3c);
   padding: 5px 10px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   text-decoration: none;
   vertical-align: middle;
}
.button2:hover {
   border-top-color: #690707;
   background: #690707;
   color: #ccc;
}
.button2:active {
   border-top-color: #421414;
   background: #421414;
}

@media (max-width: 480px) {

 /* passer tous les éléments de largeur fixe en largeur automatique */
 body {
   width: 100%;
   margin: 0;
   padding: 0;
   -webkit-text-size-adjust: none;
 }

.cachemobile {
	display: none;
}

div.centrale {
	width: 100%;
	margin: 10px;
}

 /* fixer une largeur maximale  de 100 % aux éléments potentiellement problématiques 
 img, table, td, blockquote, code, pre, textarea, input, iframe, object, embed, video {
   max-width: 100%;
 }
 conserver le ratio des images et empêcher les débordements de boîtes dûs aux border ou padding 
 img {
   height: auto; width: auto;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }*/

 /* gestion des mots longs */
 
table, td, tr { 
	display: block; 
}

.nobreak table, td, tr {
	display: inline-block;
}

 textarea, table, td, th, code, pre, samp {
   word-wrap: break-word; /* passage à la ligne forcé */
   -webkit-hyphens: auto; /* césure propre */
   -moz-hyphens: auto;
   hyphens: auto;
 }

 code, pre, samp {
   white-space: pre-wrap; /* passage à la ligne spécifique pour les éléments à châsse fixe */
 }

 /* Passer à une seule colonne (à appliquer aux éléments multi-colonnes) */
.boite {
   float: none;
   width: auto;
 }

 /* masquer les éléments superflus */
 .hide_mobile {
   display: none !important;
 }

 /* Un message personnalisé */
 body:before {
   content: "Version mobile du site";
   display: block;
   color: #777;
   text-align: center;
   font-style: italic;
 }
}