html, body{
	margin: 0;
	padding: 0;
}
body{
	background-color: #001e67; /* bleu foncé */
	color: #254A99;	 /* bleu */
	font-size: 14px;
	font-family:Arial, Helvetica, sans-serif;
}

#page{
	width: 990px;
	background-color:#FFFFFF;	
	margin: 5px auto 20px auto; /* haut droite bas gauche */
	text-align: left;
}

#entete{
	height:178px;
}

/***** CONTENU de la page => textes et graphiques
-------------------------------------------------------- */

#contenu {
	font-size:14px;
	font-weight:bold;
	padding: 30px 80px 10px 40px;  /* haut droite bas gauche */
	text-align:justify;
}

#contenu ul{
	text-align:left;
	font-size:14px;
	list-style-type: none;
}
#contenu ul li{
	list-style-image:url(../images/fleche2.jpg);
  	margin: 10px 0 0 20px;   /* haut droite bas gauche */
	padding-left:0px;
}

.texte
{
	margin-left:80px;
	padding-top:200px;
}

#contenu p .douze{
	font-size:12px;
}
#contenu p .quatorze{
	font-size:14px;
}


#suite{
	float:right;
	margin-right:250px;
	margin-top:33px;
}

/***** Liens dans "suite"
-------------------------------------------------------- */

#suite a:link{
	color:#ff9d22;	/*orange*/
	font-size:16px;
	font-weight:bold;
	text-decoration:none;
}
#suite a:visited{
	color:#ff9d22;	/*orange*/
	font-size:16px;
	font-weight:bold;
	text-decoration:none;
}
#suite a:hover{
	color:#254A99;	 /* bleu */
	font-size:16px;
	font-weight:bold;
	text-decoration:none;
}
#suite a:active{
	color:#ff9d22;	/*orange*/
	font-size:16px;
	font-weight:bold;
	text-decoration:none;
}


/***** 					IMAGES
-------------------------------------------------------- */
#preload {
	display: none;
}

#contenu .images1 {
	height: 180px;
	margin: 10px 0px 0px 0px;   /* haut droite bas gauche */
	text-align:center;
}
#contenu .images2 {
	height: 180px;
	margin: 10px 0px 0px 0px;   /* haut droite bas gauche */
	text-align:center;
}
#contenu .images3 {
	height: 180px;
	margin: 10px 0px 0px 0px;   /* haut droite bas gauche */
	text-align:center;
}
#contenu .images4 {
	height: 180px;
	margin: 10px 0px 0px 0px;   /* haut droite bas gauche */
	text-align:center;
}
#contenu .images5 {
	height: 180px;
	margin: 10px 0px 0px 0px;   /* haut droite bas gauche */
	text-align:center;
}
#contenu .images6 {
	height: 180px;
	margin: 10px 0px 0px 0px;   /* haut droite bas gauche */
	text-align:center;
}
#contenu .images7 {
	height: 180px;
	margin: 10px 0px 0px 0px;   /* haut droite bas gauche */
	text-align:center;
}
#contenu .images8 {
	height: 180px;
	margin: 10px 0px 0px 0px;   /* haut droite bas gauche */
	text-align:center;
}
#contenu .images9 {
	height: 180px;
	margin: 10px 0px 0px 0px;   /* haut droite bas gauche */
	text-align:center;
}
#contenu .images10 {
	height: 180px;
	margin: 10px 0px 0px 0px;   /* haut droite bas gauche */
	text-align:center;
}
#contenu .images11 {
	height: 180px;
	margin: 10px 0px 0px 0px;   /* haut droite bas gauche */
	text-align:center;
}
#contenu .images12 {
	height: 180px;
	margin: 10px 0px 0px 0px;   /* haut droite bas gauche */
	text-align:center;
}
/* -------------------------------------------------------- */
.droite1 {
	width:217px;
	height:163px;
	background-repeat:no-repeat;
	float: right;
	margin-right: 0px;
	cursor:help;
}
.droite2 {
	width:208px;
	height:156px;
	background-repeat:no-repeat;
	float: right;
	margin-right: 0px;
	cursor:help;
}

.montage /* montage d'un panneau photovoltaique */
{
	display: block;
	margin: 0 auto;
	width=350px;
	height=198px;
}

#electgen /* photo "realisations" */
{
	float: left;
	margin-left:40px;
	margin-top:5px;
	margin-right:10px;
}

.pac01 {
	width:211px;
	height:280px;
	float: left;
	margin-left: 50px;
}
.pac02 {
	width:213px;
	height:280px;
	float: right;
	margin-left: 50px;
}

/***** 				ZOOMS  IMAGES
-------------------------------------------------------- */

.villette2 {
	width:222px;
	height:166px;
	background-image:url(../images/villette2.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.bouxin{
	width:222px;
	height:166px;
	background-image:url(../images/bouxin.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.gilloots{
	width:222px;
	height:166px;
	background-image:url(../images/gilloots.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.leclere{
	width:222px;
	height:166px;
	background-image:url(../images/leclere.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.langlet{
	width:222px;
	height:166px;
	background-image:url(../images/langlet.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}

.farce {
	width:222px;
	height:166px;
	background-image:url(../images/farce.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.rohat {
	width:222px;
	height:166px;
	background-image:url(../images/rohat.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.collet {
	width:222px;
	height:166px;
	background-image:url(../images/collet.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.site_isole {
	width:222px;
	height:166px;
	background-image:url(../images/site_isole.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.pouilhe{
	width:222px;
	height:166px;
	background-image:url(../images/pouilhe.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.roucoulet{
	width:222px;
	height:166px;
	background-image:url(../images/roucoulet.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.hecq{
	width:222px;
	height:166px;
	background-image:url(../images/hecq.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.truffer{
	width:222px;
	height:166px;
	background-image:url(../images/truffer.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.lepelletier{
	width:222px;
	height:166px;
	background-image:url(../images/lepelletier.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.conrad{
	width:222px;
	height:166px;
	background-image:url(../images/conrad.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
.lacoume{
	width:222px;
	height:166px;
	background-image:url(../images/lacoume.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 0px;
}
/*.gauche1 {
	width:300px;
	height:300px;
	background-image:url(../images/real1.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 50px;
}

.gauche1 a {
	height: 300px;
	display: block;
	margin:0 auto;
}

.gauche1 a:hover {
	background-image:url(../images/real1-2.jpg);
	background-position: 77px 112px; /* X - Y */
	background-repeat: no-repeat;
	cursor:help;
}
*/
/* -------------------------------------------------------- */
.gauche2 {
	width:300px;
	height:300px;
	background-image:url(../images/real2.jpg);
	background-repeat:no-repeat;
	float: left;
	margin-left: 50px;
}

.gauche2 a {
	height: 300px;
	display: block;
	margin:0 auto;
}

.gauche2 a:hover {
	background-image:url(../images/real2-2.jpg);
	background-position: 77px 112px; /* X - Y */
	background-repeat: no-repeat;
	cursor:help;
}




/***** 				PIED DE PAGE
-------------------------------------------------------- */

#piedpage{
	background-color: #001e67; /* bleu foncé */
	color:#FFFFFF;
	font-size:14px;
	height:200px;
	width:990px;
	text-align:center;
}

#piedpage p .douze{
	font-size:12px;
}

/***** Liens dans "piedpage"
-------------------------------------------------------- */

#piedpage a:link{
	color:#FFFFFF;	/*blanc*/
	text-decoration:none;
}
#piedpage a:visited{
	color:#FFFFFF;	/*blanc*/
	text-decoration:none;
}
#piedpage a:hover{
	color:#CC6600;	/*orange*/
	text-decoration:underline;
}
#piedpage a:active{
	color:#FFFFFF;	/*blanc*/
	text-decoration:none;
}


/***** 			popup mentions légales
-------------------------------------------------------- */
#piedpage a.bulle {
     position:relative;
     text-decoration:none;
     font-family:arial, verdana, sans-serif;
     font-size:12px;
   }
   
#piedpage a.bulle:hover {
      background: none;
      z-index: 50;
   }
   
#piedpage a.bulle span {
     display: none;
   }
   
#piedpage a.bulle:hover span {
      display: block;
      position: absolute;
      top: -600px;
      left: -200px;
      text-align:justify;
	  text-decoration:none;
	  color: #254A99;	 /* bleu */
      width:650px;
      background: white;
      padding: 5px;
      border: 2px solid #001e67; /* bleu foncé */
   }

