/* JQuery Scrollable */

/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
div.scrollable {
	/* required settings */
	position:relative;
	overflow:hidden;
	width: 620px;
	height: 235px;
	background: url(/bg-scrollable2.gif) no-repeat;
	float: left;
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
div.scrollable div.items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
	padding-top: 50px; /*35*/
	padding-left: 10px; /*10*/
	clear: both;
}

/* single scrollable item */
div.scrollable img.home {
	float: left;
	margin-left:10px; /*10*/
	margin-right:10px; /*10*/
	width:106px;
	height:150px;
}

div.scrollable div.items div {
	float:left;
	margin: 0px;
}

/* prev, next, prevPage and nextPage buttons */
a.browse {
	display:block;
	width:620px;
	height:21px;
	cursor:pointer;
	font-size:1px;
}

/* right */
a.right {
	background:url(/next2.gif) no-repeat;
}

/* left */
a.left {
	background:url(/prev2.gif) no-repeat;
}

/* disabled navigational button */
a.disabled {
	visibility:visible !important;		
}

div.bgBrowse {
	width: 476px;
	height: 21px;
	background: url(/bg-browse.gif) no-repeat;
	float: left;
}

div#photoHomeCDC {
	float: left;
}

div.texteHomeCDC {
	float: left;
	width: 485px;
}

/* Colonne Droite */
div.scrollableCD {
	/* required settings */
	position:relative;
	overflow:hidden;
	width: 175px;
	height: 256px;
	margin-left: 5px;
	/*background: url(/bg-scrollable2.gif) no-repeat;*/
}

div.scrollableCD div.itemsCD {
	/* this cannot be too large */
	height:20000em;
	position:absolute;
}


/* single scrollable item */
div.scrollableCD img.home2 {
	float: left;
	margin-left:0px; /*10*/
	margin-right:0px; /*10*/
	width:78px;
	height:110px;
	/*padding-bottom: 10px;*/
}

div.scrollableCD div.itemsCD div#CD {
	margin: 0px;
	/*border: solid 1px black;*/
	height: 130px;
}


/* prev, next, prevPage and nextPage buttons */
a.browseCD {
	display:block;
	width:175px;
	height:21px;
	cursor:pointer;
	font-size:1px;
	margin-left: 5px;
}

/* right */
a.rightCD {
	background:url(/nextCD.gif) no-repeat;
}

/* left */
a.leftCD {
	background:url(/prevCD.gif) no-repeat;
}

/* disabled navigational button */
a.disabledCD {
	visibility:visible !important;		
}

div#photoHomeCDC2 {
	float: left;
}

div.texteHomeCDC2 {
	float: left;
	width: 75px;
	padding-left: 3px;
}



/* Jquery tab */

/* root element for tabs  */
ul.producttabs { 
	list-style:none; 
	margin:0 !important; 
	padding:0;
	height:44px;
	background: url(/bgProducttabs.gif) repeat-x;
}

/* single tab */
ul.producttabs li { 
	float:left;	 
	text-indent:0;
	padding-right: 7px;
	margin:0 !important;
	list-style-image:none !important; 
}

/* link inside the tab. uses a background image */
ul.producttabs li a { 
	font-size:12px;
	font-style: Avenir LT 65 Medium, Myriad Pro;
	display:block;
	height: 44px;
	width: 145px;
	line-height:30px;
	text-align:center;
	text-decoration:none;
	color: black;
	font-weight: bold;
	position:relative;
	top:0px;
	margin-left: 7px;
	background: url(/onglet-off.gif) no-repeat;
	display: block;
}

ul.producttabs li a:active {
	outline:none;		
}

/* when mouse enters the tab move the background image */
ul.producttabs li a:hover {
	background: url(/onglet-on.gif) no-repeat;
	color: black;
	height: 44px;
	width: 145px;
	top: 0px;
}

/* active tab uses a class name "current". it's highlight is also done by moving the background image. */
ul.producttabs a.current, ul.producttabs a.current:hover {
	background: url(/onglet-on.gif) no-repeat;
	cursor:default !important; 
	color: black !important;
	height: 44px;
	width: 145px;
	top:0px;
}

/* initially all panes are hidden */
div.productpanes > div {
	display:none;
	padding: 5px;
}


/* Simple Overlay */
/* the overlayed element */
.simple_overlay {
	
	/* must be initially hidden */
	display:none;
	
	/* place overlay on top of other elements */
	z-index:10000;
	
	/* styling */
	background-color:#fff;
	
	width:675px;	
	height:200px;
	margin-top: 150px;
	
	border:1px solid #666;
	
	/* CSS3 styling for latest browsers */
	-moz-box-shadow:0 0 90px 5px #000;
	-webkit-box-shadow: 0 0 90px #000;	
}

/* close button positioned on upper right corner */
.simple_overlay .close {
	background-image:url(/image/close.png);
	position:absolute;
	right:-15px;
	top:-15px;
	cursor:pointer;
	height:35px;
	width:35px;
}

.details {
	position:absolute;
	top:15px;
	right:15px;
	color:#000;
	width:650px !important;
	width: 675px;

	padding-left: 25px !important;
	padding-left: 30px;
}

/* some styling for triggers */
#triggers img {
	cursor:pointer;
}


div#box a.coordFontEmail {
    color: #ffffff;
}

.bonnesAffairesBg {
	width: 100%;
	margin: 0 7px;
	padding: 3px;
	color: #000;
	font-size: 13pt;
	font-weight: bold;
}

#bonnesAffaires {
	width: 190px;
	height: 100% !important;
	height: 185px;
	border: solid 1px #000;
	background-color: #ececec;
	float: left;
	margin: 6px !important;
	margin: 7px;
	position: relative;
	color: #003366;
}

#bonnesAffaires div.text {
	padding: 9px;
	color: #009ade;
	height: 80px;
	overflow: hidden;
}

#bonnesAffaires img {
	border-bottom: solid 1px #000;
	background-color: #ffffff;
}

#bonnesAffaires hr {
	color: #000;
	background-color: #000;
	height: 1px;
}

#bonnesAffaires a {
	color: #000;
}

#searchForm {
	margin: 0 auto;
	width: 200px;
}


/***********************/
/***** Calendrier ******/
/***********************/
#calendar {
	background-color: #ececec;
	padding: 0px 10px;
	border: solid 1px #ececec;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
	border-radius: 5px;
    behavior: url(/css/PIE.htc);
    font-size: 1.1em;
    }
    #calendar > ul {
		list-style: none;
		margin: 0px;
		padding: 0px;
		float: left;
		width: 300px;
		}
		#calendar h1 {
			color: #000;
		font-size: 1.9em;
		}
		#calendar > ul li ul {
			list-style: none;
			margin: 0px;
			padding: 0px;
			}
			#calendar > ul li li {
				background: url("http://www.laurette-theatre.fr/image/puce-1-3-1.gif") 0px 2px no-repeat;
				padding-left: 20px;
				}
				#calendar > ul li li a {
					text-decoration: none;
					font-size: 1.3em;
				}
				#calendar > ul li li a:hover {text-decoration: underline;}
	
	#calendar p {
		clear: both;
		margin: 10px 0px;
		text-align: center;
		font-size: 1.4em;
	}
	#calendar p a {color: #005175;}

