@charset "utf-8";
/* CSS Document */
/*
bleu foncé 			273340
gris texte			333333
gris texte pale		666666
orange				E1833C
bleu				005D8C

*/
*
{
    margin: 0;
    padding: 0;
}

html, body, form
{
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: normal;
    color: #333333;
    border: 0;
    height: 100%;
    max-height: 100%;
	text-align: center;
	background-color: #273340;
}
form {background-color:inherit;}
a { text-decoration: none; outline-style:none; color:#E1833C;} /* enleve le pointillé rouge dans firefox */
a:hover { text-decoration: underline;}

img { border: none; margin:0; padding:0;}
h1, h2, h3
{
    font-size: 1em;
    margin: 0;
	padding:0;
	letter-spacing: 2px;
	color:#E1833C;
	letter-spacing:0em;
	font-weight:normal; 
}

h1 {  font-size:1.7em; margin-bottom:20px;}
h2 {  font-size:1.4em; margin-bottom:10px;}
h3 {  font-size:1.4em; color:#333333; margin:0px 0 20px 0;}

ul, ol {margin:0 0 0 50px; padding:0;  }
ul li, ol li{ padding:0; margin:0 0 10px 0; color: #666666; }
li { list-style-type: square;}


ul ul { margin:15px 0 15px 25px;}
/* Bon à savoir */
a.info:hover{z-index:25; background-color:#ff0}
a.info span{display: none}

/* pour centrer la div principale*/
#divcentrale {
	margin: 0 auto;
	width: 955px; /* largeur du contenu */
	background-color: #FFFFFF;
	border: 1px #ffffff solid; 
	position: relative;
}
	
#zoneimage { height: 335px;} /* height: 316px; */

#logo { position:absolute; top:25px; left:75px; display:none;}/* CACHÉ car mis dans l'image directement */
#bandenoire {height: 21px; background-image:url(../../images/bandenoire.png); background-repeat:repeat-x; display:none;} /* CACHÉ car mis dans l'image directement */

#bandemenu {height: 94px; }
	#bandemenu a { color: #231F20;} /* COULEUR DU TEXTE DU MENU */
	#bandemenu span { margin-right:40px;}
#contenu { margin:0; padding:0; border: none; background-color: white;} 
	#colonnegauche { width: 645px; float: left; margin:0; padding:0; border: none; vertical-align:text-top; text-align:left; }
		#colonnegauche p, #colonnegauche img  { margin:10px;}
		#colonnegauche h1 ,#colonnegauche h2, #colonnegauche  h3 { margin-left:10px;}
		
	#colonnedroite { width: 305px; float: right; margin:0; padding:0; border: none; text-align:left;}
		#colonnedroite p { margin:0 30px 0 30px;}
		#colonnedroite h1, #colonnedroite h2, #colonnedroite h3, #colonnedroite h4, #colonnedroite h5, #colonnedroite h6 { margin:30px;}
		#colonnedroite img { margin:20px;} /* met des MARGES aux images dans la colonne de droite */
		.titrenouvelle { color:#333333; font-size:1.2em;padding-bottom:8px;} /* titre de chacune des nouvelles */
		.paragraphedenouvelle { line-height:1.5em; padding-bottom:10px;} /* paragraphe de nouvelle */
		
		/* pour les social icons, ci-bas */
		#colonnedroite p img { margin:0 2px 0 0;} /* défini MARGE pour les images dans un PARAGRAPHE dans la colonne de droite  SOCIAL ICONS */

		/*BOITE  */
		.boiteshadow { background-image:url(../../images/boite1.png); background-position: top left; background-repeat:no-repeat; margin-bottom: 10px;}
		
		.boitemono { background-image:url(../../images/bouton_monopoly.png); background-position: top left; background-repeat:no-repeat; margin-bottom: 10px;}
		
		.boiteshadowgris { background-image:url(../../images/boite3.png); background-position: top left; background-repeat:no-repeat; margin-bottom: 10px;}
		.boiteshadowgrisgrande { background-image:url(../../images/boite2.png); background-position: top left; background-repeat:no-repeat;}

		#boitelogo { height:136px;}/* 136 */
		#boitenouvelle {}
		#boitemono{height:222px;}
		#boiteanalysegratuite { height:116px;}
		#referercesite {height:116px;}
		#partager {height:116px;}
		#boitemicrosite {height:116px;}
		
#footer { clear:both; color:#333333; font-size:.8em; font-family: Geneva, Verdana, Arial, Helvetica, sans-serif;}
	#footer span { margin:0 10px 0 10px;}
	#footer p {margin: 0 0 6px 0;}
	#copyright {}
	#footer a { color:#333333;}

/* rollover */
.rollOver
{
    display: block;
    background-repeat: no-repeat;
    background-position: 0 0;
    float: left;
}
.rollOver:hover
{
    background-position: bottom right;
}
.rollOver span
{
    display: none;
}
.icone 
{
    width: 354px;
    height: 34px;
}

.clear { clear:both;}

/* couleur et formatage du texte */
.orange { color:#E1833C;}
.grispale { color:#666666;}
.grisfonce {color:#333333;}
.bleufoncé {color:#273340;}
.bleu {color:#005D8C;}
.grostexte {font-size:1.4em; }
.tresgrostexte {font-size: 1.6em;}

.italique { font-style:italic;}

/*.paragrapheduhaut {  letter-spacing: .11em; color:#666666; line-height: 1.3em; font-size:1.4em; font-family:"Times New Roman", Times, serif; }*/
.paragrapheduhaut { letter-spacing: .11em; color:#333333; line-height: 1.4em; line-height:1.5em;} /* line-height comme nouvelle */
.paragraphesystemgestion { letter-spacing: .11em; color:#333333; line-height: 1.4em; line-height:1.5em; margin-left:10px;} /* line-height comme nouvelle */
.temoignage { letter-spacing: .11em; color:#666666; line-height: 1.7em; font-style:italic;}


/* pour la page d'accueil seulement */
#zoneavecdegrades { clear:both; background-image:url(../../images/degradegris.gif); background-position:top left; background-repeat: repeat-x; height:500px;}
#zoneavecdegrades p { font-family:"Times New Roman", Times, serif; letter-spacing: .2em; color:#333333;}

/* pour les pages de contenu*/
#zoneavecdegradesInterne { padding: 40px 40px 10px 40px; text-align:left; clear: both; background-image:url(../../images/degradegris.gif); background-position:top left; background-repeat: repeat-x;}
#zoneavecdegradesPortfolio { clear: both; background-image:url(../../images/degradegris.gif); background-position:top left; background-repeat: repeat-x; height:650px;}

.hrorange { width:100%; color:#E1833C; margin:40px 10px 40px 10px; border:1px solid #E1833C;}
.hrbleu { color:#B7C6DC; margin:20px 30px 30px 30px; height:1px; padding:0; border:1px solid #B7C6DC;} /* hrbleu, sert sur l'accueil pour les nouvelles et dans les pages nouvelles*/


/* VOTRE PROJET */
ol.listevotreprojet li {position:relative; margin:0px; width:660px; height:153px; margin-bottom:50px; margin-left:-20px; list-style-image:none; list-style-type:none; background-image: url(../../images/boitegrise.png); background-repeat:no-repeat; clear:both; }

#etapes h1 { font-size:40px;}
#etapes h2 { font-size:20px; padding-top:15px; position:relative;}
#etapes h2 span { font-size:.8em;}
.numerovotreprojet { position:absolute; top:36px; left:-42px;}
.txtetapes {margin:20px 20px 20px 60px;}
    /* boite a b et c pour définir les différentes marges de gauche */
    .a { }
    .b { margin-left:80px !important;} 
    .c { margin-left: 160px  !important;}




/* NOTRE APPROCHE */
.zonegrisedroite {float:right; width:300px; margin: 0 0 0 40px; padding:50px; border: 3px solid  #E0E0E0; background-color: #EFEFEF;}
.grossefontegrise {font-size:250%; font-family:Georgia, "Times New Roman", Times, serif;}

#listepriorite {font-size:12px;  margin-left:0px;  width:80%}
#listepriorite li {  list-style-type:none;  font-size: 1em; line-height:2em; color: #555; margin-bottom:1.5em; }

/* INDEX */
.zonegrisedroiteindex { float: left; text-align: right; width:160px; margin: 0px; padding:10px; font-size:12px; margin-bottom:30px; } /*   border: 3px solid  #E0E0E0; background-color: #EFEFEF;  */
.grossefontegriseindex {font-size:250%; font-family:Georgia, "Times New Roman", Times, serif;}

.zonegrisedroiteindex li { list-style-type:none;  font-size: 11px; color: #555; list-style-image:none; }

.divservices {margin-left:200px; border-left: 1px solid #E1833C;}

/* PROFIL */
#sousmenucorpo {position:absolute; z-index:5; top:415px; left:25px;}
#sousmenucorpo a{ float:left; padding:10px; background-color:#fff; border:1px solid #ccc; border-right: 1px solid #999; border-bottom:1px solid #999;  margin: 0 10px 0 10px;}
#sousmenucorpo a:hover{ background-color:#eee; border:1px solid #E1833C; margin: 0 10px 0 10px; text-decoration:none;}

#listepourquoiproweb { width:380px; margin-left:420px; padding-top:90px;  color: White; text-align: left;}
#listepourquoiproweb li { color:White; list-style-type: circle;}

/*  PLAN DU SITE */
#plandusite li { list-style-image:url(../../images/liste.gif);}

/* NOUVELLES */
.imagenouvelle {float:left; margin-right: 10px; padding:4px; border:1px solid #999999;}
ol.listenouvelle li {position:relative; margin:0px;  margin-bottom:50px; margin-left:-20px; list-style-image:none; list-style-type:none; clear:both; }


/* PORTFOLIO */

 .miniimgportfolio { width:50px; padding:5px; height:25px; border:1px solid black; margin:0 5px 0 5px;}
 .portfoliobests { width:250px; height:177px; float:left; border:6px solid #ddd; margin:35px 0 0 35px;}
 #plusdedetails { font-size:11px; font-family: Verdana, Arial, Helvetica, sans-serif;  background-image: url(../../images/plusdedetails.gif); width:133px; height:16px;}
 #plusdedetails:hover { text-decoration:none;}
 #fiche p { margin-bottom:2em; line-height:1.8em;}

 
 /*#grispale a{ height:226px; width:273px; padding:10px;}
 #grispale a:hover{background-image:url(../../images/portfolio/background_menuclients.jpg); background-repeat:no-repeat; color:#FFF; height:26px; width:273px; }*/
 
.rolloverclient{margin:0; padding:0; padding-left:15px;}
.rolloverclient:hover{margin:0; padding:0; background-image:url(../../images/portfolio/background_menuclients.jpg); background-repeat:no-repeat; color:#FFF; width:273px; margin-left:-15px; padding-left:30px;}

a#ensavoirplus{margin:0; padding:0; height:53px; width:167px; margin-top:-10px; margin-right:60px; float:right; background-image:url(../../images/bouton_ensavoirplus.png); background-repeat:no-repeat; }
	a#ensavoirplus:hover{background-image:url(../../images/bouton_ensavoirplus_hover.png); background-repeat:no-repeat; text-decoration:none;}

a#autresreals {display:block;height:89px; width:232px;background-image:url(../../images/voirautrerealisations_off.png); background-repeat:no-repeat; margin-top:40px; margin-right:80px; float:right;}
	a#autresreals:hover{ background-image:url(../../images/voirautrerealisations_on.png); background-repeat:no-repeat; text-decoration:none;} 
 
 #bests div {overflow:hidden;cursor:pointer;}
 #bests div p, #bests div a{ color:#fff;}
 #bests div p { margin-top:20px;}
 
 .linkbests {display:none;}
 .imgtop {position:absolute; top:0px; left:0px; z-index:3; } /* mettre display:none; pour voir l'image du top quand on programme */
#img1 { background-image:url(../../images/bests/1.jpg); position:relative; }
#img2 { background-image:url(../../images/bests/2.jpg); position:relative; }
#img3 { background-image:url(../../images/bests/3.jpg); position:relative; }
#img4 { background-image:url(../../images/bests/4.jpg); position:relative; }
#img5 { background-image:url(../../images/bests/5.jpg); position:relative; }
#img6 { background-image:url(../../images/bests/6.jpg); position:relative; }
#img7 { background-image:url(../../images/bests/7.jpg); position:relative; }
#img8 { background-image:url(../../images/bests/8.jpg); position:relative; }
#img9 { background-image:url(../../images/bests/9.jpg); position:relative; }
    
/* sous-menu */
#lava1 li ul {margin:0;padding:0;}
#lava1 li ul li {margin:0;padding:0;}
#lava1 li ul li a {text-transform: none;letter-spacing:normal;overflow:auto;margin:0;top:0;left:0;}
#lava1 li div.sub {width:184px;background:url(../../images/smenu-top.gif) no-repeat left top;padding-top:13px}
#lava1 li div.innersub {width:184px;background:#fff url(../../images/smenu-bottom.gif) no-repeat left bottom;padding-bottom:13px;}
#lava1 li ul {width:152px;display:block;padding:0 16px;background:url(../../images/smenu-stretch.gif) repeat-y;}
#lava1 li ul li {padding:2px 0;margin:0;border-top:1px solid #DF813C;}
#lava1 li ul li.first {border-top:none;}
#lava1 li ul li, #lava1 li ul li a {float:none;display:block;height:20px;color:#DF813C;font:12px/20px arial;text-align:left;}
#lava1 li ul li a {text-decoration:none;padding:0 5px;}
#lava1 li ul li a:hover {background:#DF813C;color:#fff;}
    
/* menu superfish */
.sf-menu, .sf-menu * {margin:0;padding:0;list-style:none;}
.sf-menu {line-height:1.0;z-index:9999;}
.sf-menu div.sub {position:absolute;top:-999em;width:10em;}
.sf-menu ul li {width:100%;z-index:9999;}
.sf-menu li:hover {visibility:inherit;}
.sf-menu li {float:left;position:relative;}
.sf-menu a {display:block;position:relative;}
.sf-menu li:hover div.sub,.sf-menu li.sfHover div.sub {left:0;top:30px;}
ul.sf-menu li:hover li ul,ul.sf-menu li.sfHover li ul {top:-999em;}
ul.sf-menu li li:hover ul,ul.sf-menu li li.sfHover ul {left:10em;top:0;}
ul.sf-menu li li:hover li ul,ul.sf-menu li li.sfHover li ul {top:-999em;}
ul.sf-menu li li li:hover ul,ul.sf-menu li li li.sfHover ul {left:10em;top: 0;}
.sf-menu li:hover a, .sf-menu li.sfHover a,.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {background-position: bottom;}
    
/* CLEARFIX */ 
.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%;
}