@charset "utf-8";

/* ==================================================
 CSS Document créé le 16/09/2008 par Anne-Lise Lambin
 Testée valide CSS2 le ../../..
================================================== */


/* ###############################
###                            ###
###         GENERAL            ###
###                            ###
################################*/

*{
margin:0;
padding:0;
}

p{
margin-top:5px;
margin-bottom:5px;
}

a img{
border:none;
}

a{
outline:none;
}

/* ###############################
###                            ###
###          DESIGN            ###
###                            ###
################################*/

/* ====================================================== BACKGROUND */

body{
background:url(design/bg.gif) repeat-x #f7f7f7;
font-family: Verdana, Arial, Helvetica, sans-serif;
}

#bg2{
background:url(design/bg2.gif) repeat-x;
height:101px;
position:absolute;
top:400px;
width:100%;
z-index:100;
}

#deco{
background-image:url(design/deco.png);
width:117px;
height:127px;
position:absolute;
right:0;
top:0;
z-index:600;
}

h1{
visibility:hidden;
position:absolute;
}

/* ====================================================== HEADER */

#header{
margin-top:3px;
width:850px;
height:73px;
margin-left:auto;
margin-right:auto;
position:relative;
}

#header img{
position:absolute;
left:-30px;
}

*+html #header img{
top:3px;
}

#header .connexion{
width:244px;
height:48px;
background-image:url(design/bg_compte.jpg);
float:right;
margin-right:10px;
margin-top:10px;
position:relative;
font-size:12px;
padding-left:10px;
padding-right:5px;
color:#3b3b3b;
z-index:500;
}

#header .connexion p.signup{
}

#header .connexion span{
display:block;
background-color:#d4d4d4;
padding-left:5px;
margin-top:10px;
}

#header .connexion img.checkimg{
position:absolute;
left:185px;
top:27px;
}

#header .connexion img.supprimer{
position:absolute;
left:210px;
top:5px;
}

#header .connexion a{
font-weight:bold;
color:#5a8934;
}

#header .connexion a:hover, #header .connexion a:active{
color:#da6213;
text-decoration:none;
background: url(design/dotwalk.gif) repeat-x center bottom;
}

/* ====================================================== CORPS & CONTENU */

#corps{
background:url(design/bg_contenu.png) repeat-y;
width:900px;
margin-left:auto;
margin-right:auto;
position:relative;
z-index:200;
}

#contenu{
width:850px;
margin-left:auto;
margin-right:auto;
border-top:1px solid black;
position:relative;
z-index:200;
}

/* ====================================================== MENU COTE */

#cote{
position:absolute;
left:-28px;
top:190px;
z-index:200;
}

#cote ul{
position:relative;
list-style:none;
width:28px;
height:65px;
margin-top:-70px;
z-index:500;
}

#cote ul li{
margin-top:2px;
}

*+html #cote ul li{
margin-top:3px;
}

/* ====================================================== MENU */

#menu{
background:url(design/bg_menu.jpg) repeat-x;
border-top:3px solid #628d3f;
border-bottom:1px solid #628d3f;
height:28px;
margin-top:-5px;
}

*+html #menu{
border-top:1px solid #628d3f;
}

#menu ul{
list-style:none;
margin-left:15px;
}

#menu ul li{
float:left;
margin-left:6px;
margin-right:6px;
}

/* ======================================================= */

#menu ul li.accueil a{
background-image:url(menu/accueil.png);
display:block;
width:63px;
height:28px;
}

#menu ul li.accueil a:hover{
background-image:url(menu/accueil2.png);
display:block;
width:63px;
height:28px;
}

#menu ul li.rens a{
background-image:url(menu/renseignements.png);
display:block;
width:122px;
height:28px;
}

#menu ul li.rens a:hover{
background-image:url(menu/renseignements2.png);
}

#menu ul li.nouv a{
background-image:url(menu/nouveaute.png);
display:block;
width:88px;
height:28px;
}

#menu ul li.nouv a:hover{
background-image:url(menu/nouveaute2.png);
display:block;
}

#menu ul li.catalogue a{
background-image:url(menu/catalogue.png);
display:block;
width:86px;
height:28px;
}

#menu ul li.catalogue a:hover{
background-image:url(menu/catalogue2.png);
display:block;
}

#menu ul li.ludo a{
background-image:url(menu/ludotheque.png);
display:block;
width:95px;
height:28px;
}

#menu ul li.ludo a:hover{
background-image:url(menu/ludotheque2.png);
display:block;
}

#menu ul li.avis a{
background-image:url(menu/votre_avis.png);
display:block;
width:81px;
height:28px;
}

#menu ul li.avis a:hover{
background-image:url(menu/votre_avis2.png);
display:block;
}

#menu ul li.evenements a{
background-image:url(menu/evenements.png);
display:block;
width:98px;
height:24px;
margin-top:2px;
}

#menu ul li.evenements a:hover{
background-image:url(menu/evenements2.png);
display:block;
}

#menu ul li.part a{
background-image:url(menu/partenariat.png);
display:block;
width:95px;
height:28px;
}

#menu ul li.part a:hover{
background-image:url(menu/partenariat2.png);
display:block;
}

/* ====================================================== RECHERCHE */

#recherche{
width:850px;
height:32px;
background-image:url(design/recherche2.jpg);
position:relative;
}

#recherche form{
position:absolute;
right:17px;
width:230px;
height:20px;
top:3px;
}

#recherche form input.recherche{
background-color:#628d3f;
border:0;
color:#FFFFFF;
font-size:10px;
width:200px;
height:20px;
position:absolute;
top:2px;
}

#recherche form input.loupe{
background-image:url(design/loupe.jpg);
width:24px;
height:25px;
border:0;
position:absolute;
right:0;
top:-4px;
}

/* ====================================================== COMPTEUR */

#compteur{
/*position:absolute;
z-index:500;
top:137px;
left:10px;*/
clear:both;
padding-top:5px;
padding-bottom:7px;
margin-left:640px;
}

/* ====================================================== FOOTER */

#footer{
margin-bottom:10px;
margin-top:20px;
}

#footer .contenu_footer{
background-color:#82ba54;
border-bottom:1px solid black;
}

#footer img{
margin-bottom:-5px;
}

#page{
padding-left:20px;
padding-right:20px;
font-size:12px;
line-height:17px;
}

p.wrapper{
clear:both;
font-size:10px;
}

/* ====================================================== FOND */

#fond{
position:absolute;
background-image:url(design/fond.gif);
width:852px;
height:6px;
bottom:0;
left:-1px;
}

/* ====================================================== H2H3 */

.h{
border-bottom:1px solid #da6213/*#8fc165*/;
margin-bottom:40px;
margin-top:10px;
}

h2{
color:#da6213;
margin-top:5px;
margin-bottom:40px;
font-variant:small-caps;
font-weight:normal;
}

h2 img{
padding-right:10px;
}

*+html h2{
font-size:16px;
margin-bottom:20px;
}

h3{
color:#dddddd;
font-variant:small-caps;
margin-top:-60px;
margin-left:715px;
font-size:12px;
}

*+html h3{
font-size:12px;
margin-top:-40px;
}

h4{
color:/*#c4c4c4*/#bababa;
font-weight:bold;
font-size:14px;
margin-bottom:20px;
margin-top:20px;
}

/* ###############################
###                            ###
###          CONTENU           ###
###                            ###
################################*/

/* ====================================================== FOOTER */

#gauche_contenu, #droite_contenu{
position:relative;
background-color:#dddddd;
padding:5px;
margin-top:10px;
font-size:12px;
height:150px;
}

#gauche_contenu{
width:440px;
float:left;
margin-left:15px;
padding-left:15px;
}

#droite_contenu{
width:335px;
float:right;
margin-right:15px;
}

.hautgauche, .hautdroite, .basgauche, .basdroite{
width:6px;
height:4px;
position:absolute;
}

.hautgauche{
top:0;
left:0;
background-image:url(design/hautgauche.gif);
}

.hautdroite{
top:0;
right:0;
background-image:url(design/hautdroit.gif);
}

.basdroite{
bottom:0;
right:0;
background-image:url(design/basdroit.gif);
}

.basgauche{
bottom:0;
left:0;
background-image:url(design/basgauche.gif);
}

#gauche_contenu img.cover{
float:right;
border:5px solid #acacac;
margin-right:10px;
}

#gauche_contenu img.new{
margin-bottom:5px;
}

#gauche_contenu p span{
font-weight:bold;
}

#droite_contenu img{
float:left;
margin-top:15px;
margin-left:10px;
}

#plan{
position:relative;
background-color:#c1c1c1;
padding:5px;
margin-top:5px;
margin-right:5px;
margin-bottom:5px;
font-size:11px;
float:right;
}

#plan  span{
text-decoration:underline;
font-weight:bold;
}

.hautgauche2, .hautdroite2, .basgauche2, .basdroite2{
width:5px;
height:5px;
position:absolute;
}

.hautgauche2{
top:0;
left:0;
background-image:url(design/hautgauche2.gif);
}

.hautdroite2{
top:0;
right:0;
background-image:url(design/hautdroit2.gif);
}

.basdroite2{
bottom:0;
right:0;
background-image:url(design/basdroit2.gif);
}

.basgauche2{
bottom:0;
left:0;
background-image:url(design/basgauche2.gif);
}

/* ====================================================== ACCUEIL */

.zoom, .zoom_lg{
background-color:#ededed;
border:#dddddd 1px solid;
width:750px;
margin-left:auto;
margin-right:auto;
margin-top:20px;
}

.zoom{
height:170px;
}

.zoom_lg{
height:220px;
}

.zoom img.thumb, .zoom_lg img.thumb{
float:left;
margin-right:30px;
margin-bottom:5px;
margin-left:10px;
}

.zoom img.thumb{
margin-top:30px;
}

.zoom_lg img.thumb{
margin-top:45px;
}

.zoom img.thumb2{
float:right;
margin-left:30px;
margin-bottom:5px;
margin-top:30px;
margin-right:10px;
}

.zoom img, .zoom_lg img{
float:left;
margin-top:30px;
}

.zoom img.barre{
float:right;
margin-top:20px;
}

.zoom ul, .zoom_lg ul{
list-style-image:url(design/puce2.gif);
font-weight:bold;
padding-top:8px;
margin-left:380px;
}

.zoom ul.zoomul{
list-style-image:url(design/puce2.gif);
font-weight:bold;
padding-top:8px;
margin-left:27px;
}

.zoom a, .zoom_lg a, .event a{
color:#666666;
text-decoration:none;
font-weight:bold;
}

.zoom a:hover, .zoom_lg a:hover, .event a:hover{
background: url(design/dotwalk.gif) repeat-x center bottom;
color:#da6213;
}

.zoom p , .zoom_lg p{
color:#666666;
margin-left:10px;
}

.zoom p.zoomp{
color:#666666;
margin-left:350px;
}

.event{
background-color:#ededed;
border:#afafaf 1px solid;
width:698px;
margin-top:20px;
padding:5px;
position:relative;
min-height:120px;
margin-left:70px;
color:#666666;
}

.event img.excla{
float:right;
margin-left:15px;
}

.event img.event_img{
position:absolute;
left:-50px;
top:5px;
}

.event2{
background-color:#ededed;
border:#afafaf 1px solid;
width:700px;
margin-top:20px;
padding:5px;
position:relative;
margin-left:auto;
margin-right:auto;
color:#666666;
}

/* ====================================================== RENSEIGNEMENTS */

.plan{
border:1px solid #82bb54;
width:425px;
height:350px;
margin-left:auto;
margin-right:auto;
margin-top:50px;
}

/* ====================================================== LISTES */

ul.renseignements, ul.cat{
list-style-image:url(design/puce3.gif);
margin-top:10px;
margin-bottom:10px;
margin-left:40px;
}

ul.renseignements a, ul.cat a{
font-weight:bold;
color:#5a8934;
}

ul.renseignements a:hover, ul.renseignements a:active, ul.cat a:hover, ul.cat a:active{
color:#da6213;
text-decoration:none;
background: url(design/dotwalk.gif) repeat-x center bottom;
}

/* ====================================================== NOUVEAUTE */

p.titre{
font-weight:bold;
color:#82bb54;
}

p.auteur{
margin-top:-5px;
font-weight:bold;
}

p.autres{
margin-top:-5px;
margin-bottom:10px;
}

.commentaire {
background-color:#ededed;
border:#dddddd 1px solid;
padding:10px;
}

/*.commentaire h4{
position:absolute;
top:-10px;
background-color:#FFFFFF;
padding-left:5px;
padding-right:5px;
}*/

/* ====================================================== CATALOGUE */

table.catalogue td{
padding:2px;
}

table.catalogue th{
color:#666666;
}

table.catalogue{
width:100%;
}

td.alphabet{
font-weight:bold;
}

td.auteur, th.auteur{
width:150px;
font-weight:bold;
}

td.reserver{
width:25px;
}

th.annee{
width:50px;
}

td.annee{
text-align:center;
}

th.titre{
width:300px;
}

td.titre{
width:300px;
}

td.titre{
font-style:italic;
}

td.titre, td.annee, td.editeur, td.collection{
font-size:13px;
text-transform:lowercase;
}

td.titre:first-letter, td.editeur:first-letter, td.collection:first-letter{
font-variant:small-caps;
font-size:15px;
}

td.editeur, th.editeur{
width:100px;
}

td.collection, th.collection{
width:100px;
}

table tr.ligne2{
background-color:/*#ededed*/#f8f8f8;
}

p.menu_lettres{
background-color:#ededed;
border:#dddddd 1px solid;
padding:5px;
text-align:center;
margin-bottom:20px;
margin-top:20px;
}

p.menu_lettres a{
font-weight:bold;
color:#666666;
text-decoration:none;
}

p.menu_lettres a:hover{
font-weight:bold;
color:#da6213;
}

td.top{
text-align:right;
font-size:10px;
}

td.top a{
font-weight:bold;
color:#666666;
text-decoration:none;
}

td.top a:hover{
font-weight:bold;
color:#da6213;
}

/* ====================================================== LUDOTHEQUE */

table.ludotheque{
margin-left:auto;
margin-right:auto;
width:100%;
}

table.ludotheque td{
padding:2px;
}

th.nom_jeu{
font-weight:bold;
width:400px;
}

th.comment{
width:500px;
}

td.comment2{
font-style:italic;
}

td.alphabet{
background-color:#ededed;
text-align:center;
height:30px;
}

td.reserver{
text-align:center;
}

td.submit{
text-align:right;
}

/* ====================================================== CONNEXION */

table.connexion{
margin-left:auto;
margin-right:auto;
border:1px solid #82bb54;
padding:10px;
font-weight:bold;
}

/* ====================================================== MON COMPTE */

table.mon_compte{
margin-left:auto;
margin-right:auto;
border:1px solid #82bb54;
padding:10px;
}

table.mon_compte th{
text-align:left;
}

table.mon_compte th.reservation{
height:50px;
}

table.mon_compte a{

font-weight:bold;
color:#666666;
text-decoration:none;
}

table.mon_compte a:hover{
font-weight:bold;
color:#da6213;
}

/* ====================================================== INSCRIPTION */

table.inscription{
margin-left:auto;
margin-right:auto;
border:1px solid #82bb54;
padding:10px;
font-weight:bold;
}

td.details{
font-style:italic;
font-weight:normal;
font-size:10px;
}


/* ====================================================== ERREUR */

.erreur{
color:#ff6666;
border:1px solid #ffce7b;
margin-top:40px;
padding:10px;
width:500px;
margin-left:auto;
margin-right:auto;
}

.erreur img{
float:left;
margin-right:15px;
margin-left:5px;
margin-bottom:5px;
margin-top:5px;
}

.erreur ul{
clear:both;
list-style-image:url(design/puce2.gif);
margin-left:20px;
}

/* ====================================================== ADMINISTRATION */

p.admin{
margin-bottom:20px;
text-align:center;
}

p.admin a{
font-weight:bold;
color:#5a8934;
text-decoration:none;
border-bottom:1px dotted #5a8934;
}

p.admin a:hover{
font-weight:bold;
color:#da6213;
border-bottom:0;
}

td.modifier a, td.statut a{
font-weight:bold;
color:#666666;
text-decoration:none;
}

td.modifier a:hover, td.statut a:hover{
font-weight:bold;
color:#da6213;
border-bottom:0;
}

/* ====================================================== LIEN RETOUR */

p.retour{
margin-top:50px;
}

p.retour a{
font-weight:bold;
color:#5a8934;
text-decoration:none;
border-bottom:1px dotted #5a8934;
}

p.retour a:hover{
font-weight:bold;
color:#da6213;
border-bottom:0;
}

/* ====================================================== DD DT DL */

dl{
margin-left:30px;
}

dt{
font-weight:bold;
}

dd{
margin-left:20px;
margin-bottom:10px;
}



p.nouveaute{
margin-bottom:40px;
margin-top:40px;
}

p.erreurp{
margin-bottom:40px;
}

.correct{
color:#547f29;
border:1px solid #547f29;
margin-top:40px;
padding:10px;
width:500px;
margin-left:auto;
margin-right:auto;
font-size:11px;
}

table.connexion a{
font-weight:bold;
color:#5a8934;
text-decoration:none;
}

table.connexion a:hover{
font-weight:bold;
color:#da6213;
border-bottom:0;
}

input.submit{
background-color:#E3E3E3;
border:1px solid #BCBCBC;
font-weight:bold;
}