/********************

	CSS de la page
	de l'album photo

	2008-04-10

*********************/

#separator {
	width: 4px;
	position: absolute;
	top: 0;
	bottom: 0;
	background-color: #F9F9F9;
	cursor: w-resize;
}
#separator:hover {
	background-color: #a0a0a0;
}


#AlbumPhotoPage {
	position: relative;
	width: 100%;
	height: 100%;
}

/* Cadres */
.cadre {
	position: absolute;
	top: 4px;
	bottom: 0;
}
.cadre .top_left { position: absolute; top: 0; left: 0; }
.cadre .top_mid { position: absolute; top: 0; }
.cadre .top_right { position: absolute; top: 0; right: 0; }
.cadre .content { position: absolute; left: 0; right: 0; border-left: 1px solid #9BA8B1; border-right: 1px solid #9BA8B1; }
.cadre .bottom_left { position: absolute; bottom: 0; left: 0; }
.cadre .bottom_mid { position: absolute; bottom: 0; }
.cadre .bottom_right { position: absolute; bottom: 0; right: 0; }



/* Partie Gauche */
#partieGauche {
	position: absolute;
	left: 4px;
	width: 260px;
	bottom: 4px;
}
#partieGauche .content {
	top: 5px;
	bottom: 6px;
	background: white;
	overflow: auto;
}
#ctl00_ContentPlaceHolder1_ListeAlbums {
	
}
#partieGauche .top_left {
	background: url(../images/cadreTT_r1_c1.png);
	width: 5px;
	height: 5px;
}
#partieGauche .top_mid {
	left: 5px;
	right: 5px;
	background: url(../images/cadreTT_r1_c2.png);
	height: 5px;
}
#partieGauche .top_right {
	background: url(../images/cadreTT_r1_c3.png);
	width: 5px;
	height: 5px;
	right: 0px;
	top: 0;
}
#partieGauche .bottom_left {
	background: url(../images/ModBM_r3_c1.png);
	width: 5px;
	height: 6px;
}
#partieGauche .bottom_mid {
	left: 5px;
	right: 6px;
	background: url(../images/ModBM_r3_c2.png);
	height: 6px;
}
#partieGauche .bottom_right {
	background: url(../images/ModBM_r3_c3.png);
	width: 6px;
	height: 6px;
}






/* Partie Centrale (milieu) */
#AlbumPhotoPage #partieMilieu {
	left: 268px;
	right: 4px;
	top: 4px;
	bottom: 4px;
}
#partieMilieu .content {
	top: 5px;
	bottom: 6px;
	background-color: white;
	overflow: auto;
}
#partieMilieu .top_left {
	background: url(../images/cadreTT_r1_c1.png);
	width: 5px;
	height: 5px;
}
#partieMilieu .top_mid {
	left: 5px;
	right: 5px;
	background: url(../images/cadreTT_r1_c2.png);
	height: 5px;
}
#partieMilieu .top_right {
	background: url(../images/cadreTT_r1_c3.png);
	width: 5px;
	height: 5px;
}
#partieMilieu .bottom_left {
	background: url(../images/ModBM_r3_c1.png);
	width: 5px;
	height: 6px;
}
#partieMilieu .bottom_mid {
	left: 5px;
	right: 6px;
	background: url(../images/ModBM_r3_c2.png);
	height: 6px;
}
#partieMilieu .bottom_right {
	background: url(../images/ModBM_r3_c3.png);
	width: 6px;
	height: 6px;
}









/* Design de l'interieur des RoundedFrames */
#TipEditTable {
	border-collapse: collapse;
	padding: 0;
	margin: 0;
	width: 90%;
}

#TipEditTable td {
	font-size: 8pt;
	padding: 6px;
}
#TipEditTable td.title {
	text-align: right;
	width: 25%;
	color: #555555;
}

.album div.title, .photo div.title, .content div.title {
    margin: 0 0 20px 20px;
    text-align: left;
    font-family: 'Tahoma';
    font-size: 8pt;
    font-weight: bold;
    color: #666699;
}
.album span.label { display: block; float: left; font-size: 8pt; width: 180px; text-align: right; padding-right: 6px;}
.album p { margin: 10px; font-size: 8pt; }
.album .center { text-align: center; }
.album .right { text-align: right; }
.album input, .album select { border: 1px solid #CCCCCC; font-size: 8pt; }

a.button {
	background: url(../images/bouton.png) no-repeat top left white;
	display: block;
	width: 130px;
	font-size: 10pt;
	font-weight: bold;
	color: white;
	padding-top: 5px;
	height: 24px;
	text-align: center;
}


a.cancelButton {
	background: url(../images/boutonAnnuler.png) no-repeat top left white;
	display: block;
	width: 70px;
	font-size: 10pt;
	font-weight: bold;
	color: black;
	padding: 4px 0 0 30px;
	height: 25px;
	text-align: left;
}

.album input.cancelButton { background: url(../images/delete.gif) 4px center no-repeat; padding-left: 25px; }


p.info, div.info {
	position: relative;
	margin: 10px;
	padding: 8px 8px 8px 28px;
	background: url(../images/info.gif) no-repeat 4px 7px #FFFF88;
	border: 1px solid #AAAA20;
	color: #808010;
}
p.error, div.error {
	position: relative;
	margin: 10px;
	padding: 8px 8px 8px 28px;
	background: url(../images/error.gif) no-repeat 4px 7px #FFEFEF;
	border: 1px solid #C14A31;
	color: #C14A31;
}

input.error {
	background-color: #FFEFEF;
	border: 1px solid #C14A31;
}


.photo {
	text-align: center;
	position: relative;
}
.photo a.delete {
	display: block;
	position: absolute;
	background: url(../images/close.png) no-repeat center white;
	width: 25px;
	height: 25px;
	top: 0px;
	right: 0px;
}

.photo img.image {
	border: none;
	height: 140px;
	width: 180px;
	cursor: pointer;
}

.photo .legend {
	padding-top: 4px;
	position: absolute;
	background: white;
	bottom: 0;
	width: 100%;
	left: 0;
	right: 0;
	text-align: center;
	font-size: 8pt;
	font-family: "Arial";
}

.photo .handle {
	background: url(../images/MdlMove.png) no-repeat center white;
	width: 25px;
	height: 25px;
	position: absolute;
	top: 0;
	right: 25px;
	cursor: move;
}