* {margin: 0; padding: 0; list-style: none;}
html, body {width: 100%; height: 100%;}
html {font-size: 100%;}
fieldset, img, abbr, acronym {border: 0;}

body {
	text-align: center;
	font-size: 12px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #012f3c;
	background: #ebebec url(../charte/bg-body.gif) repeat-x 0 0;
}


#page {
	position: relative;
	margin: 0 auto;
	width: 993px;
	text-align: left;
	background: white url(../charte/bg-page.gif) no-repeat 39px 531px;
	z-index: 1;
}
#accueil #page {
	background: white none;
}
#header {
	width: 993px;
	height: 278px;
	background: transparent url(../charte/bg-header.jpg) no-repeat 0 0;
	text-align: left;
	z-index: 5;
}
#accueil #header {
	height: 375px;
}
#container {
	clear: both;
	width: 993px;
}

a {
	color: #003366;
	text-decoration: none;
}
a:hover {
}

/* Images png URL a revoir... */
img { behavior: url(win_png.htc); }

/* ajouter pour containers elements floatants */
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
.clearfix {
	display: inline-block;
}
html[xmlns] .clearfix {
	display: block;
}
* html .clearfix {
	height: 1%;
}
/* fin containers elements floatants */

.clearall {
	display: block;
	clear: both;
	float: none;
	font-size: 1px;
	height: 1px;
	line-height: 1px;
}
#flash,
#flash_accueil {
	clear: both;
	position: absolute;
	top: 76px;
	left: 0;
	width: 993px;
	height: 299px;
	z-index: 10;
}
#flash {
	top: 117px;
	height: 161px;
}

#logo {
	position: relative;
	top: 140px;
	left: 45px;
	width: 217px;
	height: 87px;
	z-index: 800;
}
#pied {
	clear: both;
	width: 987px;
	background: #87de2b url(../charte/bg-pied.gif) no-repeat 0 100%;
	margin: 0 auto 0 auto;
}

#pied,
#pied a {
	color: #FFF;
	text-align: center;
	padding: 8px 3px;
}
#pied a:hover {
	background: #5ea30f;
}
#flag {
	background: transparent url(../charte/bg-flag.gif) no-repeat 0 0;
	padding: 0 0 0 6px;
	position: absolute;
	top: 49px;
	left: 4px;
}
#flag ul {
	display: block;
	height: 27px;
	width: auto;
	float: left;
	background: transparent url(../charte/bg-flag-d.gif) no-repeat 100% 0;
	padding: 0 6px 0 0;
}

#flag ul li {
	display: block;
	float: left;
	height: 27px;
}
#flag ul li a {
	display: block;
	padding: 6px 5px 0 4px;
	background: transparent none;
}
#flag ul li a:hover {
	display: block;
	margin: 2px 0 0 0;
	padding: 4px 5px 0 4px;
	background: #000;
}

/* —————————— UNE DEUX TROIS COLONNES —————————— */

#contenu {
	padding: 0 60px;
}
#contenu_nav {
	width: 758px;
	padding: 0 0 0 0;
	float: right;
}
#contenu_nav_aside {
	width: 755px;
	float: right;
}
#contenu_aside {
	width: 933px;
	position: relative;
	top: 0;
	left: 60px;
}

#content {
	min-height: 270px;
	float: left;
}
* html #content {
	height: 270px;
}
#contenu #content {
	width: 100%;
	float: none;
}


#contenu_aside #content {
	width: 650px;
}
#contenu_nav_aside  #content {
	width: 495px;
}
#accueil #contenu_nav_aside  #content {
	width: 510px;
}


#nav {
	position: relative;
	left: 16px;
	float: left;
	width: 235px;
	background: transparent url(../charte/bg-nav.gif) repeat-y 0 0;
}

#aside {
	float: right;
	width: 220px;
	padding: 0 20px 0 0;
	margin: 0 0 10px 0;
	background: transparent url(../charte/bg-aside.gif) repeat-y 0 0;
}
#accueil #aside {
	width: 194px;
	background: transparent url(../charte/bg-aside-acc.gif) repeat-y 0 0;
}



/* —————————— FIN UNE DEUX TROIS COLONNES —————————— */



#ariane {
	width: 753px;
	margin: 10px 0 10px 240px;
	color: #aaa9a9;
	font-size: 10px;
}
#accueil #ariane {
	margin: 60px 0 10px 240px;
}
.arianagauche #ariane {
	margin: 10px 0 10px 60px;
}
#ariane a {
	color: #aaa9a9;
	font-size: 10px;
}
#ariane a:hover {
	color: #333;
}


h1 {
	color: #012f3c;
	font-weight: normal;
	font-size: 19px;
	margin: 0 0 10px 0;
}



#content h2 {
	color: #5d584e;
	font-weight: 400;
	font-size: 18px;
	padding: 2px 0 10px 0;
}

#content h3 {
	color: #65aa13;
	font-weight: 700;
	font-size: 14px;
	margin: 2px 0 10px 0;
}

#content h4 {
	font-size: 11px;
}
#content p {
	margin: 0 0 14px 0;
	text-align: justify;
}
#content ul li {
	background: transparent url(../charte/bg-li.gif) no-repeat 0 3px;
	padding: 0 0 0 10px;
	margin: 0 0 4px 0;
}


#aside h2 {
	color: #fff;
	font-weight: 700;
	font-size: 19px;
	padding: 14px 5px 15px 5px;
	text-align: center;
}
#aside ul li {
	padding: 3px 15px 0 20px;
}
#aside .encadre {
	background: transparent url(../charte/bg-aside-h.jpg) no-repeat 0 0;
}
#aside .encadre .fond {
	background: transparent url(../charte/bg-aside-b.jpg) no-repeat 0 100%;
	min-height: 317px;
	padding: 0 0 20px 0;
}
* html #aside .encadre .fond {
	height: 220px;
}

#accueil #aside .encadre {
	background: transparent url(../charte/bg-aside-h-acc.jpg) no-repeat 0 0;
}
#accueil #aside .encadre .fond {
	background: transparent url(../charte/bg-aside-b-acc.jpg) no-repeat 0 100%;
	min-height: 208px;
	padding: 0 0 20px 0;
}

#accueil #aside .encadre .fond p {
	margin: 0 15px 0 15px;
}

#accueil #aside .encadre .fond a {
	float: right;
	margin-right:15px;
}

#content .encadre {
	background: transparent url(../charte/bg-encadre.jpg) repeat-y 0 0;
	width: 491px;
}
#content .encadre .fond {
	background: transparent url(../charte/bg-encadre-h.jpg) no-repeat 0 0;
	width: 491px;
}
#content .encadre .fond .bas {
	background: transparent url(../charte/bg-encadre-b.jpg) no-repeat 0 100%;
	width: 464px;
	padding: 10px 17px 5px 10px;
}

#content .description {
	color: #012f3c;
	line-height: 15px;
	margin: 0 30px 0 0;
}
#content .description p,
#content .description h2,
#content .description h2 a {
	color: #012f3c;
	font-size: 12px;
	font-weight: 700;
	margin: 5px 0 0 0;
	padding: 0;
}
#content .description p {
	font-weight: 400;
	margin: 0;
}
.liste {
	margin: 0 0 10px 0;
}

.separateur {
	clear: both;
	background: #000;
	font-size: 1px;
	line-height: 1px;
	height: 1px;
	margin: 15px 0;
}
* + html .separateur {
	height: auto;
}



/* colonnes */
.colonne75 {
	width: 72%;
	float: left;
	text-align: left;
	margin: 0;
	padding: 0 3% 0 0 ;
}
.colonne66 {
	width: 63%;
	float: left;
	text-align: left;
	margin: 0;
	padding: 0 3% 0 0 ;
}
.colonne50 {
	width: 47%;
	float: left;
	text-align: left;
	margin: 0;
	padding: 0 3% 0 0 ;
}
.colonne33 {
	width: 30%;
	float: left;
	text-align: left;
	margin: 0;
	padding: 0 3% 0 0 ;
}
.colonne25 {
	width: 20%;
	float: left;
	text-align: left;
	margin: 0;
	padding: 0 5% 0 0 ;
}
/* fin colonnes */


#content ul.plansite {
	display: block;
	padding: 0 0 10px 0;
	width: 100%;
	background: #FFF;
}
#content ul.plansite a {
	text-decoration: none;
	color: #0e3d7b;
	padding: 0;
	margin: 0;
}
#content ul.plansite li {
	margin: 0;
	padding: 0;
	background: none;
}
* html #content ul.plansite li ul li {
	display: block;
	float: left;
	width: 90%;
}
#content ul.plansite li.colonne25 {
	width: 23%;
	float: left;
	margin: 10px 2% 0 0;
	padding: 0;
	background: none;
}
#content ul.plansite li.colonne25 strong a {
	display: block;
	padding: 4px 14px;
	margin: 0 0 4px 0;
	position: relative;
	background: #ebebec none;
	font-size: 13px;
	font-weight: normal;
}
#content ul.plansite li.colonne25 strong a:hover {
	background: #eee;
}
#content ul.plansite li ul li {
	padding: 5px 0 0 12px;
	background: none;
	width: auto;
}
#content ul.plansite li ul li strong {
	display: inline;
	background-image: none;
	background-color: white;
	padding: 0;
	font-size: 11px;
	font-weight: normal;
}
#content ul.plansite li ul li a {
	display: block;
	padding: 4px 0 0 7px;
	background: transparent url(../charte/bg-li-plan.gif) no-repeat 0 10px;
	color: #0e3d7b;
	font-size: 10px;
}
#content ul.plansite li ul li a:hover {
	background: #ebebec;
	color: #333;
}
#content ul.plansite li ul li ul li a {
	color: #000;
	background: none;
	padding: 0;
}
#content ul.plansite li ul li ul li a:hover {
	background: #ebebec;
	color: #333;
}



/* —————————— FORMULAIRES —————————— */
form {
	display: block;
	margin: 0 0 20px 0;
}

input,
select {
	font-size: 11px;
	margin: 0 5px;
}
input.champtexte {
	width: 288px;
	padding: 4px;
	margin: 0 5px;
	border: #bababa 1px solid;
}
textarea.champtexte {
	width: 400px;
	padding: 4px;
	margin: 0 5px 0 0;
	border: #bababa 1px solid;
}
label {
	display: block;
	float: left;
	width: 105px;
}
input.submit {
	font-size: 13px;
	margin: 5px 0 5px 110px;
}

.obligatoire {
	color: #5d584e;
	font-size: 10px;
}
.libre label {
	display: inline;
	float: none;
	width: auto;
}
.libre input.champtexte {
	width: auto;
}

/* —————————— FIN FORMULAIRES —————————— */


/* —————————— TABLEAUX —————————— */

table.tableau {
	width: 100%;
	background: #bbdbf9;
	margin: 0;
	border: 0;
	padding: 0;
}
table.tableau caption {
	clear: both;
	background: #bbdbf9;
	margin: 10px 0 0 0;
	padding: 5px 0;
	font-size: 13px;
	text-align: center;
	font-weight: bold;
	caption-side: top;
	border-bottom: 1px solid #FFF;
}
table.tableau th {
	margin: 0;
	padding: 5px 0 5px 2px;
	background: #bbdbf9;
	text-align: center;
	font-size: 12px;
	border: 0;
	font-weight: normal;
}
table.tableau td {
	margin: 0;
	background: #e4f6fd;
	padding: 5px 2px;
	text-align: left;
	font-size: 11px;
	vertical-align: top;
	empty-cells: show;
	border: #bbdbf9 1px solid;
	border-width: 1px 1px 0 0;
}
table.tableau.center td {
	text-align: center;
}
table.tableau td.last {
	border-right: 0;
}


/* —————————— FIN TABLEAUX —————————— */


/* —————————— sous menu —————————— */
#sous_menu {
	padding: 0 0 20px 0;
	width: 100%;
	background: transparent url(../charte/bg-sousmenu.jpg) no-repeat bottom left;
}

#sous_menu ul{
	display: block;
	width: 100%;
	background: transparent url(../charte/bg-sousmenu-ul.jpg) no-repeat 0 0;
	padding: 25px 0 0 0;
}
#sous_menu ul li {
	display: block;
	width: 193px;
	margin-left: 8px;
	background: transparent url(../charte/bg-sousmenu-li.gif) no-repeat 0 100%;
}
#sous_menu ul li.last {
	background: transparent none;
}
#sous_menu ul li a {
	color: #211d1a;
	display: block;
	margin: 0 7px 0 2px;
	padding: 10px 5px 10px 15px;
	background-color: transparent;
	text-align: left;
	font-size: 14px;
}
#sous_menu ul li a.on {
	font-weight: bold;
	font-size: 14px;
}
#sous_menu ul li a:hover {
	background: #FFF;
}
/* —————————— fin sous menu —————————— */


.gauche {
	float: left;
	margin: 0 10px 0 0;
}
.droite {
	float: right;
	margin: 0 0 0 10px;
}

a.savoir span {
	color: #FFF;
	background: transparent url(../charte/bg-savoir.gif) no-repeat 0 50%;
	padding: 5px 0 7px 7px;
}
a.savoir {
	color: #FFF;
	background: transparent url(../charte/bg-savoir-a.gif) no-repeat 100% 50%;
	padding: 5px 7px 7px 0;
}
a.savoir:hover {
	background: transparent url(../charte/bg-savoir-over.gif) no-repeat 100% 50%;
}
.modifier {
	padding-top: 5px;
}
.modifier a.savoir {
	font-size: 10px;
	margin-right: 15px;
}

span.up_down {
	display: block;
	width: 7px;
	float: right;
}
span.up_down a {
}


.temoignages {
	float: right;
	width: 250px;
	margin-left: 10px;
}
.temoignages .fond {
	border: #cfcfff 1px solid;
	padding: 10px 20px;
}
#content .temoignages h2 {
	text-align: center;
	font-weight: normal;
	padding: 0 0 10px 0;
}
#content .temoignages p {
	border-bottom: #cccccc 1px solid;
	padding: 0 0 10px 0;
}

.chapo {
	font-weight: bold;
}
.texte_encadre {
	font-size: 14px;
	line-height: 14px;
}
small {
	color: #999999;
	font-size: 10px;
}


.texte {}
#contenu_nav .texte {
	padding: 0 20px 0 8px;
}



div.puce,
ul.puce li,
#content ul.puce li,
p.puce,
h3.puce,
#content h3.puce,
#content p.puce {
	background: transparent url(../charte/puce.gif) no-repeat 0 2px;
	padding: 0 0 0 17px;
	margin: 0 0 5px 5px;
	color: #000000;
}
#content h3.puce,
h3.puce {
	margin: 0 0 5px 5px;
	color: #000000;
	font-size: 15px;
	background-position: 0 5px;
}
.puce a {
	color: #003366;
	text-decoration: underline;
}
.puce a:hover {
	color: #000;
	text-decoration: none;
	background-color: #eee;
}
#content h3.puce a,
h3.puce a {
	text-decoration: none;
}
div.puce {
	margin: 10px 0 0 5px;
}
div.puce a {
	color: #333333;
}
.contribuer a {
	background: #f3a03d url(../charte/puce.gif) no-repeat 4px 7px;
	color: #FFF;
	padding: 4px 5px 4px 20px;
	font-size: 13px;
}
.contribuer a:hover {
	background-color: #eee;
	color: #000000;
}
.etat {
	color: #cc6633;
}

 
#video {
	width: 170px;
	margin: 0 auto;
}

.maj {
	font-size: 8px;
	color: #006699;
	margin: 15px 0 5px 0;
}

a.question {
	padding: 0 10px;
	position: relative;
}
a.question span {
	position: absolute;
	display: none;
	top: 0;
	left: 0;
	width: 0;
	height: 0;
}
a.question:hover span {
	position: absolute;
	display: block;
	padding: 15px;
	font-size: 11px;
	color: #999999;
	width: 300px;
	height: auto;
	background: white url(../charte/question.gif) no-repeat 10px 2px;
}

#nom {
	position: absolute;
	left: 265px;
	top: 75px;
	background: white;
	color: #0e3d7b;
	font-size: 16px;
	padding: 5px 10px;
	height: 23px;
	white-space: nowrap;
}


.impression {
	position: absolute;
	right: 20px;
	top: 5px;
	width: 20px;
}
.send {
	position: absolute;
	right: 0;
	top: 5px;
	width: 20px;
	text-align: center;
}

a.pdf {
	display: block;
	clear: both;
	padding: 20px 0 20px 50px;
	background: transparent url(../charte/pdf.gif) no-repeat 0 0;
	text-decoration: underline;
}
a.pdf:hover {
	padding: 20px 0 20px 49px;
	background-position: 1px 0;
}

/* affichage pages suivantes precedentes */
#content p.pages {
	padding: 10px 0 0 0;
	text-align: center;
	font-size: 10px;
}
.pages {
	padding: 10px 0 0 0;
	clear: both;
	text-align: center;
	font-size: 10px;
	overflow: hidden;
}
.pages a,
.pages b {
	background: transparent url(../charte/bg-pages.gif) no-repeat 100% 50%;
	text-align: center;
	font-size: 11px;
	padding: 2px 8px 2px 3px;
	line-height: 23px;
	text-decoration: none;
}
.pages b {
	font-weight: bold;
	font-size: 13px;
}
.pages a.last,
.sans,
b.sans,
a.sans {
	background-image: none;
}
b.sans {
	color: #003366;
	font-size: 15px;
}
.pages a:hover {
	background-color: #eeeeee;
}
/* fin affichage pages suivantes precedentes */

.accessible {
	display: none;
}


/* ================================================================ */
#menu {
	width: 993px;
	position: absolute;
	top: 76px;
	left: 0;
	z-index: 920;
}

#menu ul {
	display: block;
	width: 915px;
	height: 41px;
	text-align: center;
	padding-left: 78px;
}
#menu ul li .fond_menu ul {
	width: 168px;
	height: auto;
	padding: 0;
	text-align: left;
	background: #0c3a4c;
}
#menu ul li {
	display: block;
	width: 168px;
	margin: 0 -10px;
	float: left;
	position:relative;
	z-index: 930;
	text-align: center;
}
/* ================================================================ */
#menu ul li a,
#menu ul li a:visited {
	color: #FFF;
	font-size: 15px;
	padding: 11px 0 11px 0;
	margin: 0;
	display: block;
	width: 168px;
	height: 19px;
	background: transparent url(../charte/bg-menu-a.gif) no-repeat 158px 0;
	position: relative;
	z-index: 999;
}
#menu ul li a.on,
#menu ul li a.on:visited {
	background: transparent url(../charte/bg-menu-on.gif) no-repeat 12px 0;
}
#menu ul li a:hover,
#menu ul li a.on:hover {
	background: transparent url(../charte/bg-menu-h.gif) no-repeat 0 0;
	color: #FFF;
	text-decoration: none;
}
#menu ul li.menu_5 a,
#menu ul li.menu_5 a:visited {
	background: none;
}
#menu ul li.menu_5 a:hover {
	background: transparent url(../charte/bg-menu-h.gif) no-repeat 0 0;
}
* html #menu ul li ul li a,
* html #menu ul li ul li a:visited {
	background: transparent url(../charte/bg-menu.gif) no-repeat 0 100%;
	font-size: 11px;
	line-height: normal;
	width: 148px;
	height: auto;
	padding: 12px 10px;
}

/* hide the sub levels and give them a positon absolute so that they take up no room */
#menu ul li .fond_menu {
	visibility:hidden;
	position:absolute;
	width: 168px;
	height:auto;
	top:40px;
	left:0;
	z-index: 950;
	background: transparent url(../charte/bg-menu-b.gif) no-repeat 0 100%;
	padding-bottom: 8px;
}
#menu ul li table {position:absolute; top:0; left:0; border-collapse:collapse;z-index: 950;font-size: 11px;}
#menu ul li .fond_menu ul li {
	clear: both;
	display: block;
	background: #0c3a4c none;
	text-align: left;
	padding: 0;
	margin: 0;
}
#menu ul li .fond_menu a {
	display: block;
	clear: both;
	width: 148px;
	font-size: 11px;
	line-height: normal;
	height: auto;
	padding: 12px 10px;
	margin: 0;
	background: transparent url(../charte/bg-menu.gif) no-repeat 0 100%;
	z-index: 950;
}
#menu ul li .fond_menu li a,
#menu ul li .fond_menu li a.visited {background: transparent url(../charte/bg-menu.gif) no-repeat 0 100%;font-size: 11px;}
#menu ul li .fond_menu li.last a {background-image: none;}
#menu ul li .fond_menu a:hover {display: block;background: #333 none;height: 100%;}
#menu ul li .fond_menu :hover > a {background-color: #333; background-image: none;}
/* style the table so that it takes no ppart in the layout - required for IE to work */

/* make the second level visible when hover on first level list OR link */
#menu ul li:hover .fond_menu,
#menu ul li a:hover .fond_menu { visibility:visible;}
/* ================================================================ */


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



/* BLOCS SPECIFIQUES AU SITE */

#contactez,
#lancer_demo {
	position: absolute;
	left: 312px;
	top: 22px;
	height: 35px;
	width: 164px;
	z-index: 801;
}
#lancer_demo {
	left: 578px;
	width: 138px;
}
/*boutons en page accueil et rollover*/
#boutons_the {
	position: absolute;
	z-index: 900;
	top: 292px;
	left: 12px;
	width: 981px;
	font-size: 11px;
	line-height: 11px;
}
#boutons_the a.savoir {
	position: absolute;
	line-height: normal;
}
#bt_the_business,
#bt_the_economic,
#bt_the_essentiel,
#bt_the_solution {
	float: left;
	width: 211px;
	height: 121px;
	position: relative;
	z-index: 915;
}
#bt_over_the_business,
#bt_over_the_economic,
#bt_over_the_essentiel,
#bt_over_the_solution {
	display: none;
	position: absolute;
	top: 44px;
	/*left: 50px;*/
	left: 46px;
	background: #f0e6e6 url(../charte/bt-accueil-over.png) repeat-x 0 100%;
	/*width: 150px;*/
	width: 157px;
	height: 77px;
	z-index: 920;
}
.over #bt_over_the_business,
.over #bt_over_the_economic,
.over #bt_over_the_essentiel,
.over #bt_over_the_solution {
	display: block;
}

/* nav pour accueil */

#accueil #nav {
	width: 212px;
	left: 0;
	background: transparent url(../charte/bg-nav-accueil.gif) repeat-y 0 0;
	position: relative;
	left: 12px;
	top:-8px;
	color: white;
	font-size: 14px;
	font-weight: bold;
	margin: 0 0 0px 0;
}
#accueil #nav .encadre {
	background: transparent url(../charte/bg-nav-accueil-h.jpg) no-repeat 0 0%;
}
#accueil #nav .fond {
	background: transparent url(../charte/bg-nav-accueil-b.jpg) no-repeat 0 100%;
	text-align: center;
	padding: 27px 20px 15px 24px;
	/*min-height: 240px;*/
}
* html #accueil #nav .fond {
	height: 240px;
}
#bt_essai {position: relative;top: -30px;margin-bottom: -30px;}
a.essai {
	color: #FFF;
	background: transparent url(../charte/bt-essai-a.gif) no-repeat 0 50%;
	padding: 6px 0 7px 17px;
}
a.essai:hover {
	background-image: url(../charte/bt-essai-over.gif);
}
a.essai span {
	color: #FFF;
	background: transparent url(../charte/bt-essai.gif) no-repeat 100% 50%;
	padding: 6px 17px 7px 0;
	font-size: 14px;
	line-height: 27px;
}
.vignette_catalogue {position: relative;height: 160px;top: -10px;left: 10px;text-align: left;}
.vignette_catalogue img {position: absolute;}
.engage {font-size: 16px;}
.vingtquatre {font-size: 21px;}

/* boutons lateraux */
#boutons_aside {
	margin: 40px 0 0 0;
}
.bt_aside {
	position: relative;
	top: -40px;
	margin-bottom: -22px;
}
.bt_aside a {
	display: block;
	width: 209px;
	height: 86px;
	background: transparent url(../charte/bg-bt-aside.gif) no-repeat 2px 18px;
}
.bt_aside a:hover {
	background: transparent url(../charte/bg-bt-aside-over.gif) no-repeat 2px 18px;
}

.module {
	position: relative;
	top: 0;
	left: -18px;
	width: 776px;
	margin: 0 -18px 9px 0;
	background: transparent url(../charte/bg-module.gif) repeat-y 0 0;
	font-size: 13px;
	color: #012f3c;
}
#content .module h2 {
	margin: 0;
	padding: 0;
	font-size: 19px;
	font-weight: 700;
	color: #012f3c;
}
.module .fond {
	background: transparent url(../charte/bg-module-h.gif) no-repeat 0 0;
}
.module .bas {
	background: transparent url(../charte/bg-module-b.gif) no-repeat 0 100%;
	min-height: 110px;
}
* html .module .bas {
	height: 110px;
}
#the_economic,
#the_essentiel,
#the_business,
#the_solution {
	background: transparent url(../charte/bg-the-economic.jpg) no-repeat 57px 12px;
	padding: 32px 0 0 162px;
	margin: 0 10px 0 0;
	width: 435px;
	float: left;
	min-height: 68px;
}
#the_essentiel {
	background-image: url(../charte/bg-the-essentiel.jpg);
}
#the_business {
	background-image: url(../charte/bg-the-business.jpg);
}
#the_solution {
	background-image: url(../charte/bg-the-solution.jpg);
}
.module .gauche {
	margin: 72px 0 0 0;
}
.module a.savoir span {
	padding: 3px 0 2px 7px;
	font-size: 10px;
}
.module a.savoir {
	padding: 3px 7px 2px 0;
	font-size: 10px;
	line-height: 20px;
}
/* page avantages */
#avantages {
	position: relative;
	z-index: 200;
	width: 720px;
	height: 434px;
	margin: 0 0 10px 0;
}
#avantages img.fond {
	position: absolute;
	z-index: 202;
	width: 720px;
	height: 434px;
	bottom: 0;
	left: 0;
}
#avantages div.fond {
	position: relative;
	z-index: 205;
	width: 720px;
	height: 434px;
	top: 0;
	left: 0;
}
.popup {
	width: 308px;
	position: absolute;
	top: 33px;
	left: 400px;
	z-index: 400;
	display: none;
	cursor: pointer;
}
#content .popup h2 {
	width: 308px;
	background: transparent url(../charte/bg-popup-h.png) no-repeat 0 0;
	margin: 0;
	width: 260px;
	padding: 20px 24px 0 24px;
	color: #0b3544;
	font-weight: 700;
	font-size: 16px
}
* html #content .popup h2 {
	background: transparent url(../charte/bg-popup-h.gif) no-repeat 50% 0;
}
#content .popup ul {
	display: block;
	width: 260px;
	background: transparent url(../charte/bg-popup-b.png) no-repeat 0 100%;
	margin: 0;
	padding: 10px 24px 20px 24px;
}
* html #content .popup ul {
	background: transparent url(../charte/bg-popup-b.gif) no-repeat 50% 100%;
}
#content .popup ul li {
	background: none;
	margin: 10px 0 0 0;
	padding: 0;
	color: #3997dc;
	line-height: 15px;
}
.bouton {
	cursor: pointer;
}
#bt_marketing,
#bt_chiffre,
#bt_fideliser,
#bt_exploitation,
#bt_communication {
	position: absolute;
	top: 37px;
	left: 294px;
	z-index: 300;
	background: transparent url(../charte/bg-bouton.gif) no-repeat 50% 50%;
	color: #221e1b;
	text-align: center;
	width: 130px;
	height: 85px;
	padding: 45px 0 0 0;
}
#bt_chiffre {
	top: 110px;
	left: 167px;
}
#bt_fideliser {
	top: 110px;
	left: 431px;
}
#bt_exploitation {
	top: 250px;
	left: 207px;
}
#bt_communication {
	top: 250px;
	left: 390px;
}
.over #bt_marketing,
.over #bt_chiffre,
.over #bt_fideliser,
.over #bt_exploitation,
.over #bt_communication {
	background: transparent url(../charte/bg-bouton-over.gif) no-repeat 50% 50%;
	color: #fff;
}

#popup_marketing,
#popup_chiffre,
#popup_fideliser,
#popup_exploitation,
#popup_communication {display: none;}

/* page architecture */
#etape_1,
#etape_2,
#etape_3 {
	position: absolute;
	top: 66px;
	left: 20px;
	z-index: 300;
}

#etape_2 {
	top: 0px;
	left: 481px;
}
#etape_3 {
	top: 298px;
	left: 375px;
}
.bulle {
	width: 211px;
	background: transparent url(../charte/bg-bulle-h.png) no-repeat 0 0;
	color: #FFF;
	text-align: center;
}
* html .bulle {
	background: transparent url(../charte/bg-bulle-h.gif) no-repeat 0 0;
}
.bulle .bas {
	width: 171px;
	background: transparent url(../charte/bg-bulle-b.png) no-repeat 0 100%;
	margin: 5px 0 0 0;
	padding: 2px 20px 2px 20px;
}
* html .bulle .bas {
	background: transparent url(../charte/bg-bulle-b.gif) no-repeat 50% 100%;
}
#content .bulle h2 {
	color: #FFF;
	font-size: 19px;
	font-weight: 700;
	margin: 0;
	padding: 0;
}
#content .bulle p {
	text-align: center;
	font-size: 13px;
	line-height: 15px;
}

/* POUR HABILLER LES BOUTONS EN FRONT */
a.bouton { 
    display:-moz-inline-box; 
    display:inline-block; 
	color: #FFF;
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;
    margin:0; 
    padding:0; 
    text-align:center; 
    vertical-align:middle; 
    border:0; 
    background:none;
	cursor:pointer;
} 
a.bouton span { 
    position:relative; 
    float:left; 
    padding:0 0 0 10px;	/* Largeur du côté gauche */
    vertical-align:middle; 
    background:url(../charte/bt-gauche.gif) left top no-repeat; 
} 
a.bouton span span { 
    padding:0 10px 0 0;	/* Largeur du côté droit */
    background:url(../charte/bt-droite.gif) right top no-repeat; 
} 
a.bouton span span span { 
    height:40px;	/* Hauteur du bouton */
    padding:0; 
    line-height:27px;	/* Alignement vertical du texte */
    background:url(../charte/bt-centre.gif) left top repeat-x; 
}
a.bouton:hover span { 
    background:url(../charte/bt-gauche-over.gif) left top no-repeat; 
}
a.bouton:hover span span { 
    background:url(../charte/bt-droite-over.gif) right top no-repeat; 
} 
a.bouton:hover span span span  {
	
    background:url(../charte/bt-centre-over.gif) left top repeat-x; 
}
/* FIN POUR HABILLER LES BOUTONS EN FRONT */