@import url(general.css);
@import url(navigation.css);
@import url(slimbox.css);

a img { border: 0; }
#content a { background-color: #fff; color: #000; }

#content img { float: left; margin: 0 10px 15px 0; }

#content p { margin: 10px 0; line-height: 16px; text-align: justify;}
#content div.promotion { position: relative; width: 620px; }
#content div.promotion img { float: left; margin: 0; padding: 0; border: 0;}
#content div.promotion a { font: 11px Georgia, "Times New Roman", Times, serif; font-variant:small-caps; text-decoration: none; line-height: 22px;}

#content p.promotion-mairie { float: left; width:190px; text-align: left; margin: 0; padding-left:20px; padding-top: 20px;}
#content p.promotion-laffiche { float: left; width:200px; text-align: left; margin: 0; padding-top: 40px;}
#content p.promotion-clermont-com { float: left; width:190px; text-align: left; margin: 0; padding-top: 30px; padding-left: 15px;}
#content p.promotion-mairie img, #content p.promotion-laffiche img, #content p.promotion-clermont-com img { position:relative; float: none; padding: 0; margin-bottom: 10px;}


#content p.navigation { 
	font: 12px Georgia, "Times New Roman", Times, serif; font-style:italic;
	margin: 8px 0; 
	text-align: left;
	background-color: #fff; color: #aaa;
}
#content p.navigation a { font-weight: normal;background-color: #fff; color: #aaa; margin-left: 5px;}
#content p.entete { 
/*background-color: #009036;  color:#fff; width: 65%; padding:5px;*/
 font: 16px Georgia, "Times New Roman", Times, serif;
 background-color: #fff; color: #999;
 margin-bottom: 0; margin-top: 20px; border-left: 15px solid #efefef; padding: 0; padding-left: 10px;}
#content .chapo { margin: 0 0 0 20px; border-left: 15px solid #efefef; padding-left: 10px; padding-top: 5px;}
#content p.en_savoir_plus { margin-top: 0; margin-bottom: 35px; padding-top: 5px;}
#content p.en_savoir_plus a, #content p.en_savoir_plus a:hover { background: url(../images/puce-chapo.png) top right no-repeat #fff; color: #009036; padding-right: 15px;}
#content p.en_savoir_plus a:hover { background-image: url(../images/puce-chapo-over.png); color: #000;}

#content div.telechargement { background-color: #f0f0f0; margin-bottom: 20px;}
#content div.telechargement p.entete-lettre { padding-top: 5px; font: 13px Arial, Helvetica, sans-serif; background-color: #f0f0f0;}
#content div.telechargement img, #content div.bulletin img { float: left; padding: 5px;}
#content div.telechargement a{ background-color: #f0f0f0; }
#content div.telechargement a.entete{ font-weight: bolder; text-decoration: none; background-color: #f0f0f0; }

#content div.bulletin { background-color:#cceeff; color: #000; margin-bottom: 20px; }
#content div.bulletin p.entete-bulletin { padding-top: 5px; font: 13px Arial, Helvetica, sans-serif; background-color: #cceeff;}
#content div.bulletin  a { background-color: #cceeff; color: #000; font-weight: bolder; text-decoration: none;}


#content h1 { font: 22px Georgia, "Times New Roman", Times, serif; background-color: #fff; color: #000;text-transform: uppercase;}
#content h2 { font: italic 11px Georgia, "Times New Roman", Times, serif; line-height: 16px; background-color: #fff; color: #666; text-align: justify; margin: 5px 0 10px 0;}
#content h3 { font: 15px Georgia, "Times New Roman", Times, serif; margin-top: 20px; padding: 5px; margin-bottom: 0; background: url(../images/puce-h3.png) top right no-repeat #f9f9f9;  color: #009036;}
#content h3  + p { margin-top: 5px; }

#content h1 span.categorie { background-color: #fff; color: #813246; }


#content ul { width: 95%; margin: 0; padding-left: 5%; text-align: justify; }
#content ul li { 
	margin: 15px 0; padding-left: 15px; 
	list-style-type: none;
	background: url(../images/puce-chapo.png) 0 1px no-repeat #fff; }


#content .commerce_activite { border-collapse: collapse; margin-top: 15px;}
#content .commerce_activite td { vertical-align: top; text-align: left; padding: 4px;} 
#content .commerce_activite td.type { width: 25%; }
#content .commerce_activite td.lib { width: 20%; background-color: #fff; color: #009036;}
#content .commerce_activite td.adresse { width: 25%; }
#content .commerce_activite td.coord { width: 30%; padding-left: 25px;}
#content .commerce_activite td.spacer { height: 25px; border: 0; background: url(../images/contenu-sep.png) top left repeat-x #fff; color: #000;}


#mapContainer { position: relative; margin-top: 25px; }
#mapContainer .toolbar { position:relative; width: 100%; height: 29px; background-color: #009036; color: #fff; }
#mapContainer .toolbar p { font: 15px Georgia, "Times New Roman", Times, serif; margin-top: 20px; padding: 5px; margin-bottom: 0; background: url(../images/puce-h3.png) top right no-repeat #f9f9f9;  color: #009036;}
#map { position: relative; } 

#popup {
	position:fixed; top: 0; left: 0;
	width: 100%; height: 100%;
	z-index: 10000;
	display: none;
}
#popup.show { display: block; }
#popup div.background { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000; color: #fff; opacity: 0.5; z-index: 10001; }
#popup div.message {
	background-color: #fff; color: #000;
	border: 5px solid #adc36c;
	position: relative; 
	width: 350px; height: auto;
	margin: 150px auto; padding-top: 30px;
	z-index: 10002;
}
#popup div.message p { padding: 5px; padding-top: 0; font-family: Arial, Helvetica, sans-serif; font-size: 13px; text-align: center; color: #000; background-color: #fff;}
#popup div.message p span.rouge { background-color: #e75c5c; color: #fff; font-size: 11px; padding: 0 5px; }
#popup div.message p.link { padding: 20px; font-family: Georgia, "Times New Roman", Times, serif; font-weight: bolder; font-size: 10px; text-transform: uppercase; text-align: center; cursor: pointer; color: #000;}
#popup div.message p.footer { margin:0; padding:3px 0; background: url(../images/formulaire-erreur-footer.png) top left no-repeat #fff; color: #000; }

#formPano .error { border: 1px solid #d3d3d3; background-color: #e75c5c; color: #fff;}

#formPano input, #formPano select { font-size: 11px; }
#formPano { position: relative; margin: 15px auto; width: 523px; }
#formPano input, #formPano select { background-color: #f3f3f3; color: #000; border: 1px solid #d3d3d3; padding: 4px;}
#formPano input:hover, #formPano input:focus, #formPano textarea:hover, #formPano textarea:focus { background-color: #e1e1e1; color: #000; border: 1px solid #b0b0b0; }
#formPano input.t1 { width: 92%; }
#formPano input.l1 { width: 100%; }
#formPano input.l2 { width: 78%; }
#formPano input.sbt { background-color:#fff; color:#000; border:0; padding: 0;}
#formPano td.e1 { width: 110px; vertical-align: top;}
#formPano td.e2 { width: 70px; text-align: right; padding-right:10px;}
#formPano td.s { height: 20px; }
#formPano select { width: 75%; }
#formPano input.rd { margin-right: 8px;  margin-bottom: 8px;}
#formPano textarea { width: 92%; background-color: #f3f3f3; color: #000; border: 1px solid #d3d3d3; padding: 4px; height: 150px; font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-weight: bolder;}
#formPano input.valider { width:100%; font: 12px Georgia, "Times New Roman", Times, serif; background-color: #6699cc; color: #000; border: 1px solid #3a6fbf; cursor: pointer;}


#content ul.searchResult { margin: 10px 0; }
#content ul.searchResult a.title { margin: 10px 0; background-color: #fff; color:#813246; font-weight: bolder;text-decoration: none; }
#content ul.searchResult a.title:hover { background-color: #fff; color:#adc36c; font-weight: bolder; text-decoration: underline; }
#content ul.searchResult a.normal { background-color: #fff; color:#000; font-weight: normal; text-decoration: none; }
#content ul.searchResult a.normal:hover { background-color: #fff; color:#000; font-weight: normal; text-decoration: underline; }
#content ul.searchResult span { background-color: #fff; color:#777;}


/*#gallery { position: relative; width: 580px; padding-top: 20px; }
#gallery div.viewer { position: relative; width: 580px; height: 100%; padding-bottom: 0px;  background-color: #faddea;}
#gallery div.viewer .captionViewer { float: left; width: 500px; }

#caption { position: relative; width: 500px; height: 340px; margin-top: 5px;}
#caption img { position: absolute; top: 0; border: 1px solid #fff;}
#legende { position: relative; width: 500px; height: 30px; background-color: #faddea;}


#previous { 
	float: left; width: 40px; height: 140px; text-align:center;;
	background: url(../images/gallery-prev.png) top left no-repeat #faffea; background-position: 0 0;
	cursor: pointer;
	}
#previous:hover { background-position: -30px 0; background-color: #faddea;}
#next { float: left; width: 40px; height: 140px; text-align:center;
	background: url(../images/gallery-next.png) top left no-repeat #faddea; background-position: -30px 0px;
	cursor: pointer;

	}
#next:hover { background-position: 0 0; }

#gallery .toolbar { position: relative; width: 500px; padding: 0 40px; background-color: #faddea; }

#browser {
	clear: both;
	position: relative;
	overflow: hidden;
	width: 500px;
	height: 100%;
	background-color: #faddea; color: #000;
}

#browser div.inner { width: 1500px; }

div#browser p { float: left; width: 125px; height: 125px; text-align: center; background-color: #faddea; color: #000;}
div#browser p img { border: 1px solid #fff; opacity: 1; margin:0 15px;}

#pages { position: relative; width: 500px; height: 20px; background-color: #faddea; color: #000; text-align: center;}
#pages a { margin: 0 10px; background-color: #faddea; color: #000; }

#gallery .galleryIndexContainer { position: relative; width: 500px; text-align: right; margin: 10px 0; }
#galleryIndex { background-color: #faddea; color: #000; border: 0; width: 35px; text-align: right;}
*/

p.galleryViewer img {
	border: 1px solid #ddd;
	padding: 4px; margin: 10px;
	background-color: #eee;
}

div#content.accueil { margin: 20px 0; }
div#content.accueil h1 { margin-left: 10px; }