/* ----------------- feuille de styles CSS ---------------------*/

/* Ce fichier définit les styles visuels des différents éléments des pages.
 * Dans l'ordre :
 * - balises html generales
 * - principaux blocs 
 		- conteneur (980px centrer)
			- header
			- menu (178px flottant gauche)
			- contenu (760px)
			- pied
				- pied2
				- menu-bas
				- coodonnees
 		- 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
============================================================ */

html {font-size: 100%;} 
body {
	height: 100%;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	background-image: url(../images/fond-body.jpg);
	background-repeat: repeat-y;
	background-position: center;
}
p {margin: 19px 0; text-align:center}
li {margin-left: 30px;}
a, a:link, a:visited {color: #060; text-decoration: none;}
a:hover, a:active {color: #FFF; background-color: #060;}
.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 */

/* ==========================================================
principaux blocs
============================================================ */

#conteneur {width: 980px;margin: 0 auto;border: 2px solid #090;background-color: #FFF;}
	
#header {background-image: url(../images/nav/banniere-mobiland.jpg);width: 980px;position: relative;height: 124px;}
#logo-mobiland {position: absolute;height: 110px;width: 150px;left: 1px;top: 14px;text-align: center;}

#menu {width: 178px;height: 500px;float: left;background: url(../images/menu.jpg) no-repeat top;}
#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: #FCF200;color:#060;}
#menu a:hover, #menu a:active {background-color: #060; color:#FCF200;}

#contenu {width: 760px; margin: 0 20px 10px 200px; }
#contenu h1 {text-align: right; color: #060; font-size: 1.3em; border-bottom: 1px solid #060; margin: 0 0 10px 0; padding: 0 20px 0 0;}
#contenu h2 {text-align: center;}
#contenu ul {margin: 0 0 15px 0; list-style-type: disc;}

#pied {}
#pied2 {background: url(../images/nav/footer.gif) no-repeat bottom right;text-align: right;height: 25px;border-bottom: 1px solid #060;line-height: 25px;}
#pied2 a:link, #pied2 a:visited {font-size: 9px; color:#fff;}
#pied2 a:hover, #pied2 a:active {font-size: 9px; color:#000;}
#menu-bas {padding: 10px 0;text-align: center;font-weight: bold;}
#coordonnees {background-color: #060;font-size: 14px;font-weight: bold;color: #FFF;text-align: center;padding:10px 0;}
#coordonnees a:link, #coordonnees a:visited {color:#fff;}

#msai {text-align: right;margin-top: 10px;margin-right: 10px;font-size: 10px;}
#msai a:link, #msai a:visited {text-decoration: none;color: #999;}
#msai a:hover, #msai a:active {color: #000;}

/* ==========================================================
bloc contenu details
============================================================ */

#contenu .annonces {
	font-size: 10px;
	font-weight: bold;
	color: #FFF;
	margin: 10px;
	padding: 0px;
	border: 0px solid #F3F600;
	background-color: #FFF;
	text-align: center;
	width: 400px;
}
#contenu .gps {width: 400px;font-size: 16px;font-weight: bold;color: #060;margin: 10px auto;padding: 10px;text-align: center;background-color: #F3F600;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;}
#terrasses {width: 600px;font-size: 12px;font-weight: bold;color: #333;margin: 10px auto;padding: 10px;text-align: left;border: 2px solid #c00;}

/*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;}
#contenu .occasion .infos {}
#contenu .occasion .infos ul {padding: 25px 0 0 0;}
#contenu .occasion .infos ul li {list-style-type: none; font-size: 1.1em; margin:0 40px}
.vendre {position: absolute;top: 10px;right: 10px;}
.textred {color:#F00;font-size: 1.1em;font-weight: bold;}

/* Photos occasion */
.gallery {width: 100%;text-align: center;margin-left: auto;margin-right: auto;padding: none;}
.gallery ul.images{list-style-type: none;border: none;padding: none;}
.gallery ul.images li.image
{
	display: inline;
	line-height: 0;
	text-decoration: none;
	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*/
}