/*** ELEMENTS GENERAUX *****************************************************************************************************************************************/
*          { margin: 0; padding: 0; }
HTML, BODY { height: 100%; }
BODY       { font-family: Tahoma, Arial, Helvetica, sans-serif; font-size: 11px; position:relative; background:#fff; color:#666; }
UL         { list-style:inside; }
A          { text-decoration:none; cursor:pointer; }
A:hover    { text-decoration:underline; }	
IMG        { border:none; }

/*** CONTENEURS **************************************************************************************************************************************/
#global { position:relative; width:870px; left:50%; margin:0 0 0 -450px; height:600px; padding:0 15px 0 15px; }
HTML>BODY>#global { min-height:600px; height:auto; }


/*** HEADER / MENU ***********************************************************************************************************************************/
#header            { height:110px; }
#logo              { display:block; height:100px; width:240px; float:left; outline:none; background:url(../pics/charte/logo.jpg) top left no-repeat; text-indent:-9000px; }
#shortcuts         { position:absolute; top:35px; right:50px; list-style:none; }
#shortcuts LI      { float:left; padding:0 7px 0 7px; }
#shortcuts .access { display:block; width:110px; height:11px; text-indent:-9000px; font-size:0; vertical-align:middle; background:url(../pics/charte/bg-access-client.jpg) top center no-repeat; }
.access:hover      { background-position:bottom center!important; }
#shortcuts .accessEn { display:block; width:110px; height:11px; text-indent:-9000px; font-size:0; vertical-align:middle; background:url(../pics/charte/bg-access-clientEn.jpg) top center no-repeat; }
.accessEn:hover    { background-position:bottom center!important; }
#menu              { float:left; list-style:none; height:15px; padding:65px 0 0 25px; }
#menu LI           { float:left; position:relative; height:15px; padding:0 2px 0 0; background:url(../pics/charte/bg-menu-li.jpg) top right no-repeat; }
#menu LI.last      { background:none; }
#menu LI A         { display:block; height:15px; padding:0 12px 0 12px; text-indent:-9000px; font-size:0; }
#menu LI A:hover   { background-position:bottom center!important; }
#menu LI A.active  { background-position:bottom center!important; }

#menu A#item1       { width:64px; background:url(../pics/charte/bg-menu-item1.jpg) top center no-repeat; }
#menu A#item1En     { width:83px; background:url(../pics/charte/bg-menu-item1En.jpg) top center no-repeat; }
#menu A#item2       { width:80px; background:url(../pics/charte/bg-menu-item2.jpg) top center no-repeat; }
#menu A#item2En     { width:74px; background:url(../pics/charte/bg-menu-item2En.jpg) top center no-repeat; }
#menu A#item3       { width:96px; background:url(../pics/charte/bg-menu-item3.jpg) top center no-repeat; }
#menu A#item3En     { width:87px; background:url(../pics/charte/bg-menu-item3En.jpg) top center no-repeat; }
#menu A#item4       { width:43px; background:url(../pics/charte/bg-menu-item4.jpg) top center no-repeat; }
#menu A#item4En     { width:43px; background:url(../pics/charte/bg-menu-item4En.jpg) top center no-repeat; }
#menu A#item5       { width:68px; background:url(../pics/charte/bg-menu-item5.jpg) top center no-repeat; }
#menu A#item5En     { width:68px; background:url(../pics/charte/bg-menu-item5En.jpg) top center no-repeat; }

#menu LI UL            { position:absolute; top:15px; left:0; width:120px; list-style:none; padding:5px 10px 5px 10px; background:#fff; z-index:500; }
#menu LI UL LI         { float:none; position:relative; height:auto; padding:5px 0 5px 0; background:none; border-bottom:1px solid #999; }
#menu LI UL LI.last    { padding:5px 0 0 0; border-bottom:none; }
#menu LI UL LI A       { display:block; height:auto; padding:0; text-indent:0px; font-size:12px; color:#999; }
#menu LI UL LI A:hover { font-weight:bold; text-decoration:none; }


/*** ARTICLE *****************************************************************************************************************************************/
#article          { clear:both; padding:10px 0 20px 0; line-height:15px; }
#article H1       { font-size:14px; margin:0 0 15px 0; padding-bottom: 15px; border-bottom: 1px solid #999; color: #999; }
#article H2       { font-size:11px; margin:8px 0 5px 0; }
#article H3       { font-size:11px; margin:0 0 8px 0; }
#article P        { margin:0 0 12px 0; }
#article UL       { margin:0 0 15px 15px; list-style:outside; }
#article UL LI    { line-height:16px;margin:0 0 5px 0; }
#article UL UL    { margin:4px 0 10px 25px; list-style:none!important; }
#article UL UL LI { margin:0; }
#article A        { text-decoration:underline; color:#666; }

/* accueil */
#homeFlash       { width:590px; heght:288px; float:left; }
#homeFlashEn     { width:590px; heght:288px; float:left; }
#homeColDroite   { width:275px; height:auto; margin-top:2px; float:right; color:#330000; font-size:12px; border-top:1px solid #999; }
#homeColDroite A { color:#999; text-decoration:none; }

#homeColDroite .actuHome { position:relative; clear:both; height:88px; padding:2px 0 0 0; border-bottom:1px solid #999; }
#homeColDroite .actuHome H2 { float:right; width:145px; }
#homeColDroite .actuHome P { float:right; width:145px; margin-bottom:0; }
#homeColDroite .actuHome P.photo { float:left; width:100px; height:88px; position:relative; }
#homeColDroite .actuHome P.photo A { display:block; width:100px; height:68px; padding:19px 0 0 0; }

#menuWhite                 { float:left; list-style:none!important; width:208px; margin:0 auto 0 auto; padding:10px 0 0 0; }
#menuWhite LI              { height:26px; padding:0 0 5px 0; border-bottom:1px solid #ccc; }
#menuWhite LI A            { display:block; width:218px; height:26px; text-indent:-9000px; font-size:0; }
#menuWhite LI A:hover      { background-position:bottom center!important; }

#menuWhiteEn               { float:left; list-style:none!important; width:208px; margin:0 auto 0 auto; padding:10px 0 0 0; }
#menuWhiteEn LI            { height:26px; border-bottom:1px solid #ccc; }
#menuWhiteEn LI A          { display:block; width:218px; height:26px; text-indent:-9000px; font-size:0; }
#menuWhiteEn LI A:hover    { background-position:bottom center!important; }

#stores { float:left; width:625px; padding-left:20px; }
.store { float:left; width:90px; padding:0 14px 0 0; text-align:center; }
P.logo { height:70px; position:relative; margin:0 0 5px 0!important; }
.store A { text-decoration:none!important; }

#presentation { float:left; width:608px; padding:0 0 0 37px; font-size:12px; letter-spacing:1px; }

/* pages internes */
#ssmenu            { width:192px; float:left; list-style:none!important; letter-spacing:0.8px; margin:0!important; }
#ssmenu LI         { width:192px; height:38px; margin:0!important; border-top:1px solid #ccc; }
#ssmenu LI A       { display:block; width:175px; height:28px; color:#999; padding:10px 0 0 17px; text-decoration:none; }
#ssmenu LI A:hover { text-decoration:none; font-weight:bold; }
#ssmenu .last      { border-bottom:1px solid #ccc; }
#ssmenu .active A  { font-weight:bold; }
#ssmenu A.active   { font-weight:bold; }

#ssmenu .rouge:hover    { color:#BC2C36!important; }
#ssmenu .active .rouge  { color:#BC2C36!important; }
#ssmenu .vert:hover     { color:#9BC24B!important; }
#ssmenu .active .vert   { color:#9BC24B!important; }
#ssmenu .bleu:hover     { color:#5CA7C7!important; }
#ssmenu .active .bleu   { color:#5CA7C7!important; }
#ssmenu .violet:hover   { color:#8D679A!important; }
#ssmenu .active .violet { color:#8D679A!important; }
#ssmenu .orange:hover   { color:#E16E37!important; }
#ssmenu .active .orange { color:#E16E37!important; }

#texte  { width:370px; float:left; padding:9px 0 0 35px; }
#texte.milarge  { width:643px; }
#texte.large  { width:835px; }

#colDroite   { width:257px; float:right; padding:40px 0 0 0; }
#colDroite P { margin:0 0 20px 0; }

#mapcontainer { width:410px; height:410px; }
#map { width:100%; height:100%; }

#sitemap A { text-decoration:none; }
#sitemap A:hover { text-decoration:underline; }

.actu { position:relative; clear:both; padding:5px 0 0 0; border-bottom:1px solid #999; }
.actu H2 { float:right; width:705px; }
.actu H1 { float:right; width:705px; }
.actu H1.actu { height:50px; padding:30px 0 0 0!important; clear:none; border:none!important; text-decoration:underline; margin:0!important; }
.actu H1.actu A { display:block; float:right; width:50px; height:50px; margin:0 0 0 20px; }
.actu P { margin-bottom:0; }
.actu P.photo { float:left; width:100px; position:relative; padding:10px 0 0 0; }
.actu A { text-decoration:none!important; }

.metiers { width:400px; }
.metiers H1 { height:17px; margin:20px 0 20px 0!important; padding:0!important; border:none!important; text-align:center; }
.metiers .metier { float:left; width:190px; height:180px; border-right:1px solid #999; border-bottom:1px solid #999; }
.metier H2 { height:30px; margin:0 0 40px 0!important; padding:10px 5px 0 85px; line-height:20px; font-size:14px!important; color:#2a2a2a; }
.metier P { padding:0 5px 0 8px; font-size:13px; color:#000; }
.metiers#conseils { float:left; }
/*.metiers#conseils H1 { background:url(../pics/charte/bg-metier-conseil.jpg) top center no-repeat; }*/
/*.metiers#conseils .metier { background:url(../pics/charte/metiersConseil.png) top left no-repeat; }*/
.metiers#developpement { float:right; }
/*.metiers#developpement H1 { background:url(../pics/charte/bg-metier-dev.jpg) top center no-repeat; }*/
/*.metiers#developpement .metier { background:url(../pics/charte/metiersDev.png) top left no-repeat; }*/

.offre { float:left; position:relative; width:170px; height:140px; margin:0 20px 30px 0; padding:10px; border-right:1px solid #999; border-bottom:1px solid #999; }
.offre H2 { float:right; width:90px; margin-bottom:15px!important; font-size:14px!important; }
.offre IMG { float:left; }
.offre P { clear:both; }
.offre H2 A { text-decoration:none!important; }
.offre .savoirplus { position:absolute; bottom:0; right:10px; }
.savoirplus A { text-decoration:none!important; }
.savoirplus A:hover { text-decoration:underline!important; }

.offreTitre { height:72px; line-height:56px; padding-bottom:5px!important; }
.offreTitre IMG { float:left; margin-right:15px;  }
.rubriqueMetier { display:block; float:left; margin:0 10px 20px 0; padding:0 10px 0 0; cursor:pointer; font-size:14px; font-weight:bold; color:#ccc; border-right:1px solid #ccc;  }
.rubriqueMetier.active { color:#000; }
.rubriqueMetier.last { border:none; }

#objectifs { clear:both; padding:10px 0 0 0; }
#objectifs UL { margin:0 0 15px 0; list-style:none outside; }
#objectifs UL LI { height:25px; line-height:12px!important; margin:0 0 10px 0; padding:0 0 0 30px; font-size:12px; }

#etudedecas { clear:both; }
#etudedecas H2 { clear:both; float:left; width:90px; padding:10px 0 15px 30px; margin:8px 0 30px 0; border-top:1px solid #ccc; line-height:12px; }
#etudedecas P { float:left; width:490px; padding:16px 0 0 30px; font-size:12px; line-height:16px; }

#solutions { clear:both; }
#solutions .metiers { width:650px; }
.NosSolutions { font-size: 14px !important; margin-bottom: 15px !important; color:#000;   }

/* formulaires */
LABEL    { display:block; float:left; }
INPUT    { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color:#666; padding:2px; border:1px solid #ccc; border-top:1px solid #666; border-left:1px solid #666; }
SELECT   { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color:#666; padding:2px; border:1px solid #ccc; border-top:1px solid #666; border-left:1px solid #666; }
TEXTAREA { font-family:Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color:#666; padding:2px; border:1px solid #ccc; border-top:1px solid #666; border-left:1px solid #666; }

.submit { text-align:center; }
.submit INPUT { border:1px solid #000; border-top:1px solid #ccc; border-left:1px solid #ccc; width:auto!important; background:#fff; cursor:pointer; margin-right:10px; }

#contactForm          { margin-bottom:80px; }
#contactForm LABEL    { width:120px; }
#contactForm INPUT    { width:280px; }
#contactForm SELECT   { width:288px; }
#contactForm TEXTAREA { width:280px; }
#contactForm #envoi   { width:100px; cursor:pointer; float:right; }
#btnCarte             { width:100px; cursor:pointer; }

#candidature          { margin-bottom:80px; }
#candidature LABEL    { width:120px; }
#candidature INPUT    { width:210px; margin-right:5px; }
#candidature SELECT   { width:218px; margin-right:3px; }
#candidature TEXTAREA { width:360px; height:150px; }
#candidature #envoi   { width:100px; cursor:pointer; float:right; }
#candidature #cv      { width:200px; margin-right:0px; }

#accessForm LABEL    { width:140px; }

.warning { width:365px; height:31px; background:url(../pics/charte/warning.jpg) top left no-repeat; padding:15px 0 0 45px; }
.warning.mini { width:290px; background:url(../pics/charte/warning-mini.jpg) top left no-repeat; }
.success { width:365px; height:31px; background:url(../pics/charte/success.jpg) top left no-repeat; padding:15px 0 0 45px; }
.success.mini { width:290px; background:url(../pics/charte/success-mini.jpg) top left no-repeat; padding:15px 0 0 45px; }

/*** FOOTER *****************************************************************************************************************************************/
#footer { border-top:1px solid #CCC; padding:10px 0 10px 0; text-align:center; }
#footer A { color:#666; }

/*** CLASSES *****************************************************************************************************************************************/
.spacer  { clear:both; }
.flag    { display:block; width:16px; height:11px; float:left; text-indent:-9000px; font-size:0; vertical-align:middle; }
.fr      { background:url(../pics/charte/flag-fr.jpg) top left no-repeat; }
.en      { background:url(../pics/charte/flag-en.jpg) top left no-repeat; }
.droite  { float:right; }
#texte .rouge   { color:#BC2C36!important; }
#texte .vert    { color:#9BC24B!important; }
#texte .bleu    { color:#5CA7C7!important; }
#texte .violet  { color:#8D679A!important; }
#texte .orange  { color:#E16E37!important; }
A.enGras:hover { font-weight: bold !important; }

/* tooltip */
A.tooltip { position: relative; text-decoration: none; cursor: help; outline: none; }
A.tooltip IMG { vertical-align: middle; }
A.tooltip SPAN.tooltip { display: none; }
SPAN.tooltip, DIV.content SPAN.tooltip * { vertical-align: baseline !important; }
A.tooltip:hover { background: none; z-index: 1000; }
A.tooltip:hover SPAN.tooltip { display:inline; position:absolute; top:0; left:50px; width:205px; padding:3px; font-size:10px; font-style:italic; border:1px solid #CCC; }