/* everything is constructed with a single background image */
/*
  active color 		: #807373
  hover color  		: #FFFCFC
  inactive color 	: #463F3F
*/
/* root element for tabs */
#flowtabs {

/* dimensions */
	width: 700px;
	height: 31px !important;
	margin: 0 !important;
	padding: 0; /* IE6 specific branch (prefixed with "_") */
	_margin-bottom: -2px;
}

/* single tab */
#flowtabs li {
	float: left;
	margin: 0;
	padding: 0;
	text-indent: 0;
	list-style-type: none;
}

/* a- tag inside single tab */
#flowtabs li a {
	background: url(Brown_panes.png) no-repeat;
	display: block;
	height: 31px;
	width: 140px;
	padding: 0;
	margin: 0; /* font decoration */
	line-height: 33px;
	text-align: center;
	text-decoration: none;
	letter-spacing: 0.01em;
	word-spacing: 0.02em;
	font-family: Copperplate Gothic Light , Copperplate, Arial, Verdana, Helvetica, Times, sans-serif;
	font-size:10px;
	color: #463F3F;
}

/* adjust the background image position on each tab */
#flowtabs #t1 {
	background-position: 0 0;
}

#flowtabs #t2 {
	background-position: -140px 0;
}

#flowtabs #t3 {
	background-position: -280px 0;
}

#flowtabs #t4 {
	background-position: -420px 0;
}

#flowtabs #t5 {
	background-position: -560px 0;
}

/* mouseover state */
#flowtabs a:hover {
	font-family: Copperplate Gothic Light , Copperplate, Arial, Verdana, Helvetica, Times, sans-serif;
	font-size:12px;
	color: #FFFCFC;
}

#flowtabs #t1:hover {
	background-position: 0 -33px;
}

#flowtabs #t2:hover {
	background-position: -140px -33px;
}

#flowtabs #t3:hover {
	background-position: -280px -33px;
}

#flowtabs #t4:hover {
	background-position: -420px -33px;
}

#flowtabs #t5:hover {
	background-position: -560px -33px;
}

/* currently selected tabs */
#flowtabs a.current {
	cursor: default;
	line-height: 34px;
	text-decoration: none;
	vertical-align: middle;
	font-family: Copperplate Gothic Light , Copperplate, Arial, Verdana, Helvetica, Times, sans-serif;
	font-size:10px;
	color: #807373;
}

#flowtabs #t1.current {
	background-position: 0 -66px;
}

#flowtabs #t2.current {
	background-position: -140px -66px;
}

#flowtabs #t3.current {
	background-position: -280px -66px;
}

#flowtabs #t4.current {
	background-position: -420px -66px;
}

#flowtabs #t5.current {
	background-position: -560px -66px;
}

#flowtabs a:focus {
	-moz-outline: none ! important
}

/* panes */
#flowpanes {
	background: url(Brown_panes.png) no-repeat 0 -100px;
	width: 700px;
	height: 480px;
}

/* single pane */
#flowpanes div {
	display: none;
	color: #000;
	margin: 0 16px;
	padding-top: 30px;
}

/* some decorations for elements inside single pane */
#flowpanes div h2 {
	font-weight: normal;
	color: #ddd;
	letter-spacing: 1px;
	margin: 10px 0 0 0;
	font-size: 22px;
}

#flowpanes a {
	color: #F3ECEC;
	font-size: 12px;
	text-decoration:underline;
}

#flowpanes a:hover {
	text-decoration:none;
}

/*#flowpanes p, #flowpanes samp {
	color:#333;
}*/

#flowpanes div.narrow {
	padding-right: 160px;
}

/* override the root element to enable scrolling */
#flowpanes {
	position: relative;
	overflow: hidden;
	clear: both;
}

/* override single pane */
#flowpanes div {
	float: left;
	display: block;
	width: 670px;
	cursor: pointer;
	font-size: 14px;
}

/* our additional wrapper element for the items */
#flowpanes .items {
	width: 20000em;
	position: absolute;
	clear: both;
	margin: 0;
	padding: 0;
}

#flowpanes .less, #flowpanes .less a {
	color: #999 !important;
	font-size: 11px;
}
/*
 BEGIN OVERLAY CSS
*/
/* the overlayed element */
div.overlay {

	/* growing background image */
	background-image:url(white.png);

	/* dimensions after the growing animation finishes  */
	width:525px;
	height:421px;

	/* initially overlay is hidden */
	display:none;

	/* some padding to layout nested elements nicely  */
	padding:55px;
}

/* default close button positioned on upper right corner */
div.overlay div.close {
	background-image:url(close.png);
	position:absolute;
	right:5px;
	top:5px;
	cursor:pointer;
	height:35px;
	width:35px;
}
/* black */
div.overlay.black {
	background:url(transparent.png) no-repeat !important;
	color:#fff;
}

/* petrol */
div.overlay.petrol {
	background:url(petrol.png) no-repeat !important;
	color:#fff;
}

div.black h2, div.petrol h2 {
	color:#ddd;
}

/* use a semi-transparent image for the overlay */
#overlay {
	background-image:url(transparent.png);
	color:#efefef;
	height:420px;
	z-index:100 ;
}

/* container for external content. uses vertical scrollbar, if needed */
div.wrap {
	height:410px;
	overflow-y:auto;
}
/*
 END OVERLAY CSS
*/

/*
	BEDIN CSS NAOS
*/
body {
	font-family: Arial, Verdana, Helvetica, Times, sans-serif;
	font-size: 12px;
	letter-spacing: 1px;
	word-spacing: 2px;
	line-height: 20px;
	margin-left: 5px;
	margin-top: 2px;
	margin-right: 0;
	color:#F3ECEC;
}

.header16DarkGrey {
	font-family: Arial, Verdana, Helvetica, Times, sans-serif;
	font-size: 16px;
	color: #333;
}

.header20Red {
	font-family: Arial, Verdana, Helvetica, Times, sans-serif;
	font-size: 20px;
	color: #807373;
	word-spacing: 2px;
	letter-spacing: 1px;
}

td, p.text, ul.text {
	font-family: Arial, Verdana, Helvetica, Times, sans-serif;
	font-size: 12px;
	letter-spacing: 1px;
	word-spacing: 2px;
	line-height: 16px;
	color:#E5E1E1;
	font-weight:normal;
	text-align:left;
}

td.left {
	text-align: left;
}

td.right {
	text-align: right;
}

td.justify {
	text-align: justify;
}

td.center {
	text-align: center;
}

td.top {
	vertical-align: top;
}

td.middle {
	vertical-align: middle;
}

td.bottom {
	vertical-align: bottom;
}

td.label {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 12px;
	letter-spacing: 1px;
	word-spacing: 2px;
	color:#F3ECEC;
	font-weight:normal;
	text-align: right;
	height: 40px;
	white-space: nowrap;
}

input.inputTexte {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFCFC;
	background-color: #463F3F;
	width: 220px;
	border: 1px dashed #FFFCFC;
	padding: 2px;
	letter-spacing: 1px;
	word-spacing: 2px;
}

input.highlight {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #463F3F;
	background-color: #fff;
	width: 220px;
	border: 1px dashed #463F3F;
	padding: 2px;
	letter-spacing: 1px;
	word-spacing: 2px;
}

textarea.inputTexte {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFCFC;
	background-color: #463F3F;
	width: 330px;
	height: 50px;
	border: 1px dashed #FFFCFC;
	padding: 2px;
	letter-spacing: 1px;
	word-spacing: 2px;
}

textarea.highlight {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #463F3F;
	background-color: #fff;
	width: 330px;
	height: 50px;
	border: 1px dashed #463F3F;
	padding: 2px;
	letter-spacing: 1px;
	word-spacing: 2px;
}

input.submit {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #FFFCFC;
	background-color: #463F3F;
	width: 80px;
	height: 30px;
	border: 1px dashed #FFFCFC;
	padding: 2px;
	letter-spacing: 1px;
}

input.submitOver {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #463F3F;
	background-color: #FFFCFC;
	width: 80px;
	height: 30px;
	border: 1px dashed #FFFCFC;
	padding: 2px;
	letter-spacing: 1px;
	word-spacing: 2px;
}

div#footer {
	position:absolute;
	top:625px;
	left:40px ;
	z-index:10 ;
	font-family: Arial, Verdana, Helvetica, Times, sans-serif;
	font-size:10px;
	color:#000 ;
}

a#demo {
	font-family: Copperplate Gothic Light , Copperplate, Arial, Verdana, Helvetica, Times, sans-serif;
	font-size:14px;
	color: #F8F8DA;
	word-spacing:5px;
	letter-spacing:3px;
}

p.signature {
	font-family: Arial, Verdana, Helvetica, Times, sans-serif;
	font-size:10px;
	color:#000 ;
}

div#tab1, div#tab2, div#tab3, div#tab4, div#tab5 {
	height:420px;
	width:680px;
	padding-left:10px;
}

div#tab1 {
	background: url(ImageAccueil.png) no-repeat 420px 100px;
}


div#tab2 {
	background: url(Offre.png) no-repeat 420px 80px;
}

div#tab3 {
	background: url(Outils.png) no-repeat 432px -5px;
}

div#tab4 {
	background: url(Accomp250.png) no-repeat 420px 80px;
}

p.widthFixed, ul.widthFixed{
	width:430px;
}

ul {
	padding-left:0;
}
li.puce {
 	list-style-type: none;
	background: url(puce-24.png) no-repeat top left;
	padding-left: 20px;
	line-height:20px;
}

p.logo {
	font-family: Copperplate Gothic Light , Copperplate, Arial, Verdana, Helvetica, Times, sans-serif;
	font-size:18px;
	color: #000;
}

p.header16 {
	font-family:  Copperplate, Arial, Verdana, Helvetica, Times, sans-serif;
	font-size:16px;
}

a.link, a.link:visited, span.link {
	font-family: Arial, Verdana, Helvetica, Times, sans-serif;
	font-size:10px;
	color: #000;
	text-decoration:underline ;
}
.legalMention {
	font-family: Arial, Verdana, Helvetica, Times, sans-serif;
	font-size: 10px;
	line-height:11px;
	color:#F3ECEC;
	font-weight:normal;
	text-align:left;
}

a.link:hover {
	text-decoration:none ;
}

span.surligner {
	/*color:#cc9;*/
	color: #F8F8DA;
}

p.title {
	text-decoration:none ;
	font-family: Copperplate Gothic Light , Copperplate, Arial, Verdana, Helvetica, Times, sans-serif;
	font-size: 14px;
	color:#FFFCFC ;
}
/*
	END CSS NAOS
*/

