#conteneur {
	background-image: url(images/fond.jpg);
	background-repeat: no-repeat;
	height: 600px;
	width: 800px;
	margin-left: -400px;
	position: absolute;
	left: 50%;
	border: 1px solid #FFFFFF;
	margin-top: 15px;
}
#copyrights {
	width: 800px;
	margin-left: -400px;
	position: absolute;
	left: 50%;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #FFFFFF;
	margin-top: 620px;
}
#copyrights a {
	color: #F16607;
}
#menu {
	background-image: url(images/barremenu.jpg);
	height: 70px;
	width: 497px;
	margin-left: 300px;
	margin-top: 75px;
}
#menu ul {
	list-style-type: none;
}
#images {
	width: 371px;
	margin-left: 415px;
	margin-top: 25px;
}
#textes {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	font-size: 12px;
	text-align: center;
	padding-left: 385px;
}
#menu a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	font-weight: bolder;
	font-size: 18px;
	text-decoration: none;
	line-height:32px

}
#menu li {
	display: inline;
	margin-right: 50px;
	margin-left: 70px;	
}
body {
	background-color: #323C46;
}
/* default link and visited state to trigger :active in IE6 */
a, a:visited {color:#000;}

/* position the outer frame */
div.frame {
	position:relative;
	width:500px;
	height:375px;
	border:1px solid #000;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 20px;
	margin-left: 295px;
}

/* Set up the default links for the gallery */
div.frame a, div.frame a:visited {background:#eee; text-decoration:none;}

/* Set up the common image style */
div.frame a img {position:absolute; top:0; left:0; border:10px double #d00;}
/* clip the eight images into vertical strips */
div.frame a.pos1 img {clip: rect(0 70px 375px 0px); border-color:#d00;}
div.frame a.pos1 img {clip: rect(0, 70px, 375px, 0px); border-color:#d00;}
div.frame a.pos2 img {clip: rect(0 130px 375px 70px); border-color:#fc0;}
div.frame a.pos2 img {clip: rect(0, 130px, 375px, 70px); border-color:#fc0;}
div.frame a.pos3 img {clip: rect(0 190px 375px 130px); border-color:#791;}
div.frame a.pos3 img {clip: rect(0, 190px, 375px, 130px); border-color:#791;}
div.frame a.pos4 img {clip: rect(0 250px 375px 190px); border-color:#e52;}
div.frame a.pos4 img {clip: rect(0, 250px, 375px, 190px); border-color:#e52;}
div.frame a.pos5 img {clip: rect(0 310px 380px 250px); border-color:#a84;}
div.frame a.pos5 img {clip: rect(0, 310px, 380px, 250px); border-color:#a84;}
div.frame a.pos6 img {clip: rect(0 370px 380px 310px); border-color:#7bc;}
div.frame a.pos6 img {clip: rect(0, 370px, 380px, 310px); border-color:#7bc;}
div.frame a.pos7 img {clip: rect(0 430px 380px 370px); border-color:#150;}
div.frame a.pos7 img {clip: rect(0, 430px, 380px, 370px); border-color:#150;}
div.frame a.pos8 img {clip: rect(0  500px 380px 430px); border-color:#d71;}
div.frame a.pos8 img {clip: rect(0, 500px, 380px, 430px); border-color:#d71;}

/* set up the default link :active for IE */
div.frame a:active {position:absolute; top:0; left:0; background:#fff; z-index:100;}

/* unclip the image */
div.frame a:active img, div.frame a:focus img {background:#fff; clip:rect(0 510px 380px 0); z-index:100;}