/* ------------------------------------| GLOBALES |----------------------------------------- */

* {
	margin: 0;
	padding: 0;
}

ul, li {
	margin: 0;
	padding: 0;
}

body {
	font: 80% Arial, Helvetica, Sans-Serif;
	color: #333;
	background-color: rgb(236,236,236);
}
	
img { 
	border: none;
}

hr {
	display: none;
}

strong, b, .bold {
	font-weight: bold;
}

.cache {
	position: absolute;
	left: -5000px;
	display: none;
}

#fond-g, #fond-d {
	position: absolute;
	width: 50px;
	height: 300px;
}

#fond-g {
	left: 0;
	background: url(../images/fond_g.jpg) top no-repeat; 
}

#fond-d {
	right: 0;
	background: url(../images/fond_d.jpg) top no-repeat; 
}
	
#global {
	margin-left: 50px;
	margin-right: 50px;
}

/* ------------------------------------| ENTETE |------------------------------------ */

#entete {
	margin: 0;
	height: 65px;
	background: url(../images/fond_entete.jpg) repeat-x; 
}

#logo { 
	float: left;
	width: 300px;
	height: 65px;
}

#logoAM {
	position: absolute;
	left: 50px;
	top: 0;
	width: 300px;
	height: 65px;
}

#reseau {
	position: absolute;
	left: 350px;
	width: 450px; /* Opera 7 et IE 5 PC*/
	top: 40px;
	color: #666;
	background-color: transparent;
	font: 0.95em Arial, Helvetica, sans-serif;
}

#evitement {
	position: absolute;
	height: 20px;
	right: 50px;
	top: 0;
	color: #666;
	background-color: transparent;
	text-align: right;
	z-index: 10;
}

#evitement li {
	list-style: none;
	display: inline;
}

#evitement li a {
	text-decoration: none;
	color: #666;
	padding: 0 0.3em 0 0.1em ;	
	border-right: 1px solid #666;
}

#evitement a:hover, #evitement a:focus {	
	border-bottom: 2px solid #666;
}

#evitement li a.sans {
	padding-right: 5px;	
	border-right: none;
}

#bleu {
	margin: 0;
	height: 146px;
	background: url(../images/bg-bleu.jpg) 650px 0 no-repeat; 
}

/* ------------------------------------| MENU GENERAL |------------------------------------ */

#menu {
	position: absolute;
	top: 200px;
	padding-left: 10px;
	width: 100%; 
	height: 2em;
	z-index: 10;
}

ul#menutop, ul#menutop li {
	height: 1.6em;
}

ul#menutop {
	font: 1.1em/1.6em Arial, Helvetica, sans-serif;
}

ul#menutop li {
	float: left;
	line-height: 1.6em;
	text-align: center;
	list-style: none;	
	border-right: 1px solid rgb(225,225,225);
	background-color: rgb(174,174,174);
}

ul#menutop li a {
	float: left; 
	padding: 0 0.5em;
	text-decoration: none;
	color: white;
	font-weight: bold;
}

ul#menutop li a:hover, ul#menutop li a:focus {
	background-color: rgb(30,50,150);
}

/* ------------------------------------| PAGE PRINCIPALE |------------------------------------------------- */

#page {
	margin: 0;
	padding-top: 30px;
	background-color: white;
	width: 100%;
}

#contenu {
	width: 65%;
	float: left;
	margin: 2em 0 2em 10px;
}

#contenu.index {
	background:url(../images/ordi.jpg) top right no-repeat;
}

#contenu.pourquoi {
	background:url(../images/panneau.jpg) top right no-repeat;
}

#contenu.tests {
	background:url(../images/lunettes.jpg) top right no-repeat;
}

#contenu.propositions {
	background:url(../images/main-ecran.jpg) top right no-repeat;
}

#contenu.references {
	background:url(../images/ref.jpg) top right no-repeat;
}

#contenu.contacts {
	background:url(../images/tel.jpg) top right no-repeat;
}

#contenu.plan {
	background:url(../images/plan.jpg) top right no-repeat;
}

#contenu h1 {
	font: 2.2em Verdana, Arial, Helvetica, sans-serif;
	color: #666;
	margin-bottom: 1em;
}

#contenu h2 {
	font: 1.4em/2em Georgia, 'Times New Roman', Times, serif;
	color: rgb(229,82,0);
	margin: 1em 0 -0.2em 0;
}

#contenu a.ISI_IGNORE img {
	padding-top: 0.3em;
	float: left;
}

#contenu div.liste ul {
	margin: 0;
	margin-left: 25px;
}

#contenu div.liste li {
	margin-left: 1em;
}

#contenu h2 span.exemple {
	font: 0.65em/2em Georgia, 'Times New Roman', Times, serif;
}

#contenu p {
	font: 0.9em/1.5em Verdana, Arial, Helvetica, sans-serif;
	color: #666;
	margin-left: 25px;
}

#contenu li {
	font: 0.9em/1.5em Verdana, Arial, Helvetica, sans-serif;
	color: #666;
	margin-left: 40px;
}

#contenu p a {
	color: #666;
}

#contenu p a:hover {
	color: black;
}

#contenu p img {
	margin: 8px 0;
	vertical-align: middle;
}

span.rouge {
	color: rgb(229,82,0);
}

p.suite {
	margin-top: 50px;
	border-top: 1px dashed #999;
}

p.suite a {
	padding: 5px 8px 5px 25px;	
	line-height: 3em;
	color: #666;
	border: 1px solid #eee;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	background: #eee url(../images/favicon.gif) 3px 3px no-repeat;
	text-decoration: none;
}

p.suite a:hover, p.suite a:focus {	
	color: black;
	text-decoration: underline;
}

#retrait {
	float: right;
	margin-right: 1px;
	width: 190px;
	height: 90px;
}

kbd {
	font-size : 1.1em;
	color: #333;
	padding: 1px 2px;
	border: 1px solid #eee;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	background: #eee;
}

/* ------------------------------------| COLONNE |------------------------------------------------- */

#coldroite {
	margin-left: 70%;
	margin-bottom: 10px;
	background-color: rgb(250,250,250);
	color: #666;
	padding-top: 5px;
}

#coldroite h3 {
	margin: 1em 0;
	background-color: rgb(30,50,150);
	color:#fff;
	height: 1.8em;
	line-height: 1.8em;
	font-size: 1em;
	text-indent : 0.5em;
}

#coldroite img {
	margin: 3px 0;
}

#coldroite a:focus.focimg {	
	border-bottom: 2px solid blue;
}

#coldroite h3 span.date {
	font-size: 0.8em;
}

#coldroite h4 {
	font-size: 1em;
	color: #333;
	margin: 0.5em;
}

img.sonimg {
	float: left;
	padding-top: 1em;
}

p.sonimg {
	margin: 0.7em 0 0 25px;
}

div.news {
	font-size: 0.9em;
	line-height: 1.2em;
	margin-left: 1em;
}

div.news a {
	color: #666;
}

div.news a:hover {
	color: black;
}

.note {
	font: 0.85em/1.1em Arial, Helvetica, sans-serif;
	margin: 0.8em;
	padding: 0.6em;
	text-align: center;	
	border: 1px dashed black;
	background-color: white;
	color: black;
}

span.bleu {
	color: rgb(30,50,150);
	margin-top: 5px;
}

p.fil a {
	color: #999;
	font-weight: bold;
}

p.fil a:hover, p.fil a:focus {
	color: black;
}

/* ------------------------------------| BAS DE PAGE |------------------------------------------------- */

#bas-de-page {
	clear : both;
	text-align: center;	
	background-color: rgb(236,236,236);
	font: 0.9em/1.2em Arial, Helvetica, sans-serif;
	color: #333;
	padding-top: 5px;
	margin-bottom: 20px;
}

#bas-de-page li {
	list-style: none;
	display: inline;
}

#bas-de-page li a {
	color: #333;
	text-decoration: none;
	padding: 0 0.5em;	
	border-right: 1px solid #333;
}

#bas-de-page li a:hover, #bas-de-page li a:focus {	
	color: black;
	text-decoration: underline;
}

#bas-de-page li a.sans {
	border-right: none;
}
#bas-de-page p {
	margin-top: 20px;
}
#bas-de-page p a {
	color: #333;
}

/* ------------------------------------| MENUS TESTS |------------------------------------ */

.menutest {
	text-align: left;
	margin-left: 20px;
}

.menutest a {
	padding: 5px 8px;
	margin: -1px;
	font: 1.1em/2.5em Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-decoration: none;
	color: white;
}

.menutest a.norm {
	background-color: #009933;
	color: #ff0000;
}

.menutest a.dalt {
	background-color: #948500;
	color: #9a8620;
}

.menutest a:hover.norm, .menutest a:focus.norm {
	background-color: #ff0000;
	color: #009933;
}

.menutest a:hover.dalt, .menutest a:focus.dalt {
	background-color: #907723;
	color: #948500;
}

/* ------------------------------------| PAGE-ECRANS |------------------------------------------------- */

#ecran {
	position: absolute;
	left: 50px;
	right: 50px;
	top: 0;
	bottom: 0;
	height: 100%;
	background-color: white;
	text-align: center;
}

#ecran p {
	margin: 20px;
	text-align: center;	
	border-top: 1px dashed #333;
	line-height: 1.5em;
}

#ecran p.nofil {	
	border-top: none;
}

#ecran a {
	padding: 5px 8px;
	text-align: center;	
	line-height: 1.5em;
	color: #666;
	border: 1px solid #eee;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	background-color: #eee;
	text-decoration: none;
}

#ecran a:hover, #ecran a:focus {	
	color: black;
	text-decoration: underline;
}