/* ======================================================================== */
/*
/* Feuille de style du site VIA-FINANCE © 2005, Julien RICHETTI
/*
/* ======================================================================== */

BODY {
	margin: 0;
	padding: 0;
	background: url(../img/alu.jpg) white right top repeat-y;
	height: 21cm; /* illegal ? */
}

BODY, P, TD, TH, H1, H2, H3, H4, H5, H6
{
	font-family: "Verdana", "Arial", "Helvetica", sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: black;
}

ABBR, ACRONYM, EM { font-style: italic; text-decoration: none; border: none; }
ABBR, ACRONYM { 
	border-bottom-style: dotted; 
	border-bottom-width: 1px ; /* PB IEX */
}

.spacer {
	display: block;
	clear: both;
	float: none;
	width: 100%;
	padding: 0;
	margin: 0;
	height: 1px;
	line-height: 1px;
	background-color: transparent;
}

HR {
	height: 1px;
	padding: 0;
	margin-left: 0;
	margin-right: 0;
	margin-top: 1em;
	margin-bottom:1em;
	color: #CCC;
	border: none;
	border-top: 1px solid #CCC;
}

/* ======================================================================== */

H1, H2, H3, H4 {
	font-weight: bold;
	padding: 0;
	margin: 0; 
}

H1 {
	z-index: 2;
	position: absolute;
	top: 42px;
	left: 162px;
	width: 72%;
	height: 75px;
	line-height: 17px;
	color: #039;
	font-size: 15px;
	font-variant: small-caps;
	text-transform: capitalize;
	letter-spacing: 2px;
	padding-left: 30px;
	padding-top: 30px;
	padding-bottom: 0;
	padding-right: 0;
	background: url(../img/header.jpg) transparent top right no-repeat;
}

H2 {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	color: #039;
	font-size: 9px;
	z-index: 0;
	font-weight: normal;
}

H3 { color: #039; margin-bottom: 20px;	text-align: justify;}
H4 { color: #333; margin-bottom: 20px;}
P+H3, P+H4 {margin-top: 20px; }/* PB avec IEX */
P {
	padding: 0;
	margin: 0;
	padding-bottom: 0.5em;
	text-align: justify;
}

A:link    { text-decoration:none; color: #039; }
A:visited { text-decoration:none; color: #039; }
A:active  { text-decoration:none; color: #039; }
A:hover   { text-decoration:none; color: red; }
A:focus   { text-decoration:none; color: red; }

/* ======================================================================== */

#corpus {
	display: block;
	position: absolute;
	top: 117px;
	left: 162px;
	width: 72%;
	margin: 0;
	padding-top: 30px;
	padding-left: 30px;
	padding-right: 0px;
	padding-bottom: 60px;
	height: 21cm;
	background: url(../img/ombre.png) transparent left top repeat-y;
	z-index: 0;
}

#corpus UL {
	list-style-image: url(../img/puce.png);
	list-style-position: outside;
}

#corpus OL	{ list-style-type: decimal;}

#corpus LI	{ 
	padding-bottom: 0.5em;
	text-align: justify;
}

#corpus UL UL {
	list-style-image: none; 
	list-style-type: disc;
	/*width: 75%;*/
	padding-left: 2em;
	margin-left: 0;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

#sidebar {
	display: block;
	position: absolute;
	top: 94px;
	left: 0;
	width: 162px;
	padding: 0;
	margin: 0;
	background: url(../img/alu.jpg) #F0F0F0 center repeat;
	z-index: 1;
	border-bottom: 1px solid #CCC;
	height: 21.5cm;
}

.decor {
	display: block;
	width: 162px;
	height: 324px;
	background: url(../img/alu.jpg) transparent top right repeat-y;
	
	font-size: 8px; 
	color: silver;
	text-align: center;
}

#angelot	{ background-image: url(../decors/angelot.jpg);}
#arbre		{ background-image: url(../decors/arbre.jpg);}
#bastille	{ background-image: url(../decors/bastille.jpg);}
#candel		{ background-image: url(../decors/candel.jpg);}
#cheval		{ background-image: url(../decors/cheval.jpg);}
#contrat	{ background-image: url(../decors/contrat.jpg);}
#courbe		{ background-image: url(../decors/courbe.jpg);}
#eolienne	{ background-image: url(../decors/eolienne.jpg);}
#escalier	{ background-image: url(../decors/escalier.jpg);}
#escalier2	{ background-image: url(../decors/escalier2.jpg);}
#facade		{ background-image: url(../decors/facade.jpg);}
#mont		{ background-image: url(../decors/mont.jpg);}
#oeil		{ background-image: url(../decors/oeil.jpg);}
#paris		{ background-image: url(../decors/paris.jpg);}
#eiffel3	{ background-image: url(../decors/eiffel3.jpg);}
#eiffel4	{ background-image: url(../decors/eiffel4.jpg);}
#phare		{ background-image: url(../decors/phare.jpg);}
#phare2		{ background-image: url(../decors/phare2.jpg);}
#phare3		{ background-image: url(../decors/phare3.jpg);}
#pignon		{ background-image: url(../decors/pignon.jpg);}
#statue		{ background-image: url(../decors/statue.jpg);}
#colone		{ background-image: url(../decors/colone.jpg);}
#wallstreet	{ background-image: url(../decors/wallstreet.jpg);}
#totem		{ background-image: url(../decors/totem.jpg);}

.bas {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;
	padding-top: 20px;
	padding-bottom: 20px;
	text-align: center;
	font-size: 9px;
}

UL.menu { padding: 0; margin: 0; list-style: none;}
UL.menu LI { display: inline; padding: 0; margin: 0;}

.menu {
	display: block;
	width: 100%;
	padding: 0;
	margin: 0;
	font-size: 11px;
}

.menu A {
	display: block;
	text-align: right;
	margin: 0;
	padding: 5px;
	padding-left: 0px;
	padding-right: 15px;
}

.menu A:hover, .expanded {
	background-color: #039;
	border-left: 10px solid #CCC;
	color: white;
}

.menu A.expanded { 
	border-left-color: #039;
	color: white;
}

.menu A#selected {
	color: #039;
	background-color: #CCC;
}

.menu A#metiers {
	font-weight: bold;
	background-image: url(../img/puce.png);
	background-repeat: no-repeat;
	background-position: 150px 5px;
}

.menu A span { display: none; }

#menupop {
	display: none;
	z-index: 9;
	position: absolute;
	left: 162px;
	top: 45px; /* absolu : 162px;*/
	width: 20em;
	background: url(../img/alu.jpg) #F0F0F0 center repeat;
	border: 1px solid white;
	border-left: none;
	border-right: 1px solid gray;
	border-bottom: 1px solid gray;
}

#menupop .menu A {
	text-align: left;
	padding-left: 1em;
	border-left: 10px solid #039;
}

/* ======================================================================== */

.carre {
	display: block;
	background: none white right top repeat-y;
	border: 1px solid #EEE;
	padding-left: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-top: 20px;
	margin-top: 20px;
	margin-bottom: 20px;
}

/* ======================================================================== */

UL.dispatch {
	margin-bottom: 1em;
	margin-left: 0;
	padding: 0;
}

.dispatch LI {
	display: list-item;
	list-style-type: none;
	list-style-image: none;
	background: url(../img/fleche.png) transparent 10px 10px no-repeat;
	padding-left: 30px;
}

.dispatch LI A {
	display: block;
	margin: 0;
	padding-left: 10px;
	width: 100%;
	line-height: 3em;
}

.dispatch LI A:hover {
	background-color: #039;
	color: white;
}

/* ======================================================================== */

.equipe TABLE {
	border: none;
}

.equipe TD, .equipe TH {
	text-align: left;
	padding: 2px;
	border: none;
	vertical-align: top;
}

.equipe TH {
	font-weight: bold;
	background: url(../img/puce.png) transparent top left no-repeat;
	padding-left: 24px;
	color: #333;
}

.equipe TD {
	padding-bottom: 1em;
}

.encadre {
	display: inline;
	position: relative;
	float: right;
	margin-top: 1em;
	margin-left: 20px;
	margin-bottom: 20px;
	margin-right: 0px;
	padding: 8px;
	border: 1px solid #999;
	background-color: white;
	width: 160px;
	font-size: 10px;
}

/* ======================================================================== */

.menubas {
	display: block;
	clear: both;
	width: 100%;
	height: 2em;
	background: url(../img/voir.png) transparent top left no-repeat;
	border-top: 1px solid #CCC;
	margin: 0;
	margin-top: 30px;
	margin-bottom: 30px;
	padding: 0;
	text-align: left;
	font-size: 10px;
}

.menubas LI {
	display: inline;
	float: right;
	background: url(../img/fleche.png) transparent top right no-repeat;
	list-style: none;
	margin: 0;
	margin-top: 4px;
	padding: 0;
	padding-right: 14px;
	font-size: 10px;
	text-align: right;
}

/* ======================================================================== */

IMG {
	border: none;
	border-color: #CCC;
	margin: 0;
	padding: 0;
}

/* ======================================================================== */
#corpus FORM {
	margin: 0;
	padding: 0;
}

INPUT.edit, TEXTAREA {
	margin: 0;
	padding: 1px;
	width: 300px;
	border: 1px solid silver;
}

#corpus LABEL {
	display: inline;
	float: left;
	width: 10em;
	text-align: right;
	padding: 0 0.5em 0 0;
	margin: 0;
	line-height: 1.5em;
}

#corpus FORM P {
	padding: 0;
	margin: 0 0 0.5em 0;
}

#corpus ADDRESS {
	display: inline;
	position: relative;
	float: left;
	width: 16em;
	padding: 0;
	margin: 0;
	margin-left: 20px;
	font-style: normal;
	border-right: 1px dotted #CCC;
}

#corpus ADDRESS:first-line { font-style: italic; }

@media print {
	H1 					{ border-top: thin solid #CCC; border-left: thin solid #CCC;}
	#sidebar			{ border-right: thin solid #CCC; }
	.menu				{ border-top: thin solid #CCC; }
	.menu A#metiers		{ font-weight: normal;}
	.menu A#selected	{ font-weight: bold;}
	.carre				{ border: none;}
	.bas				{ border: none; position: absolute; left: 0; bottom: 0;}
	.menubas			{ display: none;}
}