/* CSS Document */

*, html {
	margin: 0;
	padding: 0;
	}

body {
	background: #5ea0f7;
	font: 12px Verdana, Arial, Helvetica, sans-serif;
	color: #cc0066;
	margin: 0;
	padding: 0;
	}
p {
	font: 12px Verdana, Arial, Helvetica, sans-serif;
	color: #cc0066;
	margin-bottom: 8px;
}
a {	
	font: 12px Verdana, Arial, Helvetica, sans-serif;
	color: #990066;
	text-decoration: none;
}
a:hover {
	text-decoration:underline;
}

.nettoyeur {
	clear: both;
	}
abbr {
	cursor:help;	
	}

/*************/
/* GENERAL'S */

#conteneur {
	margin: auto;
	width: 1000px;
	background: #5ea0f7 url(images/fond_page.jpg) repeat-y;
	}
#contenu {
	position: relative;	
	z-index:50;
	}
#header {
	width: 100%;
	height: 66px;
	margin-top: 20px;
	background: url(images/fond_header.jpg) repeat-y 0 20px;
	}
	
#logo_header {
	margin: 0;
	}

/* Le menu déroulant */
#menuderoulant {
	position: absolute;
	z-index: 99;
	width: 700px;
	height: 21px;
	font: 14px bold Geneva, Arial, Helvetica, sans-serif;
	list-style-type: none;
	margin: -40px 0 0 290px;
	padding: 0;
	border: 0;
}
#menuderoulant li
{
	float: left;
	width: 98px;
	margin: 0;
	padding: 0 2px;
	border: 0;
	text-transform: uppercase;
}
#menuderoulant li a:link, #menuderoulant li a:visited
{
	display: block;
	height: 1%;
	color: #FFF;
	margin: 0;
	padding: 4px 0;
	text-decoration: none;
	background: transparent url(images/menu_transp.png) repeat;
	text-align:center;
}
#menuderoulant li a:hover { background: #cc0066; }
#menuderoulant li a:active { background: #cc0066; }

#menuderoulant .sousMenu
{
	display: none;
	list-style-type: none;
	margin: 3px 0 0 0;
	padding: 0;
	border: 0;
}
#menuderoulant .sousMenu li
{
	float: none;
	margin: 0;
	padding: 0;
	border: 0;
	width: 152px;
	border-top: 1px solid transparent;
	border-right: 1px solid transparent;
	font: 12px normal Geneva, Arial, Helvetica, sans-serif;
	text-transform: none;
}
#menuderoulant .sousMenu li a:link, #menuderoulant .sousMenu li a:visited
{
	display: block;
	color: #FFF;
	margin: 0;
	padding-left: 4px;
	border: 0;
	text-decoration: none;
	background: transparent url(images/menu_transp.png) repeat;
	text-align:left;
}
#menuderoulant .sousMenu li a:hover
{
	background-image: none;
	background-color: #cc0066;
}

#menuderoulant li:hover > .sousMenu { display: block; }

/* Contenu */
/*col gauche */
#col_left {
	background: transparent url(images/fond_col_left.png) no-repeat top left;
	width: 532px; 
	padding:20px 10px; 
	margin:4px 0 0 0;
	}
#col_left img.illustration {
	float: right;
	padding: 4px;
	}
#col_left p {
	text-align: justify;
	}
#col_left_bottom {width: 550px; padding:0 0 0 90px; margin:0;background: transparent url(images/fond_col_left.png) no-repeat bottom left;	
	height: 25px;
	}
#col_left_bottom img {
	position: absolute;
	margin: -35px 0 0 -75px;
	}
#col_left h3 {
	color: #660033;
	font-size: 13px;
	text-transform:uppercase;
	padding: 8px 0 6px 0;
	}
#col_left .plus {
	text-align: right;
	color: #660033;
	}
#col_left .plus a {
	color: #660033;
	}

#col_left ul {
	padding-bottom: 8px;
	}
#col_left ul li {
	list-style-type: none;
	padding-left: 10px;
	background: transparent url(images/arrow.png) no-repeat left center;
	}
#col_left ol li{
	font-weight: bold;
	font-size:13px;
	}

#col_left ol li p {
	font-weight: normal;	
	font-size:12px;
	}
#col_left #bloc_lexique {
	color:#5ea0f7;
	font-size: 10px;
	position: absolute;
	margin: -15px 0 0 80px;
	width: 450px;
	}

#col_left #bloc_lexique p {	
	color: #5ea0f7;
	font: italic 15px "Times New Roman", Times, serif ;
	margin-bottom: 4px;
	}	
	
#col_left #bloc_lexique a {
	color:#5ea0f7;
	font-size: 10px;
	}

#col_left #bloc_lexique li {
	list-style-type: none;
	float: left;
	}
#col_right {
	position: absolute;
	top: 65px;
	margin-left: 570px;
	background: transparent url(images/fond_col_right.png) no-repeat top left;
	color: #6699ff;
	width: 200px;
	padding: 5px;
	}
	
#col_right_bottom {
	position: absolute;
	width: 200px; 
	padding:5px; 
	margin: 5px 0 0 -5px;
	background: transparent url(images/fond_col_right.png) no-repeat bottom left;	
	height: 25px;
	}
#col_right h2 {
	font: bold 20px Georgia, "Times New Roman", Times, serif;
	line-height: 24px;
	overflow: hidden;
	color: #fff;
	padding: 6px 6px 6px 35px;
	margin: -20px 0 8px 0;
	background: transparent url(images/font_titre_col_right.png) no-repeat top left;
	}
#col_right p {color: #5ea0f7; font-weight:bold;}
#col_right a {
	color: #6699ff;
	background: transparent url(images/square.png) no-repeat left center;
	padding-left: 14px;
	}
#col_right a:hover, #col_right a.active {
	background: transparent url(images/square-checked.png) no-repeat left center;
	}
#col_right li{
	list-style-type: none;
	padding:0 0 0 5px;
	margin:0;
	}


/**********************************/
/* 		     EXTRAS               */
/* Pour les images illustrations  */
/**********************************/

/* La femme grande en bas à droite */
#fem_5cabas {/* galerie-cabas */
	background: transparent url(images/fem_grande_5cabas.png) no-repeat top left;
	width: 392px;
	height: 392px;
	z-index: 1;
	position: absolute;
	margin-left: 630px;
	top: 350px;
	}
#personnages_3 {/* utilisations */
	background: transparent url(images/3-personnages.png) no-repeat top left;
	width: 231px;
	height: 121px;
	z-index: 1;
	position: absolute;
	margin-left: 540px;
	bottom: -45px;
	}
#illust_contact {/* contact */
	background: transparent url(images/femme-cabas-contact.png) no-repeat top left;
	width: 325px;
	height: 289px;
	z-index: 1;
	position: absolute;
	margin-left: 50px;
	top: 560px;
	}
#pastille { /* home */
	background: transparent url(images/pastille.png) no-repeat top left;
	width: 132px;
	height: 132px;
	z-index: 1;
	position: absolute;
	margin-left: -120px;
	bottom: 165px;
	}
#pastille span {display: none;}
#pastille a {display: block;
	width: 132px;
	height: 132px;}



/**********************************/
/* CSS pour la galerie CABA*/
/**********************************/

/* forme galerie */
* {margin:0;padding:0}
li{margin-left:16px;}
h1{color:#fff;text-align:left;padding-bottom:10px}

.sample{ }

.links {padding:10px;margin-top:20px}
.links a{font-size:14px;color:#0080FF;text-decoration:none}
.links a:hover{font-weight:bold}

#contenu{width:780px;margin:0 0 0 90px;text-align:left;padding:20px;
	}

.buttons{padding:5px;}
.buttons span{color:#0080FF;padding:0 5px;cursor:pointer;font:10px Verdana; opacity: 0.5;}
.buttons span.active, .buttons span:hover{background:#0080FF;color:#fff; opacity: 1;}
#prev {
	position: absolute;
	width: 29px;
	height: 191px;
	margin-left: 30px;
	margin-top: -300px;
	background: transparent url(images/navig_galerie_prev.png) no-repeat top left;
	}
#next {
	position: absolute;
	width: 29px;
	height: 191px;
	margin-left: 465px;
	margin-top: -321px;
	background: transparent url(images/navig_galerie_next.png) no-repeat top left;
	}
#stop {
	margin-left: 240px;
	height: 21px;
	width: 19px;
	display: block;
	background: transparent url(images/navig_galerie_stop.png) no-repeat top left;
	}
#play {
	background: transparent url(images/navig_galerie_play.png) no-repeat top left;
	height: 21px;
	width: 19px;
	display: block;
	margin-left: 275px;
	margin-top: -21px;
	}

/* NOUVELLE GALERIE */
.news_slider .fl {
	float: left; display: inline;
}
.news_slider img {
	border: 0; display: block;
}
.news_slider {
	position: relative; width: 500px; margin: 0 auto 20px auto; text-align: left;
}
.news_slider .messaging {
	display: block; padding: 5px; margin: 0 20px 5px 20px; background: #ffffcc;
}
.news_slider .prev, .news_slider .next {
	position: absolute; top: 22%; display: none;
}
.news_slider .next {
	right: 0;
}
.news_slider .container {
	position: relative; top: 0; left: 0; width: 100%; background: #eeeeed;
}
.news_slider .news_items {
    /*
        The width must be equal to .item ((width + margin-right)).
    */
	position: relative; width: 350px; top: 0; margin: 0 auto; overflow: hidden;
}
.news_slider .view_all {
	font-size: .8em; padding: 5px; margin: 0 0 2px 0; border-top: #eeeeed 1px solid; border-bottom: #eeeeed 1px solid; text-align: center;
}
.news_slider .item {
    /*
        Must contain a width and a margin-right.
    */
	width: 350px; margin-right: 0;
}
.news_slider .item div {
	margin-top:-30px; font: bold 10px Verdana, Arial, Helvetica, sans-serif; color: #fff; width: 330px; height: 20px; background: #CC6699; opacity: 0.6; padding: 0 10px 10px 10px;
}
.news_slider .item img {
	padding: 0;
}



/* Navigation */
#box{
	position:absolute;
	width:450px;
}
#box span{
	display:block;
}
#info{
	bottom:0;
}

.info{
	width:350px;
	height:50px;
	background:#cc0066;
	position:absolute;
}
.info p, .info h4{
	color:#fff;
	padding:3px 8px;
	font-family:Arial;
}
.info h4{
	font-size:14px;
}
.info h4 a{
	float:right;
	background:#fff;
	color:#000;
	font-size:10px;
	padding:0 3px;
	text-decoration:none
}

.mask{
	margin: auto;
	position:relative;
	width:350px;
	height:350px;
	overflow:hidden;
}
span img{
	display:block;
	float:none;
	border:none;
}


/* Contact.php */

#form_left {
	float: left;
	background: transparent url(images/fond_contact1.png) no-repeat top left;
	width: 300px;
	height: 293px;
	padding: 30px 40px 0 30px;	
	}
#form_left p {
	color: #990066;
	}
#form_left h3, #form_right h3 {	
	color: #660033;
	font-size: 13px;
	text-transform:uppercase;
	padding: 8px 0 6px 0;
	}
#form_left #numero {	
	color: #cc0066;
	font: bold 40px "arial black";
	letter-spacing: -2px;
	width: 304px;
	height: 43px;
	background: transparent url(images/numero.png) no-repeat center center;
	}
#form_left #numero span {display: none;}	
#form_left #slogan {	
	color: #660033;
	font-size: 20px;
	font-weight: bold;
	text-transform:uppercase;
	padding: 8px 0 6px 0;
	}
#form_right {
	float: left;
	background: transparent url(images/fond_contact2.png) no-repeat top left;
	width: 362px;
	height: 590px;
	padding: 30px 0 0 20px;	
	}
#form_right input, #form_right textarea {
	width: 230px;
	border: 1px solid #660033;
	}
#form_right input#ville, #form_right input#codepostal {
	width: 97px;
	}
#form_right input.checkbox, #form_right input#valid {
	width: auto;
	border: 1px solid #660033;
	}
#form_right .focus {
	background: #F9E8FF;
	}
	
#form_right select {
	width: 231px;
	border: 1px solid #660033;
	}
#form_right table {
	width: 320px;	
	color: #660033;
	}
#form_right td {padding: 2px; vertical-align: top;
}

#form_right #donnees {
	font: 9px Arial, Helvetica, sans-serif;
	color: #999;
	}

#form_right .manquants {
	color: #999;
	}

#form_right .erreur {
	color: #FF0033;
	}

/* Pied de page - footer */
#pied {
	height: 190px;
	background: url(images/fond_footer.jpg) repeat-x  0 50px;
	color:#eee5b5;
	 }
#pasto {
position: relative;
	width: 100%;
	height: 90px;
	background: url(images/pasto.png);	
	}
#pied small { 
	position: relative;
	top: -50px;
	left: 500px;
	font-size:10px; }
#pied img { vertical-align: bottom; }
#logo-wdirect h2 {
	position: relative;
	margin-left: 26px;
	margin-top: -52px;
	width: 170px;
	height: 71px;
	z-index:99;
	background: transparent url(images/logo-footer-wdirect.png) no-repeat top left !important;
	background:url();
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/logo-footer-wdirect.png');
	}
#logo-wdirect span {
	display: none;
	}
#pied #autres-sites {
	position: relative;
	left: 100px;
	top: 40px;
	font-size: 10px;
	text-align: left;
	}
	
#pied #autres-sites h3 {
	width: 150px;
	border-bottom: #999 dashed 1px;
	font-size: 12px;
	}
		
#pied li {
	display: inline;
	list-style-type: none;
	_line-height: 110%; /*hack pour l'espacement des li sur ie */
	}
#pied a {
	color:#eee5b5;
	font-size:10px;
	}

#pied #legal { 
	position: relative;
	top: -20px;
	left: 100px;
	text-align: left;
	font-size: 10px; }

#pied li#mask {
	display: none;
	}
	
/* Infos Legales */
#infos_legales, #infos_legales p {
	background-color: #fff;
	color: #666666;
	font: 11px Georgia, "Times New Roman", Times, serif;
	}