/*************************************************************************
 _____   _____   _   __   _   _____        _          __  _____   _____  
|  _  \ /  _  \ | | |  \ | | |_   _|      | |        / / | ____| |  _  \ 
| |_| | | | | | | | |   \| |   | |        | |  __   / /  | |__   | |_| | 
|  ___/ | | | | | | | |\   |   | |        | | /  | / /   |  __|  |  _  { 
| |     | |_| | | | | | \  |   | |        | |/   |/ /    | |___  | |_| | 
|_|     \_____/ |_| |_|  \_|   |_|        |___/|___/     |_____| |_____/ 
**************************************************************************
Copyright 2010 POINT WEB
type : screen
categorie : structure site
Auteur : serco pointweb
site : metalboi
**************************************************************************/

/*fix bug navigateur*/
.myhr{ clear:both; height:0; overflow:hidden; visibility:hidden; }

/************* DETECTION JS **************/
#jserror{ background:#FFFFCC; border:#FF0000; color:#FF0000; padding: 10px; margin: 0 0 10px 0; float:left; }
#jserror dt{ font-weight:bold; }

*{margin:0; padding:0}
body{ background:#FFF url(../images/bg_site.gif) repeat-x top left ; font-family:Verdana, Arial, Helvetica, sans-serif;}
h1{ display:none}
a{ text-decoration:none; outline:none;}
a:hover{ text-decoration:underline}
#accessibilite { display:none}
img{ border:0}


/*----------------------------------------------------< STRUCTURE >---------------------------------------------------*/

#global{width:995px; margin:0 auto;}
#header{height:543px;}

/*----------------------------------------------------< Menu >---------------------------------------------------*/

#menu{ height:54px; background:url(../images/bg_menu.gif) no-repeat top left; font-family:Arial, Helvetica, sans-serif; position:relative; padding:30px 0 0 35px}
#menu ul{ list-style-type:none}
#menu li.rubrique{ color:#e0cdba; font-size:16px; display:inline; float:left;padding-right:46px; line-height:13px}
#menu li.rubrique a.grderubrique{ color:#e0cdba; font-size:16px}
#menu li.rubrique a.grderubrique:hover{ color:#32bde9; text-decoration:none}
#menu span{ color:#b3a08e; font-size:11px}

.smenu{ background:#493d31; z-index:5; position:absolute; top:84px;  border:#79695a solid 1px}
.smenu ul{ list-style-type:none; padding:10px}
.smenu li{ border-bottom:#fff dotted 1px; padding-bottom:5px;color:#FFF; font-size:12px; padding-top:5px}
.smenu li a{ color:#FFF; font-size:12px}
#smenusociete{ width:165px;left:160px;}
#smenuengagements{ width:180px;left:324px;}
#smenuservices{ width:151px;left:505px;}
#smenufranchise{ width:176px;left:655px;}

/*-------------------------------------------------------------------------------------------------------------------*/

#logo{ float:left; height:105px; width:569px}
#coordonnees{ float:left; height:105px; width:426px; background:url(../images/bg_coordonnees.gif) no-repeat top left}
#coordonnees p{ text-align:right; color:#939393; font-size:11px; padding:50px 125px 0 0}
#coordonnees a{color:#939393}

#diapoSwf{ width:881px; height:344px;  background:url(../images/bg_diapoSwf.jpg) no-repeat bottom left; clear:both; padding:20px 0 0 114px; outline:none}
#imageCue{ width:760px; height:285px; outline:none}

/*---------------------------------------------------------- pagination ---------------------------------------------------------*/

.pagination{ text-align:center}
.pagination ul{ list-style-type:none}
.pagination ul li{ display:inline; color:#999; font-size:16px}
.pagination ul li a{color:#999; font-size:16px}
.pagination ul li a.activ{color:#999; font-size:16px; font-weight:bold; text-decoration:underline}

/*------------------------------------------------< TOUT LES BLOCKS FRANCHISE >-----------------------------------------*/


/*------------------------------------------------< Devenez franchisé >-----------------------------------------*/

#blockFranchise{ height:173px; width:995px}
	#blockDevenirFranchise{ width:323px; height:173px; float:left; background:url(../images/bg_block1.jpg) no-repeat top left}
		#blockDevenirFranchise dl{ margin:30px 0 0 0}
		#blockDevenirFranchise dt{ width:323px; height:32px; background:url(../images/titre-devenezFranchise.gif) no-repeat top left;margin-bottom:3px}
		#blockDevenirFranchise dt p{ text-indent:-9999px; font-weight:bold}
		#blockDevenirFranchise dd{ font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#71706e; padding:0 20px 7px 45px}
		
a.savoirPlus{ width:114px; height:19px; display:block; background:url(../images/btn-ensavoirplus.png) no-repeat top left; text-indent:-9999px}
a.savoirPlus:hover{background:url(../images/btn-ensavoirplus.png) no-repeat bottom left}

/*------------------------------------------------< Espace franchisé >-----------------------------------------*/

	#espaceFranchise{ width:290px; height:173px; background:url(../images/bg_block2.jpg) no-repeat top left; float:left}
		#espaceFranchise dl{ margin:33px 0 0 0} 
		#espaceFranchise dt{ width:290px; height:28px; background:url(../images/titre-espaceFranchise.gif) no-repeat top left; }
		#espaceFranchise dt p{ text-indent:-9999px; font-weight:bold}
		
		#formEspaceFranchise{ font-family:Arial, Helvetica, sans-serif; padding:10px 0 0 20px}
		#formEspaceFranchise fieldset{ border:none}
		#formEspaceFranchise legend{ display:none}
		#formEspaceFranchise div{ margin:5px}
		#formEspaceFranchise label{ display:inline; float:left;font-size:11px; color:#7a7272; width:100px}
		#formEspaceFranchise input{font-size:11px; color:#333; width:130px; border:#a1a0a0 solid 1px}
		#formEspaceFranchise input:focus, textarea:focus{background:#f1f1f1}
		#formEspaceFranchise input.monSubmit{background:#4d9cb5;cursor:pointer;border:#277088 solid 1px; font-weight:bold; color:#fff; font-size:10px; width:132px; margin:5px 0 0 0; height:17px}
		
		#formEspaceFranchise input.monSubmit:hover{background:#1b5a6e; cursor:pointer}
		
		.passOublie{ float:left; padding-left:78px}
		a.oubli{ text-indent:-9999px; width:17px; height:17px; display:block; background:url(../images/passoublie.gif)  no-repeat top left}
		a.oubli:hover{background:url(../images/passoublie.gif) no-repeat bottom left}
		
/*------------------------------------------------< rechercher un franchisé >-----------------------------------------*/

	#rechercheFranchise{ width:382px; height:173px;background:url(../images/bg_block3.jpg) no-repeat top left; float:left}
		#rechercheFranchise dl{ margin:32px 0 0 0}
		#rechercheFranchise dt{ width:290px; height:28px; background:url(../images/titre-rechercheFranchise.gif) no-repeat top left; margin-bottom:3px}
		#rechercheFranchise dt p{text-indent:-9999px; font-weight:bold}
		#rechercheFranchise dd{font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#71706e; padding:0 30px 0 20px}
		
		a.bleu{ color:#4d9cb5; text-decoration:underline}
		a.bleu:hover{ color:#2d7186; text-decoration:underline}
		
		#formRech{ margin:5px 0 0 0}
		#formRech fieldset{ border:none}
		#formRech legend{ display:none}
		#formRech div{ float:left; margin:5px 5px 5px 0}
		#formRech input:focus, textarea:focus{background:#f1f1f1}
		#formRech .monSubmit{background:#4d9cb5;cursor:pointer;border:#277088 solid 1px; font-weight:bold; color:#fff; font-size:11px; width:98px; margin:5px 0 0 0; height:20px; text-align:center}
		#formRech input.monSubmit{display:none}
		#formRech a.monSubmit{display:block}
		#formRech input.monSubmit:hover{background:#1b5a6e; cursor:pointer}
		#formRech select{ color:#675a4c; font-size:12px; height:20px;border:#999 solid 1px; margin:4px 0 0 0; width:200px}
		
/*------------------------------------------------< WRAPPER >-----------------------------------------*/	

#wrapper{}
#content{ padding:20px 40px 0 10px; float:left; width:682px}
#content p.paragraphe{ color:#666; font-size:11px; line-height:16px; margin-bottom:10px}
h2{ color:#4d9cb5; font-size:15px; font-weight:bold; margin-bottom:20px}
h2 span{ color:#79634f; font-size:15px; font-weight:normal}

#footer{ height:40px; padding:5px 0 0 0}
#footer p, #footer a{ font-size:11px; color:#b7b7b7; text-align:center}

/*------------------------------------------------< BLOCK LEFT >-----------------------------------------*/	

#blockLeft{ width:263px; float:left; font-family:Arial, Helvetica, sans-serif}
	#blockReseau{width:208px; height:205px; background:url(../images/bg_blockReseau.gif) no-repeat top left; padding:75px 0 0 55px}
	#blockReseau p{ color:#e0cdbc; font-size:11px}
	p#carte{ margin:5px 0 0 17px}
	a.blanc{ color:#FFF; font-size:11px; font-weight:bold; text-decoration:underline}
	a.blanc:hover{ color:#74cbe7}
	
	#blockVideo{ width:263px; height:124px; background:url(../images/bg_blockVideo.gif) no-repeat top left}
	#blockVideo p{color:#e0cdbc; font-size:11px; padding:60px 0 0 55px}
	
	#blockRealisations{ width:236px; height:175px; background:url(../images/bg_blockRea.gif) no-repeat top left;padding:60px 0 0 27px}
	.zoom{ position:absolute; top:101px; left:100px; z-index:5; width:52px; height:13px}
	

/*------------------------------------------------< Accueil >-----------------------------------------*/		

span.marron{ color:#79634f; font-size:12px} 
span.bleu{ color:#4d9cb5; font-size:14px}
span.gris{ color:#666; font-size:14px}

hr{ margin:5px 0 10px 0}
p.titre{ color:#79634f; font-size:14px; margin-bottom:20px}

.blocActu{ width:630px; float:left; margin-bottom:10px; margin-top:5px}
a.btnActu{ float:right;width:200px; height:19px; display:block; background:url(../images/btn-voiractu.gif) no-repeat top left; text-indent:-9999px}
a.btnActu:hover{ background:url(../images/btn-voiractu.gif) no-repeat bottom left}

.img1{ border:#ccc solid 1px}
.visuelActu{ border:#ccc solid 1px; margin-right:15px; float:left}
div.titreActu{ color:#4d9cb5; font-size:12px; margin-bottom:0}
div.descriptionActu{ color:#666; font-size:11px; line-height:16px; overflow:hidden; height:48px}

a.marron{ text-decoration:underline; font-weight:bold; font-size:11px; color:#9b8e80}
a.marron:hover{color:#6d6257}

#detailsActu{ padding:5px 0 10px 0; clear:both; color:#999; font-size:11px; line-height:16px}
#detailsActu p{ color:#999; font-size:11px; line-height:16px;}

/*------------------------------------------------< Société - présentation >-----------------------------------------*/

ul.list{ list-style-type:disc; list-style-position:inside}
ul.list li{ color:#4d9cb5; font-size:14px; line-height:20px}
ul.list li a{ color:#4d9cb5; font-size:14px}

ul.listbis{ list-style-type:disc; list-style-position:inside}
ul.listbis li{ color:#666; font-size:11px; line-height:16px}
ul.listbis li a{ color:#666; font-size:11px;}

.img2{ border:#ccc solid 1px; float:left; margin-right:10px; padding:5px}
.img3{ border:#ccc solid 1px; float:right; margin-left:10px; padding:5px}

/*------------------------------------------------< Société - Reseau national >-----------------------------------------*/

#carteFrance{ float:left; position:relative}
.blocFranchises{ border:#9f917f solid 1px; width:200px; padding:10px; float:left; background:#f6f4f0; position:absolute; z-index:5}
.blocFranchises dt{ font-weight:bold; font-size:12px; color:#60564b}
.blocFranchises dd{font-size:11px; color:#9b8e80; font-weight:bold; margin-bottom:5px}
.blocFranchises dd a{font-size:11px; color:#9b8e80; font-weight:normal}

#ain{top:190px; left:300px}
#aisne{top:10px; left:230px}
#aube{top:70px; left:240px}
#hauteGaronne{top:310px; left:150px}
#alpesMar{top:300px; left:360px}
#gironde{top:260px; left:80px}
#isere{top:220px; left:310px}
#landes{top:300px; left:80px}
#loireAtl{top:110px; left:60px}
#lozere{top:270px; left:230px}
#maineetLoire{top:110px; left:80px}
#meurtheetMozelle{top:50px; left:320px}
#oise{top:20px; left:190px}
#puydeDome{top:190px; left:220px}
#saonetLoire1{top:170px; left:140px}
#saonetLoire2{top:170px; left:380px}
#savoie{top:220px; left:340px}
#yvelines{top:40px; left:170px}
#var{top:310px; left:370px}
#vaucluse{top:300px; left:300px}
#hauteVienne{top:200px; left:150px}
#essonne{top:60px; left:190px}
#somme{top:5px; left:190px}

/*------------------------------------------------< Devenez franchisés - ETRE FRANCHISE >-----------------------------------------*/

a.btnVilles{ width:200px; height:19px; display:block; text-indent:-9999px; background:url(../images/btn-villes.gif) no-repeat top left}
a.btnVilles:hover{background:url(../images/btn-villes.gif) no-repeat bottom left}

a.gris{ text-decoration:underline ;color:#666; font-size:11px; }
a.gris:hover{ text-decoration:underline ;color:#000; font-size:11px; }

/*------------------------------------------------< Devenez franchisés - RECRUTEMENT >-----------------------------------------*/

ul.listter{ list-style-type:disc; list-style-position:inside}
ul.listter li{ color:#4d9cb5; font-size:13px; line-height:20px}
ul.listter li a{ color:#4d9cb5; font-size:13px}

ul.listquatro{ list-style-type:disc; list-style-position:inside}
ul.listquatro li{ color:#4d9cb5; font-size:11px; line-height:16px}
ul.listquatroli a{ color:#4d9cb5; font-size:11px}

/*------------------------------------------------< Contact >-----------------------------------------*/

.left{ float:left; margin-right:30px}
#formContact{ font-size:11px; color:#333; text-align:left; margin:10px 0}
#formContact div{margin:5px}
#formContact legend{display:none}
#formContact fieldset{border:none}
#formContact label{ 
	margin:0 5px 0 0;
	width:100px; 
	float:left;
	text-align:left
}
#formContact input{
	border:#666 1px solid;
	color:#333;
	font-size:11px;
	width:200px
}

#formContact textarea{	
	border:#666 1px solid;
	color:#333;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	width:200px;
	font-size:1.1em;
}
#formContact input:focus, textarea:focus{background:#f1f1f1}
#formContact input.monSubmit{margin: 0 0 0 105px; background:#4d9cb5;cursor:pointer; height:35px; border:none; font-weight:bold; color:#fff; font-size:14px; width:200px}
#formContact input.monSubmit:hover{background:#2a6274; cursor:pointer}

/*------------------------------------------------< pass oublié >-----------------------------------------*/

		#formPassOublie{ margin:20px 0 0 0}
		#formPassOublie fieldset{ border:#ccc solid 1px; padding:20px}
		#formPassOublie legend{ display:none}
		#formPassOublie div{ margin:5px}
		#formPassOublie label{ display:inline; float:left;font-size:14px; color:#7a7272; width:100px; margin-left:150px}
		#formPassOublie input{font-size:14px; color:#333; width:200px; border:#a1a0a0 solid 1px}
		#formPassOublie input:focus, textarea:focus{background:#f1f1f1}
		#formPassOublie input.monSubmit{background:#4d9cb5;cursor:pointer;border:#277088 solid 1px; font-weight:bold; color:#fff; font-size:14px; font-weight:bold; width:200px; margin:5px 0 0 250px; height:35px}
		#formPassOublie input.monSubmit:hover{background:#1b5a6e; cursor:pointer}
		
/*------------------------------------------------< plan du site >-----------------------------------------*/

#plan{ margin:80px 0 0 20px; border:#ccc dotted 2px; padding:20px;}
ul.souslist{ list-style:none; margin-left:30px}
ul.souslist li {font-size:12px; line-height:18px}
ul.souslist li a{font-size:12px}


/*------------------------------------------------< ESPACE FRANCHISES >-----------------------------------------*/

		#formEspaceFranchiseLog { margin:0 0 20px 0}
		#formEspaceFranchiseLog p{ color:#333; font-size:14px}
		#formEspaceFranchiseLog fieldset{ border:#ccc solid 1px; padding:20px}
		#formEspaceFranchiseLog legend{ color:#CCC; padding:0 5px 0 5px}
		#formEspaceFranchiseLog div{ margin:5px}
		#formEspaceFranchiseLog input{font-size:14px; color:#333; width:200px; border:#a1a0a0 solid 1px}
		#formEspaceFranchiseLog input:focus, textarea:focus{background:#f1f1f1}
		#formEspaceFranchiseLog input.monSubmit{background:#4d9cb5;cursor:pointer;border:#277088 solid 1px; font-weight:bold; color:#fff; font-size:14px; font-weight:bold; width:200px; margin:5px 0 0 0; height:25px}
		#formEspaceFranchiseLog input.monSubmit:hover{background:#1b5a6e; cursor:pointer}

#documents{ background:#f2f2f2; width:645px; min-height:300px; padding:20px; margin:20px 0 20px 0; border:#ccc solid 1px}

ul.listDoc{ list-style-type:none;}
ul.listDoc li{ color:#666; font-size:11px; line-height:20px;}
ul.listDoc li a.telechargement{ display:block; width:160px; height:20px; background:url(../images/loupe.png) no-repeat top left; padding:0 0 0 25px; color:#4d9cb5; font-size:11px}
ul.listDoc li p{ float:left;margin-right:10px;}
ul.listDoc li p.liens{ float:right;}
#error{ margin:0 0 0 25px; color:red; font-size:11px}