/* 
 * Copyright (c) 2007 Copyright (c) Makina-Corpus
 * Ce template a ete realise par http://www.makina-corpus.com
 * Il est soumis à la licence GPL
 */


/* Elements HTML en general
-------------------------------------------------------- */

body {
	padding: 0;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	text-align: center;
	background-color: #FFF;
	font-size: 0.8em;
    color:#5A5A5A;
}

h1, h2, h3{
	font-family: sans-serif;
    color: #FA199A;
}

h1{
	font-size: 1.8em;
	margin: 0;
	padding: 0;
    text-transform: uppercase;
}

h2{
	font-size: 1.5em;
	margin: 0;
	padding: 0;
}
h3{
	font-size: 1.1em;
	margin: 0;
	padding: 0;
}

hr {
    margin: 20px 0 5px 0;
    padding: 0;
    border: solid #666 1px;
    border-width: 1px 0 0 0;
    line-height:  1px;
    height:  1px;
    font-size: 0;
    clear: both;
}

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

a:visited {
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

img {
	border: 0
}

br {
    clear: both;
}

fieldset {
    border: none;
    
}

button {
    cursor: pointer;
}

button.retour {
    background: transparent url(images/bouton-retour.jpg) no-repeat;
    width: 87px;
    height: 27px;
    border: none;
}

button.rechercher {
    border: none;
    background: transparent url(images/fleche.jpg) no-repeat;
    padding-left: 25px;
    font-weight: bold;
    display: block;
    float: right;
    margin: 10px 0;
    color:#FA199A;
}

button.rechercher_colle {
    display: inline;
    border: none;
    background: transparent url(images/fleche.jpg) no-repeat;
    padding-left: 25px;
    font-weight: bold;
    color:#FA199A;
}
em {
    color:#9E9E9E;
    font-style: italic;
}

blockquote {
    background-color: #FFF;
    border: dashed 1px #CCC;
    margin: 0;
    padding: 5px;
}

blockquote strong{
    color:#FA199A;
    text-transform: capitalize;
}

blockquote strong.tons{
    padding-left:103px;
}

p {
    clear: both;
    color: #000;
}

.suite {
    display: block;
    text-align: right;
    margin: 10px 0;
    font-weight: bold;
}
.suite span {
    color:#9E9E9E;
}
/* Page
-------------------------------------------------------- */

#wrapper {
	width: 980px;
	text-align: left;
	overflow: visible;
	position: relative;
	margin: 0 auto;
    padding: 10px 0 0 0 ;
    background: #FFF url(images/fond-top.jpg) no-repeat left top;
}

#subwrapper {
	overflow: hidden;
	position: relative;
	padding: 0 ;
	width: 980px;
    background: #FFF url(images/fond-page.jpg) repeat-y left;
}

#content {
	padding: 0 10px;
    margin: 0 10px;
	clear: both;
}

#left-content, #left-produit, #left-panier, #left-contenu, #left-dossier {
    width: 780px;
    float: left;
}

 #left-panier, #left-contenu, #left-dossier  {
    width: 770px;
}

#right-content {
    float: right;
}

#manchette {
    float: left;
    width: 378px;
    padding: 0 10px
}


#contenu {
	width:510px;
	padding: 10px;
	margin: 0 0 10px 10px;
    +margin-left: 0;
    border-left: solid 1px #E6468F;
    border-right: solid 1px #E6468F;
    float: left;
    background: #F5F7E1 url(images/fond-boutique.jpg) no-repeat top right;
}

#contenu h1{
    font-style: italic;
}


#left-produit #contenu{
    width: auto;
    margin: 0 10px 10px 0;
    border-width: 0 2px;
}

#left-panier #contenu{
    width: 749px;
    margin: 0 10px 10px 0;
    border: none;
    background: none;
}

#left-contenu #contenu {
    width: 749px;
    margin: 0 10px 10px 0;
    +margin-right: 0;
    border: none;
    background: none;
}

#left-dossier #contenu{
    width: 749px;
    margin: 0 ;
    border: none;
    background: none;
}

#left-dossier h2, #manchette h2{
    color:#666666;
    font-size: 14px;
}

#manchette h1{
    font-size: 18px;
    font-style: italic;
}

#left-dossier hr{
    margin: 20px 0;
}

.dossierImage{
    display: block;
    float: left;
    padding: 0 5px 5px 0;
    clear: both;
}

.dossierImage img{
    float: left;
}

.contenuImage{
    display: block;
    float: left;
    border:1px solid #E6468F;
    margin: 0 5px 5px 0;
}

.contenuImage img{
    float: left;
}

.textePage {
	color: #141414;
	text-align: left;
	font-weight: bold;
	margin-top: 5px;
	margin-bottom: 5px;
}

.separation {
	height: 1px;
	width: 775px;
	background-color: #7f8eb9;
	margin-top: 5px;
	margin-bottom: 5px;
	overflow:hidden;
	zoom:1;
}

#right-content p {
    color:#5A5A5A;
}

p.voir {
    text-align: center;
}

p.voir a {
    background: transparent url(images/plus.jpg) no-repeat center left;
    padding-left: 20px;
    color: #5A5A5A;
    font-size: 16px;
}

/* Entete
-------------------------------------------------------- */

#entete {
	background: #FA199A url(images/fond-header.jpg) no-repeat left top;
	width: 980px;
    height: 186px;
	color: #FFFFFF;
}

#info {
    width: 190px;
    padding: 20px 30px 0 20px;
    float: right;
    height: 166px;
    color: #112FF0;
    position: relative;
}

#info a {
    font-size: 0.8em;
    color: #112FF0;
}

.logo {
	width: 260px;
	margin: 0;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 10px;
}

#monCompte {
}

#monCompte h3{
    text-transform: uppercase;
}

.formMonCompte {
}

.blocMonCompte {
    position: relative;
    top: 0;
}

#monCompte #connex {
    margin: 0;
}

.champFormMonCompte {
	font-size: 0.9em;
	padding: 0;
	margin-top: 10px;
	border: 1px solid #12335B;
	overflow: hidden;
	zoom: 1;
}

.champFormMonCompte {
    width: 140px;
}

.menuMonCompte {
	margin-top: 5px;
    height: 70px;
}

#monPanier {
	text-align: right;
    position: absolute;
    font-size: 0.8em;
    bottom:25px;
    left:20px;
}

.boutonMonCompteEntete {	
    position: absolute;
/*     right: 0; */
    left: 156px;
    top: 20px;
    height: 24px;
    width: 34px;
    border: solid #FFF 1px;
    background: #CE8CB8;
    color: #FFF;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
}

.LIEN_entete_panier {
bottom:5px;
cursor:pointer;
height:30px;
left:159px;
position:absolute;
width:40px;
}

/* Navigation horizontale
-------------------------------------------------------- */
#navh {
    height: 28px;
    font-weight: bold;
    font-size: 12px;
    background: #FA199A;
    margin: 0 10px;
}

#navh ul{
    float: left;
    padding-left: 5px;
}

#navh li{
    display: inline;
    border-right: solid #FFF 1px;
    line-height: 28px;
    padding: 2px 5px 0 5px;
}

#navh li.no-border {
    border: none;
}

#navh a{
    color: #FFF;
}

#navh #conditions{
    font-size: 14px;
    display: block;
    float: right;
    background: transparent url(images/fond-menu-conditions.jpg) no-repeat;
    width: 169px;
    height: 22px;
    margin: 2px 4px 4px 0;
    color: #FFF;
    line-height: 22px;
    text-align: center;
    text-transform: uppercase;
}
/* Chemin
-------------------------------------------------------- */

#chemin {
    margin-left: 10px;
    padding: 3px 0 0 20px;
	color: #989898;
	font-size: 11px;
    height: 28px; 
    clear:both;
}

#chemin a {
    color: #989898;
}

/* Produit petit & grand
-------------------------------------------------------- */

.ListeProduitsPetits {
    margin:0 auto;
}

.produitPetit {
    margin: 0 6px 6px 0;
	padding: 3px 6px 6px 6px;
    position: relative;
    float: left;
    width: 107px;
    border: solid #666 1px;
    background-color: #FFF;
}

.contourImage {
   margin: 0 auto;
    display: block;
}

.titreProduit {
	font-size: 11px;
    text-transform: uppercase;
    font-weight: normal;
    height: 30px;
    margin: 0;
    overflow: hidden;
}

.chapoProduit {
	margin-bottom: 5px;
}

.descriptionProduit {
	margin-top: 5px;
	margin-bottom: 10px;
}

.prixProduit {
	margin-top: 5px;
}

#photosProduit {
    width: 300px;
    padding-right: 10px;
    float: left;
}

#photosProduit .contourImage{
    border:1px solid #E6468F;
    margin: 0;
}

#photozoom {

}

#photosProduit #photozoom-vignette {
    display: block;
    float: left;
    margin: 6px 5px 6px 0; 
}

.ficheProduit {
    width: 436px;
    float: right;
    padding-right: 0px;
}

.cadre {
    display: block;
    width: 107px;
    height: 90px;
    background-color: transparent;
    overflow: hidden;
}

.cdc_oui {
    background: transparent url(images/coeur.gif) no-repeat;
    width: 31px;
    height: 27px;
    position: absolute;
    top: 15px;
    right: 0px;
}

.cdc_non {
    display: none;
}

.ficheProduit .cdc_oui{
    position: static;
    width: auto;
    padding-left: 35px;
    font-weight: bold;
    font-size: 14px;
    color:#E6468F;
}

.ficheProduit p, #photosProduit p{
    color:#5A5A5A;
}

.ficheProduit blockquote .variete{
    margin-top: 0;
}

.ficheProduit strong.nondispo {
    color: #FA199A;
    display: block;
    clear: both;
    padding: 10px;
}

.ficheProduit blockquote .variete strong{
    color:#5A5A5A;
    font-size: 16px;
}
.ficheProduit .quantite input {
    width: 20px;
}

.ficheProduit button.prendre {
    display: block;
}

a.LIEN_savoir{
    background: transparent url(images/plus.jpg) no-repeat center right;
    margin-top: 8px;
    padding: 0 20px 0 0;
    float: left;
    width: 55px;
}

a.LIEN_commander {
    background: transparent url(images/panier.jpg) no-repeat ;
    height: 21px;
    width: 20px;
    margin: 3px 3px 0 0;
    display: block;
    float: right;
}


#left-produit button.retour{
    clear: both;
}

/* Nombre de pages
-------------------------------------------------------- */

#pages {
    clear: both;
	text-align: right;
	font-size: 0.9em;
	padding-top: 10px;
	margin: 0;
	padding-bottom: 10px;
	color: #12335B;
}

#pages span{
    border:1px solid #FA199A;
    padding: 3px 6px;
    background-color: #FFF;
    color:#9E9E9E;
    font-weight: bold;
}

#pages a.LIEN_pages {

}


#pages a.LIEN_pages span {
    color:#FA199A;
}


/* Pied de page
-------------------------------------------------------- */

#footer{
    clear: both;
	margin: 0 10px 0 10px;
	padding-top: 10px;
    background-color: #E85F9A;
}

#footer div, #footer dl {
    float: left;
    padding: 10px;
}

#footer #paiements{
    width: 300px;
}

#footer #paiements p{
    background: url(images/securise.png) no-repeat left top;
    padding-left: 18px;
    margin-top: 0;
}

#footer #list{

}

#footer dt a{
    color: #5A5A5A;
    font-weight: bold;
}

#footer div#contact{
    float: right;
}

#footer #contact p, #footer #contact img {
    float: left;
    clear: none;
}

#footer #contact p {
    margin: 0;
    padding: 0 10px;
    color: #9E9E9E;
    font-size: 12px;
    font-weight: bold;
}

a.LIEN_footer:link {
	color: #0066CC;
	text-decoration: none;
	font-weight: bold;
}

a.LIEN_footer:visited {
	color: #0066CC;
	text-decoration: none;
	font-weight: bold;
}

a.LIEN_footer:hover {
	color: #0066CC;
	text-decoration: underline;
	font-weight: bold;
}

/* Panier
-------------------------------------------------------- */
#left-panier ul{
}

#left-panier li{
    list-style-type: none;
    float: left;
    background: url(images/separateur-panier.jpg) no-repeat left center;
    margin: 0;
    padding: 0 5px 0 45px;
}

#left-panier li.first{
    background: none;
    padding-left: 0;
}

#left-panier a{
    display: block;
    color:#9E9E9E;
    font-weight: bold;
    font-size: 14px;
}
#left-panier .actif a{
    color:#5A5A5A;
}

#left-panier table {
    margin: 20px 0;
    width:100%;
}

#left-panier table td {
    text-align: right;
    border-bottom: dashed #CCC 1px
}

#left-panier tfoot td {
    border: none;
}

#left-panier table img{
    display: block;
    float: left;
    border: solid #CCC 1px;
    padding: 3px;
}


/* Divers elements de formulaires & tableaux
-------------------------------------------------------- */

.enteteTableau {
	color: #9E9E9E;
	font-weight: bold;
}

.refTableau {
    width: 55%;
}

.refTableau span{
    display:block;
    padding-top:15px;
    font-weight: normal;
}

.prixTableau {
    width: 15%;
}

.quantiteTableau {
    width: 10%;
}

.totalTableau {
    width: 10%;
}

tfoot .totalTableau strong{
    color:#E6468F;
}

.viderTableau {
    width: 10%;
}

#left-panier .viderTableau img{
    border: none;
    float: right;
}

.ligneTableau {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #c6cdde;
	font-size: 0.9em;
}

.footerTableau {
	color: #12335B;
	font-weight: bold;
	background-color: #bdbbcd;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
}

table.form {
    margin: 30px;
}

table.form textarea {
    width: 300px;
    height: 100px;
}

.boutonAchats {
    background: url(images/bouton-continuer.jpg) no-repeat center center;
    width: 199px;
    height: 27px;
    border: none;
    display: block;
    float: left;
    padding: 30px;
}

.boutonTerminer {
    background: url(images/bouton-terminer.jpg) no-repeat center center;
    width: 199px;
    height: 27px;
    border: none;
    display: block;
    float: right;
    padding: 30px;
}
.zoneDeSaisie {
	color: #12335B;
	font-weight: bold;
	font-size: 0.9em;
}

.zoneQuantite {
    color: #12335B;
    font-weight: bold;
    font-size: 0.9em;
    width: 20px;
}

.obligatoire {
	color: #FF0000;
}

.commentaires {
	font-size: 1em;
	font-style: italic;
	font-weight: bold;
	color: #12335B;
}
/* Moteur de recherche
-------------------------------------------------------- */
#moteur {
    width:228px;
    padding: 0;
    background-color: #DBDBDB;
    border: solid #CCC 1px;
    float: left;
    color:#5A5A5A;
    padding-bottom: 20px;
}

#moteur h2{
    text-transform: uppercase;
    font-style: italic;
    font-size: 15px;
    margin: 2px 0 5px 0;
}

#moteur fieldset{
    padding: 4px 8px 9px 8px;
}

#moteur label {
    font-weight: bold;
    display: block;
}

#moteur .coeur label {
    color: #FA199A;
}

#moteur .variete label {
    font-weight: normal;
}

#moteur input, #moteur span, #moteur select{
    margin: 3px 3px 3px 4px;
}

#moteur input {
    display: block;
    float: left;
    clear: both;
    height: 13px;
}

#moteur span {
    display: block;
    float: left;
    width: 150px;
    height: 13px;
 }

#moteur button {
    float: right;
    margin: 0 30px 0 0 ;
    display: block;
}
/* Album 
-------------------------------------------------------- */

#album {
    border: solid #FA199A 1px;
    margin-top: 20px;
    padding: 10px 0 0 0;
    background-color: #FEDDF0;
}

#album h3{
    height: 16px;
    background-color: #FA199A;
    position: relative;
    color: #FFF
}

#album h3 span{
    position: absolute;
    top: -10px;
    display: block;
    padding: 9px 0 0 50px;
    height: 30px;
    background: transparent url(images/livre.gif) no-repeat ;
}

#album p{
    padding: 5px;
    color: #FA199A;
} 

#album p span{
    font-weight: bold;
    font-style: italic;
}

#album p a{
    display: block;
    margin: 5px;
    font-weight: bold;
}

/* Menu general
-------------------------------------------------------- */
.rightColDashed #menuGeneral {
    border-style: dashed;
    border-color: #CCC;
    border-width: 0 0 0 1px;
    width:159px;
    padding-left: 10px;
}

#menuGeneral {
	width:160px;
	padding: 0;
    margin-bottom: 10px;
    float:right;
}

dl, dt, dd, li {
	margin: 0;
	padding: 0;
	list-style-type: none;
    text-align: right;
}

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

#menu {
	position: relative;
	padding: 0;
	margin: 0;
}

dl#menu {

}

dl#menu dt.first {
    background: none;
}

dl#menu dt.first a{
    color: #666;
}

dl#menu dt {
    font-weight: bold;
    background: transparent url(images/pointilles-menu.png) no-repeat bottom right;
    padding-top: 3px;
    font-size: 14px;
}

dl#menu dd {
    background: transparent url(images/pointilles-menu.png) no-repeat bottom right;
}
dl#menu dd a{
    color:#5A5A5A;
    display: block;
    height: 16px;
    line-height: 16px;
    font-size: 12px;
    background: transparent url(images/pointilles-menu.png) no-repeat bottom right;
}

dl#menu .selected {
    background: #E6468E url(images/fond-hover-menu-droite.jpg) no-repeat bottom left;
    color: #FFF;
}

.ssmenu {
    display: none;
}

/* Signature
-------------------------------------------------------- */

#signature {
    height: 10px;
    background: #FFF url(images/fond-bottom.jpg) no-repeat left bottom;
}

.W3C {
	width: 88px;
	margin: 0;
	padding: 0;
}

a.LIEN_signature:link {
	color: #808185;
	text-decoration: none;
	font-weight: bold;
}

a.LIEN_signature:visited {
	color: #808185;
	text-decoration: none;
	font-weight: bold;
}

a.LIEN_signature:hover {
	color: #808185;
	text-decoration: underline;
	font-weight: bold;
}