div.content {  /*  contient tout sauf les thumbs */
	/* The display of content is enabled using jQuery so that the slideshow content won't display unless javascript is enabled. */
	display: none;
	position:absolute;
	top:150px;
	left:175px;
	width: 750px; 
	height: 700px;
	}


div.content a, div.navigation a {
	text-decoration: none;
	color: #777;
	}
	
	
div.content a:focus, div.content a:hover, div.content a:active {
	text-decoration: underline;
	outline:none;
	}
	
	/*  BOÎTE NAVIGATION */
	
div.controls {          /*contrôle toute la boîte avec "Play Slideshow‹ Previous PhotoNext Photo ›"   */
	position:absolute;
	left:50px;
	z-index:500;
	width:650px;
	height:450px;
	font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, Helvetica, Arial, sans-serif;
	font-size: 0.8em;
	}

div.controls a { /*boîte avec "Play Slideshow"  et  "‹ Previous PhotoNext Photo ›"   */
	padding: 0px;
	}
	
	
div.ss-controls {/*boîte avec "Play Slideshow"   que je fais disparaître avec margin-left */
	float: left; 
	}
	
.ss-controls a{/*boîte avec "Play Slideshow"   que je fais disparaître avec margin-left      	margin-left:-5000px;     */
	position: absolute;
	background-repeat:no-repeat;
	width:30px;
	height:30px;
	top:-35px;
	left:280px;
	}
		
a.play{
	background-image:url(../images/play.gif); 
	background-repeat:no-repeat;
	}
	
a.play:hover{
	background-image:url(../images/playx.gif); 
	background-repeat:no-repeat;
	}	
	
a.pause{
	background-image:url(../images/pause.gif); 
	background-repeat:no-repeat;	
	}
	
a.pause:hover{
	background-image:url(../images/pausex.gif); 
	background-repeat:no-repeat;	
	}	

div.nav-controls {   /*boîte avec  "‹ Previous PhotoNext Photo ›"   */
	outline:none;
	}


a.prev {	/*fleche avant -div que j'ai rajouté   --*/
	position: absolute;
	background-image:url(../images/rewind.gif);
	background-repeat:no-repeat;	
	width:0px;
	height:0px;
	top:-30px;
	left:0px;outline:none;
	}
	

a.next {	/*fleche après -div que j'ai rajouté  --*/
	position: absolute;
	background-image:url(../images/pixel.gif);
	background-repeat:no-repeat;
	width:500px;
	height:400px;
	top:0px;
	left:50px;
	}
	


   /*  BOÎTE IMAGE CENTRALE  */
   
div.slideshow-container {  /*  grande boîte centrale  */
	position: absolute;	
	top: 0;
	left: 30px;
	clear: both;
	height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */
	}
	  
div.loader {
	position: absolute;
	top: 0;
	left: 0;
	background-image: url('loader.gif');
	background-repeat: no-repeat;
	background-position: center;
	width: 600px;
	height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */
	}
	
div.slideshow span.image-wrapper {  /*  grande boîte centrale sans la navigation et sans les elements caption*/
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	}
	
div.slideshow a.advance-link { /*  grande boîte centrale  */
	display: block;
	position: absolute;
	margin:0;
	padding:0;	
	top: 0;
	left: -50px;
	text-align:center;
	width: 750px;
	height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */
	line-height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */
	}
	
div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited {  /*  grande boîte centrale :HOVER!  */
	text-decoration: none;
	}
	
	
div.slideshow img {   /* rien*/
	/* place l'image au milieu en hauteur de sa boîte*/
	border:0px solid #ccc;
	}

/* COVER ET COMMENTAIRES  */


div.caption-container {
	position: relative;
	clear: left;
	height: 75px;
	}

span.image-caption {     /* CONTROLE toute la zone caption avec l'image et les commentaires  */
	display: block;
	position: absolute;
	width: 450px;
	height:215px;
	top: 325px;
	left: 0px;	
	}
	
div.caption {
	padding: 0px;
	}

div.cover {/*   div cover que j'ai rajoutée  */
	position:absolute; 
	top:0;
	left:0;
	width:150px;
	height:215px;
	padding-right: 12px; /*   sépare l'image du texte à droite  */
	z-index:5000;
	}

	
div.cover img{/*   image cover que j'ai rajoutée  */
	position:absolute; 
	height:95%;
	right:0;
	z-index:5000;	
	bottom:0;
	border:5px solid #fff;box-shadow: 0px 2px 6px #979797;
	-moz-box-shadow: 0px 2px 6px #979797;  
	-webkit-box-shadow: 0px 2px 6px #979797; 
	}	
		
div.titre { /*    commentaire titre   */
	position:absolute; 
	margin-left:180px;
	margin-bottom:2px;
	font-size: 1.2em;;bottom:0;
	font: normal 11px Verdana, Geneva, sans-serif;	
	}
	
div.coverlien1 {/*   rajouté pour permettre deux href sur l'image (pour avancer et reculer  */
	position:absolute; 
	top:0px;
	left:0;
	width:70px;
	height:235px;
	z-index:5001;	
	overflow:hidden;
	background-image:url(../images/pixel.gif);
	
	}	
	
div.coverlien1:hover {
	background-image:url(../images/cover-prev.gif);
	background-repeat:no-repeat;
	}
	
div.coverlien2 {/*   rajouté pour permettre deux href sur l'image (pour avancer et reculer  */
	position:absolute; 
	top:0px;
	left:70px;
	width:100px;
	height:235px;
	z-index:5001;	
	overflow:hidden;
	background-image:url(../images/pixel.gif);
	
	}	
	
div.coverlien2:hover {
	background-image:url(../images/cover-next.gif);
	background-repeat:no-repeat;padding-top:-100px;
	}
		
	
	

/*    BOÎTE DES THUMBNAILS  */

div.navigation {  /*    toute la boîte des thumbails  que je fais disparaÎtre  */positon:relative;margin-top:110px;margin-left:440px;width:20px;
border: none;
	
	/* The navigation style is set using jQuery so that the javascript specific styles won't be applied unless javascript is enabled. */  
	}




ul.thumbs {text-align:center;
	clear: both;
	margin:0;
	padding: 0;
}
ul.thumbs li {/*chacunes des miniatures */  
	float: left;
	padding: 0;
	margin: 5px 10px 5px 0;
	list-style: none;
}
a.thumb {  
	padding: 2px;
	display: block;
	border: 0px solid #ccc;
}
ul.thumbs li.selected a.thumb {	/*fond des miniatures */  
	background: #fff;
}
a.thumb:focus {
	outline: none;
}
ul.thumbs img {
	border: none;
	display: block;
}
div.pagination {
left:0;
	clear: both;
}
div.navigation div.top {
	margin-bottom: 0px;
	height: 0px;
	width:0px;
}
div.navigation div.bottom {
	margin-top: 0px;
}
div.pagination a, div.pagination span.current, div.pagination span.ellipsis {
	display: block;
	float: left;
	margin-right: 2px;
	padding: 4px 7px 2px 7px;
	border: 1px solid #ccc;
}
div.pagination a:hover {
	background-color: #000;
	text-decoration: none;
}
div.pagination span.current {
	font-weight: bold;
	background-color: #000;
	border-color: #000;
	color: #fff;
}
div.pagination span.ellipsis {
	border: none;
	padding: 5px 0 3px 2px;
}