﻿/*********************************************************/
/*positionnement global des differents elements du site*/
/*******************************************************/
@charset "utf-8";
html, body { 
	width: 100%;
	z-index: 0;
	background-color: #FFFFFF;
}
.ensembl {   /*conteineur du site*/
	background-color: #FFFFFF;
	height: 892px;
	width: 772px;
	margin: 0 auto 0 auto;
}
#haut {   /*containeur du bandeau, donc une image*/
	background-image: url(images/bande.jpg);
	height: 66px;
	width: 772px;
	margin-left: 0px;
	margin-top: -15px;
}
#acceuil {   /*gros bouton horizontal accueil*/
	height: 32px;
	width: 333px;
	margin-top: 0px;
	margin-left: 0px;
}
#new  {   /*gros bouton horizontal new*/
	height: 31px;
	width: 91px;
	margin-top: -16px;
	margin-left: 166px;
}
#cata {   /*gros bouton horizontal catalogue*/
	height: 31px;
	width: 126px;
	margin-top: -47px;
	margin-left: 423px;	
}
#soci {   /*gros bouton horizontal societe*/
	height: 31px;
	width: 102px;
	margin-top: -31px;
	margin-left: 549px;	
}
#conta {  /*gros bouton horizontal contact*/
	height: 31px;
	width: 121px;
	margin-top: -31px;
	margin-left: 651px;	
}
#uk_acceuil {   /*gros bouton horizontal accueil*/
	height: 32px;
	width: 279px;
	margin-top: 0px;
	margin-left: 0px;
}
#uk_new  {   /*gros bouton horizontal new*/
	height: 31px;
	width: 80px;
	margin-top: -32px;
	margin-left: 279px;
}
#uk_cata {   /*gros bouton horizontal catalogue*/
	height: 31px;
	width: 113px;
	margin-top: -31px;
	margin-left: 359px;	
}
#uk_soci {   /*gros bouton horizontal societe*/
	height: 31px;
	width: 202px;
	margin-top: -31px;
	margin-left: 472px;	
}
#uk_conta {  /*gros bouton horizontal contact*/
	height: 31px;
	width: 98px;
	margin-top: -31px;
	margin-left: 674px;	
}
#goch {   /*containeur des menus, donc une image*/
	background-image: url(images/colonne.jpg);
	height: 794px;
	width: 197px;
	margin-left: 0px;
	margin-top: 0px;
	background-repeat: no-repeat;
}
#contenu {  /*conteneur des page au milieu*/
	height: 694px;
	width: 575px;
	margin-left: 197px;
	margin-top: -790px;
	background-color: #FFFFFF;
}
#text_tempo {   /*du texte temporaire, cette classe est à supprimer par la suite*/
    height: 21px;
	width: 400px;
	font: verdana;
	text-transform: uppercase;
	font-size: 16px;
	color: #000000;
	padding-left: 30px;
	padding-top: 100px;
}
#bas {  /*containeur du pied de page*/
	background-image: url(images/pied_page.gif);
	background-repeat: no-repeat;
	height: 36px;
	width: 575px;
	margin-left: 196px;
	margin-top: 60px;
}

/***********************************/
/*positionnement des textes*/
/***********************************/

.text_boite {  /*conteneur du texte */
	height: 689px;
	width: 560px;
	margin-left: 15px;
	margin-top: 0px;
	z-index: 2;
	overflow: auto;
}
.text_ok {  /*positionnement dutexte*/
    width: 550px;
	margin-left: 10px;
	margin-top: 10px;
	font: verdana;
	font-size: 13px;
	color: #000000;
	z-index: 2;
}
.text_long {  /*positionnement dutexte*/
    margin-left: 0;
	margin-top: 10px;
	font: verdana;
	font-size: 13px;
	color: #000000;
	z-index: 2;
	overflow: auto;
	}
	
.titr1  {
    font: verdana;
	font-size: 12px;
	color: #003366;
}
.titr2  {
    font: verdana;
	font-size: 11px;
	color: #006699;
}

/*************************************************************************************************************************/
/*Ci-dessous, les styles du  menu catalogue, cata_menu.html,  tu peux reproduire ce menu pour tous les autres rubriques  */
/************************************************************************************************************************/

.menugoch { /*positionnement des menus*/
	height: 600px;
	width: 157px;
	padding-left: 40px;
	padding-top: 150px;
	overflow: hidden;
	z-index: 4;
}
.urbangreymenu{
width: 160px; /*longueur du menu global*/
}
.urbangreymenu{
width: 160px; /*longueur du menu global*/
}
.urbangreymenu .headerbar{ /*styles du menu-titre*/
font: bold 9px Verdana;
color: white;
margin-bottom: 0; /*espace entre le menu-titre et le reste*/
text-transform: uppercase;
padding: 0px 0 0px 5px; /*5px c'est l'indentation du menu-titre*/
}
.urbangreymenu .headerbar a{  /*style que prend le menu-titre en tant que lien*/
text-decoration: none;
color: #ffffff;
display: block;
}
.urbangreymenu ul{   /*style des sous-menu*/
list-style-type: none;
margin: 0;
padding: 0 0 0 25px;
margin-bottom: 0; /*espace entre un sous-menu et le reste*/
}
.urbangreymenu ul li{
padding-bottom: 1px; /*espace entre chaque rubrique menu */
}
.urbangreymenu ul li a{  /*style que prend les sous-menu en tant que liens*/
font: bold 10px Verdana;
color: #ffffff;
display: block;
padding: 1px 0;
line-height: 16px;
padding-left: 8px; /*8px c'est l'indentation des sous-menu*/
text-decoration: none;
}
.urbangreymenu ul li a:visited{ /*couleur des liens visités*/
color: #999999;
}
.urbangreymenu ul li a:hover{ /*couleur des liens effleurés*/
color: #cccccc;
}

/*******************************************************************/
/*positionnement des elements de la page d'accueil des registres */
/*****************************************************************/

.description_article {  /*conteneur du texte en bas à droite*/
	font: verdana;
	font-size: 12px;
	color: #000000;
	z-index: 6;
	overflow: hidden;
}

.registr_detail {   /*conteneur des images-articles */
	height: 694px;
	width: 575px;
	z-index: 4;
	margin-top: 0;
	margin-left: 0;
}
.arti_genera1{   /*positionnement du 1er article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	padding-left: 12px;
	padding-top: 15px;
	z-index: 4;
}
.arti_genera2{  /*positionnement du 2e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 200px;
	margin-top: -200px;
	z-index: 4;
}
.arti_genera3{   /*positionnement du 3e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 390px;
	margin-top: -200px;
	z-index: 4;
}
.arti_genera4{   /*positionnement du 4e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 12px;
	margin-top: 30px;
	z-index: 4;
}
.arti_genera5{  /*positionnement du 5e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 200px;
	margin-top: -200px;
	z-index: 4;
}
.arti_genera6{   /*positionnement du 6e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 390px;
	margin-top: -195px;
	z-index: 4;
}
.arti_genera7{   /*positionnement du 7e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 12px;
	margin-top: 25px;
	z-index: 4;
}
.arti_genera8{   /*positionnement du 8e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 200px;
	margin-top: -200px;
	z-index: 4;
}
.arti_genera9 {  /*positionnement du 9e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 390px;
	margin-top: -200px;
	z-index: 4;
}
.arti_genera10 {  /*positionnement du 9e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 12px;
	margin-top: 30px;
	z-index: 4;
}
.arti_genera11 {  /*positionnement du 9e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 196px;
	margin-top: -200px;
	z-index: 4;
}
.arti_genera12 {  /*positionnement du 9e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 390px;
	margin-top: -200px;
	z-index: 4;
}
.arti_genera13 {  /*positionnement du 9e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 12px;
	margin-top: 30px;
	z-index: 4;
}
.arti_genera14 {  /*positionnement du 9e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 196px;
	margin-top: -200px;
	z-index: 4;
}
.arti_genera15 {  /*positionnement du 9e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 390px;
	margin-top: -200px;
	z-index: 4;
}
.arti_genera16 {  /*positionnement du 9e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 12px;
	margin-top: 30px;
	z-index: 4;
}
.arti_genera17 {  /*positionnement du 9e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 196px;
	margin-top: -200px;
	z-index: 4;
}

/*******************************************************************/
/*positionnement des elements de la page d'accueil des cartes */
/*****************************************************************/

.carte_genera1{   /*positionnement du 1er article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	padding-left: 70px;
	padding-top: 30px;
	z-index: 4;
}
.carte_genera2{  /*positionnement du 2e article dans la page d'accueil des registres*/
	height: 200px;
	width: 180px;
	margin-left: 300px;
	margin-top: -200px;
	z-index: 4;
}
/************************************************************************************************/
/*positionnement des images et textes de la page detail pour chaque article dans registre */
/**********************************************************************************************/

.arti_titre { /*conteneur des titres des articles */
	font: verdana;
	font-size: 12px;
	color: #003366;
	margin-left: 10px;
	text-transform: uppercase;
}
.articl_detail {   /*conteneur des articles et textes */
	height: 684px;
	width: 575px;
	z-index: 6;
	margin-top: 0;
	margin-left: 0;
}
.arti_detail1 {   /*positionnement de l'image de gauche */
	height: 300px;
	width: 250px;
	padding-top: 30px;
	margin-left: 20px;
	z-index: 6;
	border-width: 1px;
	border-style: solid;
	border-color: #cccccc;
}
.arti_detail2 {  /*positionnement de l'image de droite en haut*/
	height: 145px;
	width: 250px;
	z-index: 6;
	border-width: 1px;
	border-style: solid;
	border-color: #cccccc;
	margin-top: -330px;
	margin-left: 300px;
}
.arti_detail3 {   /*positionnement de l'image de droite en bas*/
	height: 145px;
	width: 250px;
	border-width: 1px;
	border-style: solid;
	border-color: #cccccc;
	z-index: 6;
	margin-top: 30px;
	margin-left: 300px;
}
.arti_detail_tex1 {   /*conteneur du texte en bas à gauche*/
	height: 180px;
	width: 250px;
	font: verdana;
	font-size: 11px;
	color: #000000;
	border-width: 1px;
	border-style: solid;
	border-color: #cccccc;
	z-index: 6;
	overflow: hidden;
	margin-top: 50px;
	margin-left: 20px;
}

.arti_detail_tex2 {  /*conteneur du texte en bas à droite*/
	height: 180px;
	width: 250px;
	font: verdana;
	font-size: 11px;
	color: #000000;
	border-width: 1px;
	border-style: solid;
	border-color: #cccccc;
	z-index: 6;
	overflow: hidden;
	margin-top: -182px;
	margin-left: 300px;
}

/***********************************************************************************/
/*positionnement des images et textes de la page detail pour les spécifiques*/
/********************************************************************************/
.arti_spe_nuances {   /*conteneur du texte en bas à gauche*/
	height: 50px;
	width: 400px;
	font: verdana;
	font-size: 11px;
	color: #000000;
    z-index: 6;
	overflow: hidden;
	margin-top: 50px;
	margin-left: 20px;
}

.arti_spe_tex1 {   /*conteneur du texte en bas à gauche*/
	height: 180px;
	width: 250px;
	font: verdana;
	font-size: 11px;
	color: #000000;
	border-width: 1px;
	border-style: solid;
	border-color: #cccccc;
	z-index: 6;
	overflow: hidden;
	margin-top: 25px;
	margin-left: 20px;
}

.arti_spe_tex2 {  /*conteneur du texte en bas à droite*/
	height: 180px;
	width: 250px;
	font: verdana;
	font-size: 11px;
	color: #000000;
	border-width: 1px;
	border-style: solid;
	border-color: #cccccc;
	z-index: 6;
	overflow: hidden;
	margin-top: -182px;
	margin-left: 300px;
}
/***********************************************************************************/
/*styles des 2 liens dans la rubrique societe*/
/********************************************************************************/

.soci_rubrik1 {   /*positionnement du lien, desplanches s.a,  dans le menu*/
	height: 12px;
	width: 100px;
	font: verdana;
	text-transform: uppercase;
	font-size: 9px;
	color: #FFFFFF;
	padding-left: 20px;
	padding-top: 80px;
}
.soci_rubrik2 {  /*positionnement du lien, made in france,  dans le menu*/
	height: 12px;
	width: 100px;
	font: verdana;
	text-transform: uppercase;
	font-size: 9px;
	color: #FFFFFF;
	padding-left: 20px;
	padding-top: 16px;
}

/******************************/
/*styles des liens en general*/
/*****************************/

 A:link {   /*style que prend les liens en general*/
    color: #ffffff;
    text-decoration: none;
}
A:visited {  /*style que prend les liens visités en general*/
    color: #999999;
	text-decoration: none;
}
A:hover {  /*style que prend les liens effleurés en general*/
   color: #cccccc;
   text-decoration: none;
}
