/* ==============================================
   FEUILLE DE STYLES DES GABARITS HTML/CSS --- 08
   © Elephorm & Alsacreations.com
   Conditions d'utilisation:
   http://creativecommons.org/licenses/by/2.0/fr/
   ============================================== */


/* --- COULEURS --- */

/* Note: vous pouvez modifier simplement l'aspect de ce gabarit en modifiant
   uniquement les couleurs de fond (propriétés background) et les couleurs
   du texte (propriété color).
   Pour modifier la disposition des blocs, voir plus bas dans la feuille de
   styles la partie «positionnement». */

/* Général */
body {
	color: #333333;
	background: #d3ebf2;
}
a {
	color: #008db7;
}
li  {
	color: #000000;
}
#global {
	width: 950px;
	margin: 25px auto;
	border-color: #008db7;
	border-width: 2px;
	border-style: solid;
}

/* En-tête */
#entete {
	padding: 10px 20px;
	background: #ffffff;
}

/* Navigation */
#navigation {
	background: #008db7;
	padding: 5px 20px;
}
#navigationsub {
	background: #D3EBF2;
	padding: 2px 0px 2px 20px;
}
#navigation a {
	color: #FFFFFF;
	text-decoration: none;
}
#navigationsub a {
	text-decoration: underline;
}
#navigationsub ul {
	width: 100%;
	overflow: hidden;
	margin: 0;
	padding: 0;
	list-style: none;
}
#navigation a:hover, #navigation a:focus {
	background: #ffffff;
	color: #008db7;
}
#navigation ul {
	width: 100%;
	overflow: hidden;
	margin: 0;
	padding: 0;
	list-style: none;
}
#navigation li.gauche {
	float: left;
	margin-right: 25px;
	font-size: 1.1em;
	font-style: normal;
	font-weight: bold;
}
#navigation li.droite {
	float: right;
	margin-right: 0;
	margin-left: 10px;
	padding: 3px 0;
}

/* Bloc central */
#centre {
	background-image: url(../img/colonnes_lightblue.gif);
	background-repeat: repeat-y;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}
#billboard {
	width: 660px;
	float: left;
	margin: 20px 0 20px 0;
	padding: 0 0 0 0;
}

/* Contenu principal */
#principal {
	float: left; /* -> 5 */
	width: 660px;
	padding: 0 20px 0 20px;
	margin: 0 0 0 0;
	background-color: #FFFFFF;
}
#principal a {
	color: #008db7;
}
#principal a:hover, #principal a:focus {
	color: #000000;
}
#principal strong {
	color: #181A12;
}

/* Contenu secondaire */
#secondaire {
	background: #eef7fa; /* -> 2 */
}


/* Bloc central */
#centre {
	width: 100%; /* -> 4 */
	overflow: hidden; /* -> 4 */
}
#principal > :first-child {
	margin-top: 10px;
}
#principal p, #principal li {
	line-height: 1.3;
}

/* Contenu secondaire */
#secondaire {
	margin-left: 720px; /* -> 6 */
	margin-right: 20px;
	padding: 0 0 0 0;
}

/* Mention de copyright */
#copyright {
	margin: 20px 0;
	font-size: .85em;
	text-align: left;
}
#boxmain  {
	background-color: #FFFFFF;
	margin: 0px 20px 30px 0px;
	float: left;
	width: 200px;
	padding: 0px 0px 0px 0px;
}
#boxtitle {
	background-color: #FFFFFF;
	border-left-style: solid;
	border-left-color: #008db7;
	border-left-width: 5px;
	padding-left: 7px;
	color: #85b20c;
	font-weight: bold;
	font-size: 1.2em;
	text-align: left;
}
#boxbody {
	background-color: #FFFFFF;
	padding: 5px 10px;
	margin: 0px 0px 0px 0px;
	border-left-color: #D3EBF2;
	border-left-style: solid;
	border-left-width: 5px;
}
#boximage {
	background-color: #FFFFFF;
	text-align: center;
	padding: 10px 0px 0px 0px;
}
#boximagewborder {
	background-color: #D3EBF2;
	text-align: center;
	padding: 10px;
	border: 2px solid #008db7;
}
#boxlegende {
	background-color: #FFFFFF;
	padding: 5px 0px 10px 0px;
	margin: 0px 0px 0px 0px;
	text-align: center;
}
#boxtext {
	background-color: #FFFFFF;
	padding: 0px 0px;
	margin: 0px 0px 0px 0px;
	width: 100%;
	clear: both;
}
#boxtwocol {
	background-color: #FFFFFF;
	margin: 0 15px 0 0;
	float: left;
	width: 300px;
	padding: 0px 0px 0px 0px;
}
#boxtext  li {
	background-repeat: no-repeat;
	background-position: 0 0.5em;
	background-image: url(../img/triangle_blue.gif);
	padding-left: 8px;
	list-style-type: none;
}
#boxrightdark {
	background-color: #008db7;
	padding: 10px 10px;
	margin: 20px 0px 20px 0px;
	border-color: #d3ebf2;
	border-style: solid;
	border-width: 1px;
}
#boxrightdark  h3 {
	margin: 0 0 10px 0;
	color: #FFFFFF;
}
#boxrightdark p, #boxrightdark a, #boxrightdark strong {
	color: #FFFFFF;
}
#boxrightlight   img {
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	margin-bottom: 10px;
}
a.trianglewhite {
	background-repeat: no-repeat;
	background-position: 0 0.5em;
	background-image: url(../img/triangle_white.gif);
	padding-left: 8px;
}
a.triangleblue {
	background-repeat: no-repeat;
	background-position: 0 0.5em;
	background-image: url(../img/triangle_blue.gif);
	padding-left: 8px;
}
span.blue {
	color: #008db7;
}
span.orange {
	color: #ff6600;
}
span.green {
	color: #85b20c;
}
p.right {
	text-align: right;
	margin-top: 10px;
}
#boxrightlight {
	background-color: #FFFFFF;
	padding: 10px 10px;
	margin: 20px 0px 20px 0px;
	border-color: #008db7;
	border-style: solid;
	border-width: 2px;
}
#boxrightlight h3 {
	margin: 0 0 10px 0;
	color: #008db7;
}
#bottom {
	background: #008db7;
	padding: 1px 20px;
	font-size: 0.9em;
}
#bottom ul {
	width: 100%;
	overflow: hidden;
	margin: 0;
	padding: 0;
	list-style: none;
}
#bottom li.gauche {
	float: left;
	margin-right: 25px;
}
#bottom li.droite {
	float: right;
	margin-right: 0;
	margin-left: 10px;
}
#bottom a {
	color: #FFFFFF;
	text-decoration: none;
}
#navigationsub li {
	float: left;
	margin-right: 0px;
	font-size: 1em;
	font-style: normal;
	color: #008db7;
}