﻿/* style.css - Boutique - 10/03/2016  */
/*
    BT1 = DNA
    BT2 = LRL
    BT3 = LBP
    BT4 = JSL
    BT5 = LER/VOM
    BT6 = LPR 
*/

/* =============================================================================
   Reset
   ========================================================================== */
@charset "UTF-8";

/* Corrects block display not defined in IE6/7/8/9 & FF3 */
article, aside, details, figcaption, figure,
footer, header, hgroup, main, nav, section, summary{display: block;}
script{display: none !important;}

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {margin: 0; padding: 0; border: 0; vertical-align: baseline;}

/* Correct 'inline-block' display not defined in IE 6/7/8/9 and Firefox 3. */
audio, canvas, video {
    display: inline-block;
    *display: inline;
    *zoom: 1;
}

/* =============================================================================
   $Base / $Elements
   ========================================================================== */
@font-face {
    font-family: 'Open Sans';
    src: url('../../fonts/opensans-regular-webfont.eot');
    src: url('../../fonts/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'),
         /*url('../fonts/opensans-regular-webfont.woff') format('woff'),*/
         url('../../fonts/opensans-regular-webfont.ttf') format('truetype'),
         url('../../fonts/opensans-regular-webfont.svg#opensans-regular-webfont') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'IcoMoon';
    src: url('../../fonts/icomoon.eot');
    src: url('../../fonts/icomoon.eot?#iefix') format('embedded-opentype'),
         /*url('../fonts/icomoon.woff') format('woff'),*/
         url('../../fonts/icomoon.ttf') format('truetype'),
         url('../../fonts/icomoon.svg#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Payment';
    src: url('../../fonts/paymentfont-webfont.eot');
    src: url('../../fonts/paymentfont-webfont.eot?#iefix') format('embedded-opentype'),
         /*url('../fonts/paymentfont-webfont.woff') format('woff'),*/
         url('../../fonts/paymentfont-webfont.ttf') format('truetype'),
         url('../../fonts/paymentfont-webfont.svg#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
}

html{font-size: 62.5%;} /* pour une correspondance en px --> 1rem = 10px */

body{
  font-size: 1.8rem; /* =18px */
  font-family: 'Open Sans', sans-serif; font-weight: normal; color: #212121; text-align: center; background-color: #FFF; z-index: 1; }

*{ margin: 0; padding: 0; box-sizing : border-box; }

a{color: #636397;  text-decoration: none;}
a:hover{text-decoration: none; color: #212121;}
  
ul, dl, dt, dd{list-style: none;  margin: 0;  padding: 0;  list-style-position: outside;}
ol{margin: 0; padding: 0; list-style-position: inside;}

h1, h2, h2, h3, h4, h5, h6{padding: 0; margin: 5px 0;}

h1{font-size: 3rem; font-weight: bold; color: #212121; margin: 20px 0; text-transform: uppercase;}
h2{font-size: 2.4rem; margin: 0 0 5px 0;}
h3{font-size: 2.2rem;}
h4{font-size: 90%;}
h5{font-size: 70%;}

.constrain{width: 1100px; margin: 0 auto; position: relative; overflow: visible; text-align: left;}

.imgResponse {width: 100%;}

.overlay{
    width: 100%; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 900;
    background: -moz-linear-gradient(top,  rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.65) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0.65))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.65) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.65) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.65) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0.65) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */
}   

span.oblig{padding: 0 5px; color: red;}

.msgBox, .blocmsg, .messageBox{margin: 10px 0;}
.msgBox.alerte, .blocmsg.alerte{color: orange;}
.msgBox.error, .msgBox.error a, .messageBox.error, .error{color: red; font-size: 1.3rem; display: block;}
.error::before {font-family: 'IcoMoon'; content:'\e912'; color: red; padding: 0 10px 0 0;}

.msgBox.error a{font-weight: bold;}
.messageBox.info, .msgBox.info{border: 1px dashed red; padding: 10px; background-color: #F7F7F7; color: #212121;}
.messageBox.info ul, .msgBox.info ul{margin: 10px;}
.messageBox.info ul::before, .msgBox.info ul::before{font-family: 'IcoMoon'; content:'\e912'; padding: 3px 10px 0 0; float: left; }
.messageBox.info p.note { margin: 10px; font-size: 1.3rem;}

.dropBox{display: none; position: absolute; top: 26px; right: 0; background-color: #FFF; border: 1px solid #636397; z-index: 200; padding: 20px; width: 320px; z-index: 210;}

/* =============================================================================
   $header : Layout
   ========================================================================== */
header, #header{position: fixed; top: 0; margin: 0; background-color: #FFF; z-index: 100; clear: both; width: 100%;}
.topHeader, .mainHeader{position: relative; clear: both; color: #000; font-size: 1.2rem; z-index: 100;}
.mainHeader {border-bottom: 1px solid #636397;}
.topHeader{background-color: #e9e9e9; height: 26px; line-height: 26px; z-index: 110;}
.topHeader ul{overflow: hidden; float: left;}
.topHeader ul li{float: left; margin: 0 20px 0 0;}
.topHeader ul li.service::before {font-family: 'IcoMoon'; content: "\e901"; color: #636397; padding: 0 5px 0 0; font-size: 1.6rem;}
.topHeader ul li.paiement::before {font-family: 'IcoMoon'; content: "\e907"; color: #636397; padding: 0 5px 0 0; font-size: 1.6rem;}
.mainHeader .constrain{min-height: 80px; z-index: 80;}
.mainHeader .logo {text-indent: -9999px;}

.headerLeft {position: absolute; left: 0; top: 0; padding: 0; }
.headerCenter{position: absolute; left: 230px; top: 15px; padding: 10px 0;}
.headerRight {position: absolute; right: 0; top: 0; padding: 20px 0 0 0;}

/* =============================================================================
   $navigation : Layout 
   ========================================================================== */
#showMenu{float: left; text-align: center; font-size: 1.2rem; font-weight: bold; line-height: 20px; margin: 0 15px 0 0; display: block; cursor: pointer; color: #636397;}
#showMenu .burger{display: none; height: 24px; width: 24px; margin: 0 auto;}
#showMenu .burger::before, #showMenu .burger::after, #showMenu .burger i{border-top: 3px solid #636397 !important; content:""; display: block; margin-top: 4px;}
#showMenu:hover{color: #CACACA;}

#navBar{margin: 109px 0 0 0; clear: both; background-color: #393939; color: #FFF; text-transform: uppercase; border-top: 3px solid #636397; z-index: 100;}

#navBar .nav_model01{font-size: 1.3rem;}
#navBar .nav_model02{overflow: hidden; font-size: 1.3rem;}
#navBar .nav_model01 li, #navBar .nav_model02 li{display: inline-block; margin: 0;}
#navBar .nav_model01 li {position: relative;}
#navBar .nav_model01 li a, #navBar .nav_model02 li a{color: #FFF; cursor: pointer; display: block; padding: 8px 20px;}
#navBar .nav_model01 li:hover, #navBar .nav_model01 li a.selected {color: #FFF}

#navBar .nav_niv2{display: none; padding: 0; position: absolute; top: 33px; left: 0; right: 0; z-index: 110; width: 320px; background-color: #e9e9e9; border-bottom: 3px solid #636397;} 
#navBar .nav_niv2 li{border: none; text-transform: none; padding: 0 5px; text-align: left; color: #636397; width: 100%;}
#navBar .nav_niv2 li a {color: #393939; border: none !important; display: block;}
#navBar .nav_niv2 li a:hover { background-color: #DDD;}

#navBar .nav_niv1 .itemLevel1:hover .nav_niv2{display: block;}

#wrapper .railroad{margin: 20px auto; font-size: 1.2rem;}
#wrapper .railroad{overflow:hidden;}
#wrapper .railroad li{list-style-type: none; float: left; margin:0px 1.5%; width:21%;  padding:0px;  padding:10px 5px;}
#wrapper .railroad li span{display: inline-block; text-align: center; background-color: #E0E0E0; text-align: center; margin: 0 10px 0 0; height: 30px; width: 30px; border-radius: 15px; line-height: 30px; font-weight: bold;}
#wrapper .railroad li.selected span{color: #FFF; background-color: #636397;}
#Informations legend,#adress legend {display:none;}
#cgu label {line-height:20px;}
#cgu input {margin-top:5px;}

/* =============================================================================
   Layout : content / wrapper
   ========================================================================== */
#ad_portal {text-align: left;}
#wrapper{clear: both; z-index: 10;}

.section{clear: both; margin: 0 0 20px 0; overflow: hidden;}
.section2{background-color: #f2f2f2;}

.breadcrumb{overflow: hidden; margin: 0;}
.breadcrumb li{float: left; padding: 0 0 0 10px;}

.boxComponent{width: 65%; float: left; padding: 0 30px 0 0;}

.model_1c_1 .col1{width: calc(100% - 340px); float: left;}
.model_1c_1 .col2{width: 300px; margin: 0 0 0 40px; float: right;}

.model_1_1c .col1{width: 220px; margin: 0 40px 0 0; float: left;}
.model_1_1c .col2{width: calc(100% - 260px); float: right;}

/* =============================================================================
   $footer : Layout
   ========================================================================== */
footer, #footer{clear: both; padding: 20px 0 0 0; margin: 50px 0 0 0;}
.footerTop, .footerBottom {position: relative; clear: both;}
.footerTop{background-color: #f2f2f2; color: #393939;}
.footerBottom{background-color: #393939; color: #FFF;}

.serviceClient{position: absolute; right: 0; top: -100px; background-color: #eaeaea; border-radius: 100px; height: 200px; width: 200px; text-align: center; font-size: 1.8rem; color: #393939; padding: 35px 0;}
.serviceClient .title { color: #636397; text-transform: uppercase; display: block; margin: 10px 0; }
.serviceClient big {font-size: 1.9rem; font-weight: bold; display: block; margin: 10px 0;}
.serviceClient p{font-size: 1.1rem;}

.nameBT{display: inline-block; color: #FFF; font-size: 2.6rem; font-style: italic; margin: 10px 0;}

.footerBottom ul.footerLinks{clear: both; overflow: hidden; padding: 10px 0;}
.footerBottom ul.footerLinks li{float: left; font-size: 1.2rem; width: 25%; padding: 0 10px 0 0;}
.footerBottom ul.footerLinks li h5{font-size: 13px; line-height: 16px; text-transform: uppercase; color: #FFF; margin: 0 0 20px 0;}
.footerBottom ul.footerLinks li li{float: none; width: 100%;}
.footerBottom ul.footerLinks li li a{display: block; color: #FFF;}

/* =============================================================================
   Alignements : block & inline
   ========================================================================== */

/* float layout */
.fl{overflow: visible;}
.fl-l, .left{float: left;}
.fl-r, .right{float: right;} 
.c{text-align: center !important;}
td.tl{text-align: left;}
td.tr{text-align: right;}


/* table layout */
.row {display: table; table-layout: fixed; width: 100%;}
.row > *,
.col{display: table-cell; vertical-align: top;}

/* inline-block */
.inbl{display: inline-block; vertical-align: top;}

.dropList{background-color: #FFF; padding: 10px; z-index: 300; border: 1px solid #636397; clear: both;}

/* =============================================================================
   Modules / Formating Context
   ========================================================================== */
.mod p.entete, .asideBloc p.entete{text-transform: uppercase; padding: 0 0 2px 0; margin: 0 0 5px 0; color: #636397;}

.appContent, .staticPage .content{overflow: hidden;}
.app h1, .staticPage h1{margin: 20px 0 10px 0; text-transform: uppercase;}
.staticPage h2{margin: 20px 0 10px 0;}
.staticPage p{text-align: justify; font-size: 1.4rem; margin: 10px 0;}
.staticPage .item { margin: 10px 0;}
.staticPage ul { margin: 10px 0;}
.staticPage ul li{ margin: 5px 10px;}

.typePayment { overflow: hidden;}
.typePayment span {padding: 0 10px 0 0; line-height: 24px; display: block; float: left;}
.typePayment .title {font-size: 1.4rem; padding: 0 20px 0 0;}
.typePayment .pf-cb:before {font-family: 'Payment'; font-size: 2.2rem; content: "\f00e";  color: #888;}
.typePayment .pf-mastercard:before {font-family: 'Payment'; font-size: 2.2rem; content: "\f02d";  color: #888;}
.typePayment .pf-visa:before {font-family: 'Payment'; font-size: 2.2rem; content: "\f045";  color: #888;}
.typePayment .pf-bank-transfer:before {font-family: 'Payment'; font-size: 2.8rem; content: "\f005";  color: #888; margin-top: 5px;}

/* nosAvantages */   
.nosAvantages li{color: #212121; border-bottom: 1px solid #ececec; padding: 0 0 20px 0; margin: 20px 0 0 0;}  
.nosAvantages li:last-child{border-bottom: none;}
.nosAvantages li a{display: block; }

/* livraison */
.livraison{position: relative; background: url(../../images/sprite_boutique.png) no-repeat right 60px #FFF;}
.livraison p{padding: 10px 100px 10px 0; font-size: 80%; min-height: 40px;}
.livraison .badge{text-transform: uppercase; border-radius: 30px; width: 60px; height: 60px; color: #FFF; background-color: #FF0000; position: absolute; top: 8px; right: 20px; line-height: 60px; font-size: 11px; opacity: 0.9; filter: alpha(opacity=90); text-align: center;}

/* remise */
.remise{position: relative;}
.remise p{font-size: 80%; margin: 10px 10px 10px 80px;}
.remise .badge{text-transform: uppercase; border-radius: 30px; width: 60px; height: 60px; color: #FFF; background-color: green; position: absolute; top: 50px; left: 20px; line-height: 60px; font-size: 20px; opacity: 0.9; filter: alpha(opacity=90); text-align: center;}

/* =============================================================================
   $GBEL : module - component
   ========================================================================== */
/* module : search */   
.GBEL_searchProduct{}
.GBEL_searchProduct .allShop{font-size: 80%; cursor: pointer; color: #212121; float: left; position: relative;}
.GBEL_searchProduct .allShop .dropList{position: absolute; left: 0; top: 25px; width: 200px; font-size: 100%; display: none;}
.GBEL_searchProduct .allShop .dropList h4{font-size: 130%; background-color: #EEE; color: #212121;}
.GBEL_searchProduct input.searchQuery{float: left; background: url(../../images/v1/search.png) no-repeat 5px 5px #FFF; width: 248px; height: 26px; border: 1px solid#CCC ; padding: 3px 26px !important; font-style: italic; margin: 0 10px 0 0;}
.GBEL_searchProduct input.btSearchQuery{background-color: #636397; color: #FFF; padding: 2px 5px; border: none; font-size: 2rem; line-height: 20px; cursor: pointer;}
.GBEL_searchProduct input.btSearchQuery:hover {background-color: #9a9ae8;}

.GBEL_searchProduct .summary{height: 26px; line-height: 26px; background-color: #696969; padding: 2px 5px; color: #FFF;}
.GBEL_searchProduct .summary span{float: right; margin: 0 0 0 5px; width: 20px; height: 20px; display: block; }
.GBEL_searchProduct .summary.active span{background: url(../../images/) no-repeat 0 0 transparent;}

/* page : search */
.GBEL_searchList{background-color: #FFF; padding: 20px;}
.GBEL_searchList .product{border-bottom: 1px dotted #CCC; padding: 0 0 10px 0; margin: 0 0 10px 0; overflow: hidden; position: relative;}
.GBEL_searchList .product .content{margin: 0 190px 0 0; border-right: 1px dotted #CCC; padding: 0 10px 0 0;}
.GBEL_searchList .product .action{position: absolute; top: 0; right: 0;  width: 180px; padding: 0 0 0 10px;}
.GBEL_searchList .product span{display: block;}
.GBEL_searchList .product img{float: left; margin: 0 10px 10px 0; width: 200px;}
.GBEL_searchList .product .title{color: #212121; font-size: 120%;}
.GBEL_searchList .product .desc{margin: 10px 0;}
.GBEL_searchList .product .price{color: #636397; text-align: left; clear: both; display: block; margin: 0 0 20px 0; font-size: 120%;}

/* module : panier */
.GBEL_basket .basketCount{text-transform: uppercase; color: #212121; font-weight: bold; font-size: 1.3rem; text-align: right; cursor: pointer;}
.GBEL_basket .basketCount::before{font-family: 'IcoMoon'; font-size: 1.8rem; content: '\e900'; color: #636397; display: inline-block; padding: 0 10px 0 0;}
.GBEL_basket .basketCount a{padding: 0 16px 0 0; }
.GBEL_basket .basketCount span{color: #636397; font-weight: normal; display: block; text-transform: lowercase; font-size: 1.2rem;}
.GBEL_basket .basketCount.active{border-width: 1px 1px 0 1px; border-style: solid; border-color: #CCC;}
.GBEL_basket #layerBasket{position: absolute; right: -10px; background-color: #FFF; z-index: 100; width: 310px; padding: 0;}
.GBEL_basket .containerProducts{max-height: 280px; overflow: auto; padding: 10px;}
.GBEL_basket .containerProducts li{border-bottom: 1px dotted #CCC; overflow: hidden;}
.GBEL_basket .containerProducts li a{display: block; padding: 5px 0; overflow: hidden; position: relative; font-size: 12px;}
.GBEL_basket .containerProducts li a .image{display: block; float: left; margin: 0 5px 0 0; width: 40px;}
.GBEL_basket .containerProducts li a .image img{width: 40px;}
.GBEL_basket .containerProducts li .desc{float: left; width: 160px; line-height: 14px; color: #212121;}
.GBEL_basket .containerProducts li .desc em{display: block; font-style: normal;}
.GBEL_basket .containerProducts li .price{float: right; width: 60px; font-weight: bold; text-align: right;}
.GBEL_basket .containerProducts .badge .price{color: Red;}
.GBEL_basket .totalPrice{text-align: right; margin: 0 10px 0 0; padding: 10px 0;}
.GBEL_basket .totalPrice span{color: #636397; font-weight: bold;}
.GBEL_basket .promo{color: green;}
.GBEL_basket .titlePromo{color: #9B9B9B; text-transform: uppercase; display: block; font-size: 10px;}
.GBEL_basket #layerBasket .btModel03{height: 30px; }
#divClearCart{background: url(../../images/v1/trash.png) no-repeat 0 0 transparent; padding: 2px 0 0 20px; font-size: 1.1rem; color: #696969; display: inline-block; margin: 10px 0;}

/* page : panier */
.GBEL_quickPurchase{}
.GBEL_quickPurchase tbody td{vertical-align: middle;}
.GBEL_quickPurchase .cartProduct td{border-bottom: 1px solid #CCC;}
.GBEL_quickPurchase .trash{border-bottom: none !important;}
.GBEL_quickPurchase .trash span.delete{cursor: pointer; display: block; background: url(../../images/v1/trash.png) no-repeat 0 0 transparent; width: 20px ; height: 20px; }
.GBEL_quickPurchase .cartProduct .cgu{color: red; font-style: italic;}
.GBEL_quickPurchase .cartProduct .stock span{color: #FFF; padding: 2px 10px; text-transform: uppercase; font-size: 10px;}
.GBEL_quickPurchase .cartProduct .stock .ok{background-color: #A3C662;}
.GBEL_quickPurchase .cartProduct .stock .ko{background-color: red;}
.GBEL_quickPurchase .cartProduct .price{font-weight: bold;}
.GBEL_quickPurchase .cartProduct .quantity span{border: 1px solid #DDD; padding: 2px 5px; border-radius: 4px;}
.GBEL_quickPurchase .cartProduct .quantity span.more,
.GBEL_quickPurchase .cartProduct .quantity span.less{background-color: #888; color: #FFF; border-radius: 2px; padding: 2px 5px; border: none; cursor: pointer;}
.GBEL_quickPurchase .cartProduct .gift{display: block; clear: both; color: #629745; text-align: center; }
.GBEL_quickPurchase .cartProduct .gift a{display: block; text-align: center; font-size: 13px;}
.GBEL_quickPurchase .cartProduct .titlePromo{text-transform: uppercase; color: #9B9B9B; font-size: 11px;}

.GBEL_quickPurchase .cartSummary .deduction{color: #A3C662;}
.GBEL_quickPurchase .cartSummary .deduction span{display: block; color: #696969; font-size: 10px;}

.GBEL_quickPurchase .codeDeduction{margin: 20px 0; background-color: #f2f2f2; border: 1px solid #636397; color: #636397; padding: 10px; text-align: right;}

.GBEL_quickPurchase .codeDeduction #txtDeduction{height: 24px; width: 250px; margin: 0 !important;}
.GBEL_quickPurchase .codeDeduction .btModel03{vertical-align: top;}
.GBEL_quickPurchase .recapCommand, .GBEL_quickPurchase .cartPurchase{width: 50%; float: right; padding: 10px; background-color: #EEE;}
.GBEL_quickPurchase .cartPurchase h4{margin: 0; border-bottom: 1px solid #CCC; padding: 0 0 5px 0;}
.GBEL_quickPurchase .cartPurchase td.label{width: 60%; text-transform: uppercase; text-align: right;}
.GBEL_quickPurchase .cartPurchase td.label span{display: block; text-transform: none; font-size: 11px;}
.GBEL_quickPurchase .cartPurchase td.value{width: 40%; text-align: right; font-size: 1.6rem; color: #636397}
.GBEL_quickPurchase .cartPurchase .amountDeduction td{color: #A3C662; font-weight: bold;}
.GBEL_quickPurchase .cartPurchase .amountFinal td{font-weight: bold;}
.GBEL_quickPurchase .cartPurchase .promo{color: #A3C662; font-weight: bold;}

.GBEL_quickPurchase .addressPlugin{clear: both;}
.GBEL_quickPurchase legend{border-bottom: 1px dotted #CCC; padding: 0 0 5px 0; width: 100%; display: block; font-weight: bold;}
.GBEL_quickPurchase .addressPlugin .GBEL_billingAddress{margin: 0;}
.GBEL_quickPurchase .addressPlugin .GBEL_billingAddress p{font-size: 1.1rem; text-align: right; font-style: italic;}
.GBEL_quickPurchase .addressPlugin fieldset{margin: 0 0 5px 0; border-bottom: none !important;}
.GBEL_quickPurchase .addressPlugin .deliveryAddress{margin: 0 20px; text-align: right; font-style: italic; display: block; color: #696969;}

/* page : paiement */
.GBEL_oneClickOrder h2 { display: none;}
.GBEL_oneClickOrder #selectPaymentType{margin: 20px 0 0 0; overflow: hidden; }
.GBEL_oneClickOrder #selectPaymentType li{float: left; background-color: #F7F7F7; margin: 0 2px 0 0;}
.GBEL_oneClickOrder #selectPaymentType li label{display: block; padding: 10px 30px; }
.GBEL_oneClickOrder #selectPaymentType li:hover{background-color: #888; color: #FFF}
.GBEL_oneClickOrder #selectPaymentType li.ongletActive{background-color: #636397; color: #FFF;}
.GBEL_oneClickOrder .selectPaymentInfo{border: 1px solid #636397; padding: 20px;}
.GBEL_oneClickOrder .selectPaymentInfo li{float: left; margin: 10px 2% 10px 0; padding: 10px 10px 0 10px; border: 1px solid #DDD; text-align: center; background-color: #F7F7F7; height: 120px; width: 22%; font-size: 14px;}
.GBEL_oneClickOrder .selectPaymentInfo li input[type="radio"]{display: block; width: 100%; text-align: center; margin: 0 0 5px 0;} 
.GBEL_oneClickOrder .selectPaymentInfo li .nameCB, .GBEL_oneClickOrder .selectPaymentInfo li .dateValidateCB{display: block;}
.GBEL_oneClickOrder .selectPaymentInfo li #deleteCB{margin: 10px 0 0 0;}
.GBEL_oneClickOrder .selectPaymentInfo p{margin: 0 0 20px 0; text-align: center;}

/* page : gestion des commandes */
.GBEL_subscriptionList {margin: 20px 0;}
.GBEL_subscriptionList legend{margin: 0 0 20px 0; font-weight: bold; font-size: 2.2rem;}
.GBEL_subscriptionList table td, .GBEL_subscriptionList table th{font-size: 90% !important;}
.GBEL_subscriptionList table tr.orderInfo td{border-bottom: 1px dotted #CCC;}
.GBEL_subscriptionList table tr.orderInfo .orderProductList img{float: left; margin: 0 10px 0 0;}
.GBEL_subscriptionList table tr.orderInfo .orderProductList li{clear: both; overflow: hidden; margin: 0 0 5px 0;}
.GBEL_subscriptionList table .paid{color: #A3C662; display: block;}
.GBEL_subscriptionList table .paid::before{font-family: 'IcoMoon'; content:'\e913'; padding: 0 10px 0 0;}
.GBEL_subscriptionList table .waitingforpayment{color: #A3C662;}
.GBEL_subscriptionList table .waitingforpayment{color: #FF9A00;}
.GBEL_subscriptionList .showOrderInfo{color: #636397;}
.GBEL_subscriptionList .showOrderInfo::before{font-family: 'IcoMoon'; content:'\e90e'; padding: 0 5px 0 0; }

/* affichage vignette des catalogue et univers */
.GBEL_catalogList{clear: both;}
.GBEL_universList{overflow: hidden;}

.thumbnailList p{margin: 10px 0;}
.thumbnailList .thumbnail{background-color: #FFF; position: relative; margin: 0 0 10px 0; overflow: hidden;}
.thumbnailList .thumbnail .illustration{margin: 0; position: relative;}
.thumbnailList .thumbnail .illustration img{width: 100%;}
.thumbnailList .thumbnail .illustration h2{background-color: #FFF; position: absolute; left: 0; bottom: 20px; padding: 8px 10px; font-size: 100%; filter: alpha(opacity=85); opacity: 0.85;}
.thumbnailList .thumbnail .mask{display: none; background-color: #FFF; filter: alpha(opacity=90); opacity: 0.90; position: absolute; width: 100%; left: 0; right: 0; top: 0; bottom: 0;}
.thumbnailList .thumbnail a.link{display: none; text-align: center; font-size: 14px; position: absolute; width: 100%; left: 0; right: 0; top: 0; bottom: 0; color: #212121; z-index: 10;}
.thumbnailList .thumbnail.image a.link{padding: 10px;}
.thumbnailList .thumbnail:hover .mask, .thumbnailList .thumbnail:hover a.link{display: block;}

.GBEL_universList .thumbnail{float: left; width: calc(25% - 20px); margin: 0 10px;}


/* page : liste de produits */
.GBEL_productList{overflow: hidden; margin: 0 0 20px 0;}
.GBEL_productList li{float: left;}
.GBEL_productList .first.teaser{width: 39%; height: /*429px*/210px; background-color: #F4F4F4; margin: 0.5%; overflow: hidden; position: relative;}
.GBEL_productList .first.teaser .illustration{position: relative; height: 210px; overflow: hidden;}
.GBEL_productList .first.teaser .illustration .title{position: absolute; background-color: #FFF; top: 20px; left: 0; opacity: 0.75; filter: alpha(opacity=75); padding: 2px 10px;}
.GBEL_productList .first.teaser .illustration img{width: 100%;}
.GBEL_productList .first.teaser p{color: #FFF; font-size: 13px; position: absolute; bottom: 0; left: 0; right: 0; padding: 5px 10px; background-color: #212121; border-top: 1px solid #212121; opacity: 0.8; filter: alpha(opacity=80);}

.GBEL_productList .productView{margin: 0 10px 20px 10px; width: calc(20% - 20px); position: relative; padding: 10px; border: 1px solid #FFF; min-height: 350px;}
.GBEL_productList .productView .action{display: none; position: absolute; bottom: 5px; left: 0; right: 0; text-align: center;}
.GBEL_productList .productView .action a{font-size: 11px !important; display: inline; margin: 10px 0; padding: 2px 10px;}
.GBEL_productList .productView img{width: 100%;}
.GBEL_productList .productView.noImage span.illus{background: url(../../images/v1/imgDefaultSmall.png) no-repeat 50% 50% transparent; display: block; min-height: 230px; margin: 0 0 5px 0;}
.GBEL_productList .productView .title{font-size: 1.2rem; display: block; margin: 0 0 5px 0; text-align: center; font-weight: normal;}
.GBEL_productList .productView .price{color: #636397; font-weight: normal; font-size: 17px; text-align: center; display: block;}
.GBEL_productList .productView .price span{color: #212121; font-size: 11px;}
.GBEL_productList .productView .price del{font-size: 11px;}

.GBEL_productList .productView .badge1{position: absolute; color: #FFF; background-color: red; padding: 2px 5px; right: 10px; top: 10px;}
.GBEL_productList .productView .badge2{position: absolute; font-size: 12px; top: 10px; right: 10px; background-color: #629745;  display: block; color: #FFF; padding: 2px 5px; /*border-bottom: 1px solid pink*/} 
.GBEL_productList .productView .quantity{background-color: #EEE; font-size: 12px; padding: 1px 0; line-height: 18px;}
.GBEL_productList .productView .quantity span{background-color: #FFF; border: 1px solid #ddd; border-radius: 4px; font-size: 12px; padding: 1px 4px;}
.GBEL_productList .productView .quantity a.more, .GBEL_productList .productView .quantity a.less{background-color: #BBB; border-radius: 2px; color: #fff; font-size: 12px; padding: 2px;}
.GBEL_productList .productView .mask{background-color: #FFF; position: absolute; left: 0; right: 0; top: 0; bottom: 0; opacity: 0.60; filter: alpha(opacity=60); display: none;}
.GBEL_productList .productView:hover{border: 1px solid #EEE;}
.GBEL_productList .productView:hover .mask{display: block;}
.GBEL_productList .productView:hover .action{display: block; z-index: 100;}

#FormAddProductToCart .hpProduct {display:none;}

/* module : liste de produits */
.GBEL_productList .product{margin: 0.5%; width: 31.66%; min-height: 240px; max-height: 300px; text-align: center; position: relative;}
.GBEL_productList .product .action{display: none; position: absolute; bottom: 5px; left: 0; right: 0; text-align: center;}
.GBEL_productList .product h2{font-size: 13px;}
.GBEL_productList .product img{width: 90%;}
.GBEL_productList .product .description{font-size: 12px;}
.GBEL_productList .product .price a{color: #636397;}
.GBEL_productList .product .mask{background-color: #FFF; position: absolute; left: 0; right: 0; top: 0; bottom: 0; opacity: 0.75; filter: alpha(opacity=75); display: none;}
.GBEL_productList .product:hover .mask{display: block;}
.GBEL_productList .product:hover .action{display: block; z-index: 100;}

/* detail de produits */
.detailProduct{background-color: #FFF; padding: 40px 0; overflow: hidden;}
.detailProduct .productPictures{float: left; margin: 0 40px 20px 0; background-color: #FFF; clear: left;}

.detailProduct .productInfos{}
.detailProduct .productInfos h1{ margin: 0 0 20px 0;}
.detailProduct .productInfos .stock span{background-color: #A3C662; padding: 2px 10px; color: #FFF; text-transform: uppercase; font-size: 10px;}
.detailProduct .productInfos .nostock span{background-color: red; padding: 2px 10px; color: #FFF; text-transform: uppercase; font-size: 10px;}
.detailProduct .productInfos a.moreDesc{color: #FFF; width: 20px; height: 20px; display: inline-table; background: #696969;  -moz-border-radius: 10px;  -webkit-border-radius: 10px;  border-radius: 10px; font-size: 18px; text-align: center; font-weight: normal; line-height: 20px; margin: 0 0 0 10px;}
.detailProduct .productInfos .detail{/*display: flex;*/ background-color: #F4F4F4; margin: 20px 0 20px 0; padding: 10px; overflow: hidden;}
.detailProduct .productInfos .detail .selectChoice{width: 60%; float: left;}
.detailProduct .productInfos .detail .selectChoice select{width: 100%;}
.detailProduct .productInfos .detail .quantity label{display: inline; float: none; padding: 0 10px 0 0;}
.detailProduct .productInfos .detail .quantity span{border: 1px solid #DDD; padding: 2px 5px; border-radius: 4px; background-color: #FFF; font-size: 12px;}
.detailProduct .productInfos .detail .quantity span.more,
.detailProduct .productInfos .detail .quantity span.less{background-color: #888; color: #FFF; border-radius: 2px; padding: 2px 5px; font-size: 12px; border: none; cursor: pointer;}
.detailProduct .productInfos .detail .price{width: 40%;float: right; text-align: right; font-size: 28px; font-weight: bold; line-height: 30px; padding: 10px 0 0 0;}
.detailProduct .productInfos .detail .price del{font-size: 14px;}
.detailProduct .productInfos .detail .price span{font-size: 11px; display: block; line-height: 16px;}
.detailProduct .productInfos .detail .price .badge{background-color: red; color: #FFF; font-size: 18px; padding: 0 5px; display: inline;}
.detailProduct .productInfos .detail .price .ecoTaxe{font-size: 10px; font-weight: normal;}
.detailProduct .productInfos .detail .gift{display: block; clear: both; color: #629745; text-align: right; }
.detailProduct .productInfos .detail .gift a{display: block; text-align: right; font-size: 13px;}

.detailProduct .productInfos .blocbutton{clear: none; text-align: right; overflow: hidden;}
.detailProduct .productInfos .blocbutton input{float: right; margin: 0 0 5px 20px; padding: 0 15px; display: inline-block; line-height: 30px;}
.detailProduct .productInfos .blocbutton a{float: right; display: inline-block; margin: 0 0 5px 0;}
.detailProduct .productInfos .blocbutton a::before {font-family: 'IcoMoon'; content: '\e900'; color: #FFF; padding: 0 10px 0 0;}

.detailProduct .productInfos .shareBar{margin: 10px 0; border-width: 1px 0; border-style: dotted; border-color: #CCC; font-size: 1.2rem; padding: 5px 0; overflow: hidden;}
.detailProduct .productInfos .shareBar li{float: left; margin: 0;}
.detailProduct .productInfos .shareBar li.first {padding: 0 10px 0 0; line-height: 20px; }

.detailProduct .productDesc{clear: both; margin: 20px 0; text-align: justify}
.detailProduct .productDesc li{margin: 0 0 20px 0;}
.detailProduct .productDesc h3{border-bottom: 1px dotted #CCC; margin: 0 0 10px 0;}


/* galerie photo en mode detail */
.productPictures{overflow: hidden;}
#photo-div{}
#galerie-div{margin: 5px 0; overflow: hidden;}
#galerie-div li{cursor: pointer; border: 1px solid #EEE; height: 52px; width: 52px; margin: 0 5px 0 0; float: left;}
#galerie-div li img{width: 50px; height: 50px;}

/* surfer : mise en avant */
/*.surfer{position: relative; padding: 30px 40px 0 40px; background-color: #f2f2f2;}*/
.surfer h3{display: none;}
.surfer .item{position: relative;}
.surfer .item.noImage span.illus{background: url(../../images/imgDefaultBig.png) no-repeat 50% 50% #FFF; display: block; min-height: 280px;}
.surfer .title{display: none; position: absolute; background-color: #FFF; padding: 5px 15px; opacity: 0.9; filter: alpha(opacity=90); bottom: 20px; left: 0; color: #212121; font-size: 16px;}
.surfer .price{display: none; border-radius: 50px; width: 100px; height: 100px; color: #FFF; background-color: #212121; position: absolute; top: 20px; right: 20px; line-height: 100px; font-size: 20px; opacity: 0.9; filter: alpha(opacity=90); text-align: center;}

/* module : nouveaute */
.GBEL_highLightRessource.model2 {position: relative; overflow: hidden;}
.GBEL_highLightRessource.model2  .entete{position: relative; margin: 0 0 10px 0; background-color: #636397; line-height: 24px; height: 24px; text-align: center; font-size: 1.8rem; color: #FFF;}
.GBEL_highLightRessource.model2 .item{position: relative; margin: 0 0 0 20px; display: inline-block; width: calc(20% - 20px); height: auto; overflow: hidden; vertical-align: top;}
.GBEL_highLightRessource.model2 .item:nth-child(7n), .GBEL_highLightRessource.model2 .item:first-of-type{margin: 0;}

.GBEL_highLightRessource.model2 .item.noImage span.illus{background: url(../../images/v1/imgDefaultSmall.png) no-repeat 50% 50% transparent; display: block; min-height: 130px; width: 120px;}
.GBEL_highLightRessource.model2 .item .corps{display: block; padding: 2px 10px; font-size: 14px; margin: 10px 0;}
.GBEL_highLightRessource.model2 .item .title {display: block; text-align: center;}
.GBEL_highLightRessource.model2 .item .price{font-size: 14px; display: block; padding: 2px 10px; text-align: center;}
.GBEL_highLightRessource.model2 .item .price em{font-size: 11px; font-style: normal; font-weight: normal;}
.GBEL_highLightRessource.model2 .item .price del{font-size: 11px;}
.GBEL_highLightRessource.model2 .item .badge1{position: absolute; color: #FFF; background-color: red; padding: 2px 5px; right: 1px; top: 1px;}
.GBEL_highLightRessource.model2 .item .badge2{position: absolute; font-size: 12px; top: 1px; right: 1px; background-color: #629745;  display: block; color: #FFF; padding: 2px 5px; /*border-bottom: 1px solid pink*/} 

.GBEL_highLightRessource.model2 .item a::before{background-color: rgba(255,255,255,0.5); content: ''; position:absolute; left:0; right:0; top:0; bottom:0; display:none;}
.GBEL_highLightRessource.model2 .item a:hover::before{display: block;}


/* module : derniere vente */
.GBEL_highLightRessource.model3, .GBEL_lastProductList{clear: both; overflow: hidden; margin: 10px 0;}
.GBEL_highLightRessource.model3 .item, .GBEL_lastProductList .item{display: inline-block; width: calc(20% - 20px); margin: 0 0 0 20px; text-align: center; position: relative; min-height: 340px;vertical-align: top;}
.GBEL_highLightRessource.model3 .item:first-of-type, .GBEL_lastProductList .item:first-of-type, .GBEL_lastProductList .item:nth-child(7n+0), .GBEL_highLightRessource.model3 .item:nth-child(7n+0){margin: 0;}
.GBEL_highLightRessource.model3 .item .action, .GBEL_lastProductList .item .action{display: none; position: absolute; bottom: 5px; left: 0; right: 0; text-align: center;}
.GBEL_highLightRessource.model3 .item .action a, .GBEL_lastProductList .item .action a {font-size: 11px !important; display: inline; margin: 10px 0; padding: 2px 10px;}
.GBEL_highLightRessource.model3 .item img, .GBEL_lastProductList .item img, .GBEL_highLightRessource.model2 .item img{width: 100%; margin-bottom: 10px;}
.GBEL_highLightRessource.model3 .item.noImage span.illus, .GBEL_lastProductList .item.noImage span.illus{background: url(../../images/imgDefaultSmall.png) no-repeat 50% 50% transparent; display: block; min-height: 130px;}
.GBEL_highLightRessource.model3 .item .title, .GBEL_lastProductList .item .title{font-size: 1.2rem;}
.GBEL_highLightRessource.model3 .item .price, .GBEL_lastProductList .item .price{color: #636397; font-weight: normal; display: block;}
.GBEL_highLightRessource.model3 .item .price del, .GBEL_lastProductList .item .price del{font-size: 11px;}
.GBEL_highLightRessource.model3 .item .badge1, .GBEL_lastProductList .item .badge1{position: absolute; font-size: 14px; color: #FFF; background-color: red; padding: 2px 5px; right: 1px; top: 1px;}
.GBEL_highLightRessource.model3 .item .badge2, .GBEL_lastProductList .item .badge2{position: absolute; font-size: 12px; top: 1px; right: 1px; background-color: #629745;  display: block; color: #FFF; padding: 2px 5px; /*border-bottom: 1px solid pink*/} 
.GBEL_highLightRessource.model3 .item .mask, .GBEL_lastProductList .item .mask{background-color: #FFF; position: absolute; left: 0; right: 0; top: 0; bottom: 0; opacity: 0.75; filter: alpha(opacity=75); display: none;}
.GBEL_highLightRessource.model3 .item:hover .mask, .GBEL_lastProductList .item:hover .mask{display: block;}
.GBEL_highLightRessource.model3 .item:hover .action, .GBEL_lastProductList .item:hover .action{display: block; z-index: 100;}

/* =============================================================================
   owl caroussel
   ========================================================================== */

/* surfer : mise en avant */
.surfer h3{display: none;}
.surfer .item{position: relative;}
.surfer .item.noImage span.illus{background: url(../../images/imgDefaultBig.png) no-repeat 50% 50% #FFF; display: block; min-height: 280px;}
.surfer .title{display: none; position: absolute; background-color: #FFF; padding: 5px 15px; opacity: 0.9; filter: alpha(opacity=90); bottom: 20px; left: 0; color: #212121; font-size: 16px;}
.surfer .price{display: none; border-radius: 50px; width: 100px; height: 100px; color: #FFF; background-color: #212121; position: absolute; top: 20px; right: 20px; line-height: 100px; font-size: 20px; opacity: 0.9; filter: alpha(opacity=90); text-align: center;}

/* display none until init */
.owl-carousel{display: none; position: relative; width: 100%; -ms-touch-action: pan-y; padding: 0; background-color: #FFF;}

/* clearfix */
.owl-carousel .owl-wrapper:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}

.owl-carousel .owl-wrapper{display: none; position: relative; -webkit-transform: translate3d(0px, 0px, 0px);}
.owl-carousel .owl-wrapper-outer{overflow: hidden; position: relative; width: 100%;}
.owl-carousel .owl-wrapper-outer.autoHeight{
	-webkit-transition: height 500ms ease-in-out;
	-moz-transition: height 500ms ease-in-out;
	-ms-transition: height 500ms ease-in-out;
	-o-transition: height 500ms ease-in-out;
	transition: height 500ms ease-in-out;
}
	
.owl-carousel .owl-item{float: left;}
.owl-controls .owl-page,
.owl-controls .owl-buttons div{cursor: pointer;}

.owl-controls {
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.owl-carousel .item img{display: block; width: 100%; height: auto;}

/* mouse grab icon */
.grabbing { cursor: url(grabbing.png) 8 8, move;}

/* fix */
.owl-carousel  .owl-wrapper,
.owl-carousel  .owl-item{
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility:    hidden;
	-ms-backface-visibility:     hidden;
  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
}

.owl-theme .owl-controls{margin: 0; text-align: center; height: 30px; line-height: 30px;}

/* Styling Next and Prev buttons */
.owl-theme .owl-controls .owl-buttons div{
	color: #393939;
	display: inline-block;
	zoom: 1;
	margin: 5px;
	padding: 0;
	font-size: 2.6rem;
    line-height: 40px;
    border-radius: 40px !important;
    width: 40px;
    height: 40px;
    font-weight: bold;
    background: #FFF;

}

.owl-prev { position: absolute; left: 5px; top: 120px;}
.owl-next{ position: absolute; right: 5px; top: 120px;}

/* Clickable class fix problem with hover on touch devices */
/* Use it for non-touch hover action */
.owl-theme .owl-controls.clickable .owl-buttons div:hover{filter: Alpha(Opacity=100); opacity: 1; text-decoration: none;}

/* Styling Pagination*/
.owl-theme .owl-controls .owl-page{display: inline-block; zoom: 1; *display: inline;/*IE7 life-saver */}
.owl-theme .owl-controls .owl-page span{display: block; width: 10px; height: 10px; margin: 3px 5px; filter: Alpha(Opacity=50); opacity: 0.5; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 10px; background: #696969;}

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span{filter: Alpha(Opacity=100); opacity: 1;}

/* If PaginationNumbers is true */
.owl-theme .owl-controls .owl-page span.owl-numbers{
	height: auto;
	width: auto;
	color: #FFF;
	padding: 2px 10px;
	font-size: 12px;
}

/* preloading images */
.owl-item.loading{min-height: 150px; background: url(AjaxLoader.gif) no-repeat center center}

/* =============================================================================
   $GXCO / $GPRF : modules - component
   ========================================================================== */

.ui-datepicker{z-index:999 !important;}

/* lien de connexion dans l'ent�te */
.statusAccount{display: block; background-color: #8181c2; position : absolute; right: 0; top: 0; color: #FFF; font-size: 1.2rem; text-transform: uppercase; line-height: 26px;}
.statusAccount:hover {color: #FFF; background-color: #9a9ae8;}
.statusAccount::before{float: left; display: inline-block; font-family: 'IcoMoon'; content: '\e90d'; color: #FFF; background-color: #636397; height: 26px; width: 30px; text-align: center; line-height: 26px; margin: 0 10px 0 0; font-size: 1.6rem;}
.statusAccount span{display: inline-block; line-height: 26px; }
.statusAccount span::after{font-family: 'IcoMoon'; content: '\e916'; color: #FFF; padding: 0 5px;}
.statusAccount.active span::after{font-family: 'IcoMoon'; content: '\e909'; color: #FFF; padding: 0 5px;}


/* GXCO_boxConnect */
.GXCO_boxConnect{}
.GXCO_boxConnect .box{margin: 0 0 10px 0;}
.GXCO_boxConnect .box .title{font-size: 1.6rem; display: block; color: #636397;}
.GXCO_boxConnect .box .note {font-size: 1rem; display: block;}
.GXCO_boxConnect .box .btModel01, .GXCO_boxConnect .box .btModel02 { width: 100% !important; display: block !important; text-align: center;}
.GXCO_boxConnect .box input[type="text"], .GXCO_boxConnect .box .formRow input[type="password"] { width: 100% !important; height: 28px !important;}
.GXCO_boxConnect .connectAccount {border-bottom: 1px dotted #DDD; padding: 0 0 20px 0; }
.GXCO_boxConnect .connectAccount p{font-size: 1.1rem; text-align: center;}

.GPRF_boxAccount .pseudo{color: #636397; font-size: 1.7rem; }
.GPRF_boxAccount .pseudo::before {font-family: 'IcoMoon'; content:'\e90b'; color: #636397; padding: 0 5px 0 0; }
.GPRF_boxAccount ul{margin: 0 0 20px 20px; border-bottom: 1px dotted #DDD; float: none; padding: 0 0 10px 0;}
.GPRF_boxAccount li.modifAccount::before{font-family: 'IcoMoon'; content:'\e919'; color: #636397; padding: 0 5px 0 0;}
.GPRF_boxAccount li.password::before{font-family: 'IcoMoon'; content:'\e911'; color: #636397; padding: 0 5px 0 0;}
.GPRF_boxAccount li.commandes::before{font-family: 'IcoMoon'; content:'\e908'; color: #636397; padding: 0 5px 0 0;}
.GPRF_boxAccount .btModel01{display: block; position: relative !important; width: 100% !important; text-align: center;}

.GPRF_account{position: absolute; right: 175px; top: 20px; margin: 0 0 0 10px; font-size: 75%; z-index: 900;  width: 180px; font-weight: bold; color: #212121; }
.GPRF_account .avatarDefault{display: block; background: url(../../images/sprite_boutique.png) no-repeat 0 -40px transparent; height: 40px; width: 50px; float: left; margin: 0 10px 0 0;}
.GPRF_account .avatar{display: block; height: 40px; width: 50px; float: left; margin: 0 10px 0 0;}
.GPRF_account .avatar img{width: 40px; }
.GPRF_account .accountuser{padding: 0 16px 0 0; background: url(../../images/icon_dropList.png) no-repeat right 7px transparent; cursor: pointer; clear: both;}
.GPRF_account .accountuser span{color: #636397; display: inline;}
.GPRF_account .droplist{/*background: url(../../images/icon_dropList.png) no-repeat 0 0 transparent;*/ width: 12px; height: 12px; display: inline-block;}
.GPRF_account ul.toolbox{text-align: right; background: #E0DED8; padding: 5px 10px 10px 10px; position: absolute; top: 26px; right: 0; width: 210px; z-index: 900;}
.GPRF_account ul.toolbox .nameUser{font-weight: bold; color: #A49E94; text-align: left; border-bottom: 1px dotted #A49E94;}

.GPRF_accountNotification{position: absolute; right: 175px; top: 30px;  margin: 0 0 0 10px; font-size: 75%; position: relative; z-index: 900; }
.GPRF_accountNotification .avatarDefault{display: block; background: url(../../images/sprite_boutique.png) no-repeat 0 -40px transparent; height: 40px; width: 50px; float: left; margin: 0 10px 0 0;}
.GPRF_accountNotification .notification{color: #212121; float: left; text-transform: uppercase; font-weight: bold;}
.GPRF_accountNotification .notification span{color: #636397; display: block; text-transform: none; font-weight: normal;}
.GPRF_accountNotification #temporayNotification{cursor: pointer;}
.GPRF_accountNotification .toolBoxNotification {display:none;}

.fancybox-inner .toolTitle{position: relative;}
.fancybox-inner h4{text-align: left; border-bottom: 1px dotted #212121; margin: 0 0 20px 0;}
.fancybox-inner ul{overflow: hidden}
.fancybox-inner li{float: left; margin: 0 10px;}
.fancybox-inner p{margin: 20px 0; font-size: 80%;}
.fancybox-inner .blocButton{font-size: 80%; margin: 0 0 20px 0;} 

/* composant de connexion ou d'inscription */
.GXCO_xloglarge h1{text-align: center;}
.GXCO_xloglarge .appContent{clear: both; margin: 0 auto; background: none;}

.GXCO_xloglarge .mod{background-color: #FFF; padding: 20px; margin: 20px auto; width: 600px; text-align: left;}
.GXCO_xloglarge .mod h2{color: #212121; border-bottom: 1px solid #EEE;}
.GXCO_xloglarge .mod h2 em{text-transform: uppercase; font-style: normal;}
.GXCO_xloglarge .mod .note{margin: 10px 0; color: #696969;}
.GXCO_xloglarge .mod .formRow{margin: 10px 0;}
.GXCO_xloglarge .mod ul.listaction{overflow: hidden; margin: 0 0 0 230px; color: #9B9B9B; font-size: 13px;}
.GXCO_xloglarge .mod ul.listaction li{float: left; margin: 0 10px 0 0; border-right: 1px solid #DDD; padding: 0 10px 0 0;}
.GXCO_xloglarge .mod ul.listaction li.last{border: none;}
.GXCO_xloglarge .chkCgu{padding: 0 0 0 230px; font-size: 13px;}


#identificationForm,#newAccountForm {background-color: #fff; margin: 20px auto;padding: 20px;text-align: left; /*width: 600px;*/}
#identificationForm fieldset,#newAccountForm fieldset {padding:0px;}
#identificationForm legend ,#newAccountForm legend {border-bottom: 1px solid #eee;color: #212121;font-size: 160%;line-height: 120%;margin: 0 0 5px;}

/* inscription : GPRF_ident */
#GPRF_OneStepFull.app legend span{padding:0px;color: #FFF; width: 30px; display: block; float: left; height: 30px; background: #636397;  -moz-border-radius: 15px;  -webkit-border-radius: 15px;  border-radius: 15px; font-size: 20px; text-align: center; font-weight: bold; line-height: 30px; margin: 0 10px 0 0;}
#GPRF_OneStepFull.app legend{line-height: 30px; font-size: 18px;}
#GPRF_OneStepFull.app .formrow input[type="text"], #GPRF_OneStepFull.app .formrow input[type="password"], #GPRF_OneStepFull.app .formrow textarea, #GPRF_OneStepFull.app .formrow select{float: left;margin:0px;}
#GPRF_OneStepFull.app label {width:230px;margin:0px;}
#GPRF_OneStepFull.app .formrow .row{display: inline !important; clear: none !important;}
#GPRF_OneStepFull.app .info{text-align: right; font-style: italic; color: #696969; font-size: 14px;}
#GPRF_OneStepFull.app .infoPassword {margin-left:230px;font-size:80%;clear:both;display:block;}
#GPRF_OneStepFull.app .cgu{background: none repeat scroll 0 0 #F4F4F4; border-bottom: 1px solid #DDDDDD; border-radius: 4px; clear: both; margin: 10px 0; padding: 8px 0 0 0;}
#GPRF_OneStepFull.app .cgu .scroller{color: #888888; height: 220px; outline: medium none; overflow-y: scroll; padding: 0 10px; font-size: 1.1rem;}
#GPRF_OneStepFull.app .cgu .scroller p.header{border-bottom: 1px solid #DDDDDD; box-shadow: 0 1px 0 #FFFFFF; padding: 0 0 5px 0; margin: 0 0 5px 0; /*cursor: pointer;*/}
#GPRF_OneStepFull.app .cgu .scroller p{margin: 5px 0;}
#GPRF_OneStepFull.app .cgu p.bottom{background: #696969; padding: 2px 20px; margin: 0; color: #FFF;}
#GPRF_OneStepFull.app .cgu label.error{float: right; color: orange}
#GPRF_OneStepFull.app .civil label.error{float: right;}
#GPRF_OneStepFull.app span.error {margin-left:230px;font-size:80%;}
#GPRF_OneStepFull.app #CGU span.error {margin:0px !important;padding:2px 20px;}

/* GXCO mot de passe oubli� */
.GXCO_forgotPwd h1{text-align: center;}
.GXCO_forgotPwd .appContent{width: 600px; margin: 20px auto;}
.GXCO_forgotPwd .appContent fieldset{padding: 20px 0;}
.GXCO_forgotPwd .appContent .row{clear: none !important; width: auto !important;}
/* TODO : A SUPPRIMER */
.GPRF_forgotPwd h1{text-align: center;}
.GPRF_forgotPwd .appContent{width: 600px; margin: 20px auto;}
.GPRF_forgotPwd .appContent fieldset{padding: 20px 0;}
.GPRF_forgotPwd .appContent .row{clear: none !important; width: auto !important;}



/* GPRF_dashboard */
.GPRF_dashboard {margin: 20px 0;}
.GPRF_dashboard ul li{overflow: hidden; margin: 10px 0; font-size: 1.3rem;}
.GPRF_dashboard ul li label{float: left; width: 160px; }
.GPRF_dashboard ul li span{float: left;}
.GPRF_dashboard .nameAccount{font-weight: bold; color: #636397; margin: 0 0 20px 0; display: block;}
.GPRF_dashboard .photo{float: left; margin: 0 20px 10px 0;}
.GPRF_dashboard .infos ul li{margin: 2px 0;}
#updateProfile .formrow input[type="text"], #updateProfile .formrow input[type="password"], #updateProfile .formrow textarea, #updateProfile .formrow select{float: left;}
.GPRF_updateProfile legend,.GPRF_updateProfileContactInfo legend {display:none;}
.GXCO_changePassword legend {display:none;}
.GPRF_updateProfile span.error {font-size:80%;}
.GPRF_updateProfile span.infoAvatar {clear:both;display:block;margin-left:210px;font-size:80%;}
.GPRF_updateProfile fieldset,.GXCO_changePassword fieldset {padding:0px;border-width:0px;margin:0px;}
.GPRF_updateProfile .formrow input[type="text"], .GPRF_updateProfile .formrow input[type="password"] {margin:0px;}
#deleteAvatar {font-size:80%;}

.infoPassword {font-size: 1.1rem; display: block; margin: 0 0 0 230px; font-style: italic; color: #696969;}

/* Help */
span.helpIcon {background-color:#999; color:#FFF; padding:2px 7px; border-radius:10px; margin-left:2px; line-height:15px; display:inline-block;}
span.helpIcon::after {content:"?";}
span.helpIcon:hover {background-color:#666;}
span.helpIcon:hover p.helpMessage, span.helpIcon:hover p.helpMessage::before {display:inline;}
p.helpMessage{color:#fff!important; background-color:#666; position:absolute; display:none; padding:5px 14px; border-radius:5px; margin-top:-6px; margin-left:22px; text-transform: none; font-weight:normal; font-size:90%;z-index:1;}
p.helpMessage::before {content:""; position:absolute; top: 7px; left: -5px; margin-left:-5px; border-width:5px; border-style: solid; border-color: transparent #666 transparent transparent;}

/* =============================================================================
   pagination
   ========================================================================== */  
.pagination{clear: both; margin: 10px 0; overflow: hidden; float: right;}
.pagination li{display: inline-block; float: left; margin: 0 0 0 10px; padding: 2px 5px; background-color: #FFF;}
.pagination li.active{color: #212121;}

/* =============================================================================
   $GFWK_form : formulaire
   ========================================================================== */  

fieldset{padding: 20px; border-bottom: 1px dotted #CCC; margin: 0 0 20px 0; clear: both;}
legend{text-transform: uppercase;}
legend em{font-weight: bold; font-style: normal;}
legend span{color: #FFF; width: 30px; display: block; float: left; height: 30px; background: #636397;  -moz-border-radius: 15px;  -webkit-border-radius: 15px;  border-radius: 15px; font-size: 20px; text-align: center; font-weight: bold; line-height: 30px; margin: 0 10px 0 0;}

form { font-size: 1.4rem;}
.formRow, .formrow{overflow: visible; clear: both; position: relative;}

.formRow input[type="text"], .formrow input[type="text"], input[type="text"],
.formRow input[type="password"], .formrow input[type="password"]{border: 1px solid #d7d7d7; height: 30px; font-size: 1.2rem; padding: 3px 6px; color: #878787; vertical-align: middle; margin: 0 0 10px 0; width: 300px;}
input[type="file"]{font-size: 12px; border: 1px solid #D7D7D7; width: 300px;}
textarea{border: 1px solid #d7d7d7; width: 300px; padding: 3px 6px; margin: 0 0 10px 0; }
select{width: 300px; height: 30px; margin: 0 0 10px 0; vertical-align: middle;  }

.formRow label, .formrow label{width: 230px; display: block; float: left; line-height: 30px; font-size: 1.3rem;}
form p.note{font-size: 1.1rem; font-style: italic; color: #696969; margin: 0 0 20px 230px;}
form p.note a {color: #636397;}

.blocbutton{text-align: center; margin: 10px 0; clear: both;}

.btModel01, .btModel02{border: none; box-shadow: none; padding: 0 15px; border-radius: 4px; height: 30px;  line-height: 30px; text-transform: uppercase; display: inline; cursor: pointer; font-size: 14px;}
a.btModel01, a.btModel02, a.btModel03{padding: 0 15px; line-height: 30px; display: inline-block; height: 30px;}
.btModel01{background-color: #636397; color: #FFF;  }
.btModel01:hover {background-color: #9a9ae8; color: #FFF;}
.btModel02{background-color: #888; color: #FFF;}

.btModel03{background-color: #212121; color: #FFF; padding: 2px 8px; border-radius: 4px; height: 24px; font-size: 12px; text-shadow: 1px 1px 0 #212121; border: none;}
.btModel03:hover{color: #CCC;}
.btModel04{background-color: #888; color: #FFF; padding: 2px 5px; text-align: center; }
.btModel05{background-color: #636397; color: #FFF; padding: 2px 5px; text-align: center; }
.btModel05 span{color: #FFF; width: 20px; display: inline-table; height: 20px; background: #888;  -moz-border-radius: 10px;  -webkit-border-radius: 10px;  border-radius: 10px; font-size: 18px; text-align: center; font-weight: bold; line-height: 30px; margin: 0 10px 0 0;}

/* control form */
.help-block{color: #696969; font-size: 11px; font-style: italic; display: inline; margin: 0 0 0 20px;}
.form-error, label.error{color: red; font-size: 13px; margin: 0 0 0 20px; width: auto !important;}

label.error span{color: #212121;}

#GPRF_OneStepFull fieldset {padding: 0 !important; }

/* =============================================================================
   Tables
   ========================================================================== */
table, .table{max-width : 100%; border-collapse: collapse; vertical-align: top;}
table{width: 100%; margin: 0 0 10px 0; font-size: 1.3rem;}
.table{display: table;}

table#recaptcha_table, table.table-auto{table-layout: auto;}

caption{padding: 10px; color: #555; font-style: italic;	background-color: #CCC;}

tr > * + * {}
th{text-align: center; background-color: #E4E6E7; color: #212121; text-transform: uppercase; border-right: 3px solid #FFFFFF; height: 30px; vertical-align: middle;}
th, td{padding: 5px;}

td{color: #333; vertical-align: top;}

td.picto{background-color: #E0DED8;}

/* =============================================================================
   shareTools & tip
   ========================================================================== */
.shareTools{}
.shareTools h4{}
.shareTools ul{overflow: hidden; margin: 10px auto;}

.tip{width: 20%; height: 45px; float: left;}
.tip a{display: block; width: 44px; height: 45px; background: url('../../images/sprite_shareLink.png') no-repeat transparent;}
.tip.twitter a{background-position: -45px -40px;}
.tip.facebook a{background-position: 0 -40px;}
.tip.google a{background-position: -90px -40px;}
.tip.rss a{background-position: -135px -40px;}
.tip.mobile a{background-position: -180px -40px;}

/* =============================================================================
   plugin FancyBox
   ========================================================================== */
/*! fancyBox v2.1.4 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp{padding:0;margin:0;border:0;outline:none;vertical-align:top}
.fancybox-wrap{position:absolute;top:0;left:0;z-index:8020}
.fancybox-skin{position:relative;background:#f9f9f9;color:#444;text-shadow:none;-webkit-border-radius:4px;   -moz-border-radius:4px; border-radius:4px}
.fancybox-opened{z-index:8030}
.fancybox-opened .fancybox-skin{-webkit-box-shadow:0 10px 25px rgba(0,0,0,0.5);   -moz-box-shadow:0 10px 25px rgba(0,0,0,0.5); box-shadow:0 10px 25px rgba(0,0,0,0.5)}
.fancybox-outer,.fancybox-inner{position:relative}
.fancybox-inner{overflow:hidden}
.fancybox-type-iframe .fancybox-inner{-webkit-overflow-scrolling:touch}
.fancybox-error{color:#444;font:14px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;margin:0;padding:15px;white-space:nowrap}
.fancybox-image,.fancybox-iframe{display:block;width:100%;height:100%}
.fancybox-image{max-width:100%;max-height:100%}
.fancybox-skin .orderInfoDetail p span{width:250px}
#fancybox-loading,.fancybox-close,.fancybox-prev span,.fancybox-next span{background-image:url('../../images/GFWK/fancybox_sprite.png')}
#fancybox-loading{position:fixed;top:50%;left:50%;margin-top:-22px;margin-left:-22px;background-position:0 -108px; opacity:0.8; filter: alpha(opacity=80); cursor:pointer;z-index:8060}
#fancybox-loading div{width:44px;height:44px;background:url('../../images/GFWK/fancybox_loading.gif') center center no-repeat}
.fancybox-close{position:absolute;top:-18px;right:-18px;width:36px;height:36px;cursor:pointer;z-index:8040}
.fancybox-nav{position:absolute;top:0;width:40%;height:100%;cursor:pointer;text-decoration:none;background:transparent url('../../images/GFWK/blank.gif');
/* helps IE */
-webkit-tap-highlight-color:rgba(0,0,0,0);z-index:8040}
.fancybox-prev{left:0}
.fancybox-next{right:0}
.fancybox-nav span{position:absolute;top:50%;width:36px;height:34px;margin-top:-18px;cursor:pointer;z-index:8040;visibility:hidden}
.fancybox-prev span{left:10px;background-position:0 -36px}
.fancybox-next span{right:10px;background-position:0 -72px}
.fancybox-nav:hover span{visibility:visible}
.fancybox-tmp{position:absolute;top:-99999px;left:-99999px;visibility:hidden;max-width:99999px;max-height:99999px;overflow:visible !important}
/* Overlay helper */
.fancybox-lock{overflow:hidden}
.fancybox-overlay{position:absolute;top:0;left:0;overflow:hidden;display:none;z-index:8010;background:url('../../images/GFWK/fancybox_overlay.png')}
.fancybox-overlay-fixed{position:fixed;bottom:0;right:0}
.fancybox-lock .fancybox-overlay{overflow:auto;overflow-y:scroll}
/* Title helper */
.fancybox-title{visibility:hidden;font:normal 13px/20px "Helvetica Neue", Helvetica, Arial, sans-serif;position:relative;text-shadow:none;z-index:8050}
.fancybox-opened .fancybox-title{visibility:visible}
.fancybox-title-float-wrap{position:absolute;bottom:0;right:50%;margin-bottom:-35px;z-index:8050;text-align:center}
.fancybox-title-float-wrap .child{display:inline-block;margin-right:-100%;padding:2px 20px;background:transparent;
/* Fallback for web browsers that doesn't support RGBa */
background:rgba(0,0,0,0.8);-webkit-border-radius:15px;   -moz-border-radius:15px;        border-radius:15px;text-shadow:0 1px 2px #222;color:#FFF;font-weight:bold;line-height:24px;white-space:nowrap}
.fancybox-title-outside-wrap{position:relative;margin-top:10px;color:#fff}
.fancybox-title-inside-wrap{padding-top:10px}
.fancybox-title-over-wrap{position:absolute;bottom:0;left:0;color:#fff;padding:10px;background:#000;background:rgba(0,0,0,.8)}
.fancybox-message{position:absolute;top:50px;left:0px;display:block;width:100%;text-align:center;font-size:1.6em;background-color:white;filter:alpha(opacity=85);-khtml-opacity:0.85;-moz-opacity:0.85;opacity:0.85}
.fancybox-message a{color:#007FC6}
.fancybox-message a:hover{text-decoration:underline}


/* =============================================================================
   Datepicker
   ========================================================================== */ 
.ui-datepicker {
	width: 223px;
	height: auto;
	margin: 5px auto 0;
	font: 9pt Arial, sans-serif;
	background-color: #FFF;
    border: 1px solid #636397;
}

.ui-datepicker select {width: auto !important;}

.ui-datepicker a {
	text-decoration: none;
}
/* DatePicker Table */
.ui-datepicker table {
	width: 100%;
}
.ui-datepicker-header {
	background-color: #636397;
	color: #e0e0e0;
	font-weight: bold;
	-webkit-box-shadow: inset 0px 1px 1px 0px rgba(250, 250, 250, 2);
	-moz-box-shadow: inset 0px 1px 1px 0px rgba(250, 250, 250, .2);
	box-shadow: inset 0px 1px 1px 0px rgba(250, 250, 250, .2);
	text-shadow: 1px -1px 0px #000;
	filter: dropshadow(color=#000, offx=1, offy=-1);
	line-height: 30px;
	border-width: 1px 0 0 0;
	border-style: solid;
	border-color: #111;
}
.ui-datepicker-title {
	text-align: center;
}
.ui-datepicker-prev, .ui-datepicker-next {
	display: inline-block;
	width: 30px;
	height: 30px;
	text-align: center;
	cursor: pointer;
	background-image: url('../../images/v1/arrow.png');
	background-repeat: no-repeat;
	line-height: 600%;
	overflow: hidden;
}
.ui-datepicker-prev {
	float: left;
	background-position: center -30px;
}
.ui-datepicker-next {
	float: right;
	background-position: center 0px;
}
.ui-datepicker thead {
	background-color: #f7f7f7;
	background-image: -moz-linear-gradient(top,  #f7f7f7 0%, #f1f1f1 100%);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f7f7f7), color-stop(100%,#f1f1f1));
	background-image: -webkit-linear-gradient(top,  #f7f7f7 0%,#f1f1f1 100%);
	background-image: -o-linear-gradient(top,  #f7f7f7 0%,#f1f1f1 100%);
	background-image: -ms-linear-gradient(top,  #f7f7f7 0%,#f1f1f1 100%);
	background-image: linear-gradient(top,  #f7f7f7 0%,#f1f1f1 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#f1f1f1',GradientType=0 );
	border-bottom: 1px solid #bbb;
}
.ui-datepicker th {
	text-transform: uppercase;
	font-size: 6pt;
	padding: 5px 0;
	color: #666666;
	text-shadow: 1px 0px 0px #fff;
	filter: dropshadow(color=#fff, offx=1, offy=0);
}
.ui-datepicker tbody td {
	padding: 0;
	border-right: 1px solid #bbb;
}
.ui-datepicker tbody td:last-child {
	border-right: 0px;
}
.ui-datepicker tbody tr {
	border-bottom: 1px solid #bbb;
}
.ui-datepicker tbody tr:last-child {
	border-bottom: 0px;
}
.ui-datepicker td span, .ui-datepicker td a {
	display: inline-block;
	font-weight: bold;
	text-align: center;
	width: 30px;
	height: 30px;
	line-height: 30px;
	color: #666666;
	text-shadow: 1px 1px 0px #fff;
	filter: dropshadow(color=#fff, offx=1, offy=1);
}
.ui-datepicker-calendar .ui-state-default {
	background: #ededed;
	background: -moz-linear-gradient(top,  #ededed 0%, #dedede 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ededed), color-stop(100%,#dedede));
	background: -webkit-linear-gradient(top,  #ededed 0%,#dedede 100%);
	background: -o-linear-gradient(top,  #ededed 0%,#dedede 100%);
	background: -ms-linear-gradient(top,  #ededed 0%,#dedede 100%);
	background: linear-gradient(top,  #ededed 0%,#dedede 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#dedede',GradientType=0 );
	-webkit-box-shadow: inset 1px 1px 0px 0px rgba(250, 250, 250, .5);
	-moz-box-shadow: inset 1px 1px 0px 0px rgba(250, 250, 250, .5);
	box-shadow: inset 1px 1px 0px 0px rgba(250, 250, 250, .5);
}
.ui-datepicker-calendar .ui-state-hover {
	background: #f7f7f7;
}
.ui-datepicker-calendar .ui-state-active {
	background: #6eafbf;
	-webkit-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .1);
	-moz-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .1);
	box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .1);
	color: #e0e0e0;
	text-shadow: 0px 1px 0px #4d7a85;
	filter: dropshadow(color=#4d7a85, offx=0, offy=1);
	border: 1px solid #55838f;
	position: relative;
	margin: -1px;
}
.ui-datepicker-unselectable .ui-state-default {
	background: #f4f4f4;
	color: #b4b3b3;
}
.ui-datepicker-calendar td:first-child .ui-state-active {
	width: 29px;
	margin-left: 0;
}
.ui-datepicker-calendar td:last-child .ui-state-active {
	width: 29px;
	margin-right: 0;
}
.ui-datepicker-calendar tr:last-child .ui-state-active {
	height: 29px;
	margin-bottom: 0;
}

/* =============================================================================
   Cookie Bar
   ========================================================================== */ 
#cookie-bar{bottom: auto !important; top: 110px !important; width: 300px !important; font-size: 1.3rem !important;}
#cookie-bar p { padding: 0 35px !important;}
#cookie-bar .cb-close{right: 5px !important;}

.PersonalDATA * {border-width:0px;margin:0px;padding:0px;background-image:none;font-size:100%;float:none;line-height:normal;}
.PersonalDATA .appContent {padding:0px !important;}
.PersonalDATA h1 {font-size:180%;margin:0px;font-weight:bold;}
.PersonalDATA h2 {font-size:140%;margin:30px 0px 15px 0px !important;font-weight:bold;color:#000000;border-width:1px solid #CACACA;background-color:#EFEFEF;padding:3px 10px;}
.PersonalDATA h3 {font-size:120%;margin:20px 0px 10px 0px !important;font-weight:bold;}
.PersonalDATA h4 {font-size:100%;margin:10px 0px 5px 25px !important;}	
.PersonalDATA p {margin:5px 0px;text-align:justify;} 		
.PersonalDATA ul li a {font-size:80%;}
.PersonalDATA mark{background-color:transparent;font-weight:bold;}

/* =============================================================================
   Responsive large / small / tiny
   ========================================================================== */  
@media screen and (max-width: 1240px){
    .constrain{width: 100%; padding: 0 20px;}
}

@media screen and (max-width: 1024px){
    #header .logo a{height: 70px !important; width: 70px !important;}
    .headerRight {right: 5px;}
    .boxsizing{float: none; margin: 20px 0 0 0;}
    .GBEL_newProductList{width: 100%; margin: 0 0 10px 0; overflow: hidden;}
    .GBEL_newProductList .item{float: left; width: 49%; margin: 0 0.5%;}
    .GBEL_quickPurchase .mod{width: 100%;}
    .GBEL_quickPurchase .GBEL_order{overflow: auto;}
    .boxsizing{float: none; clear: both;}
    .detailProduct .productPictures{width: 50%;}
    .detailProduct .productPictures #photo img{width: 100%;}
    .detailProduct .productInfos .detail .price, .detailProduct .productInfos .detail .selectChoice{width: auto !important; float: none;}
    .boxComponent{float: none; width: 100%; padding: 0;}
    .aside{width: 100%; float: none; margin: 10px 0; clear: both;}
    .GBEL_lastProductList{float: none !important; width: 100% !important; margin: 0 !important;}   
}

@media screen and (max-width: 800px) {
    #showMenu .burger{display: block;}
    #navBar{display: none; position: fixed; top: 26px; bottom: 0; width: 250px; z-index: 200; margin-left: -250px; margin-top: 0;}
    #navBar.active { display: block;}
    #navBar .nav_model01 li, #navBar .nav_model02 li {display: block;}
    #navBar .nav_model01,  #navBar .nav_model02{ font-size: 1.3rem;}
    #navBar .itemLevel1{border-bottom: 1px dotted #FFF; position: relative; }
    #navBar .itemLevel1 .showLevel2{display: block; padding: 5px; color: #FFF; position: absolute; top: 5px; right: 0;}
    #navBar .itemLevel1 .showLevel2::after{font-family: 'IcoMoon'; content: '\e916'; color: #636397; float: right; margin: 0; font-size: 1.6rem;}
    #navBar .itemLevel1 .showLevel2.active::after {content: '\e909'; }
    #navBar .nav_niv2 {position: relative; background-color: #EEE; border: none; top: 0; padding: 0; width: 100%;}
    #ad_portal { margin: 160px 0 0 0;}
    .GBEL_highLightRessource.model2 .entete {float: none; clear: both; margin: 0 !important; width: 100%;}
    .GBEL_highLightRessource.model2 .entete span {height: auto; width: 100%; line-height: 1.4rem; font-size: 1.4rem; display: block; padding: 5px 0;}
    .GBEL_highLightRessource.model2 .entete span:after { display: none;}
    .GBEL_highLightRessource.model2 .item, .GBEL_productList .productView, .GBEL_highLightRessource.model3 .item, .GBEL_highLightRessource.model3 .item:first-of-type, .GBEL_lastProductList .item:nth-child(5n+1), .GBEL_universList .thumbnail, .GBEL_highLightRessource.model3 .item, .GBEL_lastProductList .item{width: calc(25% - 20px); margin: 10px;}
    #GPRF_OneStepFull.app .infoPassword {margin: 0;}
    #GPRF_OneStepFull.app label { width: auto; float: none; display: block;}
}

@media screen and (max-width: 768px) {
    .model_1c_1 .col1{width: 100%;}
    .model_1c_1 .col1, .model_1c_1 .col2{ float: none;margin:auto;}
    .model_1c_1 .col1 img, .model_1c_1 .col2 > div{margin:0 !important;}
}

@media screen and (max-width: 468px){
    .constrain{padding: 0 10px;}
    header, #header {margin: 0;}
    .mainHeader .constrain {min-height: 120px;}
    .headerCenter{bottom: 0; left: 0 !important; top: auto; padding: 10px; width: 100%; background-color: #EEE;}
    .topLink { display: none;}
    h1{font-size: 2.2rem;}
    fieldset { padding: 0; margin: 10px 0;}
    #wrapper .railroad li span { display: block; margin: 0 auto;}

    .GBEL_highLightRessource.model2 .item, .GBEL_highLightRessource.model2 .item:first-of-type, .GBEL_productList .productView, .GBEL_highLightRessource.model3 .item, .GBEL_highLightRessource.model3 .item:first-of-type,  .GBEL_universList .thumbnail{width: calc(50% - 25px); margin: 10px; min-height: 265px; background-color: #f2f2f2;}
    .GBEL_lastProductList .owl-wrapper { background-color: #f2f2f2; }
        .GBEL_lastProductList .item:nth-child(5n+1) { width: calc(100% - 20px); background-color: #f2f2f2; }
    .detailProduct .productPictures { float: none; width: 100%;}

    .GBEL_quickPurchase .recapCommand, .GBEL_quickPurchase .cartPurchase {width: 100%;}

    .serviceClient {position: relative; top: auto; bottom: auto; border-radius: 0; height: auto; width: 100%; padding: 5px 0;}
    .footerBottom ul.footerLinks li {width: 45%;}
    .footerBottom ul.footerLinks li:last-child {display: none;}
    .nameBT {font-size: 2rem;}
    .GBEL_basket .basketCount { font-size: 1.1rem;}
    .GBEL_productList .productView.noImage span.illus { min-height: 140px;}
}