/******************************************************************************/
/*     GÉNÉRAL                                                                */
/******************************************************************************/

/*
#82222d : panneau foncé
#fef6df : panneau clair
#527196 : bleu gris (lien internet)
*/

/* Entête du site */
html
{
	font-family:sans-serif;
}

body {
	margin:0;
	padding:0;
}

A {
	text-decoration:none;
	color:#527196;
}
A:hover {
	text-decoration:none;
	color:#6b91bf;
}

#page { /* page plein écran nécessaire pour le centrage du div conteneur */
	position:absolute;
	left:0;
	right:0;
	width:100%;
	height:100%;
	background-color:#8eb5de;
	background-position:top;
	background-repeat:no-repeat;
	background-image:url(../ressources/sapins.jpg);
}

#conteneur {
	position:relative;
	margin:auto;
	width:1022px;
	height:100%;
	background-color:white;
	background-image:url(../ressources/horizon.jpg);
	background-position:bottom;
	background-repeat:no-repeat;
	border-left:black solid 1px;
	border-right:black solid 1px;
}


/* bannière vue du village */
#extra1 {
	position:absolute;
	left:0px;
	top:0px;
	width:1024px;
	height:129px;
	background-color: #82222d;
	background-image:url(../ressources/banniere-vls-1024.jpg);
	background-repeat:no-repeat;
	background-position:center;
	z-index:40;
}
/* titre du site */
#extra2 {
	position:absolute;
	right:10px;
	top:55px;
	width:400px;
	height:180px;
	background-image:url(../ressources/titre-vls-400-bordeaux.png);
	background-repeat:no-repeat;
	z-index:80;
}
/* logo du site */
#site-logo {
	position:absolute;
	left:25px;
	top:45px;
	z-index:70;
	opacity:0.9;
}
#site-logo:hover {
	opacity:1;
}
#site-logo img {
	border:none;
}


#zone-titre {
	position:relative;
	left:0;
	right:0;
	top:130px;
	padding-left:250px;
	padding-top:0.02em;
	padding-bottom:0.02em;
	font-size:1.1em;
	font-family:cursive;
	font-style:italic;
	font-weight:bold;
	font-stretch:condensed;
	letter-spacing:0.2em;
	word-spacing:0.8em;
	color:#fef6df;
	background-color:#82222d;
	border-bottom: solid black 0.2em;
	z-index:40;
}
#zone-titre h1 {
	padding:0.1em;
	margin:0.1em;
	font-size:1.5em;
}
#titre-site {
	display:none; /* lien Villey-le-Sec caché */
}


/* barre inférieure */
#zone-final { 
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	font-size:0.7em;
	font-style:italic;
	background-color: #82222d;
	padding:0.2em;
}

#zone-final A { /* administrer */
	display:inline;
	margin:0;
	padding-left:1em;
	padding-right:5%;
	color:#fef6df;
}
#zone-final P { /* powimod */
	display:inline;
	color:#fef6df;
}

#zone-admin {
	position:absolute;
	left:10%;
	top:240px;
	width:80%;
	bottom:3em;
	border: solid #0B691B 1px;
	padding:10px;
	overflow:auto;
	
}
#bouton-modification, .bouton-edition {
	padding:0mm;
	background-color:red;
	padding:0.1em;
	margin:0.1em;
	font-size:0.6em;
}

/******************************************************************************/
/*     PAGE D'ACCUEIL                                                         */
/******************************************************************************/



/* diaporama */
#acc-zone-diaporama {
	position:absolute;
	bottom:11%;
	right:47%;
	width:32%;
	height:38%;
}
#acc-diapo-1 {
	position:absolute;
	left:15%;
	top:0%;
}
#acc-diapo-2 {
	position:absolute;
	left:0;
	top:40%;
}
#acc-diapo-3 {
	position:absolute;
	right:0;
	top:20%;
}

.diapo-cadre {
	position:relative;
	left:0px;
	top:0px;
	background-color:#fef6df;
	padding:11px;
	border:outset 1px;
	display:block;
}
.diapo-cadre > img {
	width:200px;
	height:150px;
	border:inset 1px;
}

.diapo-ombre {
	position:absolute;
	left:10px;
	top:10px;
	width:200px;
	height:160px;
	display:block;
	background-color:black;
	opacity:0.6;
}


/* Page d'accueil - zone de présentation */
#acc-zone-presentation {
	position:absolute;
	bottom:64%;
	left:580px;
	font-size:0.9em;
	z-index:60;
	width:400px;
	font-style:italic;
}
#acc-zone-presentation p {
	color:#82222d;
	text-align:center;
}

/* Page d'accueil - nouvelles */

/* panneau */
.zone-nouvelles {
	position:absolute;
	right:0;
	bottom:0.5em;
	width:500px;
	height:571px;
	background-image:url(../ressources/panneau.png);
	background-repeat:no-repeat;
	z-index:99;
}
.zone-nouvelles h2 {
	margin-top:180px;
	margin-left:60px;
	margin-bottom:0.2em;
	color:#82222d;
	font-size:1.0em;
	font-weight:bold;
	font-style:italic;
}
.zone-nouvelles dl, .zone-nouvelles p {
	height:280px;
	width:380px;
	margin-left:60px;
	overflow:auto;
	color:#ADAE66;
}
.zone-nouvelles dt {
	padding-left:0.5em;
	font-size:0.9em;
	font-weight:bold;
	color:#197F44;
}
.zone-nouvelles dd {
	margin:0;
	margin-left:0.8em;
	padding-left:0.5em;
	margin-top:0.5em;
	margin-bottom:0.5em;
	font-size:0.8em;
	color:#ADAE66;
	border-left:solid #197F44 1px;
}

/* Page d'accueil - liste des sections*/
#acc-zone-sections{
	padding:0;
	margin:0;
	z-index:50;
}
#acc-zone-sections h2{
	display:none;
}
#acc-zone-sections ul{
	margin:0;
	padding:0;
}
#acc-zone-sections li{
	display:block; /* suppression de la puce */
	width:180px;
	height:72px;
	font-size:1.0em;
	font-weight:bold;
	font-style:italic;
}

#acc-zone-sections ul li > a{ 
	position:absolute;
	left:0;
	top:0;
	width:110px;
	padding-left:70px;
	padding-right:10px;
	height:65px;
	padding-top: 25px;
	background-repeat:no-repeat;
	color:#f6ee6c;
}

#acc-zone-sections ul li > a:hover {
	font-size:1.05em;
	color:#FFF1D3;
	opacity:0.8;
}
/* bouton d'édition de la section */
#acc-zone-sections ul li span > a{
	position:absolute;
	left:170px;
	top:40px;
}

#acc-section-1 { /* le village */
	position:absolute;
	bottom:62%;
	right:48%;
	z-index:80;
	background-image:url(../ressources/bouton-photo-galet-fleur-3.png);
}
#acc-section-2 { /* tourisme */
	position:absolute;
	bottom:56%;
	right:64%;
	z-index:80;
	background-image:url(../ressources/bouton-photo-galet-fleur-4.png);
}
#acc-section-3 { /* le Fort */
	position:absolute;
	bottom:45%;
	right:74%;
	z-index:80;
	background-image:url(../ressources/bouton-photo-galet-fleur-2.png);
}
#acc-section-4 { /* Foyer rural */
	position:absolute;
	bottom:33%;
	right:79%;
	z-index:80;
	background-image:url(../ressources/bouton-photo-galet-fleur-1.png);
}
#acc-section-5 { /* Mairie */
	position:absolute;
	bottom:19%;
	right:81%;
	z-index:80;
	background-image:url(../ressources/bouton-photo-galet-fleur-5.png);
}
#acc-section-6 { /* école */
	position:absolute;
	bottom:6%;
	right:82%;
	z-index:80;
	background-image:url(../ressources/bouton-photo-galet-fleur-6.png);
}

/******************************************************************************/
/*     PAGE RUBRIQUE                                                          */
/******************************************************************************/

/* titre de la rubrique */
#rub-zone-titre {
	position:absolute;
	top:172px;
	left:27%;
	width:69%;
	color:#82222d;
	letter-spacing:0.2em;
	word-spacing:1.1em;
	font-style:italic;
	font-size:0.9em;
}

/* Page rubrique - corps de la page composée d'une liste d'éléments */
#rub-zone-corps {
	position:absolute;
	left:27%;
	bottom:1.5em;
	width:69%;
	top:230px;
	border-color:#82222d;
	border-style:dotted;
	border-width:1px;
	border-left-style:solid;
	border-left-width:1em;
	padding-left:0.8em;
	padding-right:0.3em;
	overflow:auto;
	color:#742a2b;
}
#rub-zone-corps p {
	margin:0.6em;
	text-align:justify;
}
#rub-zone-corps h1 {
	padding:0.2em;
	padding-left:0.5em;
	margin-left:0em;
	font-size:1.8em;
	font-style:oblique;
	clear:both;
	color:#cc0a2c;
	display:list-item;
	list-style-image:url(../ressources/puce1.png);
	list-style-position:inside;
}
#rub-zone-corps h2 {
	padding:0.2em;
	padding-left:0.5em;
	margin-left:1.0em;
	font-size:1.5em;
	font-style:oblique;
	clear:both;
	color:#cc0a2c;
	display:list-item;
	list-style-image:url(../ressources/puce2.png);
	list-style-position:inside;
}
#rub-zone-corps h3 {
	padding:0.2em;
	padding-left:0.5em;
	margin-left:2.0em;
	font-size:1.4em;
	font-style:oblique;
	clear:both;
	color:#cc0a2c;
	display:list-item;
	list-style-image:url(../ressources/puce3.png);
	list-style-position:inside;
}
#rub-zone-corps h4 {
	padding:0.2em;
	padding-left:0.5em;
	margin-left:3.0em;
	font-style:oblique;
	font-size:1.3em;
	clear:both;
	color:#cc0a2c;
	display:list-item;
	list-style-image:url(../ressources/puce4.png);
	list-style-position:inside;
}
#rub-zone-corps img {
	margin:auto;
	border:solid 1px;
	display:block; /* afficher la légende dessous */
}

#rub-zone-corps td , #rub-zone-corps th {
	border:solid black 1px;
	padding-top:0.2em;
	padding-bottom:0.2em;
	padding-left:0.5em;
	padding-right:0.5em;
}
#rub-zone-corps th {
	background-color:#82222d;
	color:white;
}

#rub-zone-info {
	position:absolute;
	right:6.5em;
	bottom:0.4em;
	font-size:0.7em;
	z-index:99;
	color:white;
}

#rub-zone-navigation {
	display:none;
	clear:both;
}

/******************************************************************************/
/*     MENU DES RUBRIQUES COMMUNES AUX SECTIONS ET RUBRIQUES                  */
/******************************************************************************/

/* Page section - menu liste des rubriques */
.zone-rubriques {
	position:absolute;
	bottom:1.5em;
	top:230px;
	left:0.5em;
	width:23%;
	padding-left:0.5em;
	border-color:#82222d;
	border-style:dotted;
	border-width:1px;
	border-left-style:solid;
	border-left-width:1em;
	overflow:none;
	z-index:10;
}
.zone-rubriques h2 {
	margin:0;
	margin-top:0.3em;
	margin-bottom:0.3em;
	color:#571414;
	font-size:1.1em;
	font-style:italic;
	font-weight:bold;
}
.liste-rubriques {
	overflow:auto;
	height:70%;
}
.zone-rubriques ul {
	margin-top:0;
	padding-left:1.5em;
}

.zone-rubriques li {
	display:list-item;
	padding-top:5;
	list-style-type:disc;
	padding-left:0;
}
.zone-rubriques a {
	font-size:0.8em;
}


/* logo de la section (commun aux pages section et rubrique) */
.logo-section {
	position:absolute;
	left:4em;
	bottom:2.5em;
	z-index:70;
}
.logo-section img {
	border:none;
}
.retour-accueil {
	position:absolute;
	left:2.3em;
	bottom:3em;
	z-index:70;
	background-color:#fef6df;
	padding:0.2em;
	padding-left:1em;
	padding-right:1em;
	border:solid 1px #527196;
	font-size:0.9em;
	letter-spacing:0.2em;
}


/******************************************************************************/
/*     DIAPORAMA                                                              */
/******************************************************************************/
#diaporama-titre {
	background-color:#82222d;
	color:white;
	padding-top:0.3em;
	padding-bottom:0.3em;
	padding-left:2%;
	font-size:1.6em;
	font-style:italic;
}
#diaporama-navigation a {
	width:10%;
	background-color:#fef6df;
	border:solid #82222d 1px;
	font-size:0.8em;
	text-align:center;
}

#diaporama-bouton-precedent {
	position:absolute;
	top:50%;
	left:1%;
}
#diaporama-bouton-suivant {
	position:absolute;
	top:50%;
	right:1%;
}
#diaporama-bouton-retour {
	position:absolute;
	top:1%;
	right:1%;
}
#diaporama-legende{
	position:absolute;
	bottom:0;
	width:98%;
	background-color:#fef6df;
	text-align:center;
	font-style:italic;
	border-top:solid #82222d 1px;
	padding-top:0.2em;
	padding-bottom:0.2em;
	padding-right:1%;
}
#diaporama-image {
	position:static;
	padding-top:1%;
	width:100%;
	text-align:center;
}