﻿/*
 * -------------------------------------------------------
 *	Auteur 	: Damien GOERES - damiengoeres@yahoo.fr
 *	Date	: janvier 2005
 *	Pour 	: Fragrancedefrance
 *	Site 	: http://www.fragrancedefrance.com
 * -------------------------------------------------------
 */

html, body {
width: 100%;
height: 100%;
margin:0;
padding:0;
text-align: center; /* pour corriger le bug de centrage IE */
}

body {
font-family: "Bitstream Vera Sans", Arial, Helvetica, sans-serif;
font-size: 13px;
color: #666;
background: transparent url(bg.png);
}

a img { 
border:0; 
}

a {
color:#FF8800;
text-decoration:none;
}

a:hover {
color:#c9d1e5; 
text-decoration:none;
}

/* ------------------ INPUT BOUTON ------------------ */
input, textarea {
border: #ff8800 1px solid; 
font-size: 12px;
background: #f5f5f5; 
color: #666;
}

select {
border: #ff8800 1px solid; 
font-size: 12px;
color: #666; 
background: #eee; 
}

select:hover {
background: #c9d1e5;
}

input:focus, textarea:focus {
background: #c9d1e5;
font-weight:bold;
}

input.bouton {
margin-top: 5px;
padding: 2px;
letter-spacing: 1px;
border:1px solid #b0b0b0;
background: transparent;
color: #ff8800; 
font-weight:bold;
cursor: crosshair;
}

input.bouton:hover {
font-style: oblique;
color:#c9d1e5;
background: #f5f5f5;
border:1px inset #b0b0b0;
cursor: crosshair;
}

input.bouton:active {
border:1px inset #ff8800;
color:#B4E2F6;
background: #fefefe;
cursor: crosshair;
}

fieldset{
display: block;	/* mise en block de <a> pour lui donner des dimensions */
width:auto;
margin-left: 50px;
margin-right: 50px;
background: #eeeeee;
border: solid #b0b0b0 1px; 
text-align: left;
}

fieldset legend {
margin: 10px;
font-size: 18px;
font-weight: bold;
font-style: oblique;
color: #cecece;
}

fieldset img {
border:0;
margin:0;
padding-top:5px;
padding-left: 5px;
padding-right: 5px;
padding-bottom: 5px;
}

/* ------------------ CONTACT ------------------ */
#contact fieldset{
text-align: center;
}

#contact p{
padding-left: 40%;
}

/* ------------------ FACTURE ------------------ */
#facture{
background: #fff;
border: 1px inset #333; 
}

/* ------------------ PANNIER ------------------ */
#pannier fieldset{
text-align: center;
}

#pannier p{
padding-left: 40%;
}


/* ------------------ CHARGEMENT ------------------ */
#chargement{
position: absolute;
top: 50px;
left: 50px;
margin-left: auto;
margin-right: auto;
width: 80%;
padding: 50px;
color: #999;
text-align: center;
text-decoration: none;
background: #fef6eb; /*  #f1f3f5  */
border: 1px outset #ccc; 
}

#chargement h1 {
font-size: x-large; 
font-style: oblique;
font-weight: bold;
letter-spacing: 3px;
}

/* ------------------ HEADER ------------------ */
#header {
position: absolute;
top: 0;
left: 0;
width: 98%;
background: transparent;
z-index:0;
}

#header h1 {
margin: 0;
padding: 0;
margin-top: 10px;
margin-right: 5px;
text-align: right;
font-size: 1em;
font-weight: normal;
}

#header img { 
position: absolute;
left: 0px;
}


/* ------------------ FOOTER ------------------ */
#footer hr { 
padding:0;
margin: 0;
height: 0; 
border: dotted #808080 0px; 
border-top-width: 1px;
width: 100%;
margin-left: auto;
margin-right: auto;
}

#footer {
position: absolute;
bottom: 0;
padding: 0;
margin: 0;
width: 98%;

}

#footer a:hover {
color:#c9d1e5; 
text-decoration:none;
}

#footer h1{
font-size: 1px;
color: #fef6eb;
}

/* ------------------ citation -------------- */

div#citation {/* conteneur global et arrière-plan du titre de la citation */
position: absolute;
top: 40px;
right: 5px;
width: 150px;
background: url(top_citation.png) top left no-repeat;
}

div#bloccitation {/* arrière-plan bas et sur l'ensemble de la citation */
background: url(bottom_citation.png) bottom left no-repeat;
padding: 0; margin:0;
padding-bottom: 7px;
padding-left: 10px;
padding-right: 10px;
}

div#citation h1{
font-size: 11px;
font-weight: normal;
text-align: justify;padding: 0;
}

div#citation h2{
font-size: 11px;
font-weight: bold;
font-style: oblique;
text-align: right; padding: 0;
}

.lettrine{
font-size: 25px;
font-weight: bold;
color: #FF8800; /*ici : #cecece*/
}


/* ------------------ SENTEURS -------------- */

.senteurs {
padding-left: 130px;
}

.separation{
text-align: right;
font-size: 20px;
font-weight: bold;
color: #cecece;
}

.separation a {
font-size: 11px;
letter-spacing: 1px;
border:1px solid #b0b0b0;
background: transparent;
color: #ff8800; 
font-weight:normal;
}

.separation a:hover {
font-style: oblique;
color:#c9d1e5;
background: #f5f5f5;
border:1px inset #b0b0b0;
cursor: crosshair;;
}
/* ------------------ FAVORIS & NB VISITES ------------------ */
div#note {/* conteneur global et arrière-plan du titre de la note */
position: absolute;
bottom: 0px;
left: 10px;
width: 150px;
background: url(top_citation.png) top left no-repeat;
font-size: 11px;
text-align: left;
}

div#blocnote {/* arrière-plan bas et sur l'ensemble de la note */
background: url(bottom_citation.png) bottom left no-repeat;
padding-bottom: 0px;
padding-left: 10px;
padding-right: 10px;
}

div#blocnote h1{
font-size: 11px;
font-weight: normal;
text-align: justify;
}

/* ------------------ MAIN ------------------ */
#main {
position: absolute;
top: 80px;
left: 180px;
right: 30px; 
width: auto;
height: auto;
/*overflow: auto;  cette propriété va permettre le scroll de ce bloc */
background: #fff url(main_bg.png) top left repeat-y;
/*background: #eeeeee;*/
text-align: left;
padding:10px;
margin:0;
border-style: solid;
border-color: #808080; 
border-top-width: 1px;
border-top-color: #b0b0b0;
border-bottom-width: 3px;
border-left-width: 1px;
border-left-color: #b0b0b0;
border-right-width: 3px;
}

#main h1 {
margin: 0;
padding: 0;
padding-right: 130px;
text-align: right;
letter-spacing: 0.2em; 
color: #ff8800;
font-size: 25px;
font-style: oblique;
font-weight: bold;
height: 50px;
}

#main h2 {
margin: 0;
padding: 0;
padding-right: 130px;
text-align: right;
font-size: 14px;
}

#main h2 a {
margin-top: 5px;
padding: 2px;
letter-spacing: 1px;
border:1px solid #b0b0b0;
background: transparent;
color: #ff8800; 
font-weight:bold;
}

#main h2 a:hover {
font-style: oblique;
color:#c9d1e5;
background: #f5f5f5;
border:1px inset #b0b0b0;
cursor: crosshair;;
}

#main h3 {
font-size: 16px;
font-style: oblique;
font-weight: bold;
padding-right: 10px;
text-align: justify;
}

#main h3:first-letter {
font-size: 25px;
font-weight: bold;
color: #FF8800; /*ici : #cecece*/
font-style: oblique;
}


#main h5 {
font-size: 16px;
font-style: oblique;
font-weight: bold;
padding-right: 10px;
text-align: right;
}

#main h5:first-letter {
font-size: 25px;
font-weight: bold;
color: #FF8800; /*ici : #cecece*/
font-style: oblique;
}

#main h4 {
padding: 0;
margin: 0;
font-size: 13px;
text-align: center;
font-style: normal;
font-weight: normal;

}

#main hr { 
height: 0; 
border: dotted #808080 0px; 
border-top-width: 1px;
width: 100%;
margin-left: auto;
margin-right: auto;
}

#main p {
padding-right: 115px;
text-align: justify;
}

#main p:first-letter {
font-size: 25px;
font-weight: bold;
color: #FF8800; /*ici : #cecece*/
font-style: oblique;
}

#main table{
width: 90%;
margin-left:auto;
margin-right:auto;
}

/* -------------------- MENU --------------------*/
#menu ul, li { 		/* utilisation de liste pour le menu */
list-style-type: none;  /* suppression des puces de liste */
margin:0;
padding:0;
}

#menu ul {
position: absolute; /* positionnement pour IE5 et IE5.5 */
left: 10px;
top: 80px;
background: transparent url(menu_bg.png) top left no-repeat; /* arrière-plan général du menu */
height: 250px;
width: 150px;
text-align: left;
}

#menu li {
display: inline; /* correction pour IE5 et IE5.5 */
}

#menu li a { /* dimensions et définitions des boutons */
display: block;  /* mise en block de <a> pour lui donner des dimensions */
height: 25px;
width: 150px;
line-height: 25px;  /* hauteur de ligne pour éviter les paddings */
text-indent: 20px;
border: dotted 0px; 
background: transparent;
color: #ff8800;
}

#menu li a:hover, #menu li a:active {
color: #c9d1e5;
background: transparent url(menu_puce.gif) top left no-repeat;
text-indent: 20px;
font-style: oblique;
font-weight: bold;
border: dashed #808080 0px; 
/*border-bottom-width: 1px;*/
}

#menu a span {
display: none;
text-align: justify;
font-size: 11px;
background: transparent;
line-height: normal; 
}

#menu ul a:hover span, #menu ul a:active span, #menu ul a:focus span {
display: block;
position: absolute;
top: 260px;
left: 0px;
width: 130px;
background: url(bottom_citation.png) bottom left no-repeat;
border: solid #d0d0d0 0px;
border-top-width: 2px;
color: #b0b0b0;
padding-left: 10px;
padding-right: 10px;
}
