body {
	margin:0px;
	padding:0px;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:12px;
	background-color:#FFF;
}

a {	text-decoration:none;}
img { border:none;}

.lookbook {
	position:relative;
	width:975px;
	height:745px;
	background-color:#FFF;
}

.header {
	position:relative;
	height:25px;
	width:975px;
}

.bt-header {
	position:absolute;
	width:140px;
	height:18px;
	font-weight:bold;
	color:#FFF;
	background-color:#CCC;
	text-align:center;
	text-decoration:none;
}

.bt-header:hover {
	background-color:#AAA;
	text-decoration:none;
}


.bt-header.retour-mos {
	right:5px;
}

.bt-header.sel-look {
	right: 5px;
}

.sect {
	position:relative;
	clear:both;
}

.c-over {
	cursor:pointer;
}


.visuinfo-fleche {
	text-align:right;
}

.visuinfo-titre {
	font-size:17px;
	width: 210px;
}

.mt10 {margin-top:10px;}

.slider-cont-visuel {
	float: left;
	width:550px;
	height:720px;
	margin-right: 100px;
	position:relative;
}

.visuel-infos {
	position:absolute;
	width:130px;
	height:230px;
	top:260px;
	left:30px;
	z-index:200;
}

.visuel-image {
	position:absolute;
	top:12px;
	left:12px;
	width:525px;
	height:694px;
	z-index:100;
}


.visuel-fond {
	position:absolute;
	width:550px;
	height:720px;
	z-index:90;
}



#zone-debug {
	width:300px;
	height:700px;
	overflow-y:scroll;
	position:fixed;
	bottom:0px;
	right:0px;
	font-size:12px;
	font-family:"Courier New", Courier, monospace;
	border:1px solid #DDD;
}


#slideur, #mosaic-conteneur {
	position:absolute;
	width:975px;
	height:720px;
	position: relative;
	background-color:#FFF;
}

#mosaic {
	left:44px;
	width:887px;
	height:720px;
	position: relative;
}

#slideur-masque {
	height:720px;
	overflow:hidden;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 975px;
}

#slideur-ruban {
	min-width:300px;
	height:720px;
	position: absolute;
	top: 0px;
	left: 212px;
}


.bouton-ruban {
	position:absolute;
	top:0px;
	height:720px;
	width:40px;
	background-repeat: no-repeat;
	background-position: center center;
	z-index: 50;
	cursor:pointer;
}

.bouton-ruban.left {
	left:140px;
	background-image: url(../img/elt/fleche-prec.png);
}

.bouton-ruban.right {
	right:140px;
	background-image: url(../img/elt/fleche-suiv.png);
}

.ombre-slideur {
	background-repeat: no-repeat;
	height: 720px;
	width: 20px;
	padding-top: 0px;
	position: absolute;
	z-index: 1000;
}

.ombre-slideur.left {
	left:0px;
	background-image: url(../img/elt/ombre-gauche.png);
}

.ombre-slideur.right {
	right:0px;
	background-image: url(../img/elt/ombre-droite.png);
}


/*** MOSAIC **/
.pict {
	position:absolute;
	top:8px;
	left:8px;
	z-index:10;
	width:202px;
}

.pict-roll {
	position:absolute;
	top:8px;
	left:8px;
	z-index:9;
	width:202px;
	
}

.pict-fond {
	position:absolute;
	top:0px;
	left:0px;
	z-index:5;
	width:218px;
}

.back-fille {
	background-color: #CCD9E1;
}

.back-garcon {
	background-color: #C7C4B7;
}

.pic-cont {
	position:absolute;
	width:218px;
}

.pic-cont:hover {
	cursor:pointer;
}
