/**************************
* D o c u m e n t   C S S *
* L a n d s  o f  L o r e *
*  Style M é d i é v a l  *
*  S   C   R   E   E   N  *
**************************/


/* Définitions générales */

body {
	margin:0 0 0 0;
	padding:0 0 0 0;
	color:#FFF;
	font-family:"Luxi Sans", Tahoma, Verdana, sans-serif;
	font-size:0.8em;
	background-image:url(darkbkbcg.jpg);
	background-position:top left;
	background-repeat:repeat;
	background-color:#000;
}

a, a:active {
	text-decoration:none;
	background-color:inherit;
	color:#000000;
}
a:hover {
	text-decoration:underline;
	background-color:inherit;
	color:#0000FF;
}

.nostyle {
	visibility:hidden;
	font-size:0;
	height:0px;
}

.nostyle-clear {
	clear:both;
	visibility:hidden;
	font-size:0;
}

a img { border:none; }

/* Conteneurs */

div#site {
	margin:0 auto 0 auto;
	padding:0 0 0 0;
	width:85%;
	border-left:solid 5px #777;
	border-right:solid 5px #777;
	background-color:#CCC;
	color:#000;
}

div#header {
	margin:0 auto 0 auto;
	padding:0 0 0 0;
	background-color:#666;
	color:#FFF;
	height:190px;
	border-left:2px solid #666;
	border-right:2px solid #666;
	width:99%;
	text-align:center;
}
div#header img {
	position:relative;
	z-index:40;
	margin:0 auto 0 auto;
	padding:0 0 0 0;
}

div#principal {
	position:relative;
	z-index:30;
	margin:-85px auto 0 auto;
	padding:0 0 0 0;
	border-left:2px solid #666;
	border-right:2px solid #666;
	border-top:1px dotted #000;
	border-bottom:1px dotted #000;
	width:99%;
	color:#000;
	background-color:#999;
}

div#menu {
	margin:0 0 0 0;
	padding:20px 0 0 0;
	width:23%;
}
div#menu h3 {
	margin:7px 0 0 0;
	padding:2px 2px 2px 2px;
	font-size:1em;
	font-weight:bold;
}
div#menu h3.active {
	border:1px dotted #000000;
	color:inherit;
	background-color:#CCC;
}
div#menu ul {
	margin:0 0 0 20px;
	border-left:1px dotted #000000;
	border-bottom:1px dotted #000000;
	border-right:1px dotted #000000;
	color:inherit;
	background-color:#BBB;
}
div#menu li {
	margin:0 0 0 -30px;
	list-style-type:none;
	list-style-position:outside;
	line-height:120%;
}

div#contenu {
	float:right;
	margin:0 0 0 0;
	padding:50px 30px 0 30px;
	width:70%;
	border-left:1px dotted #000;
	color:#000;
	background-color:#EEE;
}
div#footer {
	clear:both;
	margin:0 auto 0 auto;
	padding:0 0 0 0;
	border-left:2px solid #777;
	border-right:2px solid #777;
	width:99%;
}
div#footer p {
	margin:0 0 0 0;
	padding:0 0 0 0;
	text-align:center;
}


/* CSS des galeries */

div.vignette-vertical, div.vignette-horizontal, div.vignette-square {
	float:left;
	margin:10px 5px 10px 5px;
	padding:5px 5px 5px 5px;
	border:1px dotted #000;
	color:#000;
	background-color:#FFF;
}

div.vignette-grande-horizontal, div.vignette-grande-vertical, div.vignette-grande-square {
	margin:20px auto 10px auto;
	padding:5px 5px 5px 5px;
	border:1px dotted #000;
	text-align:center;
	max-width:660px;
	color:#000;
	background-color:#FFF;
}

div.vignette-vertical:hover, div.vignette-horizontal:hover, div.vignette-square:hover, div.vignette-grande-horizontal:hover, div.vignette-grande-vertical:hover, div.vignette-grande-square:hover {
	background-color:#999;
	color:inherit;
}

div.vignette-horizontal img {
	margin:0 0 0 0;
	padding:0 0 0 0;
	width:160px;
	height:100px;
}
div.vignette-vertical img {
	margin:0 0 0 0;
	padding:0 0 0 0;
	width:100px;
	height:160px;
}
div.vignette-square img {
	margin:0 0 0 0;
	padding:0 0 0 0;
	width:160px;
	height:160px;
}
div.vignette-grande-horizontal img {
text-align:center;
	width:640px;
	height:480px;
}
div.vignette-grande-vertical img { 
	display:block;
	text-align:center;
	width:480px;
	height:640px;
}
div.vignette-grande-square img { 
	text-align:center;
	width:640px;
	height:640px;
}

div.vignette-vertical:hover, div.vignette-horizontal:hover, div.vignette-square:hover, div.vignette-grande-horizontal:hover, div.vignette-grande-vertical:hover, div.vignette-grande-square:hover { 
	background-color:#CCCCCC;
	color:#000000;
}