/*  ....................................  */
/*                                        */
/*  Positionnement, structure de la page  */
/*                                        */
/*  ....................................  */
body, html {
	margin:0;
	padding:0;
	background-color:#fff;
	font-family:Arial, Helvetica, sans-serif;
}

#container {
	width:950px; 
	margin:0 auto; 
	padding-top:15px;  /*  une petite marge blanche en haut  */
}

#main {
	position:relative; 
	background:#f49f24 url(../textile_flash/images/bg.gif) repeat-y top left;  /*  le fond orange et l'ombre sur les bords du site  */
	margin:0 ; 
	padding:0 15px; /* 15px pour l'ombre */
	height:600px; /* le height DOIT être présent (au moins à 1%) pour ie6 qui vire le background  (hazlayout)  */
	
}

/*  ..... la barre de navigation et le titre de la page ...............  */ 
#nav { 
	position:absolute;
	top:10px;
	left:20px;
}
/*   Barre de navigation  */

#nav ul {
	list-style:none;
	margin:0;
	padding:0;
}

#nav ul li {
	margin:0;
	padding:0;
	position:absolute;
	border:1px solid #fff;
	border-left:none;
	border-right:none;
}

#nav ul li a span {
	display:none;
	}

#nav ul li a {
	margin:0;
	padding:0;
	display:block;
	height:22px;
}

#nav ul li.accueil { top:0; left:0; }
#nav ul li.accueil a { width:134px; background:transparent url(../textile_flash/images/nav/accueil.gif) no-repeat top left; }

#nav ul li.catalogues { top:0; left:134px; }
#nav ul li.catalogues a {  width:134px; background:transparent url(../textile_flash/images/nav/catalogues.gif) no-repeat top left; }

#nav ul li.transfert { top:0; left:268px; }
#nav ul li.transfert a {  width:162px; background:transparent url(../textile_flash/images/nav/transfert.gif) no-repeat top left; }

#nav ul li.marques { top:23px; left:0; }
#nav ul li.marques a {  width:90px; background:transparent url(../textile_flash/images/nav/marques.gif) no-repeat top left; }

#nav ul li.logotheque { top:23px; left:90px; }
#nav ul li.logotheque a { width:89px; background:transparent url(../textile_flash/images/nav/logotheque.gif) no-repeat top left; }

#nav ul li.serigraphie { top:23px; left:179px; }
#nav ul li.serigraphie a {  width:183px; background:transparent url(../textile_flash/images/nav/serigraphie.gif) no-repeat top left; }

#nav ul li.contact { top:23px; left:362px; }
#nav ul li.contact a {  width:68px; background:transparent url(../textile_flash/images/nav/contact.gif) no-repeat top left; }

#nav ul li a:hover {background-position:bottom left;}

/*  Les titres des pages   */

h1 span {
	display:none;
}

h1 {
	position:absolute;
	top:55px;
	left:0;
	width:439px;
	height:58px;
	background:transparent url(../textile_flash/images/titres/blank.png) no-repeat top left;
	clear:both;
}

h1#catalogues  { background-image:url(../textile_flash/images/titres/catalogues.png)}
h1#transfert  { background-image:url(../textile_flash/images/titres/transfert.png)}
h1#logotheque  { background-image:url(../textile_flash/images/titres/logotheque.png)}
h1#marques  { background-image:url(../textile_flash/images/titres/marques.png)}
h1#serigraphie  { background-image:url(../textile_flash/images/titres/serigraphie.png)}
h1#contact  { background-image:url(../textile_flash/images/titres/contact.png)}             

 /*  ..... zonne d'affichage de l'information principale ...............  */
#content { 
	margin:0;
	padding:150px 5px 0 457px;
	background:transparent url(../textile_flash/images/bg-dgrd.jpg) no-repeat top left; /*  le dégradé du coin supérieur gauche  */
	border-bottom:1px solid #f49f24; /* pour qu'FF ne chasse pas ce qu'il y a plus bas  */
}

/*   ..... le logo, la baseline, les horaires et les contacts ...............  */
#info {  
	position:absolute;
	top:0;
	right:15px;
	width:475px;
}
#info p {
	font-size:11px;
	margin-left:10px;
	} 


/*  ..... l'image des deux personnages ...............   */
#persos { 
	position:absolute;
	bottom:0px; 
	left:15px;
}

/* .....  pied de page  ...............  */
#footer {
	position:relative;
	margin:0 0 10px;
	background:#fff url(../textile_flash/images/footer.jpg) top left no-repeat;
	height:100px;
	border-bottom:1px solid #fff;
	}
	
#liencompersonne {
	position:absolute;
	top:0;
	right:0;
	}
	
#footer p {
	margin:0;
	padding:90px 0 0 15px;
	color:#89a8ad;
	font-size:12px;
	text-align: justify;
	line-height:18px;
	}

	
.orange {
	color:#f49f24;
	}	
	
#footer a {
	color:#89a8ad; 
	text-decoration:none;
	padding:0 15px 0  0 ;
	margin:0;
	}

#footer p a {
	margin:0;
	padding:0;
	
	}
	
#footer a:hover {
	color:#000;
	}

#retour {
	margin:0;
	padding:0;
	}


img {
	border:none; 
	text-decoration:none;
}
/*  fin de pied de page  */



/*   Typographie    */
h1 {
	padding:0;
	margin: 0;
	}

h2 {
	color:#fff;
	font-size:18px;
	padding:0;
	margin:0.8em 0 0.5em;
	}

h3 {
	color:#fff;
	font-size:14px;
	font-weight:100;
	padding:0;
	margin:0;
	}

	
p {
	margin:0;
	padding:0;
	color:#fff;
	font-size:13px;
	}	

a {
	color:#fff;
	text-decoration:underline;
	}

a:hover {
	color:#000;
	}

label {
	color:#fff;
	font-size:11px;
	}

/*  fin de typographie  */

/*  ......... tableaux ........  */


table {
	width:400px;
	margin:0 0 10px 0;
	padding:0;
	background-color:#fff;
	border:1px solid #000;
	color:#000;
	font-size:11px;
	text-align:center;
}
	
table td {
	padding:2px;
}
	
.fonce {
	background-color:#f49f24;
}	

/*   pour la logotheque    */

#visuels div {
	width:200px;
	height:200px;
	float:left;
	}



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