/* CSS Document */

* { padding:0; margin:0; }
body { background:#F2F2F2; font: 12px Arial, Helvetica, sans-serif; color:#333; }

/* Balises */
a { color: #0088cc; text-decoration: none; }
a:hover { text-decoration: underline; }
img { border:0; }
.both { clear:both; }
.center { text-align:center; }
.link { margin-bottom:0; text-align:right; }
h1 { font: 35px Arial; margin-bottom:20px; }
#baseline { font-size:20px; color:#797677; line-height:28px; }
h2 { font-size:13px; margin-bottom:10px; color:#0088CC; }
h3 { font-size:12px; margin-bottom:5px; }
p { margin-bottom:10px; line-height: 18px; }
ul { margin: 0 0 6px 20px; line-height: 18px; }
li { padding-bottom: 4px; }
.img { padding:2px; border:1px solid #EEE; }

/* Form */
form { margin:auto; }
label { display: block; float:left; width:110px; text-align:right; margin-right:10px; }
input[type=text], input[type=password]  { width:190px; font: 12px Arial; padding:2px; border:1px solid #DDD; color:#333; }
input[type=submit] { font: 12px Arial; }
textarea { font: 12px Arial; width:290px; height:120px; border:1px solid #DDD; color:#333; }

/* Site */
#site { width:980px; margin: 30px auto 0; position:relative; }

/* Header */
#header { position:relative; height:30px; }
#header #logo { float:left; width:300px; margin-left:30px; }
#header h1 span { margin-left:20px; position:absolute; top:0; left:0; height:30px; width:300px; background: url('../pictures/design/logo.jpg') no-repeat; }

/* Menu */
#menu { float:right; width:560px; }
#menu ul { position: relative; height:25px; list-style: none; margin:0; margin-right:15px; }
#menu li { float: left; }
#menu a { z-index:10; position:relative; display: block; width:88px; font-weight:bold; font-size:12px; text-align:center; padding:2px 0px; color:#797677; }
* html #menu a { padding-bottom:0; }
#menu a:hover { text-decoration:none; }
#menu li.back { background: url('../pictures/design/bg_menu.jpg') no-repeat; z-index:8; position:absolute; height:21px; }

/* Fil d'Ariane */
#ariane { float:right; font-size: 11px; color:#797677; }
#ariane a { color:#797677; }

/* Content */
#top { background: url('../pictures/design/top_content.jpg') no-repeat; height:8px; overflow:hidden; }
#bottom { background: url('../pictures/design/bottom_content.jpg') no-repeat; height:9px; margin-bottom:18px; }
#content { background:#FFF; border-left:1px solid #DDD; border-right:1px solid #DDD; padding: 20px 30px; }
#content #left { float:left; }
#content #right { float:right; }
#content .carre { float:right; width:398px; height:105px; padding:10px 15px; font-size:11px; cursor:pointer; text-align:justify; background: url('../pictures/design/bg_carre.jpg') no-repeat; }
.carre h2 { font-size:12px; }
#content .colspan { width:560px; height:184px; background: url('../pictures/design/bg_colspan.jpg') no-repeat; padding:8px 20px; margin-bottom:15px; }
#content .colspan h2 { margin: 0 0 24px 5px; }
#content .colspan img { padding:2px; border:1px solid #EEE; }
#content .cols { float:left; width:166px; height:184px; margin-right:15px; background:url('../pictures/design/bg_cols.jpg') no-repeat; padding:8px 12px; }
#content .cols h2 { text-align:center; margin-bottom:16px; }
#content .cols img { padding:2px; border:1px solid #EEE; margin-bottom:6px; }
#content .block { width:220px; border:1px solid #DDD; padding:10px; margin-bottom:20px; }

/* Line */
#line { background: url('../pictures/design/bg_line.jpg') no-repeat; height:24px; margin-bottom:0px; padding: 7px 12px; }
#line p { margin-bottom:0; font-weight:bold; }

/* Banner */
#banner { background: url('../pictures/design/banner.jpg') no-repeat; height:134px; margin-bottom:20px; padding: 10px 15px; }
#banner2 { background: url('../pictures/design/banner2.jpg') no-repeat; height:115px; margin-bottom:20px; padding: 10px 15px; }

/* Footer */
#footer { clear: both; height:60px; color:#000; font-size:11px; border-top:1px solid #DDD; color:#797677; }
#footer p { padding: 7px 10px 0 10px; margin:0; }
#footer a { color:#797677; }
#footer p.left { float:left; width:630px; }
#footer p.right { float:right; width:270px; text-align:right; }
#form { margin-left:250px; }
#form p { margin:0; line-height:normal; padding:2px; }
#form input[type=text], input[type=password] { width:80px; font-size:11px; }
#form input[type=submit] { font-size:11px; }

/* Messages utilisateur */
.infos { color:green; background: url('../pictures/design/accept.png') no-repeat; height: 20px; padding-left: 24px; line-height:16px; }
.avertissement { color:#FB7D28; background: url('../pictures/design/error.png') no-repeat; height:20px; line-height:16px; padding-left: 24px; }
.avertissement a { color:#FB7D28; }
.erreur { color:red; background: url('../pictures/design/exclamation.png') no-repeat; height:20px; line-height:16px; padding-left:24px; }
.erreur a { color:red; }

/* Carrousel */
.carrousel { height:130px; margin:0; } 
.carrousel-conteneur { width:830px; float:left; margin-left:15px; overflow:hidden; }
.carrousel li { float:left; width:170px; list-style:none; text-align:center; font-size:11px; }
.carrousel img { padding:2px; border:1px solid #EEE; }

/* Slideshow */
#featured-slideshow { height:200px; width:580px; margin-top:20px;  }
#featured-slideshow .slide { width:550px; }
#nav { list-style:none; position:absolute; z-index:10; top:290px; left:542px; font-size:12px; }
#nav li { text-align:center; float:left; line-height:22px; }
#nav a { display:block; width:15px; height:22px; text-decoration:none; margin-right:2px; background:url('../pictures/design/step.png') right top; }
#nav a:hover, #nav a.activeSlide { color:#000; background:url('../pictures/design/step.png') right bottom; }