/*Pour tout le site*/
/*-------------------------------------*/
* {
 padding: 0;
 margin: 0;
}

body {
 font-family: Arial, Helvetica, sans-serif;
 color: #666666;
 font-size: 12px;
 line-height:20px;
}

a {
 color: #FF9933;
 text-decoration:none;
}

a:hover {
 color:#666666;
}

a.active, a.sphActive, a.reaActive{
 color: #666666;
}

a.active:before, a.sphActive:before, a.reaActive:before {
 content:" > "; color:red; 
}


ul {
 list-style-type:none;
}

img {
 border:none;
 display:block; /*pour l'alignement des vignettes*/
}

.hidden{
display:none;
}

/*Conteneur du site*/
/*-------------------------------------*/
#container {
 width: 900px;
 position:relative;
 background-color:#fff; 
 margin: 0 auto;
 text-align: left;
}

/*Entête du site*/
/*-------------------------------------*/
#header {
 height: 80px;
 background:url(../img/fondMenu.gif) #fff repeat-x;
}

.logo {
 float: left;
}

#menu_top {
 float:left;
 height: 25px;
 margin: 30px 0 0 175px;
}

#menu_top span {
 visibility:hidden;
}

#menu_top li {
 float:left;
}

#menu_top li a {
 display:block;
 height:25px;
}

.separateur {
 display:block;
 width:35px;
 height:25px; 
 background: url(../img/m-plus.gif) no-repeat;
}

.approche {
 width:56px;
 background: url(../img/m-approche.gif) no-repeat;
}

.approche:hover, .approche_active {
 width:56px;
 background: url(../img/m-approcheOn.gif) no-repeat;
}

.presentation {
 width:77px;
 background: url(../img/m-presentation.gif) no-repeat;
}

.presentation:hover, .presentation_active {
 width:77px;
 background: url(../img/m-presentationOn.gif) no-repeat;
}

.spheres {
 width:100px;
 background: url(../img/m-spheresAction.gif) no-repeat;
}

.spheres:hover, .spheres_active {
 width:100px;
 background: url(../img/m-spheresActionOn.gif) no-repeat;
}

.references {
 width:65px;
 background: url(../img/m-reference.gif) no-repeat;
}

.references:hover, .references_active {
 width:65px;
 background: url(../img/m-referenceOn.gif) no-repeat;
}

.metiers {
 width:46px;
 background: url(../img/m-metiers.gif) no-repeat;
}

.metiers:hover, .metiers_active {
 width:46px;
 background: url(../img/m-metiersOn.gif) no-repeat;
}

.equipe {
 width:41px;
 background: url(../img/m-equipe.gif) no-repeat;
}

.equipe:hover, .equipe_active {
 width:41px;
 background: url(../img/m-equipeOn.gif) no-repeat;
}

.contact {
 width:45px;
 background: url(../img/m-contact.gif) no-repeat;
}

.contact:hover, .contact_active {
 width:45px;
 background: url(../img/m-contactOn.gif) no-repeat;
}

/*Partie centrale*/
/*-------------------------------------*/
#content {
 width: 860px;
 margin-top: 40px;
}

#content p {
 margin-bottom: 10px;
}
 
h1 {
 display:block;
 float:right;
 clear:right;
 height:40px;
 margin-left:40px;
 text-align:right;
 font-size: 14px;
}

h1 span {
 visibility:hidden;
}

h1.width820 {
 width:820px;
}

h1.width620 {
 width:620px;
}

h1.width360 {
 width:360px;
}

h2 {
 font-weight:bold;
 color: #666666;
 font-size: 12px;
 margin:0;
}

h3{
font-weight: bold;
font-size:12px;
}

.titrePage {
 float:right;
}

/*Pied de page*/
/*-------------------------------------*/
#footer {
 width:860px;
 height: 40px;
 float:left;
 margin: 40px 40px 0 0;
 background-color:#FFFFFF;
 line-height: 40px;
 font-size: 11px;
}

#menu_bottom {
 float:right;
}

#menu_bottom li {
 float:left;
}

/* Page d'accueil */
/*-------------------------------------*/
#content_home_col1, #content_spheresIntro_col1, #content_ref_col1, #content_equipe_col1, #content_contact_col1, #content_credits_col1 {
 width:420px;
 height:445px;
 float:left;
}

.legende{
 float:right;
 margin-top: 5px;
 font-size:11px;
}

.legende span {
 color:#666666;
}

#content_home_col2, #content_spheresIntro_col2, #content_ref_col2, #content_equipe_col2, #content_contact_col2, #content_credits_col2  {
 width:400px;
 float:left;
 padding-left:40px;
 line-height: 20px;
}

#content_home_col2 {
 text-align:right;
}

#image_home{
 display:block;
 width:420px;
 height:420px;
 background-color:#666666;
}

#image_home img{
 width:420px;
 height:420px;
}

#vignettes_home{
 margin-top:30px;
 float:right;
}

#vignettes_home img{
 width: 60px;
 height: 45px;
}

#vignettes_home li {
 float:right;
 margin: 0 0 10px 10px;
 background-color:#666666;
}

#vignettes_home li img{
 background-color:#666666;
}
 
#vignettes_home li a {
 text-decoration:none;
}

 /* Page : approche/presentation */
/*-------------------------------------*/
#content_approche_col1 {
 float:left;
 background-color:#A7A9AC; 
 position:relative;
 left:40px; 
 width:135px; 
 color:white; 
 font-size:10px; 
 line-height:12px; 
 padding:20px; 
 margin-right:20px; 
 margin-top:20px;
 text-align: right;
}

.content_approche_coltxt {
 width:180px;
 margin-left:40px;
 float:left;
 text-align:right;
 overflow:visible;
}

#content_metiers_col1 {
 width:200px;
 float:left;
 padding-top:40px;
 text-align: right;
}

/* Page : spheres d'action - Intro */
/*-------------------------------------*/
#content_spheresIntro_col1 {
 background: url(../img/spheres/visuel.jpg) no-repeat;
 font-weight:bold;
}

#content_spheresIntro_col2 {
 text-align:right;
}

#menu_spheres_inter{
 line-height: 14px;
  font-weight:bold;
}

#menu_spheres_intro {
 width:140px;
 height:380px;
 margin-left:40px;
 padding:40px 0 0 20px;
 line-height: 14px;
}

#menu_spheres_intro li, #menu_spheres_inter li{
 margin-bottom: 15px;
}

#menu_spheres_intro a:hover {
 color:#FFFFFF;
}

#content_spheres_col1 {
 width:140px;
 padding-left: 40px; /* padding plutôt que margin pour IE6 */
 float:left;
}

#content_spheres_col2 {
 width:160px;
 margin-left: 20px;
 float:left;
}

#vignettes_spheres {
 float:right;
 height:320px;
}

#vignettes_spheres img {
 width:80px;
 height:60px;
}

#vignettes_spheres li {
 float:right;
 clear:both;
 padding-bottom:15px;
}

#vignettes_spheres li img{
 background-color:#666666;
}

.imgNonActive{
 border: 2px solid #FFFFFF;
}

.imgActive{
 border: 2px solid #FF9933;
}
 
#menu_clients{
 clear:both;
 text-align:right;
 line-height:14px;
 font-size: 11px;
}

#menu_clients li{
 margin-bottom: 10px;
}

#content_spheres_col3 {
 width:480px;
 float:left;
 margin-left:20px;
 font-size: 11px;
}

#content_spheres_col3 h2 {
 font-weight:bold;
 margin: 20px 0 0 0;
}

#content_spheres_col3 ul {
list-style:square;
margin-left:15px;
}

#content_spheres_col3 br {
line-height:5px;
}

#content_spheres_col3_image{
 display:block;
 width:480px;
 height:300px;
 background-color:#FFFFFF;
}

#image{
 width:480px;
 height:300px;
}

#loader{
 position:relative;
 top:142px;
 left:232px;
 width:16px;
 height:16px;
 background-color:#FFFFFF;
}

.ss_titre_rea{
 display:block;
 margin-top: 15px;
 font-weight:bold;
}

.lienPdf{
 font-style:italic;
}

 /* Page 'références'*/
/*-------------------------------------*/
.content_ref_coltxt1, .content_ref_coltxt2, .content_equipe_coltxt1, .content_equipe_coltxt2,  .content_contact_coltxt1, .content_contact_coltxt2,  .content_credits_coltxt1, .content_credits_coltxt2 {
 width:180px;
 float:left;
 text-align:right;
}

.content_ref_coltxt2, .content_equipe_coltxt2, .content_contact_coltxt2, .content_credits_coltxt2 {
 margin-left:40px;
}

#content_ref_col1 li{
 float:left;
 display:block;
 width:140px;
 height:105px;
}

#content_ref_col1 ul{
float:right;
}


#content_ref_col1 li img{
 width:140px;
 height:105px;
}

#content_ref_col2 li.categClient{
 font-weight: bold;
 margin-top:20px;
}

 /* Page 'equipe'*/
/*-------------------------------------*/
#content_equipe_col2{
 text-align:right;
}

.nom{
color:#666666;
font-size:12px;
font-weight:bold;
text-transform:lowercase;
}

 /* Page 'contact'*/
/*-------------------------------------*/
.ville{
color:#666666;
font-size:12px;
font-weight:bold;
text-transform:lowercase;
}

#content_contact_col2{
 text-align:left;
}

#content_contact_col2 p{
margin-bottom: 20px;
}

 /* Page 'crédits'*/
/*-------------------------------------*/
.titre{
color:#666666;
font-size:12px;
font-weight:bold;
text-transform:lowercase;
}

#content_credits_col2{
 text-align:left;
}

#content_credits_col2 p{
margin-bottom: 20px;
}

/* Page 'mentions légales'*/
/*-------------------------------------*/
#content_mentions_col1 {
 width:200px;
 float:left;
}

#content_mentions_col2 {
 width:620px;
 padding-left: 40px;
 float:left;
}

#content_mentions_col2 p {
text-align:justify;
font-size:11px;
}

/* référencement */
/*-------------------------------------*/
.referencement{ display:none; }
.specialink {color: red;}