/*********************** Marges et couleur de fond de la page *******************************/
body { background-color: #CCCCCC; margin-left: 0px; margin-bottom: 0px; margin-right: 0px; margin-top: 0px; background-image: url(../images/fond_body.jpg); }
/************************Fin marges et couleur de fond de la page ***************************/

/****************** Définition des dimension et de la position de la page *******************/
#page { position:relative; width:100%;  z-index:5; top: 0px; height: 1000px; background: #FFFFFF; }
/*************** FIN  Définition des dimension et de la position de la page *****************/

/**************************************************************************************************/
/********************** LOGO EN HAUT A GAUCHE DE LA PAGE *************************/
/*************************************************************************************************/
#logo { position:absolute; left:0px; top:0px; width:195px; height:64px; z-index:2; }
.arial12orange {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #FF6600;
}
.arial11noir {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
}
.arial12vert {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #89CF02;
}
.arial12rose {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #EF04B5;
}
.arial12bleu {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #00C2FF;
}
.arial12jaune {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #FFD800;
}
.arial12rouge {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #FF0000;
}
.arial12gris {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #B2B2B2;
}
/*********************************FIN DU LOGO************************************************/

/******************Entête de page contenant texte descriptif en haut de page *************/
#entete { position:absolute; left:195px; top:0px; height:31px; z-index:11; padding-left: 4px; padding-top: 2px; }
/* Police du contenu de l'entete reconditionne la balise H1*/
.Arial10noir {font-family: Arial, Helvetica, sans-serif; font-size: 10px; color: #000000; }
/***************Fin Entête de page contenant texte descriptif en haut de page ***********/

/**************************************************************************************************/
/************************* Contener du Menu Principal Horizontal ***************************/
/**************************************************************************************************/
#menu { position:absolute; left:199px; top:33px;height:36px; z-index:1; overflow: visible; }
	/* Accueil 1 ForNext */ 
	#menu_accueil { position:absolute; left:1px; top:0px; width:76px; height:32px; z-index:2; }
	/* Espace 1 avec pointillés */
	#espace_menu1 { position:absolute; left:76px; top:0px; width:4px; height:36px; z-index:2; }
	/* Services 2 ForNext */
	#menu_services { position:absolute; left:80px; top:0px; width:76px; height:36px; z-index:2; }
	/* Espace 2 avec pointillés */
	#espace_menu2 { position:absolute; left:156px; top:0px; width:4px; height:36px; z-index:2;}
	/* Graphisme 3 ForNext */
	#menu_graphisme { position:absolute; left:160px; top:0px; width:76px; height:36px; z-index:2; }
	/* Espace 3 avec pointillés */
	#espace_menu3 { position:absolute; left:236px; top:0px; width:4px; height:36px; z-index:2; }
	/* Développement 4 ForNext */
	#menu_developpement { position:absolute; left:240px; top:0px; width:76px; height:36px; z-index:2; }
	/* Espace 4 avec pointillés */
	#espace_menu4 { position:absolute; left:316px; top:0px; width:4px; height:36px; z-index:2; }
	/* Visibilité 5 ForNext */
	#menu_visibilite { position:absolute; left:320px; top:0px; width:76px; height:36px; z-index:2; }
	/* Espace 5 avec pointillés */
	#espace_menu5 { position:absolute; left:396px; top:0px; width:4px; height:36px; z-index:2; }
	/* Hébergement ForNext */
	#menu_hebergement { position:absolute; left:400px; top:0px; width:76px; height:36px; z-index:2; }
	/* Espace 6 avec pointillés */
	#espace_menu6 { position:absolute; left:476px; top:0px; width:4px; height:36px; z-index:2; }
	/* Contact et Devis 7 ForNext */
	#menu_contact { position:absolute; left:480px; top:0px; width:76px; height:36px; z-index:2; }
/***************************FIN DU MENU PRINCIPAL HORIZONTAL ***************************/

/****************************************************************************************************************/
/**************************************** Contener du menu vertical ****************************************/
/****************************************************************************************************************/
#menuvertical {	position:absolute; 	left:33px;	top:165px; width:167px; height:443px; z-index:6; }
	/* carré intérieur gauche du menu */
	.carreorange {position:absolute; left:1px; top:0px; width:13px; height:13px; z-index:6; background: #FF6600; }
	/* Lignes du Menu vertical */
	#mv1 { position:absolute; left:0px; top:2px; width:143px; height:13px; z-index:6;	padding-left: 25px; padding-top: 7px; }
	#mv2 { position:absolute; left:0px; top:24px; width:143px; height:13px; z-index:6; padding-left: 25px; padding-top: 7px; }
	#mv3 { position:absolute; left:0px; top:46px; width:143px; height:13px; z-index:6; padding-left: 25px; padding-top: 7px; }
	#mv4 { position:absolute; left:0px; top:68px; width:143px; height:13px; z-index:6; padding-left: 25px; padding-top: 7px; }
	#mv5 { position:absolute; left:0px; top:90px; width:143px; height:13px; z-index:6; padding-left: 25px; padding-top: 7px; }
	#mv6 { position:absolute; left:0px; top:112px; width:143px; height:13px; z-index:6; padding-left: 25px; padding-top: 7px; }
	#mv7 { position:absolute; left:0px; top:134px; width:143px; height:13px; z-index:6; padding-left: 25px; padding-top: 7px; }
	#mv8 { position:absolute; left:0px; top:156px; width:143px; height:13px; z-index:6; padding-left: 25px; padding-top: 7px; }
	#mv9 { position:absolute; left:0px; top:178px; width:143px; height:13px; z-index:6; padding-left: 25px; padding-top: 7px; }
	#mv10 { position:absolute; left:0px; top:200px; width:143px; height:13px; z-index:6; padding-left: 25px; padding-top: 7px; }
	/* Lien hypertextedumenu vertical */
	a.menuvertical{ font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #000000; text-decoration: none; }
	a.menuvertical:hover{ font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #000000; text-decoration: underline; }
/************************************Fin du menu Vertical ***************************************/

/***************************************************************************************************/
/************************* Contener des Coordonnées ForNext *******************************/
/**************************************************************************************************/
#call { position:absolute; left:0px; top:64px; width:195px; height:100px; z-index:3; }
	#coordonnees { position:absolute; left:97px; top:0px; width:98px; height:100px; z-index:4; background: #000000; background-color: #000000; padding-left: 5px; }
/*****************Fin dees coordonnées ForNext *******************************************/

/*************Rectangle Campagne de communication et Achats de Mots-clés *********/
#campagnecomm { position:absolute; left:777px; top:85px; width:158px; height:180px; z-index:6; background: #000000; padding-top: 10px; }
#gestioncampagnecomm { position:absolute; left:777px; top:33px; width:158px; height:50px; z-index:6; background: #000000; padding-top: 4px; }
#marketing { position:absolute; left:777px; top:275px; width:158px; height:19px; z-index:7; background: #000000; }
/* Police contenu dans le rectangle campagne de communication */ 
.Arial11blanc { font-family: Arial, Helvetica, sans-serif; font-size: 11px; color: #FFFFFF; }
.Arial14blancbold { font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #FFFFFF; }

/* bande déco grise à gauche */
#grisgauche { position:absolute; left:0px; top:164px; width:31px; height:838px; z-index:6; background: #5F5F5F; }

/*********************** Contenu de la page Qui sommes-nous **********************/
#qui { position:absolute; left:218px; top:114px; width:535px; height:530px; z-index:2; }
	/* titre du contenu */
	#titrecontenu { position:absolute; left:219px; top:85px; width:384px; height:19px; z-index:6; }
	/* Illustration de la page Qui sommes-nous */
	#photo_qui { position:absolute; left:690px; top:115px; width:80px; height:630px; z-index:6; background-image: url(../images/qui.gif); background-repeat: repeat-y; }
/*****************************Fin contenu Qui sommes-nous *************************/

/*****************************Pied de page Accueil ForNext **************************/
#navigationpiedpage {
	position:absolute;
	left:31px;
	top:683px;
	height:13px;
	z-index:6;
	width: 96%;
}
/**********************Fin Pied de page Accuel ForNext******************************/

/***********************Mots-clés Pied de page ***************************************/
#piedpageaccueil { position:absolute; left:31px; top:704px; width:96%; height:26px; z-index:2; }
/************************Fin Mot-clés pied de page **********************************/

/********************************Logo plaquette bleue ForNext **********************/
#plaquette {	position:absolute; left:0px; top:234px; width:158px; height:188px; z-index:6; padding-right: 5px; 	padding-left: 5px;}
/******************************Fin Logo plaquette bleue ForNext ********************/

#copyright {	position:absolute; left:219px; top:698px; width:700px; height:17px; z-index:6;}

#adressefornext { position:absolute; left:31px; top:737px; width:96%; height:20px; z-index:6;}

#devis { position:absolute; left:597px; top:331px; width:158px; height:249px; z-index:6;}

#rappel_gratuit { position:absolute; left:778px; top:364px; width:158px; height:54px; z-index:6;}

#footcopyryght { position:relative; left:10px; top:621px; width:96%; height:18px; z-index:4; background-color: #CCCCCC; margin: auto;}

#realisations { position:absolute; left:777px; top:421px; width:158px; height:187px; z-index:7; background-color: #E2E2E2; border: 1px solid #999999;}

#portfolio { position:absolute; left:4px; top:24px; width:150px; height:159px; z-index:6; background-color: #FFFFFF;}

#Layer1 {
	position:absolute;
	left:494px;
	top:164px;
	width:167px;
	height:119px;
	z-index:6;
}
#cprght {
	position:absolute;
	left:10px;
	top:658px;
	width:96%;
	height:18px;
	z-index:4;
	background-color: #CCCCCC;
	margin: auto;
}
#Layer3 {
	position:absolute;
	left:713px;
	top:384px;
	width:158px;
	height:228px;
	z-index:6;
}
#Layer4 {
	position:absolute;
	left:777px;
	top:421px;
	width:158px;
	height:187px;
	z-index:7;
	background-color: #E2E2E2;
	border: 1px solid #999999;
}
#Layer5 {
	position:absolute;
	left:4px;
	top:24px;
	width:150px;
	height:159px;
	z-index:6;
	background-color: #FFFFFF;
}
#Layer6 {
	position:absolute;
	left:31px;
	top:661px;
	width:96%;
	height:7px;
	z-index:7;
	background-color: #CCCCCC;
}
#Layer7 {
	position:absolute;
	left:31px;
	top:701px;
	width:96%;
	height:2px;
	z-index:6;
	background-color: #CCCCCC;
}
#exterieur {
	position:absolute;
	left:778px;
	top:298px;
	width:158px;
	height:63px;
	z-index:6;
}
