/* Mise en forme générale */
body{
	margin: 0;
	background:#736c5a url(/images/fond_page.jpg) repeat-x;
	font-family: Lucida Sans, sans-serif;
	color: #6b4210;
	font-size: 10px;
}
h1{
	margin: 0 0 20px 0;
	font-size: 12px;
	text-transform: uppercase;
}
h2{
	font-size: 11px;
	padding:0;
	margin:9px 0 9px 0;
}
p{
	margin: 5px 0 5px 0;
}
ul{
	list-style: none;
	padding: 0;
	margin: 0;
}
a{
	color: #6b4210;
}
a img{
	border:none;
}
a:active, a:focus{
   outline:none;
   color: #000;
}
a.marque{
    display: block;
    margin: 0 0 10px 10px;
}
/* Formulaires */
iframe{
	margin: 20px 0 0 0;
	border: 1px solid #d4cebf;
}
form{
	margin: 20px 0 0 0;
	font-size: 10px;
}
form p{
	float: left;
	clear: left;
	margin: 5px 0;
	width: 600px;
}
form label{
	display: block;
	float: left;
	width: 120px;
	text-align: right;
	padding-right: 10px;
}
form input,
form textarea{
	float: left;
	color: #201303;
	border: 1px solid #d4cebf;
}
form input:focus,
form textarea:focus{
	background-color: #f9f9f9;
}
.boutons{
	padding-left: 130px;
}
.boutons input{
	border: 1px solid #d4cebf;
	background-color: #e5e0d3;
	margin-right: 10px;
	color: #7b5220;
}
span.required{
	display:inline;
}
/* Conteneur de la page */
#page{
	width: 802px;
	margin: 0 auto;
}
#page #centre{
	height: 502px;
	background: url(/images/fond.png) no-repeat;
	overflow: hidden;
}
/* Haut de page */
#haut{
	margin: 40px 0;
}
#logo a{
	display: block;
	width: 222px;
	height: 35px;
	background: url(/images/logo_lothaire.png) no-repeat;
}
#logo a span{
	display: none;
}
/* Menu */
#contMenu{
	float: left;
	width: 150px;
	height: 500px;
	/*background-color: #d4cebf;*/
	background-color: #c4beaf;
	font-size: 11px;
	margin: 0;
	overflow: hidden;
}
#contMenu div{
	height: 5000px;
}
.menu{
	padding: 20px 0 0 12px;
	height: 480px;
}
.menu li a{
	display:block;
	text-decoration: none;
	height: 29px;
}
.menu ul{
	margin-bottom:20px;
}
.menu ul li a{
	display:inline;
	line-height: 16px;
}
.menu li a.selectionne{
	color: #201303;
}
.menu li a#lienServices{
	height:40px;
}
.menu li a#retour{
	display: block;
	width: 120px;
	line-height: 15px!important;
	font-size: 10px;
	font-weight: bold;
	background: url(/images/fleche_gauche.gif) no-repeat;
	text-decoration: none;
	margin: 30px 0 0 0;
	padding: 0 0 0 20px;
	position: absolute;
	top: 550px;
}
.menu li a#retour:hover{
	background: url(/images/fleche_gauche_roll.gif) no-repeat;
}
/* contenu */
#contenu{
	float: left;
	width: 650px;
	height: 500px;
	overflow: hidden;
	position:relative;
	background-color: #e5e0d3;
}
#contenu #container{
	height: 2000px;
}
#principal,
#supplementaire{
	float: left;
	clear: left;
	width: 610px;
	height: 500px;
	padding: 20px;
}
.separateur{
	clear:both;
}
.gauche{
	float:left;
	margin:0 20px 20px 0;
}
.droite{
	float: right;
}
.colonne{
	float: left;
	width: 100%;
}
.principale{
	width: 493px;
}
.secondaire{
	width: 100px;
	padding: 0 0 0 10px;
}
.secondaire p{
	padding-left:12px;
}
.principale_small{
    width: 374px;
}
.secondaire_big{
    width: 219px;
	padding: 0 0 0 10px;
}
/* Diaporama */
.diaporama{
	margin: 0 0 10px 0;
	width: 492px;
	height: 369px;
	position:relative;
	overflow: hidden;
	border: 1px solid #d4cebf;
}
.diaporama ul{
	position:relative;
	height: 370px;
	margin:0;
	padding:0;
}
.diaporama ul li{
	position:absolute;
	width:492px;
}
.diaporama ul li span{
	display:block;
	height:20px;
	line-height:20px;
	text-align:center;
	position:relative;
	top:-20px;
	z-index:10;
}
.diaporama div{
	position: absolute;
	z-index: 1;
	width: 246px;
	height: 370px;
	float: left;
	cursor: pointer;
	display: block;
}
.diaporama div.precedent{
}
.diaporama div.suivant{
	margin-left:248px;
}
.diaporama div span{
	display:block;
	width:20px;
	height:20px;
	margin-top:175px;
	background: url(/images/fond-diapo.png);
}
.diaporama div span span{
	margin-top:0!important;
}
.diaporama div.precedent span{
	float:left;
}
.diaporama div.suivant span{
	float:right;
}
.diaporama div.precedent span span{
	background: url(/images/fleche_diapo_gauche.gif) no-repeat center;
}
.diaporama div.suivant span span{
	background: url(/images/fleche_diapo_droite.gif) no-repeat center;
}
/* Petits diaporamas (ex : pages historique) */
.diaporama.petit{
	width: 372px;
	height: 260px;
}
.diaporama.petit div{
	width: 186px;
	height: 260px;
}
.diaporama.petit div.suivant{
	margin-left:188px;
}
.diaporama.petit div span{
	margin-top:120px;
}
.diaporama.petit li{
	width: 372px;
}

/* Marques */
.marques{
	padding-top:0;
	width:100%;
	height: auto;
}
.marques li a{
	text-decoration:none;
	white-space:nowrap;
	display:block!important;
	height:auto!important;
	padding-right:20px;
}
.marques li a:hover{
	color:#201303;
}
.marques ul{
	margin-bottom:10px;
}
.cadre{
	position:absolute;
	display:none;
	width:152px;
	height:153px;
	padding:10px;
	background:url(/images/fond_vignette.png) no-repeat;
	margin:-64px 0 0 -10px;
}
/* adresse et lien */
address{
	font-size: 10px;
	font-style: normal;
	float: left;
}
.more a{
	display: block;
	width: 120px;
	line-height: 15px;
	float: right;
	text-align: right;
	padding: 0 20px 0 0;
	font-size: 10px;
	font-weight: bold;
	background: url(/images/fleche_droite.gif) 130px 0 no-repeat;
	text-decoration: none;
}
.more a:hover{
	background: url(/images/fleche_droite_roll.gif) no-repeat;
}
/* Partenaires  */
.partenaires li{
	float:left;
	width:48%;
	height:100px;
	margin: 0 2% 20px 0;
}
.partenaires li a.image{
	display:block;
	width:110px;
	height:120px;
	float:left;
	text-align:center;
}
.partenaires li h2{
	margin:0;
}
/* Image panoramique */
#panorama{
	width: 493px;
	height: 370px;
	overflow: hidden;
	position: relative;
	margin:0 0 10px 0;
}
#panorama div{
	height: 370px;
	position: absolute;
	display: block;
	float: left;
}
#panorama div img{
	display: block;
	float: left;
}
/* Définir la taille des images panoramiques permet de résoudre le bogue du défilement de l'image, qui sinon ne se fait pas la première fois que l'image est chargée */
#espace_mariage #panorama{
	background:#fff; /* L'image de l'espace mariage boucle mal..., un fond blanc permet de cacher de bogue*/
}
#espace_mariage #panorama div img{
	/*width:1166px;*/
	width:889px;
	height:370px;
}
#espace_cuir #panorama div img{
	width:1007px;
	height:370px;
}
/* Carte Google Maps */
#map{
	width: 600px;
	height: 400px
}
#map .nom{
	font-size: 10px;
	font-weight: bold;
	margin: 0;
	padding: 0;
}
#map .addr{
	font-size: 10px;
	font-weight: normal;
	margin: 0;
	padding: 0;
}
/* Bas de page */
#bas{
	text-align:center;
	color:#e5e0d3;
}
#bas a{
	text-decoration:none;
	color:#e5e0d3;
}
/* Page d'accueil */
#accueil #logo_accueil{
	position:absolute;
	z-index:10;
	opacity:0;
	-moz-opacity:0;
	width:100%;
	margin:220px 0 0 0;
	text-align:center;
}
#accueil #logo_accueil h1{
	text-transform:none;
	font-weight:normal;
	color:#fff;
}
#accueil #panorama{
	width: 610px;
	height: 460px;
	margin:0;
}
#accueil #panorama div{
	width:2466px;
	height:460px;
	top:0px;
	left:0px;
}
#accueil #panorama div img{
	width:2466px;
	height:460px;
}
#accueil #principal{
	position:relative;
}
#accueil #video{
	position:absolute;
	z-index:1000;
	top:20px;
	left:20px;
	width:610px;
	height:460px;
}
/* Espace mariage */
#espace_mariage .colonne.secondaire p{
	margin-top:220px;
}
#espace_mariage .colonne.secondaire p span.more a{
	width:80px;
	float:none;
	text-align:left;
}