@media screen, handheld {
/* DEBUT: D?finition de formats pour une sortie ecran */

* {  
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	color: #c8c7c5;  
}

body {
  position: relative;
	background: #7b7b7b url(imagesCSS/degrade.gif) repeat-x scroll top;
}

.global {
  position: relative;
  width: 943px;
  margin: auto;	
  text-align:left;
  z-index: 8;
}

.banner {
  overflow: hidden;
  position: relative;
  width: 943px;
	height: 185px;
	background: url(imagesCSS/topBanner2.gif) no-repeat scroll top;
	text-align: right;
	z-index: 9;
}

/***************************************************************************
****************************    TopMenu    *********************************
***************************************************************************/

.banner p {
  color: #ffffff;
	font: normal normal normal 11px/12px Arial, Helvetica, sans-serif;
}

.banner p * {
	color: #ffffff;
  margin: 0 5px 0 5px;
  padding: 4px 3px 0 0;
	text-decoration: none;
}

.banner p span {
  color: #4c4b4b;
	font-weight: bold;
}

.banner p a:hover {
	color: #4c4b4b;
}

.logo {
  float: left;
  width: 94px;
  height: 74px;
  background: url(images/logoBouge.gif) no-repeat scroll top;
  padding: 5px 10px 0px 80px;
  z-index: 10;
}

/***************************************************************************
****************************  Menu icone  **********************************
***************************************************************************/

.menu {
  float: right;
  padding: 34px 6px 0 0;
}
.aIconeMaison, .aIconeClef, .aIconeEnveloppe {
	float:left;
	display: block;
	width: 32px;
	height: 26px;
	text-decoration: none;
  font-size: 5px;
}

.aIconeMaison {
	background: url(imagesCSS/maison.jpg) no-repeat scroll top;
}
.aIconeClef {
	background: url(imagesCSS/cle.jpg) no-repeat scroll top;
}
.aIconeEnveloppe {
	background: url(imagesCSS/enveloppe.jpg) no-repeat scroll top;
}

.aIconeMaison:hover {
	background: url(imagesCSS/maisonOver.jpg);
}
.aIconeClef:hover {
	background: url(imagesCSS/cleOver.jpg);
}
.aIconeEnveloppe:hover {
	background: url(imagesCSS/enveloppeOver.jpg);
}

/***************************************************************************
****************************   breadcrumb   ********************************
***************************************************************************/

.breadcrumb {
	position: absolute;
	right: 5px;
	top:140px;
	font: normal normal normal 11px/14px Arial, Helvetica, sans-serif;
}

.breadcrumb p * {
	float: right;
	display: block;
	padding: 0 2px 0 2px;
	text-decoration: none;
	letter-spacing: 2px;
	color: #ffffff;
}

.breadcrumb p span {
	font-weight: bold;
	letter-spacing: 2px;
	color: #ffffff;
}

.breadcrumb .actual {
	font-weight: bold;
	letter-spacing: 2px;
	color: #ffffff;
}

.breadcrumb p a:hover {
  text-decoration: underline;
  letter-spacing: 2px;
  color: #ffffff;
}

/***************************************************************************
****************************   Coordonn?es  ********************************
***************************************************************************/

.coordonnees {
	position: relative;
	left: 20px;
	width: 155px;
	background: url(imagesCSS/bckgrdCoordonnees.jpg) repeat-y scroll top;
	text-align: center;
	font: normal normal normal 11px/14px Arial, Helvetica, sans-serif;
	border: 1px solid white;
}

.coordonnees p {
	padding: 6px;
	color: white;
	letter-spacing: 1px;	
}

.coordonnees a {
	color: white;	
}

/***************************************************************************
****************************    Footer    **********************************
***************************************************************************/

.mainFooter {
	width: 943px;
	height: 100px;
	position: relative;
	margin: -50px auto auto auto;
	background: #444444 url(imagesCSS/footer.gif) no-repeat;
}

.botmenu {
  margin: 0 auto 0 auto;
	width: 943px;
	position: relative;
	text-align: center;
	padding-top: 12px;
	letter-spacing: 1px;
}

.botmenu p, .botmenu p a, .botmenu p span {
	color: #b5b5b5;
	font: normal normal normal 11px/12px Arial, Helvetica, sans-serif;
	text-decoration: none;
}

.botmenu p a:hover {
	color: #FFFFFF;
	font: normal normal normal 11px/12px Arial, Helvetica, sans-serif;
	text-decoration: none;
}

.botmenu p span {
  color: #FFFFFF;
	font: normal normal bold 11px/12px Arial, Helvetica, sans-serif;
	text-decoration: none;
}

/***************************************************************************
****************************  MainContent **********************************
***************************************************************************/

.mainContainer {
  position: relative;
  width: 943px;
	text-align: left;
	background: url(imagesCSS/milieu.gif) repeat-y scroll top;
}

.mainContent {
  width: 450px;
  margin: 0 0 50px 263px;
  min-height: 650px;
}

.mainContent * {
	color: #ef6202;
	letter-spacing: 1px;
}

.mainContent h1 {
	background: url(imagesCSS/h1.gif) no-repeat scroll left;
	font: normal normal normal 24px/38px Arial, Helvetica, sans-serif;
	padding: 5px 0 0 50px;
	margin-left: -50px;
  text-align: left;
}

.mainContent h2 {
	font: normal normal normal 17px/20px Arial, Helvetica, sans-serif;
	text-align: center;
	padding: 15px 0px 10px 0px;
}

.mainContent h3 {
	font: normal normal normal 15px/18px Arial, Helvetica, sans-serif;
	text-align: center;
	padding: 15px 0px 10px 0px;	
	letter-spacing: 0px;
}

.mainContent h4 {
	font: normal normal bold 15px/18px Arial, Helvetica, sans-serif;
	text-align: center;
	padding: 25px 0px 5px 0px;	
	color: #444444;
}

.mainContent p {
	font: normal normal normal 12px/16px Arial, Helvetica, sans-serif;
	padding: 5px 0px 5px 0;
	color: #444444;
	text-align: justify;
}

.mainContent a {
	text-decoration: none;
  cursor: pointer;
	/**color: #444444;**/
}

.mainContent a:hover {
	text-decoration: underline;
}

.mainContent ul {
  margin-left: 25px;
	color: #444444;
}

.mainContent li {
	padding: 0 0 0 5px;
  font: normal normal normal 12px/16px Arial, Helvetica, sans-serif;
  color: #444444;
  outline: none;
	list-style-type: disc;
}

.imgLeft, .imgRight, .imgCenter {
	border: 2px solid #ef690e;
}

.imgLeft {
  display: block;
	float: left;	
	margin: 5px 15px 5px 0;
	background-color: white;
}

.imgRight {
  display: block;
	float: right;
	margin: 5px 0px 10px 15px;
	background-color: white;
}

.imgCenter {
  margin: 5px auto 10px auto;
}

.imgCenterNoBorder {
	border: 0;
	display: block;
  margin: 0 auto auto auto;
}

.imgLeftNoBorder {
	border: 0;
  display: block;
	float: left;	
	margin: 5px 15px 10px 0;
}

.imgRightNoBorder {
	border: 0;
  display: block;
	float: right;
	margin: 5px 0px 10px 15px;
	background-color: white;
}

.bandeau {
	display: block;
	clear: both;
}

.txtItalic {
  font-style: italic;
}

.txtCenter {
	display: block;
	width: 100%;
	text-align: center;
}

.txtRight {
	display: block;
	width: 100%;
	text-align: right;
	padding: 10px 10px 10px 0;
}

.txtGras {
	font-weight: bold;
}

.txtOrange {
  color: #ef690e;
}

.realisation1 {
  float: left;
  display: block;
  width: 450px;
  margin: 5px 0px 20px 0;
  padding: 5px 5px 5px 5px;
  border: 1px solid #ef690e;
}

.realisation {
  position: relative;
  display: block;
  width: 450px;
  margin: 5px auto auto 0;
  /**border: 2px solid #ef690e;*/
}

.realisation p {
	font: normal normal normal 12px/15px Arial, Helvetica, sans-serif;
	padding: 5px 5px 5px 5px;
	color: #444444;
	text-align: justify;
}

.realisation ul {
	margin: auto;
	color: #444444;
}

.mainContent ul {
	padding: 5px 0px 10px 25px;
	color: #444444;
}

.mainContent li ul {
	margin: auto;
	color: #444444;
}

.miniatureSite {
  float: right;
  display: block;
  padding: 5px 5px 5px 5px;
}

.aIconeImmoMeuse , .aIconeEnrena, .aIconeSismo, .aIconeStenayeco, .aIconeCogeaf {
	display: block;
	width: 100px;
	height: 100px;
	text-decoration: none;
  font-size: 5px;
}

.aIconeImmoMeuse {
	background: url(imagesCSS/miniatureSites/immomeuse.png) no-repeat scroll top;
}

.aIconeImmoMeuse:hover {
	background: url(imagesCSS/miniatureSites/immomeuseOver.png) no-repeat scroll top;
}

.aIconeEnrena {
	background: url(imagesCSS/miniatureSites/enrena.png) no-repeat scroll top;
}

.aIconeEnrena:hover {
	background: url(imagesCSS/miniatureSites/enrenaOver.png) no-repeat scroll top;
}

.aIconeSismo {
	background: url(imagesCSS/miniatureSites/sismo.png) no-repeat scroll top;
}

.aIconeSismo:hover {
	background: url(imagesCSS/miniatureSites/sismoOver.png) no-repeat scroll top;
}

.aIconeStenayeco {
	background: url(imagesCSS/miniatureSites/stenayeco.png) no-repeat scroll top;
}

.aIconeStenayeco:hover {
	background: url(imagesCSS/miniatureSites/stenayecoOver.png) no-repeat scroll top;
}

.aIconeCogeaf {
	background: url(imagesCSS/miniatureSites/cogeaf.png) no-repeat scroll top;
}

.aIconeCogeaf:hover {
	background: url(imagesCSS/miniatureSites/cogeafOver.png) no-repeat scroll top;
}

.miniatureAdwords {
  display: block;
  height: 138px;
  width: 500px;
  padding: 15px 0 15px 25px;
}

/**.aIconeTactimail , .aIconeBelga, .aIconeCemart {
	float: left;
	height: 138px;
	text-decoration: none;
  font-size: 5px;
}

.aIconeTactimail {
	background: url(images/adwords/tactimail.png) no-repeat scroll top;
	width: 169px; 
}

.aIconeTactimail:hover {
	background: url(images/adwords/tactimailOver.png) no-repeat scroll top;
}

.aIconeBelga {
	background: url(images/adwords/belga.png) no-repeat scroll top;
	width: 169px; 
}

.aIconeBelga:hover {
	background: url(images/adwords/belgaOver.png) no-repeat scroll top;
}

.aIconeCemart {
	background: url(images/adwords/cemart.png) no-repeat scroll top;
	width: 162px; 
}

.aIconeCemart:hover {
	background: url(images/adwords/cemartOver.png) no-repeat scroll top;
}**/

.object {
  position: relative;
  left: 100px;
  padding: 15px 0 15px 0;
}

.clear{ /**pour rétablir le flux**/
  clear:both; 
  display:block; 
  height: 0; 
  font-size: 1px; 
  line-height: 0px; 
} 


/***************************************************************************
****************************  LeftContent **********************************
***************************************************************************/

.leftContent {
  float: left;
  width: 186px;
}

.leftNav {
  position: relative;
  width: 186px;
}

.leftNav a,.leftNav span {
	display: block;
	padding-left: 34px;
	text-decoration: none;
}

.leftNav a {
  /**background: url(imagesCSS/tete.gif) no-repeat;**/
  font: normal normal normal 14px/40px Arial, Helvetica, sans-serif;
  color: #ffffff;
  outline: none;
}

.leftNav span {
	background: url(imagesCSS/teteSelect.png) no-repeat scroll left;
	font: normal normal normal 15px/40px Arial, Helvetica, sans-serif;
	color: #ef6202;
	font-weight: bold;	
}

.leftNav a:hover {
	background: url(imagesCSS/teteOver.png) no-repeat scroll left;
	font: normal normal normal 15px/40px Arial, Helvetica, sans-serif;
	color: #ffffff;
  font-weight: bold;
}

.leftNav ul  {
	color: #ffffff;
  width: 138px;
	padding : 0 0 5px 45px;
	margin-top: 2px;
}

.leftNav li {
  font: normal normal normal 12px/17px Arial, Helvetica, sans-serif;
	color: #ffffff;
  outline: none;
	list-style-type: disc;
}

.leftNav li a {
  font: normal normal normal 12px/17px Arial, Helvetica, sans-serif;
  padding: 0 0 0 0;
  outline: none;
}

.leftNav li a:hover, .leftNav li span {
  font: normal normal normal 12px/17px Arial, Helvetica, sans-serif;
  padding: 0 0 0 0;
  color: #ef6202;
  background: none;
}

.leftNav li span {
  font-weight: bold;
}

.leftNav li ul  {
	color: #ffffff;
	padding : 0 0 2px 15px;
}

.leftNav li ul li {
	font: normal normal normal 12px/17px Arial, Helvetica, sans-serif;
	color: #ffffff;
  outline: none;
	list-style-type: disc;
}
/***************************************************************************
 **************************** Right Content ********************************
 **************************************************************************/ 

.rightContent { 
	margin: auto;
	width: 190px;
	position: absolute;
	background: url(imagesCSS/milieuOrange.gif) repeat-y scroll top;
	top: 185px;
	left: 753px;
}

.rightContent h1 {
  width: 190px;
	height: 27px;
	padding: 3px 0 5px 0;
	background: url(imagesCSS/rightContentH1.gif) no-repeat;
  font: normal normal bold 12px/27px Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	letter-spacing: 1px;
	text-align: center;
}

.rightContent P {
  font: normal normal normal 11px/14px Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	padding: 5px 12px 5px 10px;
	letter-spacing: 1px;
	text-align: center;
}

.rightContent a {
	color: #FFFFFF;
  text-decoration: none;
  cursor: pointer;
}

.rightContent a:hover {
  text-decoration: underline;
}

.rightContentEnd {
  width: 190px;
	height: 18px;
	background: url(imagesCSS/rightBoxEnd.jpg) no-repeat;
} 

.rightContentBottom {
  width: 190px;
	height: 5px;
	background: url(imagesCSS/orangeEnd.gif) no-repeat;
}

.logoBox {
  width: 168px;
  margin: auto;
  border: none;
}


/***************************************************************************
****************************     Form2Mail    ******************************
***************************************************************************/

.contactForm {
  position: relative;
	width: 70%;
	margin: auto;
	padding-left: 50px;
	font: normal normal normal 10px/16px Arial, Helvetica, sans-serif;
}

.contactForm h1 {
	background-image: none;
	width: 70%;
	font: normal normal normal 16px/22px Arial, Helvetica, sans-serif;
  color: #757474;
  letter-spacing: 1px;
	text-align: center;
}


.f2m label {
  display: block;
  text-align: justify;
}

.f2m label:hover {
  font-weight: bold;
}

.f2m hr {
	display: block;
	width: 100%;
	height: 1px;
  color: #757474;
	margin: 5px auto 15px auto;
}

#F2MNLbox1, #F2MNLbox2, #F2MNLbox3, #F2MNLbox4, #F2MNLbox5, #F2MNLbox6 {
  margin: 0;
  border: none;
	width: 10px;
}

#labelBox1, #labelBox2, #labelBox3, #labelBox4, #labelBox5, #labelBox6 {
	position: relative;
	top: -14px;
	left: 5px;
	margin: auto;
	width: 90%;
	font: normal normal normal 13px/13px Arial, Helvetica, sans-serif;
	text-align: left;
}

.f2m input, .f2m select, .f2m textarea {
  margin-right: 0%;
	width: 100%;
  text-align: left;
  color: #757474;
  border: #CCC 1px solid;
}

.f2m input:hover, .f2m select:hover, .f2m input:focus, .f2m select:focus, .f2m textarea:hover, .f2m textarea:focus {
  border: #999 1px solid;
}

.f2m textarea {
	font: normal normal normal 12px/12px Arial, Helvetica, sans-serif;
	color: #757474;
	height:160px;
}
 
#bouton {
  border: #999 1px solid;
  color: #ef690e;
  margin-right: 0%;
	margin-top: 5px;
	margin-bottom: 5px;
	width: 101%;
  text-align: center;
  cursor: pointer;
}

#bouton:hover {
  background-color: #ffffff;
  color: #ef690e;
  cursor: pointer;
}


/***************************************************************************
*******************   Newsletter Inscription Form   ************************
***************************************************************************/

.form {
  position: relative;
  width: 100%;
	color: #ffffff;
}

.newsForm {
  position: relative;
	width: 80%;
	margin: auto;
	padding-bottom: 15px;
	font: normal normal normal 10px/16px Arial, Helvetica, sans-serif;
	color: #ffffff;
}

.newsForm label{
  color: #ffffff;
}

.newsForm f2m input, .newsForm f2m select, .newsForm f2m textarea {
  margin-right: 0%;
	width: 100%;
  text-align: left;
  color: #757474;
  border: #CCC 1px solid;
}

.newsForm f2m input:hover, .newsForm f2m select:hover, .newsForm f2m input:focus, .newsForm f2m select:focus, .newsForm f2m textarea:hover, .newsForm f2m textarea:focus {
  border: #999 1px solid;
  color: #ffffff;
}
 
#newsBouton {
  border: none; 
  background-color: transparent;  
  font: normal normal normal 11px/20px Arial, Helvetica, sans-serif;
  letter-spacing: 1px;
  color: #ffffff;
  text-align: right;
  cursor: pointer;
}

#newsBouton:hover {
  text-decoration: underline;
  cursor: pointer;
}


/* FIN: D?finition de formats pour une sortie ecran */
}