/***********************************
      Feuille CSS
              de Thiers-Optique.com
      -------------------
      Toute modification, réutilisation
      totale ou partielle est strictement
      interdite
****/
body {
     font-family:"Trebuchet MS", verdana, sans-serif;
     text-align:center;
     background:#f0f0f0 url('../images/fond.png') repeat-x;
     padding:0px;
     margin:0px;
}

a {
	color:#0033FF;
}

a:hover {
	color:#FF0000;
}

p, ul {
	font-size:0.75em;
	color:#2e374c;
}

ul ul { font-size:1em; }

/** Stylisation de la page **/
#page {
      background:transparent url('../images/bordurepage.png') repeat-y center;
      width:700px;
      margin:auto;
      text-align:left;
}

/** Stylisation du header de la page **/
#header span, #header h1, #header p, h2 span, a span {
        display:none;
}

#header #logo {
        background:transparent url('../images/header.png') no-repeat;
        height:124px;
}

/** Partie navigation **/
#nav {
	background:transparent url('../images/fondmenu.png') no-repeat;
	height:136px;
}

#nav ul {
	margin:0px;
	padding:0px;
}

#nav li {
	margin:0px;
	padding:0px;
	display:inline;
}

#nav a {
	display:block;
	height:30px;
	float:left;
	margin-right:13px;
}

/** Liens de la navigation **/
#nav .accueil { background:transparent url('../images/menu/accueil.png'); width:74px; margin-left:31px !important; margin-left:13px; }
#nav .accueil:hover { background:transparent url('../images/menu/accueil.hover.png'); }

#nav .presentation { background:transparent url('../images/menu/presentation.png'); width:89px; }
#nav .presentation:hover { background:transparent url('../images/menu/presentation.hover.png'); }

#nav .informations { background:transparent url('../images/menu/informations.png'); width:89px; }
#nav .informations:hover { background:transparent url('../images/menu/informations.hover.png'); }

#nav .nouvelles { background:transparent url('../images/menu/nouvelles.png'); width:122px; }
#nav .nouvelles:hover { background:transparent url('../images/menu/nouvelles.hover.png'); }

#nav .partenaires { background:transparent url('../images/menu/partenaires.png'); width:89px; }
#nav .partenaires:hover { background:transparent url('../images/menu/partenaires.hover.png'); }

#nav .contact { background:transparent url('../images/menu/contact.png'); width:89px; }
#nav .contact:hover { background:transparent url('../images/menu/contact.hover.png'); }

/* Bas de la page */
#footer {
	clear:both;
}
#footer .fond {
	height:40px;
	background:transparent url('../images/bottom.png') no-repeat bottom;
}
#footer p {
	margin-left:51px !important;
	margin-left:0px;
	padding-left:0px !important;
	padding-left:51px;
	width:660px;
	margin-bottom:0px;
}

/** Partenaires **/
#partenaires h2 {
	margin:0px;
	padding:0px;
	height:24px;
	width:660px;
	background:transparent url('../images/titres/partenaires.png') no-repeat right top;
}
#partenaires {
	clear:both;
}
#partenaires ul {
	margin:0px;
	padding:0px;
	background:#efefef;
	width:640px;
	margin-left:20px;
	padding-left:20px;
}

#partenaires li {
	display:inline;
}

#partenaires img {
	border:0px;
}
/*********************************
Stylisation des différentes pages
**********************************/

/** Page d'accueil **/
	/** Bienvenue **/
	#bienvenue {
		margin-left:51px;
		background:transparent url('../images/photographie-verre.png') no-repeat 370px;
	}

	#bienvenue h2 {
		margin:0px;
		padding:0px;
		height:31px;
		background:transparent url('../images/titres/bienvenue.png') no-repeat;
	}

	#bienvenue p {
		width:355px;
	}

	#bienvenue img {
		float:right;
	}

	#bienvenue .decouvrir {
		background:transparent url('../images/liens/decouvrir.png') no-repeat;
		height:18px;
		width:138px;
		display:block;
		margin-top:8px;
	}

	#bienvenue .decouvrir:hover { background:transparent url('../images/liens/decouvrir.hover.png') no-repeat; }

	/** Magasin **/
	#magasin {
		background:transparent url('../images/magasin.png') no-repeat;
		padding-left:360px;
		padding-top:4px;
		margin-left:25px;
		height:379px;
	}
	
	#magasin p {
		width:282px;
		margin:0px 0px 10px 0px;
	}
	
	/** Informations **/
	#informations h2 {
		background:transparent url('../images/titres/informations.png') no-repeat;
		width:282px;
		height:25px;
		right:0;
	}
	
	#informations a {
		display:block;
		width:180px;
		height:18px;
		background:transparent url('../images/liens/informations.png') no-repeat;
		
	}
	
	#informations a:hover { 
		background:transparent url('../images/liens/informations.hover.png') no-repeat;
	}	
	
	/** Sponsor **/
	#sponsor h2 {
		background:transparent url('../images/titres/sponsor.png') no-repeat;
		width:282px;
		height:28px;
	}
	
	#sponsor a {
		display:block;
		width:180px;
		height:18px;
		background:transparent url('../images/liens/sponsor.png') no-repeat;
	}
	
	#sponsor a:hover { 
		background:transparent url('../images/liens/sponsor.hover.png') no-repeat;
	}		

/** Page d'erreur **/
	#erreur {
		width:355px;
		margin:auto !important;
		margin-left:20%;
	}
	#erreur span {
		display:none;
	}
	#erreur h1 {
		width:358px;
		height:31px;
		background:transparent url('../images/titres/erreur404.png') no-repeat;
		margin:0px;
		padding:0px;
	}
	#erreur p {
		width:355px;
	}
/** Logo de RayBan
/** Page de contact **/
	#contact {
		width:620px;
		height:140px;
		margin:auto !important;
		margin-left:51px;
		background:transparent url('../images/lettre.png') no-repeat right 10px;
	}
	
	#contact p {
		width:357px;
	}
	
	#contact h2 {
		margin:0px;
		padding:0px;
		height:30px;
		width:357px;
		background:transparent url('../images/titres/contact.png') no-repeat;
	}
	
	#parmail {
		width:620px;
		margin:auto !important;
		margin-left:51px;
	}
	
	#parmail form {
		border:0px;
		padding:0px;
		margin:0px;
	}

	#parmail h2 {
		height:30px;
		width:357px;
		padding:0px;
		margin:0px;
		background:transparent url('../images/titres/email.png') no-repeat;
	}
	
	#parmail fieldset {
		margin-top:5px;
		border:none;
		border-top:1px solid #DDD;
		padding-left:20px;
		padding-right:20px;
		font-size:0.75em;
		color:#2e374c;
	}
	
	#parmail legend {
		color:#333333;
		padding-left:10px;
		padding-right:10px;
		font-size:1.1em;
		font-weight:bold;
	}
	#parmail label, #parmail label input, #parmail label span {
		display:block;
	}
	
	#parmail label {
		clear:both;
		padding-top:3px;
	}
		
	#parmail label input, #parmail label span {
		float:left;
		width:45%;
	}
	
	#parmail label input, #parmail textarea {
		font-family:verdana, arial, sans-serif;
		font-size:0.9em;
		border:1px solid #eee;
		padding:2px;
		color:#999;
		background:#fefefe url('../images/formulaire/input.png') repeat-x;
	}
	
	#parmail label input:hover, #parmail textarea:hover  {
		border:1px solid #8fb9ee;
		color:#333333;
		background:#fefefe url('../images/formulaire/input.hover.png') repeat-x;	
	}
	
	#parmail textarea {
		width:98% !important;
		width:550px;
	}
	
	html > body #envoyer {
		height:18px;
		width:66px;
		border:0px;
		font-size:0em;
		background:transparent url('../images/formulaire/envoyer.png') no-repeat;
	}
	
	html > body #envoyer:hover {
		background:transparent url('../images/formulaire/envoyer.hover.png') no-repeat;
	}
	
	#parmail .erreur {
		background:#ffe6e6;
		font-size:0.70em;
		font-family:verdana,arial,sans-serif;
		font-weight:bold;
		color:#FF0000;
		border:1px solid #FF0000;
		padding:2px;
	}
	
	#poste {
		padding-left:320px;
		background:transparent url('../images/box.png') no-repeat left center;
		margin-right:51px;
		margin-bottom:10px;
		margin-left:41px;
	}
	
	#poste h2 {
		background:transparent url('../images/titres/courrier.png') no-repeat right;
		height:40px;
		margin:0px;
		padding:0px;
	}
	#poste strong { display:block; }
	#poste p {
		margin:0px;
		padding:0px;
		width:288px;
	}
/** Présentation **/
	#presentation {
		width:660px;
		margin:0px 0px 0px 31px;
		background:transparent url('../images/mag.png') no-repeat 400px 35px;
	}
	
	#presentation h2 {
		background:transparent url('../images/titres/presentation.png') no-repeat;
		height:30px;
		margin:0px 0px 0px 20px;
	}
	
	#presentation h3 {
		margin-left:20px;
		color:#576c93;
		font-size:0.9em;
	}
	
	#presentation p, #presentation ul {
		width:360px;
		margin-left:30px;
	}
	
/** Informations **/	
	#information {
		width:660px;
		margin:0px 0px 0px 31px;
		background:transparent url('../images/clock.png') no-repeat 370px 35px;
	}
	
	#information h2 {
		background:transparent url('../images/titres/information.png') no-repeat;
		height:30px;
		margin:0px 0px 0px 20px;
	}
	
	#information .time {
		width:350px;
	}
	
	#information strong { display:block; } 
	
	#information h3 {
		margin-left:20px;
		color:#576c93;
		font-size:0.9em;
	}

	#information p {
		margin-left:30px;
	}

/** Sponso */
	#sponso {
		width:660px;
		margin:0px 0px 0px 31px;		
	}

	#sponso h2 {
		background:transparent url('../images/titres/sponsors.png') no-repeat;
		height:30px;
		margin:0px 0px 0px 20px;
	}

	#sponso p {
		width:580px;
		margin:10px 0px 0px 30px;
	}

	#sponso p img {
		float:left;
	}

/** collections **/
	#collections {
		width:624px;
		margin:0px 0px 0px 31px;
			
	}

	#collections h2 {
		background:transparent url('../images/titres/collections.png') no-repeat;
		height:30px;
		margin:0px 0px 0px 20px;
	}

	#collections p, #collections div {
		margin:10px 0px 0px 30px;
	}

	#collections h3 {
		margin-left:20px;
		color:#576c93;
		font-size:0.9em;
	}

/** Partenaires **/
	#partenaire {
		width:660px;
		margin:0px 0px 0px 31px;
	}
	
	#partenaire p {
		margin:0px 0px 0px 0px;
		padding:0px;
	}
	
	#partenaire h2 {
		background:transparent url('../images/titres/partenaire.png') no-repeat;
		height:30px;
		margin:0px 0px 0px 20px;
	}
	
	#partenaire h3 {
		margin:0px;
		color:#aaa;
		font-size:0.9em;
	}
	
	#partenaire #in {
		padding-left:40px;
		width:580px;
	}
	
	#partenaire .box {
		width:119px;
		float:left;
		border-top:1px solid #aaa;
		background:#f9f9f9 url('../images/fondpartenaire.png') no-repeat bottom right;
		padding:2px;
		margin:5px;
	}
	
	#partenaire .box p {
		display:inline;
	}
	
	#partenaire h3 {
		font-size:0.8em;		
	}
	
	#partenaire img {
		margin:auto;
	}
	
	#partenaire .box a {
		height:20px;
		width:60px;
		background:transparent url('../images/web.png') no-repeat center;
		margin-top:0px;
		margin-left:2px;
		display:block;
	}
	
	#partenaire .box a:hover {
		background:transparent url('../images/web.hover.png') no-repeat center;
	}