/* ----------------- feuille de styles CSS ---------------------*/

/* Ce fichier définit les styles visuels des différents elements des pages.
 * Dans l'ordre :
 * - balises html generales
 * - principaux blocs 
 		- conteneur (980px centrer)
			- header
			- menu (178px flottant gauche)
			- contenu (760px)
			- pied
				- pied2
				- menu-bas
		- footer
 		- msai
 * - textes
 
 * - le contenu des blocs
*/

/* ================================
 * !Reset styles
 * Based on Eric Meyer's reset reloaded ( http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded )
 * ================================*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b, u, i, center,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td { background:transparent; border:0; font-size:100%; margin:0; padding:0; vertical-align:baseline; }

ol, ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after, q:before, q:after {content:''; content:none; }

/* remember to highlight inserts somehow! */
ins { text-decoration:none; }
del { text-decoration:line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table {	border-collapse:collapse; border-spacing:0; }

/* ==========================================================
balises html generales
============================================================ */

body {height: 100%;	color: #222;font-family: Verdana, Geneva, sans-serif;font-size: 0.9em;position: relative;background: url(../images/nav/fond-body.png) repeat center top;}
p {margin: 19px 0; text-align:center}
li {margin-left: 30px;}
a, a:link, a:visited {color: #036; text-decoration: none;}
a:hover, a:active {color: #FFF; background-color: #c00;}
.img-right {float: right; margin-left: 20px;}
.img-left {float: left; margin-right: 20px;}
.left{text-align: left;} /* classe passe partout pour mettre à gauche */
.centrer {text-align: center;} /* classe passe partout pour centrer */
.right {text-align: right;} /* classe passe partout pour mettre à droite */
.cache {display: none;} /* classe passe partout pour précharger des images */
.grasbleu {font-weight: bold;color: #036;}

/* ==========================================================
principaux blocs
============================================================ */

#conteneur {width: 980px;margin: 10px auto 0 auto;border: 2px solid #c00;background-color: white;}
	
#header {background-image: url(../images/nav/fond-banniere.jpg);width: 980px;position: relative;height: 124px;}
#logo-vmh {position: absolute;height: 94px;width: 145px;left: 5px;top: 3px;}

#menu {width: 178px;height: 500px;	float: left;background: url(../images/nav/fond-menu.jpg) no-repeat top left;font-family: Arial, Helvetica, sans-serif;}
#menu ul li {margin: 0 0 12px 10px;}
#menu a {display: block;padding: 5px 0; font-weight: bolder;text-align: center; border: 2px solid #c00;}
#menu a:link, #menu a:visited {background-color: #036;color:white;}
#menu a:hover, #menu a:active {background-color: white; color:#036;}

#contenu {width: 760px; margin: 0 20px 10px 200px; }
#contenu h1 {font-family: Arial, Helvetica, sans-serif;text-align: left; color: #036; font-size: 1.3em; border-bottom: 1px solid #036; margin: 0 0 10px 0; padding: 4px 0 4px 20px; /*background:url(../images/nav/fond-h1.png) no-repeat left;*/}
#contenu h2 {text-align: left;}
#contenu ul {margin: 0 0 15px 0;}
#contenu ul li {list-style-type: disc;}

#pied {font-family: Arial, Helvetica, sans-serif;}
#pied2 {background: url(../images/nav/footer.gif) no-repeat bottom right;text-align: right;height: 25px;border-bottom: 1px solid #036;line-height: 25px;}
#pied2 a:link, #pied2 a:visited, #pied2 a:hover, #pied2 a:active {font-size: 0.6em; color:#fff;}
#pied #menu-bas {padding:10px 0; text-align: center;font-weight: bold;}

#msai {text-align: right;margin-top: 10px;margin-right: 10px;font-size: 10px; color: #999;}
#msai a:link, #msai a:visited {text-decoration: none;color: #999;}
#msai a:hover, #msai a:active {color: #000;}

#footer {padding:10px 0;font-family: Arial, Helvetica, sans-serif; font-size: 14px;font-weight: bold;color: white;text-align: center;background:#036;}
#footer a:link, #footer a:visited {color:#fff;}

/* ==========================================================
bloc contenu details
============================================================ */

#contenu .annonces {font-size: 16px;font-weight: bold;color: #F3F600;margin: 10px;padding: 10px;border: 2px solid #F3F600;background-color: #060;text-align: center;width: 400px;}
#contenu .gps {
	width: 400px;
	font-size: 16px;
	font-weight: bold;
	color: #FFF;
	margin: 10px auto;
	padding: 10px;
	text-align: center;
	background-color: #036;
	border: 2px solid #c00;
}
#contenu #motto {font-weight: bold;color: #c00;text-align: center;font-style: italic;margin-bottom: 10px;font-size: 1.3em;}
#contenu .legislation {list-style-image: url(../images/puce01.jpg);}
#contenu .legislation li {margin: 0 0 15px 30px;}
#contenu .terrasses {
	text-align:left;
	vertical-align: text-bottom;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 10px;
	margin-left: 0;
	height: 150px;
}

/*pages occasion */
#contenu .occasion {background-color: #eee;margin-bottom: 20px;	padding: 0 10px;position: relative;	border: 2px solid #900;}
#contenu .occasion p {text-align: left; margin:10px 0 0 0;}
.infos {margin:10px 0 0 0;}
.vendre {position: absolute;top: 10px;right: 10px;}
.textred {color:#F00;font-size: 1.1em;font-weight: bold;}

#nav-occasion {text-align:center;}
#nav-occasion img {vertical-align: middle;}
#nav-occasion a:link, #nav-occasion a:visited {font-size:9px; color:#999;}

/* Photos occasion */
.gallery {width: 100%;text-align: center;margin: 0 auto;padding: none;}
.gallery ul.images {list-style-type: none;border: none;padding: none;}
.gallery ul.images li.image
{
	list-style: none;
	line-height: 0;
	text-decoration: none;
	width: 150px;
	color: inherit;
	cursor: pointer;
	margin: 10px 20px; /*modifie*/
	display: inline-block;
	padding: 3px;
	line-height: 0;
	-webkit-border-radius: 4px 4px;
	-moz-border-radius: 4px 4px;
	border-radius: 4px 4px;
	-moz-box-shadow: 0px 0px 8px #AAA;
	-webkit-box-shadow: 0px 0px 8px #AAA;
	box-shadow: 0px 0px 8px #AAA;
	-webkit-transition: -webkit-box-shadow 0.1s ease-out;
	-moz-transition: -webkit-box-shadow 0.1s ease-out;
	-o-transition: -webkit-box-shadow 0.1s ease-out;
	transition: -webkit-box-shadow 0.1s ease-out;
	background-color: #C30; /*modifie*/
}

