/* 
    Document   : site
    Created on : 23 juil. 2009, 15:51:33
    Author     : yoye
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/
/*html body {background: url(images/bg.jpg) #FFFFFF repeat-x top left; font-family:arial, verdana}*/
html body { font-family:arial, verdana;}
/*#main_bg {background: url(images/fond_yatooprint.jpg) no-repeat top center; }*/
/*#main_bg {background: url(images/fond_yatooprint_noel.jpg) no-repeat top center; }*/
/*#main_bg {background: url(images/bg-yatoo-printemps.jpg) no-repeat top center; } */
/*#main_bg {background: url(images/bg-yatoo-mai.jpg) no-repeat top center ; background-color:#FEFEFE;}*/
/*#main_bg {background: url(images/bg_printemps_2012.jpg) no-repeat top center ; background-color:#4B8605;}*/
#main_bg {background: url(images/fond_yatooprint_stvalentin.jpg) no-repeat top center ; background-color:#FFFFFF;}
#main {background: url(images/background.png) repeat-y; }
#bandeau {background: url(images/bandeau.png) no-repeat; height:213px}
#header {height:118px; position: relative;}

#header .connect {
    position: absolute;
    right: 0; top: 0;
    background: url(images/201201/bg_connect.png) no-repeat;
    width: 242px; height: 48px;
}
#header .connect ul{
    padding: 0;
    margin: 0;
}
#header .connect ul li{
    margin: 0 0 0 20px;
    padding: 0 0 0 12px ;
    float: left;
    background: url(images/201201/puce_turquoise.png) no-repeat left center;
    list-style: none;
    line-height: 48px;
}
#header .connect ul li a{
    text-decoration: none;
    color: #645151;
    font-size: 13px;
}
#header .imprim_vert{ position: absolute; right: 0; top: 48px;}


#content {margin-bottom:10px; }
  #content.column_3{background: url(images/bg_content.gif) repeat-y 10px top; }
  #content.column_2{background: url(images/bg_content.gif) repeat-y 10px top; }
  table tr td{padding:2px;}
a, a:link, a:visited, a:active{color:#00aace}
div.titre{background-color:#00aace; text-align:center;  color: #FFF; font-weight:bolder;}
a#back_home{display:block; height:110px; padding-top:10px}
#bandeau {height:190px; width:940px; background:url(images/bandeau.jpg)}
/***********************************************
                    TITRE
***********************************************/

h1,h2{background:url(images/201201/trefle_titre.jpg) no-repeat left bottom; color:#4BBBC6; margin:5px 0 0 0; font-size:18px; height:33px; margin-bottom:5px}
h2.leaf em {color: #877f7a;}
/*div.sub_leaf {background:url(images/trait_titre.png) no-repeat; height:5px; }*/

h3 {color: #FFF; text-transform:uppercase; width:150px; }
h3.title_coulisse{margin:10px auto; padding-left:15px; line-height:16px;}
h3.title_coulisse span{ height:16px; display:block; width:150px; text-align:center; font-size:12px; font-weight:bold}
h3.rose {  background: url(images/coulisse_rose_gauche.png) no-repeat top left;}
h3.rose span{background: url(images/coulisse_rose_droite.png) no-repeat top right;}
h3.orange { background: url(images/coulisse_orange_gauche.png) no-repeat top left; }
h3.orange span{background: url(images/coulisse_orange_droite.png) no-repeat top right;}
h6 {padding:0; margin:0 0 0 0}
#left h6{background: url(images/title_left_4.png) no-repeat top left;height:16px;line-height:16px;color:#FFFFFF; font-size:10px; padding:0 0 0 25px;margin:7px 0 7px 0; text-transform:uppercase }
#left h6.imprim-vert {background: url(images/lesproduisvert.jpg) no-repeat top left;height:26px;padding:10px 0 0 22px;}
#left ul.imprim-vert li a{color:#008043}
/***********************************************
                    MENU
***********************************************/

#menu{background: url(images/201201/bg_menu_top.png) no-repeat 5px top;
      position:relative; height:47px; font-size:12px; font-weight:bold;
      bottom:10px; letter-spacing:2px;
}
#menu ul{margin:0;padding:0 0 0 10px;list-style-type:none;width:auto; height:23px; position: relative;}
#menu ul li{
    display:block;float:left; line-height: 47px; margin:0 0 0 0;padding:0;
    background: url(images/201201/menu_separator.png) no-repeat right bottom;
}
#menu ul li a{display:block;color:#474747;text-decoration:none;padding:0 23px;margin:0; font-size:12px; }
#menu ul li a:hover,#menu ul li a.current{}

#menu li.my_cart, #menu li.kdo{
    background: none;
    line-height: normal;
    position: absolute;
    padding: 0;
}
#menu li.my_cart a, #menu li.kdo a{
    padding: 10px 0 0 0;
}
#menu li.kdo{right: 168px; width: 180px; }
#menu li.kdo a{ color: #B90F9E; text-align: center;}
#menu li.my_cart{ right: 0; }
#menu li.my_cart a{width:128px; padding-left: 40px; color: #FFFFFF; font-size: 14px;}
#menu li.my_cart a span, #menu li.kdo a span{
    font-size: 10px;
}
#menu li.menu_0 span{ color: #8AB91A}
#menu li.menu_1{}
#menu li.menu_2{}
#menu li.menu_3{}

#menu ul li{
    position:relative;
    z-index: 100;
}
#menu ul.sub_menu {
    display: none;
    position: absolute;
    z-index: 300;
    background-color: #FFFFFF;
    border:1px solid #A1A1A1;
    height: auto;
    width:180px;
    padding: 7px 0;
}
#menu ul.sub_menu li{
    float: none;
    line-height:normal;
}
#menu ul.sub_menu li a {
    display: block;
    background: url(images/201201/puce_menu_left_bleu.png) no-repeat 5px 8px;
    font-size: 11px;
}
#menu ul.sub_menu li a:hover {
    background-color: #DEDEDE;
}

/***********************************************
                    MENU LEFT
***********************************************/
/*
DT v: 10px; b:-18px; r:-47px
DD v: 2px; b:-26px; r:-55px
*/
#accordion {width: 230px; color:#474747; margin: 15px 0;}
#accordion a {
    color:#474747; text-decoration: none; display: block; margin:0 10px 0 0;
    background: url(images/201201/puce_menu_left_bleu.png) no-repeat right 10px;
}
#accordion dt {
    background: url(images/201201/bg_menu_left.gif) no-repeat left top;
    line-height: 33px;
    padding: 0 0 0 20px;
}
#accordion ul {
    margin: 15px 0 15px 10px;
    padding: 0;
}
#accordion li {list-style: none; padding: 0; margin: 0}
#accordion dd a {padding: 0 0 0 15px; background-position: left 2px;}

#accordion dt.category_19 a {color: #E97016;}
#accordion .category_19 a {background-image: url(images/201201/puce_menu_left_rouge.png);}

#accordion dt.category_16 a {color: #7FB622;}
#accordion .category_16 a {background-image: url(images/201201/puce_menu_left_vert.png);}

/***********************************************
                    CART
***********************************************/
h4.cart {color:#252525; display:inline; padding:0 5px}
span.cart {background: url(images/cart.png); height:46px; width:42px; display:block; float:left}
h4.cart em {font-style:normal; color:#FB53AB}

#cart {margin-bottom:10px; width:170px;}
#cart tr.item_line0{background:#d7f0f5;}
#cart tr.item_line1{background:#f7f7f7}
#cart td {vertical-align:middle}
#cart td.quantity {color:#EF22B7; font-weight:bolder; text-align:right; padding:0 2px}
#cart td.total {font-weight:bolder; text-align:right; padding:5px; background:#EBEBEA}
#cart .top {background:url(images/cart_top.png) no-repeat; height:12px}
#cart .middle {background:url(images/cart_background.png) repeat-y;padding:0 1px 0 1px}
#cart .bottom {background:url(images/cart_bottom.png) no-repeat; height:12px}


/***********************************************
                    COMMANDE
***********************************************/

#command_validation table, #summary table, table.summary_adress, table.edit_user{width: 100%; margin:10px 0 0 0;}
#command_validation thead, #summary thead, table.summary_adress th, table.edit_user thead th {background:#00aace; color: #FFF; font-weight:bolder;}
#command_validation tbody tr td, #summary tbody tr td, #command_validation thead td, #summary thead tr td {padding:0 5px; text-align:right}
#command_validation tbody .pair, #summary tbody .pair{background:#d7f0f5}
#command_validation tbody .impair, #summary tbody .impair{background:#f7f7f7}
#command_validation tfoot, #summary tfoot{border-top:2px solid #FFF}
#command_validation tfoot .sub_total th, #summary tfoot .sub_total th {background:#EDEDEF; font-weight:normal; text-align:right; border-top:2px solid #FFF;}
#command_validation tfoot .sub_total {border-top:2px solid #FFF; }
#command_validation tfoot .total th, #summary tfoot .total th {background:#d7f0f5; text-transform:uppercase; font-weight:bolder; color:#ED1512; text-align:right; border-top:2px solid #FFF;}
#command_validation tfoot .total {border-top:2px solid #FFF; }
#command_validation dl, #summary dl, #summary ul {text-align:left;list-style:none}
#command_validation dd, #summary dd {margin:0 0 0 10px}
#command_validation tr.total th.title,#command_validation tr.sub_total th.title{text-align:left; font-weight:bold; padding-left:50px}
a.coulisse_rouge {background: url(images/coulisse_bleu_gauche.png) no-repeat top left; color:#FFF; font-weight:bolder; margin:10px auto; text-align:center; padding-left:6px; height:23px; text-decoration:none; display:block; width:12px; cursor:pointer}
a.coulisse_rouge span{background: url(images/coulisse_bleu_droite.png) no-repeat top right; height:23px;  width:110px; padding:0 5px 0 0; display:block}
a.coulisse_panier {float:none; margin:10px 0 0 25px}
a.valider_commande {margin:0}
a.valider_commande span{width:160px;}
div.bouton_editer_adresse{padding-top:50px;}
input.coulisse_rouge {background: url(images/coulisse_bleu_gauche.png) no-repeat top left; color:#FFF; font-weight:bolder; margin:10px auto; text-align:center; padding-left:6px; height:23px; text-decoration:none; display:block; width:12px; cursor:pointer}

/***********************************************
                    COMMANDE ADRESSE
***********************************************/

#adresse_facturation table th, #adresse_livraison  table th {text-align:left}
.select_adresse {width:100%}
ul.adress_list {list-style:none}

/***********************************************
                    ESPACE USER
***********************************************/

#user_register {background: url(images/espace_client.png) no-repeat top left #f7f7f7;padding:30px 0 10px 20px;color:#615f5f}
.signin_submit {background: url(images/signin_submit.png) no-repeat; border:none; width:129px; height:25px; cursor:pointer}
#user_register p{font-size:12px; font-weight:bold;margin:7px 0 10px 0;}
a.inscription{display:block;color:#615f5f; background: url(images/fleche_inscription.png) no-repeat center left;font-weight:bold;padding-left:10px;}
a.passlost{display:block;color:#615f5f;font-size:11px;}
/***********************************************
                    HOME
***********************************************/

div.product_rack {width:33%; float:left}
div.product_rack ul {list-style:none; color:#36657D; font-weight:bolder}
div.product_rack li {padding:0; margin:0}
div.product_rack li.type_line {font-size:18px}
div.product_rack li.price_line span {background:#F00; padding:5px; color:#FFF; font-weight:bolder; font-size:15px}
div.product_thumb {height:100px; padding:40px 10px 0 20px}

a.coulisse_bleu {background: url(images/coulisse_bleu_gauche.png) no-repeat top left; color:#FFF; font-weight:bolder; margin:10px auto; text-align:center; padding-left:8px; height:20px; text-decoration:none; display:block; width:15px}
a.coulisse_bleu span{background: url(images/coulisse_bleu_droite.png) no-repeat top right; height:20px; width:80px; padding:0 5px 0 0;  display:block}
/**
div.news {background:#F4F4F4; padding:20px 5px;}
*/
div.news {background:#00aace; padding:0 5px; margin:10px 0 0 0}
div.news table {width:100%; color: #B0B0B0; font-weight:bolder}
div.news td {width:46%; float:left; background:transparent; text-align:justify; text-indent:5px; margin:10px;}
div.news h5 {color:#F3971C; font-size:20px}
div.news h5 span {color:#FFE64C}

/***********************************************
                    FOOTER
***********************************************/
#footer {border-top: 1px solid #D6D6D6; background-color: #F5F5F5; padding:0 10px 5px 10px; width:920px;}
#footer, #footer a{color: #737373 !important; text-decoration:none;}
#footer li {margin:0}
#footer .icone_paypal{text-align:center; }
#footer .separator {background:url(images/201201/footer_separator.jpg) no-repeat right top;}
#footer .separator, #footer .last { padding-top: 30px; }
 #footer .last a{ margin-bottom: 15px; text-align: center; }
 
 #footer .site li {background-repeat: no-repeat; line-height: 25px; list-style: none;margin-bottom: 5px;}
 #footer .site li a{display: block; text-indent: 30px; font-size: 12px;  }
 #footer .site li.securite{background-image: url(images/201201/ico_securite.jpg);}
 #footer .site li.livraison{background-image: url(images/201201/ico_livraison.jpg);}
 #footer .site li.suivi{background-image: url(images/201201/ico_suivi.jpg);}
 #footer .site li.cgv{background-image: url(images/201201/ico_cgv.jpg);}

 #footer .separator.service { padding-top: 5px;}
 #footer .service ul {padding-left: 15px; margin-top: 15px;}
 #footer .service li{ list-style: square;}
 #footer .service .phone{color:#DF671E; font-size: 20px; font-weight: bold; line-height: 23px;}
 #footer .service .horaire{font-size:10px;}
/***********************************************
                    FORM
***********************************************/

input[type=text], input[type=password], textarea { border: 1px solid #666; color: #000; padding:2px 5px}

/***********************************************
                    USER
***********************************************/

table.edit_user tr td{padding:2px}
.edit_user input.submit {background:url(../images/bouton_orange.png) no-repeat; border:none; color:#FFF; font-weight:bolder; width:109px; height:20px; cursor:pointer; text-align:center; padding:0}

/***********************************************
                    PRODUCT SORT
***********************************************/

dl.product_sort {margin:0}
dl.product_sort dt{background:#d7f0f5; padding:0 0 0 5px;margin:0}
dl.product_sort dd{background:#f7f7f7;margin:0}
dl.product_sort ul {list-style:none; margin:0}
dl.product_sort li {margin:0}


table.tarif_visualisation {width:100%}
table.tarif_visualisation thead th{background:#877f7a; font-weight:normal; padding: 0 5px; border:1px solid #FFF}
table.tarif_visualisation thead td.options {background:#00aace; text-align:center; color:#FFF; font-weight:bolder;border:2px solid #FFF}
table.tarif_visualisation thead td {background:#f7f7f7; border:2px solid #FFF; text-align:center; font-weight:bolder}
table.tarif_visualisation tbody td {text-align:center}
table.tarif_visualisation tbody tr.pair td{background:#d7f0f5; border:2px solid #FFF}
table.tarif_visualisation tbody tr.impair td{background:#f7f7f7; border:2px solid #FFF}
table.tarif_visualisation div {float:right; margin-right:10px}

#loader {background:url(images/ajax-loader.gif) no-repeat 50% 50%; height:320px}

/***********************************************
                    NEWS
***********************************************/

a.link_news {text-decoration:none; color:#B0B0B0}


.error_list {color:#F00; list-style:none; margin:0; padding:0; font-size:0.9em; font-weight:bolder}
.error_list li {margin:0}

.authenticated p a, .authenticated p a:link, .authenticated p a:visited{text-transform:uppercase; display:block;color:#615f5f; background: url(images/fleche_inscription.png) no-repeat center left;font-weight:bold;padding-left:10px;}

/***********************************************
             SOUS MENU USER ACCOUNT
***********************************************/
.sub_menu {background:#eaeaea; height:28px}
.sub_menu li {float:left; margin:0; padding:0 6px; list-style:none}
.sub_menu li a {display:block; height:28px;line-height:28px; color:#343434; text-decoration:none; font-weight:bolder;}
.sub_menu li.active a, .sub_menu li a:hover{color:#FFFFFF;background-color:#00aace}

.cgu {text-align:center}
.cgu a{color:#000}

#modal {width:336px}
.ui-dialog {background: url(images/modal.png) no-repeat; padding:5px; height:130px;}
.ui-dialog-titlebar-close {display:none}
.ui-widget-overlay {background:#252525; position: absolute; top: 0; left: 0; width: 100%; height: 100%;opacity: .30;filter:Alpha(Opacity=30);}
#modal a {display:block; padding:2px 5px;  font-weight:bolder; text-decoration:none;color:#000; text-align:center; font-size:1.2em}
#modal table {width:100%}
#modal td {width:50%}
#modal td.left  {border-right:2px solid #f7f7f7;}
#modal a em {color:#572316; font-size:1.5em; font-weight:bolder; padding:0; margin:0; font-style:normal}

/*
 ETAPE COMMANDE
*/

.lk-order-step div {background:no-repeat url('images/step_unactive.png'); width:130px; height:32px; float:left; color:#CCC; font-weight:bolder; font-size:0.9em; padding:2px 0 0 10px;}
.lk-order-step div.active {background:no-repeat url('images/step_active.png'); color:#555}
.lk-order-step span {color:#FFF; font-size:1.7em; margin-right:11px;}

/*
 FLASH USER
*/
.notice {background:#A9F69E; font-weight:bolder; padding:5px;}

/***********************************************
                    COLONNE DROITE: RIGHT
***********************************************/
#right .right_component{margin-bottom:10px; display:block}

/***********************************************
                    PAGE CONTACT
***********************************************/
table.table {width:100%}
table.table tr th,table.table tr td{text-align:left; vertical-align:top}
table.table input[type=text]{width:300px}
table.table textarea{width:300px; height:200px}
table.table select{width:300px;}
table.table tr td.col_1{width:120px;}

/***********************************************
                    PAIEMENT PROCESSOR
***********************************************/
#payment-processor ul li{display:inline; margin-left: 70px;}

span.form-helper {font-size:0.8em; color:#AAA}

.radio_list {list-style:none}

#mail-body {background: url(../images/tetedelettre.jpg)}

.paypal-instruction {background:url(images/Image_paypal.jpg); width:595px;height:737px;}

.div-product-content {margin-bottom: 20px;}

.link-product-content {display: block;background:url(images/feuille.png) no-repeat left bottom; color:#00aace; text-indent:30px; margin:5px 0 0 0; font-size:16px; height:30px; margin-bottom:5px; line-height: 30px}