/* ****************************************************

	@file		  styles.css
	@description  Feuille de styles globale
	@version	  2016-01-01

***************************************************** */

html { height: 100%; }

body
{
	margin: 0;
	padding: 0;

	 font: 1em 'trebuchet MS', 'lucida sans';
	background: url(/images/bkg-body.png) repeat-x;
	margin-bottom: 0;
	color: #666;
	line-height: 25px;
} 

a { color: #675a52; text-decoration: underline; } 
a:hover { text-decoration: none; } 

img { border: none; } 
ul.puce { padding: 0 0 0 15px; margin: 5px 0 0 0; }

ul { list-style-type: square; }
li { padding-top: 5px; }
.sous-titre { font-size: 20px; color: #7b6f68; font-family: 'Roboto', sans-serif; }

h1 { font-size: 34px; font-weight: 400; color: #f7673d; margin: 0 0 30px 0; padding : 0; font-family: 'Roboto', sans-serif; }
h2 { font-size: 26px; font-weight: normal; color: #7b6f68; margin: 0;  padding : 0; font-family: 'Roboto', sans-serif; }
h3 { font-size: 26px; font-weight: normal; color: #7b6f68; margin: 0;  padding : 0; font-family: 'Roboto', sans-serif; }
h4 { font-size: 26px; font-weight: normal; color: #7b6f68; margin: 0;  padding : 0; font-family: 'Roboto', sans-serif; }


.soustitre-petit { font-size: 14px; font-weight: normal; color: #7b6f68; margin: 10px 0 0 0; padding : 0; font-family: 'Roboto', sans-serif; }
.message { font-size: 22px; font-weight: bold; color: #7b6f68; margin: 0; padding : 0; font-family: 'Roboto', sans-serif; }
.petit { font-size: 90%; }
.grand { font-size: 110%; }
.orange { font-weight: bold; color: #f7673d;  }
.titre-brun {  font-size: 26px; font-weight: 500; color: #7b6f68; margin: 30px 0 0 0; padding : 0; font-family: 'Roboto', sans-serif; line-height:1.3em; }
.titre-brun-petit {  font-size: 23px; font-weight: 400; color: #7b6f68; margin: 20px 0 10px 0; padding : 0; font-family: 'Roboto', sans-serif; line-height:1.3em; }

.clearer { clear:both; visibility:hidden; } 
.marge10 { margin: 10px; }
.espacement { margin-top: 40px; }

#contenu .titre { position: relative; float: left; font-size: 26px; font-weight: normal; color: #7b6f68; margin: 30px 0;  padding : 0; font-family: 'Ovo', serif; }


#contentarea { 
position: relative;
width: 1013px; 
height: auto; 
margin: 0 auto; 
padding: 0;
background-color: inherit;
}
/*
 * @section Entête
******************************************************************************************************/

/**********  Top Header  ****** ****** ******  */
.top-header {
position: relative;
width: 1013;
height:40px;
color:#fff;
}
.top-header-left {
float:left;
height:40px;
}
.top-header-left .quick-contacts {
padding: 5px 0;
line-height: 30px;
letter-spacing: 1px;
font-family: 'Roboto', sans-serif;
font-weight:300;
font-size:12px;
}
.top-header-left .quick-contacts span {
padding: 0 15px 0 0;
line-height: 30px;
letter-spacing: 1px;
}
.top-header-left .quick-contacts span a { color: #fff; text-decoration: none; }
.top-header-left .quick-contacts span a:hover { text-decoration: underline; }

/* côté droit du top header */
.acces-client {
float: right;
height: 17px;
padding : 5px 25px 0 3px;
margin : 0;
text-align: center;
text-transform: uppercase;
line-height: 30px;
letter-spacing: 1px;
font-family: 'Roboto', sans-serif;
font-weight:300;
font-size:12px;
}
.acces-client a { color: #fff; text-decoration: none; }
.acces-client { margin-top:10px; }
.acces-client a:hover { text-decoration: underline; }


/**********  Haut de page  ****** ****** ******  */
#haut-page { position: relative; float:left; width: 1013px; height: 70px; background-color: inherit; padding : 0; margin : 0; } 

/* côté gauche du haut de page */
#haut-page .logo {
float: left;
width: 150px;
height: 40px;
padding : 0;
margin : 15px 0 0 45px;
}


/**********  Navigation  utilitaire : Accueil, À propos de UDATA, English  */
#haut-page .menu-utilitaire { float: right; width: auto; height: 40px; padding : 0; margin : 0; text-align: right; }
#haut-page .menu-utilitaire ul { float: right; display: inline; z-index: 1000; text-align: right; padding-top:8px;}
#haut-page .menu-utilitaire li {
float: left;
list-style: none;
margin: 0;
padding: 0 15px;
color: #7b6f68;
text-decoration: none;
text-transform: uppercase;	
line-height: 30px;
letter-spacing: 1px;
font-family: 'Roboto', sans-serif;
font-weight:400;
}
#haut-page .menu-utilitaire li.last { padding-right: 0; }
#haut-page .menu-utilitaire li a { color: #7b6f68; text-decoration: none; font-size:13px;}
#haut-page .menu-utilitaire li a:hover { text-decoration: underline; }
#haut-page .menu-utilitaire li.over { color: #cc9933; }
#haut-page .menu-utilitaire li a.demo { color: #ff6600; }

/**********  FIN Entete  ****** ****** ******  */

#under-construction { position: relative; float: left; width: 1013px; height: 457px;  padding: 0; margin : 31px 0 0 0; background: url(/images/under-construction.jpg) no-repeat; }
.content-construction { padding : 60px 469px 20px 94px; margin : 0; font: 18px Arial, Verdana, Helvetica, sans-serif; color: #7b6e66; }


/**********  Zone Slideshow  ****** ****** ******  */
#zonephotos { position: relative; width: 1013px; height: 385px; background-color: inherit; padding : 0; margin : 0; } 

/* hack ie6 page d'accueil */
.hackie-accueil { margin-top : 0; } 

#left-zonephotos { float: left; width: 41px; height: 385px; background: url(../images/slideshow-left.png) no-repeat; padding : 0; margin : 0; } 
#photo-zonephotos { float: left; width: 972px; height: 385px; background-color: inherit; padding : 0; margin : 0; } 
#photo-zonephotos .texte-zonephotos { 
position: absolute; 
width: 700px; 
height: auto; 
top: 32px;
right: 50px;
background-color: inherit; 
padding : 0; 
margin : 0; 
text-align: right; 
} 
#photo-zonephotos .texte-zonephotos-apercu { 
position: absolute; 
width: 700px; 
height: auto; 
top: 238px;
right: 50px;
background-color: inherit; 
padding : 0; 
margin : 0; 
text-align: right; 
} 
#photo-zonephotos .texte-zonephotos-services { 
position: absolute; 
width: 700px; 
height: auto; 
top: 22px;
right: 50px;
background-color: inherit; 
padding : 0; 
margin : 0; 
text-align: right; 
} 
#zonephotos .lezard-batiment { 
position: absolute; 
width: 63px; 
height: 38px; 
top: 14px;
right: 54px;
background: url(../images/petit-lezard.png) no-repeat;
padding : 0; 
margin : 0; 
} 
#zonephotos .lezard-jeux { 
position: absolute; 
width: 63px; 
height: 38px; 
top: 14px;
right: 27px;
background: url(../images/petit-lezard.png) no-repeat;
padding : 0; 
margin : 0; 
} 
#photo-zonephotos .titre { font-size: 60px;  font-weight: bold; color: #fff; font-family: 'Play', sans-serif; font-family: 'Arial, Verdana, Helvetica, sans-serif'/9; line-height: 0.9em; opacity:1.0; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(opacity=99)";
    font-family: Arial, Verdana, Helvetica, sans-serif, /9;
} 
#photo-zonephotos h1 { font-size: 12px; font-weight: bold; color: #fff; font-family: Arial, Verdana, Helvetica, sans-serif; } 
#photo-zonephotos .titre .services { color: #7b6f68; } 
#photo-zonephotos h1 .services { color: #7b6f68; } 


/**********  FIN Slideshow  ****** ****** ******  */


/*
 * @section Contenu principal
******************************************************************************************************/

/********** Page du contenu */
#contenu {
position: relative;
float: left;
width: 1013px;
height: auto;
background-color: inherit;
padding : 0;
margin : 0;
} 
.mise-en-page { padding : 20px 10px 20px 41px; margin : 0;  }
.mise-en-page-accueil { padding : 10px 10px 20px 41px; margin : 0; }

.mise-en-page-sec { padding : 20px 0 20px 13px; margin : 0; }


/*
 * @section Page d'Accueil nommant les 5 Categories (boutons)
******************************************************************************************************/
.accueil-colonnes { position:relative; height: 60px; /height: 86px; padding: 0; margin:0; }

.sous-titre { font-size: 20px; color: #7b6f68; font-family: 'Roboto', sans-serif; }
.accueil-titre { font-size: 26px; color: #7b6f68; font-family: 'Roboto', sans-serif; font-weight:bold; }
.bande-grise-accueil { float: left; width: 18px; height: 75px; background-color: #dde2db; padding : 0; margin : 0; border-top: 1px solid #dde2db; } 

.accueil-colonne-1 { float: left; width: 268px; height: 60px; /height: 86px; padding : 15px 0 0 10px; margin : 0 24px 0 0; text-align: left; background-color: #f2f4f2; border-top: 1px solid #dde2db; text-align:left;} 
.accueil-colonne-1 .titre-udata { font-size: 18px; font-weight: bold; color: #7b6f68; margin: 0; padding : 0; font-family: 'Play', sans-serif; text-transform:uppercase;}
.accueil-colonne-1 .en-savoir-plus-col1 { display:none; }
a:hover div.accueil-colonne-1 .en-savoir-plus-col1 { position:absolute; top:0px; left:18px; width: 268px; height: 60px; /height: 86px;  padding : 15px 0 0 10px; background-color: #a6a497; color:#fff; border-top: 1px solid #dde2db; display: block; }
a:hover div.accueil-colonne-1 .en-savoir-plus-col1 .titre-udata { color:#fff; font-size:18px; }

.accueil-colonne-2 { float: left; width: 268px; height: 60px; /height: 86px; padding : 15px 0 0 10px; margin : 0 24px 0 0; text-align: left; background-color: #f2f4f2; border-top: 1px solid #dde2db;} 
.accueil-colonne-2 .titre-udata { font-size: 18px; font-weight: bold; color: #7b6f68; margin: 0; padding : 0; font-family: 'Play', sans-serif; text-transform:uppercase; }
.accueil-colonne-2 .en-savoir-plus-col2 { display:none; }
a:hover div.accueil-colonne-2 .en-savoir-plus-col2 { position:absolute; top:0px; left:338px; width: 268px; height: 60px; /height: 86px;  padding : 15px 0 0 10px; background-color: #a6a497; color:#fff; border-top: 1px solid #dde2db; display: block; }
a:hover div.accueil-colonne-2 .en-savoir-plus-col2 .titre-udata { color:#fff; font-size:18px; }

.accueil-colonne-3 { float: left; width: 268px; height: 60px; /height: 86px; padding : 15px 0 0 10px; margin: 0; text-align: left; background-color: #f2f4f2; border-top: 1px solid #dde2db;}.accueil-colonne3 .last { margin-right:0; } 
.accueil-colonne-3 .titre-udata { font-size: 18px; font-weight: bold; color: #7b6f68; margin: 0; padding : 0; font-family: 'Play', sans-serif; text-transform:uppercase; }
.accueil-colonne-3 .en-savoir-plus-col3 { display:none; }
a:hover div.accueil-colonne-3 .en-savoir-plus-col3 { position:absolute; top:0px; left:658px; width: 268px; height: 60px; /height: 86px;  padding : 15px 0 0 10px; background-color: #a6a497; color:#fff; border-top: 1px solid #dde2db; display: block; }
a:hover div.accueil-colonne-3 .en-savoir-plus-col3 .titre-udata { color:#fff; font-size:18px; }


/*
 * @section Accueil de chacune des 5 Categories
******************************************************************************************************/
.accueil-colonne-categorie { float: left; width: 275px; height: auto; /height: 240px; padding: 0 10px; margin: 0; text-align: justify; }
.accueil-colonne-categorie .last { margin-right:0; }  
.accueil-colonne-categorie .titre-udata { position:relative; font-size: 18px; font-weight: bold; color: #7b6f68; margin-top:15px; padding: 0; font-family: 'Play', sans-serif; text-transform:uppercase; }
.accueil-colonne-categorie .titre-udata a { color: #7b6f68; text-decoration: none; }
.accueil-colonne-categorie .titre-udata a:hover {  text-decoration: underline; }
.accueil-colonne-categorie .soustitre-accueil { position:relative; font-size: 16px; font-weight: normal; color: #7b6f68; font-family: 'Play', sans-serif; text-transform:uppercase; margin:5px 0 15px 0; text-align:left;}
.bande-grise-accueil-categorie { float: left; width: 18px; height: 90px; background-color: #dde2db; padding : 0; margin : 10px 0 0 0; } 
.accueil-colonne-bouton-categorie  { float: left; width: 275px; height: auto; padding : 0 10px; margin : -10px 0 0 0; text-align: left; } 
.bande-vide-categorie  { float: left; width: 18px; height: 78px; padding : 0; margin : 0; }

.accueil-colonne-categorie-large { float: left; width: 920px; height: auto; /height: 240px; padding: 0; margin: 0 0 0 20px; text-align: justify; }
.accueil-colonne-categorie-large .titre-udata { position:relative; font-size: 22px; font-weight: bold; color: #7b6f68; margin-top:15px; padding: 0; font-family: 'Play', sans-serif; text-transform:uppercase; }
.accueil-colonne-categorie-large .titre-udata a { color: #7b6f68; text-decoration: none; }
.accueil-colonne-categorie-large .titre-udata a:hover {  text-decoration: underline; }

/*
 * @section Contenu
******************************************************************************************************/

/********** Changement onglets - Reference au script change_onglet */
.onglet {
                display:inline-block;
                margin: 0 0 18px 30px;
                border:0;
                cursor:pointer;
                font-size:14px;
                padding: 5px 15px;
                color: #fc6621; 
                font-weight:400;
                
}
.onglet_0 {
                background-color:none;
                color: #fff;
                width:90px;
                height:30px;
                color: #fc6621;
                text-align:center;
                -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px;
                padding: 60px 0 0 0;
                margin-right:0px;
}
.onglet_0:hover {
                background-color: #f2f4f2;
                color: #fc6621;
}
.onglet_1 {
                background-color:#e0e2dd;
                width:90px;
                height:30px;
                 text-align:center;
                -moz-border-radius:6px; -webkit-border-radius:6px; border-radius:6px;
                padding: 60px 0 0 0;
                margin-right:0px;
}
.contenu_onglet {
                background-color:#e9ebe8;
                border:0;
                margin-top:-1px;
                padding: 60px 35px 25px 35px;
                display:none;
                border-radius: 10px;

 }
.onglet-actif-solution { background: url(/images/onglet-actif.png) no-repeat; background-color:none; margin-top:-69px; padding-bottom:60px; margin-left:29px;}
.onglet-actif-benefices { background: url(/images/onglet-actif.png) no-repeat; background-color:none; margin-top:-69px; padding-bottom:60px; margin-left:153px;}
.onglet-actif-fonctions { background: url(/images/onglet-actif.png) no-repeat; background-color:none; margin-top:-69px; padding-bottom:60px; margin-left:277px;}
.onglet-actif-integration { background: url(/images/onglet-actif.png) no-repeat; background-color:none; margin-top:-69px; padding-bottom:60px; margin-left:400px;}
.onglet-actif-store { background: url(/images/onglet-actif.png) no-repeat; background-color:none; margin-top:-69px; padding-bottom:60px; margin-left:527px;}

.contenu_onglet h1 { font-size:30px; font-weight:500; color: #fc6621; font-family: 'Roboto', sans-serif; }


span.onglet_0#onglet_solution  {
	background: url(/images/solution.png) no-repeat; background-color:none;
}
span.onglet_1#onglet_solution  {
	background: url(/images/solution.png) no-repeat; background-color:#e9ebe8;
}
span.onglet_0#onglet_benefices  {
	background: url(/images/benefices.png) no-repeat; background-color:none;
}
span.onglet_1#onglet_benefices  {
	background: url(/images/benefices.png) no-repeat; background-color:#e9ebe8;
}
span.onglet_0#onglet_fonctions  {
	background: url(/images/fonctions.png) no-repeat; background-color:none;
}
span.onglet_1#onglet_fonctions  {
	background: url(/images/fonctions.png) no-repeat; background-color:#e9ebe8;
}
span.onglet_0#onglet_integration  {
	background: url(/images/integration.png) no-repeat; background-color:none;
}
span.onglet_1#onglet_integration  {
	background: url(/images/integration.png) no-repeat; background-color:#e9ebe8;
}
span.onglet_0#onglet_store  {
	background: url(/images/store-udata.png) no-repeat; background-color:none;
}
span.onglet_1#onglet_store  {
	background: url(/images/store-udata.png) no-repeat; background-color:#e9ebe8;
}

/*** Fin onglets */

.colonne { float: left; width: 250px;  padding : 0 10px; margin: 0 25px 0 0; text-align: left;border-left:18px solid #ced0cb; } 
.colonne .titre-benefice { font-size: 20px; font-weight: normal; color: #7b6f68; margin: 0; padding : 0; font-family: 'Roboto', sans-serif; }
.bande-grise { float: left; width: 18px; height: 78px; background-color: #ced0cb; padding : 0; margin : 10px 0 0 0; } 
.colonne-noborder { float: left; width: 250px;  padding : 0 10px; margin: 0 20px 0 0; text-align: left; } 
.colonne-noborder .titre-noborder { font-size: 24px; font-weight: 300; color: #7b6f68; margin: 0; padding : 0; font-family: 'Roboto', sans-serif; }
.colonne ul { margin-top:0; }


/*** Onglet Solution integree */
.solution-integree {
	padding-left:20px; 
	width:660px; 
	text-align: justify;
	float:left; 
	margin-right:40px;
	margin-bottom:40px;
}
.solution-integree-web-mobile {
	float:left;
	color: #f7673d;
	font-size: 22px;
	font-family: 'Roboto', sans-serif;
	border-left:1px solid #f7673d; 
	line-height:1.5em;
	margin-top:50px;
	width:190px;
	text-align:justify;
	padding-left:10px;
}
.solution-integree-interventions {
	float:left;
	color: #f7673d;
	font-size: 18px;
	font-family: 'Roboto', sans-serif;
	border-left:1px solid #f7673d; 
	line-height:1.5em;
	margin-top:100px;
	width:190px;
	text-align:left;
	padding-left:10px;
}
.solution-integree-audits {
	float:left;
	color: #f7673d;
	font-size: 18px;
	font-family: 'Roboto', sans-serif;
	border-left:1px solid #f7673d; 
	line-height:1.5em;
	margin-top:30px;
	width:190px;
	text-align:left;
	padding-left:10px;
}
.solution-integree-gestion-actifs {
	float:left;
	color: #f7673d;
	font-size: 20px;
	font-family: 'Roboto', sans-serif;
	border-left:1px solid #f7673d; 
	line-height:1.5em;
	margin-top:30px;
	width:190px;
	text-align:left;
	padding-left:10px;
}
.solution-integree-inspection-batiments {
	float:left;
	color: #f7673d;
	font-size: 18px;
	font-family: 'Roboto', sans-serif;
	border-left:1px solid #f7673d;
	line-height:1.5em;
	margin-top:100px;
	width:190px;
	text-align:left;
	padding-left:10px;
}
.solution-integree-margin {
	float:left;
	color: #f7673d;
	font-size: 18px;
	font-family: 'Roboto', sans-serif;
	border-left:1px solid #f7673d; 
	line-height:1.5em;
	margin-top:0px;
	width:190px;
	text-align:left;
	padding-left:10px;
}

/*** Page Contact */
	.contact-left { float: left; width: 40%; height: auto; padding : 0; margin : 20px 40px 60px 40px; } 
	.contact-right { float: left; width: 50%; height: auto; padding : 0; margin : 20px 0 60px 0; }
	
	
/********** < FIN Page du contenu */

/*
 * @section Pied de page
******************************************************************************************************/
#footer {
position: relative;
float: left;
width: 1013px; 
height: 165px; 
margin : 0px 0 0 7px;
padding: 0;
background: url(../images/bkg-footer.gif) no-repeat;
text-align: right;
}
#footer .right { margin : 40px 29px 0 0; padding: 0; }
#footer .right h4 { font-size: 22px; font-weight: normal; color: #7b6f68; margin: 0; padding : 0; font-family: 'Ovo', serif; }

#copyright {
position: relative;
float: left;
width: 973px; 
height: auto; 
margin : 0;
padding: 0 0 20px 30px;
background-color: inherit;
color: #a1a1a1;
font-size: 11px;
}
#copyright a { color: #a1a1a1; text-decoration: underline; }
#copyright a:hover { text-decoration: none; }
#copyright .right { position: absolute; top: 0; right: 0; margin : 0; padding: 0; }

/********** Autres ****** ****** > */

body.popup {
background: url(/images/bkg-body-popup.gif) repeat-x;
background-color:#fff;
padding:20px;
}
.popup h1 { font-size: 24px; font-weight: 300; color: #7b6f68; margin: 0; padding : 0; font-family: 'Roboto', sans-serif; }
.popup h2 { font-size: 24px; font-weight: 500; color: #7b6f68; margin: 0; padding : 0; font-family: 'Roboto', sans-serif; }
.popup h3 { font-size: 18px; font-weight: 400; color: #fc6621; margin: 20px 0 0 0; padding : 0; font-family: 'Roboto', sans-serif; }

fieldset
{
	display: block;
	margin-left: 2px;
	margin-right: 2px;
	margin-bottom: 20px;
	padding-top: 15px;
	padding-bottom: 0.625em;
	padding-left: 0.75em;
	padding-right: 0.75em;
	border: 1px #ccc solid;
	background-color: rgba(255, 255, 255, 0.4);
	border-radius: 10px; 
	
}

.fieldset-exterieur
{
	display: block;
	margin-left: 2px;
	margin-right: 2px;
	margin-bottom: 20px;
	padding-top: 15px;
	padding-bottom: 0.625em;
	padding-left: 0.75em;
	padding-right: 0.75em;
	border: 1px #ccc solid;
	background-color: rgba(255, 255, 255, 0.4);
	border-radius: 10px; 
	
}

legend { font-size: 14px; font-weight: 300; color: #fff; margin: 10px;  padding : 5px; font-family: 'Roboto', sans-serif; background-color: #f96634;border-radius: 5px;  }
legend.interne { font-size: 14px; font-weight: 300; color: #fff; margin: 10px;  padding : 3px; font-family: 'Roboto', sans-serif; background-color: #7e746d;border-radius: 5px;  }

legend span {font-size: 12px;font-weight: normal;font-family: 'Roboto', sans-serif; }


div.legend
{
	height: 145px;
	background-image: url(/images/fleche-double.gif);
	background-repeat: no-repeat;
	background-position: center center;
	border:1px solid #e9ebe8;
}

div.legend legend
{
	margin-left: 320px;
	margin-top:60px;
}

fieldset.interne
{
	float:left;
	margin-left: 2px;
	margin-right: 2px;
	margin-bottom: 20px;
	padding-top: 0.35em;
	padding-bottom: 0.625em;
	padding-left: 0.75em;
	padding-right: 0.75em;
	border: 1px #ccc solid;
	background-color: rgba(255, 255, 255, 0.4);
	border-radius: 10px; 
	width:200px;
}



fieldset.col3
{
	float:left;
	margin-left: 5px;
	margin-right: 5px;
	margin-bottom: 20px;
	padding-top: 0.35em;
	padding-bottom: 0.625em;
	padding-left: 10px;
	padding-right: 5px;
	border: 1px #ccc solid;
	background-color: rgba(255, 255, 255, 0.4);
	border-radius: 10px; 
	width:30%;
}


fieldset.col3-pale
{
	float:left;
	margin-left: 5px;
	margin-right: 5px;
	margin-bottom: 20px;
	padding-top: 0.35em;
	padding-bottom: 0.625em;
	padding-left: 10px;
	padding-right: 5px;
	border: 1px #ccc solid;
	background-color: rgba(255, 255, 255, 0.4);
	border-radius: 10px; 
	width:30%;
}

fieldset ul {
    
    list-style: none; /* Remove default numbering */
   
    font: 14px 'trebuchet MS', 'lucida sans';
    padding: 30x;
    margin-bottom: 1em;
    margin-top: -10px;

}

fieldset ul ul {
    margin: 0 0 0 2em; /* Add some left margin for inner lists */
}

.rounded-list a {
    position: relative;
    display: block;
    padding: .2em .4em .4em 1em;
    *padding: .4em;
    margin: .5em 0;
    text-decoration: none;
    border-radius: .3em;
    transition: all .3s ease-out;   
}

.rounded-list a:hover{}

.rounded-list a:before{
    content: "\f00c";
 	font-family: FontAwesome;
    position: absolute; 
    left: -2em;
    top: 50%;
    margin-top: -1.3em;
    background: #e9ebe8;
    height: 2em;
    width: 2em;
    line-height: 2em;
    border: .3em solid #f7f8f7;
    text-align: center;
    font-weight: bold;
    border-radius: 2em;
    transition: all .3s ease-out;
}

.col3-pale .rounded-list a:before{
    content: "\f00c";
 	font-family: FontAwesome;
    position: absolute; 
    left: -2em;
    top: 50%;
    margin-top: -1.3em;
    background: #e9ebe8;
    height: 2em;
    width: 2em;
    line-height: 2em;
    border: .3em solid #f2f3f1;
    text-align: center;
    font-weight: bold;
    border-radius: 2em;
    transition: all .3s ease-out;
}

.rounded-list.store a:before{
    content: "\f00c";
 	font-family: FontAwesome;
    position: absolute; 
    left: -2em;
    top: 24%;
    margin-top: -1.3em;
    background: #f2f3f1;
    height: 2em;
    width: 2em;
    line-height: 2em;
    border: .3em solid #e9ebe8;
    text-align: center;
    font-weight: bold;
    border-radius: 2em;
    transition: all .3s ease-out;
}


div.benefices
{
	background-repeat: no-repeat;
	background-position: 0px 0px;
	padding-left:65px;
	margin-bottom:15px;
	padding-top:5px;
	width:24%;
	float: left;
	margin-left:20px;
	font-size:0.9em;
}

div.benefices span
{
	font-size: 14px;
	font-weight: bold;
	font-family: 'Roboto', sans-serif;
	color: #F7673D;
}

div.benefices.controle
{
	background-image: url(/images/controle.png);
}
div.benefices.efficience
{
	background-image: url(/images/efficience.png);
}
div.benefices.perenite
{
	background-image: url(/images/perenite.png);
}
div.benefices.confort
{
	background-image: url(/images/aonfort-satisfaction.png);
}
div.benefices.maintenance
{
	background-image: url(/images/maintenance-preventive.png);
}
div.benefices.obligations
{
	background-image: url(/images/obligation-securite.png);
}
div.benefices.decision
{
	background-image: url(/images/prise-decision.png);
}
div.benefices.encadrement
{
	background-image: url(/images/encadrement.png);
}
div.benefices.gestion
{
	background-image: url(/images/gestion-integre.png);
}
div.benefices.facilite-utilisation
{
	background-image: url(/images/facilite-utilisation.png);
}
div.benefices.expertise
{
	background-image: url(/images/partage-expertises.png);
}
div.benefices.responsabilite
{
	background-image: url(/images/responsabilite.png);
}
div.benefices.adaptabilite
{
	background-image: url(/images/adaptabilite.png);
}
div.benefices.mobilite
{
	background-image: url(/images/mobilite.png);
}
div.benefices.rapport-pro
{
	background-image: url(/images/rapports-professionnels.png);
}
div.benefices.conformite
{
	background-image: url(/images/conformite.png);
}
div.benefices.eprouve
{
	background-image: url(/images/eprouvee-reconnue.png);
}
div.benefices.accessibilite
{
	background-image: url(/images/Accessibilite.png);
}
div.benefices.encadrement-normalisation
{
	background-image: url(/images/encadrement-normalisation.png);
}
div.benefices.convergence
{
	background-image: url(/images/convergence.png);
}
div.benefices.retour-sur-investissement
{
	background-image: url(/images/retour-sur-investissement.png);
}

div.integration
{
	background-repeat: no-repeat;
	background-position: center 0px;
	margin-bottom: 15px;
	width: 45%;
	float: left;
	text-align: center;
	padding:70px 30px 10px 10px;
	font-size:14px;
}
div.integration2
{
	background-repeat: no-repeat;
	background-position: 198px 0px;
	margin-bottom: 15px;
	width: 100%;
	float: left;
	text-align: center;
	padding:70px 30px 10px 10px;
	font-size:14px;
}

div.integration.bloque1, div.integration2.bloque1
{
	background-image: url(/images/solution-cle-main.png);
}
div.integration.bloque2, div.integration2.bloque2
{
	background-image: url(/images/accompagnement.png);
}
div.integration.bloque3, div.integration2.bloque3
{
	background-image: url(/images/ressources-docs.png);
}
div.integration.bloque4, div.integration2.bloque4
{
	background-image: url(/images/aonfort-satisfaction.png);
}

.graphique {
border-left: 18px solid #dde2db;
padding:0 0 10px 0;
margin:40px 0;
}
.graphique img { padding-left:30px; }