@font-face {
font-family: "OpenSans";
src: url('/font/regular/OpenSans-Regular-webfont.eot');
src: url('/font/regular/OpenSans-Regular-webfont.eot?#iefix') format('eot'), url('/font/regular/OpenSans-Regular-webfont.woff') format('woff'), url('/font/regular/OpenSans-Regular-webfont.ttf') format('truetype'), url('/font/regular/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
font-weight: normal;
font-style: normal;
font-display: auto;
}
@font-face {
font-family: "OpenSans";
src: url('/font/italic/OpenSans-Italic-webfont.eot');
src: url('/font/italic/OpenSans-Italic-webfont.eot?#iefix') format('eot'), url('/font/italic/OpenSans-Italic-webfont.woff') format('woff'), url('/font/italic/OpenSans-Italic-webfont.ttf') format('truetype'), url('/font/italic/OpenSans-Italic-webfont.svg#OpenSansLight') format('svg');
font-weight: normal;
font-style: italic;
font-display: auto;
}
@font-face {
font-family: "OpenSans";
src: url('/font/light/OpenSans-Light-webfont.eot');
src: url('/font/light/OpenSans-Light-webfont.eot?#iefix') format('eot'), url('/font/light/OpenSans-Light-webfont.woff') format('woff'), url('/font/light/OpenSans-Light-webfont.ttf') format('truetype'), url('/font/light/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
font-weight: 200;
font-style: normal;
font-display: auto;
}
@font-face {
font-family: "OpenSans";
src: url('/font/bold/OpenSans-Bold-webfont.eot');
src: url('/font/bold/OpenSans-Bold-webfont.eot?#iefix') format('eot'), url('/font/bold/OpenSans-Bold-webfont.woff') format('woff'), url('/font/bold/OpenSans-Bold-webfont.ttf') format('truetype'), url('/font/bold/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
font-weight: bold;
font-style: normal;
font-display: auto;
}
@font-face {
font-family: "OpenSans";
src: url('/font/extra-bold/OpenSans-ExtraBold-webfont.eot');
src: url('/font/extra-bold/OpenSans-ExtraBold-webfont.eot?#iefix') format('eot'), url('/font/extra-bold/OpenSans-ExtraBold-webfont.woff') format('woff'), url('/font/extra-bold/OpenSans-ExtraBold-webfont.ttf') format('truetype'), url('/font/extra-bold/OpenSans-ExtraBold-webfont.svg#OpenSansExtrabold') format('svg');
font-weight: 800;
font-style: normal;
font-display: auto;
}
@font-face {
font-family: "OpenSansCond";
src: url('/font/bold/OpenSans-CondBold-webfont.eot');
src: url('/font/bold/OpenSans-CondBold-webfont.eot?#iefix') format('eot'), url('/font/bold/OpenSans-CondBold-webfont.woff') format('woff'), url('/font/bold/OpenSans-CondBold-webfont.ttf') format('truetype'), url('/font/bold/OpenSans-CondBold-webfont.svg#OpenSansExtrabold') format('svg');
font-weight: bold;
font-style: normal;
font-display: auto;
}
@font-face {
font-family: "OpenSansCond";
src: url('/font/light/OpenSansCondensed-Light.eot');
src: url('/font/light/OpenSansCondensed-Light.eot?#iefix') format('eot'), url('/font/light/OpenSansCondensed-Light.woff') format('woff'), url('/font/light/OpenSansCondensed-Light.ttf') format('truetype'), url('/font/light/OpenSansCondensed-Light.svg#OpenSansCondLight') format('svg');
font-weight: 200;
font-style: normal;
font-display: auto;
}
/* ===================================================== */
/* ICOFONT */
/* ===================================================== */
@font-face {
font-family: 'icoSpartoo';
src: url('/font/icoSpartoo/icoSpartoo-20240905.eot?8js4yz');
src: url('/font/icoSpartoo/icoSpartoo-20240905.eot?8js4yz#iefix') format('embedded-opentype'),
url('/font/icoSpartoo/icoSpartoo-20240905.ttf?8js4yz') format('truetype'),
url('/font/icoSpartoo/icoSpartoo-20240905.woff?8js4yz') format('woff'),
url('/font/icoSpartoo/icoSpartoo-20240905.svg?8js4yz#icospartoo') format('svg');
font-weight: normal;
font-style: normal;
}
[class^="icon-"], [class*=" icon-"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'icoSpartoo'!important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-colisok:before {
content: "\e9a1";
}
.icon-accessoire-homme:before {
content: "\e900";
}
.icon-accessoires:before {
content: "\e901";
}
.icon-affichageDetail:before {
content: "\e902";
}
.icon-affichageMenu:before {
content: "\e903";
}
.icon-affichageVignette:before {
content: "\e904";
}
.icon-aide:before {
content: "\e905";
}
.icon-android:before {
content: "\e906";
}
.icon-annulation-commande:before {
content: "\e907";
}
.icon-annuler:before {
content: "\e908";
}
.icon-apple:before {
content: "\e909";
}
.icon-appli:before {
content: "\e90a";
}
.icon-arobase:before {
content: "\e90b";
}
.icon-attente-paiement:before {
content: "\e90c";
}
.icon-bijoux:before {
content: "\e90d";
}
.icon-blanchimentChlore:before {
content: "\e90e";
}
.icon-blanchimentExclu:before {
content: "\e90f";
}
.icon-blanchimentOxygene:before {
content: "\e910";
}
.icon-blog:before {
content: "\e911";
}
.icon-cadenas:before {
content: "\e912";
}
.icon-chat:before {
content: "\e913";
}
.icon-chaussure:before {
content: "\e914";
}
.icon-chaussure-homme:before {
content: "\e915";
}
.icon-chequeCadeau:before {
content: "\e916";
}
.icon-cochon:before {
content: "\e917";
}
.icon-coeur:before {
content: "\e918";
}
.icon-coupons:before {
content: "\e919";
}
.icon-cumule:before {
content: "\e91a";
}
.icon-eauExclu:before {
content: "\e91b";
}
.icon-enHaut:before {
content: "\e91c";
}
.icon-etoile:before {
content: "\e91d";
}
.icon-facebook:before {
content: "\e91e";
}
.icon-flecheBas:before {
content: "\e91f";
}
.icon-flecheDroite:before {
content: "\e920";
}
.icon-flecheGauche:before {
content: "\e921";
}
.icon-flecheHaut:before {
content: "\e922";
}
.icon-google:before {
content: "\e923";
}
.icon-guideChaussure:before {
content: "\e924";
}
.icon-infog:before {
content: "\e925";
}
.icon-instagram:before {
content: "\e926";
}
.icon-ipad:before {
content: "\e927";
}
.icon-iphone:before {
content: "\e928";
}
.icon-jean:before {
content: "\e929";
}
.icon-lavageProExclu:before {
content: "\e92a";
}
.icon-livraisonGratuite:before {
content: "\e92b";
}
.icon-log-connect:before {
content: "\e92c";
}
.icon-logistic:before {
content: "\e92d";
}
.icon-log-mypack:before {
content: "\e92e";
}
.icon-log-package:before {
content: "\e92f";
}
.icon-log-package2:before {
content: "\e930";
}
.icon-log-print:before {
content: "\e931";
}
.icon-log-renren:before {
content: "\e932";
}
.icon-log-send:before {
content: "\e933";
}
.icon-log-ups:before {
content: "\e934";
}
.icon-log-wechat:before {
content: "\e935";
}
.icon-log-weibo:before {
content: "\e936";
}
.icon-lookbook:before {
content: "\e937";
}
.icon-loupe:before {
content: "\e938";
}
.icon-main:before {
content: "\e939";
}
.icon-mainExclu:before {
content: "\e93a";
}
.icon-maison:before {
content: "\e93b";
}
.icon-mine:before {
content: "\e93c";
}
.icon-modifier:before {
content: "\e93d";
}
.icon-moins:before {
content: "\e93e";
}
.icon-montre:before {
content: "\e93f";
}
.icon-NettoyagePro_F:before {
content: "\e940";
}
.icon-NettoyagePro_F1:before {
content: "\e941";
}
.icon-NettoyagePro_F2:before {
content: "\e942";
}
.icon-NettoyagePro_P:before {
content: "\e943";
}
.icon-NettoyagePro_P1:before {
content: "\e944";
}
.icon-NettoyagePro_P2:before {
content: "\e945";
}
.icon-NettoyagePro_W:before {
content: "\e946";
}
.icon-NettoyagePro_W1:before {
content: "\e947";
}
.icon-NettoyagePro_W2:before {
content: "\e948";
}
.icon-newsletter:before {
content: "\e949";
}
.icon-packClose:before {
content: "\e94a";
}
.icon-packOpen:before {
content: "\e94b";
}
.icon-panier:before {
content: "\e94c";
}
.icon-parrainage:before {
content: "\e94d";
}
.icon-partager:before {
content: "\e94e";
}
.icon-persoCompte:before {
content: "\e94f";
}
.icon-persoHappy:before {
content: "\e950";
}
.icon-pieces:before {
content: "\e951";
}
.icon-pinterest:before {
content: "\e952";
}
.icon-plus:before {
content: "\e953";
}
.icon-poubelle:before {
content: "\e954";
}
.icon-premium-livraison:before {
content: "\e955";
}
.icon-premium-payment:before {
content: "\e956";
}
.icon-premium-reduc:before {
content: "\e957";
}
.icon-prixLePlusBas:before {
content: "\e958";
}
.icon-pull:before {
content: "\e959";
}
.icon-quarante:before {
content: "\e95a";
}
.icon-quarante1:before {
content: "\e95b";
}
.icon-quarante2:before {
content: "\e95c";
}
.icon-rechercher:before {
content: "\e95d";
}
.icon-referencement:before {
content: "\e95e";
}
.icon-repassage1:before {
content: "\e95f";
}
.icon-repassage2:before {
content: "\e960";
}
.icon-repassage3:before {
content: "\e961";
}
.icon-repassageExclu:before {
content: "\e962";
}
.icon-retourGratuit:before {
content: "\e963";
}
.icon-rh:before {
content: "\e964";
}
.icon-robe:before {
content: "\e965";
}
.icon-sac:before {
content: "\e966";
}
.icon-satisfaitOuRembourse:before {
content: "\e967";
}
.icon-sauver:before {
content: "\e968";
}
.icon-sechage:before {
content: "\e969";
}
.icon-sechage1:before {
content: "\e96a";
}
.icon-sechage2:before {
content: "\e96b";
}
.icon-sechageExclu:before {
content: "\e96c";
}
.icon-shoesPair:before {
content: "\e96d";
}
.icon-soixante:before {
content: "\e96e";
}
.icon-soixante1:before {
content: "\e96f";
}
.icon-soixante2:before {
content: "\e970";
}
.icon-tee-shirt:before {
content: "\e971";
}
.icon-telechargement:before {
content: "\e972";
}
.icon-telephone:before {
content: "\e973";
}
.icon-tickets:before {
content: "\e974";
}
.icon-too:before {
content: "\e975";
}
.icon-tools:before {
content: "\e976";
}
.icon-top:before {
content: "\e977";
}
.icon-trente:before {
content: "\e978";
}
.icon-trente1:before {
content: "\e979";
}
.icon-trente2:before {
content: "\e97a";
}
.icon-triangleDroite:before {
content: "\e97b";
}
.icon-triangleGauche:before {
content: "\e97c";
}
.icon-twitter:before {
content: "\e97d";
}
.icon-valider:before {
content: "\e97e";
}
.icon-veste:before {
content: "\e97f";
}
.icon-video:before {
content: "\e980";
}
.icon-wt-logo:before {
content: "\e981";
}
.icon-wt-lookbook:before {
content: "\e982";
}
.icon-wt-mode:before {
content: "\e983";
}
.icon-wt-plus:before {
content: "\e984";
}
.icon-wt-psycho:before {
content: "\e985";
}
.icon-wt-so-hot:before {
content: "\e986";
}
.icon-wt-tendance:before {
content: "\e987";
}
.icon-coeur-plein:before {
content: "\e988";
}
.icon-annulation-commande2:before {
content: "\e989";
}
.icon-attente-paiement2:before {
content: "\e98a";
}
.icon-colis-retourne:before {
content: "\e98b";
}
.icon-partager2:before {
content: "\e98c";
}
.icon-retour-rembourse:before {
content: "\e98d";
}
.icon-validation-commande:before {
content: "\e98e";
}
.icon-whatsapp:before {
content: "\e98f";
}
.icon-cible:before {
content: "\e990";
}
.icon-stats:before {
content: "\e991";
}
.icon-etoile-pleine:before {
content: "\e992";
}
.icon-localisation:before {
content: "\e993";
}
.icon-filtres:before {
content: "\e994";
}
.icon-bell:before {
content: "\e995";
}
.icon-bell-full:before {
content: "\e996";
}
.icon-hanger:before {
content: "\e997";
}
.icon-holidays:before {
content: "\e998";
}
.icon-info:before {
content: "\e999";
}
.icon-info-int:before {
content: "\e99a";
}
.icon-plus-circle:before {
content: "\e99b";
}
.icon-plus-full-circle:before {
content: "\e99c";
}
.icon-vendeur:before {
content: "\e99d";
}
.icon-vendeur-notif:before {
content: "\e99e";
}
.icon-avis:before {
content: "\e99f";
}
.icon-parrain:before {
content: "\e9a0";
}
.icon-eco:before {
content: "\e9a2";
}
.icon-360:before {
content: "\e9a3";
}
.icon-local:before {
content: "\e9a4";
}
.icon-ethique:before {
content: "\e9a5";
}
.icon-certifie:before {
content: "\e9a6";
}
.icon-star-half:before {
content: "\e9a7";
}
.icon-star-full:before {
content: "\e9a8";
}
.icon-star-empty:before {
content: "\e9a9";
}
.icon-hot:before {
content: "\e9aa";
}
.icon-accessoireshoes:before {
content: "\e9ab";
}
.icon-ballerines:before {
content: "\e9ac";
}
.icon-bandouliere:before {
content: "\e9ad";
}
.icon-beaute:before {
content: "\e9ae";
}
.icon-bermudas:before {
content: "\e9af";
}
.icon-bijoux1:before {
content: "\e9b0";
}
.icon-blouses:before {
content: "\e9b1";
}
.icon-boite:before {
content: "\e9b2";
}
.icon-bottes:before {
content: "\e9b3";
}
.icon-bottines:before {
content: "\e9b4";
}
.icon-boxers:before {
content: "\e9b5";
}
.icon-brassieres:before {
content: "\e9b6";
}
.icon-bureau:before {
content: "\e9b7";
}
.icon-cabas:before {
content: "\e9b8";
}
.icon-calecons:before {
content: "\e9b9";
}
.icon-canape:before {
content: "\e9ba";
}
.icon-cartable:before {
content: "\e9bb";
}
.icon-chaisejardin:before {
content: "\e9bc";
}
.icon-chaussettes:before {
content: "\e9bd";
}
.icon-chaussons:before {
content: "\e9be";
}
.icon-chemises:before {
content: "\e9bf";
}
.icon-corps:before {
content: "\e9c0";
}
.icon-costumes:before {
content: "\e9c1";
}
.icon-coussin:before {
content: "\e9c2";
}
.icon-deco:before {
content: "\e9c3";
}
.icon-deguisos:before {
content: "\e9c4";
}
.icon-derbies:before {
content: "\e9c5";
}
.icon-eco2:before {
content: "\e9c6";
}
.icon-entretien:before {
content: "\e9c7";
}
.icon-escarpins:before {
content: "\e9c8";
}
.icon-espadrilles:before {
content: "\e9c9";
}
.icon-jeans:before {
content: "\e9ca";
}
.icon-joggings:before {
content: "\e9cb";
}
.icon-jupes:before {
content: "\e9cc";
}
.icon-lampe:before {
content: "\e9cd";
}
.icon-leggings:before {
content: "\e9ce";
}
.icon-levres:before {
content: "\e9cf";
}
.icon-lit:before {
content: "\e9d0";
}
.icon-maillotsbain:before {
content: "\e9d1";
}
.icon-manteaux:before {
content: "\e9d2";
}
.icon-marcel:before {
content: "\e9d3";
}
.icon-mocassins:before {
content: "\e9d4";
}
.icon-montres:before {
content: "\e9d5";
}
.icon-mules:before {
content: "\e9d6";
}
.icon-new:before {
content: "\e9d7";
}
.icon-ongles:before {
content: "\e9d8";
}
.icon-outlet:before {
content: "\e9d9";
}
.icon-pantalons:before {
content: "\e9da";
}
.icon-parfums:before {
content: "\e9db";
}
.icon-pochette:before {
content: "\e9dc";
}
.icon-portedoc:before {
content: "\e9dd";
}
.icon-portefeuille:before {
content: "\e9de";
}
.icon-pulls:before {
content: "\e9df";
}
.icon-rasoir:before {
content: "\e9e0";
}
.icon-robe1:before {
content: "\e9e1";
}
.icon-robes:before {
content: "\e9e2";
}
.icon-roulettes:before {
content: "\e9e3";
}
.icon-sacados:before {
content: "\e9e4";
}
.icon-sacamain:before {
content: "\e9e5";
}
.icon-sacordi:before {
content: "\e9e6";
}
.icon-sacsport:before {
content: "\e9e7";
}
.icon-salopettes:before {
content: "\e9e8";
}
.icon-sandales:before {
content: "\e9e9";
}
.icon-sante:before {
content: "\e9ea";
}
.icon-serviette:before {
content: "\e9eb";
}
.icon-shampoing:before {
content: "\e9ec";
}
.icon-skate:before {
content: "\e9ed";
}
.icon-slipon:before {
content: "\e9ee";
}
.icon-slips:before {
content: "\e9ef";
}
.icon-sneakers:before {
content: "\e9f0";
}
.icon-solaire:before {
content: "\e9f1";
}
.icon-soutifs:before {
content: "\e9f2";
}
.icon-sport:before {
content: "\e9f3";
}
.icon-sweats:before {
content: "\e9f4";
}
.icon-table:before {
content: "\e9f5";
}
.icon-tableau:before {
content: "\e9f6";
}
.icon-tabouret:before {
content: "\e9f7";
}
.icon-tapis:before {
content: "\e9f8";
}
.icon-teint:before {
content: "\e9f9";
}
.icon-tongs:before {
content: "\e9fa";
}
.icon-travail:before {
content: "\e9fb";
}
.icon-trousse:before {
content: "\e9fc";
}
.icon-tshirt:before {
content: "\e9fd";
}
.icon-underwear:before {
content: "\e9fe";
}
.icon-valise:before {
content: "\e9ff";
}
.icon-vanity:before {
content: "\ea00";
}
.icon-vestes:before {
content: "\ea01";
}
.icon-visage:before {
content: "\ea02";
}
.icon-yeux:before {
content: "\ea03";
}
.icon-ados:before {
content: "\ea04";
}
.icon-baby:before {
content: "\ea05";
}
.icon-basketball:before {
content: "\ea06";
}
.icon-fitness:before {
content: "\ea07";
}
.icon-football:before {
content: "\ea08";
}
.icon-golf:before {
content: "\ea09";
}
.icon-indoor:before {
content: "\ea0a";
}
.icon-kid:before {
content: "\ea0b";
}
.icon-natation:before {
content: "\ea0c";
}
.icon-rando:before {
content: "\ea0d";
}
.icon-rugby:before {
content: "\ea0e";
}
.icon-running:before {
content: "\ea0f";
}
.icon-ski:before {
content: "\ea10";
}
.icon-tennis:before {
content: "\ea11";
}
.icon-velo:before {
content: "\ea12";
}
.icon-boots:before {
content: "\ea13";
}
.icon-cadenas2:before {
content: "\ea14";
}
.icon-zoom:before {
content: "\ea15";
}
.icon-pyjamas:before {
content: "\ea16";
}
.icon-kids:before {
content: "\ea17";
}
.icon-skate2:before {
content: "\ea18";
}
.icon-alert:before {
content: "\ea19";
}
@font-face {
font-family: 'leckerli_oneregular';
src: url('/font/gbb/leckerlione-regular-webfont.eot');
src: url('/font/gbb/leckerlione-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('/font/gbb/leckerlione-regular-webfont.woff2') format('woff2'),
url('/font/gbb/leckerlione-regular-webfont.woff') format('woff'),
url('/font/gbb/leckerlione-regular-webfont.ttf') format('truetype'),
url('/font/gbb/leckerlione-regular-webfont.svg#leckerli_oneregular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'gotham_roundedbold';
src: url('/font/gbb/gothamrounded-bold-webfont.eot');
src: url('/font/gbb/gothamrounded-bold-webfont.eot?#iefix') format('embedded-opentype'),
url('/font/gbb/gothamrounded-bold-webfont.woff2') format('woff2'),
url('/font/gbb/gothamrounded-bold-webfont.woff') format('woff'),
url('/font/gbb/gothamrounded-bold-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'gotham_roundedlight';
src: url('/font/gbb/gothamrounded-light-webfont.eot');
src: url('/font/gbb/gothamrounded-light-webfont.eot?#iefix') format('embedded-opentype'),
url('/font/gbb/gothamrounded-light-webfont.woff2') format('woff2'),
url('/font/gbb/gothamrounded-light-webfont.woff') format('woff'),
url('/font/gbb/gothamrounded-light-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'gotham_roundedbook';
src: url('/font/gbb/gothamrounded-book-webfont.woff2') format('woff2'),
url('/font/gbb/gothamrounded-book-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'gotham_roundedmedium';
src: url('/font/gbb/gothamrounded-medium-webfont.eot');
src: url('/font/gbb/gothamrounded-medium-webfont.eot?#iefix') format('embedded-opentype'),
url('/font/gbb/gothamrounded-medium-webfont.woff2') format('woff2'),
url('/font/gbb/gothamrounded-medium-webfont.woff') format('woff'),
url('/font/gbb/gothamrounded-medium-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@charset "utf-8";
:root {
/* Colors */
--bleu-fonce : #123f59;
--bleu-clair : #00a8c2;
--bleu-light : #cfeff4;
--rouge : #e12634;
--orange : #f59c00;
--orange-clair: #f8efdb;
--noir : #363636;
/* Fonts */
--font-main: 'gotham_roundedbook',sans-serif;
--font-main-bold: 'gotham_roundedbold',sans-serif;
--font-main-medium: 'gotham_roundedmedium',sans-serif;
--font-main-light: 'gotham_roundedlight',sans-serif;
--font-script: 'leckerli_oneregular';
--px-50 : 50px;
--px-35 : 35px;
--px-30 : 30px;
--px-25 : 25px;
--px-20 : 20px;
/* Taille Blocks */
--max-width: 1200px;
/* Premium */
--premium-reciprocity-w: 320px;
--premium-reciprocity-color: #8a1115;
--premium-reciprocity-color-sec: #8a1115;
}
/*****************************************************
**** @MAIN
******************************************************/
.home_carousel {
position: relative;
width: 100%;
min-height: 200px;
}
.carousel {
display: flex;
overflow-x: auto;
font-size: 11px;
-webkit-overflow-scrolling: touch;
}
.carousel > div {
display: flex;
flex-direction: column;
align-items: center;
min-width: 200px;
padding: 0 0 1em 0;
margin-right: 15px;
font: 1.3em OpenSans, Arial, sans-serif;
}
.carousel_styles_title{
position: relative;
bottom:30px;
}
.home_carousel.small .carousel > div {min-width: 150px;}
.carousel > div img {max-width: 100%;}
.carousel > div .carousel_info {
width: 90%;
text-align: left;
color: var(--grey);
}
.carousel > div .carousel_info.brand,
.carousel > div .carousel_info.prix {font-weight: bold; color: var(--black);}
.categories .carousel > div .carousel_info.prix {
font-weight: normal;
text-align: center;
margin-top: 10px;
}
.carousel > div.marques {
min-width: 320px;
min-height: 150px;
margin-right: 30px;
border-radius: 10px;
position: relative;
padding: 0.5em;
}
.carousel > div.styles {
min-width: 200px;
min-height: 216px;
margin-right: 30px;
position: relative;
padding: 0em;
}
.home_op_bg_carousel_marques{
width: 100%;
overflow: hidden;
background-color: #ff6255;
color: #fff;
border-top: 1px solid #fff;
}
.home_op_bg_carousel_pap {
width: 100%;
overflow: hidden;
background-color: #ff6255;
color: #fff;
border-top: 1px solid #fff;
}
.carousel a.prix {
margin-top: auto;
}
.carousel a {
color: var(--black);
display: block;
}
.carousel > div.styles a {
color: #fff;
display: block;
}
.carousel > div.home_op_bg_carousel_pap a {
color: var(--black);
display: block;
}
.carousel_brand_button {
position: absolute;
right: 1em;
padding-bottom: 0.2em;
text-align: right;
border-bottom: 2px solid var(--black);
bottom: 1.5em;
cursor: pointer;
}
.carousel_brand_button a {color: var(--black)!important;}
.preced, .suiv {display: none;}
/*****************************************************
**** @SPECIFICITES
******************************************************/
/* Carousels avec peu de produits */
.fewProducts .carousel {justify-content: center;}
.fewProducts {padding: 0 !important;}
.fewProducts i {display:none;}
/* Carousel listing produits vide */
#droite .home_carousel {
width: calc(100% - 50px);
margin: 0 25px;
}
/* Carousel prodcard */
#content_prodcard ~ .home_carousel {margin-bottom: 40px;}
.moreProducts {
margin:10px auto;
text-transform:uppercase;
opacity:0;
}
.carousel > div:hover .moreProducts {opacity:1;}
/* Carousel dans une popup */
.sp_popup_content .home_carousel {
width: calc(100% - (40px * 2));
margin: auto auto 20px;
}
.sp_popup_content .popup_carousel {
width: 95%;
}
.sp_popup_content .popup_carousel .carousel {
overflow-x: initial;
flex-wrap: wrap;
}
.sp_popup_content .popup_carousel .carousel > div {
width:50%;
margin-right:0;
min-width: initial;
min-height: initial;
}
.sp_popup_content .popup_carousel > i {
display:none;
}
/* Carousel panier vide */
#panierVide .home_carousel {
width: calc(100% - 50px);
margin: 0 25px;
}
#panierVide .home_carousel a { color: var(--grey); }
/* Produits textile */
/* Sécurité mélange des vues */
a.carousel_pap {
min-height:200px;
display:flex;
align-items:center;
}
/*****************************************************
**** @RESPONSIVE
******************************************************/
@media (min-width:768px) {
a.carousel_pap {min-height:260px;}
.carousel > div {margin-right: 30px;}
}
@media (min-width:1025px) {
.preced, .suiv {
display: inline-block;
position: absolute;
font-size: 50px;
top: 80px;
cursor: pointer;
}
.preced {left: -40px;}
.suiv {right: -40px;}
.carousel {
display: flex;
overflow: hidden;
transition: all .4s;
}
.carousel > div img {width: 250px;}
.carousel > .marques img {width: 320px;}
.carousel > div.marques {width: 320px;}
}
/* Disabled horizontal scroll */
@media (max-width:767px) {
.carousel.no-x-scroll {
flex-wrap: wrap;
}
.carousel.no-x-scroll > div {
width: 50%;
min-width: 50%;
min-height: auto;
margin: 0 0 1rem 0;
}
.fewProducts .carousel {justify-content:flex-start;}
}
.fashion_news_link
{
cursor: pointer;
}
.fashion_news_list
{
padding: 8px;
}
.fashion_news_list th,
.fashion_news_list td
{
padding: 6px;
}
.fashion_news_container
{
padding: 8px;
}
.fashion_news_title
{
font-size: 1.2em;
font-weight: bold;
}
.fashion_news_date
{
color: lightgrey;
font-style: italic;
}
.fashion_news_header
{
padding-bottom: 10px;
}
.input_invalid {
box-shadow: 0 0 5px 1px red;
}
.password_eye {
margin-left: -35px;
cursor: pointer;
position: absolute;
width: 32px;
height: 33px;
}
#affiche #iframe_redirect, .popup_alert_content #iframe_redirect {
width: 100%;
height: 50vh;
border: 1px solid lightgrey;
}
.cookies_info {
position: fixed;
z-index: 500;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
background: rgba(0,0,0,0.2);
font-size: 62.5%;
}
.cookies_info-pop {
background-color: #FFF;
width: 90%;
padding: 1em 2.5em;
border-radius: 3px;
}
.cookies_info-pop div {
margin: 0 auto 1em auto;
}
.cookies_info-pop-title {
font-size: 2.5em;
}
.cookies_info-pop-text {
font-size: 1.4em;
text-align: justify;
}
.cookies_info-pop-buttons {
display: flex;
justify-content: space-between;
}
.cookies_info-pop-buttons button {
display: inline-block;
padding: 0.25em 0.5em;
border-radius: 3px;
border: none;
}
.cookies_info-pop-buttons-refuse {
background-color: #E6E6E6;
color: #707070;
cursor: pointer;
}
.cookies_info-pop-buttons-accept {
background-color: #88AF00;
color: #FFF;
cursor: pointer;
}
@media screen and (min-width:1024px) {
.cookies_info-pop {
width: 500px;
padding: 3em 6em;
}
.cookies_info-pop-title {
font-size: 3em;
}
.cookies_info-pop-text {
font-size: 1.8em;
text-align: justify;
}
.cookies_info-pop-buttons button {
padding: 0.75em 1em;
}
}
/*****************************************************
**** SOMMAIRE ****
@APPLI MAG
@HOMEBRANDS
@INSTA
@SERVICES
@MAGTOO
@RESPONSIVE
******************************************************/
/*****************************************************
**** @GLOBAL
******************************************************/
#homeContent {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
#homeContent > div:not(.home_brands):not(:last-child)
{
box-sizing: border-box;
margin-bottom: 50px;
}
#homeContent > div:empty {
margin-bottom: 0;
}
.home_op, .home_tendance, .home_opCo, .home_opCocot {
width: 100%;
position: relative;
overflow: hidden;
margin: 0 auto 3em auto;
background-color: #e6e6e6;
}
.home_op > a:first-child,
.home_op > a:first-child > picture {
display:block;
line-height:0;
}
.home_op > a[href="#rst"] {cursor:default;}
.home_opCo {
min-width: 90%;
font-family: OpenSansCond, Arial, sans-serif;
font-family: var(--font-cond);
font-weight: 200;
background-color: #d95218;
color: #fff;
padding: 1em;
text-align: center;
cursor: pointer;
overflow: initial;
}
.home_opCo .home_op_text .title {
font-size: 3em;
line-height: 1em;
}
.home_opCo .jusqua {
font-size: 1em;
}
.home_opCo .home_discount {
font-size: 4em;
line-height: 1em;
}
.home_opCo_button {
font-size: 1.5em;
color: #c30040;
color: var(--main-color);
background-color: #fff;
padding: 0.5em 1em;
width: 60%;
margin:1em auto;
}
.home_op img, .home_tendance img {
width: 100%;
}
.home_op_text {
font-family: OpenSansCond, Arial, sans-serif;
font-family: var(--font-cond);
font-weight: 200;
padding: 1em;
}
.home_op_text .pretitle{
font-size: 1.2em;
}
.home_op_text .title{
font-size: 2em;
line-height: 1.2em;
}
.home_op_text .subtitle{
font-size: 1.4em;
}
.home_op_text_buttons {
display: flex;
justify-content: space-between;
}
.home_op_text_buttons > div {
margin-top: 10px;
margin-right: 30px;
font: bold 1.2em/1.4em OpenSansCond, Arial, sans-serif;
font: bold 1.2em/1.4em var(--font-cond);
}
.home_op_text_buttons a:hover {
color: #c30040;
color: var(--main-color);
}
.home_op_text_buttons a {
color: #363636;
display: block;
border-bottom: 2px solid #363636;
}
.home_opCo .home_op_text_buttons a {
color: #fff;
display: block;
border-bottom: 2px solid #fff;
}
.home_op_text_buttons i {
font-size: 1.2em;
}
.home_title{
width: 100%;
font: 200 2.2em OpenSansCond, Arial, sans-serif;
font: 200 2.2em var(--font-cond);
margin: 0!important;
}
.home_brands + .home_title {
margin-top:50px!important;
}
.home_brands, .home_service, .home_magtoo {
width: 100%;
}
.home_brands > div, .home_service > div {
flex: 1;
overflow: hidden;
}
.home_brands > div img, .home_magtoo > div img {
width: 100%;
margin: 0;
}
.home_brands > div picture, .home_service > div picture, .home_magtoo > div picture {
margin: 0;
}
.getGlobalLink {
pointer-events: none;
}
.getSingleLink {
pointer-events: all;
}
/*****************************************************
**** @COCOTIER
******************************************************/
.home_opCocot {
min-width: 90%;
font-family: OpenSansCond, Arial, sans-serif;
font-family: var(--font-cond);
font-weight: 200;
text-align: center;
cursor: pointer;
background-color: #f0e7de;
}
.home_opCocot a, .home_opCocot a:hover {
color: #d06f37;
}
.home_opCocot .home_discount {
font-size: 4em;
line-height: 1em;
}
.home_opCocot_button {
font-size: 1.5em;
color: #c30040;
color: var(--main-color);
background-color: #efd1c0;
padding: 0.5em 1em;
width: 25%;
}
.home_discount_cocot {
width: 25%;
color: #d06f37;
font-size: 1em;
padding: 0.5em;
margin-left: 2em;
}
.home_discount_cocot > span:first-of-type {
font-size: 2.5em;
font-family: OpenSansCond, Arial, sans-serif;
font-family: var(--font-cond);
font-weight: bold;
}
.home_opCocot .title {
font-size: 4em;
}
.home_opCocot_discount_buttons {
display: flex;
flex: 1;
flex-direction: column;
}
.home_discounts_cocot {
display: flex;
justify-content: space-around;
}
.home_discount_cocot {
display: flex;
flex-direction: column;
font-size: 1em;
padding: .5em;
margin-left: 2em;
}
.home_discount_cocot:first-of-type, .home_opCocot_button:first-of-type {
margin-left: 0;
}
.home_opCocot_buttons {
display: flex;
justify-content: space-around;
}
.home_opCocot_button {
font-size: 1em;
background-color: #d06f37;
color: #c32227;
padding: 0.5em;
margin-left: 2em;
position: relative;
}
.home_opCocot_button a, .home_opCocot_button a:hover {
color: #f0e7de;
font-size: 1.4em;
}
.home_opCocot_button i {
position: absolute;
right: 10px;
top: 12px;
}
.home_opCocot .home_op_text_buttons, .home_opCo .home_op_text_buttons {
justify-content: center;
}
.home_opCocot .home_op_text_buttons div, .home_opCo .home_op_text_buttons div {
margin-right: 0;
}
/*****************************************************
**** @APPLI MAG
******************************************************/
.home_appli_mag {
width: 100%;
display: flex;
align-items: center;
padding: 1em 2em;
font-size: 10px;
border: 1px solid #e6e6e6;
background-color: #f0eeee;
}
.home_appli_mag_icons {
display: flex;
justify-content: flex-end;
}
.home_appli_mag_icons > img {
max-width: 180px;
}
.home_appli_mag div:first-of-type {
font-size: 3em;
flex: 1;
}
.home_appli_mag i {
font-size: 6em;
}
/*****************************************************
**** @HOMEBRANDS
******************************************************/
.home_brands > div {
margin-bottom: 1.5em;
background-color: #e6e6e6;
}
/*****************************************************
**** @INSTA
******************************************************/
.home_title_insta {
width: 90%;
font: 200 2.5em OpenSansCond, Arial, sans-serif;
font: 200 2.5em var(--font-cond);
margin: 1.5em 0 1em!important;
text-align: center;
}
.home_title_insta i {
display: block;
}
/* fix pour IE laisser en place sinon il est perdu */
.instagram_feed {
width:100%;
display: flex;
}
/*****************************************************
**** @SERVICES
******************************************************/
.home_service > div {
text-align: center;
background-color: #e6e6e6;
font-size: 1.3em;
margin: 1em;
}
.home_service > div .home_op_text_buttons {
justify-content: center;
}
.home_service_new .home_op_text {
background: none;
font: 200 14px OpenSansCond, Arial, sans-serif;
font: 200 14px var(--font-cond);
}
.home_service_new .home_op_text .bloc_conditions {
position: absolute;
bottom: 5px;
left: 30px;
top: 180px;
font-size: 12px;
}
.home_service_new .home_op_text,
.home_service_new .home_op_text a { color: #ffffff; border-color: #ffffff; }
/*****************************************************
**** @MAGTOO
******************************************************/
.home_magtoo > .home_magtoo_title > img {
width: 80%;
}
.home_magtoo .home_title {
font: 200 2em OpenSansCond, Arial, sans-serif;
font: 200 2em var(--font-cond);
margin: 0!important;
}
.home_magtoo a {
font: 200 1.4em OpenSansCond, Arial, sans-serif;
font: 200 1.4em var(--font-cond);
}
.home_magtoo > div > div {
margin-bottom: 2em;
background-color: #fff;
border: 1px solid #e6e6e6;
padding: 1em;
border-radius: 0.5em;
}
.home_magtoo a {
color: #707070;
}
.home_magtoo a, .home_title_insta a {
color: #707070;
display: block;
}
.home_magtoo_title {
text-align: center;
}
.home_magtoo_title i {
font-size: .5em;
line-height: .5em;
color: #c30040;
color: var(--main-color);
}
/*****************************************************
**** @TYPES PRODUITS
******************************************************/
.home_types {
display: flex;
flex-direction: column;
max-width: 1200px;
}
.home_type {
margin: 10px;
position: relative;
display: flex;
justify-content: center;
align-items: flex-end;
font: 18px/22px OpenSansCond, sans-serif;
}
.home_type img{
max-width: 100%;
}
.home_type-text {
background-color: #fff;
padding: 15px 10px;
position: absolute;
min-width: 60%;
text-align: center;
}
.home_type-text-title {
letter-spacing: 1.5px;
font-weight: lighter;
margin-bottom: 10px;
}
.home_type .home_op_text_buttons {
font-weight: bold;
justify-content: center;
}
/*****************************************************
**** @CORNERS
******************************************************/
.corner {
margin-bottom:50px;
}
#homeContent .storytelling:not(:last-child) {
margin-bottom:50px;
}
.home_brands + .storytelling {
margin-top:50px;
}
.storytelling_text {
font-size: 14px;
line-height: 22px;
text-align: justify;
padding: 0 20px;
}
.read_more {
text-align: center;
font-size: 12px;
text-transform:uppercase;
font-weight:bold;
color:#333333;
letter-spacing: 0.09em;
}
/*****************************************************
**** @RESPONSIVE
******************************************************/
@media (min-width:700px) {
.home_op, .home_tendance, .home_opCo, .home_opCocot {
width: 100%;
position: relative;
background-color: #fff;
}
.home_opCo a, .home_opCo a:hover {
color: #fff;
border-bottom: 2px solid #fff;
}
.home_opCo_button a, .home_opCo_button a:hover {
color: #fff;
text-transform: uppercase;
}
.home_opCo {
min-height: 100px;
padding: 0;
font-family: OpenSansCond, Arial, sans-serif;
font-family: var(--font-cond);
font-weight: 200;
background-color: #d95218;
color: #fff;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
font-size: 16px;
}
.home_opCo .title {
font-size: 3em;
}
.home_opCo .jusqua {
font-size: 1em;
margin: 0 1em 0 2em;
}
.home_opCo .home_discount {
font-size: 4em;
line-height: 1em;
margin: 0 1em;
text-decoration: blink;
}
.home_opCo_button {
font-size: 1.5em;
background-color: #fff;
color: #fff;
padding: 0.5em 1em;
margin-left: 2em;
width: 20%;
}
.home_opCocot {
min-width: 90%;
font-family: OpenSansCond, Arial, sans-serif;
font-family: var(--font-cond);
font-weight: 200;
display: flex;
justify-content: center;
align-items: center;
font-size: 16px;
}
.home_opCocot .title {
font-size: 2.5em;
}
.home_opCocot .jusqua {
font-size: 1em;
margin: 0 1em 0 2em;
}
.home_opCocot_discount_buttons {
display: flex;
flex: 1;
flex-direction: column;
}
.home_discounts_cocot {
display: flex;
justify-content: space-around;
}
.home_discount_cocot {
display: flex;
flex-direction: column;
font-size: 1em;
padding: 0.5em;
margin-left: 2em;
}
.home_opCocot_buttons {
display: flex;
justify-content: space-around;
}
.home_opCocot_button {
font-size: 1em;
background-color: #d06f37;
padding: 0.5em;
margin-left: 2em;
}
.home_brands, .home_service {
width: 100%;
display: flex;
}
.home_service > div {
text-align: left;
background-color: #fff;
margin: 0;
}
.home_service > div .home_op_text_buttons {
justify-content: space-between;
}
.home_magtoo_article > .home_title a {
width: 100%;
font: 1em penSansCond, Arial, sans-serif;
font: 1em var(--font-cond);
font-weight: 200;
margin: 1em 0 0!important;
}
.home_magtoo {
background-color: #f0eeee;
width: 100%;
padding: 2em;
}
.home_magtoo > div:nth-child(2) {
display: flex;
}
.home_magtoo .home_op_text_buttons {
justify-content: center;
}
.home_magtoo_article {
text-align: center;
transition: all 0.2s;
}
.home_magtoo_article:hover img {
transform: scale(1.05);
}
.home_magtoo_article_texte {
}
.home_magtoo_title {
text-align: center;
font: 200 5em/2em OpenSansCond, Arial, sans-serif;
font: 200 5em/2em var(--font-cond);
}
.home_magtoo_title i {
font-size: 0.5em;
line-height: 0.5em;
color: #c30040;
}
.home_magtoo > div > div {
margin: 1em;
width: calc(100%/3);
border: none;
background: none;
}
.home_service > div img, .home_magtoo > div img {
background: none;
transition: all ease 200ms;
}
.home_brands > div:first-of-type, .home_service > div:first-of-type {
margin-right: 2rem;
}
.home_brands > div, .home_service > div {
position: relative;
background-color: #fff;
}
.home_magtoo > .home_magtoo_title > img {
width: 25%;
}
.home_brands_text {
background-color: #fff;
}
.home_op_text_container {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
pointer-events: none;
}
.home_opCo .home_op_text_container {
position: relative;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: block;
pointer-events: none;
}
.home_opCocot .home_op_text {
background-color: #fff;
font: 200 16px OpenSansCond, Arial, sans-serif;
font: 200 16px var(--font-cond);
padding: 1em 2em;
transition: all 0.5s;
}
.home_op_text {
background-color: #fff;
font: 200 16px OpenSansCond, Arial, sans-serif;
font: 200 16px var(--font-cond);
padding: 2em 3em;
transition: all 0.5s;
}
.home_brands .home_op_text, .home_service .home_op_text {
background-color: #fff;
font: 200 14px OpenSansCond, Arial, sans-serif;
font: 200 14px var(--font-cond);
padding: 1.5em;
transition: all 0.5s;
}
.OPleft {
justify-content: flex-start;
max-width: 45%;
}
.OPleft > div {
margin-left: 50px;
}
.home_brands .OPleft > div {
margin-left: 30px;
}
.OPcenter {
justify-content: center;
}
.OPcenter > .home_op_text {
max-width: 45%;
}
.home_opCo .OPcenter > .home_op_text {
display: flex;
align-items: center;
max-width: 100%;
justify-content: space-around;
background: none;
}
.OPright {
justify-content: flex-end;
max-width: 45%;
right: 0;
left: auto;
}
.home_service_new .OPright {
justify-content: center;
max-width: 45%;
right: 0;
left: auto;
}
.OPright > div {
margin-right: 50px;
}
.home_brands .OPright > div {
margin-right: 30px;
}
.OPbottomright {
justify-content: center;
top:initial;
bottom: 0;
margin: 0;
margin-left: 50%;
text-align: center;
width: 320px;
height: 150px;
padding: 2em 2em;
background-color: #fff;
}
.OPbottomright .home_op_text {
padding: initial;
width: 100%;
}
.OPbottomright .home_op_text_buttons {
justify-content: space-around;
}
.OPbottomright .home_op_text_buttons > div {
margin: 10px 0 0;
}
.OPtopCenter .home_op_text {
margin-bottom: 25%;
}
.OPbottomCenter .home_op_text {
margin-top: 25%;
}
.bloc_conditions {
position: absolute;
bottom: 5px;
left: 0px;
font-size: 12px;
}
.home_service_new .bloc_conditions {
position: relative;
bottom: 5px;
left: 0px;
font-size: 12px;
top:10px;
}
.home_opCo .bloc_conditions {
right: 20px;
text-align: right;
}
.home_types {
display: flex;
flex-direction: row;
max-width: 1200px;
}
}
@media (min-width:1025px) {
.home_service > div {
display: flex;
overflow: hidden;
}
.home_title, .home_title_insta {
width: 100%;
font: 200 2.5em OpenSansCond, Arial, sans-serif;
font: 200 2.5em var(--font-cond);
margin-bottom: 10px!important;
}
.instagram_gallery {
width: 1200px;
}
}
/*****************************************************
**** @SERVICES
******************************************************/
.home_service_new .home_op_text {
background: none;
font: 200 14px OpenSansCond, Arial, sans-serif;
font: 200 14px var(--font-cond);
display: block;
}
/*****************************************************
**** @VIDEOS
******************************************************/
.videoMask {
height:100vh;
width: 100vw;
background: rgba(0,0,0,.5);
position:fixed;
top:0;
left:0;
display:flex;
align-items: center;
justify-content: center;
z-index:500;
}
.videoPopup {
padding: 10px;
background-color: #000;
position:relative;
}
.videoPopup i {
position: absolute;
top: 5px;
right: -35px;
color: #fff;
width: 30px;
height: 30px;
font-size: 30px;
cursor:pointer;
}
.videoPopup video {max-width: 800px;}
@media screen and (max-width: 700px) {
.videoPopup {
padding: 10px;
background-color: #000;
position:relative;
}
.videoPopup i {
top: -40px;
right: 0;
width: 35px;
height: 35px;
font-size: 35px;
}
.videoPopup video {max-width: 100%;}
}
@charset "utf-8";
/*****************************************************
**** SOMMAIRE **** GLOBAL
@DISPLAY LARGE
@DISPLAY SMALL
@POPUPS
@RESPONSIVE
******************************************************/
/*****************************************************
**** @DISPLAY LARGE
******************************************************/
/* HEADER */
.premium_visuel {display:none;}
.premium_logo {
display: block;
margin: 20px auto;
}
.premium_accroche {
font: 200 25px var(--font-main), OpenSansCond, Arial, sans-serif;
font-size: var(--px-25);
text-align: center;
margin: auto 10px;
}
/* MESSAGES ABONNÉS */
.is_premium, .premium_renew {
display:flex;
justify-content:center;
align-items:center;
text-align:center;
margin: 20px auto;
}
.is_premium img,
.premium_renew img {width:80px; margin-right:20px;}
.is_premium div p, .premium_renew div p {margin: 5px;}
.is_premium div p:first-child, .premium_renew div p:first-child {font: bold 16px OpenSans, Arial, sans-serif;}
.is_premium div p:first-child, .premium_renew div p:first-child {font: bold 16px var(--font-main);}
.premium_renew div p:first-child {color: #c30040;}
.premium_renew div p:first-child {color: var(--main-color);}
.premium_renew div p:nth-child(2) {text-align: center;}
/* BLOCS AVANTAGES */
.premium_subtitle, .gold_subtitle {
text-align: center;
font: bold 30px/40px var(--font-cond), OpenSansCond, Arial, sans-serif;
font-size: var(--px-30);
text-transform: uppercase;
margin: 30px auto 20px auto;
}
.premium_subtitle span {
padding: 0 20px;
}
.premium_subtitle::before, .premium_subtitle::after {
content: '';
display: inline-block;
height: 3px;
width: 10%;
border-top: 3px solid #363636;
vertical-align: middle;
margin-top: .1em;
}
.premium_reciprocity {
display:block;
width:var(--premium-reciprocity-w);
margin: 0 auto 20px;
padding:5px;
background-color: #251A5D;
background-color: var(--premium-reciprocity-color);
color: #fff;
text-transform: uppercase;
text-align:center;
cursor: default;
}
#premium_liste {
display:flex;
flex-wrap: wrap;
}
#premium_liste :nth-child(2), #premium_liste :nth-child(5) {
margin:0 10px 10px 10px;
}
.premium_advantage {
flex: 1 1 30%;
background-color: #f0eeee;
background-color: var(--lighter-grey);
text-align:center;
margin-bottom: 10px;
}
.premium_advantage img {width:100%;}
.premium_details {padding:20px 10px;}
.premium_details i {
display:inline-block;
font-size:30px;
margin-bottom:10px;
}
.premium_large .h2_premium {
font: bold normal 20px/25px var(--font-cond), OpenSansCond, Arial, sans-serif !important;
font-size: var(--px-20) !important;
text-transform: uppercase !important;
text-align:center!important;
margin: 0 auto 20px!important;
}
.premium_conditions {
margin-top: 10px;
text-align:right;
font-style: italic;
font-size:10px;
}
.premium_conditions span br {display:none;}
.premium_btn_premium_conditions {
text-decoration: underline;
text-transform: capitalize;
}
/* OFFRE PREMIUM DAYS */
.premium_large span.spd_offre {
font: bold 1.4em var(--font-main), OpenSans, Arial, sans-serif;
color: #c30040;
color: var(--main-color);
text-transform: uppercase;
padding: 0 5px;
}
.premium_large span.spd_dates {
display:block;
font-style: italic;
margin-bottom:5px;
}
/* BLOC PRIX */
.premium_addtobasket {
display:block;
width:300px;
margin: 40px auto;
padding:40px;
border: 1px solid black;
border-radius: 10px;
}
.premium_price {text-align:center;margin-bottom:10px;}
.premium_price span:first-child {
font: 200 50px/40px var(--font-cond), OpenSansCond,Arial,sans-serif;
font-size: var(--px-50);
color : #c30040;
color : var(--main-color);
}
.premium_price span:nth-child(2) {
font: 200 35px/40px var(--font-cond), OpenSansCond, Arial, sans-serif;
font-size: var(--px-35);
color : #c30040;
color : var(--main-color);
}
.premium_price span:last-child {
font: 200 25px/22px var(--font-cond), OpenSansCond, Arial, sans-serif;
font-size: var(--px-25);
display:block;
}
.premium_price > span:last-child::after {content : '*';}
.monthly {text-align:center;font: 200 italic 15px var(--font-cond), OpenSansCond, Arial, sans-serif;margin-top:5px;}
/* #service_premium button {display:block;margin:20px auto;} */
/* If discounted */
.premium_discount {display:block;}
.premium_discount span {
font-style:normal!important;
font-size:20px!important;
font-size:var(--px-20)!important;
color: #363636!important;
display:inline!important;
}
.premium_discount_new span {
display:inline!important;
}
/* GOLD */
.premium_gold {
max-width: 80%;
margin: auto;
display:flex;
justify-content: space-between;
}
.premium_gold > div {width: 48%; overflow:hidden;}
.premium_gold div img {width:100%;}
.premium_gold > div:last-child {
padding:40px;
border: 1px solid black;
display:flex;
flex-direction: column;
justify-content: center;
text-align:center;
}
.gold_od {
display:inline-block;
border: 1px solid black;
border-radius: 5px;
padding: 5px 20px;
text-transform: uppercase;
font: 200 18px var(--font-cond), OpenSansCond, Arial, sans-serif;
align-self: center;
}
.gold_subtitle {margin: 20px auto;}
.gold_text {font: 200 18px var(--font-cond), OpenSansCond, Arial, sans-serif; margin-bottom:20px;}
.premium_gold button.btn {align-self: center;}
.gold_conditions {
margin: 20px auto;
font-style: italic;
font-size: 10px;
width: 70%;
}
.premium_large .faq {
margin:60px auto;
width: 80%;
padding: 40px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
font-size: 1.3em;
box-shadow: 0 0 5px 0 rgba(0,0,0,.3);
border-radius: 10px;
}
.premium_large .faq .title {
width:100%;
font: bold 1.6em OpenSans, Arial, sans-serif;
color: #c30040;
color: var(--main-color);
text-align: center;
border-bottom: 1px solid #c0c0c0;
padding-bottom:40px;
margin-bottom: 40px;
}
.premium_large .faq > div {
width: 45%;
margin-bottom: 40px;
}
.premium_large .faq > div div:first-child {
font-weight: bold;
font-size: 1.2em;
line-height: 1.3em;
margin-bottom: 15px;
}
/*****************************************************
**** @DISPLAY SMALL
******************************************************/
/* AVERTISSEMENT RENOUVELLEMENT */
.premium_renew_small {
background-color: #f0eeee;
background-color: var(--lighter-grey);
display:flex;
padding:15px;
align-items: center;
}
.premium_renew_small img {height:40px;}
.premium_renew_small div {
text-align:center !important;
flex-grow: 1;
}
.premium_renew_small div p {margin-bottom:5px;text-align:center!important;}
.premium_renew_small div p:first-child {font: bold 14px var(--font-main), OpenSans, Arial, sans-serif; color:#c30040; color: var(--main-color);}
.premium_renew_small i {font-size: 25px;}
/* BASE */
.premium_small {
display:flex;
align-items: center;
}
.premium_small .premium_visuel {
display:flex;
align-self: stretch;
width:20%;
overflow: hidden;
}
.premium_small .premium_visuel a {
display:flex;
align-self: stretch;
width:100%;
overflow: hidden;
}
.premium_small .premium_visuel img {display:initial;object-fit:cover;max-width:100%;}
/* AVANTAGES */
.premium_small .premium_liste {
width:50%;
padding: 0 20px;
}
.premium_small .premium_logo {
padding: 0;
height:40px;
margin:0 0 20px;
}
.premium_small .premium_liste ul {list-style-type:none;margin-bottom:10px;padding-left:0;}
.premium_small .premium_liste .premium_advantage {
margin-left:0;
width:100%;
background-color:initial;
text-align: left;
}
.premium_small .premium_liste .premium_advantage .h2_premium {
font: 16px/22px var(--font-main), OpenSans, Arial, sans-serif;
text-transform: initial;
margin-bottom:10px;
}
.premium_small .premium_liste .premium_advantage .h2_premium i {
font-size: 22px;
line-height: 22px;
margin-right:5px;
}
.premium_small .premium_reciprocity {
width: initial;
background-color: initial;
color: #251A5D;
color: var(--premium-reciprocity-color-sec);
font: bold 1.2em var(--font-cond), OpenSansCond, Arial, sans-serif;
text-align:left;
text-transform: initial;
margin-bottom:10px;
}
.premium_addtobasket {height:fit-content;text-align: center;}
/* OFFRE PREMIUM DAYS */
.premium_small span.spd_offre {
font: bold 1.1em var(--font-main), OpenSans, Arial, sans-serif;
color: #c30040;
color: var(--main-color);
}
.premium_small span.spd_dates {
display:block;
font-size:.9em;
font-style: italic;
margin-left:27px;
}
/* ABONNÉ */
.premium_addtobasket .is_premium {
display:block;
text-align:center!important;
}
.premium_small .premium_addtobasket .is_premium img {margin-bottom: 10px;}
.premium_small .premium_addtobasket .is_premium p {text-align:center!important;}
.premium_small .premium_addtobasket .is_premium .premium_conditions {text-align:center;}
/* premium_conditions */
.premium_small .premium_conditions {text-align:initial; margin-bottom:0;}
.premium_small .premium_conditions span br {display:inline;}
.premium_small .premium_addtobasket {
width:30%;
margin: 0;
padding: 30px;
}
.premium_small .premium_addtobasket .monthly {margin-top:5px;}
.premium_small .premium_addtobasket .premium_conditions {
display:block;
margin:0;
text-align:justify;
}
.money_saved {font-weight: bold;}
/*****************************************************
**** @POPUPS
******************************************************/
/* PREMIUM IN CART */
.popup-panier-title {
width:80%;
margin:auto 10%;
font-size:15px;
}
.popup_alert_content .premium_small {margin: 40px 20px;}
.premium_offer_xmas {
background-image: url(/images/premiumXmas.jpg);
background-position: top;
}
/* premium_conditions */
#popup_cgv_premium .all-list {
margin:10px 20px !important;
padding:0;
width: calc(100% - 40px);
}
#popup_cgv_premium .cgv-premium {margin: auto 20px !important;}
#popup_cgv_premium.section-cgv p {
margin: auto 20px;
max-width: 100%;
}
/*****************************************************
**** @RESPONSIVE
******************************************************/
@media screen and (min-width:768px) {
.premium_logo_1 {display:none;}
.premium_small .premium_subtitle {display:none;}
}
@media screen and (min-width:768px) and (max-width:1100px) {
.premium_small {margin: 40px 5% auto;}
.premium_visuel {align-self: stretch;}
.premium_small .premium_liste ul {padding:0;}
}
@media screen and (max-width:768px) {
/* DISPLAY LARGE */
.premium_visuel {display:block;}
.premium_large .premium_logo {max-width:200px;}
.premium_accroche {font-size: 20px;}
.premium_large span.spd_offre {font-size: 1.2em}
/* Message premium, renouvellement et réciprocité */
.premium_subtitle, .gold_subtitle {
font-size: 2em;
line-height:1.1em;
}
.premium_subtitle span {padding: 0;}
.premium_subtitle::before, .premium_subtitle::after {display: none;}
.premium_large .premium_reciprocity {
max-width:90%;
margin:auto auto 20px;
}
#premium_liste {display:block;}
.premium_advantage {
width:100%;
background-color: initial;
border-bottom: 1px solid #c0c0c0;
border-bottom: 1px solid var(--light-grey);
}
.premium_advantage + .premium_advantage {margin:0;}
.premium_advantage:first-child {
border-top: 1px solid #c0c0c0;
border-top: 1px solid var(--light-grey);
}
.premium_advantage img {display:none;}
.h2_premium {margin-top: 0;}
.premium_conditions {
margin-top:0;
padding: 40px 5vw;
text-align:center;
font-size:1em;
}
.premium_addtobasket {
margin: 0 auto;
border:none;
border-radius:0;
width:90%;
background-color: #f0eeee;
background-color: var(--lighter-grey);
padding:20px;
}
.premium_gold {
display:block;
max-width:90%;
margin-bottom: 20px;
}
.premium_gold > div {width:100%;}
.premium_gold > div:first-child {height:350px;}
.premium_gold > div:first-child a img {object-fit:cover;}
.premium_gold > div:last-child {
background-color: #f0eeee;
background-color: var(--lighter-grey);
border:none;
padding:20px;
}
.gold_text {margin-bottom: 10px;}
/* FAQ */
.premium_large .faq {width: 90%; padding: 20px; font-size: 1.2em;}
.premium_large .faq .title {padding-bottom: 20px; margin-bottom: 30px;}
.premium_large .faq > div {width: 100%; margin-bottom: 30px;}
.premium_large .faq > div div:first-child {font-size: 1.1em;}
/* DISPLAY SMALL */
.premium_small {flex-direction: column; margin-top:40px;}
.premium_logo_2 {display:none;}
.premium_small .premium_logo_1 {max-width:90%;}
.premium_small .premium_logo {margin-bottom:10px;}
.premium_small .premium_visuel, .premium_small .premium_liste, .premium_small .premium_addtobasket {
width:90%;
margin:auto;
border-width: 0 1px;
border-style: solid;
border-color: #000;
}
.premium_small .premium_visuel {
border-top:1px solid #000;
border-radius: 5px 5px 0 0;
}
.premium_small .premium_subtitle {
margin: 15px 0;
font: bold 1.5em var(--font-cond), OpenSansCond, Arial, sans-serif;
text-transform: initial;
text-align: left;
}
.premium_small ul {padding-left:0;}
.premium_small .premium_advantage {border:none;}
.premium_small span.spd_dates {margin-left:0;}
.premium_small .premium_reciprocity {margin:0 0 10px; padding:0; width:100%;}
.premium_small .premium_conditions {padding: 0;margin-bottom: 20px;}
.premium_small .premium_addtobasket {
border-bottom:1px solid #000;
border-radius: 0 0 5px 5px;
}
.premium_small .premium_addtobasket button {width:100%;}
.premium_small .premium_addtobasket .premium_conditions {color: #363636; text-align: left; font-size: 10px;}
/* message renouvellement*/
.premium_renew_small {margin-bottom:10px; padding : 10px 15px;}
.premium_renew_small img {height: 30px;}
.premium_renew_small div p {margin:0;}
.premium_renew_small i {font-size: 15px;}
.premium_small .is_premium, .premium_renew {margin:0 20px;}
}
@media screen and (max-width:480px) {
.premium_gold > div:first-child {height:250px;}
/* Popup premium in cart */
.premium_logo_popup {max-width:90%;margin: 20px 5%;display:block!important;}
.popup-panier-title {width:90%;margin: 20px 5%;}
.popup_alert_content .premium_small {margin: 20px 0;}
.popup_alert_content .premium_small .premium_liste {border-top: 1px solid #000; border-radius: 5px 5px 0 0;}
.popup_alert_content .premium_small .premium_addtobasket {padding: 20px;}
.popup_alert_content .premium_small .premium_addtobasket .premium_price {padding: 0;}
.popup_alert_content .premium_small .premium_visuel {display: none;}
#popup_alert_parent li.premium_advantage {
padding: 0;
border-bottom:none;
}
}
@media screen and (max-width:360px) {
.premium_gold > div:first-child {height:150px;}
}
/*****************************************************
**** SOMMAIRE **** PRODCARD RESPONSIVE
@GLOBAL
- BOUGHT_BY
- AVIS (GLOBAL)
- ADVANCED SIZELIST
@RESPONSIVE
*****************************************************/
/*****************************************************
**** @GLOBAL
******************************************************/
/* BOUGHT_BY */
.bought_by {
display:block;
opacity:0;
position: absolute;
top: 30px;
right: -50px;
background-color: #fff;
border-radius: 8px;
padding: 10px 15px;
border: 1px solid var(--main-color);
max-width: 180px;
cursor: default;
transition: all ease 200ms;
}
.bought_by.on {
display: block;
opacity:1;
right: 0;
}
.dis_content_vignette_discount:not([style="display:none"]) + .bought_by {
top: 80px;
}
/* AVIS (GLOBAL) */
#avis {
font-size: 10px;
cursor: pointer;
display: inline-flex;
flex-wrap: wrap;
align-items:center;
width: 90%;
margin: auto;
text-align: left;
}
#avis .note {
font: bold 12px OpenSans, Arial, sans-serif;
margin-left: 8px;
}
#avis .nb_avis {
width:100%;
margin-top:5px;
}
/* DESK */
.avisRecap{
display: inline-block;
width: 30%;
box-sizing: border-box;
border: 1px solid #e6e6e6;
padding: 15px;
font-size: 16px;
}
.avisRecap >div:first-of-type {
font: bold 30px/40px OpenSans, Arial, sans-serif;
text-align: center;
}
.avisRecap >div:first-of-type, .avisRecap >div:nth-child(2) {
text-align: center;
}
.avisClients {
font: 16px/20px OpenSans, Arial, sans-serif;
display: inline-block;
width: 66%;
box-sizing: border-box;
vertical-align: top;
margin-left: 4%;
}
.avisClients > div:first-of-type > span > span {
font: bold 20px/24px OpenSans, Arial, sans-serif;
}
.avisClients > div:first-child {
padding-bottom: 2em;
}
.avisClientsDetail {
border-top: 1px solid #e6e6e6;
padding: 20px 0;
}
.avisClientsDetail >div:nth-child(2){
font: 18px/22px OpenSans, Arial, sans-serif;
color: #707070;
}
.avisClientsDetailHead {
font: 18px/22px OpenSans, Arial, sans-serif;
color: #363636;
}
.avisClientsDetailHead > div {
font: 200 16px/22px OpenSans, Arial, sans-serif;
text-transform: uppercase;
color: #c0c0c0;
}
.avisClientsDetailStars {
display: inline-block;
margin: 10px 10px 10px 0;
}
.avisClient {
clear: both;
border-top: 1px solid #e6e6e6;
border-bottom: 1px solid #e6e6e6;
}
.avisClient .comment {
line-height: 18px;
padding:0;
margin: 1em 0;
font: 12px OpenSans, Arial, sans-serif;
width:100%;
display:flex;
justify-content: center;
align-items: flex-start;
}
.avisClient .item {
padding: 1px 2px 1px 4px;
background-color: #c0c0c0;
}
.comment > div.review_global:nth-child(2) {
margin: 0 10px;
padding: 0 20px;
border-left: 1px solid #c0c0c0;
border-right: 1px solid #c0c0c0;
text-align: left;
width: 280px;
}
.review_global {
display: inline-block;
box-sizing: border-box;
width: 220px;
vertical-align: top;
text-align: center;
font-size: 14px;
}
.review_global > span {
color: #363636;
font: bold 18px OpenSans, Arial, sans-serif;
display: block;
}
.review_global > div > span {
color: #c30040;
font-family: OpenSans, Arial, sans-serif;
font-weight: bold;
font-size: 16px;
}
.review_global:first-child > div:first-child {margin: 0 0 10px;}
.comment {
padding:0;
margin: 0 5px 0 0;
}
.dis_content_vote {
position: relative;
margin: 10px auto auto;
width: 100px;
height: 30px;
background: url(/images/stars_0.png) no-repeat left top;
}
.dis_over_star {
float: left;
width: 20px;
height: 20px;
}
#reviewid {
width: 300px;
height: 150px;
border: 1px solid #c0c0c0;
}
/*----- MOBILE -----*/
@media screen and (max-width: 600px) {
.avisClient {
width: 100%;
padding: 0 5% 2em;
margin: 2em auto;
border-bottom: 1px solid #777;
}
.avisClient .prodcardOtherInfosTitle {
text-transform: uppercase;
font-size: 1.3em;
font-family: OpenSans, Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
font-style: normal;
display: block;
-webkit-margin-before: 1.33em;
-webkit-margin-after: 1.33em;
-webkit-margin-start: 0;
-webkit-margin-end: 0;
}
.avisClient .titre_details {
display: block;
font-family: OpenSans, Arial, sans-serif;
font-weight: bold;
font-size: 1.3em;
text-transform: uppercase;
margin-bottom: .5em;
}
.avisRecap {
display: initial;
width: 100%;
border: 0;
padding: 0;
}
.avisClient .comment {
display:initial;
}
.avisClients{
width: 100%;
padding: 0;
margin: 0;
}
.avisClient hr {
margin: 15px 0;
border-width: 1px 0 0;
}
.avisClients > div:first-of-type > span {
font-size: 13px;
}
.avisClients > div:first-of-type > span > span {
font-size: 15px;
}
.avisClients .bt_red {
width: 100%;
font-size: 15px;
}
.avisClientsDetailHead {}
div[itemprop="reviewRating"] {
display:flex;
justify-content: space-between;
margin: 15px 0;
}
.avisClientsDetailStars {
margin:0;
display:flex;
flex-direction: column;
font-size: 13px;
}
.avisClientsDetail > div:last-child {
margin-top: 15px;
}
.avisRecap > div:first-of-type, .avisRecap >div:nth-child(2) {text-align: initial;}
.avisRecap > div:first-of-type {font-size: 1.8em;}
.avisRecap .rating {
font-family: OpenSans,Verdana,Arial,Helvetica,sans-serif;
font-weight: bold;
font-size: 1.3em;
text-align: initial;
}
.avisRecap .rating span {
color: #c30040;
color: var(--main-color);
}
#link_more_review {
display:block;
width: 100%;
text-align: center;
text-transform: uppercase;
padding: 10px;
box-sizing: border-box;
font-size: 1.1em;
border-top: 1px solid #e6e6e6;
}
}
/*****************************************************
*** @ADVANCED SIZELIST
*****************************************************/
.sizeList_container {
position: relative;
margin-bottom: 10px;
}
.sizeList_title {
margin: 30px auto 10px auto;
font: 15px/18px OpenSans,Arial,sans-serif;
text-align: left;
}
.sizeList_selected {
border: 1px solid #c0c0c0;
font: 15px/18px OpenSans,Arial,sans-serif;
padding: 12px 15px;
margin: 10px auto 0;
display:flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
}
.sizeList_selected.disabled {
background-color: #f0eeee;
cursor: initial;
}
.sizeList_selected.disabled i {
color: #c0c0c0;
}
.sizeList_selected > div {
flex-grow: 1;
display: flex;
justify-content: flex-start;
}
.sizeList_selected div div:not(:first-child)::before {
content: '\00a0-\00a0';
}
.sizeList_selected i {
font-size: 16px;
transition: all ease 200ms;
}
.sizeList_selected i.expanded {
transform: rotate(180deg);
}
.sizeList {
display: block;
z-index: 2;
font: 15px/18px OpenSans, Arial, sans-serif;
width: 100%;
list-style-type: none;
box-sizing: border-box;
border: 1px solid #c0c0c0;
border-width: 0;
position: absolute;
max-height: 0;
overflow:hidden;
transition: max-height ease 200ms;
margin:0;
padding:0;
}
.sizeList.expanded {
max-height: 200px;
overflow: auto;
scrollbar-width: thin;
border-width: 0 1px 1px;
}
.sizeList.expanded::-webkit-scrollbar-track {
background-color: #f0eeee;
}
.sizeList.expanded::-webkit-scrollbar {
width: 6px;
background-color: #f0eeee;
}
.sizeList.expanded::-webkit-scrollbar-thumb {background-color: #707070;}
.sizeList li {
box-sizing: border-box;
margin-left: 0;
display: flex;
justify-content: space-between;
width: 100%;
padding: 12px 15px;
cursor: pointer;
background-color: #fff;
}
.sizeList li:hover {
background-color: #f0eeee;
}
.sizeList li:not(:last-child) {
border-bottom: 1px solid #f0eeee;
}
.sizeList li.oos {
color: #c0c0c0;
}
.sizeList li.selected {
background-color: #dbdbdb;
}
.sizeList li input {
display:none;
}
/*****************************************************
**** @RESPONSIVE
******************************************************/
@media screen and (max-width: 600px) {
/* BOUGHT_BY */
.bought_by {
position: initial;
max-width: initial;
width: 90%;
margin: -25px auto auto;
text-align: center;
font-size: .9em;
background: #f0eeee;
border: 0;
height:0;
padding:0;
}
.bought_by.on {
height: fit-content;
padding: 7px 5px;
border: 1px solid #c0c0c0;
margin-top: -10px;
}
/* AVIS (GLOBAL) */
#prodcard_premium_info > div#avis {
width: 90%;
font-size: 1.3em;
margin: 1em 5% 0;
text-align: left;
justify-content: flex-start;
flex-wrap: nowrap;
}
#avis .note {
margin: 0 8px;
}
#avis .nb_avis {
font-size: .7em;
margin: 0;
}
/* ADVANCED SIZELIST */
.sizeList_container {
width: 90%;
margin: auto;
}
.sizeList_mask {
width:100vw;
height: 100vh;
background: rgba(0,0,0,.5);
position: fixed;
bottom:0;
left:0;
z-index: 11;
display:none;
}
.sizeList {
position: fixed;
bottom:0;
left:0;
z-index: 12;
}
.sizeList.expanded {
max-height: 65vh;
border-width: 1px 0 0;
}
.sizeList_mask.expanded {
display:block;
}
.sizeList li {
padding: 20px 15px;
}
}
/*****************************************************
*** @ETOILES
*** Avis, notes type Google ...
*****************************************************/
.avis_stars {
font-size:14px;
color: #707070;
}
.avis_stars i:not(:last-child) {
margin-right: 2px;
}
.avis_stars i.icon-star-full, .avis_stars i.icon-star-half {
color: #c30040;
color: var(--main-color);
}
.avis_stars i.icon-star-empty {
color: #707070;
}
/*****************************************************
*** @BARRES DE NOTES
*****************************************************/
.barre_label {
display: inline-block;
font-family: OpenSans;
font-weight: bold;
width: 118px;
text-transform: uppercase;
vertical-align: middle;
margin-bottom: 10px;
}
.barre {
display: inline-block;
width: 100px;
height: 10px;
background-color: #e6e6e6;
vertical-align: middle;
margin: 7px 0 10px;
}
.barre >div:first-child {
background-color: #c30040;
background-color: var(--main-color);
}
.barre + span {
width: 32px;
text-align: left;
}
.rating + div {
margin: 10px 0 15px;
}
.repartition_avis {
text-align: center;
}
.repartition_avis .barre_label {
width: 50px;
}
.repartition_avis .barre > div:first-child {
background-color: #363636;
}
.repartition_avis .barre + span {
display:inline-block;
margin-left: 8px;
}
@media screen and (max-width: 600px) {
.review_level_bar {
display: flex;
align-items: center;
justify-content: space-between;
}
.barre {
width: 100%;
flex-grow:1;
margin-left: 10px;
}
.barre + span {
width: 45px;
}
}
/*****************************************************
*** @TRUSTPILOT
*****************************************************/
.trustpilot {
display:flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin: 20px auto 0;
width:fit-content;
}
.trustpilot:hover {color: #363636;}
.trustpilot > img:first-child {width: 120px;}
.trustpilot > img:nth-child(2) {width: 150px; margin-top: 10px;}
.trustpilot > div {
width:100%;
margin-top: 5px;
text-align: center;
}
.trustpilot_header {
height: 33px;
display:flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
margin: 0 0 0 1em;
width:fit-content;
}
.trustpilot_header > img:first-child {width: 80px;}
.trustpilot_header > img:nth-child(2) {width: 64px;margin-left:5px;}
.trustpilot_header > div {
font-size: 0.8em;
}
/*****************************************************
*** @SP POPUP GLOBAL STYLES
*****************************************************/
/* Common */
.draggable {
cursor: move;
}
/* Desktop */
#sp_popup_parent {
position: fixed;
z-index: 50000;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: center;
height: 100%;
width: 100%;
}
#sp_popup_filter {
position: fixed;
width: 100vw;
height: 100vh;
background-color: rgba(100,100,100,0.5);
z-index: 400;
}
.sp_popup {
z-index:16777271;
text-align: center;
box-shadow: 0 0 10px #000000;
background-color: rgba(255,255,255,1);
border-radius: 3px;
}
/* .sp_single_popup{
left:50vw!important;
top:50vh!important;
transform: translate(-50%,-50%);
}
*/
.sp_popup.small/*, .sp_popup_mobile.small */, .sp_popup_tablet.small {
width: 30%;
/*height: 85%;*/
}
.sp_popup_mobile.small {
width: 80%;
height: 90%;
}
.sp_popup.medium, .sp_popup_mobile.medium, .sp_popup_tablet.medium {
width: 45%;
}
.sp_popup.large, .sp_popup_mobile.large, .sp_popup_tablet.large {
width: 60%;
}
.sp_popup.big {
width: 1100px;
max-height: 100vh;
overflow: auto;
position: relative;
}
.sp_popup .sp_popup_content {
overflow-y: auto;
padding: 10px;
}
.sp_popup.small .sp_popup_content {
max-height: 200px;
}
.sp_popup.medium .sp_popup_content {
max-height: 500px;
}
.sp_popup.big .sp_popup_content {
max-height: 90%;
}
.sp_popup_title {
overflow:hidden;
padding: 10px;
line-height:30px;
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */
-khtml-user-select: none; /* Konqueror HTML */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
}
.sp_popup_title_content {
height: 100%;
font-family: OpenSans, Arial, sans-serif;
font-size: 15px;
padding-left: 0.5em;
}
.sp_popup .sp_popup_close {
font-size: 1.5em;
text-decoration: none;
font-weight: bold;
}
.sp_popup .sp_popup_close:hover {
color:#91b6f2;
}
.sp_popup .sp_popup_title_separator {
margin: auto;
width: 75%;
border: 0;
border-bottom: 1px solid lightgray;
}
.sp_popup_content .home_title {margin: 10px!important;}
/* Mobile */
#sp_popup_filter_mobile, #sp_popup_filter_tablet {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 400;
background-color: rgba(100,100,100,0.5);
}
.sp_popup_mobile, .sp_popup_tablet {
position: fixed;
background-color: white;
z-index: 400;
/* text-align: center; */
}
.sp_popup_mobile.big, .sp_popup_tablet.big {
left: -100%;
width: 100%;
right: 0;
bottom: 0;
top: 0;
max-height: 100%;
}
/*
.sp_popup_mobile .sp_popup_title {
height: 5%;
}
*/
.sp_popup_mobile .sp_popup_content, .sp_popup_tablet .sp_popup_content {
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
max-height: 90%;
height: 90%;
}
.sp_popup_mobile .sp_popup_close, .sp_popup_tablet .sp_popup_close {
display: flex;
align-items: center;
text-decoration: none;
}
.sp_popup_mobile h1,
.sp_popup_mobile h2,
.sp_popup_mobile h3,
.sp_popup_mobile .h1,
.sp_popup_mobile .h2,
.sp_popup_mobile .h3 {
display: block;
padding-left: 10px;
}
.sp_popup_mobile ul {
margin: 0;
padding: 0;
font-size: 1.2em;
}
.sp_popup_mobile li {
list-style: none;
display:flex;
align-items:center;
justify-content:space-between;
margin: 0;
padding: .5em 0 .5em 10px;
border-bottom: 1px solid #f0eeee;
}
.sp_popup_mobile li i {
font-size: 32px;
margin-right:0.5em;
}
.sp_popup_mobile li a,
.sp_popup_mobile li span {
display: inline-block;
width: 90%;
cursor: pointer;
color: #363636;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
}
.sp_popup_mobile li.menu-soldes,
.sp_popup_mobile li.menu-soldes span {
color: #fff; /*--main-color*/
background-color: #c30040; /*--main-color;*/
}
.sp_popup_title {
color: #363636;
font-size: 1.1em;
padding: 10px 0 10px 1em;
width: 100%;
border-bottom: 1px solid #e6e6e6;
min-height: 50px;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
justify-content: space-between;
align-items: baseline;
box-sizing: border-box;
}
.sp_popup_mobile .sp_popup_title { height: 10%; }
.sp_popup_title a {
display: block;
font-family: OpenSans, Arial, sans-serif;
font-size: 1.3em;
font-weight: 400;
color: inherit;
padding: 0 1em 0 0;
text-transform: capitalize;
}
.sp_popup_title a i {
font-size: 1.3em;
display: inline-block;
vertical-align: middle;
}
.sp_popup_title_separator {
display: none;
}
/*****************************************************
*** @SP POPUP : STYLES INDIVIDUELS DES POPUPS
*****************************************************/
/*---- Popup : Contenu de votre précédent panier ----*/
.sp_popup_content h2 {
font-size: 1.5em;
padding-bottom: 0;
margin-bottom: 0;
}
.sp_popup_content #popupVisit li { width: 100%; padding-bottom: 2em; box-shadow: none; border-bottom: 1px solid #c0c0c0; }
.sp_popup_content #popupVisit .price,
.sp_popup_content #popupVisit .ident_product { font-size: 1em!important; min-height: inherit; }
.sp_popup_content #popupVisit img { max-width: 20%; }
.sp_popup_content #popupVisit .product_info,
.sp_popup_content #popupVisit .img-product,
.sp_popup_content #popupVisit h3,
.sp_popup_content #popupVisit .popupVisitPriceSizeButton {
width: 32%;
vertical-align: middle;
}
.sp_popup_content #popupVisit .popupVisitPriceSizeButton:nth-child(4),
.sp_popup_content #popupVisit .popupVisitPriceSizeButton:last-of-type {
display: inline-block;
width: 50%;
}
.sp_popup_content .text-status,
.sp_popup_content .text-status-valide {
line-height: 1.2;
}
.sp_popup_content .text-status-etat,
.sp_popup_content .text-status-date {
font-size: 8px;
}
/*---- Popup : Produit dans le panier ----*/
.popup_panier {
display:flex;
justify-content: space-around;
width:90%;
margin: 0 auto;
padding:20px;
overflow: hidden;
text-align: left;
}
.popup_panier h4 {
margin: 0 0 20px;
font-size: 19px;
}
.popup_panier #infoDescription {
text-align:left;
font: 12px/20px OpenSans, Arial, sans-serif;
color:#707070;
width:50%;
}
.popup_panier #productImage {
max-width: 350px;
align-self: flex-start;
}
.popup_panier .popup_panier_ref {margin-bottom:20px;}
.popup_panier .productDescriptionTitle {
font: bold 14px/16px OpenSans,Arial,sans-serif;
margin-top: 20px;
}
.popup_panier #products_info_refspartoo {
font: 13px OpenSans,Arial,sans-serif;
margin-bottom:20px;
}
.sp_popup_mobile .popup_panier {flex-direction:column; align-items: center; padding: 10px 20px;}
.sp_popup_mobile #productImage {margin-bottom: 20px;}
.sp_popup_mobile #productImage, .sp_popup_mobile #infoDescription {width:100%;}
/*--- PRODUITS COMPLEMENTAIRES ---*/
.sp_popup_content #popupProduitComplementaire {
display: flex;
}
.sp_popup_content #popupProduitComplementaire > div {
width: 50%;
font-size: 16px;
}
.sp_popup_content .ProduitComplementaireSolo, .sp_popup_content #popupProduitComplementaireAllLook {
position: relative;
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.sp_popup_content .ProductComp .vignette_discount_rounded {
right: 30px;
top: 20px;
}
.sp_popup_content .ProductComp .compTotalPrice, .sp_popup_content #popupProduitComplementaireAllLook form .compTotalPrice {
margin: 1em auto;
padding: 1em 0 0 0;
}
.sp_popup_content input, .sp_popup_content textarea, .sp_popup_content select {
font-family: OpenSans, Arial, Helvetica, sans-serif;
vertical-align: middle;
font-size: inherit;
color: #363636;
background-color: #fff;
border: 1px solid #c0c0c0;
border-radius: 3px;
padding: 0.5em;
}
.sp_popup_content .ProduitComplementaireSolo .ProductComp {
border: 1px solid #e6e6e6;
}
.sp_popup_content .ProductComp form, .sp_popup_content #popupProduitComplementaireAllLook form {
width: 100%;
padding: 1em;
position: relative;
}
.sp_popup_content #popupProduitComplementaireAllLook form {
border: 1px solid #e6e6e6;
}
.sp_popup_content #popupProduitComplementaireList {
display: flex;
align-items: center;
}
.sp_popup_content #popupProduitComplementaireList i {
font-size: 3em;
}
.sp_popup_content .popupProduitComplementaireAccroche {
width: 100%;
font-size: 20px;
font-family: 'OpenSansCond';
text-transform: uppercase;
font-weight: bold;
}
.sp_popup_content .fidelity_mdf {
font-size: 1.4em;
margin-bottom: 2em;
}
.sp_popup_content .fidelity_mdf h3 {
font-weight: lighter;
font-size: 2.5em;
background-color: #fff;
margin: 0;
}
.sp_popup_content .fidelity_mdf ul {
display: flex;
justify-content: space-between;
align-items: flex-start;
width: 80%;
font-size: 1rem;
min-height: 100px;
margin: auto;
list-style-type: none;
}
.sp_popup_content .fidelity_mdf > div:first-of-type {
padding: 0 0 1em 0;
font-weight: bold;
background-color: #fff;
}
.sp_popup_content .fidelity_mdf div:first-of-type b {
color: #c30040;
}
.sp_popup_content .fidelity_mdf > div:last-of-type {
margin-top: 0;
margin-bottom: 0.5em;
padding-top: 1em;
text-transform: uppercase;
font: bold 1rem/1rem OpenSansCond, sans-serif;
border-top: 1px solid #e6e6e6;
}
.sp_popup_content .fidelity_mdf li {
max-width: 22%;
margin-left: 0;
}
.sp_popup_content .fidelity_mdf li i {
display: block;
font-size: 2em;
}
.sp_popup_content .fidelity_mdf form {
width: 80%;
margin: 1em auto;
text-align: left;
}
.sp_popup_content .fidelity_mdf form div {
display: flex;
align-items: center;
width: 100%;
margin: 1em 0;
}
.sp_popup_content .fidelity_mdf form label {
margin: 0 0.5em;
font-size: 1.6em;
font-weight: lighter;
}
.sp_popup_content .fidelity_mdf form input + label {
margin: 0 0.5em;
font-size: 1em;
font-weight: normal;
}
.sp_popup_content .fidelity_mdf input[type="text"], .sp_popup_content .fidelity_mdf input[type="tel"], .sp_popup_content .fidelity_mdf input[type="date"] {
height: auto;
padding: 0.5em 1em;
font-size: 1em;
border-radius: 3px;
-webkit-appearance: none;
background-color: #FFF;
border: 1px solid #e6e6e6;
flex: 1;
}
.sp_popup_content .fidelity_mdf input[type="submit"] {
display: flex;
width: 100%;
justify-content: center;
height: auto;
padding: 0.4rem 0.6rem;
background-color: #628f00;
color: #ffffff;
text-decoration: none;
border: none;
border-radius: 2px;
cursor: pointer;
transition: all .3s;
}
@media (max-width: 900px){
.sp_popup_content #popupProduitComplementaire select {
width: 100%;
}
.sp_popup_content #popupProduitComplementaire {
flex-direction: column;
text-align: center;
}
.sp_popup_content #popupProduitComplementaire > div {
width: 100%;
}
.sp_popup_content .ProduitComplementaireSolo .ProductComp {
font-size: 1rem;
box-sizing: border-box;
width: 50%;
text-align: center;
}
.sp_popup_content .vignette_discount_rounded {
align-items: center;
justify-content: center;
}
.sp_popup_content #popupProduitComplementaireAllLook form {
font-size: 1rem;
box-sizing: border-box;
text-align: center;
}
.sp_popup_content .popupProduitComplementaireAccroche {
padding: 1em 0.25em;
}
}
/*
@ESPACE CLIENT >> Déplacé dans account.css
- LOGIN -
- LOGIN POPUP (secureloginoverlay.php) -
- Intro popup login -
- COMPTE -
__ HEADER COMPTE __
__ MENU __
__ MES INFOS __
__ CARNET D'ADRESSES __
__ ALERTES NOUVEAUTES __
__ MES ABONNEMENTS __
__ SUIVRE MES DEMANDES / TICKETVIEW __
__ ENVOI CHEQUE AMI (my_check.php) __
__ MES PARRAINAGES __
__ MES POINTS FIDELITE / SPARTOO&ME __
__ POP UP POINTS FIDELITE (points_info.php) __
__ MES COMMANDES __
__ MES RETOURS __
__ PROFIL __
__ MY HELP BOX : TUTOS __
__ AUTRES __
__ Compte Activation premium __
__ Compte Suppression de moyens de paiement __
__ Compte : Pop Iban Info __
- LOGIN PANIER
*/
/*****************************************************
**** @ESPACE CLIENT
******************************************************/
/*---- LOGIN ----*/
.content_login {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
max-width: 1200px;
margin: auto;
}
.contentDLogin, .contentGLogin, .contentGLogin, html > body .contentGLogin, #inscriptFlou,
#inscriptFlou .contentGLogin, #inscriptFlou .contentDLogin, #inscriptFlou .loginTitle, #inscriptFlou .loginContent, #inscriptFlou .loginBottom, #inscriptFlouNlead, #inscriptFlouNlead1 {
width:49%;
font: 12px OpenSans, Arial, sans-serif;
}
.contentDLogin, .contentGLogin {
display: inline-block;
vertical-align: top;
background: linear-gradient(to left,#fafafa, #fbfbfb);
padding: 0 10px;
min-height: 235px;
}
.contentDLogin .h2overlay, .contentGLogin .h2overlay {
text-align: center;
margin: 20px auto;
padding:15px;
font: bold 30px OpenSansCond;
text-transform: uppercase;
}
#contentLT .contentDLogin {
margin-left: 2%;
}
#overlay_new .contentDLogin img, #overlay_new .contentGLogin img, #overlay_new .secureLoginWithThirdParty img {
margin-bottom: 0;
}
/*--- BUTTON LOGIN ---*/
.content_login .btn-vert, .content_login .btn-noir, .loginContent .btn-vert, .loginContent .btn-noir {
display: flex;
position: relative;
background-color: #f0eeee;
border: none;
border-radius: 3px;
color: #fff;
cursor: pointer;
font-size: 1rem;
margin: auto;
padding: 1em;
width: 80%;
text-align: center;
justify-content: center;
align-items: center;
text-shadow: none;
transition: 0.25s;
}
.content_login .btn-noir, .loginContent .btn-noir {
background-image: linear-gradient(5deg,#212121,#555555);
}
.content_login .btn-vert, .loginContent .btn-vert {
background-image: linear-gradient(5deg,#01b589,#00d29f);
}
.content_login .btn i, .loginContent .btn i {
position: absolute;
right: 15px;
font-size: 1.2em;
}
.contentDLogin button:hover, .contentGLogin button:hover, .loginContent button:hover, .loginContent button:hover {
background-position: 0;
transform: translateY(-2px);
box-shadow: 0px 2px 4px #c0c0c0;
}
.contentDLogin button:focus, .contentGLogin button:focus, .loginContent button:focus, .loginContent button:focus {
background-position: 0;
}
/*--- END BUTTON LOGIN ---*/
#inscriptFlou {
margin: 5px 0 0;
position: absolute;
}
#inscriptFlou .loginOffersInfo {
font-size: 10px;
text-align: center;
color: #c0c0c0;
}
#inscriptFlou .contentGLogin, #inscriptFlou .contentDLogin {
margin: 20px 0 0;
}
#inscriptFlou .loginTitle {
height: 40px;
font-size: 14px;
text-align: center;
background-image: none;
color: #363636;
}
#inscriptFlou .loginContent {background: white url(/images/bg_content_JM.png);}
#inscriptFlou .loginBottom {background-image: none;}
#inscriptFlouNlead, #inscriptFlouNlead1 {
display: flex;
margin: 0 auto;
background-color: #c30040;
}
#inscriptFlouNlead1 {
display: block;
}
#inscriptFlouNlead #inscriptFlouNlead1 .loginTop {height: 4px;}
#inscriptFlouNlead1 > .premium_small {
display: flex;
align-items: center;
background-color: #fff;
padding:10px;
}
#creaCompte {
margin: 10px auto 0;
padding: 0 0 25px 0;
border: 1px solid #363636;
}
#creaCompte form {
width: 330px;
text-align: right;
}
#bt_vert, .bt_vert, .div_bt_vert {
color: #FFF;
background-color: #88af00;
margin: 1rem auto;
padding: 0 1.5rem;
height: 45px;
cursor: pointer;
font-size: 1.4em;
word-wrap: break-word;
text-align: center;
justify-content: center;
align-items: center;
}
#inscriptFlouNlead1Btn {
background-color: #fff;
text-align: center;
padding: 10px;
}
button {
border: none;
border-radius: 3px;
box-sizing: border-box;
-moz-box-sizing: border-box;
font-weight: 400;
line-height: 1;
margin: 0;
}
#creaCompteSuite {width: auto;}
.inputRequirement, .champsRequis {
font-size: 10px;
line-height: 0;
color: #c30040;
}
.contentDLogin .inputGrey:focus, .contentGLogin .inputGrey:focus {
background-color: #f7f6e5;
outline: 0;
font-size: 1.5em;
}
.contentDLogin .inputGrey, .contentGLogin .inputGrey {
width: 80%;
padding: 1rem;
background-color: #efefef;
border: none;
border-radius: 3px;
font-size: 1.2em;
line-height: 1.5rem;
transition: all 0.25s ease-out;
box-sizing: border-box;
}
.contentDLogin textarea.inputGrey, .contentGLogin textarea.inputGrey {
min-height: 60px;
border-radius: 3px;
appearance: none;
background-color: #FFF;
border: 1px solid #333333;
}
.contentDLogin .inputGreyRed, .contentGLogin .inputGreyRed {
width: 190px;
line-height: 28px;
border: 2px solid #cc0000;
background-color: #e6e6e6;
}
.genderForm {
text-align: center;
font-size: 1.2em;
}
/* .genderForm + .toggle {
margin-right: 16%;
} */
/* Toogle Slider input Greg */
.footer_news_checkboxes .toggle {
position: relative;
display: inline-block;
width: 70px;
height: 34px;
margin: 0 0.5em 0 1em;
}
.toggle {
position: relative;
display: inline-block;
width: 70px;
height: 34px;
}
.toggle input {
opacity: 0;
width: 0;
height: 0;
}
.toggle .slider {
display: block;
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
transition: .4s;
}
.toggle .slider:before {
position: absolute;
display: block;
content: "";
width: 15px;
height: 15px;
top: 10px;
left: 10px;
background-color: #fff;
-webkit-transition: .4s;
transition: .4s;
}
.toggle input:focus {
background-color: pink;
}
.footer_news_checkboxes .toggle input:checked + .slider {
background-color: #5956a1;
}
.toggle input:checked + .slider {
background-color: var(--main-color);
}
.toggle input:checked + .slider:before {
-webkit-transform: translateX(35px);
-ms-transform: translateX(35px);
transform: translateX(35px);
}
.toggle input:focus + .slider {
box-shadow: 0 0 1px #2196F3;
}
.toggle .slider.round {
border-radius: 17px;
}
.toggle .slider.round:before {
border-radius: 50%;
}
/*--- FIN toggle Slider ---*/
.trueFieldEntry {
border-bottom: 1px solid #00d29f;
}
.wrongFieldEntry {
border-bottom: 1px solid #ff6255;
}
#login {
margin: 10px auto;
padding: 0 0 25px 0;
border: 1px solid #363636;
}
#login2 {
margin: 0 auto;
width: auto;
}
#login form {
width: 330px;
text-align: right;
}
.loginTitle {
width: 463px;
height: 57px;
font-size: 14px;
line-height: 24px;
text-align: center;
color: #fff;
}
.loginContent {
margin: 20px 0 0;
width: 100%;
}
#loginFormDiv .messageStack {width: auto;}
.passwdForget {
margin: 10px 0 0;
text-align: center;
}
#login2 .line1, #login2 .line2 {
display: flex;
position: relative;
justify-content: center;
align-items: center;
margin: 0 auto 1em auto;
width: 85%;
}
.loginValid {
margin: 0;
text-align: center;
}
/* .loginValid button {margin: 0 5px 0 0;}
*/
.loginBottom {
width: 463px;
height: 10px;
}
.guest_account_button {
border-bottom: 1px dotted #363636;
padding:20px 0;
}
.guest_account_button a {
display: inline-block;
text-indent:5px;
}
#login2 .label, #creaCompte2 .label {
display: none;
}
#creaCompte2 .label {width: 180px;}
#creaCompte2 .line {
display: flex;
flex-wrap: wrap;
position: relative;
justify-content: center;
align-items: center;
margin: 0 auto 1em auto;
width: 95%;
}
.ct_gender {
position: relative;
flex: 1;
display: flex;
justify-content: space-around;
width: 100%;
}
#creaCompteSuite .ct_gender {
width: 80%;
}
#newShippingAdress {
max-width: 550px;
margin: auto;
}
.ct_gender > div {
display: flex;
align-items: center;
}
#newShippingAdress .line,
.line {
position: relative;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
margin: 1.25em 0;
}
.line .label {
flex: 0 0 200px;
width: 200px;
padding: 0 0.5em 0 0;
text-align: left;
}
#newShippingAdress .line .inputGrey,
#affiche .line .inputGrey {
flex: 1;
padding: 1em;
width: 100%;
}
.ct_form_button_bottom {
display: flex;
padding: 1em 0;
}
#newShippingAdress .ct_form_button_bottom {
justify-content: space-between;
}
#newShippingAdress select {
height: auto !important;
}
#creaCompte2 #check_mail {
background-color: #ffebcc;
display: block;
width: 60%;
text-align: center;
padding: 0.5em;
}
#creaCompte2 #check_mail::before {
content: '\25B2';
position: absolute;
top: -20px;
font-size: 2em;
color: #ffebcc;
}
#check_mail button {
width: auto;
transform: translateX(0px);
display: inline-block;
padding: 0.25em;
}
.cadenas_close {
background: url(/images/mobile/oeil_close_input.png) center no-repeat;
background-size: 20px;
width: 20px;
height: 20px;
margin: 0;
top: 18px;
left: 83%;
}
.cadenas {
background: url(/images/mobile/oeil_open_input.png) center no-repeat;
background-size: 20px;
width: 20px;
height: 20px;
margin: 0;
top: 18px;
left: 83%;
}
#creaCompteSuite .line input {vertical-align: inherit;}
#creaCompte2 .line2 {
font-size: 1.2em;
margin: 1em auto;
width: 95%;
text-align: justify;
}
#creaCompte2 .line2 label {
display: block;
margin: auto;
width: 80%;
}
#creaCompte2 .line2 input[type="checkbox"]{
float: left;
width: 20px;
height: 20px;
margin-right: 1em;
}
#creaCompte2 .line2 a {color: #363636;}
#creaCompte2 .facultatif {
float: right;
color: #cc0000;
text-align: left;
padding-left: 30px;
}
#password_strength {
display: none;
width: 100%;
}
#password_strength > i {
display: block;
text-align: center;
}
.password_indications {
margin: 10px auto;
width: 80%;
font: normal 12px/14px OpenSans, Arial, sans-serif;
}
.password_indications ul {
text-align: left;
margin: 10px 0 0;
padding: 0;
}
.password_indications li {margin: 0 0 0 12px;}
.pw-indic {
font-size: 18px;
display: block;
}
.m-pw {
border-top:1px solid #e6e6e6;
border-bottom:1px solid #e6e6e6;
padding: 8px 0;
margin-bottom: 10px;
}
.wrap-pw {
margin: 10px auto;
width: 80%;
text-align: center;
display: block;
border: thin solid lightgrey;
background-color: #fff;
}
#password_strength_indic {
width: 50%;
height: 15px;
background-color: #91bd09;
}
#latin_lastname_indicator, #latin_firstname_indicator {
display: none;
width: 100%;
}
#latin_firstname_indicator > i , #latin_lastname_indicator > i {
display: block;
text-align: center;
}
#newShippingAdress .bluePoint {
position: absolute;
left: 100%;
top:unset;
}
.bluePoint {
position: absolute;
left: 90%;
top: 18px;
}
.shortInput {
margin: 0 5px 2px 0;
width: 100px;
height: 20px;
border: 1px solid #363636;
}
.shortSelect {
height: 14px;
font-size: 10px;
line-height: 14px;
border: 1px solid #c0c0c0;
vertical-align: baseline;
width: 60px;
}
.shortSelectCompte, .mediumSelectCompte {
width: 20%;
height: 2.5em;
margin: 0 1em;
font-size: 1.2em;
border: 1px solid #c0c0c0;
background-color: #e6e6e6;
}
.label_dob {
display: flex;
font-size: 1.2em;
width: 37%;
padding-right: 5%;
justify-content: flex-end;
}
#customer_date_birth {
display: block;
width: 100%;
height: auto;
}
#customer_date_birth p {
margin-right: 10px;
display: inline-block;
vertical-align: middle;
}
#text_klarna_cgv p {
margin-bottom: 35px;
display: block;
}
.ligne_birth {
display: inline-block;
vertical-align: middle;
}
.messageStack {
margin: 25px auto 0 auto;
color: #cc0000;
width: 445px;
background-color: #f0eeee;
border: 1px solid #cc0000;
}
.messageStackTitle {
padding: 5px;
font-weight: bold;
background-color: #c0c0c0;
}
.messageStackContent {margin: 5px;}
.facebookAlert {
margin: auto;
padding: 4px 0;
width: 690px;
min-height: 60px;
color: #fff;
background: url(/images/facebook_login_bg.gif) no-repeat center top;
border: 1px solid #333399;
}
.facebookInfos {
margin: auto;
width: 500px;
font-size: 14px;
text-align: center;
}
#reassur {text-align: center;}
.loginOffersInfo, .loginOffersInfo a {
margin: 10px auto;
width: 85%;
/* text-align: center; */
font-size: 10px;
color: #c0c0c0;
}
#charte {
height:0;
overflow: hidden;
margin:0px auto;
width:90%;
color:#707070;
font-size:10px;
text-align:justify;
transition: all 0.5s;
}
.loginCharteLink:hover > #charte {
height: 200px;
overflow: auto;
}
.secureLoginWithThirdParty {
width: 100%;
text-align: center;
margin: 1em auto;
background-color: #fafafa;
}
/*---- LOGIN POPUP (secureloginoverlay.php) ----*/
/* contient aussi des règles pour popup wishlist */
#box, #box2, #box-push {
position: fixed;
top: -600px;
left: 30%;
right: 30%;
background-color: #fff;
color: #707070;
padding: 20px;
min-width: 470px;
border: 1px solid #c0c0c0;
z-index: 500;
}
#box2 {
min-width: 340px;
text-align: center;
}
#box2 span {
margin: 10px;
padding: 0;
font: 200 18px/25px OpenSans, Arial, sans-serif;
text-transform: uppercase;
text-align: center;
background-color: inherit !important;
color: #c30040;
}
#box2 .h2overlay {
font: italic normal 21px Georgia, Utopia, Charter, serif;
color: #363636;
}
#boxClose, #boxClose2, #boxClose-push {
float: right;
width: 26px;
height: 26px;
background: transparent url(/images/btn_close.png) no-repeat top left;
margin-top: -28px;
margin-right: -35px;
cursor: pointer;
}
.registration_error {
font-size: 0.9em;
width: 100%;
text-align: right;
font-style: italic;
color: crimson;
}
/** Mon RIB **/
#iban_save_form {
width: 50%;
margin-bottom: 2rem;
}
#iban_save_form input {
width: 100%;
height: 40px;
}
#iban_save_form select {
width: 100%;
height: 40px;
}
#iban_format_5 {
display: grid !important;
grid-template-columns: repeat(7,1fr);
column-gap: 0.2em ;
}
#iban_format_5 input {
width: 100% !important;
}
#iban_save_form .ct_form_button_bottom {
justify-content: space-between;
}
/*__ Intro login popup __*/
.login_popup_intro {
flex: 1;
text-align: center;
}
.vp_intro > div:first-child {
display: flex;
flex-direction: column;
align-items: center;
}
.vp_intro > div:last-child p {
font-size: 1.1em;
padding: 20px 10%;
margin:0;
color: #fff;
text-transform: uppercase;
}
#logPaslog {
display: flex;
flex-direction: column;
width:65%;
}
#logPaslog > .contentDLogin, #logPaslog > .contentGLogin {
display: flex;
flex-direction: column;
width: 100%;
background-color: #fff;
}
#logPaslog .secureLoginWithThirdParty {
margin: 0 auto;
}
.secureLoginforVP, .secureLoginforVPRS {
padding:10px;
}
.sban_confidence_titleVP {
margin-top:30%;
color: #fff;
text-transform: uppercase;
letter-spacing: 1.5px;
}
.sban_confidence_titleVP1 {
color: #fff;
text-transform: uppercase;
letter-spacing: 1.5px;
padding-top:10px;
}
.sban_confidence_titleVP > div, .sban_confidence_titleVP1 > div{
font: 60px/40px OpenSansCond, sans-serif;
padding: 1rem;
}
.sban_confidence_titleVP span, .sban_confidence_titleVP1 span{
font:18px OpenSansCond, sans-serif;
color: #363636;
}
#inscriptFlouNlead1txt {
font-size: 1.1em;
padding: 20px 10%;
margin:0;
text-align: center;
color: #fff;
text-transform: uppercase;
}
.vp_intro > div:last-child .btn_nt {font-size:.9em;}
.vp_intro > div:last-child .btn_nt span {text-decoration: underline;}
.vp_intro > div:last-child .btn_nt i {vertical-align: -2px;}
/*---- COMPTE ----*/
.sp_mobile { display:none; }
/*__ HEADER COMPTE __*/
#contentTopCompte {
margin: auto;
padding: 0;
}
#contentTopCompte h1 {
font-size: 24px;
border-bottom: 1px solid #c0c0c0;
text-align: left;
margin: 0;
}
#contentCompte {
display: flex;
overflow: hidden;
}
.contentG_compte {
display: flex;
flex-basis: 340px;
flex-shrink: 0;
z-index:2;
margin: 0;
padding: 0;
text-align: left;
transition: all 0.5s;
box-shadow: 2px 2px 10px rgba(0,0,0,0.25);
}
/* BURGER MENU */
.menu-icon{
position: relative;
width: 54px;
height: 54px;
cursor: pointer;
transition: transform 0.5s;
}
.menu-icon span {
position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
display: block;
width: 22px;
height: 2px;
background-color: #000;
transition: background 0.5s;
}
.menu-icon span::before, .menu-icon span::after {
content: '';
position: absolute;
top: 0;
left: 0;
transform: translateY(-6px);
display: block;
width: 22px;
height: 2px;
background-color: #000;
transition: transform 0.5s;
}
.menu-icon span::after {
transform: translateY(6px);
}
.menu-icon.is-opened span { background: transparent; }
.menu-icon.is-opened span::before { transform: translateY(0) rotate(45deg); }
.menu-icon.is-opened span::after { transform: translateY(0) rotate(-45deg); }
.menu-icon.is-opened { transform: rotate(180deg); }
/* END BURGER MENU */
.contentD_compte {
box-sizing: border-box;
margin: 50px 0 0 50px;
text-align: left;
position:relative;
flex: 1;
overflow-y: auto;
overflow-x: inherit;
}
.contentD_compte h2, .contentD_compte .h2overlay {
font: bold normal 21px/21px OpenSansCond, sans-serif;
color: #363636;
}
.contentD_compte h3 {
font: lighter normal 16px/16px OpenSans, sans-serif;
padding-left: 0;
margin: 10px 0;
}
.deconnect {
margin: 5px 0 0;
padding: 5px;
float: right;
text-decoration: underline;
}
/*__ MENU __*/
.contentG_area {
float: left;
height: 30px;
background-color: #c30040;
font: 200 20px OpenSans, Arial, sans-serif;
color: #fff;
margin-right: 5px;
padding: 5px 10px 0;
}
.plus, .minus {
padding: 1em;
cursor: pointer;
font-size: 16px;
font-weight: bold;
}
.menuCursor {
width: 5px;
height: 54px;
background-color: var(--main-color);
transition: all 0.25s;
}
.menuCompte img.normal, .menuCompte .flags div.normal, .flags .menuCompte div.normal {
margin-left: 0;
margin-top: 0;
width: 25px;
height: 25px;
cursor: default;
vertical-align: middle;
}
.menuCompte {
margin: 0;
padding: 0;
}
.menuCompte {
background-color: #fff;
flex: 1;
}
.menuCompte ul {
text-align: left;
list-style-type: none;
}
.menuCompte li {
margin: 0;
list-style-type: none;
list-style-image: none;
}
.menuCompte > li {
border-bottom: 1px solid #f0eeee;
}
.smenuCompte, li.menuCompteBas {
list-style-type: none;
list-style-image: none;
}
.smenuCompte > li > div {line-height: 14px;}
li.menuCompteBas {width: 300px;}
.smenuCompte2, .smenuCompte2 li {display: none;}
.smenuCompte li {
padding: 1em;
list-style-type: none;
list-style-image: none;
}
.smenuCompte a{
display: block;
}
.smenuCompte a, .smenuCompte a.petit, .smenuCompte a:hover,
/* .smenuCompte a.red, .smenuCompte a.prodcard_onglet, .smenuCompte a.blanc {color: #c30040;}
*/
.smenuCompte a:hover {color: #707070;font-size: 12px;}
.menuCompte ul {margin: -2px 0 0 0;}
.coupon_separator {
display: block;
width: 95%;
background-color: #fff;
margin: 15px auto;
padding: 5px;
}
.content-coupon {
display: block;
width: 100%;
padding: 1em;
border: 1px solid #c0c0c0;
}
.content-coupon h1 {
margin: auto;
padding: 0;
text-align: center;
}
.content-coupon span {
display: block;
padding: 5px 0 0;
}
.valeur-coupon {font-size: 15px;}
.valeur-coupon b {color: #c30040;}
.button-coupon {
display: block;
width: 100%;
margin-top: 20px;
}
#content .button-coupon button {
width: 35%;
text-transform: uppercase;
margin:5px;
}
#content .button-coupon button span {
width: 8%;
padding: 0;
display: inline-block;
vertical-align: middle;
}
#content .button-coupon button p {
display: inline-block;
width: 90%;
text-align: center;
vertical-align: middle;
}
/*__ Ma SELECTION __*/
.mySelection {
position: relative;
margin:20px auto;
}
.mySelection img {max-width: 100%;}
.mySelection_content {
justify-content: flex-start;
max-width: 45%;
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
pointer-events: none;
}
.mySelection_text {
margin: 50px;
background-color: #fff;
padding: 30px 40px;
transition: all 0.5s;
}
.mySelection_text .title {
color: #d55e7c;
font: 200 2.5em/1.1em OpenSansCond, Arial, sans-serif;
margin-bottom:10px;
}
.mySelection .home_op_text_buttons {
color: #363636;
display: inline-block;
border-bottom: 2px solid #363636;
font: bold 18px OpenSansCond, Arial, sans-serif;
}
.goldCard_compte {
display: none;
position: relative;
margin:20px auto;
}
.goldCard_content_compte {
position: absolute;
background-color: #fff;
padding:15px;
top: 30px;
left: 20px;
width:450px;
}
.goldCard_conditions {
margin-top: 5px;
font-size: 8px;
}
.goldCard_chapo {
font: 15px/19px OpenSansLight, sans-serif;
width: 460px;
margin: 10px 0 10px 0;
}
.goldCard_title {
font: bold 24px/28px OpenSansCond, sans-serif;
text-transform: uppercase;
width: 460px;
color:#c30040;
}
.goldCard_content_compte a {
display: inline-block;
}
/*__ MES INFOS __*/
.compte_codeBarres {margin-bottom: 20px;}
.compte_codeBarres p {float: left; width: 210px;}
.compte_codeBarres img {
display: block;
float: left;
padding: 7px;
border: 1px solid #e6e6e6;
}
.text_question_1 {
margin: 15px -26px 5px 0;
padding: 3px;
font-variant: small-caps;
letter-spacing: 1px;
font-weight: bold;
font-size: 12px;
background-color: #c30040;
color: #fff;
}
.ask {
margin-left: 3px;
padding: 5px 5px 5px 22px;
}
/* .contentD_compte .label {
float: left;
width: 210px;
} */
/* .contentD_compte .line {
margin: 10px auto 10px auto;
width: auto;
} */
.compte_bg {
margin-left: -30px;
float: left;
}
.myInfosBg, .passwdBg {position: relative; max-width: 550px;}
/*__ CARNET D'ADRESSES __*/
.account_bt_adresse {margin: 10px 30px 0 0;}
.account_bt_adresse a {
color: #fff;
text-decoration: none;
}
.adresseBloc {
position: relative;
margin-bottom: 10px;
padding: 15px;
border: 1px solid #c0c0c0;
border-radius: 4px;
display: flex;
flex-wrap: wrap;
align-items: stretch;
font-size: 14px;
}
.adresseBlocList .adresseBloc {
width: 30%;
}
.adresseBloc div {
width: 100%;
margin: 0 auto 5px auto;
}
.adresseBloc div:last-child {
display:flex;
align-items: flex-end;
justify-content: space-between;
}
.adresseBlocList {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
/*__ ALERTES NOUVEAUTES __*/
#contentTopMarquesNouveautes {
position: relative;
margin: 0;
padding: 0 0 0 30px;
}
#titreAlerteNouveautes {
font-weight: bold;
text-transform: uppercase;
font-size: 14px;
}
.brand-section {width: 175px;}
#selectType {
margin: 20px 0 0;
padding: 10px 0 0;
height: 40px;
border-bottom:#c30040 1px solid;
border-top:#c30040 1px solid;
}
.selectTypeTitle {
width: 238px;
text-align: center;
float:left;
font-size:14px;
}
#regForm {
line-height: 18px;
padding: 10px;
margin: 20px 0 0;
background-color: #f0eeee;
}
#regForm input.valider {margin-top: 10px;}
.alerteNewsBrandsValider {
margin: 10px 15px 20px 295px;
padding: 5px 15px 10px 5px;
clear: both;
text-align: center;
width: 700px;
}
#globalmarques {
margin: 20px 0 0;
padding: 0 10px;
}
#retour_compte_alerte_nouveaute {
margin: -34px 0 0 0;
float: right;
}
/*__ MES ABONNEMENTS __*/
/* PAGE NEWSLETTER (newsletter_management.php) */
/* Alert update abonnement newsletter
*/
.h1-management {
width: 100%;
}
.content_flex {
display: flex;
flex-wrap: wrap;
}
.content-alerte {
display: flex;
position: relative;
justify-content: flex-start;
align-items: center;
width: 100%;
}
#update_ok, #update_ko {
position: absolute;
display: flex;
justify-content: center;
align-items: center;
width: auto;
margin: auto;
padding: 0.5rem 1rem;
white-space: nowrap;
top: -80px;
opacity: 0;
border-radius: 0.5rem;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
background-color: #fff;
pointer-events: none;
}
#update_ok > i {
color: green;
font-size: 1.2rem;
}
#update_ko > i {
color: red;
font-size: 1.2rem;
}
.my_action { animation: 3s linear arrive_part; }
@keyframes arrive_part {
0% {
top: -80px;
opacity: 0;
}
10% {
opacity: 1;
top: -35px;
}
90% {
opacity: 1;
top: -35px;
}
100% {
top: -80px;
opacity: 0;
}
}
/** FIN update abonnement newsletter **/
.h2-abonnement {
font-size: 1.6rem;
font-weight: bold;
}
#form_desabo button {
height: 50px;
min-width: 200px;
}
#management, .desabo {
font-size: 1.4em;
}
/* #form_desabo {
width: 50%;
}
*/.abonnement > em {
font-style: italic;
margin: 1em 0;
display: block;
font-size: 1.2em;
}
#management .text-newsletterType > em {
font-style: italic;
font-size:1.2em;
}
#management .content_newsletterType,
.desabo .content_newsletterType {
display: flex;
padding: 0 0 2rem 0;
}
#management .content_newsletterType .checkBoxLorenzo,
.desabo .content_newsletterType .checkBoxLorenzo {
bottom: 12px;
padding-right: 1em;
}
#management .content_newsletterType .text-newsletterType,
.desabo .content_newsletterType .text-newsletterType {
flex:1;
padding-left: 1.2rem;
}
.text-newsletterType > strong {
font-size: 1.2rem;
}
/* Fin nouvelle version page abonnement newsletters */
/* #management {
margin: 10px 0;
padding: 0;
min-height: 50px;
}
.bg_centre2 {
height: 22px;
line-height: 20px;
min-width: 180px;
color: #363636;
text-align: center;
font-style: normal;
padding-right: 20px;
}
#form_desabo {
margin: 20px auto;
padding: 0;
}
.button_valid_news, .frequence {
margin: 5px 0 0 82px;
padding: 0;
}
.desabo > input[type^=submit] {margin: 15px 0 0;}
#div_cause2 {
margin: 5px 0 0 66px;
padding: 0;
}
#content .reasons, #content .abonnement, #content .desabo {
margin: 10px !important;
padding: 0 !important;
width: 100% !important;
height: 100% !important;
}
#content .reasons > h2, #content .abonnement > h2, #content .desabo > h2 {
font-size: 18px;
color: #363636;
margin-bottom: 20px;
}
#content .reasons > h2 > b, #content .abonnement > h2 > b, #content .desabo > h2 > b {
font-size: 50px;
font-family: Georgia, Utopia, Charter, serif;
color: #c30040;
}
#content .abonnement > h2, #content .desabo > h2 {color: #c30040;}
.reasons ul {margin: 10px 0 60px 20px;}
.reasons li {
margin: 10px 0.5%;
padding: 0;
display: inline;
width: 24%;
float: left;
font: 14px Georgia, Utopia, Charter, serif;
text-align: center;
list-style: none;
cursor: pointer;
}
.reasons li img {width:100%; margin-bottom:10px;}
@media only screen and (max-width:640px) {.reasons li {width:50%;}}
.reasons a {
color: #c30040;
width: 210px;
height: 149px;
}
.reasons a strong {
font-size: 18px;
font-weight: bold;
}
.reasons a:hover {color: #000;}
.abonnement > input[type^=submit] {margin: 20px 0 0 85px;}
.abonnement p {
margin: 30px 0 30px;
text-align: justify;
}
.abonnement ul {
margin: 20px 0 0 0;
width: 100%;
text-align: left;
}
.abonnement li {
margin: 5px 0.5%;
display: block;
max-width: 100%;
text-align: left;
line-height: 20px;
list-style: none;
padding:5px;
float:left;
width:49%;
border: 1px solid #f0eeee;
}
.abonnement li img, .abonnement li .flags div, .flags .abonnement li div {
margin: 5px 5px;
padding: 0;
}
.abonnement li input {
margin: -8px 0 0 0;
padding: 0;
}
.abonnement li strong {
margin: 0 0 0 5px;
max-width: 100%;
font: 1.6em Georgia, Utopia, Charter, serif;
text-transform: uppercase;
color: #363636;
}
.abonnement li em {
margin: 0 0 0 5px;
max-width: 100%;
font-family: Georgia, Utopia, Charter, serif;
font-style: normal;
font-size: 1.6em;
color: #c30040;
}
.ctr {text-align: center !important;}
#desabo_ label {
margin: 0 0 0 5px;
padding: 0;
font-size: 1.2em;
}
#desabo_ {padding: 0;}
.desabo em {
max-width: 100%;
font-style: normal;
color: #c30040;
}
.reasons h2, .abonnement h2, .desabo h2 {
padding: 0;
font-size: 20px;
text-transform: uppercase;
line-height: 85px;
color: #363636;
height: 54px;
}
.reasons hr, .abonnement hr, .desabo hr {
margin: 0 0 0 20px;
border-top: 1px solid #363636;
border-left: none;
border-right: none;
border-bottom: none;
background-color: transparent;
} */
.not-found {
margin: 10px 0;
position: absolute;
}
/*__ SUIVRE MES DEMANDES / TICKETVIEW __*/
.ticketView {
margin: 30px auto 30px auto;
padding: 0 0 20px 0;
text-align: center;
}
.ticketView .btn-noir {
height: 45px;
margin-left: 1em;
}
.ticket_bt_back {margin: 5px 0 15px 30px;}
.ticketView .inputGrey {
width: 400px;
line-height: 40px;
padding: 2px 5px;
border: 1px solid #363636;
background-color: #fff;
border-radius: 3px;
}
div .ticket_bt_back button {cursor: pointer;}
#content .ticketView h2 button {
line-height: 46px;
font-size: 18px;
}
#content .ticketView h2 {
margin: 50px auto 30px auto;
padding:0;
font: 200 24px/30px OpenSans, Arial, sans-serif;
background: none;
text-align: center;
}
#content, .content_ticketView {width: 100%;}
#contentTopCompte ~ #content {
display: flex;
}
#content .ticket_view_table, .content_ticketView .ticket_view_table {
width: 100%;
border-collapse: collapse;
}
#content .ticket_view_table th, #content .ticket_view_table td, .content_ticketView .ticket_view_table th, .content_ticketView .ticket_view_table td {
border: 1px solid #fff;
text-align: center;
padding-left: 10px;
padding-right: 10px;
height: 0;
}
#content .ticket_view_table th, .content_ticketView .ticket_view_table th {
background-color: black;
color: #fff;
}
#content .header_ticket-selected, .content_ticketView .header_ticket-selected {
background-color: #c30040;
padding: 5px 15px;
line-height: 0;
}
#content .header_ticket-selected h2, .content_ticketView .header_ticket-selected h2 {
font: normal normal 1em OpenSans, Arial, sans-serif;
color: #fff;
margin: 0;
padding: 0;
}
#content .header_ticket-selected_date, .content_ticketView .header_ticket-selected_date {
margin: 0;
padding: 0 0 0 10px;
text-align: right;
line-height: 2;
}
#content .header_ticket-selected_date span, .content_ticketView .header_ticket-selected_date span {
font-size: 1em;
color: #c30040;
}
.content_ticketView > .container {
padding: 20px 10px;
border-bottom: 1px solid #e6e6e6;
cursor: pointer;
}
.content_ticketView > .container:hover {
background-color: #f0eeee;
}
.content_ticketView > .container > div {
display: inline-block;
vertical-align: middle;
}
.content_ticketView > .container > div:first-of-type, .content_ticketView > .container > div:nth-of-type(3) {
width: 25%;
font: 200 24px/30px OpenSans, Arial, sans-serif;
}
.content_ticketView > .container > div:nth-of-type(2) {
width: 50%;
font: 200 14px/18px OpenSans, Arial, sans-serif;
}
.content_ticketView > .container > #affiche, .content_ticketView > .container > #affiche > iframe > body{
background-color: #f0eeee;
font: 200 14px/18px OpenSans, Arial, sans-serif;
}
.content_ticketView #ticket_no_login {
display: none
}
#affiche .ticket_view_details_table td {height: 0;}
.form-ticketview textarea{
width:100%;
max-width:100%;
max-height:100%;
}
.form-ticketview p {
padding: 1em 0;
text-align: center;
}
.form-ticketview h3 {
padding-left: 0 !important;
}
.form-ticketview {
padding-left: 15px;
}
.ticket_view_columns {
width: 33%;
padding: 10px 5px;
}
.ticket_view_columns-selected {
width: 15%;
padding: 20px 5px;
}
.ticket_view_columns-red {background-color: #c30040;}
#content .ticket_view_columns-red a {color: #fff;}
.ticket_view_columns_lineGrey {background-color: #c0c0c0;}
.ticket_view_columns_lineRed {background-color: #c30040;}
#content .content_ticketView .ticket_bt_back {margin: 5px 0 15px 0;}
/*Confirmation de demande envoyée*/
#global > div {
display: inline-block;
vertical-align: top;
font-size: 14px;
}
#global #content {
width: 70%;
font-size: 22px;
line-height: 36px;
}
#global #content > i {
float: left;
font-size: 36px;
color: #C30040;
}
#global #demandeContact {
width: 30%;
text-align: center;
padding: 10px;
border: 1px solid #707070;
}
#global #demandeContact > div:first-of-type {
font-weight: bold;
}
#global #demandeContact > span {
display: block;
font-size: 18px;
color: #C30040;
}
/*__ ENVOI CHEQUE AMI (my_check.php) __*/
#my_check {
width: 50%;
margin: auto;
}
#my_check input[type="email"],
#my_check input[type="text"],
#my_check textarea {
display: block;
width: 90%;
margin: 1em auto;
padding: 1em;
text-align: center;
border: 1px solid #c0c0c0;
}
#my_check .my_check_readonly { display: none; }
#my_check label {
display: block;
width: 100%;
text-align: center;
}
.my_check_text {
text-align: center;
}
.my_check_text * {
display: block;
margin: 1em auto;
}
/* __ Compte Activation premium __ */
.contentD_compte #form_activation_premium {
display: block;
width: 100%;
padding: 0;
margin: auto;
}
.contentD_compte #form_activation_premium .inputGrey { padding: 4px 1em; height: auto; }
/* __ Compte Suppression de moyens de paiement __ */
#compte_sup_cb h2, #checkout_confirmation h2 {
margin-top: 0;
}
#compte_sup_cb, #checkout_confirmation {
padding-bottom: 1em;
}
#compte_sup_cb > div {
padding: 1em 0;
border-bottom: 1px solid #c0c0c0;
}
#compte_sup_cb > div > button {
margin: 1em 0;
display: block;
}
#checkout_confirmation #newcb {
width: 100%;
}
#checkout_confirmation #newcb .card_details {
padding: 2em 0;
}
#checkout_confirmation #newcb .card_details > span {
display: inline-block;
width: 100%;
padding: 0 0 1em 0;
}
#checkout_confirmation #newcb .cb_wrapper {
display: flex;
align-items: center;
}
#checkout_confirmation #newcb .cb_wrapper img {
height: 45px;
margin-left:20px;
}
#checkout_confirmation input[type="text"],
#checkout_confirmation input[type="tel"] {
height: 25px;
padding: 0 1em;
font-size: 1em;
border-radius: 3px;
appearance: none;
background-color: #FFF;
border: 1px solid #333333;
}
#checkout_confirmation .cvxInput {
width: 100%;
text-align: center;
}
#checkout_confirmation #newcb .date-valid-cb > div {
display: inline-block;
vertical-align: top;
}
#checkout_confirmation #newcb .date-valid-cb > div:first-child {
width: 45%;
text-align: left;
}
#checkout_confirmation #newcb .date-valid-cb > span {
display: inline-block;
width: 100%;
padding: 0 0 1em 0;
}
#checkout_confirmation #newcb .date-valid-cb > div > span {
display: inline-block;
width: 100%;
padding: 0 0 1em 0;
}
#checkout_confirmation #newcb .date-valid-cb > div > span select {
width: 40%;
height: 25px;
}
#checkout_confirmation #newcb .date-valid-cb > div > span select:first-child {
margin-right: 1em;
}
#checkout_confirmation #newcb .date-valid-cb {
padding-bottom: 1em;
}
#checkout_confirmation #newcb .date-valid-cb > div:last-child {
width: 25%;
}
#checkout-content .form-cb #order_total_confirm { color: #c30040; }
.popup_alert_mobile h3 {
text-align: center;
font-family: OpenSans, Arial, sans-serif;
font-size: 20px;
}
#checkout_confirmation .blueCardNumber, #checkout_confirmation .checkout_cb_infos input, #checkout_confirmation .checkout_cb_infos_date_cvx input {
width: 100%;
height: 40px;
text-align: center;
}
#checkout_confirmation .checkout_cb_infos_date_cvx input.cvxInput {
width: 100%;
margin: 0;
}
.checkout_cb_infos, .checkout_cb_infos_date_cvx {
display: flex;
flex-wrap: wrap;
text-align: left;
width: 50%;
margin: 1em 0;
justify-content: space-between;
}
.checkout_cb_infos > div {
display: flex;
flex-wrap: wrap;
text-align: left;
width: 100%;
align-items: center;
justify-content: space-between;
}
.checkout_cb_infos_date_cvx > div {
display: flex;
flex-wrap: wrap;
text-align: left;
width: 20%;
align-items: center;
}
.checkout_cb_infos_date_cvx > div:first-of-type {
width: 75%;
}
.cb_dynamic_logo {
height: 45px;
}
.checkout_cb_infos_label {
min-width: 100%;
}
/*__ Compte : Pop Iban Info __*/
.iban_tips {
padding:15px;
}
.iban_tips_title {
background-color: #c30040;
color:#fff;
padding:5px;
font-size:1.2em;
margin-bottom: 15px;
}
.content_iban {
width:60%;
margin:40px auto;
text-align:center;
}
/*__ MES PARRAINAGES __*/
#parrainage_compte .conditions {
font-style: italic;
font-size:9px;
}
#parrainage_compte h2 {
margin-top:0;
text-transform: uppercase;
border-bottom: 1px solid #f0eeee;
margin-bottom:15px;
}
.parrainage_howTo {
padding:15px 15px;
box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
margin-bottom:15px;
}
.parrainage_howTo a {
color:#c30040;
font-weight: bold;
}
.coupon_ok {
background-color: rgba(181,238,182,0.5);
padding:10px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
border:1px solid rgba(181,238,182,1);
display:block;
margin-bottom: 15px;
}
.tabParrain {
width: 100%;
border: 1px solid #fff;
}
.tabParrain_head td {
font-weight: bold;
text-align: center;
border: 1px solid #fff;
background-color:#c30040;
color:#fff;
}
.tabParrain_line:nth-child(even) td {background-color: #fff;}
.tabParrain_line:nth-child(odd) td {background-color: #f0eeee;}
.tabParrain_line td {
text-align: center;
border: 1px solid #fff;
}
.tabParrain_line td a {
font-size:10px;
}
/* PAGE+POPUP PARRAINAGE */
#affiche {
margin-bottom: 10px;
padding: 0;
}
.txtParrain {
height: 30px;
padding: 0;
margin: 0;
}
.boxParrain {
position: absolute;
right: 0;
}
/* .line {
position: relative;
margin: 0 0 10px;
} */
.lineTitle {
font-weight: bold;
margin: 5px 0;
padding: 5px 0 0;
border-top: 1px solid #c0c0c0;
}
#titleParrain {
width: 955px;
margin: 20px auto 10px auto;
border-bottom: 2px solid #c0c0c0;
font-size: 16px;
color: #c30040;
padding: 0 0 5px;
}
.formParrain input {
border: 1px solid #c0c0c0;
background-color: #f0eeee;
}
.formParrain button {float: right;}
#contentTopParrainge {text-align: center;}
#contentLT > div {margin-top: 20px;}
#mail-share .group-share button {
border-radius: 150px;
box-shadow:none;
background-color:#c30040;
color:#fff;
font-size:30px;
height:60px;
width:60px;
border:none;
}
#content-parrainage,
#content-parrainage div,
#content-parrainage span {
position: relative;
}
#content-parrainage img { max-width: 100%; }
#content-parrainage h2,
#content-parrainage h2 {
font-weight:200;
font-family: OpenSans, Arial, sans-serif;
font-style: normal;
font-size: 1.8em;
text-transform: uppercase;
text-decoration: underline;
}
#content-parrainage h3 {
font-family: OpenSans, Arial, sans-serif;
font-style: normal;
font-size: 1.3em;
text-transform: uppercase;
}
#content-parrainage h4 {
font-family: OpenSans, Arial, sans-serif;
font-style: normal;
font-size: 1.3em;
}
#content-parrainage .messageStack {
width: 100%;
padding: 1em 0 1em 0.5em;
margin: 0;
}
#content-parrainage #message_envoi_ok {
display: none;
position: absolute;
z-index: 3;
text-align: center;
width: 100%;
height: 100%;
padding-top: 10em;
background-color: #ffffff;
}
#content-parrainage button { padding: 0.5em 1em; margin-bottom:10px;}
#content-parrainage .milieu > p { font-size: 1.65em; }
#content-parrainage .milieu > p > span {
display: block;
font-weight: bold;
font-family: OpenSans, Arial, sans-serif;
}
#content-parrainage .milieu > i {
display: block;
margin-bottom: 2.5em;
font-style: italic;
font-family: OpenSans, Arial, sans-serif;
}
#content-parrainage .p-gauche {
width: 56%;
float:left;
}
#content-parrainage .p-droite {
height: 100%;
width: 44%;
background-color: #ffffff;
float:left;
}
#content-parrainage .p-droite .milieu { height: 88%; padding-left: 50px; }
#content-parrainage .p-droite .bas { height: 12%; padding-left: 50px; }
#bloc-email, #bloc-login { display: none; z-index: 2; }
#content-parrainage #bloc-email .haut {
height: 8%;
font-size: 1.5em;
padding-left: 25px;
text-transform: capitalize;
}
#content-parrainage #bloc-email .haut * { display: inline-block; cursor: pointer; vertical-align: middle; padding: 0; margin: 0; }
#content-parrainage #bloc-email .icon-flecheGauche { font-size: 1.4em; margin-top: -0.1em; }
#content-parrainage #bloc-email .milieu { height: 80%; overflow: auto; }
#content-parrainage #bloc-email .milieu label { display: block; }
#content-parrainage #bloc-email .bas { height: 12%; }
#content-parrainage .group-share:first-child {
border-top: 1px dotted #cccccc;
}
#content-parrainage .group-share:first-of-type button {
display: none;
}
#content-parrainage .group-share {
border-bottom: 1px dotted #cccccc;
padding: 1em 0;
margin-bottom: 1em;
}
#content-parrainage .group-share > div {
display: inline-block;
vertical-align: middle;
width: 70%;
}
#content-parrainage .group-share > div:last-of-type { width: 30%; }
#content-parrainage input {
margin: 0 0 1em;
font-size: 1.3em;
min-height: 30px;
}
#content-parrainage #bloc-email .milieu > span {
padding: 1em 0;
font-size: 1.3em;
cursor: pointer;
display:block;
}
#content-parrainage .group-share > button {
font-size: 1.3em;
}
#content-parrainage .error_msg {
font-size: 0.9em;
color: #F00;
text-align: center;
}
/* MÃ J Parrainage 201806 */
.headerParrainage, .conditionsParrainage, .explicationParrainage {width:100%; clear:both;display:block;}
.headerParrainage div {
width:49%;
display:inline-block;
margin: 20px 0;
text-align:center;
}
.headerParrainage p {
width:50%;
text-align:center;
padding:15px;
border-radius:10px;
border: 1px dotted #c30040;
display: inline-block;
}
.headerParrainage p span {
font: bold 1.4em OpenSans, Arial, sans-serif;
text-transform: uppercase;
display: inline-block;
width: 100%;
color:#c30040;
}
.headerParrainage h1, #parrainage_compte .headerParrainage h2 {margin-bottom:10px;}
.headerParrainage h2, #parrainage_compte .headerParrainage h3 {
text-align:center;
text-decoration: none !important;
}
#content-parrainage .milieu h3 {
margin:10px 0;
padding-bottom:10px;
font: bold 1.4em OpenSans, Arial, sans-serif;
border-bottom: 1px dotted #cccccc;
text-align:center;
}
#content-parrainage .group-share input {
width:40%;
margin-right:2%;
display:inline-block;
}
.group-share button {width:10%;display:inline-block;}
/* Parrainage compte */
#parrainage_compte .headerParrainage img {width:100%;margin-bottom:10px;}
#parrainage_compte h2 {text-align:center;}
#parrainage_compte .headerParrainage p {
width:90%;
text-align:center;
}
#parrainage_compte .headerParrainage button {
margin:auto;
display:block;
}
#parrainage_compte .headerParrainage{
padding-bottom: 20px;
border-bottom:1px solid #f0eeee;
}
.parrainage_gains {font-size:1.2em;text-align: center!important;}
.parrainage_gains {margin:20px auto 5px;}
.parrainage_gains span:first-child, .parrainage_gains i {font-weight:bold;}
.parrainage_commission {text-align: center!important;}
.bt_commission {font-size:12px;margin-top:10px;display:inline-block;}
.conditionsParrainage {font-size:0.9em;font-style:italic;margin-top:10px;display:inline-block;color:#c0c0c0;}
/*__ MES POINTS FIDELITE __*/
.compteFidelite {
margin: 0 0 10px;
font-size: 12px;
line-height: 16px;
}
.compteFidelite p {margin: 0 0 10px;}
.compteFidelite b {
font-weight: normal;
text-decoration: underline;
}
.compteFideliteVersement {
padding: 10px;
line-height: 16px;
background-color: #f0eeee;
font-size: 12px;
}
.compteFidelite_noPoint {
padding: 10px;
line-height: 16px;
color: #c30040;
font-size: 12px;
text-align: center;
}
.comptePoints {
padding: 15px;
float: right;
width: 150px;
font-size: 12px;
text-align: center;
background-color: #f0eeee;
}
.comptePoints b {
color: #c30040;
font-size: 18px;
font-weight: bold;
}
/*__ POP UP POINTS FIDELITE (points_info.php) __*/
/*#points_fid {
width: 60%;
margin: auto;
padding-bottom: 2em;
}
.points_info_element_bas_gauche {
float: left;
position: absolute;
bottom: 10px;
left: 20px;
}
div.points_info_logo img, div.points_info_logo .flags div, .flags div.points_info_logo div {
width: 200px;
position: absolute;
bottom: 10px;
right: 10px;
}
.points_info_h2 {
background: url(/images/ico_cotes.jpg) no-repeat;
padding-left: 40px;
margin: 0 0 0 20px;
line-height: 30px;
}
.points_info_contener {margin: 0;}
.points_info_text {
position: relative;
border: 8px solid #c30040;
width: 484px;
height: 530px;
}
.points_info_explain {
margin: auto;
width: 400px;
}
.points_info_explain p {
padding: 1px;
margin: 5px 0;
}
*/
/*__ MES COMMANDES __*/
.recap_order {
line-height: 18px;
font-size: 12px;
width: 350px;
}
.order_options {
position: absolute;
padding: 0;
width: auto;
right: 10px;
top: 40px;
max-width: 300px;
}
#content .order_number {
margin: 0 auto auto;
padding: auto;
}
.order_pdf {
font-size: 20px;
font-weight: normal;
float: right;
}
.order_payport_pdf {
font-size: 11px;
font-weight: normal;
position: relative;
text-align: right;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
display: inline;
padding: 5px;
background-color: #c0c0c0;
}
.addresses {
display: flex;
flex-direction: row;
float: left;
}
.addresses>.delivery_address, .addresses>.billing_address {
line-height: 18px;
font-size: 12px;
margin: 5px 10px auto auto;
}
.addresses>.delivery_address>b {
text-transform: none;
}
.order_info_marketplace {
border-top: 1px solid #c0c0c0;
padding-top: 10px;
line-height: 16px;
margin-bottom: 20px;
}
.required {
color: #c30040;
font-size: 10px;
}
.order_tracking_colis {
font-size: 14px;
margin-bottom: 20px;
}
.order_tracking_colis i, .order_tracking_colis div {
display: inline-block;
vertical-align: middle;
}
.order_tracking_colis i {
font-size: 35px;
width: 10%;
text-align: center;
}
.order_tracking_colis div {width: 85%;}
/*__Progress status__*/
.text-status, .text-status-valide {
width: calc( 100% / 6 );
}
.text-status-mp, .text-status-valide-mp {
width: 25%;
}
.text-status, .text-status-mp {
text-align: center;
font-family: OpenSans,Arial, sans-serif, Gotham, "Helvetica Neue", Helvetica;
line-height: 15px;
color: #adadad;
}
.text-status-valide, .text-status-valide-mp {
text-align: center;
font-size: 35px;
line-height: 15px;
color: #363636;
}
.icon-status{
font-size: 35px;
text-align: center;
color: #adadad;
}
.icon-status-valide{
font-size: 35px;
text-align: center;
color: #363636;
}
.text-status-etat {font-size: 12px;}
.text-status-date, .text-status-detail {
font-size: 11px;
color: #707070;
font-style: italic;
margin-top: 5px;
}
.numero_de_commande {margin: 1em 0;}
#content-icons {height: 2.5em; display:flex; justify-content: space-around;}
#content-text-status {display:flex;}
.progress-bar {
margin: 25px 0 0;
width: 100%;
height: 18px;
background-color: #e1e1e1;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
box-shadow: inset 0 1px 2px #919191;
-webkit-box-shadow: inset 0 1px 2px #919191;
-moz-box-shadow: inset 0 1px 2px #919191;
}
.progress-bar.marketplace {width: 100%;}
.bar-status1, .bar-status2, .bar-status3, .bar-status4, .bar-status5, .bar-status6, .bar-status1-marketplace, .bar-status2-marketplace,
.bar-status3-marketplace, .bar-status4-marketplace {
height: 18px;
background-color: var(--main-color);
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
box-shadow: inset 0 1px 2px rgba(0,0,0,0.25);
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.25);
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.25);
}
.bar-status1 {
width: calc(100% / 6);
animation: statut1 3s linear;
}
.bar-status2 {
width: calc(100% / 6 * 2);
animation: statut2 3s linear;
}
.bar-status3 {
width: calc(100% / 6 * 3);
animation: statut3 3s linear;
}
.bar-status4 {
width: calc(100% / 6 * 4);
animation: statut4 3s linear;
}
.bar-status5 {
width: calc(100% / 6 * 5);
animation: statut5 3s linear;
}
.bar-status6 {
width: calc(100% / 6 * 6);
animation: statut6 3s linear;
}
.marketplaceTrackingOrders {width: 100%;}
.marketplaceTrackingOrders .bar-status1 {
width: 25%;
animation: statutmp1 3s linear;
}
.marketplaceTrackingOrders .bar-status2 {
width: 50%;
animation: statutmp2 3s linear;
}
.marketplaceTrackingOrders .bar-status3 {
width: 75%;
animation: statutmp3 3s linear;
}
.marketplaceTrackingOrders .bar-status4 {
width: 100%;
animation: statutmp4 3s linear;
}
@keyframes statut1 {
0% {width: 0px;}
100% {width: calc(100% / 6);}
}
@keyframes statut2 {
0% {width: 0px;}
100% {width: calc(100% / 6 * 2);}
}
@keyframes statut3 {
0% {width: 0px;}
100% {width: calc(100% / 6 * 3);}
}
@keyframes statut4 {
0% {width: 0px;}
100% {width: calc(100% / 6 * 4);}
}
@keyframes statut5 {
0% {width: 0px;}
100% {width: calc(100% / 6 * 5);}
}
@keyframes statut6 {
0% {width: 0px;}
100% {width: calc(100% / 6 * 6);}
}
/* Marketplace*/
@keyframes statutmp1 {
0% {width: 0px;}
25% {width: 25%;}
100% {width: 25%;}
}
@keyframes statutmp2 {
0% {width: 0px;}
50% {width: 50%;}
100% {width: 50%;}
}
@keyframes statutmp3 {
0% {width: 0px;}
75% {width: 75%;}
100% {width: 75%;}
}
@keyframes statutmp4 {
0% {width: 0px;}
100% {width: 100%;}
}
.container-triangles {
display:flex;
justify-content: space-around;
}
.triangle{
margin: 0 auto;
width: 0;
height: 0;
border-style: solid;
border-width: 9px 9px 0 9px;
border-color: #e1e1e1 transparent transparent;
}
.triangle1-red, .triangle2-red, .triangle3-red, .triangle4-red, .triangle5-red, .triangle6-red {
margin: 0 auto;
width: 0;
height: 0;
border-style: solid;
border-width: 9px 9px 0 9px;
border-color: var(--main-color) transparent transparent;
}
.triangle1-red{animation: red1 3s linear;}
.triangle2-red{animation: red2 3s linear;}
.triangle3-red{animation: red3 3s linear;}
.triangle4-red{animation: red4 3s linear;}
.triangle5-red{animation: red5 3s linear;}
.triangle6-red{animation: red6 3s linear;}
.marketplaceTrackingOrders .triangle1-red{animation: redMP1 3s linear;}
.marketplaceTrackingOrders .triangle2-red{animation: redMP2 3s linear;}
.marketplaceTrackingOrders .triangle3-red{animation: redMP3 3s linear;}
.marketplaceTrackingOrders .triangle4-red{animation: redMP4 3s linear;}
@keyframes red1 {
0% {border-color: #e1e1e1 transparent transparent;}
9% {border-color: #e1e1e1 transparent transparent;}
13% {border-color: var(--main-color) transparent transparent;}
100% {border-color: var(--main-color) transparent transparent;}
}
@keyframes red2 {
0% {border-color: #e1e1e1 transparent transparent;}
25% {border-color: #e1e1e1 transparent transparent;}
29% {border-color: var(--main-color) transparent transparent;}
100% {border-color: var(--main-color) transparent transparent;}
}
@keyframes red3 {
0% {border-color: #e1e1e1 transparent transparent;}
41% {border-color: #e1e1e1 transparent transparent;}
45% {border-color: var(--main-color) transparent transparent;}
100% {border-color: var(--main-color) transparent transparent;}
}
@keyframes red4 {
0% {border-color: #e1e1e1 transparent transparent;}
57% {border-color: #e1e1e1 transparent transparent;}
61% {border-color: var(--main-color) transparent transparent;}
100% {border-color: var(--main-color) transparent transparent;}
}
@keyframes red5 {
0% {border-color: #e1e1e1 transparent transparent;}
72% {border-color: #e1e1e1 transparent transparent;}
77% {border-color: var(--main-color) transparent transparent;}
100% {border-color: var(--main-color) transparent transparent;}
}
@keyframes red6 {
0% {border-color: #e1e1e1 transparent transparent;}
89% {border-color: #e1e1e1 transparent transparent;}
93% {border-color: var(--main-color) transparent transparent;}
100% {border-color: var(--main-color) transparent transparent;}
}
/* Marketplace */
@keyframes redMP1 {
0% {border-color: #e1e1e1 transparent transparent;}
14% {border-color: #e1e1e1 transparent transparent;}
16% {border-color: var(--main-color) transparent transparent;}
100% {border-color: var(--main-color) transparent transparent;}
}
@keyframes redMP2 {
0% {border-color: #e1e1e1 transparent transparent;}
39% {border-color: #e1e1e1 transparent transparent;}
41% {border-color: var(--main-color) transparent transparent;}
100% {border-color: var(--main-color) transparent transparent;}
}
@keyframes redMP3 {
0% {border-color: #e1e1e1 transparent transparent;}
64% {border-color: #e1e1e1 transparent transparent;}
66% {border-color: var(--main-color) transparent transparent;}
100% {border-color: var(--main-color) transparent transparent;}
}
@keyframes redMP4 {
0% {border-color: #e1e1e1 transparent transparent;}
89% {border-color: #e1e1e1 transparent transparent;}
91% {border-color: var(--main-color) transparent transparent;}
100% {border-color: var(--main-color) transparent transparent;}
}
/*___version popup___*/
/* Toi qui passe ne me juge pas tu n'imagines pas sur quel code legacy pourri j'ai du faire ce css moisi */
.popupSuivi #content-icons {
display: inline-block;
width: calc(100% - 44px - 70%);
height:360px;
}
.popupSuivi .progress-bar {
margin:0;
height: 360px;
width: 28px;
border-radius: 6px;
background-color: #cccccc;
order:2;
}
.popupSuivi .container-triangles {
flex-direction: column;
order:1;
width: 16px;
}
.popupSuivi .progress-bar > div { position: absolute; width: 28px; border-radius: 6px; background-color: #c30040; }
.popupSuivi .bar-status1 { height: 60px; }
.popupSuivi .bar-status2 { height: 120px; }
.popupSuivi .bar-status3 { height: 180px; }
.popupSuivi .bar-status4 { height: 240px; }
.popupSuivi .bar-status5 { height: 300px; }
.popupSuivi .bar-status6 { height: 360px; }
.popupSuivi .icon-status,
.popupSuivi .icon-status-valide {
height: 60px;
width: 100%;
font-size: 4em;
color: #cccccc;
}
.popupSuivi .icon-status i, .popupSuivi .icon-status-valide i {
margin-top: 1px;
display: block;
}
.popupSuivi .icon-status-valide { color: #363636; }
.popupSuivi #content-bar-triangles {
display: inline-flex;
position: relative;
vertical-align: top;
width: 44px;
height: 360px;
}
.popupSuivi .content-triangle {
height: 60px;
width: 100%;
position: relative;
}
.popupSuivi .triangle, .popupSuivi .triangle1-red, .popupSuivi .triangle2-red, .popupSuivi .triangle3-red, .popupSuivi .triangle4-red, .popupSuivi .triangle5-red, .popupSuivi .triangle6-red {
width: 0;
height: 0;
border-top: 20px solid transparent;
border-bottom: 20px solid transparent;
border-right: 20px solid #cccccc;
margin-left: -1em;
position: absolute;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
}
.popupSuivi .triangle1-red, .popupSuivi .triangle2-red, .popupSuivi .triangle3-red, .popupSuivi .triangle4-red, .popupSuivi .triangle5-red, .popupSuivi .triangle6-red {
border-right: 20px solid #c30040;
}
.popupSuivi #content-text-status {
display: inline-block;
vertical-align: top;
padding-left: 1em;
width: 65%;
height: 360px;
box-sizing: border-box;
}
.popupSuivi .text-status,
.popupSuivi .text-status-valide {
position: relative;
width: 100%;
height: 60px;
font-size: 1em;
text-align: left;
}
.popupSuivi .text-status > div,
.popupSuivi .text-status-valide > div {
position: absolute;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
}
#sp_popup_parent .popupSuivi .text-status-etat {
font-size: 1em;
font-weight: bold;
}
#sp_popup_parent .popupSuivi .text-status-date {
font-size: 1em;
font-style: italic;
}
.popupSuivi .triangle1-red, .popupSuivi .triangle2-red, .popupSuivi .triangle3-red, .popupSuivi .triangle4-red, .popupSuivi .triangle5-red, .popupSuivi .triangle6-red,
.popupSuivi .marketplaceTrackingOrders .triangle1-red, .popupSuivi .marketplaceTrackingOrders .triangle2-red, .popupSuivi .marketplaceTrackingOrders .triangle3-red, .popupSuivi .marketplaceTrackingOrders .triangle4-red,
.popupSuivi .bar-status1, .popupSuivi .bar-status2, .popupSuivi .bar-status3, .popupSuivi .bar-status4, .popupSuivi .bar-status5, .popupSuivi .bar-status6,
.popupSuivi .marketplaceTrackingOrders .bar-status1,.popupSuivi .marketplaceTrackingOrders .bar-status2,
.popupSuivi .marketplaceTrackingOrders .bar-status3,.popupSuivi .marketplaceTrackingOrders .bar-status4 {animation: initial;}
/*__ MES RETOURS __*/
.compteRetourInfo {
padding: 10px;
line-height: 16px;
background-color: #f0eeee;
font-size: 12px;
text-align: center;
}
.compteRetourStatus {
background-color: #f0eeee;
color: #c30040;
font-size: 18px;
text-align: center;
}
/*__ PROFIL __*/
#coupon_reduc_prodil {
position: absolute;
right: 0;
}
#statut_marital, #study, #typ_logt, #budget_max, #marq {
margin-top: 10px;
}
#marq input, #site_preferes input, #products_int input {
margin-top: 5px;
}
.profil_question span {
font-weight: bold;
color: #c30040;
font-size: 12px;
}
.profil_question ul {list-style-type: none;}
.profil_question li {margin-bottom: 5px;}
#master, #prof_status {margin: 10px 0;}
#products_int span.profil_type_produit {
color: #363636;
font: normal normal 11px OpenSans, Arial, sans-serif;
}
#products_int select {margin-top: 5px;}
#alerte_profil {margin-bottom: 5px;}
#profil_taux_remplissage {text-align:center;}
#profil_avancement {
margin: auto;
display:inline-block;
width:80%;
height:20px;
background-color:#dfdfdf;
position:relative;
}
#profil_avancement div {
position:absolute;
bottom:0;
background-color:#C30040;
padding-left: 5px;
height:20px;
line-height:20px;
color:#FFFFFF;
}
#profil_etoile {
border-top: 2px dotted #e6e6e6;
font-size: 10px;
font-style: italic;
margin-top: 20px;
padding-top: 5px;
text-align: center;
}
#profil_taux_remplissage {
border: 5px solid #e6e6e6;
margin-bottom: 25px;
padding: 12px;
}
#reduc_profil {
margin-top: 35px;
font-size: 14px;
font-weight: bold;
}
.red_spartoo {color: #c30040;}
/*__ MY HELP BOX : TUTOS __*/
.tuto_link {
position: relative;
display: inline-block;
width: 300px;
padding: 10px;
text-align: center;
vertical-align: top;
font-size: 14px;
}
.tuto_link a div {
position: absolute;
left: 20px;
width: 260px;
height: 145px;
background-color: rgba(0, 0, 0, 0);
}
.tuto_link a div:hover {
background-color: rgba(0, 0, 0, 0.5);
}
/*__ AUTRES __*/
#affiche table, #afficheAide table {
border-collapse: collapse;
width: 100%;
}
#affiche .headingTable, #afficheAide .headingTable {
font-size: 13px;
font-weight: bold;
text-align: center;
}
#affiche td {
min-height: 40px;
padding: 10px 0;
vertical-align: middle;
}
#affiche a.btn {
color: #fff;
text-decoration: none;
}
.tableListing-even {text-align: center;}
.tableListing-odd {
text-align: center;
background-color: #f0eeee;
}
.tableListing-total {
text-align: center;
font-size: 14px;
font-weight: bold;
color: #c30040;
}
/* COMPTE: Modifier la taille d'un de mes produits */
#lastOrders { text-align: center; }
#lastOrders > .lastOrders-tableListing:nth-child(odd){ background-color: #f0eeee; }
.lastOrders-tableListing { width: 100%; margin: auto; padding: 1em 0; }
.lastOrders-tableListing > div { display: inline-block; vertical-align: middle; }
.lastOrders-tableListing > div:nth-child(1) { width: 30%; }
.lastOrders-tableListing > div:nth-child(2) { width: 40%; }
.lastOrders-tableListing > div:nth-child(3) { width: 30%; }
#annulOrders p { text-align: center; }
/* */
.order_type_info {
font-size: 9px;
color: #707070;
}
.inputText, .inputLongText {
margin: 10px 0 0 5px;
width: 150px;
float: left;
}
.inputLongText {width: 200px;}
.col {
width: 425px;
float: left;
margin: 0;
}
.desaboCRMtxt {
margin: 40px 0 10px 35px;
width: 400px;
float: left;
font-size: 12px;
line-height: 18px;
text-align: justify;
}
.desaboCRMimg {
margin: 0 0 10px 20px;
width: 400px;
float: left;
}
.compte_encart {
position: absolute;
right: -5px;
height: 300px;
width: 240px;
}
/* Compte accueil Panel et Fid*/
.compteFid {
border: 1px solid #e6e6e6;
margin-bottom: 20px;
}
.compteFid > i {
display: inline-block;
vertical-align: middle;
width: 3%;
text-align: center;
color: #c30040;
font-size: 30px;
line-height: 50px;
}
.compteFidTitle {
font: bold 22px/40px OpenSansCond,Arial,sans-serif;
text-transform: uppercase;
text-align: center;
}
.compteFidText {
text-align: center;
font-size: 14px;
display: inline-block;
width: 31%;
vertical-align: top;
margin: 0 auto 10px auto;
}
.compteFidText b {
font: bold 18px/24px OpenSans,Arial,sans-serif;
display: block;
}
.compteFidText i {
font-size: 30px;
color: #c30040;
display: block;
}
.panierspartooandme {
display: flex;
height: 275px;
margin: 2em auto;
justify-content: flex-end;
background-image: url(../images/panier_spartooandme.jpg);
background-color: #ef8a8e;
background-repeat: no-repeat;
border-radius: 10px;
}
.panierspartooandme #txt_spartooandme {
display: flex;
flex-direction: column;
align-content: center;
justify-content: center;
width: 55%;
height: 100%;
padding: 0 0 0 2em;
}
.panierspartooandme #txt_spartooandme .titrespartooandme {
font: bold 20px OpenSansCond, Arial, sans-serif;
text-transform: uppercase;
color: #fff;
}
.panierspartooandme #txt_spartooandme ul {
font-size: 1.25em;
line-height: 2;
margin-bottom: 0;
}
.panierspartooandme #txt_spartooandme li {
list-style: none;
margin: 0;
padding: 0;
}
.panierspartooandme #txt_spartooandme li .icon-valider {
display: inline-block;
font-size: 1.4em;
margin-right: 0.25em;
transform: translate(0,0.15em);
}
.panierspartooandme #txt_spartooandme li .italic {
display: inline-block;
transform: translate(1.6em,0);
}
.panierspartooandme #btn_sampanier1 {
display: inline-block;
border-radius: 4px;
background-color: #628f00;
color: #ffffff;
font-size: 1.5em;
font-weight: bold;
text-transform: uppercase;
padding: 0.5em 1em;
margin: 1em 0;
transform: translate(1.5em,0);
transition: background-color .4s ease-out .05s;
-moz-box-shadow: 4px 4px 0px 0px #c0c0c0;
-webkit-box-shadow: 4px 4px 0px 0px #c0c0c0;
-o-box-shadow: 4px 4px 0px 0px #c0c0c0;
box-shadow: 4px 4px 0px 0px #c0c0c0;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=134, Strength=0);
}
.panierspartooandme #btn_sampanier1:hover {
background-color: #628f00;
}
/*
.panierspartooandme span{
font: 12px/18px OpenSansRegular, Arial, sans-serif;
}
.panierspartooandme p {
margin:8px;
}
#content #txt_spartooandme p{
width: 55%;
background-color: rgba(255, 255, 255, .4);
padding: 20px;
}
.contentD_compte .btn_sampanier1 {
display:flex;
align-items: center;
}
.contentD_compte .btn_sampanier{
background-color: #c30040;
color: #fff;
padding: 5% 5%;
border-radius: 5px;
font: bold 17px OpenSansCond, Arial, sans-serif;
text-transform: uppercase;
text-align: center;
width: 130px;
margin:100px 20px 0 0;
}
.contentD_compte .btn_sampanier p {
text-align: center!important;
}
.contentD_compte .panierspartooandme .titrespartooandme {
font: bold 18px OpenSansCond, Arial, sans-serif;
text-transform: uppercase;
} */
.cgvspartooandme {
font: 11px OpenSansRegular, Arial, sans-serif;
}
.contentD_compte .premium_small .premium_visuel img {
display:none;
}
.contentD_compte .premium_small .premium_visuel {
display: none;
align-self: stretch;
width: 0%;
overflow: hidden;
}
.contentD_compte .premium_small .premium_addtobasket {
width: 50%;
margin: 0;
padding: 30px;
}
/*FIN SPARTOO&ME PREMIUM*/
.panel_compte_bg {
height: 235px;
background: url(/images/panel_compte_bg.jpg) left top no-repeat;
text-align: center;
border: 1px solid #e6e6e6;
margin-top: 20px;
border-radius: 10px;
}
.panel_compte_bg >div{
display: block;
width: 50%;
margin-left: 45%;
font-size: 18px;
}
.panel_compte_bg span {
display: block;
margin: 20px auto;
}
.panel_compte_bg span:last-of-type {
font-size: 12px;
font-style: italic;
}
/*POP UP NEW VISIT*/
#popupVisit { width: 100%; }
#popupVisit ul, #popupVisit li {margin: 0; padding:0; list-style: none;}
#popupVisit li {
display: block;
width: 90%;
margin: auto;
padding: 0 0.5% 2% 0.5%;
text-align: center;
background-color: #fff;
-moz-box-shadow: 0 0 5px #c0c0c0;
-webkit-box-shadow: 0 0 5px #c0c0c0;
box-shadow: 0 0 5px #c0c0c0;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=5);
}
#popupVisit img, #popupVisit h3, .popupVisitPriceSizeButton{
display: inline-block;
vertical-align: middle;
width: 18%;
}
#popupVisit .ident_product {
color: #363636!important;
}
#popupVisit .shopping_cart {
margin: 0;
}
#popupVisit .price {
font-size: 18px;
}
#popupVisit h3 label {
display: block;
}
.popupVisitOrderInfo {
font-size: 18px;
border-bottom: 1px solid #e6e6e6;
padding-bottom: 5px;
margin-bottom: 5px;
}
.popupVisitOrderTracking{
font-size: 40px;
font-weight:200;
font-family: OpenSans, Arial, sans-serif;
font-style: normal;
text-transform: uppercase;
margin-bottom: 5px;
}
input.validate:invalid {
box-shadow: 0 0 5px 1px red;
}
.inputIBAN {
text-align: center;
width: 45px !important;
padding-left: 0.25rem !important;
padding-right: 0.25rem !important;
}
/*ACCUEIL COMPTE DOWNLOAD APP*/
.compte_appdl_content {
margin: 0 auto 2em auto;
}
.compte_appdl_intro {
display: flex;
flex-wrap: wrap;
font-size: 1.4em;
background-color: #f9de83;
border-radius: 10px;
padding: 2em;
}
.compte_appdl_intro p {
display: flex;
flex-wrap: wrap;
width: 40%;
align-items: center;
text-align: justify;
padding: 1em;
}
.compte_appdl_intro p span {
width: 100%;
font: bold 1.4em / 1em OpenSans, sans-serif;
color: #363636;
}
.compte_appdl_buttons {
display: flex;
width: 60%;
justify-content: space-around;
}
.compte_appdl_buttons > div {
display: flex;
align-items: center;
text-align: center;
flex-direction: column;
background-color: #fff;
border-radius: 5px;
max-width: 45%;
padding: 1em;
font-size: 0.9em;
color: #ff6255;
}
.compte_appdl_buttons div > img {
width: 125px;
}
.compte_appdl_discount {
}
/*-- LOGIN PANIER --*/
.panierInclude {
margin:0;
padding: 0;
width:100%;
font-size: 1.4em;
background-color:#fafafa;
}
#content .panierInclude h2 {
padding: 0.5em 1em;
margin: auto;
background-color: #f0eeee;
}
.panierIncludeContent img {
margin: 1em 2em 1em 1em;
width: 80px;
}
.panierIncludeContent {
display: flex;
padding:1em 5em 1em 1em;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
width: 100%;
border-bottom: 2px solid #fff;
}
.panierIncludeContentText {
flex: 1;
display: flex;
align-items: flex-end;
justify-content: space-between;
}
.panierIncludeContentTotal {
width: 100%;
text-align: right;
font-size: 1.4em;
padding: 1em 3em 1em 1em;
}
#logoassurtoo {
margin: 0 auto 20px;
display: bloc;
text-align:center;
}
#cgv_assurtoo {
text-align: left;
}
#introassurtoo, #introassurtooavantages, #introassurtoofonctionnement {
display:flex;
}
#introassurtoofonctionnement {
justify-content: space-around;
}
#introassurtoo {
text-align:center;
align-items: center;
}
.titreasurtoo {
text-transform:uppercase;
font:20px OpenSansBold,Arial,sans-serif;
border:1px solid #c30040;
padding:10px;
margin:40px 0 40px 0;
text-align:center;
}
#introassurtooavantages {
justify-content: space-between;
margin:20px 0 20px 0;
}
#sstitreavantages {
font:15px OpenSansBold,Arial,sans-serif;
}
#introtxt {
font:14px OpenSans,Arial,sans-serif;
text-align:center;
width:90%;
margin: 0 auto;
}
#btnsouscrire {
display:bloc;
margin:10px 0;
background-color:#c30040;
color:#fff;
font:15px OpenSansBold,Arial,sans-serif;
padding:10px ;
cursor: pointer;
}
#btnsouscrire a{
color:#fff;
}
.introtxtbtn a:hover{
display:bloc;
margin:10px 0;
background-color:#c30040;
color:#fff;
font:15px OpenSansBold,Arial,sans-serif;
padding:10px ;
cursor: pointer;
}
.ensavoirplusassurtoo{
font:10px OpenSans,Arial,sans-serif;
font-style:italic;
text-transform: capitalize;
text-align:center;
width:90%;
margin: 0 auto;
}
#souscrir {
width:70%;
text-transform:uppercase;
text-align:center;
font:15px OpenSansBold,Arial,sans-serif;
border:1px solid #c30040;
color:#c30040;
padding:30px;
}
.titreavantages {
text-transform:uppercase;
font:20px OpenSansBold,Arial,sans-serif;
}
.txtoavantagesdescription {
display:flex;
background-color:#c30040;
color:#fff;
text-align:center;
justify-content: center;
align-items: center;
width:33%;
padding:10px;
}
.txtfonctionnementdescription {
display:flex;
align-items: flex-start;
color:#000;
text-transform:uppercase;
text-align:left;
width: 25%;
}
.txtoavantagesdescription p{
font:14px OpenSansBold,Arial,sans-serif;
}
#btnsinistre {
background-color:#c30040;
color:#fff;
font:15px OpenSansBold,Arial,sans-serif;
padding:10px ;
margin: 40px auto 20px;
text-align: center;
width: 20%;
}
#btnsinistre a{
color:#fff;
}
.condition {
text-transform:uppercase;
text-align:center;
}
/*CGV*/
.tableaucgvassuretoo {
border:1px solid #c3c3c3;
max-width:1200px;
margin: 0 auto;
}
#grtitrecgvassurtoo {
text-align: center;
font-size:30px;
color: #c30040;
font-weight: bold;
padding:20px;
}
.titrecgvassurtoo {
font-size:20px;
color: #c30040;
margin-bottom:20px;
}
.sstitre {
font-weight:bold;
}
.titretableau {
text-align: center;
font-weight: bold;
background-color: #fadde6;
border:1px solid #c3c3c3;
padding:20px;
}
.sstitretableau {
vertical-align: middle;
text-align: center;
border:1px solid #c3c3c3;
}
.sstitretableau1 {
padding:30px;
vertical-align: middle;
text-align: center;
border:1px solid #c3c3c3;
}
.txtcategories {
border:1px solid #c3c3c3;
width:400px;
}
.txtcategories p{
padding:10px;
}
/*****************************************************
**** SOMMAIRE **** PRODCARD
@GLOBAL
- MAIN -
__ FIL D'ARIANE __
__ AFFICHAGE PRODUIT __
__ INFOS PRINCIPALES __
__ DISPO MAGASINS (AN) __
- MARCHANDS MARKETPLACE -
- DESCRIPTION / PARTAGER -
- INFOS COMPLEMENTAIRES -
__ COMPLETER LOOK __
__ AVIS CLIENTS __
@VUE360 (pop_up_image.php)
@CARROUSELS
@MODULES COMPLEMENTAIRES
- POP UP ADD TO WISHLIST -
- ALERTE TAILLE -
- GUIDE DES TAILLES -
- ENVOYER A UN AMI (my_friend.php) -
*****************************************************/
/*****************************************************
**** @GLOBAL
******************************************************/
/*---- MAIN ----*/
#prodcard2 {
width: 100%;
margin: 10px 0 0;
padding:0;
}
#prodcard2 >div:first-of-type {
display: flex;
flex-wrap: wrap;
}
#prodcard2 .fn {font-size: 14px;}
#content_prodcard {
font-size: 14px;
}
/*__ FIL D'ARIANE __*/
#prodcard_return {
display: inline-block;
margin: 0;
color: #363636;
text-indent: 5px;
background-color: #fff;
text-transform: uppercase;
}
#prodcard_return i {
margin-right: 5px;
margin-left: -5px;
}
.filArianeProdcard {
padding: 10px 0;
margin: 0 0 10px;
border-bottom: 1px solid #e6e6e6;
width: 100%;
}
.filArianeProdcard a:last-of-type {font-family:OpenSans, Arial, sans-serif; font-weight: bold;}
/*__ AFFICHAGE PRODUIT __*/
.productBigView {
display: flex;
width: 50%;
flex-direction: column;
justify-content: flex-start;
min-height: 500px;
position: relative;
margin-right: 5%;
vertical-align: top;
box-sizing: border-box;
text-align: center;
}
.productBigView img {
margin:0 auto;
vertical-align: middle;
}
/* Miniatures Autres vues */
.productView {
width: 5%;
display: inline-block;
vertical-align: top;
box-sizing: border-box;
}
.productView img {
margin-bottom: 10px;
}
/* Photo produit externe */
#products_pictures_complementaire {
margin-bottom: 20px;
max-width: 100%;
}
#products_pictures_complementaire > div{
display: flex;
flex-wrap: wrap;
max-height: 710px;
overflow-Y: auto;
scrollbar-color: c0c0c0 f0eeee;
scrollbar-width: thin;
}
/* width */
#products_pictures_complementaire > div::-webkit-scrollbar {
width: 4px;
}
/* Track */
#products_pictures_complementaire > div::-webkit-scrollbar-track {
background: #f0eeee;
border-radius: 2px;
}
/* Handle */
#products_pictures_complementaire > div::-webkit-scrollbar-thumb {
background: #c0c0c0;
border-radius: 2px;
}
/* Handle on hover */
#products_pictures_complementaire > div::-webkit-scrollbar-thumb:hover {
background: #dddddd;
}
#products_pictures_complementaire > div > div {
width: 290px;
margin-bottom: 2em;
}
#products_pictures_complementaire img{
max-width: 275px;
}
.home_carousel {
width: 1200px;
margin: auto;
}
/*__ ZOOM __*/
.photo.product_zoom {
cursor: zoom-in;
}
#zoom_container {
z-index: 100;
position: fixed;
top:0;
left:0;
width:100vw;
height: 100vh;
display:flex;
background-color: #fff;
overflow-y: auto;
}
#zoom_container .close_zoom {
position: fixed;
top:0;
right: 12px;
color: #707070;
cursor: pointer;
font-size: 24px;
text-align:center;
padding: 5px 10px;
}
#zoom_container .zoom_views {
display:flex;
flex-direction: column;
padding:20px;
background-color: #fff;
max-height:100vh;
width: 160px;
height:100vh;
position:fixed;
top:0;
direction: rtl;
overflow-y:auto;
}
#zoom_container::-webkit-scrollbar-track,
#zoom_container .zoom_views::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px;
background-color: #F5F5F5;
}
#zoom_container::-webkit-scrollbar,
#zoom_container .zoom_views::-webkit-scrollbar {
width: 12px;
background-color: #F5F5F5;
}
#zoom_container::-webkit-scrollbar-thumb,
#zoom_container .zoom_views::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
background-color: #c0c0c0;
}
#zoom_container .zoom_views a {
margin-bottom:30px;
direction:ltr;
}
#zoom_container .zoom_views a img {
max-width: 100%;
}
#zoom_container .zoomed {
flex-grow:1;
text-align: center;
margin-left: 160px;
}
#zoom_container .zoomed img {
align-self: flex-start;
max-width: 100%;
cursor: zoom-out;
margin-right:0;
}
#zoom_container .zoomed img.less_zoomed {
max-height:100vh;
cursor: zoom-in;
margin-right:160px;
}
@media screen and (max-width:720px) {
#zoom_container {
flex-direction: column-reverse;
}
#zoom_container .zoom_views {
position:initial;
flex-direction: row;
z-index:2;
padding:20px;
height: 150px;
width:100%;
overflow-x: auto;
overflow-y: hidden;
direction: initial;
}
#zoom_container .zoom_views a {
text-align: center;
margin: 0 10px;
max-width:20%;
}
#zoom_container .zoom_views a img {
max-width: initial;
max-height: 100%;
}
#zoom_container .zoomed {
height: calc(100vh - 150px);
margin-left:initial;
}
#zoom_container .zoomed img {
height: initial;
cursor: zoom-in;
max-width: 100%;
max-height: 100vh;
margin-right:initial;
}
}
/*__ INFOS PRINCIPALES __*/
.prodcardBase {
width: 40%;
top: 0;
right: 0;
align-self: flex-start;
position: sticky;
display: inline-block;
vertical-align: middle;
box-sizing: border-box;
}
.brandLogo {
border: 1px solid #c0c0c0;
vertical-align: middle;
}
.productNameColor {
display: inline-block;
vertical-align: middle;
margin-left: 10px;
font: 20px/24px OpenSans, Arial, sans-serif;
}
.productNameColor h1 {
font-weight: bold;
}
#avis {
width: 100%;
justify-content: right;
text-align: right;
vertical-align: top;
}
.product_price_div {
display: block;
width: 100%;
}
/* .productPrice, .sales-productPrice {
margin-top: 20px;
}
*/.productPrice > span, .sales-productPrice > span {
display: block;
font-size: 12px;
}
.prodcardDiscountBold {
color: var(--main-color);
}
#prodcard_3X {
margin-top: 10px;
}
.productPrice i, .sales-productPrice i {
display: inline-block;
vertical-align: bottom;
font-size: 18px;
color: #91bd09;
}
.product_price_span, .sales-productPrice > span > span:first-of-type {
font: bold 18px/22px OpenSans, Arial, sans-serif;
}
/* Helpbox prix + Helpbox avis*/
.product_price_div .icon_info_price, .avisClients .icon_info_comment {
margin-right: 5px;
display:inline-block;
line-height: 20px;
position: relative;
}
.product_price_div .icon_info_price i, .avisClients .icon_info_comment i {
color: #c0c0c0;
cursor: pointer;
}
.product_price_div .icon_info_price .info_price_helpbox, .avisClients .icon_info_comment .info_price_helpbox {
display:none;
position: absolute;
top: 50%;
right: 0;
transform: translate(calc(100%), -50%);
min-width: 300px;
font-size: 10px;
text-align: center;
background-color: #fff;
color:#707070;
border: 1px solid #c0c0c0;
padding: 3px 4px;
border-radius:5px;
box-shadow: 1px 1px 2px rgba(0,0,0,.1);
font-weight: normal;
}
.product_price_div .icon_info_price:hover .info_price_helpbox, .avisClients .icon_info_comment:hover .info_price_helpbox {
display:block;
}
.productTVA {
font: italic 11px/14px OpenSans, Arial, sans-serif;
}
.addToCart {
width: 411px;
height: 40px;
margin: 20px 0 0 0;
font: bold 16px/20px OpenSans, Arial, sans-serif;
text-transform: uppercase;
}
.addToCart i {
margin: 0 0 0 10px;
font-size: 24px;
float: left;
}
#expedition_time_div {
margin: 10px 0 0 5px;
}
#expedition_time_div span {font-family: OpenSans, Arial, sans-serif; font-weight: bold;}
#add_to {
display: inline-block;
font-size: 26px;
vertical-align: top;
margin: 20px 0 0 20px !important;
border: 2px solid #707070;
border-radius: 50%;
padding: 5px;
}
#prodcard_freeshipping, #prodcard_mp_freereturn, #prodcard_mp_freeshipping, #prodcard_mp_freeshippingreturn {
display: inline-block;
margin-top: 10px;
}
#prodcard_freeshipping i, #prodcard_mp_freereturn i, #prodcard_mp_freeshipping i, #prodcard_mp_freeshippingreturn i {
display: inline-block;
vertical-align: bottom;
font-size: 18px;
color: #91bd09;
}
.prodcardInfosUtiles {
border-top: 1px solid #e6e6e6;
margin-top: 50px;
}
.prodcardInfosUtiles > div:first-child { padding-bottom: 1em; }
.retour_payant {
font-family: OpenSans, Arial, sans-serif;
}
span.retour_payant i {font-size: 18px;}
.prodcardInfosUtiles > div:first-of-type {
font: bold 16px/20px OpenSans, Arial, sans-serif;
color: #707070;
text-transform: uppercase;
margin-top: 10px;
}
.prodcardInfosUtiles > div:first-of-type i {
font-weight: bold;
font-size: 19px;
display: inline-block;
vertical-align: text-top;
}
.prodcardBase .header_shipping4Xmas {
padding: 1em;
margin: 0.5em auto;
justify-content: center;
text-align: center;
background-color: #ffebcc;
}
#products_other_merchants_div,
#disp_store_id,
#prodcard_premium_info,
#marketplace_info_div,
.neutre {
display: none;
margin: 0 auto;
text-align: left;
font-size: 14px;
color: #363636;
}
#kmlt_info_div {
font-size: 14px;
color: #363636;
}
#products_other_merchants_div a,
#disp_store_id a,
#prodcard_premium_info a,
#marketplace_info_div a,
#disp_echantillon a,
#kmlt_info_div a,
#promo_carlington a {
color: inherit;
font-size: 14px;
}
#prodcard_premium_info > div,
#marketplace_info_div > div,
#disp_echantillon > div,
#kmlt_info_div > div,
#products_other_merchants_div > div,
#disp_store_id > div,
.neutre > div {
display: flex;
padding: 0.25em 0;
flex-direction: row;
align-items: center;
}
#marketplace_info_div > div > div {
display: flex;
align-items: center;
}
#prodcard_premium_info .icon-flecheDroite,
#marketplace_info_div .icon-flecheDroite,
#disp_echantillon .icon-flecheDroite,
#products_other_merchants_div .icon-flecheDroite,
#disp_store_id .icon-flecheDroite,
.neutre .icon-valider {
font-size: 1.5em;
margin-right: .25em;
}
#prodcard_paypal {
padding: 2em;
background-color:#00ade5;
}
#prodcard_paypal > div:first-child {
text-align: left;
padding: 0 0 1rem 0;
}
#prodcard_paypal > div:last-child {
text-align: left;
color: #fff;
font-size: 1.2em;
}
#prodcard_paypal > div:last-child > div {
padding: 0.3em 0;
}
a#marketplace_name_inner, a#kmlt_name_inner { text-transform: capitalize; color:#c30040; text-decoration: underline;margin: 0 2px; }
#products_info_pub {
margin: 10px auto;
text-align: left;
font-size: 12px;
background-color: #efefef;
padding: 1em 1em 1em 1.9em;
border-radius: 0.4em;
}
#products_info_pub b {
font: bold 14px/18px OpenSans, Arial, sans-serif;
}
.expedition {
display: none;
font-size: 1.1em;
letter-spacing: 0.02em;
align-items: center;
width: 90%;
margin: 1.5em auto auto 0;
}
.expedition > img {
width: 15px;
height: 10px;
margin-right: 0.5em;
}
.sizeList_container {
margin-bottom: 0px;
}
.productSizeInfo {
display: flex;
align-items: center;
border-top: none;
padding: 0.2em 0.6em;
justify-content: space-between;
cursor: pointer;
}
.productSizeInfo i {
font-size: 1.6em;
}
.op_prodcard {
display: inline-block;
margin-left: 160px;
}
.op_prodcard img, .op_prodcard .flags div, .flags .op_prodcard div {
border: none;
}
.op_prodcard_prixdoux {
float: right;
width: 355px;
height: 42px;
text-align: center;
color: #363636;
border-radius: 4px;
border: 1px solid #c0c0c0;
}
.op_prodcard_prixdoux span { display: block; }
.op_prodcard_prixdoux span:first-child { font: italic 20px Georgia, Utopia, Charter, serif; }
.op_prodcard_prixdoux span:nth-child(2) { margin-top: -3px; }
.op_prodcard_prixdoux span:first-child b { color: #c30040;}
.op_prodcard_prixdoux span:nth-child(2) b { font-size: 13px; color: #c30040;}
.fn {font-size: 11px;}
.mac {
position: relative;
padding:0;
margin:0;
}
#prodcard2 .red {
border: 2px solid #c30040;
color: #c30040;
}
.paymentsAndShippingslogos {
margin: 20px 0 0 5px;
display: flex;
justify-content: space-between;
}
.paymentsAndShippingslogos img {
cursor: pointer;
}
/*__ ACHETER CE LOOK __*/
.wholeLook_div_title{
margin: 20px 0 0 0;
padding:10px 10px 10px 0;
font-weight: bold;
}
.wholeLook_div {
overflow: hidden;
width:100%;
box-sizing: border-box;
padding:10px;
border: 1px solid #e6e6e6;
border-radius: 5px;
display:flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
}
.wholeLook_div > div {width:100%;}
.wholeLook_div .caption {text-transform: uppercase;}
.wholeLook_div .wlk_subtitle:not(:first-child) {margin-top: 10px;}
.wholeLook_div .wlk_subtitle {
display: inline-block;
text-transform: uppercase;
margin-bottom: 6px;
}
.wholeLook_div p {margin: 0;}
.wholeLook_btn {
display:flex;
margin: 15px 0 5px;
color: #fff;
font-size: 12px;
line-height:20px;
text-align: center;
vertical-align: middle;
min-width: 50px;
}
.wholeLook_btn span:first-child {
padding: 4px 12px;
background-color: #505050;
border-radius: 3px 0 0 3px;
}
.wholeLook_btn span:last-child {
padding: 4px 8px;
border-radius: 0 3px 3px 0;
background-color: #c30040;
}
.wholeLook_btn span:last-child sup {
vertical-align: 2px;
font-size:9px;
}
.wholeLook_btn:hover {color: #fff; opacity:.9;}
.prodcardWholeLook {
width: 40%;
vertical-align: middle;
box-sizing: border-box;
display:inline-flex;
flex-direction: column;
}
.prodcardWholeLook h2 {
text-transform: uppercase;
font: bold 18px OpenSans, Arial, sans-serif;
border-bottom: 1px solid #f0eeee;
padding-bottom:10px;
margin-bottom:20px;
width:100%;
display:flex;
justify-content: space-between;
}
.wholeLook_product {
width:100%;
padding:10px;
margin-bottom: 15px;
border-bottom: 1px solid #f0eeee;
overflow:hidden;
}
.wholeLook_product:last-of-type {margin-bottom:5px;}
.wholeLook_img {float:left;}
.wholeLook_product img {width:100px;}
.wholeLook_productInfos {
flex-grow:1;
padding:15px 10px;
}
.wholeLook_productInfos select {
border: 1px solid #e6e6e6;
padding: 4px;
margin: 5px auto;
max-width: 90px;
}
.wholeLook_productInfos p {
font: 14px/18px OpenSans, Arial, sans-serif;
margin-bottom:5px;
}
.wholeLook_productInfos p:first-child {font-weight:bold;}
.wholeLook_productInfos p:nth-child(2) {text-transform:uppercase;}
.wholeLook_productInfos p:last-child {font-size:11px; color: #707070;}
.wholeLook_product .price {
font-size:11px;
text-align:center;
width:100px;
min-width:100px;
}
.wholeLook_product .price p, .wholeLook_footer p {margin-bottom:0;}
.wholeLook_discount .vignette_discount_rounded {
position: initial;
top: initial;
right:initial;
}
.wholeLook_product:first-of-type .wholeLook_img {margin-left: 40px;}
.wholeLook_product:first-of-type .price {margin-right: 40px;}
.wholeLook_all {
text-align:right;
}
.wholeLook_footer {
border:none !important;
margin:15px 0;
font-weight:bold;
}
.prodcardWholeLook .addToCart {width:100%;}
.prodcardWholeLook .addToCart + a {
text-align: center;
width: 100%;
display: inline-block;
margin-top: 10px;
}
/* Checkboxes */
.ctrl {
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
font-size: 18px;
}
.ctrl input {
position: absolute;
z-index: -1;
opacity: 0;
display:none; /*ajout*/
}
.ctrl__ind {
display: flex;
justify-content: center;
align-items: center;
margin-right : 20px;
height: 20px;
min-width: 20px;
width: 20px;
background: #e6e6e6;
cursor:pointer;
border-radius: 3px;
}
.ctrl:hover input ~ .ctrl__ind {background: #c0c0c0;}
.ctrl input:checked ~ .ctrl__ind,
.ctrl:hover input:not([disabled]):checked ~ .ctrl__ind {background: #363636;}
.ctrl input:disabled ~ .ctrl__ind {
background: #e6e6e6;
opacity: 0.6;
pointer-events: none;
}
.ctrl__ind:after {
content: '';
position: absolute;
display: none;
}
.ctrl input:checked ~ .ctrl__ind:after {display: block;}
.ctrl--ckbx .ctrl__ind:after {
width: 3px;
height: 8px;
border: solid #fff;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
/* Checkboxes END */
/* ACHETER CE LOOK : VERSION DANS INFOS COMPLEMENTAIRES */
.infosWholeLook {
margin: 20px 0;
border-top: 1px solid #e6e6e6;
border-bottom: 1px solid #e6e6e6;
padding: 20px 0;
}
.infosWholeLook h2 {
font: inherit;
text-align: center;
text-transform: uppercase;
}
.wlk_showcase {
display:flex;
justify-content: space-between;
align-items: center;
border: 1px solid #e6e6e6;
border-radius: 15px;
overflow: hidden;
}
.wlk_showcase > img {
width: calc(100% / 3);
}
.wlk_showcase > img.small {
width: calc(100% / 4);
}
.wlk_showcase > div {
width: calc(100% / 3 * 2);
display: flex;
justify-content: space-around;
}
/* cas produits nombreux */
.wlk_showcase > img.small + div {
width: calc(100% / 4 * 3);
}
.wlk_showcase label:first-child:nth-last-child(6),
.wlk_showcase label:first-child:nth-last-child(6) ~ label {
padding:20px;
}
.wlk_showcase .wholeLook_product:first-of-type .wholeLook_img{margin: 0;}
.wlk_showcase .wholeLook_product {
padding: 30px;
border: none;
flex-wrap: wrap;
position: relative;
max-width:35%;
}
.wlk_showcase .wholeLook_img {float:initial;}
.wlk_showcase .wholeLook_img img {
max-width:200px;
width:100%;
}
.wlk_showcase label .wholeLook_productInfos {
width: 100%;
padding:0;
margin-top:20px;
}
.wlk_showcase .wholeLook_product:first-of-type .price {margin: 0 20px;}
.wlk_showcase label .price {
min-width: initial;
width: calc(100% - 40px);
margin:auto;
}
.wlk_showcase label .ctrl__ind {
position: absolute;
top:30px;
right:20px;
}
.infosWholeLook .wholeLook_all {margin-top:5px;}
.infosWholeLook button[type="submit"] {
display: block;
margin: auto;
}
/*__ NEWLIFE __*/
.kmlt_sell_yours {
margin-top:1em;
display:flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: center;
font-size: 1.1em;
letter-spacing: 0.01em;
color: #363636;
}
.kmlt_sell_yours:hover {
color: #363636;
}
.kmlt_sell_yours img {
margin-right: 8px;
width: 55px;
}
.kmlt_sell_yours > span:last-child {width:100%;}
.kmlt_sell_yours .kmltbtn {
color: #C9A78B;
border-bottom: 1px dotted#C9A78B;
margin-left: 3px;
}
.kmlt_sell_yours .kmltbtn i {vertical-align: -1px;}
.kmlt_sell_yours .kmltbtn:hover {color: #8C725B;}
/*__ DISPO MAGASINS (AN) __*/
.prodcardDispoMag {
margin-top:10px;
}
.prodcardDispoMag div:first-child {
font-weight:bold;
}
.prodcardDispoMag a i, .dispo i {
vertical-align: -2px;
}
.dispoTitle {font-size:1.4em;color:#251a5d;}
.storeSearchResult {padding: 10px 60px;}
.storeInfoContent {
padding:10px;
text-align:left;
}
.storeInfoContentDiv {
margin:auto;
width:75%;
}
.storeInfoContent {
border-top: 1px solid #c0c0c0;
}
.magPicture {
float:left;
margin:10px 20px 10px 0;
}
.storeName, .dispo {font-weight:bold;}
.storeDist, .storeOpen, .storeClose {
color:#707070;
}
.storeStatus {
width:10px;
height:10px;
border-radius:20px;
display:inline-block;
}
.storeOpen .storeStatus {background-color:green;}
.storeClose .storeStatus {background-color:orange;}
.storeText {
font-weight:bold;
color:#363636;
}
.dispoOK {color:green;}
.dispoKO {color:firebrick;}
/*---- MARCHANDS MARKETPLACE ----*/
#product_lessPrice {
cursor: pointer;
display: flex;
line-height: 1.4em;
align-items: center;
}
#product_lessPrice i {
font-size: 1.5em;
margin-right: 0.25em;
}
#dis_lessprice {
font-size: 13px;
}
#dis_header_lessprice {
width: 100%;
height: 30px;
line-height: 30px;
border-bottom: 1px solid #c0c0c0;
background: url(/images/background_header_lessprice.gif) right center no-repeat;
background-color: #f0eeee;
color: #c30040;
font-weight: bold;
font-size: 1.3em;
text-align: center;
}
#dis_header_close {
position: absolute;
z-index: 10;
top: 0;
right: 0;
width: 35px;
height: 30px;
cursor: pointer;
}
#dis_product_less_price, #retour_lessprice {
margin: auto;
width: 80%;
}
#dis_product_infos {
margin: auto;
}
#dis_product_infos a {color: #c30040;}
#dis_explications_lessprice {
width: 80%;
margin: auto;
}
#dis_titre_less_price {
width: 400px;
height: 21px;
line-height: 21px;
margin: 0 auto 15px auto;
background-color: #c30040;
color: #fff;
font-weight: bold;
font-size: 1.1em;
text-align: center;
}
#dis_lessprice_form {
width: 400px;
margin: auto;
}
#dis_lessprice_form label {
font-size: 1.1em;
font-weight: 600;
}
#dis_form_site_lessprice, #dis_form_shop_lessprice {
width: 100%;
margin-top: 20px;
}
#dis_form_site_lessprice .label, #dis_form_shop_lessprice .label {
float: left;
width: 200px;
height: 25px;
line-height: 25px;
margin-left: 15px;
font-weight: 600;
}
#dis_form_site_lessprice input, #dis_form_shop_lessprice input {
border: 1px solid #c0c0c0;
background-color: #f0eeee;
height: 20px;
width: 150px;
}
.prodcardBase .dis_logo_left {
display: none;
}
.productBigView .shield {
display: none;
}
.prodcardBase .shield {
display: block;
position: absolute;
left: -35px;
top: 88px;
margin: 0;
}
.dis_lessprice_cell {
width: 100%;
height: 25px;
margin: 5px 0;
}
.radio {margin: 0 10px 0 15px;}
#dis_lessprice_boutons {
width: 100%;
height: 50px;
line-height: 45px;
margin-top: 25px;
text-align: center;
border-top: 1px dashed #c0c0c0;
padding-top: 10px;
}
#dis_lessprice_boutons #valider {
margin-left: 15px;
background-color: #707070;
border: none;
color: #fff;
font-weight: 600;
padding: 3px 5px 5px 5px;
cursor: pointer;
}
#dis_lessprice_boutons #annuler {
background-color: #fff;
border: 1px solid #c0c0c0;
color: #707070;
font-weight: 600;
padding: 3px 5px 5px 5px;
cursor: pointer;
}
#dis_retour_ajax {
width: 400px;
height: 100px;
line-height: 100px;
margin: 15px auto 15px auto;
color: #707070;
font-size: 1.3em;
text-align: center;
}
#merchant_list_div {
background: transparent url(/images/overlay.png) repeat top left;
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 100;
}
#merchant_list_close {
float: right;
font-size: 22px;
}
#merchant_list_div_inner {
position: absolute;
top: -600px;
right: 220px;
background-color: #fff;
color: #707070;
width: 763px;
z-index: 150;
margin: auto;
max-height: 500px;
overflow-y: auto;
}
#title_merchant_list {
width: 723px;
height: 30px;
margin: 20px 20px 0 20px;
background-color: #f0eeee;
font: 14px OpenSans, Arial, sans-serif;
color: #363636;
vertical-align: middle;
text-indent: 10px;
}
.info_merchant_list {
display: block;
width: 723px;
margin: 0 20px 10px 20px;
padding: 0 0 10px;
font: 12px OpenSans, Arial, sans-serif;
color: #707070;
border-bottom: 1px dotted #c0c0c0;
}
#logo_merchant_list {
vertical-align: middle;
display: inline-block;
width: 170px;
height: 80px;
line-height: 80px;
text-align: center;
}
#logo_merchant_list img, #logo_merchant_list .flags div, .flags #logo_merchant_list div {
max-width: 170px;
display: inline-block;
}
#text_info_merchant_list {
width: 140px;
height: 80px;
line-height: 18px;
vertical-align: middle;
display: inline-block;
text-align: left;
}
#prix_merchant_list {
width: 145px;
display: inline-block;
vertical-align: middle;
margin: 0 20px 0 0;
}
.prix_merchant_list_content {
width: 145px;
display: inline-block;
line-height: normal;
vertical-align: middle;
}
.prix_merchant_list_content i {
font-size: 14px;
color: #c30040;
}
.prix_merchant_list_details {text-decoration: underline;}
.price_merchant_list {
display: block;
width: 100%;
font: bold 13px OpenSans, Arial, sans-serif;
color: #707070;
}
#size_merchant_list {
width: 100px;
height: 80px;
float: left;
background-color: #f0eeee;
margin: 0 20px;
text-align: center;
}
#size_merchant_list p {
margin: 10px 0;
line-height: 16px;
}
#button_merchant_list {
display: inline-block;
vertical-align: middle;
margin-top: 2%;
}
.info_merchant_left, .prix_merchant_form_right {
display: inline-block;
vertical-align: middle;
width: 49%;
height: 80px;
}
/*
#products_other_merchants_div {
display: none;
margin: 10px auto;
text-align: center;
font-size: 10px;
}
*/
.conditions_partenaires_img,
.conditions_partenaires,
#points_fid {
font-size: 1.2em;
text-align: left;
padding: 1em 3em 0em 3em;
}
.conditions_partenaires h1 {
font: bold 1.1em/1.4em OpenSans, Arial, sans-serif;
text-decoration: underline;
text-align: left;
margin: 1rem 0 0.5rem 0;
}
.produit-part-title {
font: bold 1.6em/1.4em OpenSansCond, Arial, sans-serif;
text-transform: uppercase;
}
/* .title-infos-merchant {
font: bold 1.4em/1.4em OpenSans, Arial, sans-serif;
} */
.rows-avis-content {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 2rem 0;
}
.row-avis-lign {
display: flex;
width: 45%;
margin: 0.3rem 0;
justify-content: space-between;
}
.row-avis-name {
display: flex;
flex-direction: row;
align-items: center;
}
.row-avis-date {
font-style: italic;
}
#popup_alert_parent .conditions_partenaires h1,
#points_fid h1,
#popup_cgv_premium h1 {
margin-left: 0;
}
/*---- DESCRIPTION / PARTAGER ----*/
#productDescription {
color: #707070;
border-top: 1px solid #e6e6e6;
font-size: 16px;
display:flex;
}
#productDescription .product_detailed_infos {
width: 60%;
padding-right: 30px;
}
#productDescription .prodcard_complement {
width: 40%;
}
#productDescription .prodcard_complement:first-child {
width: 100%;
display:flex;
justify-content: space-between;
padding: 1.5em 0;
}
#productDescription .prodcard_complement:first-child > div {
margin: 0;
width:25%;
padding-right:30px;
}
#productDescription .prodcard_complement:first-child > div:not(:first-child) {
border-left: 1px solid #f0eeee;
padding: 0 0 0 30px;
}
.productDescriptionTitle {
font: bold 16px/20px OpenSans, Arial, sans-serif;
text-transform: uppercase;
margin-top: 20px;
color: #363636;
}
.Plus_Produit_Picto {
display: flex;
flex-wrap: wrap;
margin-top: 15px;
text-align: center;
justify-content: space-around;
}
.Plus_Produit_Picto div {
max-width: 100px;
}
.Plus_Produit_Picto div:nth-of-type(even) {
margin: 0 10px;
}
.Plus_Produit_Picto > span {
width: 100%;
max-width: 100%;
text-align: left;
margin: 0 0 15px 0;
}
.Plus_Produit_Picto div span {
display:block;
}
.cat-green {
display: flex;
align-items: center;
}
.cat-green > i {
position: absolute;
font-size: 2em;
transform: translate(-1.1em);
}
.prodcardDetails_subtitle {
float: left;
width: 200px;
font-size: 13px;
color: #363636;
margin: 0;
}
.prodcardDetails_desc {
width: auto;
text-align : justify;
}
.prodcardDetails_content li {list-style-type: none;}
.infoCompo, .infoDimension {
margin: 5px 10px 0 0;
}
#products_info_pointure, #products_info_mannequin {
display: block;
}
.borderButton {
border: 1px solid #363636;
height: 25px;
padding: 4px 10px;
margin: 5px;
display: inline-block;
box-sizing: border-box;
font-size: 11px;
color: #363636;
text-transform: uppercase;
}
.borderButton:hover {
color: #e6e6e6;
background-color: #363636;
}
#size_grid {
z-index: 9999;
display: none;
position: absolute;
width: 900px;
background-color: #fff;
padding: 10px;
left: 50%;
margin-left: -36%;
top: 50px;
border: 1px solid #c0c0c0
}
#fav_to, #add_to, #friend, #friend_B {
margin: 0;
cursor: pointer;
color: #707070;
}
/*---- SHARE LINKS ----*/
.share_links {margin-top:10px;}
.share_links a {
margin-right: 10px;
font-size:25px;
}
/*.share_links a {*/
/*margin-right: 5px;*/
/*font-size: 11px;*/
/*background-color: #707070;*/
/*}*/
/*.share_links a.btn-small i {*/
/*font-size:11px;*/
/*vertical-align: 0;*/
/*}*/
/*---- INFOS COMPLEMENTAIRES ----*/
#products_info_complementaires {
margin-top: 1.5em;
border-top: 1px solid #e6e6e6;
}
#products_info_complementaires > div {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
#products_info_complementaires > div .prodcardOtherInfosTitle {width:80%;margin:auto;font-size: 30px;line-height:40px;}
/*__ COMPLETER LOOK __*/
#productsComp, #productsComp2 {
text-align: center;
margin: 2em auto;
display: inline-block;
width: 49%;
}
#productsComp > div, #productsComp2 > div {
vertical-align: top;
position:relative;
padding: 10px 5%;
margin: 0.5%;
border: 1px solid #e6e6e6;
box-sizing: border-box;
}
#productsComp > div > div, #productsComp2 > div > div {
display: inline-block;
width: 40%;
vertical-align: middle;
text-align: left;
position:relative;
padding: 10px 5px;
box-sizing: border-box;
}
#productsComp > div > div b, #productsComp2 > div > div b{
font: bold 15px/22px OpenSans, Arial, sans-serif;
font-weight: normal;
}
#productsComp > div >div img, #productsComp2 > div >div img{
height: 150px;
}
#productsComp > div > div button, #productsComp2 > div > div button {
margin-top: 10px;
text-transform: uppercase;
width: 75%;
position: relative;
}
#productsComp > div > div button i, #productsComp2 > div > div button i{
font-size: 18px;
position: absolute;
left: 25px;
}
#productsComp > div > div select, #productsComp2 > div > div select{
border: 1px solid #e6e6e6;
padding: 4px;
margin: 5px auto;
width: 100%;
}
#productsComp > div > div:nth-of-type(2), #productsComp > div > div:nth-of-type(5), #productsComp2 > div > div:nth-of-type(2), #productsComp2 > div > div:nth-of-type(5) {
width: 10%;
height: 100%;
border: none;
text-align: center;
}
#productsComp > div > div:nth-of-type(2) i , #productsComp > div > div:nth-of-type(5) i, #productsComp2 > div > div:nth-of-type(2) i , #productsComp2 > div > div:nth-of-type(5) i {
font-size: 30px;
}
.compTotalPrice {
width: 100%!important;
text-align: center!important;
border-top: 1px solid #e6e6e6;
}
.price1 {
font: bold 15px/22px OpenSans, Arial, sans-serif;
color: #707070;
text-transform: uppercase;
}
/*****************************************************
**** @VUE360 (pop_up_image.php)
******************************************************/
.pop_image_content {
width: 650px;
height: 650px;
z-index: 1;
}
.pop_image_content_produit {
position: absolute;
top: 50%;
left: 50%;
margin-left: -300px;
margin-top: -185px;
z-index: 5000;
}
.pop_image_banking {
position: absolute;
top: 630px;
width: 650px;
height: 20px;
}
.pop_image_conteneur_image {
text-align: center;
height: 650px;
width: 650px;
}
.pop_image_product_image {margin-top: 50px;}
.pop_image_titre_image {
text-align: center;
margin-top: 60px;
}
.pop_image_content_vign {width: 760px;}
.pop_image_close {
position: absolute;
margin: auto;
z-index: 10;
top: 5px;
right: 25px;
}
.popthumb {float: left;}
.popthumb, .popthumb3 {
margin: 2px 9px 0 0;
padding:0;
border: 1px solid #c0c0c0;
}
/*****************************************************
**** @CARROUSELS
>> Autres couleurs, modèles enfants
******************************************************/
.couleurs2 {
display: inline-block;
padding: 0;
margin: 20px auto 0;
width: 100%;
}
.couleurs2 .prodcardOtherInfosTitle {
display: inline-block;
width: 100%;
padding: 20px 0;
font: bold 30px OpenSans, Arial, sans-serif;
text-align: center;
text-transform: uppercase;
border-top: 1px solid #e6e6e6;
}
.otherProductsView {
width: 1000px;
height: 120px;
margin: auto;
display: inline-block;
vertical-align:top;
overflow: hidden;
}
.otherProductsView img {margin: 0 40px;}
.prodcardOtherInfosTitle {
padding: 20px 0;
font: bold 30px/40px OpenSans, Arial, sans-serif;
text-align: center;
text-transform: uppercase;
}
#productsContainer, #productsContainer2 {
margin-left: 0;
}
.productNameOver {
color:#c30040;
}
.back, .next, .back2, .next2 {
cursor: pointer;
font-size:32px;
height: 120px;
line-height: 80px;
display: inline-block;
vertical-align: top;
}
.back:hover, .next:hover, .back2:hover, .next2:hover {
background-color: #e6e6e6;
color: #707070;
}
.createdWishlist {
display:inline-block;
margin:10px auto;
padding: 10px 15px;
font-size:1.2em;
border: 1px solid #707070;
border-radius: 3px;
}
.createdWishlist:hover {
border: 1px solid #c30040;
}
/*****************************************************
**** @MODULES COMPLEMENTAIRES
******************************************************/
/*---- POP UP ADD TO WISHLIST ----*/
#overlay_new { position: absolute; width: 100%; top: 0; left: 0; text-align: center; z-index: 1501; background: rgba(0,0,0,0.30); }
#overlay_new * { box-sizing: border-box; }
#overlay_new img { max-width: 100%; margin-bottom: 20px;}
#overlay_new #box_new {
position: relative;
width: 480px;
background-color: #fff;
margin: 0 auto;
top: 0;
overflow-x: hidden;
overflow-y: hidden;
-moz-box-shadow: 0 4px 6px 0 #363636;
-webkit-box-shadow: 0 4px 6px 0 #363636;
-o-box-shadow: 0 4px 6px 0 #363636;
box-shadow: 0 4px 6px 0 #363636;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#363636, Direction=180, Strength=6);
}
#overlay_new #box_new #prodcardWhish, #overlay_new #box_new #inscriptWhish { width: 480px; float: left; }
#overlay_new #box_new #prodcardWhish > span,
#overlay_new #box_new #inscriptWhish > span { display: block; }
#overlay_new #box_new #prodcardWhish > span:first-of-type,
#overlay_new #box_new #inscriptWhish > span:first-of-type { text-align: right; padding: 0.5em 1em;}
#overlay_new #box_new #prodcardWhish > span:last-of-type,
#overlay_new #box_new #inscriptWhish > span:last-of-type {
text-align: center;
padding: 0.5em;
font: 200 1.8em OpenSans, Arial, sans-serif;
}
#overlay_new #box_new .boxClose {
display: block;
font-size: 2.5em;
font-weight: normal;
}
#overlay_new #box_new #prodcardWhish > div { text-align: center; padding: 0 0 1em 0; }
#overlay_new #box_new #prodcardWhish > div > h3 {
text-transform: uppercase;
}
.wish_brandname, .wish_productname {
margin: 0 0 5px;
font-size: 1.2em;
}
.wish_brandname {
text-transform: uppercase;
font-weight: bold;
}
.wish_productname {margin: 0 0 20px;}
#overlay_new #box_new .select-style {
padding: 0.8em 0.2em;
margin: auto;
width: 80%;
border-radius: 3px;
border: 1px solid #c0c0c0;
overflow: hidden;
background: #f0eeee url("/images/arrowDown_grey.gif") no-repeat 95% 50%;
}
#overlay_new #box_new .select-style select {
padding: 5px 8px;
width: 100%;
border: none;
box-shadow: none;
background-color: transparent;
background-image: none;
-webkit-appearance: none;
-moz-appearance: none;
-ms-appearance: none;
appearance: none;
}
#overlay_new #box_new select:focus {
border: none;
outline: none;
box-shadow: none !important;
}
#overlay_new #box_new select::-ms-expand { display:none; }
.button_popup_wishlist > button > span {
display: inline-block;
vertical-align: middle;
text-align: center;
width: 15%;
}
.overlay_center {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
min-height: 100vh;
}
.button_popup_wishlist > button > p {
display: inline-block;
vertical-align: middle;
text-align: center;
width: 85%;
}
.button_popup_wishlist #continue-shopping,
.button_popup_wishlist #just-add,
.button_popup_wishlist #add-see {
padding: 0.8em 0.2em;
width: 80%;
font-size: 1.4em;
text-transform: uppercase;
}
.button_popup_wishlist #continue-shopping {
margin-top: 1em;
}
#overlay_new #popup_alert { font-family: OpenSans, Arial, sans-serif; font-weight: bold; color: #cc0000; }
#overlay_new #popup_transmit {
width: 80%;
margin: auto auto 0.25em auto;
padding: 0.5em 0.25em;
font-size: 1.2em;
}
#overlay_new #popup_transmit #link {
display: block;
text-transform: uppercase;
text-decoration: underline;
cursor: pointer;
}
#overlay_new #loginFormDiv.contentGLogin,
#overlay_new #newAccountForm.contentDLogin {
display: block;
float: none;
margin: auto;
padding: 2.5em 1em;
border: none;
width: 100%;
}
#overlay_new #newAccountForm.contentDLogin { margin-top: 1em; }
#inscriptWhish #creaCompte2 .line {
width: 100%;
text-align: left;
}
#inscriptWhish#creaCompte2 .label { font-size: 0.9em; }
#inscriptWhish #creaCompte2 .unmask { right: 25px; }
/*---- ALERTE TAILLE ----*/
.content_alertSize_popup {
width: 100%;
text-align: center;
}
.content_alertSize_popup .my_size_logo {
display: block;
}
.content_alertSize_popup h2,
.content_alertSize_popup h3 {
font: italic 16px Georgia, Utopia, Charter, serif;
padding: 0;
margin: 2% 0 1% 0;
text-align: center;
color: #000;
}
.content_alertSize_popup h2 {
margin: 8% 0 2% 0;
font-size: 18px;
}
.content_alertSize_popup form select {
width: 70%;
margin: 2% 0;
}
.content_alertSize_popup form > div {
margin-bottom: 4%;
}
.content_alertSize_popup form .longInput {
width: 62.5%;
height: 28px;
}
.content_alertSize_popup form .bt_black {
width: 7%;
vertical-align: middle;
}
/* ajouts 2017.01.30 */
.popup_alert_content #my_size_content {
margin: auto;
width: 80%;
}
.popup_alert_content #my_size_content div {
text-align: center;
margin: 2em auto;
}
.popup_alert_content #my_size_content select {
width: 200px;
padding: 0.5em;
}
.popup_alert_content #my_size_content input[type="email"] {
display: inline-block;
width: 150px;
padding: 0.5em;
}
.popup_alert_content #my_size_content button {
display: inline-block;
margin-left: 0.25em;
}
/*-- POPUP ALERT SIZE ---*/
.my_size_content_form {
display: flex;
flex-direction: column;
max-width: 350px !important;
width: 100% !important;
padding-bottom: 1rem;
}
.my_size_content_form h2 {
margin: 0;
padding: 0;
}
.my_size_content_form .bt_black {
margin-top: 1.5rem;
width: 100%;
}
.my_size_product {
display: flex;
flex-direction: column;
justify-content: center;
padding: 0 2rem;
margin-bottom: 1.5rem;
text-align: center;
}
.my_size_content_form label {
margin: 0.5rem 0;
}
/*---- GUIDE DES TAILLES ----*/
#Guidecontainer {
width:100%;
margin:0 auto;
padding: 0 1em;
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
.womanSizesTitle {
font-size: 3em;
text-transform: uppercase;
font-weight: 100;
}
#topbar {
width:100%;
text-align: left;
}
.titrePage {
font-size: 30px;
font-weight: lighter;
color: #212121;
margin-top:20px;
}
.texteIntro {
font-size: 14px;
color:#707070;
}
.navbar{
width:100%;
display: flex;
justify-content: space-between;
}
.navbar > div {
padding: 1em;
background: #212121;
}
.navbar > div > a {
color: #f0eeee;
}
#size_femme, #size_homme, #size_enfant, #size_special {
display: flex;
flex-wrap: wrap;
margin-top: 2em;
width: 50%;
justify-content: center;
text-align: center;
box-sizing: border-box;
}
#size_femme, #size_enfant {
border-right: 1px solid #c0c0c0;
}
#en-cours_femme a, #en-cours_homme a , #en-cours_enfant a {
color:#212121;
}
#en-cours_femme, #en-cours_homme, #en-cours_enfant {
background-color: #f0eeee;
}
.belt_size {
width: 100%;
text-align: center;
}
.texteMenu {
font-size: 16px;
font-family: 'OpenSansCond', sans-serif;
font-weight: bold;
color:#212121;
text-decoration:none;
cursor: pointer;
}
.imagesGuide {
vertical-align:top;
width: 208px;
}
.titreGuide {
width: 100%;
}
.texteGuide {
flex: 1;
font-size: 14px;
display: flex;
flex-wrap: wrap;
align-items: stretch;
margin-left: 2em;
}
.texteGuideContainer {
display: flex;
flex-wrap: wrap;
margin: 2em auto;
text-align: left;
}
.titreGuide, .titreGuide p {
font-size: 18px;
font-weight: bold;
color: #212121;
margin-top:20px;
}
.texteGuide,.texteGuideRed {
font-size: 14px;
}
.texteGuideRed {
color:#ff6255;
font-weight: bold;
}
.SizeTable {
width:100%;
}
.SizeTable table {
padding-left:5px;
text-transform:uppercase;
font-size: 12px;
}
.SizeTable tr {
line-height: 4em;
}
.SizeTable tr:nth-of-type(even) {
background-color: #f0eeee;
}
.SizeTable th {
width:25%;
padding-left:5px;
text-transform:uppercase;
font-size: 12px;
text-align:left;
}
.SizeTable td {
width:7%;
text-align:center;
font-size: 12px;
}
.tdblack {
font-weight: bold;
}
.texteTableauGuide, .texteTableauGuideBlanc {
text-transform:uppercase;
padding-left:5px;
font-size: 12px;
}
.titreTableau {
font-size: 14px;
font-weight: bold;
color: #212121;
margin-top: 2em;
}
.texteTableauGuideBlanc {color:#fff;}
/*--- NEW SIZE GUIDE ---*/
.sizeGrid2::-webkit-scrollbar-track, .sizeGrid4::-webkit-scrollbar-track {
background-color: #c0c0c0;
}
.sizeGrid2::-webkit-scrollbar, .sizeGrid4::-webkit-scrollbar {
width: 6px;
background-color: #c0c0c0;
}
.sizeGrid2::-webkit-scrollbar-thumb, .sizeGrid4::-webkit-scrollbar-thumb {background-color: #212121;}
.sizeGrid2 {
font-family: OpenSans;
font-size: 1.4em;
width: 400px;
margin: auto;
display: grid;
grid-template-columns: repeat(2, 1fr);
row-gap: 0px;
grid-auto-rows: minmax(30px, auto);
max-height:400px;
overflow-y:auto;
border: 1px solid #707070;
}
.boxTitle {
font-size: 2em;
font-weight: 100;
margin: 1.5em auto 0.5em auto;
width: 100%;
}
.box2 {
position: sticky;
top: 0;
display: grid;
grid-template-columns: repeat(2, 1fr);
row-gap: 5px;
grid-auto-rows: minmax(30px, auto);
grid-column-start: 1;
grid-column-end: 3;
align-self: start;
}
.sizeGrid3 {
font-family: OpenSans;
font-size: 1.4em;
width: 400px;
margin: auto;
display: grid;
grid-template-columns: repeat(3, 1fr);
row-gap: 0px;
grid-auto-rows: minmax(30px, auto);
max-height:400px;
overflow-y:auto;
border: 1px solid #707070;
}
.box3 {
position: sticky;
top: 0;
display: grid;
grid-template-columns: repeat(3, 1fr);
row-gap: 5px;
grid-auto-rows: minmax(30px, auto);
grid-column-start: 1;
grid-column-end: 4;
align-self: start;
}
.sizeGrid4 {
font-family: OpenSans;
font-size: 1.4em;
width: 400px;
margin: auto;
display: grid;
grid-template-columns: repeat(4, 1fr);
row-gap: 0px;
grid-auto-rows: minmax(30px, auto);
max-height:400px;
overflow-y:auto;
border: 1px solid #707070;
}
.box4 {
position: sticky;
top: 0;
display: grid;
grid-template-columns: repeat(4, 1fr);
row-gap: 5px;
grid-auto-rows: minmax(30px, auto);
grid-column-start: 1;
grid-column-end: 5;
align-self: start;
}
.sizeGrid5 {
font-family: OpenSans;
font-size: 1.4em;
width: 450px;
margin: auto;
display: grid;
grid-template-columns: repeat(5, 1fr);
row-gap: 0px;
grid-auto-rows: minmax(30px, auto);
max-height:400px;
overflow-y:auto;
border: 1px solid #707070;
}
.box5 {
position: sticky;
top: 0;
display: grid;
grid-template-columns: repeat(5, 1fr);
row-gap: 5px;
grid-auto-rows: minmax(30px, auto);
grid-column-start: 1;
grid-column-end: 6;
align-self: start;
}
.sizeGrid2 span, .sizeGrid3 span, .sizeGrid4 span, .sizeGrid5 span {
padding: 0.5em;
text-align: center;
}
.sizeGrid2 > div span:nth-of-type(-n+2) {
color: #212121;
background-color: #c0c0c0;
}
.sizeGrid3 > div span:nth-of-type(-n+3) {
color: #212121;
background-color: #c0c0c0;
}
.sizeGrid4 > div span:nth-of-type(-n+4) {
color: #212121;
background-color: #c0c0c0;
}
.sizeGrid5 > div span:nth-of-type(-n+5) {
color: #212121;
background-color: #c0c0c0;
}
.sizeGrid4 > div span:nth-of-type(-n+4) {
color: #212121;
background-color: #c0c0c0;
}
.sizeGrid2 span:nth-of-type(-n+2), .sizeGrid2 span:nth-of-type(n+5):nth-of-type(-n+6), .sizeGrid2 span:nth-of-type(n+9):nth-of-type(-n+10), .sizeGrid2 span:nth-of-type(n+13):nth-of-type(-n+14), .sizeGrid2 span:nth-of-type(n+17):nth-of-type(-n+18), .sizeGrid2 span:nth-of-type(n+21):nth-of-type(-n+22), .sizeGrid2 span:nth-of-type(n+25):nth-of-type(-n+26), .sizeGrid2 span:nth-of-type(n+29):nth-of-type(-n+30), .sizeGrid2 span:nth-of-type(n+33):nth-of-type(-n+34), .sizeGrid2 span:nth-of-type(n+37):nth-of-type(-n+38), .sizeGrid2 span:nth-of-type(n+41):nth-of-type(-n+42), .sizeGrid2 span:nth-of-type(n+45):nth-of-type(-n+46), .sizeGrid2 span:nth-of-type(n+49):nth-of-type(-n+50), .sizeGrid2 span:nth-of-type(n+53):nth-of-type(-n+54) {
background-color: #f0eeee;
}
.sizeGrid3 span:nth-of-type(-n+3), .sizeGrid3 span:nth-of-type(n+7):nth-of-type(-n+9), .sizeGrid3 span:nth-of-type(n+13):nth-of-type(-n+15), .sizeGrid3 span:nth-of-type(n+19):nth-of-type(-n+21), .sizeGrid3 span:nth-of-type(n+25):nth-of-type(-n+27) {
background-color: #f0eeee;
}
.sizeGrid4 span:nth-of-type(-n+4), .sizeGrid4 span:nth-of-type(n+9):nth-of-type(-n+12), .sizeGrid4 span:nth-of-type(n+17):nth-of-type(-n+20), .sizeGrid4 span:nth-of-type(n+25):nth-of-type(-n+28), .sizeGrid4 span:nth-of-type(n+33):nth-of-type(-n+36), .sizeGrid4 span:nth-of-type(n+41):nth-of-type(-n+44), .sizeGrid4 span:nth-of-type(n+49):nth-of-type(-n+52), .sizeGrid4 span:nth-of-type(n+57):nth-of-type(-n+60), .sizeGrid4 span:nth-of-type(n+65):nth-of-type(-n+68), .sizeGrid4 span:nth-of-type(n+73):nth-of-type(-n+76), .sizeGrid4 span:nth-of-type(n+81):nth-of-type(-n+84), .sizeGrid4 span:nth-of-type(n+89):nth-of-type(-n+92) {
background-color: #f0eeee;
}
.sizeGrid5 span:nth-of-type(-n+5), .sizeGrid5 span:nth-of-type(n+11):nth-of-type(-n+15), .sizeGrid5 span:nth-of-type(n+21):nth-of-type(-n+25) {
background-color: #f0eeee;
}
/*--- END NEW SIZE GUIDE ---*/
/*---- ENVOYER A UN AMI (my_friend.php) ----*/
.myfriend_element_bas_gauche {
position: absolute;
bottom: 8px;
left: 8px;
}
.myfriend_logo {
position: absolute;
bottom: 8px;
right: 8px;
}
div.myfriend_logo img, div.myfriend_logo .flags div, .flags div.myfriend_logo div {
width: 200px;
}
.myfriend_h2 {
background: url(/images/ico_cotes.jpg) no-repeat;
padding-left: 35px;
line-height: 30px;
font-size: 10px;
}
.myfriend_contener {
position: relative;
width:770px;
margin: auto;
}
.myfriend_text {
position: relative;
border: 8px solid #c30040;
width: 550px;
height: 550px;
margin: 0 auto 0 150px;
padding-left: 40px;
text-align: left;
}
.myfriend_cercle {
position: absolute;
z-index: 5;
height: 196px;
min-height: 196px;
width: 196px;
top: 35px;
left: 10px;
background: url(/images/cercle.png) top left no-repeat;
}
.my_friend_form {
position: relative;
margin: 0 0 0 40px;
width: 400px;
height: auto;
line-height: 22px;
}
.myfriend_submit {
width: 100%;
font: italic normal 21px Georgia, Utopia, Charter, serif;
text-align: center;
padding: 40px;
box-sizing:border-box;
}
#friend_name, #friend_email, #my_friend_area, #me_name, #me_email {
float: left;
width: 400px;
}
#friend_name, #friend_email {margin-bottom: 5px;}
#my_friend_area, #me_name {margin-bottom: 8px;}
#me_email {margin-bottom: 15px;}
.my_friend_decal {
margin-left: 20px;
padding: 0;
border: 1px solid #c0c0c0;
}
#my_friend_decal_ok {
clear: both;
width: 300px;
margin: 0 0 0 20px;
}
#friend_readonly {
position: absolute;
left: 250px;
top: 210px;
}
.my_friend_readonly {
padding: 0;
border: 1px solid #c0c0c0;
}
.my_friend_form textarea {
float: left;
height: 129px;
width: 215px;
padding: 0;
border: 1px solid #c0c0c0;
}
.myfriend_product_name {
width: 130px;
margin-top: 50px;
margin-left: 8px;
color: #c30040;
}
div.myfriend_cercle img, div.myfriend_cercle .flags div, .flags div.myfriend_cercle div {
margin: 38px 0 0;
}
.myfriend_plus {
color: #c30040;
font-weight: bold;
font-size: 16px;
}
.ref_produit {
display:flex;
justify-content:space-between;
width:55%;
margin:0;
color: #7E7E7E;
font-size: 11px;
}
/*PHOTOS COMPLEMENTAIRES CAROUSEL*/
.carousel_slider img {
max-width: 250px;
margin: 0 3px;
}
/* OTHER COLORS CAROUSEL*/
#droite .productBigView #other_color_prodcard .home_carousel {
margin: 0;
}
#other_color_prodcard {
width: 100%;
position: relative;
overflow: hidden;
}
#other_color_prodcard .prodcardOtherInfosTitle {
padding: 20px 0 30px 0;
font: bold 16px / 20px OpenSans, Arial, sans-serif;
text-align: left;
text-transform: uppercase;
}
#other_color_prodcard .home_carousel {
width: 100%;
min-height: 150px;
padding: 0 30px;
}
#other_color_prodcard .home_carousel .suiv {
right: 0;
top: 45px;
background-color: rgba(255,255,255,0.5);
font-size: 30px;
}
#other_color_prodcard .home_carousel .preced {
left: 0;
top: 45px;
background-color: rgba(255,255,255,0.5);
font-size: 30px;
}
#other_color_prodcard img {
width: 120px;
}
#other_color_prodcard .carousel div {
display: flex;
align-items: center;
min-width: 120px;
padding: 0;
margin-right: 20px;
font: 1.3em OpenSans, Arial, sans-serif;
}
.sp_popup input[type="text"],.sp_popup input[type="tel"],.sp_popup input[type="date"]
{
height: 25px;
padding: 0 1em;
font-size: 1em;
border-radius: 3px;
-webkit-appearance: none;
background-color: #FFF;
border: 1px solid #333333;
}
.sp_popup_content .chk-postcode { width: 80px; }
.sp_popup_content #chk-shipping_relais_pay > img { margin-right: 2em; margin-left: 2em; width: 80px; }
.sp_popup_content #chk-shipping_relais_pay { text-align: center; }
.sp_popup_content #chk-shipping_relais_pay * { display:inline-block; vertical-align: middle; }
.sp_popup_content .relais_horaires_main { margin-top: 10px; }
.sp_popup_content .relais_horaires_main > div { margin: 5px 0;font-size: 12px; }
.sp_popup_content .relais_horaires_name {
height: auto;
margin: 0 auto;
font-weight: bold;
color: #c30040;
vertical-align: top;
}
.sp_popup_content #chk-shipping_relais_pay > img {
margin-right: 2em;
margin-left: 2em;
width: 80px;
}
/*
#shippingAddressWindowContent {
text-align: center;
font-size: 1.5em;
}
*/
#shippingAddressWindowContent > span {
display: block;
}
#securepayment_title_boxe {
width: 100%;
height: 42px;
color: #fff;
text-align: center;
margin-bottom: 20px;
font-size: 14px;
font-weight: bold;
line-height: 42px;
text-shadow: 0 -1px 1px #c30040;
background-color: #c30040;
text-transform: uppercase;
}
.map_ib_content {
text-align: left;
}
.map_ib_horaire {
margin-top: 10px;
overflow: hidden;
}
.relais_horaires_day {
display: inline-block;
width: 35%;
font-family: OpenSansCond, Arial, sans-serif;
font-weight: bold;
}
.relais-post { text-align: center; font-size: 13px; margin-bottom: 2em; }
.relais-post > div,.relais-post > input {
display: inline;
}
.relais-post > input { font-size: 13px; padding: 0.5em 0.25em; margin-left: 1em; text-align: center; }
.map_list_ul {
list-style-type: none;
padding:0;
}
.map_list_li {
display: block;
margin: 0;
padding: 1em 0 1em 1em;
text-align: left;
border-bottom: 1px solid #c0c0c0;
width: 100%;
}
.map_list_name {
display: block;
margin: 2px 0;
padding: 0;
font-family: OpenSans, Arial, sans-serif;
font-weight: bold;
}
.map_list_name > span {color: #c30040;}
.map_list_addr {
display: block;
margin: 0.5em 0 1em 0;
padding: 0;
text-transform: lowercase;
}
.map_ib_button {
text-align: center;
font-size: 11px;
font-weight: bold;
text-transform: uppercase;
}
/*.map_list_button, .map_list_button_select {text-align: center;}*/
#listContent .map_ib_horaire,
.relais_horaires_main { display: none; }
.relais_horaires_day {
display: inline-block;
width: 20%;
}
.map_list_icon {
float: left;
padding-right: 5px;
}
.map_ib_horaire_tab {
font-size: 10px;
width: 100%;
border-collapse: collapse;
border: 0 none;
}
.map_ib_horaire_tab td {
border-collapse: collapse;
border: 0 none;
}
#shipping_relais_pay {
text-align: center;
}
#shipping_relais_pay > img[src*="ico"], .flags #shipping_relais_pay > div[src*="ico"] {
margin: 15px 0 0 15px;
}
#shipping_relais_pay > span {
display: block;
}
#shipping_relais_pay > span strong {
font-size: 12px !important;
color: #c30040;
}
.return_button {
margin-top: 10px;
margin-left: 740px;
}
map_list_button {
color: #0a9100;
}
@charset "utf-8";
/*****************************************************
**** SOMMAIRE **** GLOBAL
@GLOBAL
- RESET&HTML -
- CLASSES GENERIQUES -
- BOUTONS -
- LIENS -
@HEADER
@REFERENCEMENT (PAVÉ)
@FOOTER
- texte referencement -
@HOME
- TITRES SECTIONS -
- BLOCS -
- TITRES BLOCS -
- MANEGES -
- default -
- marketing -
@SLIDER
@SLIDER CONTENT
- SETUP -
- CONTENT -
_ OPE _
@SLIDER OLD
- NEW SLIDER -
- OLD SLIDER -
- OPERATIONS -
@CONTENT
- SideBar -
- SBANS -
- CONTENT -
- témoignages -
@CONTACT
- Aide -
@RECHERCHE
@LOGIN
- TEST AB login -
@PAIEMENT
- kiala -
- mondial relay -
@PANIER
- MEILLEURES VENTES -
@NEWSLETTER
@COMPTE
- Activation premium -
- Suppression de moyens de paiement -
- carnet d'adresses -
@MARQUES
@LISTING
- Menu de gauche -
- JSCROLLPANE -
- filtres avancés -
- Dropdown Choix du tri -
- JQUERY SLIDER RANGE -
- Droite -
@PRODCARD
@POPUPS
- POPUP IMAGE -
- POPUP TEMOIGNAGES -
- GUIDE DES TAILLES -
@CUSTOM SELECT
@PRODUITS COMPLEMENTAIRES
@RESULTATS
@CUSTOM
@DISPLAY
@PAGE BLANK
@MY SIZE
@WIDGET
@PARRAINAGE
- PAGE + POPUP -
@ALERTE NOUVEAUTES
@TEMOIGNAGES
@LANG MENU
@CALENDAR
@netPromoterScore
- BTN -
@POINTS_INFO
@MY_CHECK
@MY_FRIEND
@CAROUSEL
@
@JQUERY SLIDER RANGE
@MAGIC ZOOM
@CHECKOUT
@PAGE NEWSLETTER
@FAQ NEW
@PAGE PARRAINAGE
@BAN
@VALID FORM
@POPUP WISHLIST PRODCARD
@CARTE CADEAU
@PAGE CODE REDUC
@PAGE ETUDIANTS
@ZOOM PRODUITS NEW
@TICKET VIEW
@CHECKOUT NEW
@HACK SEO
@PRESSE
@PAGE MERCI MAILS SHARK
@PROGRESS STATUS
@CGV
@PREMIUM
@RECRUTEMENT
@AFFILIES
@PAGE CODES PARTENAIRES
@ABOUT
*****************************************************/
/*****************************************************
**** @GLOBAL
******************************************************/
/*---- RESET&HTML ----*/
html {
font-size: 100%;
scroll-behavior: smooth;
}
body {
font-family: 'OpenSans', sans-serif;
font-size: 62.5%;
color: var(--noir);
margin:0;
padding:0;
}
/* Oldie Css * Hack Ie7,Ie8 & Supérieur */
.ie7 #contain-pop{z-index: 3000;}
.ie7 #contain-pop .btn_to_close{display:none; }
.ie7 #content #form-vourcher .popup-vourcher, .ie7 #content #form-vourcher .valid-vourcher{
margin:-5px 0 5px;
padding-top:0;
padding-bottom:30px;
line-height:10px;
}
.ie7 #content #form-vourcher .popup-vourcher i, .ie7 #content #form-vourcher .valid-vourcher i{position:relative ;top:-2px;left:-63px ; }
/*----- JAVASCRIPT INACTIF -----*/
.noJS {
position:absolute;
width: 700px;
left: 50%;
top: 110px;
margin: 0 0 0 -350px;
padding: 5px;
background-color:#fff;
text-align:center;
color:#e16207;
font-size:14px;
border: 1px solid #c0c0c0;
z-index: 300;
}
.noJS a {
font-size:12px;
}
/*----- STRUCTURE et BALISES HTML -----*/
li {margin-left: 1em;}
img {
border: none;
max-width: 100%;
}
input {
font-family: 'Work Sans', sans-serif;
margin: 0;
padding: 0;
vertical-align: middle;
outline: none;
}
div {
box-sizing: border-box;
}
#parent {
position: relative;
width: 100%;
margin-left: auto;
margin-right: auto;
padding: 0;
background-color: #fff;
}
.vertical-cale {
height:100%;
width: 0;
display: inline-block;
vertical-align: middle;
}
button p {
margin: 0;
display: inline-block;
}
.thumb {
float: left;
margin: 0;
padding: 0;
}
.alert {
font-size: 13px;
color: #5d5d5d;
margin: 0;
text-align: center;
padding: 10px 0 10px 0;
}
.alert a {margin-right:10px;}
.alertSuccess {
font-size: 11px;
color: #0a9100;
margin: 0;
padding: 0;
text-align: center;
}
.forwardSuccess {
font-size: 14px;
font-weight: bold;
color: #0a9100;
margin: 10px;
padding: 20px 0 0 200px;
height: 200px;
background-image: url(/images/ico_bg_forward.gif);
background-repeat: no-repeat;
background-position: left top;
}
.noShoes {
font-size: 14px;
color: #FF0000;
margin: 40px 10px 10px 10px;
padding: 3px;
text-align: center;
}
/*---- CLASSES GENERIQUES ----*/
.clr, .fin-div, .clear {clear:both;}
.div-fin {
border-bottom: 1px solid #d9d4e0;
margin: 0;
height: 10px;
clear: both;
}
.hidden {display:none;}
/*---- BOUTONS ----*/
.btn {
padding: 0.4em 1em;
margin: 0;
border: none;
font: 1rem 'OpenSans', sans-serif;
color: #fff;
text-align: center;
cursor: pointer;
background-color: var(--orange);
transition-property: all;
transition-duration: 0.5s;
}
.btn:visited {color : var(--orange);}
.btn:hover,.btn:focus,.btn.disabled,.btn[disabled] {
color: #fff;
background-color: var(--rouge);
}
.btn:hover,.btn:focus {
color: #fff;
text-decoration: none;
}
.btn:focus {
outline: thin dotted #333;
outline: 5px auto -webkit-focus-ring-color;
outline-offset: -2px;
}
.btn-large {
padding: 11px 19px 11px 15px;
font-size: 15px;
}
.btn-large [class^="icon-"],.btn-large [class*=" icon-"] {margin: 4px 5px 0 0;}
.btn-small {
padding: 0.25em 1em;
font-size: 15px;
}
.btn-small [class^="icon-"],
.btn-small [class*=" icon-"] {
margin: 0 5px 0 -10px;
font-size: 13px;
}
.btn-mini [class^="icon-"],.btn-mini [class*=" icon-"] {margin: 0 10px 0 5px;}
.btn-mini {
padding: 1em;
font-size: 12px;
text-transform: initial;
}
.centre {
text-align: center;
position:absolute;
left: 40%;
top: 30%;
}
.btn.active,
.btn:active {
background-image: none;
outline: 0;
-webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(0, 0, 0, 0.05);
}
.btn.disabled,
.btn[disabled] {
cursor: default;
background-image: none;
opacity: 0.65;
filter: alpha(opacity=65);
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
#panierVide a.btn, #panierVide a.btn:hover {
color: #f8b333!important;
text-decoration: none;
}
.panier_bottom_content {
display: none;
}
.panier_container {
margin-bottom: 7em;
width: 90%;
margin-top: 1rem;
}
/*---- LIENS ----*/
a {text-decoration:none;}
a:link, a:visited {color:#000000;}
a:hover, a:active {color: var(--orange);}
/* texte annonce opéé petit bandeau en haut du site */
#header_services {
display: block;
position: relative;
font-size: 1.0em;
overflow: hidden;
text-transform: uppercase;
text-align: center;
color: #ffffff;
padding: .25em 0;
height: 30px;
}
#header_services > div {
display: inline-block;
position: relative;
top: 110%;
text-align: center;
margin: auto;
vertical-align: middle;
letter-spacing: .1em;
transition: top .3s ease-out .05s;
}
.searchContainer {
width: 400px;
margin: 0 1.5%;
background-color: #fff;
border: 1px solid #d9d4e0;
display: inline-block;
}
.headerSearch {
flex-grow: 1;
display: flex;
align-items: center;
max-width: 300px;
margin: 0 0 20px;
}
.headerSearchBar {
line-height: 40px;
box-sizing: border-box;
background-color: #fff;
vertical-align: middle;
display: inline-block;
width: 360px;
border: 1px solid #363636;
border-radius: 4px;
flex-grow: 1;
height: 35px;
padding: 0 3px;
font-size: 14px;
background-color: #fff;
}
.headerSearch i {
color: #707070;
}
#submit_search {
color: #d9d4e0;
background: none;
border: none;
vertical-align: middle;
box-sizing: border-box;
display: inline-block;
width: 38px;
}
#submit_search i {font-size: 26px;}
/* Autocomplete */
.AutoCompleteDivListeStyle {
font-size: 13px;
font-family: arial,sans-serif;
word-wrap: break-word;
color: black;
margin-top: 6px;
margin-left: 0px;
margin-right: 0px;
padding: 0;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-user-select: none;
user-select: none;
cursor: none;
width: 100%;
box-sizing: border-box;
border-left: 1px solid #d9d4e0;
border-right: 1px solid #d9d4e0;
border-bottom: 1px solid #d9d4e0;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}
.AutoCompleteDiv {
display: block;
overflow: hidden;
background-color: white;
box-sizing: border-box;
color: var(--orange);
}
.AutoCompleteDivAct {
background-color: #d9d4e0! important;
color: white;
}
.AutoCompleteDiv, .AutoCompleteDivAct {
display: block;
overflow: hidden;
width: 100%;
box-sizing: border-box;
}
.AutoCompleteDiv span, .AutoCompleteDivAct span {
display: block;
padding: 6px 5px 6px;
width: 100%;
border-top: 1px solid #e6e6e6;
box-sizing: border-box;
}
/*--- HEADER ---*/
/*****************************************************
*** @REFERENCEMENT (PAVÉ)
*****************************************************/
#footerInfos {
margin: 0;
padding: 0;
width: 100%;
color: #707070;
font-size: 10px;
text-align: left;
}
#footerInfos > div {
margin: 0 0 5px;
text-align: justify;
}
#footerInfos p {margin: 0 0 5px;}
#footerInfos h1, #footerInfos h2, #footerInfos h3, #footerInfos .h1div, #footerInfos .h2div, #footerInfos .h3div {
margin: 5px auto 3px;
font: 11px 'Work Sans', Arial, sans-serif;
font-weight: normal;
text-transform: uppercase;
color: #707070;
text-decoration: underline;
display: inline;
}
#footerInfos h1, #footerInfos .h1div {
display: block;
padding: 1% 0;
font: bold 14px 'Work Sans', Arial, sans-serif;
text-decoration: none;
}
#footerInfos a {
text-decoration: underline;
}
/*----- SBANS -----*/
.corner + #sban {display:none;}
#sban {
min-height: 60px;
display: flex;
font-weight: bold;
justify-content: center;
align-items: center;
position: relative;
box-sizing: border-box;
border-bottom: 1px solid #e6e6e6;
}
#sban .sbanTitle {
display:inline-block;
width:280px;
vertical-align:middle;
text-align:center;
font: 30px 'Work Sans', Arial, sans-serif;
}
#sban > div {
font-size: 3em;
height: 60px;
}
#sban h1 {
font-size: 16px;
letter-spacing: 1px;
margin: 0;
padding: 0;
}
.confidence_timer {
position: absolute;
top: 40px;
left: 35px;
font: italic 20px Georgia, serif;
text-align: center;
background-color: #fff;
}
.sban_confidence_timer_numbers {margin-top: 10px;}
.sban_confidence_timer_numbers span {
margin: 0;
display: inline-block;
width: 25px;
height: 40px;
font: normal normal 32px/40px Verdana, Arial, Helvetica, sans-serif;
background-color: black;
color: white;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
text-align: center;
}
.sban_confidence_timer_numbers span.first { margin-left: 5px; }
.sban_confidence_timer_textes span {
display: inline-block;
font-size: 12px;
color: var(--orange);
width: 60px;
}
.sban_confidence_timer_texte_fin {
font: normal normal 25px 'Work Sans', Arial, sans-serif;
text-transform: uppercase;
color: var(--orange);
}
#sban h1 {
font-size: 16px;
letter-spacing: 1px;
margin: 0;
padding: 0;
}
a.sban-btn:link, button:visited {
color:#fff;
text-decoration:none;
float:left;
overflow:hidden;
margin: 0 4px;
}
a.sban-btn {
color: #fff;
font: 14px/1px 'Work Sans',Arial,sans-serif;
text-align: center;
background:#5d5d5d;
padding:12px 5px;
margin-top:0px;
width: 120px;
height: 6px;
-webkit-transition: background-color 0.2s, margin-top 0.3s, height 0.3s; /* Saf3.2+, Chrome */
-moz-transition: background-color 0.2s, margin-top 0.3s, height 0.3s; /* FF4+ */
-o-transition: background-color 0.2s, margin-top 0.3s, height 0.3s; /* Opera 10.5+ */
transition: background-color 0.2s, margin-top 0.3s, height 0.3s;
}
a.sban-btn:hover {
color: #000;
background:#fff;
margin-top:-5px;
height: 50px;
}
/*---- SBAN VENTES FLASH ----*/
#sban .sbanFlash {
position: absolute;
color: #fff;
top:0;
left:0;
width:50%;
display:flex;
flex-direction:column;
justify-content: center;
align-items: center;
}
.sbanFlash_title {
font: 200 4em 'Work Sans', Arial, sans-serif;
letter-spacing: 5px;
margin-bottom: 10px;
}
.sbanFlash_infos {
font-size: 1.5em;
}
.sbanFlash_code {
color: #363636;
background-color: #fff;
padding: 5px;
margin-left: 8px;
font-weight: bold;
text-transform: initial;
}
/*---- CONTENT ----*/
#contentTop {
position: relative;
width: 100%;
max-width: 1200px;
line-height: 7em;
padding: 0;
margin: auto;
}
#contentTop h1 {
font-size: 2.6em;
line-height: 2em;
}
#contentTopValid {
position: relative;
width: 90%;
height: 75px;
margin: 10px 0 0 0;
padding: 0;
background-image: url(/images/h1_bg.gif);
background-repeat: no-repeat;
background-position: center top;
}
#contentTopValid h1 {
font-size: 16px;
margin: 0 0 0 10px;
padding: 10px 0 0 0;
text-align: left;
color: #363636;
}
#contentTop2 {
margin: 20px auto 0 auto;
width:752px;
border-bottom:1px solid #888;
}
#contentTop2 h1 {
font-size: 16px;
margin: 0 0 0 10px;
padding: 10px 0 0 0;
text-align: left;
color: #363636;
}
#contentBottom2 {
margin:0px auto 20px auto;
width:752px;
border-top:1px solid #888;
}
#contentBottom {
position: relative;
width: 100%;
height: 10px;
margin: 0 0 10px 0;
padding: 0;
border-top: 1px solid #C0C0C0;
clear:both;
}
#content {
display: flex;
flex: 1;
flex-flow: wrap;
justify-content: space-between;
max-width: 1200px;
margin: 4em auto 4em auto;
padding: 0;
background-color: #fff;
}
.contentIdentite{
margin: 0 auto 20px auto;
font-size:13px;
}
.contentIdentite p{
font-size:16px;
}
#contentHome {
float: left;
width: 100%;
margin: 0;
padding: 0;
background-color: #fff;
}
#content h1 {
font-size: 24px;
}
#content h2 {
font-size: 20px;
font-weight:normal;
}
#content h3 {
font-size: 16px;
font-weight: normal;
}
#content h4 {
font-size: 14px;
font-weight: normal;
}
#content form {
margin: 0;
padding: 0;
}
#content p{
text-align: justify;
}
#content hr {
border: none;
border-bottom: 1px solid #363636;
height: 1px;
background-color: #363636;
margin: 10px 0 10px 0;
padding: 0;
display:block;
margin: 0;
}
.contentG {
float: left;
width: 370px;
margin: 0;
padding: 0;
text-align: justify;
}
#contentGuideMenu {
float: left;
width: 350px;
margin: 10px 0 0 20px;
padding: 0 5px 0 5px;
}
#contentGuideMenu ul{
margin: 10px 0 10px 0;
padding: 0;
}
#contentGuideMenu li{
cursor: pointer;
margin: 0 0 0 25px;
padding: 0;
}
#contentGuideMenu li:hover{
text-decoration: underline;
}
#contentGuide {
float: left;
width: 540px;
margin: 0 0 0 10px;
padding: 0 0 3px 0;
font-size: 12px;
}
.gregDIV {
margin-bottom: 10px;
}
.contentD {
float: left;
width: 380px;
margin: 0;
padding: 0;
text-align: justify;
}
.contentHomeD {
width: 100%;
margin: 0;
padding: 0;
text-align: justify;
}
.contentD_secure{
float: left;
width: 455px;
margin: 30px 0 5px 0;
padding: 0 10px 3px 10px;
text-align: left;
}
.contentG_secure{
float: left;
width: 455px;
margin: 30px 0 5px 0;
padding: 0 10px 3px 10px;
text-align: left;
}
.contentCentre {
width: 100%;
margin: auto;
padding: 0;
}
#head + .contentCentre {
display: flex;
}
#content .contentCentre h2{
padding: 10px 100px 0 100px;
color: #363636;
background: none;
text-align:center;
width: 755px;
}
#checkGauche{
float: left;
width: 380px;
height: auto;
}
#checkDroite{
float: left;
width: 380px;
height: auto;
}
.infosServices{
position: relative;
left: 70px;
width: 250px;
font-size: 12px;
margin: 40px 10px 10px 10px;
}
.infosCheck{
float: left;
width: 250px;
height: auto;
text-align: center;
}
.confirmation_text {
position: relative;
width: 290px;
left: 70px;
top: 10px;
font-size: 14px;
font-weight: bold;
color: var(--orange);
}
a.facture:active, a.facture:link, a.facture:visited{font-weight: bold;}
a.facture:active, a.facture:link, a.facture:visited, a.facture.petit:link, a.facture.petit:active, a.facture:hover, a.facture.red:link, a.facture.red:active, a.facture.prodcard_onglet, a.facture.blanc:link, a.facture.blanc:active {
color: var(--orange);
font-size:14px;
text-decoration: underline;
}
a.facture:hover{text-decoration: none;}
a.infosLink:active, a.infosLink:link, a.infosLink:visited{
color: #997835;
font-size: 10px;
text-decoration: none;
}
a.infosLink:hover{
text-decoration: underline;
}
.parag{
position: relative;
top: 2px;
margin: 20px auto auto auto;
left: 50px;
}
.titre_categorie {
background: url("/images/letter_bg.gif") no-repeat scroll center center rgba(0, 0, 0, 0);
color: var(--orange);
font-size: 11px;
text-align: center;
}
/*---- témoignages ----*/
.sign {
width: 100%;
margin: auto;
font-size: 13px;
}
/*****************************************************
**** @CONTACT
******************************************************/
.ticket {
width: 140px;
float: left;
margin: 0;
padding: 5px 0 5px 0;
text-align: center;
border-top: 1px dotted #c0c0c0;
border-left: 1px dotted #c0c0c0;
}
.ticketNumpage {
border-top: 1px dotted #c0c0c0;
border-bottom: 1px dotted #c0c0c0;
margin: 10px 0 0 0;
padding: 5px 0;
width: 100%;
text-align: center;
}
.ticketClient {
background-color: #F0EEEE;
margin: 0;
padding: 3px 0 3px 5px;
}
.ticketAdriana {
background-color: #F1A065;
margin: 0;
padding: 3px 0 3px 5px;
}
/*---- Aide ----*/
#answersTree {
margin: 20px 0 20px 0;
padding: 10px 0 0 0;
width: 100%;
border-top: 1px solid #c0c0c0;
}
.puce_circle {
height:10px;
display: inline-block;
font: 35px Georgia, Utopia, Charter, serif;
text-align: center;
color: var(--orange);
margin:0px 5px 0 5px
}
.level1Div {
width: 285px;
margin: 0 0 0 15px;
float: left;
}
.level1Div h2 {
display: inline-block;
font-size: 11px;
text-transform:uppercase;
}
.level2Div {
margin-left: 20px;
padding: 0;
}
.level3Div {
margin-left: 0;
padding: 6px;
}
.level3DivTitle {
font-weight: bold;
font-size: 14px;
}
.tagTitre {
font-weight: bold;
font-size: 14px;
color: var(--orange);
border-bottom: 1px solid var(--orange);
}
.level4ask {
margin: 2px;
height: 20px;
line-height: 20px;
margin-left: 0;
padding: 1px;
background-color: #dbdbdb;
}
.formQuestion {
border:1px solid #a0a0a0;
margin: 20px 0 0 0;
padding: 5px;
background-color: #F0EEEE;
text-align:center;
}
.formQuestionTicketInfo {
display: inline-block;
width: 25%;
}
.formQuestionTicketInfo input{
line-height: 30px;
font-size: 14px;
color: #707070;
}
.formQuestionTicketTextArea {
margin: 10px 0;
}
.formQuestionTicketTextArea textarea{
margin: 10px 0;
}
.ticketContact {
border:1px solid #a0a0a0;
margin: 10px;padding:2px;
background-color: #fff;
}
.ticketCourier {
padding: 10px;
text-align:center;
background-color:#fff;
}
.level4answer {
padding: 4px;
display: none;
text-align:justify
}
.level4answerOk {
margin: 10px 0 10px 0;
padding: 0;
border-bottom: 1px solid #a0a0a0;
text-align: center;
font-weight: bold;
}
.level1Titre {
font-size: 12px;
border-bottom: 2px solid #ffccee;
margin: 5px 0 5px 0;
padding: 0 0 0 15px;
color: var(--orange);
font-weight: bold;
background: url(/images/green-point.gif) no-repeat left center
}
.level2Container {
width: 170px;
margin: 0 auto 0 auto;
}
.level2Titre {
padding: 4px;
width: 170px;
margin: auto;
cursor: pointer;
}
.level2Titre:hover {
padding: 4px;
background-color: #c0c0c0;
width: 170px;
margin: auto;
}
.level2Titre a{
color: #5d5d5d;
}
.level2Titre a:hover {
color: #fff;
}
.tagsTexte {
width: 760px;
margin: 0 auto 0 auto;
padding: 0 0 5px 0;
text-align: center;
border-bottom: 1px solid #a0a0a0;
}
.returnLevel1 {
float: right;
margin: 0 30px 0 0;
}
.leftTree {
float: left;
margin: 0;
width: 25%;
min-height: 360px;
}
.rightTree {
float: left;
width: 75%;
}
.leftTreeLevel1Div {
text-align: left;
}
.leftTreeLevel1Titre {
font-size:14px !important;
margin:25px 0 0 0;
padding: 5px 0 5px 35px;
}
.leftTreeLevel2Titre {
text-align: left;
padding: 0 0 5px 18px;
margin: 0;
}
.leftTreeLevel2TitreSelected {
text-align: left;
padding: 0 0 5px 18px;
margin: 0;
font-weight: bold;
}
#explainBox {
margin: 10px 40px 0 0;
float: left;
width: 447px;
}
.menufaq{
font-size: 12px;
font-weight: bold;
}
.faq_pays{
border-top:1px solid #c0c0c0;
padding-top:25px;
}
#content-contact {
max-width: 1200px;
width: 100%;
margin: auto;
}
#contact-area {
float: right;
width: 40%;
font-size: 15px;
}
#contact-area i {
font-size: 38px;
float: left;
}
#faqBox {
margin: 10px 0 0 0px;
width: 50%;
font-size: 14px;
line-height: 24px;
}
#faqBox h2, #explainBox h2 {
font-size: 16px;
margin: 0 0 10px 0;
padding: 5px 0 3px 10px;
color: #fff;
background-color:#5d5d5d;
font-weight:normal;
}
#explainBox p, #faqBox p{
margin: 20px 0 10px 10px;
font-size:13px;
}
#explainBox button, #answersTree button{
border:none;
margin:0;
width:auto;
overflow:visible;
text-align:center;
white-space:nowrap;
cursor: pointer;
}
#explainBox button .bg_gauche, #answersTree button .bg_gauche{
height:40px;
line-height:38px;
margin:0;
color:#fff;
padding-left:20px;
background:url(/images/button_bg.gif) no-repeat 0 0;
}
#explainBox button .bg_droite, #answersTree button .bg_droite {
height:40px;
line-height:38px;
margin:0;
color:#fff;
font-style:normal;
padding-right:20px;
background:url(/images/button_bg.gif) no-repeat 100% 0;
}
#explainBox button:hover .bg_droite, #answersTree button:hover .bg_droite{
height:40px;
line-height:38px;
margin:0;
color:#fff;
font-style:normal;
padding-right:20px;
background:url(/images/button_bg_over.gif) no-repeat 100% 0;
}
#explainBox button:hover .bg_gauche, #answersTree button:hover .bg_gauche {
height:40px;
line-height:38px;
margin:0;
color:#fff;
font-style:normal;
padding-left:20px;
background:url(/images/button_bg_over.gif) no-repeat 0 0;
}
.separator {
display: none;
width: 760px;
border-top: 1px solid #c0c0c0;
margin: 0 auto 10px auto;
padding: 0;
}
a.gris:link {
color: #5d5d5d;
text-decoration: none;
}
a.gris:visited {
color: #5d5d5d;
font-weight: bold;
text-decoration: none;
}
a.gris:hover {
color: var(--orange);
font-weight: bold;
text-decoration: none;
}
a.gris:active {
color: #5d5d5d;
font-weight: bold;
text-decoration: none;
}
span[id*="desc_pj"] .icon-annuler {cursor:pointer;}
.fakeBtn {
display:inline-block;
background-color: #f8b333 !important;
color:#fff;
margin:auto;
padding: 4px 12px;
font: 13px/25px 'Work Sans', Arial, sans-serif;
text-decoration:none;
border-radius:3px;
}
.fakeBtn i {font-size:17px;}
.fileUpload {
position: relative;
overflow: hidden;
margin: 10px;
}
.fileUpload input.upload {
position: absolute;
top: 0;
left: 0;
margin: 0;
padding: 0;
font-size: 20px;
cursor: pointer;
opacity: 0;
filter: alpha(opacity=0);
width:100%;
}
/*****************************************************
**** @RECHERCHE
******************************************************/
#menu-search {
position: relative;
width: 172px;
margin: -100px 0 0 0;
padding: 0;
}
#menu-search h1 {
margin: 0 5px 5px 15px;
padding: 5px;
font-size: 14px;
color: var(--orange);
}
.searchBloc {
float: left;
width: 175px;
margin: 0 2px 0 0;
padding: 0;
}
.searchBloc2 {
float: left;
width: 225px;
margin: 0 2px 0 0;
padding: 0;
}
.searchBlocSolde {
float: left;
width: 145px;
margin: 0 2px 0 0;
padding: 0;
}
.searchBlocSolde2 {
float: left;
width: 100px;
margin: 0 2px 0 0;
padding: 0;
}
.searchBlocSolde3 {
float: left;
width: 175px;
margin: 0 2px 0 0;
padding: 0;
}
.searchText {
float: left;
width: 60px;
margin: 10px 5px 0 0;
padding: 0;
text-align: right;
font-weight: bold;
}
.searchBox {
float: left;
width: 105px;
font-size: 10px;
border: 1px solid #363636;
margin: 10px 0 0 0;
padding: 0;
}
.searchLongBox {
float: left;
width: 120px;
font-size: 10px;
border: 1px solid var(--orange);
margin: 0 0 5px 20px;
padding: 0;
}
.searchResult {
margin: 10px 0 0 0;
padding: 0;
text-align: center;
}
.searchShoesBox {
float: left;
width: 185px;
text-align: center;
margin: 0;
padding: 0 0 10px 0;
}
#searchNavbar {
width: 365px;
height: 45px;
text-align: center;
margin: 0 auto 0 auto;
padding: 15px 0 0 0;
}
/*---- RECHERCHE ----*/
#unknown_keywords {
font-size: 14px;
border-bottom: 1px solid #e6e6e6;
color: #707070;
text-align: center;
}
#unknown_keywords .searchTitle {
font-size: 22px;
color: #363636;
text-align: center;
}
#unknown_keywords .searchTitle b {
font-size: 24px;
}
#unknown_keywords .keywords {
font-size: 18px;
font-weight: bold;
}
#unknown_keywords .keywords_suggestion {
color: #363636;
}
#unknown_keywords .keywords_suggestion span {
font-size: 18px;
}
#unknown_keywords a.keywords_fixed {
font-size: 18px;
font-weight: bold;
text-decoration: underline;
color: #363636;
}
#unknown_keywords a.keywords_fixed:hover {
color: var(--orange);
}
/*****************************************************
**** @LOGIN
******************************************************/
.contentDLogin, .contentGLogin {
width: 45%;
padding: 1.6em;
border: 1px solid #bababa;
}
.contentDLogin .h2overlay, .contentGLogin .h2overlay {
font-size: 1.6em;
text-align: center;
font-weight: bold;
}
.inputRequirement {
font-size: 9px;
line-height: 0;
font-style: italic;
color: var(--orange);
}
.inputGrey:focus {
background-color: #c0c0c0;
outline: 0;
}
.inputGrey {
width: 250px;
line-height: 28px;
padding: 2px 5px;
border: none;
background-color: #e6e6e6;
border-radius: 3px;
}
textarea.inputGrey {
min-height: 60px;
border-radius: 3px;
appearance: none;
background-color: #FFF;
border: 1px solid #333333;
}
.inputGreyRed {
width: 190px;
line-height: 28px;
border: 2px solid #cc0000;
background-color: #e6e6e6;
}
#login2, #creaCompte2, #creaCompteSuite {
display: flex;
flex-direction: column;
align-items: center;
}
.loginTitle {
width: 463px;
height: 57px;
font-size: 14px;
line-height: 24px;
text-align: center;
color: #fff;
background: url(/images/secure_loginNewCustomerTop.gif) no-repeat center top;
}
.loginContent {
margin: 20px 0 0;
width: 100%;
}
#loginFormDiv .messageStack {width: 405px;}
.passwdForget {
margin: 10px 0 0;
text-align: center;
}
#login2 .line1, #login2 .line2 {
margin: 0 0 2em;
}
.loginValid {
text-align: center;
}
.loginValid button {margin: 0 5px 0 0;}
.loginBottom {
width: 463px;
height: 10px;
}
.cadenas_close {
background: url(/images/mobile/oeil_close_input.png) 98% center no-repeat;
background-color: #e6e6e6;
background-size: 20px;
}
.cadenas {
background: url(/images/mobile/oeil_open_input.png) 98% center no-repeat;
background-color: #e6e6e6;
background-size: 20px;
}
#creaCompteSuite .line input {vertical-align: inherit;}
#creaCompte2 .line2 {
margin: 0 auto 10px;
width: 85%;
/* text-align: center; */
}
#creaCompte2 .line2 a {color: #363636;}
#creaCompte2 .facultatif {
float: right;
color: #cc0000;
text-align: left;
padding-left: 30px;
}
#password_strength {
display: none;
width: 100%;
}
#password_strength > i {
display: block;
text-align: center;
}
.password_indications {
margin: 10px auto;
width: 80%;
font: normal 12px/14px 'Work Sans', Arial, sans-serif;
}
.password_indications ul {
text-align: left;
margin: 10px 0 0;
padding: 0;
}
.password_indications li {margin: 0 0 0 12px;}
.pw-indic {
font-size: 18px;
display: block;
}
.m-pw {
border-top:1px solid #e6e6e6;
border-bottom:1px solid #e6e6e6;
padding: 8px 0;
margin-bottom: 10px;
}
.wrap-pw {
margin: 10px auto;
width: 80%;
text-align: center;
display: block;
border: thin solid lightgrey;
background-color: #fff;
}
#password_strength_indic {
width: 50%;
height: 15px;
background-color: #91bd09;
}
#latin_lastname_indicator, #latin_firstname_indicator {
display: none;
width: 100%;
}
#latin_firstname_indicator > i , #latin_lastname_indicator > i {
display: block;
text-align: center;
}
.bluePoint {
position: absolute;
right: -5em;
}
.shortInput {
margin: 0 5px 2px 0;
width: 100px;
height: 20px;
border: 1px solid #363636;
}
.shortSelect {
height: 14px;
font-size: 10px;
line-height: 14px;
border: 1px solid #c0c0c0;
vertical-align: baseline;
width: 60px;
}
.shortSelectCompte, .mediumSelectCompte {
width: 55px;
height: 20px;
font-size: 10px;
line-height: 14px;
border: 1px solid #c0c0c0;
background-color: #e6e6e6;
}
#customer_date_birth {
display: block;
width: 100%;
height: auto;
}
#customer_date_birth p {
margin-right: 10px;
display: inline-block;
vertical-align: middle;
}
#text_klarna_cgv p {
margin-bottom: 35px;
display: block;
}
.ligne_birth {
display: inline-block;
vertical-align: middle;
}
.messageStack {
margin: 25px auto 0 auto;
color: #cc0000;
width: 445px;
background-color: #f0eeee;
border: 1px solid #cc0000;
}
.messageStackTitle {
padding: 5px;
font-weight: bold;
background-color: #c0c0c0;
}
.messageStackContent {margin: 5px;}
.facebookAlert {
margin: auto;
padding: 4px 0;
width: 690px;
min-height: 60px;
color: #fff;
background: url(/images/facebook_login_bg.gif) no-repeat center top;
border: 1px solid #333399;
}
.facebookInfos {
margin: auto;
width: 500px;
font-size: 14px;
text-align: center;
}
#reassur {text-align: center;}
.loginOffersInfo, .loginOffersInfo a {
margin: 10px auto;
width: 85%;
/* text-align: center; */
font-size: 10px;
color: #c0c0c0;
}
#charte {
height:0;
overflow: hidden;
margin:0px auto;
width:90%;
color:#707070;
font-size:10px;
text-align:justify;
transition: all 0.5s;
}
.loginCharteLink:hover > #charte {
height: 200px;
overflow: auto;
}
/*****************************************************
**** @PAIEMENT
******************************************************/
#securezoneHeader {
text-align: center;
height: 98px;
border-bottom:#dbdbdb 1px solid;
}
#securezoneFooter {
margin-left: auto;
margin-right: auto;
width :300px;
text-align: center;
}
#paiementOptions {
margin: 10px 0 0 0;
padding: 0;
}
.paiementOptionsBoxes {
margin: 0;
padding: 0;
float: right;
width: 418px;
border-left: 1px solid var(--orange);
border-right: 1px solid var(--orange);
}
.paiementOptionsBoxes .logo-paiement { float: left; width: 70px; border: none; margin: 0; padding: 0;}
.paiementOptionsBoxesRight {
margin: 0;
padding: 10px 0 0 0;
float: right;
width: 418px;
border-left: 1px solid var(--orange);
border-right: 1px solid var(--orange);
}
.paymentOption, .cellules, .windowContent > div {
border-bottom: 1px solid #c0c0c0;
display: block;
margin: auto;
padding: 1.5em 0;
width: 97%;
}
div.paymentOption > .paymentOptionText, div.windowContent > div > .paymentOptionText {
display: inline-block;
margin: 0;
padding: 0;
vertical-align: middle;
width: 80%;
}
div.paymentOption > div, div.shippingOption > div > div, div.windowContent > div > div {
display: inline-block;
vertical-align: middle;
width: 19%;
}
.paiementOptionsBoxesText {
width: 400px;
margin: 5px auto 0 auto;
}
#listeRelais .icone-plan-kiala {
text-align: right;
}
.kialaResult2 img {
float: right;
height: 30px;
}
.icone-plan-kiala {
margin: -20px 10px 10px 0;
}
.shippingOption {
margin: 5px 0 0 0;
}
.shippingOptionText {
display: inline-block;
margin: 0;
vertical-align: middle;
width: 80%;
}
.shippingOptionTextWindow {
text-align: justify;
width: 220px;
height: 55px;
min-height: 80px;
float:left;
margin: 10px 10px 5px 5px;
border-top: 1px solid #c0c0c0;
}
.paiementOptionsBoxesBottom {
margin: 0 0 20px 0;
padding: 0;
float: right;
width: 420px;
height: 10px;
background-image: url(/images/paiementOptionsBoxesBottom.gif);
background-repeat: no-repeat;
background-position: center top;
}
.paiementOptionsBoxesBottomRight {
margin: 0 0 10px 0;
padding: 0;
float: right;
width: 421px;
height: 10px;
background-image: url(/images/paiementOptionsBoxesBottom.gif);
background-repeat: no-repeat;
background-position: 1px top;
}
#paiementOptions .button{
float: right;
margin: 0;
padding: 0;
}
.cvxInput {
width: 30px;
border: 1px solid #888;
margin: 0 5px 0 0;
padding: 0;
}
.longInput {
width: 150px;
height: 15px;
border: 1px solid #363636;
margin: 0 0 2px 0;
padding: 0;
}
.inputKiala88 {
width: 20px;
height: 15px;
border: 1px solid #363636;
margin: 0 5px 2px 0;
padding: 0;
}
#coupon {
width: 420px;
margin: 0 0 0 10px;
padding: 0;
}
#paymentMode {
width: 420px;
margin: 10px 0 0 10px;
padding: 0;
}
#shippingMode {
width: 420px;
margin: 10px 0 0 10px;
padding: 0;
}
#shippingAddress {
width: 420px;
margin: 10px 0 0 10px;
padding: 0;
}
.paymentModif {
margin: 10px 0 0 0;
padding: 0;
text-align: right;
}
#payment {
width: 420px;
margin: 10px 0 0 0;
padding: 0;
}
#CB {
width: 420px;
margin: 10px 0 0 20px;
padding: 0;
}
#CBpaybox {
width: 455px;
margin: 10px 0 0 0;
padding: 0;
}
#paiementlivraison {
width: 455px;
margin: 10px 0 0 0;
padding: 0;
text-align: center;
}
#CBpaypal {
width: 420px;
margin: 10px 0 0 20px;
padding: 0;
text-align: center;
}
#CBpaypal img { max-width: 100%; }
#CBpaypal .paiementOptionsBoxesRight > div > label { display: inline-block; margin-left: 3em; margin-right: 0.5em; }
#CBpaypal .paiementOptionsBoxesRight > div > span { margin: 1em 0 0 0; padding: 1em; display: block; }
.CBlist { width: 95%; margin: auto; }
.CBcentre {
margin: 0 auto 0 auto;
width: 380px;
padding: 0;
}
.securezonebuttonModify{
text-align: right;
padding: 5px;
margin:0;
}
.securezonebuttonConfirm{
text-align: center;
padding: 10px 0;
margin:0;
}
.shortSelectPayment {
width: 50px;
height: 20px;
font-size: 10px;
line-height: 14px;
border: 1px solid #ccc;
background-color: #e6e6e6;
}
.shortSelectPaymentDay {
width: 40px;
height: 20px;
font-size: 10px;
line-height: 14px;
border: 1px solid #ccc;
background-color: #e6e6e6;
}
.CBcentreLabel {
width: 180px;
float: left;
height: 21px;
min-height: 21px;
margin: 5px 0 0 20px;
padding: 4px 0 0 5px;
background-color: #f0eeee;
}
.CBcentreInput {
width: 160px;
float: left;
height: 21px;
min-height: 21px;
margin: 5px 0 0 0;
padding: 4px 0 0 5px;
}
.txtPayCB {
width: 120px;
float: left;
margin: 0 0 0 5px;
padding: 0;
}
.cbNumber {
float: left;
width: 125px;
border: 1px solid #C5AB81;
/*margin: 0 0 0 5px;
padding: 0;*/
}
.validPayment {
float: right;
margin: 0 60px 0 0;
}
.blueCardNumber {
width: 180px;
border: 1px solid #888;
margin: 0;
padding: 0;
}
.auroreCardNumber {
width: 150px;
height: 15px;
border: 1px solid #363636;
margin: 0 5px 2px 0;
padding: 0;
}
.windowContent {
width: 95%;
margin: auto;
}
.windowContentReturnIE {
position: absolute;
width: 500px;
top: 40px;
left: 0;
margin: 0 0 0 15px;
padding: 0;
z-index: 120;
}
.windowButtons {
width: 100%;
height: auto;
text-align: center;
margin: 2em 0;
}
#windowKialaShippingReturnAddress {
display: none;
position: absolute;
width: 515px;
height: 345px;
left: 210px;
margin: 0;
padding: 0;
top: 430px;
z-index: 101;
border: 1px solid #CC0000;
background-color: #fff;
}
#windowKialaShippingReturnAddress2 {
display: none;
position: absolute;
width: 515px;
height: 345px;
left: 210px;
margin: 0;
padding: 0;
top: 550px;
z-index: 101;
border: 1px solid #CC0000;
background-color: #fff;
}
.KialaTitle {
font-variant: small-caps;
margin:5px;
font-weight:bold;
}
.shippingAddressText {
width: 380px;
margin: 5px auto 5px auto;
}
#newShippingAdress {
margin: 0 auto 0 auto;
padding: 0;
width: 480px;
}
.securezoneMask {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 100;
background: url(/images/trameFlou.png) repeat left top;
}
div.paymentOption > div > img, div.windowContent > div > div > img, div.shippingOption > div > div > img {
max-width: 100%;
}
/*--- Paiement ---*/
#maxicheque {
width: 455px;
margin: 10px 0 0;
padding: 45px 0 0;
height: 340px;
background: url(/includes/languages/french/images/paymentTitle8.gif) left top no-repeat;
}
#windowBank {
display: none;
position: absolute;
width: 515px;
height: 345px;
left: 50%;
margin: 0 0 0 -257px;
padding: 0;
top: 190px;
z-index: 110;
background: url(/includes/languages/french/images/windowBank.png) center top no-repeat;
}
/*--- kiala ---*/
.kialaSearch { text-align:center; }
.kialaSearchPostCodeInput, .kialaSearchTownInput {
margin: 0.5em auto 1em auto;
padding: 0.5em;
text-align: center;
width: 35%;
border: 1px solid #363636;
}
.kialaSearchTownInput { width: 70%; }
#listeRelais {
z-index:107;
}
.kialaResult {
width: 480px;
border-top: 1px solid #CC0000;
margin: 0 auto 0 auto;
padding: 5px;
z-index: 205;
}
.kialaResultRadio {
margin: 0;
padding: 0;
float: left;
}
.kialaHoraires {
position: absolute;
width: 310px;
left: -318px;
margin: 0;
padding: 0;
background-color: #CC0000;
text-align: center;
}
.tabHoraires{
width: 300px;
margin: 0 auto 0 auto;
padding: 0;
border-collapse:collapse;
text-align: center;
color: #363636;
}
.tabHoraires td{
margin: 0;
padding: 0;
border: 1px solid #cc0000;
background-color: #fff;
}
.KialaOpenHours {
font-weight: bold;
color: #fff;
padding-top: 2px;
height: 18px;
min-height: 18px;
}
.kialaResult2 {
width: 400px;
border-top: 1px solid #ffccee;
margin: 0 auto 0 auto;
padding: 10px 0 0 0;
}
.kialaResultRadio2 {
margin: 0;
padding: 0;
float: left;
}
.kialaHoraires2 {
position: absolute;
width: 420px;
left: 500px;;
bottom: 250px;
margin: 0;
padding: 0 0 5px 0;
text-align: center;
background-color: #5d5d5d;
}
.tabHoraires2{
width: 380px;
margin: 0 auto 0 auto;
padding: 0;
border-collapse:collapse;
text-align: center;
}
.tabHoraires2 td{
margin: 0;
padding: 0;
border: 1px solid #5d5d5d;
background-color: #fff;
}
.kialaHoraires3 {
position: absolute;
width: 350px;
left: 20px;
margin: 0;
padding: 0 0 5px 0;
border: 1px solid #5d5d5d;
background-color: #5d5d5d;
text-align: center;
}
html>body .kialaHoraires3 {
margin: 0;
}
#kiala_nav {
text-align: center;
border-top: 1px dotted #5d5d5d;
padding: 2em
}
#kiala_nav a {
color: #5d5d5d;
font-weight: bold;
}
#kiala_nav a:hover {
color: #000000;
font-weight: bold;
}
.tabHoraires3{
width: 350px;
margin: 0;
padding: 0;
border-collapse:collapse;
text-align: center;
background-color: #5d5d5d;
}
.tabHoraires3 td{
margin: 0;
padding: 0;
border: 1px solid #00006B;
background-color: #FFCC00;
}
/*--- mondial relay ---*/
.mrelayHoraires {
position: absolute;
width: 400px;
left: 500px;;
bottom: 45px;
margin: 0;
padding: 0 0 5px 0;
text-align: center;
background-color: #CC0000;
}
.mRelayOpenHours {
font-weight: bold;
color: #fff;
padding-top: 2px;
height: 18px;
min-height: 18px;
}
.MondialRelayTitle {
font-variant: small-caps;
margin:5px;
font-weight:bold;
}
/*****************************************************
**** @PANIER
******************************************************/
#emptyCart , #wishlist{
max-width: 1200px;
width: 100%;
margin: auto;
}
#emptyCart > * {
padding: 2rem 0;
}
#emptyCart .btn, #wish_title .btn {
max-width: 250px;
}
#panierVide {
line-height: 18px;
margin: 50px 0 5px;
min-height: 300px;
width: 80%;
}
#panierVide p{
text-align: left;
font-size: 16px;
}
#panierVide .goBack{
text-align: center;
margin: 0 auto 5px auto;
}
.panierIncludeTop {
margin: 10px 0 0 20px;
padding: 3px 0 0 0;
height: 22px;
width: 420px;
color: #fff;
background-color: var(--orange);
text-align: center;
line-height: 18px;
font-size:16px;
}
.panierInclude {
width:100%;
margin:0;
padding:0;
}
.panierIncludeTotal {
width: 418px;
margin: 5px 0 0 20px;
padding: 0;
text-align: left;
line-height: 18px;
border: 1px solid #c0c0c0;
}
.panierIncludeSubTotal {
padding: 5px;
text-align: right;
font-size: 12px;
font-weight: bold;
}
.panierIncludeShipping {
padding: 5px;
text-align: right;
color: rgb(54, 54, 54);
font-size: 12px;
font-weight: bold;
background-color: #f0eeee;
}
.panierIncludeTotalPrice {
padding: 5px;
text-align: right;
color: var(--orange);
font-size: 14px;
font-weight: bold;
}
.panierIncludeMensualite {
padding: 5px;
text-align: right;
font-size: 12px;
}
.panierInclude .panierTitleProduct {max-width:40px;}
.tabSmall {
width: 100%;
margin: 0;
padding: 0;
text-align: center;
border-collapse: collapse;
border: 0 none #000000;
}
#panierAccessTop {
width: 150px;
height: 30px;
margin: 0;
padding: 5px 0 0 0;
color: #09B0C9;
font-weight: bold;
background-image: url(/images/panierAccess-top.gif);
background-repeat: no-repeat;
background-position: center top;
}
#panierAccess {
float: left;
width: 150px;
margin: 10px 10px 0 0;
padding: 0;
text-align: center;
background-image: url(/images/panierAccess-mid.gif);
background-repeat: repeat-y;
background-position: center top;
}
#panierAccess p{
width: 140px;
margin: 0 auto 10px auto;
padding: 0 0 5px 0;
border-bottom: 1px solid #c0c0c0;
text-align: center;
}
#panierAccessBottom {
width: 150px;
height: 15px;
margin: 0;
padding: 0;
background-image: url(/images/panierAccess-bottom.gif);
background-repeat: no-repeat;
background-position: center top;
}
.panierDroite {
float: left;
width: 548px;
margin: 10px 0 0 0;
padding: 0;
}
.panierDroiteEmpty {
width: 548px;
margin: 0 auto 0 auto;
padding: 0;
}
.panierDeleteProduct {
cursor:pointer;
text-align:center;
}
.panierDeleteProduct i {
font-size: 35px;
line-height: 0;
}
.panierStock {
text-align: center;
font-size: 11px;
color: #363636;
font-weight: normal;
}
.panierInfo {
margin: 0;
padding: 0;
}
.conseil, .paiementMalin, .promoPartner {
position: relative;
margin: 0 auto 30px auto;
padding: 0;;
}
.panierPremium {
margin-bottom: 25px;
}
.panierOption {
position: relative;
margin: 0 auto 30px auto;
padding: 0;
}
div.conseil img, div.paiementMalin img, div.panierOption img, div.promoPartner img {
float: left;
}
.logoPartner {
margin: 0 5px 10px 10px;
}
.conseil b {
color: #E97E00;
}
.panier {
width: 80%;
margin: 10px auto 0 0;
padding: 0;
}
.panierEngagements {
margin: 0 0 10px 0;
padding: 0 5px 0 5px;
position: absolute;
right: 0;
}
.panierEngagements > div:nth-of-type(4), .panierEngagements > div:nth-of-type(5), .panierEngagements > div:last-of-type{
display: none;
}
.engagementsTitle {
font-weight: bold;
margin: 0 0 12px 0;
padding: 0 0 3px 0;
text-align: center;
border-bottom: 1px solid #d9d4e0;
font-size:16px;
text-transform:uppercase;
}
.engagement {
margin-bottom: 10px;
display: flex;
padding: 5px;
align-items: center;
border-bottom: 1px solid #d9d4e0;
}
.engagement i {
margin: 0 5px;
display: block;
font-size: 34px;
cursor: pointer;
}
.engagement_txt {
display: inline-block;
letter-spacing: 0.3px;
text-transform: uppercase;
width: 170px;
font: 13px/14px 'Work Sans', Arial, sans-serif;
}
.engagement_txt p {
display: inline-block;
color: #d9d4e0;
font-size: 12px;
text-transform: none;
margin: 0;
}
.panier-top {
float: left;
width: 550px;
height: 10px;
margin: 0 0 0 15px;
padding: 0;
background-image: url(/images/panier-top.gif);
background-repeat: no-repeat;
background-position: center bottom;
}
.panier-bas {
margin: 20px 0 0 0;
padding: 0;
width:100%;
}
#panierTotalPrice {
margin: 0;
height: 30px;
min-height: 30px;
}
#panierTotalPrice .total{
color: var(--orange);
}
.tabSmall-total{
text-align:center;
font-size:14px;
color:var(--orange);
}
.panier_productName {
margin: 5px 0 5px 0;
padding: 10px 0 5px 20px;
text-align: left;
font-weight: bold;
font-size: 14px;
background-image: url(/images/arrowDown_grey.gif);
background-repeat: no-repeat;
background-position: 5px center;
border-bottom: 1px solid #c0c0c0;
}
.panier_productSize {
margin: 0;
padding: 0;
font-size: 25px;
color: #5d5d5d;
}
.panierQuantity {
font-size: 13px;
}
.panierQuantity i {
font-size: 18px;
cursor: pointer;
color: var(--orange);
}
.panierQuantity span {
position: relative;
bottom: 2px;
right: 2px;
}
.panierCommander {
display: inline-block;
}
.panier_productPrice {
margin: 0;
padding: 0;
font-weight: bold;
font-size: 14px;
}
.panier_productTotalPrice {
margin: 0;
padding: 0;
font-weight: bold;
font-size: 14px;
color: var(--orange);
}
.panierTab {
width: 100%;
margin: 0 auto 0 auto;
padding: 0;
border-collapse: collapse;
border: 1px solid #c0c0c0;
}
.cartProductListing-heading{
height:24px;
margin: 0;
padding: 10px 0 0 0;
text-transform: uppercase;
text-align: center;
color: #fff;
background-color: #C0C0C0;
font-size: 14px;
}
.cartProductListing-even {
margin: 0;
padding: 0;
border-bottom: 1px solid #c0c0c0;
text-align: center;
}
.cartProductListing-odd {
margin: 0;
padding: 0;
background-color: #fff;
/* border-bottom: 1px solid #c0c0c0; */
text-align: center;
}
.cartProductListing-productName {
text-align:center;
font-size:12px;
}
#panierServices {
display: none;
margin: 0 0 10px 0;
padding: 0 5px 0 5px;
text-align: center;
border-top: 1px solid #c0c0c0;
border-bottom: 1px solid #c0c0c0;
}
#panierServicesLogin {
width: 359px;
height: 190px;
margin: 0 auto 10px auto;
padding: 0;
line-height: 20px;
font-size: 10px;
}
#panierServices div,#panierServicesLogin div {
margin: 0 0 5px 0;
padding: 0;
}
#panierServices .titrePanierServices {
width: 470px;
height: 25px;
margin: 0;
padding: 3px 0 0 0;
text-align: center;
font-size: 12px;
font-weight: bold;
color: #FB4609;
border-top: 1px solid #363636;
}
#panierServicesLogin .titrePanierServices {
height: 25px;
margin: 10px 0 0 0;
padding: 0;
text-align: center;
font-size: 12px;
font-weight: bold;
color: #FB4609;
}
.second_product_message{
margin: auto;
padding: 10px;
/*border: 4px solid #8591a5;*/
font-size: 15px;
background-color: #eee;
color: #363636;
text-align: center;
-moz-box-shadow: 2px 2px 4px #ccc;
-webkit-box-shadow: 2px 2px 4px #ccc;
box-shadow: 0 0 10px var(--orange);
filter:progid:DXImageTransform.Microsoft.Shadow(color='#cccccc', Direction=135, Strength=8);
zoom: 1;
}
.second_product_message a
{
text-decoration: underline;
}
/*****************************************************
**** @NEWSLETTER
******************************************************/
#newsletterUnsubcribe {
width: 500px;
margin: 0 auto 10px auto;
padding: 0 5px 0 5px;
line-height: 20px;
font-size: 10px;
}
#newsletter {
width:428px;
height:148px;
float:left;
border:1px solid #c0c0c0;
margin: 0;
padding: 0;
background: url(/includes/languages/french/images/home_bottom_newsletter_visuel_B.gif) left bottom no-repeat;
}
/*****************************************************
**** @MARQUES
******************************************************/
#marquesAlpha {
width: 940px;
margin: 0 auto 10px;
padding:0;
}
.separateur_tiret {
border-top: dashed 1px #c0c0c0;
margin-top: 15px;
margin-bottom: 15px;
}
#marquesAlpha h4 {
margin: 10px 0 5px 0;
border-bottom: 1px solid #363636;
}
#marquesAlpha hr {
border: none;
border-bottom: 1px solid #363636;
height: 1px;
background-color: #363636;
margin: 10px 0;
display: block;
}
.marquesAlpha {
width: 20%;
text-align: right;
display: inline-block;
}
.marquesAlpha select{
font-size: 14px;
padding: 5px;
color: #707070
}
.marquesAlpha li {
display: inline-block;
font-size: 12px;
list-style-type: none;
margin-right: 4px;
margin-left: 0;
}
.marquesAlpha li a {
display: block;
font-size: 12px;
}
.marquesAlpha li a:hover {color: var(--orange);}
.selectMarques {
position: relative;
float: right;
padding: 30px 30px 0 0;
}
.contentMarques {
margin: 0;
}
.brandLetterAnchorLink {
display: inline-block;
width: 80%;
}
.brandLetterAnchorLink a{
display:inline-block;
text-align: center;
width:3.5%;
padding: 5px 0;
font: bold 18px/20px 'Work Sans', Sans-Serif;
color: #363636;
}
.brandLetterAnchorLink a:hover {
background-color: #363636;
color: #e6e6e6;
}
.AlertBrandNews {
text-align: center;
font: 200 14px/18px 'Work Sans', Sans-Serif;
background-color: #f0eeee;
color: #c0c0c0;
padding: 5px 0;
margin: 10px auto;
text-transform: uppercase;
}
.AlertBrandNews span{
font-size: 18px;
}
.thumbStyle {
margin-left:2px;
margin-bottom:2px;
}
.marques_lettre {
margin: 3px 0;
padding-top: 3px;
height: 34px;
font: 24px/28px 'Work Sans', Arial, sans-serif;
color: #363636;
text-transform: uppercase;
border-bottom: 1px solid #e6e6e6;
}
/*****************************************************
**** @LISTING
******************************************************/
#wrapper {
position: relative;
max-width: 1200px;
margin: auto;
padding: 0;
}
#contenu {
position: relative;
display: flex;
flex-wrap: wrap;
flex: 1;
justify-content: space-between;
max-width: 1200px;
margin: auto;
padding: 0;
}
.sizeContainer {
width: 500px;
height: 50px;
position: absolute;
top: 135px;
right: 20px;
}
.sizeContainerSoldes {
width: 320px;
height: 180px;
position: absolute;
top: 0;
box-sizing: border-box;
padding: 1em;
right: 0;
background-color: #ffffff;
overflow-y: auto;
}
.sizeContainerList {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
}
.prodcardSize2 {
border: 1px solid #777;
padding: 3px;
margin: 0px 5px 5px 0px;
font-size: 12px;
flex: 1;
text-align: center;
cursor: pointer;
}
.dis_content_vignette_discount {position: relative;}
.vignette_discount {
position: absolute;
font: 11px 'Work Sans', Arial, sans-serif;
letter-spacing: -0.5px;
}
.vignette_discount_rounded {
position: absolute;
font: 14px/40px 'Work Sans', Arial, sans-serif;
right: 10px;
top: 20px;
width: 40px;
height: 40px;
border-radius: 50% 50% 50% 8px;
color: #fff;
background-color: var(--rouge);
text-align: center;
}
div.price > div > div.vignette_discount_rounded {
top: 10px;
}
.vignette_discount_rounded_UK {
position: absolute;
font: 14px/11px 'Work Sans', Arial, sans-serif;
right: 10px;
top: 0;
width: 40px;
height: 40px;
border-radius: 40px 40px 40px 8px;
color: #fff;
background-color: var(--rouge);
text-align: center;
}
.saveUK {
display: block;
font-size: 9px;
margin-top: 7px;
}
.dis_infoDiscountType, .dis_infoType {
font: 10px/12px 'Work Sans', Sans-Serif;
color: var(--rouge);
text-transform: uppercase;
}
.dis_infoType {color: #888;}
.productPrice .dis_infoType, .productPrice .dis_infoDiscountType {
display: none;
}
#product_vignette {
text-align: right;
margin: 5px 10px 0 0;
display: block;
position: absolute;
width: 100%;
}
div.vignetteBig #product_vignette { width: 350px;}
div.vignetteBig .vignette_discount_rounded {top: 20px;}
.vignette_discount span {
position: absolute;
letter-spacing: -1.0px;
vertical-align: super;
font-size: 11px;
}
.vignette_discount i.icon-vignette {
position: absolute;
font-size: 5.2em;
left: 122px;
top: -18px;
}
.vignette_discount p {
position: absolute;
font-size: 1.6em;
color: white;
left: 139px;
top: -0.7em;
}
.vignette_discount_prodCard i.icon-vignette {
position: absolute;
font-size: 6.2em;
bottom: -50px;
left: 310px;
}
.vignette_discount_prodCard p {
position: absolute;
font-size: 1.6em;
color: white;
left: 337px;
top: 20px;
}
.vignette_discount_red {color: var(--orange);}
.vignette_discount_grey {color: #888888;}
ul#list_product {
margin: 6px 0 10px 14px;
padding: 0;
width: 100%;
}
#list_product li {
border: #888 1px solid;
margin: 8px 0;
padding: 0;
width: 202px;
text-align: center;
float: left;
list-style: none;
display: inline;
}
#all-checked, #all-checked2 {
margin: 0 !important;
}
#all-checked2 {
display: none;
}
.close {
margin: 0 0;
padding: 0;
width: 17px;
height: 17px;
float: right;
}
.product-info, .product_info img, .product_info .flags div, .flags .product_info div {
margin: 15px auto 5px auto;
padding: 0;
position: relative;
top: 0;
left: 0;
}
.product_info img, .product_info .flags div, .flags .product_info div {
max-width: 150px;
max-height: 100%;
margin: 0 auto;
}
.ident_product {
margin: 10px auto !important;
padding: 0 !important;
font: bold 12px Verdana, Arial, Helvetica, sans-serif !important;
color: #f8b333 !important;
background-image: none !important;
text-align:center !important;
}
input.product_choose {
margin: 0 auto;
padding: 0;
text-align: inherit !important;
}
.name_product {
margin: 0 auto 0 auto;
padding: 0;
text-transform: uppercase;
color: #929292;
}
.price {
margin: 0;
padding: 0;
}
.priceDiscount {
margin: 0;
padding: 0;
color: var(--orange);
line-height: 25px;
}
.price del, .priceDiscount del {
margin: 0;
font-weight: bold;
color: #929292;
}
.price strong, .priceDiscount strong {
margin: 0;
color: var(--orange);
}
.discount {
margin: 0;
padding: 0;
width: 65px;
height: 35px;
position: absolute;
top: 10px;
right: 15px;
}
.last_product {
margin: 0;
font-size: 10px;
color: var(--orange);
}
#article_select li > form > hr, #article_select li hr {
margin: 10px auto;
width: 172px;
background: none;
border: 1px solid #929292;
border-width: 1px 0 0 0;
}
.alert_stock {
margin: 5px 0;
padding: 0;
}
.alert_stock a {
margin: -20px 5px 5px 5px;
padding: 18px 0 0 25px;
height: 30px;
float: left;
text-decoration: none;
background: url(/images/alert_stock.png) no-repeat left;
color: #929292;
}
.alert_stock a:hover {
background: url(/images/alert_stock_over.png) no-repeat left center;
color: var(--orange);
}
.shopping_cart {
margin: 5px 0 20px 0;
cursor: pointer;
font-size: 12px;
}
.shopping_cart:hover {color: #e6e6e6;}
.hr-wish {
margin: 10px 0 10px 0;
display: block;
height: inherit !important;
border: none !important;
border-bottom: 1px solid #363636 !important;
}
/*---- Menu de gauche ----*/
#gauche {
position: relative;
width: 25%;
margin: 30px 0 0 0;
padding: 0 0 0 0;
}
#menu {
position: relative;
margin: 20px 0 0;
padding: 0;
}
#menuProdcard {
width: 10px;
height: 10px;
margin: 0;
padding: 0;
}
.menu_filtre1 {
float: left;
width: 110px;
margin: 5px 5px 0;
padding: 0;
}
.rub {
font-size: 14px;
font-weight: bold;
margin: 0;
padding: 0;
color : #363636;
font-variant: small-caps;
}
.srub {
font-size: 1.4em;
padding: 0;
}
li.srub_link_disabled a {
color:#C0C0C0;
cursor:default;
}
#menu ul {
margin: 0 0 10px 0;
padding: 0;
list-style-type: none;
line-height: 15px;
}
#menu ul > li > ul {
margin: 0 0 2px 5px;
padding: 0;
list-style-type: none;
}
#menu a {padding: 0;}
#menu a:link {
color: #5d5d5d;
text-decoration: none;
}
#menu a strong{color: var(--orange);}
#menu a:visited {text-decoration: none;}
#menu a:hover, #menu a:active {
color: var(--orange);
text-decoration: none;
}
#newsletter_form a{
padding: 0;
background: none;
}
#menu a.spirit {
padding: 0;
background: none;
}
#menu a.color_link_menu{
padding: 0;
margin: 0;
background:none;
}
#menu h2{
font-size: 12px;
font-weight: normal;
margin: 0;
padding: 3px;
color : #363636;
background-color: #f0eeee;
border-bottom: 1px solid #c0c0c0;
}
#menu h2 a {
margin: 0;
padding: 0;
color:#363636;
}
#menu .champs{
border: 1px solid #888;
margin: 0;
padding: 0;
font-size: 10px;
}
.top5 {
margin: 0;
padding: 0;
}
.top5_title {
color: #5d5d5d;
font-size: 14px;
font-weight: bold;
margin: 15px 0 5px 0;
text-transform: uppercase;
}
#menu .title_menu, #menu h2{
font-size: 14px;
font-weight: bold;
margin: 15px 0 0 0;
padding: 0 0 5px 0;
color : #5d5d5d;
text-transform:uppercase;
border-bottom: #5d5d5d solid 1px;
}
#menu .title_menu a, #menu h2 a{
background-image: none;
padding: 0;
color:#363636;
}
/*---- JSCROLLPANE ----*/
.scroll-pane,
.scroll-pane-arrows {
width: 100%;
min-height: 200px;
border-bottom: 1px solid #e6e6e6;
overflow: auto;
padding: 2px;
box-sizing: border-box;
display: flex;
align-items: flex-start;
flex-wrap: wrap;
}
#advanced_menu #style > div {
width: 100%;
}
.scroll-pane-arrows p {
font-size: 1em;
font-weight: normal;
width: 100%;
}
.jspContainer {
overflow: hidden;
position: relative;
}
.jspPane {position: absolute;}
.jspPane > div {
border-bottom: 1px solid #e6e6e6;
width: 150px;
}
.jspVerticalBar {
position: absolute;
top: 0;
right: 0;
width: 12px;
height: 100%;
text-align: center;
}
.jspVerticalBar * {
margin: 0;
padding: 0;
}
.jspCap {
display: none;
}
.jspTrack {
background: #e6e6e6;
position: relative;
}
.jspDrag {
background-color: #c0c0c0;
position: relative;
top: 0;
left: 0;
cursor: pointer;
}
.jspArrowDown {
background-color: #f0eeee;
border: 1px solid #e6e6e6;
box-sizing: border-box;
}
.jspArrowUp {
background-color: #f0eeee;
border: 1px solid #e6e6e6;
box-sizing: border-box;
}
.jspArrow {
display: block;
cursor: pointer;
}
.jspArrow i {
color: #c0c0c0;
font-size: 10px;
}
.jspVerticalBar .jspArrow {
height: 12px;
}
.jspVerticalBar .jspArrow:focus {
outline: none;
}
.jspCorner {
background: #eeeef4;
float: left;
height: 100%;
}
/*---- filtres avancés ----*/
#advanced_menu {
background-color: #fff;
line-height: 2.4em;
width: 75%;
}
#advanced_menu #size, #advanced_menu #marque, #advanced_menu #style, #advanced_menu #stengel_composition, #advanced_menu #voering_composition, #advanced_menu #first_composition, #advanced_menu #zool_composition, #advanced_menu #country {
width: 100%;
line-height: 3em;
}
#advanced_menu .srub > div {
border-bottom: 1px solid #ede5d5;
line-height: 30px;
}
#advanced_menu > .srub > div:last-child {
border-bottom: none;
}
#advanced_menu div:nth-of-type(2) .adv_title_menu{border-top: none;}
/* #advanced_menu > .srub > div:last-child {
line-height: 30px;
border-bottom: none;
}
*/.filter_adv {
font-size: 1.6em;
display: none;
}
.advanced_menu_brand_search {
display: none;
width: 100%;
font-size: 1.2em;
font-family: 'Work Sans';
border: 1px solid #e6e6e6;
padding: 1em;
box-sizing: border-box;
}
#header_menu_avance {
background-color: #fff;
}
#filtres_classiques {
cursor: pointer;
background-color: #c0c0c0;
text-align: center;
width: 83px;
box-sizing: border-box;
float: left;
padding: 5px;
line-height: 11px;
font-size: 10px;
color: #363636;
}
#filtres_classiques_actif {
width: 83px;
text-align: center;
color: #fff;
background-color: var(--orange);
float: left;
padding: 5px;
box-sizing: border-box;
line-height: 11px;
font-size: 10px;
}
#filtres_avances {
cursor: pointer;
background-color: #c0c0c0;
text-align: center;
width: 83px;
box-sizing: border-box;
float: left;
padding: 5px;
color: #363636;
font-size: 10px;
line-height: 11px;
}
#filtres_avances_actif {
width: 83px;
box-sizing: border-box;
text-align: center;
color: #fff;
background-color: var(--orange);
float: left;
padding: 5px;
line-height: 11px;
font-size: 10px;
}
#filtres_classiques:hover, #filtres_avances:hover {
color: var(--orange);
}
#title_advanced_fil_ariane {
width: 100%;
font-size: 13px;
margin: 10px 0 10px 0px;
padding: 13px;
border-bottom: 1px solid #ede5d5;
}
#adv_nb_products_span {
font-size: 14px;
letter-spacing: 1px;
color: #707070;
}
#title_advanced_fil_ariane h1.seo_hn_tag {
font: bold 28px 'Work Sans', Arial, sans-serif!important;
}
#advanced_fil_ariane {
padding-top: 5px;
width:100%;
display: flex;
min-height: 24px;
align-items: center;
flex-direction: row-reverse;
justify-content: flex-end;
}
.ariane_fl {
display:flex;
align-items: center;
}
.adv_filter_classement {cursor:pointer;}
#classement {padding-left:0;}
/*---- Dropdown Choix du tri ----*/
/* Dropdown Choix du tri*/
.advViewClassement {
margin-left:10px;
width:180px;
position: relative; /*pour positionner content*/
display: inline-block; /*pour positionner content*/
text-align:center;
height:25px;
font: 12px/25px 'Work Sans', Arial, sans-serif;
}
.btn_tri {
background-color: #fff;
color: #363636;
height: 25px;
font: 12px/25px 'Work Sans', Arial, sans-serif;
border: 1px solid #c0c0c0;
border-radius: 2px;
cursor: pointer;
padding: 4px;
display: flex;
justify-content: center;
align-items: center;
}
.btn_tri i {margin-left:4px; margin-top:3px;}
.classement_content {
display: none;
position: absolute;
background-color: #f0eeee;
min-width: 180px;
z-index: 1;
cursor:pointer;
list-style-type: none;
margin-top:0;
}
.classement_content li {
color: #363636;
padding: 3px 0;
text-decoration: none;
display: block;
margin-left:0;
}
.classement_content li:hover {background-color: #e6e6e6}
.adv_nouvelle_recherche {
cursor: pointer;
margin-left: 5px;
font-weight: normal;
font-size: 12px;
font-weight: bold;
text-transform: uppercase;
display: inline-flex;
}
.adv_fil_ariane_elt {
background-color:#f0eeee;
padding:10px;
margin-right:5px;
border-radius:20px;
display:inline-flex;
align-items: center;
justify-content: flex-start;
}
.adv_fil_ariane_text {
color: #363636;
font-size: 14px;
margin-right:5px;
}
.adv_fil_ariane_image {
cursor: pointer;
width: 18px;
height: 18px;
line-height: 18px;
font-size: 12px;
border-radius: 50%;
text-align: center;
display: inline-flex;
align-items: center;
justify-content: center;
}
.adv_fil_ariane_image i {
line-height: 18px;
}
#productsPer3, #productsPer4, #productsPer3Adv, #productsPer4Adv {
display: inline-block;
margin: 4px;
cursor: pointer;
}
#productsPer3Adv, #productsPer4Adv {
margin-top: 8px;
}
.advViewType {
border-left: 1px solid #c0c0c0;
width:135px;
display:inline-block;
box-sizing:border-box;
text-align:center;
vertical-align: top;
font-size:11px;
padding-top: 5px;
}
.title_advanced_fil_ariane_content {
padding:5px;
width:100%;
display:inline-flex;
justify-content: space-between;
flex-wrap: wrap;
}
#promo {
display: flex;
flex-wrap: wrap;
padding: 0 3px;
}
/* FILTRE COULEURS */
#advanced_menu #colors {
display: flex;
flex-direction: column;
max-height: 250px;
overflow-y: auto;
}
#advanced_menu #colors > div {
display: flex;
align-items: center;
border-bottom: 1px solid #e6e6e6;
padding: 0.65em 0;
}
#advanced_menu #colors > div >div:first-of-type {
display: inline-block;
vertical-align: middle;
border-radius: 2px;
margin: 3px;
width: 16px;
height: 16px;
box-sizing: border-box;
background: #fff;
border: 1px solid #707070;
cursor: pointer;
}
#advanced_menu #colors > div.adv_colors_actif_parent >div:first-of-type {
border-radius: 2px;
background-color: var(--orange);
cursor: pointer;
position: relative;
display: inline-flex;
justify-content: center;
align-items: center;
border: none;
}
#advanced_menu #colors > div.adv_colors_actif_parent >div:first-of-type::after {
content: '✕';
color: #fff;
width: 16px;
height: 16px;
line-height: 16px;
text-align: center;
font-size: 18px;
border-radius: 2px;
display: inline-block;
vertical-align: top;
}
#advanced_menu #colors > div:last-of-type {
border-bottom: none;
}
.adv_colors, .adv_colorsB {
display:inline-block;
cursor: pointer;
padding: 0;
height: 22px;
width: 22px;
margin: 2px;
border-radius:50%;
border: 3px solid #fff;
}
/*for orphan filter*/
.adv_colors:last-child {
margin-right:auto;
}
.adv_colors_actif {
border: 3px solid #c0c0c0;
}
.adv_colors_1 { /* Blanc */
background: rgb(217,217,217);
background: linear-gradient(310deg, rgba(217,217,217,1) 0%, rgba(255,255,255,1) 100%);
}
.adv_colors_4 {background: yellow;}
.adv_colors_7 {background: darkorange;}
.adv_colors_8 {background: red;}
.adv_colors_13 {background: hotpink;}
.adv_colors_15 {background: purple;}
.adv_colors_19 {background: dodgerblue;}
.adv_colors_25 {background: green;}
.adv_colors_28 {background: saddlebrown;}
.adv_colors_31,
.adv_colors_6887 {background: #e3e3ca;} /* Beige */
.adv_colors_35 {background: grey;}
.adv_colors_38 {background: black;}
.adv_colors_7124 {background: darkkhaki;}
.adv_colors_7136 {background: #800020;}
.adv_colors_41 { /*Doré*/
background: #ffdc78;
background: linear-gradient(270deg, rgba(255,236,182,1) 0%, rgba(209,161,0,1) 86%, rgba(222,170,10,1) 100%);
}
.adv_colors_46 { /*Argenté*/
background: rgb(209, 209, 209);
background: linear-gradient(347deg, rgba(242,242,242,1) 0%, rgba(186,186,186,1) 86%, rgba(106,106,106,1) 100%);
}
.adv_colors_594 { /*Multicolore*/
background: grey;
background: linear-gradient(217deg, rgba(255,0,0,.8), rgba(255,0,0,0) 70.71%),
linear-gradient(127deg, rgba(0,255,0,.8), rgba(0,255,0,0) 70.71%),
linear-gradient(336deg, rgba(0,0,255,.8), rgba(0,0,255,0) 70.71%);
}
.adv_colors_6889{ background-color: #03224C; }
/*.adv_colors_indispo {*/
/*display:inline-block;*/
/*cursor: pointer;*/
/*padding: 0;*/
/*height: 22px;*/
/*width: 22px;*/
/*margin: 2px;*/
/*border-radius:50%;*/
/*border: 3px solid #fff;*/
/*opacity: .5;*/
/*position:relative;*/
/*}*/
/*.adv_colors_indispo::after {*/
/*position:absolute;*/
/*top: -52%;*/
/*left: 2px;*/
/*transform: rotate(45deg);*/
/*content:'+';*/
/*color: #fff;*/
/*font: 22px 'Work Sans', Arial, sans-serif;*/
/*}*/
div[class^="adv_colors"][class$="_indispo"] {display:none!important;}
.adv_promo_default {
float: left;
margin: 3px;
padding: 5px 2px 1px 2px;
width: 30px;
height: 20px;
font-weight: bold;
text-align: center;
cursor: pointer;
}
.adv_promo_default sup, .adv_fil_ariane_text sup {
vertical-align: top;
}
.adv_promo {
background-color: #e6e6e6;
color: #000000;
}
.adv_size_default, .adv_size_id_default {
display: inline-block;
margin: 3px;
width: 30px;
height: 30px;
font-size: 1.3em;
border-radius: 50%;
line-height:30px;
font-weight: bold;
text-align: center;
cursor: pointer;
background-color:#fff;
border:1px solid #c0c0c0;
}
.adv_size_id_default.adv_size_id_actif {
background-color:#c0c0c0;
}
.adv_size, .adv_size_id {
cursor: pointer;
}
.adv_filtre_default {
display: flex;
align-items: center;
}
.adv_filtre_default div {
margin: 3px;
width: 16px;
height: 16px;
}
.adv_filtre div {
box-sizing: border-box;
background: #fff;
border: 1px solid #707070;
border-radius: 2px;
cursor: pointer;
}
.adv_filtre span {
cursor: pointer;
}
.adv_filtre_default[data-parent-cat] {display: none;margin-left:15px;line-height: 2em;}
.adv_filtre_actif div {
border-radius: 2px;
background-color: var(--orange);
cursor: pointer;
position:relative;
}
.adv_filtre_actif div::after {
content: '✕';
color: #fff;
width: 16px;
height: 16px;
line-height: 16px;
text-align: center;
font-size: 18px;
border-radius: 2px;
display: inline-block;
vertical-align: top;
}
.adv_filtre_actif span {
color: var(--orange);
font-weight: bold;
cursor: pointer;
}
.adv_filtre_indispo div {
background-color: #c0c0c0;
border-radius: 2px;
}
.adv_filtre_indispo span {color: #ccc;}
.adv_filtre_sous_cat
{
padding-left:10px;
}
.adv_title_menu {
margin: 2em auto 0.25em auto;
font-size: 1.6em;
}
#advanced_menu div.adv_title_menu:nth-of-type(2) {margin-top:0;border-top: none;}
.adv_title_menu div {
margin-top: 5px;
margin-right: 10px;
float: left;
width: 11px;
height: 6px;
}
/*---- JQUERY SLIDER RANGE ----*/
#slider-range-advanced-amount {
border: 0;
text-align: center;
background-color: transparent;
font-size: 11px;
color: var(--orange);
font-weight: bold;
margin-bottom: 5px;
}
/*---- Droite ----*/
#droite {
width: 100%;
padding: 0;
}
#gauche + #droite {
width: 75%;
padding: 0;
}
.spartooSelect {
margin: 10px 0 0 0;
padding: 0;
color: #fff;
font-weight: bold;
font-size: 14px;
line-height: 25px;
background-color: var(--orange);
}
.spartooSelect a:link {
color: #fff;
}
.spartooSelect a:visited {
color: #fff;
}
.spartooSelect a:hover {
color: #c0c0c0;
}
.spartooSelect a:active {
color: #fff;
}
.spartooSelect h1, .spartooSelect h2, .spartooSelect h1:hover, .spartooSelect h2:hover {
margin: 0;
padding: 0;
line-height: 25px;
display: inline;
font: inherit;
font-weight: normal;
color: inherit;
}
.dis_content_img a{
color: #000;
}
.dis_content_img a:hover{
text-decoration: underline;
}
.productlist_prix {
color: #000;
}
.origine_country {
display: block;
width: 90%;
margin-top: 0.25em;
font-size: 0.75em;
}
.tribu-nav{
text-align: right;
font-weight: bold;
margin: 0 0 5px 0;
padding: 0;
}
.separ {
width: 580px;
height: 10px;
margin: 0;
padding: 0;
background-color: #888;
}
.numPage2 {
text-align: center;
margin: 0 auto 0 auto;
padding: 5px;
}
.viewAll {
width: 586px;
text-align: center;
font-size: 14px;
font-weight: bold;
margin: 20px 0 0 0;
padding: 0;
}
.viewAll2 {
text-align: center;
font-size: 12px;
text-decoration: underline;
margin: 10px 0 10px 0;
padding: 0;
}
.cloud {
width: 728px;
margin: 0 auto 10px auto;
padding: 3px;
color: #c0c0c0;
background-color:#f0eeee;
border-top: 1px solid #c0c0c0;
}
#maskTrans {
top: 0;
left: 0;
position: fixed;
height: 100%;
width: 100%;
display: none;
}
#maskBlack {
display: none;
opacity: 0.7;
filter: alpha(opacity=70);
position: fixed;
background-color: #000;
height: 100%;
width: 100%;
z-index: 1000;
}
/*****************************************************
**** @POPUPS
******************************************************/
/*---- @POPUP IMAGE ----*/
.popthumb{
float: left;
margin: 2px 9px 0 0;
padding: 0;
border: 1px solid #B5B5B5;
}
.popthumb3{border: 1px solid #B5B5B5;}
.popthumb2{
margin: 58px 0 0;
padding: 0;
}
.pop_image_lagrosse{
margin: auto;
width: 760px;
}
.pop_image_content{
width: 650px;
height: 650px;
z-index: 1;
}
/* ELo */
.contentTop-cadeau {
width:650px;
border-left:1px solid #c0c0c0;
border-right:1px solid #c0c0c0;
border-bottom:1px solid #c0c0c0;
margin:0 auto 0 auto;
padding: 0;
}
.contentBottom-cadeau {
width:650px;
border-left:1px solid #c0c0c0;
border-right:1px solid #c0c0c0;
border-bottom:1px solid #c0c0c0;
margin:0 auto 0 auto;
padding: 0;
}
.alignCenter {
width: 740px;
margin: 0 auto 0 auto;
padding: 0;
text-align:center;
}
.ul-top, .ol-top,.p-top{ margin-top: 0;}
#nom{ color: var(--orange);}
.haut-de-page{float: right;}
/*---- POPUP TEMOIGNAGES -----*/
.testyBody{
background-image : url(/images/testy.jpg);
background-repeat : no-repeat;
}
#testyDIV{
width: 400px;
height: 400px;
}
.calle{
width: 200px;
height: 20px;
}
#testyTitre{
width: 400px;
height: 60px;
margin: 5px 0 0 5px;
padding: 0 0 0 60px;
background-image: url(/images/temoi_titre.jpg);
background-repeat: no-repeat;
font: bold 15px Verdana, Arial, Helvetica, sans-serif;
color: #00A0C6;
}
#Name{
float: left;
text-align: left;
}
#testyName{
width: 300px;
height: auto;
text-align: right;
}
#contentTopT {
position: relative;
width: 90%;
height: 40px;
margin: 10px 0 0 0;
padding: 0;
background-image: url(/images/contentTopTBG.gif);
background-repeat: no-repeat;
background-position: center top;
}
#contentTopT h1 {
font-size: 16px;
margin: 0 0 0 120px;
padding: 10px 0 0 0;
text-align: left;
color: #fff;
}
#moins_cher{
width: 100%;
height: 15px;
margin-top: 5px;
}
#moins_cher a{
color: var(--orange);
font-weight: 600;
}
/*****************************************************
**** @CUSTOM SELECT
******************************************************/
.CS_input {
background: #f0eeee url(/includes/languages/french/images/arrow_menu_down.gif) no-repeat scroll right 2px;
border: 1px solid #c0c0c0;
display:inline;
cursor:default;
margin: 0;
padding: 2px;
font-size: 10px;
}
.CS_input_size {
background: #bfff7a url(/includes/languages/french/images/arrow_menu_down_green.gif) no-repeat scroll right 2px;
border: 1px solid #6dd200;
display:inline;
cursor:default;
margin: 0;
padding: 2px;
font-size: 10px;
}
ul.CS_ul {
margin: 0;
padding: 2px;
border: 1px solid #c0c0c0;
display:none;
}
ul.CS_ul_open {
margin: -1px 0 0 0;
padding: 2px;
border: 1px solid #c0c0c0;
display:block;
background-color: #f0eeee;
}
ul.CS_ul_open li {
color: #000000;
cursor: default;
font-size: 10px;
line-height: 13px;
list-style: none;
margin: 0;
padding: 0;
white-space: nowrap;
}
ul.CS_ul_open li.CS_li_selected {
background-color: var(--orange);
color: #fff;
white-space: nowrap;
}
/*****************************************************
**** @PRODUITS COMPLEMENTAIRES
******************************************************/
.contentcomp{
width: 745px;
/*border: 1px solid #ccc;*/
margin: 20px 0 0 0;
}
.titrecomp{
font-size: 12px;
border-bottom: 2px solid #ffccee;
margin: 5px 0 0 0;
padding: 0 0 5px 15px;
color: var(--orange);
font-weight: bold;
background: url(/images/green-point.gif) no-repeat left center
}
.titreLeft, .titreRight{
float: left;
width: 15px;
height: 30px;
}
.titreLeft{background: url(/images/comp_bgtitreleft.gif) no-repeat;}
.titreRight{background: url(/images/comp_bgtitreright.gif) no-repeat;}
.titreMiddle{
float: left;
height: 30px;
font: 16px Verdana, Arial, Helvetica, sans-serif;
color: #fff;
background: url(/images/comp_bgtitremiddle.gif);
}
.contour{
width: 745px;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
.titrereduc{
margin-bottom: 10px;
padding: 0 0 0 50px;
height: 35px;
width: 744px;
line-height: 35px;
background: url(/images/comp_bgreduc.gif) top left no-repeat;
font-size: 13px;
color: #888888;
}
.calecomp{
float: left;
width: 55px;
height: 35px;
}
.calecompb{
float: left;
width: 25px;
height: 35px;
}
.pourcent{
font-weight: bold;
font-size: 15px;
color: var(--orange);
}
.celluleprod{
float: left;
width: 140px;
text-align: center;
font: 10px Verdana, Arial, Helvetica, sans-serif;
color: #888888;
}
.formcomp{
margin: auto;
height: 35px;
}
.celluleprix{
float: right;
width: 180px;
height: 140px;
text-align: center;
}
.contentPrice{
margin-top: 35px;
width: 180px;
height: 60px;
font: 18px Verdana, Arial, Helvetica, sans-serif;
}
.contentimg{
position: relative;
margin:0;
width:140px;
height:85px;
text-align:center;
}
.comppourcent{
position: absolute;
left:80px;
}
.price1{
font-weight: bold;
color: #D43A36;
}
.BODY{
margin: 0;
padding: 0;
}
.envComp{
margin: 21px auto 0;
width: 550px;
}
.bandeTitre{
float: left;
width: 100%;
height: 30px;
line-height: 30px;
background-color: #000000;
}
.h2comp{
margin: 0 0 0 15px;
padding: 0;
font-size: 14px;
color: #fff;
}
.textDesc{
float: left;
margin: 5px 0 0 5px;
width: 270px;
}
/*****************************************************
**** @RESULTATS
******************************************************/
.results_titre{
width: 750px;
text-align: center;
padding: 4px;
margin: 0 auto 10px;
font-size: 16px;
color: #d30014;
}
.results_texte{
width: 750px;
font-size: 12px;
padding: 4px;
text-align: left;
margin: 0 auto 10px;
}
.results_recherche_bg{
line-height: 25px;
padding: 0 0 0 20px;
margin: 0;
background-color: var(--orange);
color: #fff;
}
.results_produits{
line-height: 25px;
padding: 0 0 0 20px;
margin: 50px 0 0;
background-color: #f0eeee;
color: #5d5d5d;
}
.results_filtre{
position: absolute;
top: 50px;
right: 15px;
font-size: 10px;
color: #5d5d5d;
}
.results_no_products{
font-size: 16px;
width: 750px;
text-align: center;
padding: 4px;
margin: 0 auto 10px auto;
color: #d30014;
}
.styles_contenu2{
margin:0 0 10px;
}
/*****************************************************
**** @CUSTOM
******************************************************/
.cust_reebok{
position: absolute;
top: 265px;
right: 226px;
width: 115px;
height: 30px;
}
.cust_salomon{
position: absolute;
top: 215px;
right: 5px;
width: 400px;
height: 55px;
}
.cust_exclu{
position: absolute;
top: 0;
right: -30px;
width: 30px;
height:119px;
}
.cust_vp{
position: absolute;
top: 159px;
right: 0;
}
.cust_marques{
position: absolute;
top: 150px;
right: 10px;
}
.cust_img_link{
margin-top: 10px;
cursor: pointer;
}
.cust_bottom_link{
display: none;
width: 728px;
margin: 0 auto 20px auto;
text-align:center;
}
.cust_bottom_link_img{border: 1px solid #c0c0c0;}
/*****************************************************
**** @DISPLAY
******************************************************/
.dis_top_5{
margin: 0;
}
.dis_top_5_img{
text-align: center;
font-size: 10px;
padding: 5px 0 5px 0;
margin-top: 0;
border-top: 1px solid #c0c0c0;
}
.dis_top_5_number{
float: left;
font-size: 18px;
padding-top: 25px;
height: 35px;
width: 20px;
text-align: left;
}
.dis_products_per_page{
display: none;
text-align: left;
}
.dis_products_per_page_form{
border-top: 1px solid #c0c0c0;
margin: 5px 2px 10px 15px;
padding-top: 5px;
}
.dis_current_page{
color: #fff;
background-color: var(--orange);
border: 1px solid var(--orange);
font-weight: bold;
margin: 3px;
padding: 4px 8px;
border-radius: 4px;
font-size: 18px;
}
.dis_current_page_espace{
color: #fff;
border: 1px solid #fff;
font-weight: bold;
margin: 3px;
padding: 3px;
}
.dis_ellipsis {
font-weight: bold;
color: #000;
}
.numPage2 a {
display: inline-block;
padding: 5px;
border-radius: 4px;
margin: 0 4px;
font-size: 18px;
}
.numPage2 a:hover {
background-color: var(--orange);
color: #fff;
}
.numPage2 a i {
font-size: 18px;
vertical-align: text-bottom;
}
.numPage2 a i.noMarginLeft {
margin: 0 0 0 -15px;
}
.numPage2 a i.noMarginRight {
margin: 0 -15px 0 0;
}
.dis_cloud_title{
width: 728px;
margin: 0 auto;
padding: 3px;
color: #888;
}
.dis_cloud {
margin: 0 auto 10px;
padding: 3px;
color: #c0c0c0;
background-color: #f0eeee;
border-top: 1px solid #c0c0c0;
}
#menu .dis_cloud {text-align:center;}
#menu .dis_cloud a {
background-image: none;
padding: 0;
font-size:12px;
}
.dis_classement{
float: right;
margin-right:10px;
}
.dis_saut{
line-height: 10px;
margin: 10px 0 5px;
}
.productsList {
display:flex;
justify-content: space-between;
flex-wrap: wrap;
max-width: 100%;
}
#adv_pagination {
padding: 0 0 4rem 0;
}
#adv_pagination .btn {
color: #ffffff;
}
.dis_content_img, .dis_content_img2 {
position: relative;
width: calc(94% / 3);
margin-bottom: 60px;
display:flex;
flex-direction:column;
align-items: center;
background-color: rgba(150,150,150,.1);
}
/*for orphan products*/
.dis_content_img a img {mix-blend-mode: multiply;}
.dis_content_img:nth-child(3n+2):nth-last-child(-n+3):last-child,
.dis_content_img2:nth-child(3n+2):nth-last-child(-n+3):last-child {
margin-right:auto;
margin-left: 3%;
}
/* end orphan products */
.display_product4 {
width: 195px;
}
.test-border{
border-top: #5d5d5d 1px solid;
height:5px;
text-align:center;
margin: 3px auto;
}
.dis_logo_left{
position: absolute;
margin: 0;
left: 0;
}
.dis_logo_left2{
position: absolute;
margin: 10px 0 0 320px;
}
.dis_logo_left3{position: absolute;}
.dis_prix_doux{
position: absolute;
margin: 0 0 0 130px;
}
.dis_prix_new{
position: absolute;
margin: 0;
height:25px;
width:50px;
background-color:#5d5d5d;
}
.dis_prix_new p{
color:#fff;
font: 16px 'Work Sans',Arial,sans-serif;
margin:0px 0 0 6px;
}
.dis_zoom {
position: absolute;
margin: 5px 0 0 125px;
display: none;
height: 25px;
width: 65px;
z-index: 200;
}
.dis_content_img2 .dis_zoom2 {
position: absolute;
margin: 0;
top: 145px;
display: none;
height: 35px;
width: 195px;
z-index: 200;
background-color: rgba(255, 255, 255, 0.6);
}
.display_product3 .dis_zoom2 {
position: absolute;
margin: 0;
top: 165px;
display: none;
height: 35px;
width: 261px;
z-index: 200;
background-color: rgba(255, 255, 255, 0.6);
}
.dis_zoom2 {
position: absolute;
margin: 0;
top: 115px;
display: none;
height: 35px;
width: 195px;
z-index: 200;
background-color: rgba(255, 255, 255, 0.6);
}
.dis_zoom2 div {
cursor: pointer;
text-align: center;
display: inline-block;
width: 90px;
}
.dis_zoom2 div:hover {color: var(--orange);}
div.dis_zoom2 > div > i {font-size: 24px;}
.dis_content_img_product {width: 150px;}
.dis_content_img2 .dis_content_img_product {width: 180px;}
.display_product3 .dis_content_img_product {width: 200px;}
.dis_zoom_ico {
height: 20px;
width: 60px;
}
.dis_your_size{margin: 0;}
.dis_text_soldes{
float: left;
margin: 5px 0 0 0;
font-weight: normal;
text-align: center;
color: #5d5d5d;
}
.dis_right{float: right;}
.dis_reviews{
margin: 3px;
padding: 3px 0;
border-top: 1px dotted #c0c0c0;
}
.dis_comp_img{
float: left;
margin: 0;
cursor: pointer;
}
.dis_comp_img2{
float: left;
margin: 0 2px 0 8px;
cursor: pointer;
}
.dis_comp_plus_img{float: left;}
.dis_others{
position: absolute;
left: 530px;
width: 250px;
margin: 3px 0 0;
color: #09b0c9;
font-weight: bold;
}
.dis_comp_bg{
min-height: 160px;
margin: 5px 0 15px 10px;
padding: 0;
}
.dis_comp_name{
width: 450px;
margin: 3px auto;
}
.dis_market_price{
color: #C32323;
}
.dis_content_parteners{
border: 1px solid #c7c7c7;
background-color: #F0EEEE;
margin: 0 auto;
padding: 15px 0 0;
width: 260px;
height: 55px;
}
.dis_parteners_img{
float: left;
margin: 0 0 0 20px;
}
.dis_parteners_popup{
float: left;
margin: 5px;
}
.dis_link_3d{
width: 365px;
text-align: center;
margin: 10px auto 0 auto;
}
.dis_cale_descript{
height: 18px;
background: url(/images/prodcardOngletOff_bg.gif) repeat-x left bottom;
}
.dis_description{
margin-bottom: 5px;
padding-bottom: 5px;
}
.dis_info_size{
font-variant: small-caps;
font-weight: bold;
font-size: 11px;
}
.dis_content_list{
width: 745px;
margin: auto;
}
.dis_content_list_cale{
position: absolute;
left: 570px;
width: 250px;
margin: 3px 0 0;
color: #09b0c9;
font-weight: bold;
}
.dis_content_list_img{
margin: 0 5px;
cursor: pointer;
float: left;
}
.dis_alert_select{
background-color: #efefef;
}
#BrandHistory {
padding: 0 0 0 5px;
background-color: #fff;
z-index:11;
color: #888;
}
.dis_history1 {
font-size: 14px;
font-weight: bold;
margin: 15px 15px 0;
border-bottom: 1px solid #C0C0C0;
padding: 0 0 5px 0;
}
.dis_history2 {
text-align: justify;
margin: 15px 15px 0;
font-size: 13px;
line-height: 16px;
}
.dis_history_img {
float: left;
margin: 0 15px 5px 0;
}
.dis_historyLink{
text-align: right;
margin: 0;
padding: 0;
font-size: 12px;
}
.dis_historyUniv {
text-align: justify;
margin: 5px 0 0;
font-size: 12px;
line-height: 14px;
}
.dis_choice_color{
height: 12px;
width: 12px;
float: left;
margin: 0 5px 5px 0;
cursor: pointer;
padding: 0;
}
.dis_brand_best{
float: left;
width: 190px;
text-align: center;
}
.dis_news_alert{
color: var(--orange);
font-size: 14px;
font-weight: bold;
margin: 15px 15px 0;
border-bottom: 1px solid #C0C0C0;
padding: 0 0 5px;
}
.dis_news_alert i{font-size: 30px;}
.couleur-nouveaute {color: var(--orange);}
.dis_list_images{height: 80px;}
.dis_contentimg_img{margin-bottom: 5px;}
.dis_info_name{margin: 5px 0 10px;}
.dis_alert_content{
background-color: #fff;
margin: 0 15px 0 15px;
padding: 5px;
font-size: 13px;
line-height: 16px;
text-align: justify;
}
.dis_alert_brand{
width: 350px;
float: left;
}
.dis_alert_form{
width: 350px;
float: left;
margin: 0 0 0 20px;
}
.dis_alert_gender{
float: left;
width: 120px;
}
.dis_alert_mail{
float: left;
width: 120px;
}
.dis_alert_input{
background-color: #efefef;
height: 14px;
width: 160px;
padding: 0;
font-size: 10px;
}
.dis_alert_pop_content{
display: none;
background-color: #fff;
position: absolute;
top: 180px;
left: 278px;
width: 400px;
border: 1px solid #C0C0C0;
z-index: 480;
}
.dis_alert_pop_child{
margin: 0;
padding: 5px;
font-size: 13px;
line-height: 16px;
text-align: justify;
}
.dis_alert_pop_text{
width: 350px;
margin: 5px auto;
}
.dis_alert_pop_input{
background-color: #efefef;
height: 14px;
width: 160px;
padding: 0;
font-size: 10px;
}
.dis_nb_produits{
font-size: 10px;
font-weight:normal;
}
/*****************************************************
**** @MY SIZE
******************************************************/
.my_size_content{
width: 270px;
padding: 2px;
margin: 0;
text-align: center;
}
/*****************************************************
**** @WIDGET
******************************************************/
.widget{
float: left;
width:600px;
height: 450px;
margin-left:40px;
}
.widgetText{
float: left;
height: 450px;
width:200px;
margin:0 auto;
font-size: 16px;
line-height:22px;
text-align:justify;
letter-spacing:0px;
word-spacing:1px;
margin-left:40px;
}
.widgetLogo{
float: left;
width:191px;
height:85px;
text-align:center;
}
.widgetLogos{
float: left;
width:100px;
height:85px;
text-align:center;
}
.widgetBottom{
width:840px;
height: 10px;
border-top:1px solid #c0c0c0;
padding-top: 10px;
text-align:center;
margin:0 auto;
}
.cheque {margin: 20px 0 0 70px;}
.cheque img {cursor: pointer;}
.cheque label {cursor: pointer;}
ul.chque li{
list-style-type:none;
float:left;
}
/*****************************************************
**** @PARRAINAGE
******************************************************/
#parrainage_compte .conditions {
font-style: italic;
font-size:9px;
}
#parrainage_compte h2 {
margin-top:0;
text-transform: uppercase;
border-bottom: 1px solid #f0eeee;
margin-bottom:15px;
}
.parrainage_howTo {
padding:15px 15px;
box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
margin-bottom:15px;
}
.parrainage_howTo a {
color:var(--orange);
font-weight: bold;
}
.coupon_ok {
background-color: rgba(181,238,182,0.5);
padding:10px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
border:1px solid rgba(181,238,182,1);
display:block;
margin-bottom: 15px;
}
.tabParrain {
width: 100%;
border: 1px solid #fff;
}
.tabParrain_head td {
font-weight: bold;
text-align: center;
border: 1px solid #fff;
background-color:var(--orange);
color:#fff;
}
.tabParrain_line:nth-child(even) td {background-color: #fff;}
.tabParrain_line:nth-child(odd) td {background-color: #f0eeee;}
.tabParrain_line td {
text-align: center;
border: 1px solid #fff;
}
.tabParrain_line td a {
font-size:10px;
}
/* PAGE+POPUP PARRAINAGE */
#affiche {
margin-bottom: 10px;
padding: 0;
font-size: 1.4em;
}
.txtParrain {
height: 30px;
padding: 0;
margin: 0;
}
.boxParrain {
position: absolute;
right: 0;
}
.line {
position: relative;
margin: 0 0 10px;
}
.lineTitle {
font-weight: bold;
margin: 5px 0;
padding: 5px 0 0;
border-top: 1px solid #c0c0c0;
}
#titleParrain {
width: 955px;
margin: 20px auto 10px auto;
border-bottom: 2px solid #c0c0c0;
font-size: 16px;
color: var(--orange);
padding: 0 0 5px;
}
.formParrain input {
border: 1px solid #c0c0c0;
background-color: #f0eeee;
}
.formParrain button {float: right;}
#contentTopParrainge {text-align: center;}
#contentLT {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
}
#contentLT > div {margin-top: 20px;}
#mail-share .group-share button {
border-radius: 150px;
box-shadow:none;
background-color:var(--orange);
color:#fff;
font-size:30px;
height:60px;
width:60px;
border:none;
}
#content-parrainage,
#content-parrainage div,
#content-parrainage span {
position: relative;
}
#content-parrainage img { max-width: 100%; }
#content-parrainage h2,
#content-parrainage h2 {
font-family: 'Work Sans', sans-serif;
font-style: normal;
font-size: 1.8em;
text-transform: uppercase;
text-decoration: underline;
}
#content-parrainage h3 {
font-family: 'Work Sans', sans-serif;
font-style: normal;
font-size: 1.3em;
text-transform: uppercase;
}
#content-parrainage h4 {
font-family: 'Work Sans', sans-serif;
font-style: normal;
font-size: 1.3em;
}
#content-parrainage .messageStack {
width: 100%;
padding: 1em 0 1em 0.5em;
margin: 0;
}
#content-parrainage #message_envoi_ok {
display: none;
position: absolute;
z-index: 3;
text-align: center;
width: 100%;
height: 100%;
padding-top: 10em;
background-color: #ffffff;
}
#content-parrainage button { margin-bottom:10px;}
#content-parrainage .milieu > p { font-size: 1.65em; }
#content-parrainage .milieu > p > span {
display: block;
font-family: 'Work Sans', sans-serif;
font-weight:bold;
}
#content-parrainage .milieu > i {
display: block;
margin-bottom: 2.5em;
font-family: 'Work Sans', sans-serif;
font-style: italic;
}
#content-parrainage .p-gauche {
width: 56%;
float:left;
}
#content-parrainage .p-droite {
height: 100%;
width: 44%;
background-color: #ffffff;
float:left;
}
#content-parrainage .p-droite .milieu { height: 88%; padding-left: 50px; }
#content-parrainage .p-droite .bas { height: 12%; padding-left: 50px; }
#bloc-email, #bloc-login { display: none; z-index: 2; }
#content-parrainage #bloc-email .haut {
height: 8%;
font-size: 1.5em;
padding-left: 25px;
text-transform: capitalize;
}
#content-parrainage #bloc-email .haut * { display: inline-block; cursor: pointer; vertical-align: middle; padding: 0; margin: 0; }
#content-parrainage #bloc-email .icon-flecheGauche { font-size: 1.4em; margin-top: -0.1em; }
#content-parrainage #bloc-email .milieu { height: 80%; overflow: auto; }
#content-parrainage #bloc-email .milieu label { display: block; }
#content-parrainage #bloc-email .bas { height: 12%; }
#content-parrainage .group-share:first-child {
border-top: 1px dotted #cccccc;
}
#content-parrainage .group-share:first-of-type button {
display: none;
}
#content-parrainage .group-share {
border-bottom: 1px dotted #cccccc;
padding: 1em 0;
margin-bottom: 1em;
}
#content-parrainage .group-share > div {
display: inline-block;
vertical-align: middle;
width: 70%;
}
#content-parrainage .group-share > div:last-of-type { width: 30%; }
#content-parrainage input {
margin: 0 0 1em;
font-size: 1.3em;
min-height: 30px;
}
#content-parrainage #bloc-email .milieu > span {
padding: 1em 0;
font-size: 1.3em;
cursor: pointer;
display:block;
}
#content-parrainage .group-share > button {
font-size: 1.3em;
}
/* M\85J Parrainage 201806 */
.headerParrainage, .conditionsParrainage, .explicationParrainage {width:100%; clear:both;display:block;}
.headerParrainage div {
width:50%;
display:inline-block;
margin: 20px 0;
text-align:center;
}
.headerParrainage p {
width:50%;
text-align:center;
padding:15px;
border-radius:10px;
border: 1px dotted var(--orange);
display: inline-block;
}
.headerParrainage p span {
font: bold 1.4em 'Work Sans', Arial, sans-serif;
text-transform: uppercase;
display: inline-block;
width: 100%;
color:var(--orange);
}
.headerParrainage h1, #parrainage_compte .headerParrainage h2 {margin-bottom:10px;}
.headerParrainage h2, #parrainage_compte .headerParrainage h3 {
text-align:center;
text-decoration: none !important;
}
#content-parrainage .milieu h3 {
margin:10px 0;
padding-bottom:10px;
font: bold 1.4em 'Work Sans', Arial, sans-serif;
border-bottom: 1px dotted #cccccc;
text-align:center;
}
#content-parrainage .group-share input {
width:40% ;
margin-right:2%;
display:inline-block;
}
.group-share button {width:10%;display:inline-block;}
/* Parrainage compte */
#parrainage_compte .headerParrainage img {width:100%;margin-bottom:10px;}
#parrainage_compte h2 {text-align:center;}
#parrainage_compte .headerParrainage p {
width:90%;
text-align:center;
}
#parrainage_compte .headerParrainage button {
margin:auto;
display:block;
}
#parrainage_compte .headerParrainage{
padding-bottom: 20px;
border-bottom:1px solid #f0eeee;
}
.parrainage_gains {font-size:1.2em;text-align: center!important;}
.parrainage_gains {margin:20px auto 5px;}
.parrainage_gains span:first-child, .parrainage_gains i {font-weight:bold;}
.parrainage_commission {text-align: center!important;}
.bt_commission {font-size:12px;margin-top:10px;display:inline-block;}
.conditionsParrainage {font-size:0.9em;font-style:italic;margin-top:10px;display:inline-block;color:#c0c0c0;}
/*****************************************************
**** @ALERTE NOUVEAUTES
******************************************************/
#contentTopMarquesNouveautes {
position: relative;
margin: 0;
border-top: 1px #c0c0c0 dashed;
padding: 0 0 0 30px;
}
.btn-alerte-nouveaute {
font-weight: bold;
color: #DC4379;
margin: 5px 0 0 50px;
line-height: 18px;
}
.btn-alerte-nouveaute a {color: #DC4379;}
#titreAlerteNouveautes {
font-weight: bold;
text-transform: uppercase;
font-size: 14px;
}
.brand-section {width: 175px;}
#selectType {
margin: 20px 0 0;
padding: 10px 0 0;
height: 40px;
border-bottom:#f8b333 1px solid;
border-top:#f8b333 1px solid;
}
.selectTypeTitle {
width: 238px;
text-align: center;
float:left;
font-size:14px;
}
#txtAlerte {
margin: 0 0 5px 13px;
color: var(--orange);
font-size: 14px;
}
#regForm {
line-height: 18px;
padding: 10px;
margin: 20px 0 0;
background-color: #f0eeee;
}
#regForm input.valider {margin-top: 10px;}
.alerteNewsBrandsValider {
margin: 10px 0 0;
padding: 5px 15px 10px 5px;
clear: both;
text-align: right;
width: 100%;
}
#globalmarques {
margin: 20px 0 0;
padding: 0 10px;
}
.titrenewsbrand {
width: 200px;
height: 20px;
background-color: #fff;
}
#retour_compte_alerte_nouveaute {
margin: -34px 0 0;
float: right;
}
.brand-alert h1{
color:#fff !important;
font-size: 16px !important;
padding: 4px 0 0 10px !important;
}
.title-brand{
border-bottom: none;
color: #5d5d5d;
font-size: 16px;
font-weight: normal;
margin: 0 0 10px;
padding: 0;
text-align: left;
}
/*----- RECRUTEMENT -----*/
.contentEmploi {
position: relative;
text-align: left;
float: left;
width: 298px;
margin: 0;
padding: 0 0 0 30px;
}
.contentStages {
float:left;
position: relative;
text-align: left;
width: 298px;
margin: 0;
padding: 0;
}
.contentCandidature {
float: right;
position: relative;
text-align:justify;
width: 298px;
margin: 0;
padding: 10px 30px 0 0;
}
.recrutementUl {
position:relative;
list-style-type: inherit;
margin: 0;
padding: 0 40px 0 10px;
}
.recrutementVide {margin: 10px 0 0 20px;}
/*****************************************************
**** @TEMOIGNAGES
******************************************************/
.bulle_temoignage {
width: 100%;
margin: auto;
padding: 1em;
background-color: #efefef;
}
.bulle_temoignage p {
width: 95%;
margin: auto;
padding: 0 0 1em 0;
color: #535353;
}
.name_temoignage{
padding: 0 0 1em 0;
color: var(--orange);
}
.bas_temoignage {
height: 20px;
min-height: 20px;
background-image: url(/images/bottom_reviews.gif);
background-repeat: no-repeat;
background-position: 360px 0;
}
#content .ticketView h2 {
padding: 0;
color: #5d5d5d;
background: none;
border-bottom:none;
}
.form-ticketview textarea{
width:100%;
max-width:100%;
max-height:100%;
}
.form-ticketview p {
padding: 2em 0;
text-align: center;
}
.content_ticketView #ticket_no_login { display: none; }
#demandeContact {
padding: 0.5em;
margin: 1.5em 0 0.5em 0;
border: 1px solid #d9d4e0;
width: 40%;
background-color: #efefef;
}
.ticketView .btn-noir {
height: 33px;
margin-left: 1em;
}
#demandeContact > span {
font-weight: bold;
color: var(--orange);
}
/*****************************************************
**** @LANG MENU
******************************************************/
#LangMenu {
position: absolute;
left: 150px;
top: -20px;
width: 130px;
height: 16px;
margin: 0;
padding: 0;
list-style: none outside none;
z-index: 7588;
}
#LangMenu ul {
left: 0;
width: 130px;
}
#LangMenu ul li {
background-color: #efefef;
height: auto;
}
#LangMenu li ul {
list-style: none outside none;
margin: 0;
padding: 0;
display: none;
height: auto;
position: absolute;
background-color: #efefef;
}
#LangMenu img {
margin: 2px 2px -5px;
list-style: none;
}
#LangMenu li:hover {background-color: #efefef;}
#LangMenu ul li:hover {background-color: #c0c0c0;}
#LangMenu li:hover ul {
display: inline;
height: auto;
}
.LangMenuArrow {
margin: -13px 3px;
text-align: right;
z-index: 600;
}
/*****************************************************
**** @CALENDAR
******************************************************/
.calendarParent {
border-collapse: collapse;
margin: auto;
width: 160px;
padding: 0;
}
.calendar, .calendar td, .calendarDayOff td, .calendarDayOff {
border-collapse: collapse;
margin: 0;
padding: 0;
}
.calendar {background-color: #c0c0c0;}
.calendarDayOff {
background-color: #f0eeee;
color: #888;
}
#pickupDate {text-align:center;}
/*****************************************************
**** @netPromoterScore
******************************************************/
#btn_spartooPlus {
cursor: pointer;
position: fixed;
left: 0;
}
#btn_spartooPlus {top: 99px;}
#netPromoterScore {
width: 825px;
margin: auto;
}
#netPromoterScore .btn { font-size: 1.2em; }
#netPromoterScore textarea {
box-sizing: border-box;
border: 1px solid #cccccc;
padding: 0.5em;
margin-bottom: 2em;
width: 100%;
height: 90px;
}
#netPromoterScore h3 {
font-size: 1.5em;
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
padding: 0.5em 0;
}
#netPromoterScore_label > div { display: inline-block; width: 675px; }
#netPromoterScore_btnRadio {
width: 100%;
padding: 1em 0;
cursor: pointer;
}
#netPromoterScore_label > p {
display: inline-block;
box-sizing: border-box;
width: 50%;
padding: 0 1.5em;
margin: 0 0 0 0;
font-size: 1.2em;
text-align: left;
}
#netPromoterScore_label .icon-flecheBas { font-size: 1.5em; }
#netPromoterScore_label > p:last-of-type {
text-align: right;
}
#netPromoterScore_btnRadio > div,
#netPromoterScore_chiffres > span,
#netPromoterScore_label > span {
display: inline-block;
width: 75px;
}
#netPromoterScore .icon-etoile,
#netPromoterScore .icon-etoile-pleine {
font-size: 3em;
color: #d9d4e0;
}
#netPromoterScore .icon-etoile-pleine { color: var(--orange); }
#netPromoterScore_chiffres {
width: 100%;
font-size: 1.3em;
padding-bottom: 2em;
margin-bottom: 1.5em;
border-bottom: 1px solid #cccccc;
}
.left_buttons {
position: fixed;
top: 50%;
left: 0;
transform-origin: top left;
transform: rotate(-90deg);
}
.btn_feedback, #btn_spartooPlus {
display: inline-block;
vertical-align: top;
border-radius: 0 0 5px 5px;
padding: 5px 10px;
margin: 0 10px;
font-size: 12px;
text-transform: uppercase;
background-color:#707070;
color: #fff;
cursor: pointer;
}
.btn_feedback:hover {
padding-top:10px;
box-shadow: 0px 3px 6px -4px rgba(0,0,0,0.75);
}
/*****************************************************
**** @POINTS_INFO
******************************************************/
.points_info_element_bas_gauche {
float: left;
position:absolute;
bottom: 10px;
left: 20px;
}
div.points_info_logo img {
width: 200px;
position:absolute;
bottom: 10px;
right: 10px;
}
.points_info_h2 {
background-image:url(/images/ico_cotes.jpg);
background-repeat: no-repeat;
padding-left:40px;
margin: 0 0 0 20px;
line-height:30px;
}
.points_info_contener {margin: 0;}
.points_info_text {
position: relative;
border: 8px solid var(--orange);
width: 484px;
height: 485px;
}
.points_info_form {
position: relative;
margin: 0;
}
.points_info_plus {
color: var(--orange);
font-weight: bold;
font-size: 16px;
}
.points_info_explain {
margin: auto;
width: 400px;
}
.points_info_explain p {
padding: 1px;
margin: 5px 0;
}
/*****************************************************
**** @MY_CHECK
******************************************************/
.my_check_element_bas_gauche {
position: absolute;
top: 440px;
left: 0;
}
div.my_check_logo img{
width: 200px;
position: absolute;
bottom: 0;
right: 0;
}
.my_check_h2 {
background-image:url(/images/ico_cotes.jpg);
background-repeat: no-repeat;
padding-left: 35px;
line-height:30px;
}
.my_check_contener {
position: relative;
margin: 0;
}
.my_check_text {
position: relative;
border: 8px solid var(--orange);
width: 495px;
height: 485px;
margin: 0 auto 0 0;
padding-left: 40px;
}
.my_check_form {
position: relative;
margin: 0 0 0 40px;
line-height: 18px;
}
.my_check_plus {
color: var(--orange);
font-weight: bold;
font-size:16px;
}
.my_check_decal {margin-left: 20px;}
#check_name {
width: 100%;
margin-bottom: 8px;
}
#check_email {
width: 100%;
margin-bottom: 10px;
}
#check_area {width: 100%;}
.my_check_area {
margin: 0 0 10px 20px;
width: 220px;
height: 130px;
border: 1px solid #ccc;
}
.my_check_readonly {
position: absolute;
top: 210px;
left: 265px;
}
#check_my_name {
width: 100%;
margin-bottom: 8px;
}
#check_my_email {
width: 100%;
margin-bottom: 10px;
}
#check_bt_ok {margin: 15px 0 0 20px;}
/*****************************************************
* Magasins
****************************************************/
#texte_magasin {
margin-top:50px;
display:block;
width:100%;
font-size: 11px;
line-height:15px;
text-align:justify;
}
/*****************************************************
**** @MY_FRIEND
******************************************************/
.myfriend_contener {margin: 0;}
.myfriend_text {
border: 8px solid var(--orange);
width: 495px;
height: 475px;
}
#friend_name, #friend_email { margin-bottom: 5px;}
#my_friend_area, #me_name { margin-bottom: 8px;}
.my_friend_decal {
font: 13px Verdana, Arial, Helvetica, sans-serif;
border: 1px solid #ccc;
}
.my_friend_readonly {
font: 13px Verdana, Arial, Helvetica, sans-serif;
border: 1px solid #ccc;
}
.my_friend_form textarea {
font: 13px Verdana, Arial, Helvetica, sans-serif;
border: 1px solid #ccc;
}
.myfriend_product_name {color: var(--orange);}
div.myfriend_cercle img {margin: 38px 0 0 38px;}
.myfriend_plus {color: var(--orange);}
/*****************************************************
**** @CAROUSEL
******************************************************/
#mycarousel1 li, #mycarousel2 li {
position: relative;
padding-top: 0;
overflow: hidden;
height: 115px;
}
#mycarousel1, #mycarousel2 {
padding-top: 0;
overflow: hidden;
height: 115px;
}
/* SKIN CAROUSEL */
.jcarousel-skin-tango .jcarousel-direction-rtl {direction: rtl;}
.jcarousel-skin-tango .jcarousel-container-horizontal {
width: auto;
padding: 0 30px 0 0;
}
.jcarousel-skin-tango .jcarousel-clip-horizontal {
width: auto;
height: 115px;
}
.jcarousel-skin-tango .jcarousel-item {
width: 110px;
height: 115px;
text-align:center;
}
.jcarousel-skin-tango .jcarousel-item-horizontal {
margin-left: 0;
margin-right: 5px;
}
.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-item-horizontal {
margin-left: 10px;
margin-right: 0;
}
.jcarousel-skin-tango .jcarousel-item-placeholder {
background: #fff;
color: #000;
}
/* Horizontal Buttons */
.jcarousel-skin-tango .jcarousel-next-horizontal {
position: absolute;
top: 15px;
right: 0;
width: 30px;
height: 120px;
cursor: pointer;
background: transparent url(/images/arrow_next.gif) no-repeat 0 0;
}
.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-next-horizontal {
left: 0;
right: auto;
background-image: url(prev-horizontal.png);
}
.jcarousel-skin-tango .jcarousel-next-horizontal:hover {
background-position: -32px 0;
background: transparent url(/images/arrow_next_over.gif) no-repeat 0 0;
}
.jcarousel-skin-tango .jcarousel-next-horizontal:active {
background-position: -64px 0;
}
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active {
cursor: default;
background-position: -96px 0;
}
.jcarousel-skin-tango .jcarousel-prev-horizontal {
position: absolute;
top: 15px;
left: -25px;
width: 30px;
height: 120px;
cursor: pointer;
}
.jcarousel-skin-tango .jcarousel-direction-rtl .jcarousel-prev-horizontal {
left: auto;
right: 5px;
background-image: url(next-horizontal.png);
}
.jcarousel-skin-tango .jcarousel-prev-horizontal:hover {background-position: -32px 0;}
.jcarousel-skin-tango .jcarousel-prev-horizontal:active {background-position: -64px 0;}
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {
cursor: default;
background-position: -96px 0;
}
/*****************************************************
**** @
******************************************************/
/* sprites couleurs*/
ul.couleur li{
width:12px;
float:left;
list-style-type:none;
}
.couleur_1, .couleur_4, .couleur_blanc, .couleur_8, .couleur_7, .couleur_13, .couleur_15, .couleur_25, .couleur_28, .couleur_35, .couleur_38, .couleur_41, .couleur_46, .couleur_594, .couleur_19, .couleur_31, .couleur_6887 {
float: left;
margin:2px;
cursor: pointer;
padding: 0;
height:12px;
width:12px;
}
.couleur_1 {background: url(/images/flags_colors.gif) no-repeat -2px -128px;}
.couleur_4 {background: url(/images/flags_colors.gif) no-repeat -16px -128px;}
.couleur_7 {background: url(/images/flags_colors.gif) no-repeat -30px -128px;}
.couleur_8 {background: url(/images/flags_colors.gif) no-repeat -44px -128px;}
.couleur_13 {background: url(/images/flags_colors.gif) no-repeat -58px -128px;}
.couleur_15 {background: url(/images/flags_colors.gif) no-repeat -72px -128px;}
.couleur_19 {background: url(/images/flags_colors.gif) no-repeat -86px -128px;}
.couleur_25 {background: url(/images/flags_colors.gif) no-repeat -2px -142px;}
.couleur_28 {background: url(/images/flags_colors.gif) no-repeat -16px -142px;}
.couleur_35 {background: url(/images/flags_colors.gif) no-repeat -30px -142px;}
.couleur_38 {background: url(/images/flags_colors.gif) no-repeat -44px -142px;}
.couleur_41 {background: url(/images/flags_colors.gif) no-repeat -58px -142px;}
.couleur_46 {background: url(/images/flags_colors.gif) no-repeat -72px -142px;}
.couleur_594 {background: url(/images/flags_colors.gif) no-repeat -86px -142px;}
.couleur_31, .couleur_6887 {background: url(/images/flags_colors.gif) no-repeat -2px -156px;}
/*****************************************************
**** @JQUERY SLIDER RANGE
******************************************************/
#slider-range-srub {
width: 160px;
margin-left: 10px;
}
#slider-range-srub a{
background-image: none;
padding: 0;
margin: 0;
}
/* Interaction Cues
----------------------------------*/
.ui-state-disabled { cursor: default !important; }
/* Overlays */
.ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--orange); opacity: .50;filter:Alpha(Opacity=50); }
/* Component containers
----------------------------------*/
.ui-widget { font: 1.1em Trebuchet MS, Tahoma, Verdana, Arial, Helvetica, sans-serif; }
.ui-widget .ui-widget { font-size: 1em; }
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font: 1.3em Trebuchet MS, Tahoma, Verdana, Arial, Helvetica, sans-serif; }
.ui-widget-content { border: 1px solid #fff; background: #c0c0c0; color: #363636; }
.ui-widget-content a { color: #363636; }
.ui-widget-header { background: #888; }
.ui-widget-header a { color: #fff; }
/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #ccc; background: #fafafa; font-weight: bold; color: #1c94c4; }
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #1c94c4; text-decoration: none; }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #ffcc00; background: #fdf5ce; font-weight: bold; color: #c77405; }
.ui-state-hover a, .ui-state-hover a:hover { color: #c77405; text-decoration: none; }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #fbd850; background: #fff; font-weight: bold; color: #eb8f00; }
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #eb8f00; text-decoration: none; }
.ui-widget :active { outline: none; }
/* Corner radius */
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { -moz-border-radius-topleft: 2px; -webkit-border-top-left-radius: 2px; -khtml-border-top-left-radius: 2px; border-top-left-radius: 2px; }
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { -moz-border-radius-topright: 2px; -webkit-border-top-right-radius: 2px; -khtml-border-top-right-radius: 2px; border-top-right-radius: 2px; }
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { -moz-border-radius-bottomleft: 2px; -webkit-border-bottom-left-radius: 2px; -khtml-border-bottom-left-radius: 2px; border-bottom-left-radius: 2px; }
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { -moz-border-radius-bottomright: 2px; -webkit-border-bottom-right-radius: 2px; -khtml-border-bottom-right-radius: 2px; border-bottom-right-radius: 2px; }
/* Overlays */
.ui-widget-shadow { margin: -5px 0 0 -5px; padding: 5px; background: #000000; opacity: .20;filter:Alpha(Opacity=20); -moz-border-radius: 5px; -khtml-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.ui-slider { position: relative; text-align: left; }
.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 0.5em; height: 1.5em; cursor: pointer; }
.ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; }
.ui-slider-horizontal { height: .5em; }
.ui-slider-horizontal .ui-slider-handle { top: -.5em; margin-left: -.6em; }
.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; }
.ui-slider-horizontal .ui-slider-range-min { left: 0; }
.ui-slider-horizontal .ui-slider-range-max { right: 0; }
/*****************************************************
**** @MAGIC ZOOM
******************************************************/
#magicZoomGlobal {
position: absolute;
width: 800px;
height: 700px;
top: 0;
left: 80px;
background-color: #fff;
display: none;
z-index: 500;
border: 2px solid black;
}
#magicZoomClose {
position:absolute;
right:10px;
top:10px;
text-align:right;
width:200px;
}
#magicZoomProducts {
margin:auto;
width:700px;
height:600px;
border:1px solid #C0C0C0;
}
#magicZoomProduct {
width:600px;
height: 600px;
float:left;
cursor:url(/images/loupe.cur), pointer;
}
#magicZoomProductsBig {
position:relative;
margin:auto;
width:700px;
height:600px;
border:1px solid #C0C0C0;
display:none;
overflow:hidden;
}
#magicZoomProductBigParent {
width:1700px;
height:1800px;
position:absolute;
top:-600px;
left:-500px;
}
#magicZoomProductBig {
width:1200px;
height: 1200px;
position:absolute;
top:300px;
left:250px;;
cursor: move;
}
.magicZoomMiniatures {
width:70px;
height:70px;
margin:5px;
border:1px solid #C0C0C0;
cursor:pointer;
}
.magicZoomMiniatures:hover {border:1px solid var(--orange);}
#marketing_comparator_display, #store_id_not_found {
position: absolute;
z-index: 20;
left: 50%;
width: 300px;
margin-left: -150px;
padding: 3px;
border: 3px solid #c0c0c0;
background: #fff;
font-weight: bold;
text-align: center;
font-size: 12px;
}
#marketing_comparator_display {
top: 50%;
}
#store_id_not_found p {
padding-left: 15px;
padding-right: 15px;
}
/*****************************************************
**** @CHECKOUT
******************************************************/
#txthorsoldes {
float:left;
width:320px;
margin-top:50px;
}
#imgtxthorsoldes {
float:left;
margin-top:20px;}
#bordertxthorsolde {
border: 1px solid #ccc;
margin-top: 240px;
width: 750px;
}
.windowPayment {
display: none;
position: absolute;
width: 515px;
height: auto;
left: 50%;
margin: 0 0 0 -257px;
padding: 0;
z-index: 101;
top: 120px;
background-color: #fff;
border: 1px solid #fff;
-moz-box-shadow: 0 3px 10px 0 #000000;
-webkit-box-shadow: 0 3px 10px 0 #000000;
box-shadow: 0 3px 10px 0 #000000;
/* For IE 5.5 - 7 */
filter:progid:DXImageTransform.Microsoft.Shadow(color=#000000, Direction=180, Strength=10);
}
/* .windowPayment {width: 930px;} */
.windowShippingAddressRight {
display: none;
position: absolute;
width: 381px;
height: 400px;
left: 50%;
margin: 0 0 0 220px;
padding: 0;
top: 120px;
z-index: 101;
background-color: #fff;
border: 1px solid #fff;
-moz-box-shadow: 0 3px 10px 0 #000000;
-webkit-box-shadow: 0 3px 10px 0 #000000;
box-shadow: 0 3px 10px 0 #000000;
/* For IE 5.5 - 7 */
filter:progid:DXImageTransform.Microsoft.Shadow(color=#000000, Direction=180, Strength=10);
}
#securepayment_title_boxe {
width: 100%;
height: 42px;
color: #fff;
text-align: center;
font-size: 14px;
font-weight: bold;
line-height: 42px;
text-shadow: 0 /*{a-bar-shadow-x}*/ -1px /*{a-bar-shadow-y}*/ 1px /*{a-bar-shadow-radius}*/#bc1d4a /*{a-bar-shadow-color}*/;
background-color: var(--orange);
text-transform: uppercase;
}
.address_red,.address_grey{
float: left;
width: 190px;
min-height: 170px;
margin: 10px 0 0 12px;
padding: 10px;
-moz-border-radius: 3px;
-web-kit-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
}
.address_red{border:2px solid #da0673;}
.address_grey{
border:2px solid #ccc;
color: #888888;
}
#newShippingAdress .line {
width: 100%;
}
#newShippingAdress .label {
width: 48%;
padding-right: 2em;
text-align: right;
display: inline-block;
}
#newShippingAdress .inputGrey {
margin-top: -3px;
height: 25px;
width: 90%;
box-sizing: border-box;
-moz-border-radius: 3px;
-web-kit-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
}
.separe_bt {
display: inline-block;
width: 20px;
}
/* kiala */
.kialaSelection {
position: relative;
margin: 0 auto;
padding: 10px 0 0;
width: 480px;
z-index: 200;
}
.kialaSelectionReturnIE{
position: absolute;
left: 10px;
top: 30px;
margin: 0;
padding: 20px 0 0;
width: 480px;
z-index: 200;
background: url(/includes/languages/french/images/kialaBg.gif) left top no-repeat;
}
.map_ib_horaire_tab {
font-size:10px;
width:100%;
border-collapse:collapse;
border: 0 none;
}
.map_ib_horaire_tab td{
border-collapse:collapse;
border: 0 none;
}
#shipping_relais_pay{ text-align: center; }
#shipping_relais_pay > img[src*="ico"]{
margin:15px 0 0 15px;
padding:0;
}
#shipping_relais_pay > span{ display: block; }
#shipping_relais_pay > span strong{
margin:0;
padding:0;
font-size:12px !important;
color:var(--orange);
}
.relais-post { text-align: center; font-size: 13px; margin-bottom: 2em; }
.relais-post > div,.relais-post > input {display: inline;}
.relais-post > input { font-size: 13px; padding: 0.5em 0.25em; margin-left: 1em; text-align: center; }
.tab_line_odd {
width: 100%;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
.tab_line_even { width: 100%; }
.map_list_ul {
list-style-type: none;
padding: 0;
}
.map_list_li {
display: block;
margin: 0;
padding: 1em 0 1em 1em;
text-align: left;
border-bottom: 1px solid #c0c0c0;
width: 100%;
}
.map_list_name {
display: block;
margin: 2px 0;
padding: 0;
font-family:'Work Sans', Arial, sans-serif;
}
.map_list_name > span { color: var(--orange); }
.map_list_addr {
display: block;
margin: 0.5em 0 1em 0;
padding: 0;
text-transform: lowercase;
}
.map_ib_button{
text-align:center;
font-size :11px;
font-weight:bold;
text-transform: uppercase;
}
/*.map_list_button, .map_list_button_select {text-align: center;}*/
#listContent .map_ib_horaire,
.relais_horaires_main { display: none; }
.relais_horaires_day {
display: inline-block;
width: 20%;
}
.map_list_button, .map_list_button_select {
text-align:center;
}
.map_list_icon {
display: inline-block;
vertical-align: middle;
padding-right:5px;
}
.return_button{
margin-top: 10px;
margin-left: 740px;
}
.windowPayment select { display: block; margin: 2em auto; }
.windowPaymentLarge {
margin: 0 0 0 -466px;
width: 930px;
}
/* Multibanco checkout Success */
#text_multibanco {
border: 4px solid #d5d5d5;
padding: 20px;
width: 415px;
margin: 0 0 0 40px;
}
.iconValiderContainer {
width: 50px;
height: 50px;
border-radius: 25px;
font-size: 50px;
color: #fff;
background-color: #a3d109;
line-height: 50px;
}
h1 {
font: 200 40px/40px var(--font-main-medium);
}
.nameCmd {
font-size: 24px;
}
.infoPoints {
text-align: center;
font-size: 16px;
}
.infoPointsButtons {
display: flex;
justify-content: center;
margin: 10px auto 20px auto;
color: #fff;
text-transform: uppercase;
}
.infoPointsButton {
background-color: #707070;
margin: 10px;
font-family: 'Work Sans', sans-serif;
font-weight:bold;
cursor: pointer;
}
.infoPointsButton a {
color: #fff;
font-family: 'Work Sans',Arial, sans-serif;
font-weight:bold;
text-decoration: none;
}
a.facture {
color: #fff!important;
text-decoration: none!important;
font-weight: normal!important;
}
.infoPointsButton > div {
position: relative;
text-align: center;
font-size: 25px;
display: inline-block;
vertical-align: middle;
width: 30px;
height: 50px;
background-color: #e6e6e6;
}
.infoPointsButton > p {
font-size: 14px;
display: inline-block;
vertical-align: middle;
background-color: #707070;
margin: 0 20px 0 30px;
}
.infoPointsButton i {
color: #707070;
top: 12px;
left: 10px;
z-index: 5;
position: absolute;
display: block;
}
.arrowDiv {
position: absolute;
right: -18px;
top: 8px;
background-color: #e6e6e6;
transform: rotate(45deg);
width: 35px;
height: 35px;
}
.recapCmdTitle {
font-size: 18px;
padding: 10px;
background-color: #e6e6e6;
}
.recapProductList {
border: none;
border-bottom: 1px solid #e6e6e6;
padding: 10px;
margin: 0px auto;
width: 100%;
min-height: 120px;
}
.recapProductList div, .recapProductList img{
vertical-align: middle;
}
.orderTotal {
width: 100%;
padding: 10px;
margin: auto;
font-size: 24px;
text-align: left;
background-color: #fff;
color: #363636;
}
.orderAdress {
width: 100%;
margin: auto;
font-size: 14px;
padding: 10px;
border: none;
border-bottom: 1px solid #e6e6e6;
}
.checkout_success_content {
display: flex;
justify-content: space-between;
}
.checkoutRecap {
max-width: 800px;
width: 67%;
}
.checkoutServices {
padding: 0 20px;
flex: 1;
}
.checkoutServices > div:first-of-type {
border: 5px solid #e6e6e6;
padding: 20px;
text-align: center;
}
.checkoutServices > div:first-of-type i {
font-size: 20px;
display: block;
width: 30px;
height: 30px;
background-color: #707070;
border-radius: 50%;
margin: auto;
color: #fff;
line-height: 30px;
margin-top: 10px;
}
.engagement_txt_checkout {
display: block;
text-transform: none;
font-size: 14px;
width: auto;
border-bottom: 1px solid #e6e6e6;
}
.engagement_txt_checkout:last-of-type {
border-bottom: none;
}
.checkoutServicesTitle {
font-size: 18px;
}
.thanks4checkout {
font-size: 24px;
text-align: center;
margin: 20px auto;
}
.checkout_insta_container {
text-align: center;
}
.home_title_insta {
font-size: 18px;
}
.home_title_insta i {
display: block;
font-size: 36px;
}
.recapProductList>div {
width: 75%;
display: inline-block;
font-size: 12px;
margin-left: 3%;
}
.survey_bloc {
display:block;
box-sizing: border-box;
padding: 0 20px;
width:100%;
background: #c6c6c6 url("/images/banfincde.jpg") no-repeat right / 65% 100%;
}
.survey_bloc p {
width:90%;
margin: 0 0;
color:#fff;
font-size:12px;
}
.survey_bloc p:first-child {
margin:10px 0 0;
display:inline-block;
font: bold 20px 'Work Sans', Arial, sans-serif;
text-transform: uppercase;
}
.survey_bloc span {
color:var(--orange);
display:inline-block;
width:100%;
font: bold 16px/16px 'Work Sans', Arial, sans-serif;
text-transform: uppercase;
}
.survey_bloc p:last-child {
margin: 5px 0 10px 0;
display:inline-block;
text-transform:uppercase;
font: 14px 'Work Sans', Arial, sans-serif;
}
.survey_bloc i {vertical-align: -2px;}
.socolissimoResult {border-top : 1px solid #e26f33;}
/*****************************************************
**** @PAGE NEWSLETTER
******************************************************/
#management {
margin: 10px 0;
padding: 0;
min-height: 50px;
}
.bg_centre2 {
height: 22px;
line-height: 20px;
min-width: 180px;
color: #363636;
text-align: center;
font-style: normal;
padding-right: 20px;
}
#form_desabo {
margin: 20px auto;
padding: 0;
}
.button_valid_news, .frequence {
margin: 5px 0 0 82px;
padding: 0;
}
.desabo > input[type^=submit] {margin: 5px 0 0 64px;}
#div_cause2, #div_conccurent3 {
margin: 5px 0 0 66px;
padding: 0;
}
#content .reasons, #content .abonnement, #content .desabo {
margin: 10px 10px !important;
padding: 0 !important;
width: 100% !important;
height: 100% !important;
}
#content .reasons > h2, #content .abonnement > h2, #content .desabo > h2 {
font-size: 18px;
color: var(--orange);
margin-bottom: 10px;
border-bottom:none;
}
#content .reasons > h2 > b, #content .abonnement > h2 > b, #content .desabo > h2 > b {
font: 50px 'Work Sans',Arial,sans-serif;
color: var(--orange);
}
#content .abonnement > h2, #content .desabo > h2 {color: var(--orange);}
.reasons ul {margin: 10px 0 60px 20px;}
.reasons ul li {
margin: 35px 5px;
padding: 0 0 40px 0;
display: inline;
width: 210px;
height: 149px;
float: left;
font: 14px Georgia, serif;
text-align: center;
list-style: none;
cursor: pointer;
border-bottom: 5px solid var(--orange);
}
.reasons li:hover {border-bottom: 5px solid #000;}
.reasons ul > li > a {
margin: 82px 0 0 0;
color: var(--orange);
width: 210px;
height: 149px;
position: relative;
top: 140px;
}
.reasons ul > li > a > strong {
font-size: 18px;
font-weight: bold;
}
.reasons ul > li > a:hover {color: #000;}
.reasons ul > li:first-child {background: url(/images/news.jpg) no-repeat center left;}
.reasons ul > li:first-child + li {background: url(/images/affaires.jpg) no-repeat center left;}
.reasons ul > li:first-child + li + li {background: url(/images/ventes.jpg) no-repeat center left;}
.reasons ul > li:first-child + li + li + li {background: url(/images/tendances.jpg) no-repeat center left;}
.abonnement > input[type^=submit] {margin: 20px 0 0 85px;}
.abonnement p{
margin:40px 20px 0;
padding:0;
text-align:justify;
}
.abonnement ul{
margin:5px 0 50px;
padding:0;
width:900px;
text-align:left;
}
.abonnement li{
margin:35px 5px;
padding:0;
display:block;
max-width:100%;
text-align:left;
line-height:20px;
list-style:none;
}
.abonnement li img, .abonnement li .flags div, .flags .abonnement li div {
margin: 5px 15px 5px 5px;
padding: 0;
}
.abonnement li input {
margin: -8px 0 0 0;
padding: 0;
}
.abonnement li strong {
margin: 0 0 0 5px;
max-width: 100%;
font: 1.8em 'Work Sans',Arial,sans-serif;
text-transform: uppercase;
color: #434343;
}
.abonnement li em {
margin: 0 0 0 5px;
max-width: 100%;
font: normal normal 1.8em 'Work Sans',Arial,sans-serif;
color: var(--orange);
}
#desabo_ label {
margin: 0 0 0 5px;
padding: 0;
font-size: 1.2em;
}
#desabo_ {
/* margin: 0 0 0 65px; */
padding: 0;
}
.desabo em {
max-width: 100%;
font-style: normal;
color: var(--orange);
}
#content .tendances {
margin: 45px auto 20px 20px;
font-family: Georgia, serif;
width: 880px;
}
#content .tendances h3 {
margin: 0 auto;
padding: 0 0 0 20px;
font: italic 20px/55px Georgia, serif !important;
color: #fff;
height: 55px;
background-image: none;
background-repeat: no-repeat;
background-color: var(--orange);
}
.tendances ul {
margin: 0 auto;
padding: 0;
width: 900px;
}
.tendances li {
margin: 25px 5px 10px 7px;
display: inline-block;
width: 202px;
height: 210px;
text-align: center;
line-height: 20px;
list-style: none;
border: 1px solid var(--orange);
font-style: italic;
position: relative;
cursor: pointer;
}
.tendances li:hover {border: 1px solid #000;}
.tendances li a {
margin: 0 auto;
display: inline-block;
width: 202px;
height: 210px;
text-align: center;
line-height: 20px;
color: #fff;
}
.tendances ul > li > a {margin: 162px 0 0;}
.tendances ul > li > a:first-line {
text-transform: uppercase;
font-size: 18px;
font-weight: bold;
}
.tendances ul > li > a:hover {color: #000;}
.tendances ul > li:first-child {background: url(/images/too.jpg) no-repeat center left;}
.tendances ul > li:first-child + li {background: url(/images/look.jpg) no-repeat center left;}
.tendances ul > li:first-child + li + li {background: url(/images/tendance.jpg) no-repeat center left;}
.tendances ul > li:first-child + li + li + li {background: url(/images/style.jpg) no-repeat center left;}
/*Cas Particulier pour la typo*/
.tendances ul > li:first-child + li + li > a {
text-transform: uppercase !important;
font-size: 18px;
font-weight: bold;
}
.reasons h2, .abonnement h2, .desabo h2 {
padding: 0 0 0 42px;
font: lighter 20px/85px Verdana, Arial, Helvetica, sans-serif;
text-transform: uppercase;
color: var(--orange);
height: 54px;
/* background: url(/images/one.jpg) no-repeat bottom left; */
}
/*.abonnement h2 {background: url(/images/two.jpg) no-repeat bottom left;}
.desabo h2 {background: url(/images/tree.jpg) no-repeat bottom left;}
*/
.reasons hr, .abonnement hr, .desabo hr {
margin: 0 0 0 20px;
border-top: 1px solid #363636;
border-left: none;
border-right: none;
border-bottom: none;
background-color: none;
}
.not-found {
margin: 10px 0;
position: absolute;
}
/****End new Faq****/
#envoi_1 > table, #paiement_6 > table{
margin: 15px 0 15px 55px;
padding:0;
max-width:100%;
border-collapse: collapse;
border:1px solid #5d5d5d;
}
#envoi_1 > table tr:first-child, #paiement_6 > table tr:first-child{
margin:0;
padding:5px 0;
max-width:100%;
min-height:40px;
text-align:center;
color:#fff;
background-color:#5d5d5d;
border:1px solid #5d5d5d;
}
#envoi_1 > table tr+tr, #paiement_6 > table tr+tr{
margin:0;
padding:0;
font-family: Arial, sans-serif;
color:#5d5d5d;
}
#envoi_1 > table td, #paiement_6 > table td{
margin:0;
padding:5px 5px;
max-width:450px;
text-align:center;
border:1px solid #5d5d5d;
}
#envoi_1 > table td > em, #paiement_6 > table td > em{
margin:5px 0;
padding:0;
font-family: Georgia,serif;
line-height:45px;
color:var(--orange);
}
/*****************************************************
**** @PAGE PARRAINAGE
******************************************************/
.selected-menu{background-color:#000 !important;}
.not-selected{display:none;}
._black{color:#363636 !important;}
#fade{
display:none;
background:#000;
position:fixed;
left:0;
top:0;
width:100%;
height:100%;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
opacity:.80;
z-index:1000;
}
a .btn_to_close{ margin:5px 0; float:right !important}
#mentions-p {
text-align: justify;
margin:10px 0 0;
padding:0 5px;
font:italic 12px "Arial", sans-serif;
color:#363636;
}
.section-mentions ~ .grid_4{
padding:10px 0;
height: 120px;
border-top:1px solid #363636;
border-bottom:1px solid #363636;
}
.section-mentions span{font-size:16px; color:var(--orange);}
.section-mentions span > strong{
margin:0;
padding:0;
color:#363636;
}
.section-mentions > h4{
margin:0;
padding:0;
text-transform: uppercase;
}
.section-mentions p{margin:10px 0; padding:0; color:#363636;}
.section-mentions p > strong{margin:0; padding:0;}
.section-mentions p > em{
margin:0;
padding:0;
text-transform:uppercase;
color:var(--orange);
}
/*****************************************************
**** @BAN
******************************************************/
.ban_tracker {
margin: -204px 0 0;
padding: 0;
width: 252px;
height: 612px;
position: absolute;
top: 236px;
right: -10px;
}
/*****************************************************
**** @VALID FORM
******************************************************/
.valid {
margin: 20px 0 5px 14px;
padding: 0;
width: 890px;
}
.valid a {
margin: 0;
padding: 0;
}
#continue_achat, #ajouter_panier, #go_mine {
margin: 0 0 0 5px;
text-align: center;
cursor: pointer;
}
#ajouter_panier {margin: 0 5px;}
#continue_achat:hover, #ajout_panier:hover {color: var(--orange);}
#box, #box2 {
position: fixed;
top: -600px;
left: 30%;
right: 30%;
background-color: #fff;
color: #7F7F7F;
padding: 20px;
min-width: 470px;
z-index: 500;
border: 2px solid var(--orange);
}
#box2 {
min-width: 340px;
text-align: center;
}
#box2 span {
margin: 10px 10px;
padding: 0;
font: 18px/25px 'Work Sans',Arial,sans-serif;
text-transform: uppercase;
text-align: center;
background-color: inherit !important;
color: var(--orange);
}
/*****************************************************
**** @POPUP WISHLIST PRODCARD
******************************************************/
.popup_wish {
margin: 0;
padding: 0;
width: 350px;
float: right;
}
.popup_wish p {border-bottom: 1px solid #929292 !important;}
.button_wish {
margin: 0;
padding: 0;
width: 100%;
height: 32px;
text-align: center;
overflow: hidden;
}
.button_popup_wish {
margin: 0 auto;
padding: 0;
width: 100%;
text-align: center;
overflow: hidden;
}
.button_popup_wish > input:first-child {margin-right: 2%;}
#continue-shopping, #just-add, #add-see {font-size: 13px;}
#continue-shopping:hover, #just-add:hover, #add-see:hover {color: #e6e6e6;}
#overlay_new #box_new {
-moz-box-shadow: 0 4px 6px 0 #363636;
-webkit-box-shadow: 0 4px 6px 0 #363636;
box-shadow: 0 4px 6px 0 #363636;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#363636, Direction=180, Strength=6);
}
#overlay_new #box_new .select-style {
border: 1px solid #ccc;
background-color: #fafafa;
background: #fafafa url("/images/arrowDown_grey.gif") no-repeat 95% 50%;
}
#overlay_new #popup_alert { color: red; }
/* FIN POPUP WHISHLIST PRODCARD */
#overlay, #overlay-push {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 100;
background: rgba(0,0,0,0.5);
}
#boxClose, #boxClose2, #boxClose-push {
width: 30px;
height: 30px;
position: absolute;
right: -15px;
top: -15px;
border-radius: 15px;
background: #fff url(/images/btn_close.png) no-repeat center center;
cursor: pointer;
border: 2px solid var(--orange);
}
.registration_error {
color:red;
font-size:0.9em;
width: 100%;
text-align: left;
text-indent: 5px;
font-style: italic;
color: crimson;
}
/*****************************************************
**** @CARTE CADEAU
******************************************************/
#contentTopChequeCadeau h1 {
padding: 10px 0 3px 0;
text-align:center;
font:normal 36px "Arial", sans-serif;
color:#5d5d5d;
}
#contentTopChequeCadeau h1 span {font-size:18px;}
.section-vourcherAccroche {
width:50%;
display: inline-block;
vertical-align:middle;
}
.section-vourcherAccroche h2 {
font-size:18px;
margin-bottom:20px;;
font-style:normal;
}
.section-vourcherAccroche p {font-style:italic;}
.section-vourcherAccroche h2 span:first-child {
line-height:40px;
height:40px;
width:40px;
color: var(--orange);
font-size:40px;
display: inline-block;
margin-right: 0;
text-align: center;
background-color: #fff !important;
border-radius: 0;
}
.section-vourcherAccroche h2 span:last-child {
font-size:18px;
font-style:normal;
color:#000;
background-color: #fff !important;
border-radius: 0;
width:80%;
text-align:left;
line-height:25px;
margin-top:30px;
}
.section-vourcherImg {
width:50%;
display: inline-block;
vertical-align:middle;
text-align:center;
margin-bottom:20px;
}
#form-vourcher {
background:url(/images/servicecadeau_bg.jpg);
padding:25px 0;
margin-top: 40px;
}
#submit-vourcher {
margin: 10px auto auto auto;
border:1px dotted var(--orange);
width:75%;
background-color:#fff;
-webkit-box-shadow: 0 0 8px -1px rgba(0,0,0,0.48);
-moz-box-shadow: 0 0 8px -1px rgba(0,0,0,0.48);
box-shadow: 0 0 8px -1px rgba(0,0,0,0.48);
}
.form-voucher-left {float:left;width:50%;}
.form-voucher-right {float:right;width:50%;}
.fields label {text-transform:uppercase;}
#submit-vourcher > .fields:last-child {
margin-top:15px;
clear:both;
}
.section-vourcherMagasins {
font:22px Georgia, serif;
text-align:center;
}
#submit-vourcher input {width:80%;}
.section-vourcher h3 { margin: 0 0 15px 0; padding:0;}
.section-vourcher #titre_conditions_ope_noel_cheque {font: 1.3em 'Work Sans', Arial, sans-serif;}
.section-vourcher #conditions_ope_noel_cheque { font-size: 1.1em; }
#submit-vourcher .fields { text-align: center; padding: 1% 0; margin-bottom: 2%; }
#submit-vourcher .fields label { display: block; margin-bottom: 1.5%;font-size:13px; }
#submit-vourcher input,
#submit-vourcher textarea,
#submit-vourcher select { box-sizing:border-box;width:80%;margin:auto;text-align:center;font-family:inherit;font-size:12px; }
#submit-vourcher textarea { height:180px; resize: none; }
#error-vourcher { width:100%;padding:3%;color:var(--orange); }
#submit-vourcher .error-elements {border: 1px solid var(--orange);}
@media screen and (max-width: 950px) {
.section-vourcherImg {width:100%;}
.section-vourcherImg img {width:75%;max-width:350px;}
.section-vourcherAccroche {width:100%;}
.form-voucher-left {width:100%;}
.form-voucher-right {width:100%;}
}
@media screen and (max-width: 400px) {
#form-vourcher {background:none;padding:0;}
#submit-vourcher {width:100%;}
}
/* Styles ancienne page cheques cadeau */
#cheque-bg { display:none; position: absolute; z-index: 1000; background:rgba(0,0,0,0.5);width:100%;}
#form-vourcher .scroll-colors { padding: 1% 0; margin-bottom: 2%; }
#filter-vourcher {
display: block;
box-sizing: border-box;
-moz-box-sizing: border-box;
margin: 0;
padding: 0;
}
#filter-vourcher li {
display: inline-block;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 19%;
margin: 0 0.5%;
padding: 1.2%;
color: #fff;
list-style-type: none;
text-transform: uppercase;
text-align: center;
font-size: 1.2em;
background-color: #cc0044;
cursor: pointer;
}
#filter-vourcher li.selected { background-color: #000; color: #fff; }
#filter-vourcher li a {
display: block;
width: 100%;
text-decoration : none;
color: #fff;
}
#content-img-cheques {
display: block;
width: 100%;
margin-bottom: 1%;
text-align: center;
}
#content-img-cheques img { max-width: 100%;}
#content-img-cheques > div {
float: left;
position:relative;
width: 30%;
padding: 10px;
margin: 2% 1.65% 0;
border: 8px solid #fff;
background-color: #fff;
-moz-box-shadow: 0 0 8px 0 #999999;
-webkit-box-shadow: 0 0 8px 0 #999999;
box-shadow: 0 0 8px 0 #999999;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#999999, Direction=NaN, Strength=8);
}
.cheque-visualisation {
box-sizing:border-box;
display: block;
position: relative;
z-index:1000;
width: 905px;
height: 550px;
margin: auto;
padding: 0;
text-align: center;
border: 1px solid #c0c0c0;
background-color: #fff;
}
.cheque-visualisation .cheque-bg { float:left; width: auto; margin: 0; }
.cheque-visualisation .cheque-visu { float:left; width: auto; margin: 15px 0 0 15px; }
.cheque-visualisation .cheque-footer { position:absolute; z-index:3; bottom:10px; width:100%; }
.cheque-visualisation .cheque-footer button { width: 250px; }
.cheque-visualisation-close { display: block; width:99%; padding:1% 0; text-align:right; font-size:1.3em; }
#content-img-cheques > div.selected { border: 8px solid #cc0044; }
.vourcher-choice:hover {
zoom: 1;
filter: alpha(opacity=100);
opacity: 1;
-webkit-transition: opacity .30s ease-in-out;
-moz-transition: opacity .30s ease-in-out;
-o-transition: opacity .30s ease-in-out;
transition: opacity .30s ease-in-out;
}
.vourcher-choice {
zoom:1;
filter: alpha(opacity=0);opacity: 0.0;
-webkit-transition: opacity .30s ease-in-out;
-moz-transition: opacity .30s ease-in-out;
-o-transition: opacity .30s ease-in-out;
transition: opacity .30s ease-in-out;
position:absolute;width: 100%;height:100%;top:0;left:0;background:rgba(255,255,255,0.8); padding-top:23%}
.vourcher-choice button { width: 70%; margin: 0 0 1.5% 0; padding: 2% 0; }
/*****************************************************
**** @PAGE CODE REDUC
******************************************************/
#contener_code_reduction,
#contener_code_reduction div,
#contener_code_reduction p,
#contener_code_reduction span {
box-sizing: border-box;
}
.div_code_reduction {
display: inline-block;
position: relative;
width: 49%;
padding: 1.5%;
-moz-box-shadow: 2px 2px 4px #ccc;
-webkit-box-shadow: 2px 2px 4px #ccc;
box-shadow: 2px 2px 4px #ccc;
filter: progid:DXImageTransform.Microsoft.Shadow(color='#cccccc', Direction=135, Strength=8);
zoom: 1;
}
.div_code_reduction img { max-width: 100%; }
.div_code_reduction_right {
position: absolute;
top: 22%;
text-align: center;
width: 100%;
margin: auto;
color: #ffffff;
}
.div_code_reduction_right p {
font-size: 2.5em;
margin: 0;
padding: 0;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
}
.pourcent_reduc {
display: block;
margin-bottom: -20px;
font-family: 'Work Sans', sans-serif;
font-size: 7em;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
}
.with_code {
display: block;
width: 40%;
margin: 1.2em auto auto auto;
color: #363636;
background-color: #ffffff;
font-size: 1.5em;
}
.with_code b {
display: block;
font-size: 1.2em;
}
.bt_code_reduc {
display: block;
margin-top: 1.2em;
font-size: 1.5em;
text-transform: uppercase;;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
color: #ffffff;
}
#code_reduc_conditions { margin-top: 20px; }
/* FIN page code reduction */
.rentree {
margin: auto;
padding: 10px;
font-size: 15px;
background-color: #7d899e;
color: #fff;
text-align: center;
-moz-box-shadow: 2px 2px 4px #ccc;
-webkit-box-shadow: 2px 2px 4px #ccc;
box-shadow: 2px 2px 4px #ccc;
filter: progid:DXImageTransform.Microsoft.Shadow(color='#cccccc', Direction=135, Strength=8);
zoom: 1;
}
.coupon_separator {
display: block;
-webkit-box-sizing: border-box;
/* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;
/* Firefox, other Gecko */
box-sizing: border-box;
/* Opera/IE 8+ */
width: 95%;
background-color: #fff;
margin: 15px auto;
padding: 5px;
}
.content-coupon {
display: block;
-webkit-box-sizing: border-box;
/* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;
/* Firefox, other Gecko */
box-sizing: border-box;
/* Opera/IE 8+ */
width: 100%;
min-height: 50px;
padding: 15px;
margin-top: 10px;
border: 1px solid #ccc;
text-align: center;
}
.content-coupon h1 {
margin: auto;
padding: 0;
text-align: center;
}
.content-coupon span {
display: block;
padding: 5px 0 0;
}
.content-coupon .button-coupon button {
width: 250px;
height:50px;
}
.content-coupon .button-coupon button p {
text-align: center;
line-height:45px;
}
.content-coupon .button-coupon button span {
display:inline;
margin: 0 15px;
}
.valeur-coupon {font-size: 15px;}
.valeur-coupon b {color: #cc0033;}
.button-coupon {
display: block;
width: 100%;
text-align: center;
margin-top: 20px;
}
.button-coupon button {
height: 35px;
text-transform: uppercase;
font-size: 12px;
}
.button-coupon .btn-rouge {margin: 0 1% 0 1%;}
#remonte-bt {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: none;
position: fixed;
cursor: pointer;
z-index: 6000;
right: 0;
top: 200px;
width: 40px;
height: 40px;
border-radius: 20px;
padding-top: 8px;
text-align: center;
background-color: #5d5d5d;
color: #fff;
}
#remonte-bt span {display: block;}
#remonte-bt i {
font-size: 16px;
margin-left: -1px;
line-height:20px;
}
/*****************************************************
**** @PAGE ETUDIANTS
******************************************************/
#student_left {
float: left;
width: 280px;
height: 560px;
text-align: center;
margin: 10px 10px 0 0;
font-family: 'Work Sans', Arial, sans-serif;
box-sizing: border-box;
}
#student_left:hover {border: 5px solid #363636;}
#student_left:hover img, #student_left:hover .flags div, .flags #student_left:hover div {
height: 410px;
width: 270px;
}
#student_center {
float: left;
width: 300px;
height: 560px;
text-align: center;
margin: 10px 10px 0 0;
font-family: 'Work Sans', Arial, sans-serif;
box-sizing: border-box;
}
#student_center:hover {border: 5px solid var(--orange);}
#student_center:hover img, #student_center:hover .flags div, .flags #student_center:hover div {
height: 310px;
width: 290px;
}
#student_right {
float: left;
width: 355px;
height: 560px;
text-align: center;
margin: 10px 0 0 0;
font-family: 'Work Sans', Arial, sans-serif;
box-sizing: border-box;
}
#student_right:hover {border: 5px solid #363636;}
#student_right:hover img, #student_right:hover .flags div, .flags #student_right:hover div {
height: 335px;
width: 345px;
}
#student_w {
text-align: center;
margin: 0;
}
#student_share {
height: 140px;
text-align: center;
margin: 0;
background-color: #363636;
}
#student_share i {
color: #fff;
font-size: 36px;
cursor: pointer;
}
#student_offer,#student_news, #student_visu {
text-align: center;
margin: 0;
}
#student_offer {
height: 240px;
background-color: var(--orange);
}
#student_news {
height: 215px;
background-color: #363636;
}
#student_mask {
position: fixed;
width: 100%;
height: 100%;
background-color: #000;
opacity: 0.7;
z-index: 1000;
display: none;
}
#student_form {
position: absolute;
width: 430px;
height: auto;
top: 350px;
left: 50%;
margin: -160px 0 0 -215px;
background-color: #fff;
z-index: 1000;
display: none;
}
#student_form input {
font-size: 12px;
border: 1px solid #dbdbdb;
padding: 4px;
width: 250px;
border-radius: 3px;
}
#student_form .radio {
width: auto;
margin: 0 5px 0;
}
#student_button {
color: #fff;
background-color: #950232;
font-size: 16px;
padding: 3px 10px;
cursor: pointer;
}
#student_form .formulaire {
font: 12px 'Work Sans', Arial, sans-serif;
padding: 10px;
color: #888;
text-transform: uppercase;
}
#student_form h2 {
text-align: center;
font: normal normal 18px 'Work Sans', Arial, sans-serif;
text-transform: uppercase;
background-color: var(--orange);
padding: 5px;
margin: 0 0 10px 0;
color: #fff;
}
#student_form .labelform {
float: left;
width: 110px;
margin: 0 10px 0 0;
}
#student_form .line {
clear: both;
margin-bottom: 10px;
box-sizing: border-box;
border: 1px solid #fff;
border-radius: 3px;
background-color: #e6e6e6;
padding: 6px;
}
#panel_info {
position: absolute;
overflow: hidden;
bottom: 0;
left: 18px;
height: 0;
width: 0;
border-radius: 5px;
border: 1px solid #c0c0c0;
line-height: 14px;
padding: 7px;
opacity: 0;
}
#student_form a.panel {position: relative;}
#student_form a.panel:hover > #panel_info {
transition: opacity 0.6s;
height: auto;
width: 300px;
background-color: #fff;
opacity: 1;
}
#student_form .box {
font: 11px/24px 'Work Sans', Arial, sans-serif;
text-transform: none;
}
#student_form .genre {margin-right: 15px;}
#bt {
width: 200px;
cursor: pointer;
margin: 10px auto;
background-color: var(--orange);
color: #fff;
text-align: center;
padding: 5px;
display: block;
border: none;
font-size: 16px;
}
#bt:hover {background-color: #950232;}
#bt i {
float: right;
margin-right: 5px;
}
#student_news a {
color: #fff;
line-height: 30px;
padding: 5px;
}
#student_news a:hover {border: 1px solid #fff;}
.student_share_big {
color: #fff;
font: 50px/40px 'Work Sans', Arial, sans-serif;
margin: 0;
padding-top: 20px;
}
.student_share_small {
font-size: 16px;
color: #fff;
}
.student_offer_small {
font-size: 14px;
color: #fff;
margin-bottom: 20px;
}
.student_offer_medium {
color: #fff;
font: 30px 'Work Sans', Arial, sans-serif;
margin: 0 0 10px 0;
padding-top: 10px;
}
.student_offer_big {
color: #fff;
font: 50px/40px 'Work Sans', Arial, sans-serif;
margin: -10px 0 0;
}
.student_offer_big > div {
font-size: 60px;
margin: 15px 0 10px;
}
.student_new_collection {
color: #fff;
font: 45px/40px 'Work Sans', Arial, sans-serif;
margin: 0;
padding-top: 20px;
margin-bottom: 10px;
}
.student_error {
color: #ff0000;
text-align: center;
}
#retourController {
position: absolute;
top: 250px;
left: 50%;
width: 400px;
margin-left: -200px;
text-align: center;
background-color: #fff;
padding: 10px;
font: 18px 'Work Sans', Arial, sans-serif;
border: 1px solid #c0c0c0;
}
#retourController i {
background-color: #b9d065;
border-radius: 15px;
padding: 5px;
color: #fff;
}
/*****************************************************
**** @ZOOM PRODUITS NEW
******************************************************/
.dis_content_img:hover > .dis_zoomInfo, .dis_content_img2:hover > .dis_zoomInfo {
transition: opacity .2s linear, height 0s linear;
transition-delay: 1s;
height: auto;
opacity: 1;
border: 1px solid #c0c0c0;
top: -140px;
box-sizing: border-box;
visibility: visible;
}
.dis_zoomInfo img {width: 0;}
.dis_content_img:hover >.dis_zoomInfo a > img, .dis_content_img2:hover >.dis_zoomInfo a > img {
transition: width 0s linear;
transition-delay: 1s;
width: 350px;
}
.content-vignette-bas {
display: flex;
flex-wrap: wrap;
width: 100%;
text-align: left;
margin: 10px auto auto;
color: #707070;
border-top: 1px solid #e6e6e6;
padding: 1em 0 2em 0;
}
.vignette-bas {
display: inline-block;
font-size: 1.4em;
line-height: 1.3em;
width: 70%;
margin-left: 10%;
}
.vignette-bas-wishlist {
display: inline-block;
width: 10%;
margin-top: 15px;
margin-right:10%;
font-size: 2em;
text-align: right;
cursor: pointer;
}
.dis_zoomInfo {
position: absolute;
width: 410px;
left: 50%;
margin-left: -205px;
top: 0;
height: 0;
overflow: hidden;
z-index: 1500;
text-align: right;
background-color: #fff;
opacity: 0;
border: 0 solid #c0c0c0;
}
.dis_zoomInfo > div:nth-of-type(1){
position: absolute;
top: 5px;
right: 5px;
cursor: pointer;
}
div.dis_zoomInfo > div > i {font-size: 24px;}
div.dis_zoomInfo > div {text-align: center;}
.zoom_size_list {
padding: 5px;
border-top: 1px solid #e6e6e6;
width: 400px;
margin: 10px auto;
font-size: 10px;
box-sizing: border-box;
}
.zoom_size_list a {font-family: 'Work Sans', Arial, sans-serif;}
.zoom_color_list {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 60px;
box-sizing: border-box;
}
.zoom_color_list > div{
padding: 5px;
border: 1px solid #e6e6e6;
margin: 5px;
}
.zoom_color_list img {width: 40px;}
/*****************************************************
**** @TICKET VIEW
******************************************************/
/* #content, .content_ticketView {width: 100%;}
#content .ticket_view_table, .content_ticketView .ticket_view_table {
width: 100%;
border-collapse: collapse;
}
#content .ticket_view_table th, #content .ticket_view_table td, .content_ticketView .ticket_view_table th, .content_ticketView .ticket_view_table td {
border: 1px solid #fff;
text-align: center;
padding-left: 10px;
padding-right: 10px;
height: 0;
}
#content .ticket_view_table th, .content_ticketView .ticket_view_table th {
background-color: #5d5d5d;
color: #fff;
}
#content .header_ticket-selected, .content_ticketView .header_ticket-selected {
background-color: var(--orange);
padding: 5px 15px;
}
#content .header_ticket-selected h2, .content_ticketView .header_ticket-selected h2 {
font: normal normal 1em 'Work Sans', Arial, sans-serif;
color: #fff;
margin: 0;
padding: 0;
}
#content .header_ticket-selected_date, .content_ticketView .header_ticket-selected_date {
margin: 0;
padding: 0 0 0 10px;
text-align: right;
line-height: 2;
}
#content .header_ticket-selected_date span, .content_ticketView .header_ticket-selected_date span {
font-size: 1em;
color: var(--orange);
}
#affiche .ticket_view_details_table td {height: 0;}
.ticketView {margin-bottom: 15px;}
.ticket_view_columns {
width: 33%;
padding: 10px 5px;
}
.ticket_view_columns-selected {
width: 15%;
padding: 20px 5px;
}
.ticket_view_columns-red {background-color: var(--orange);}
#content .ticket_view_columns-red a {color: #fff;}
.ticket_view_columns_lineGrey {background-color: #e6e6e6;}
#content .content_ticketView .ticket_bt_back {margin: 5px 0 15px 0;}
*/
/*__ SUIVRE MES DEMANDES / TICKETVIEW __*/
.ticketView {
margin: 30px auto 30px auto;
padding: 0 0 20px 0;
text-align: center;
}
.ticketView .btn-noir {
height: 45px;
margin-left: 1em;
}
.ticket_bt_back {margin: 5px 0 15px 30px;}
.ticketView .inputGrey {
width: 400px;
line-height: 40px;
padding: 2px 5px;
border: 1px solid #363636;
background-color: #fff;
border-radius: 3px;
}
div .ticket_bt_back button {cursor: pointer;}
#content .ticketView h2 button {
line-height: 46px;
font-size: 18px;
}
#content .ticketView h2 {
margin: 50px auto 30px auto;
padding:0;
font: 200 24px/30px OpenSans, Arial, sans-serif;
background: none;
text-align: center;
}
#content, .content_ticketView {width: 90%;}
#content .ticket_view_table, .content_ticketView .ticket_view_table {
width: 90%;
border-collapse: collapse;
}
#content .ticket_view_table th, #content .ticket_view_table td, .content_ticketView .ticket_view_table th, .content_ticketView .ticket_view_table td {
border: 1px solid #fff;
text-align: center;
padding-left: 10px;
padding-right: 10px;
height: 0;
}
#content .ticket_view_table th, .content_ticketView .ticket_view_table th {
background-color: black;
color: #fff;
}
#content .header_ticket-selected, .content_ticketView .header_ticket-selected {
background-color: #c30040;
padding: 5px 15px;
line-height: 0;
}
#content .header_ticket-selected h2, .content_ticketView .header_ticket-selected h2 {
font: normal normal 1em OpenSans, Arial, sans-serif;
color: #fff;
margin: 0;
padding: 0;
}
#content .header_ticket-selected_date, .content_ticketView .header_ticket-selected_date {
margin: 0;
padding: 0 0 0 10px;
text-align: right;
line-height: 2;
}
#content .header_ticket-selected_date span, .content_ticketView .header_ticket-selected_date span {
font-size: 1em;
color: #c30040;
}
.content_ticketView > .container {
padding: 20px 10px;
border-bottom: 1px solid #e6e6e6;
cursor: pointer;
}
.content_ticketView > .container:hover {
background-color: #f0eeee;
}
.content_ticketView > .container > div {
display: inline-block;
vertical-align: middle;
}
.content_ticketView > .container > div:first-of-type, .content_ticketView > .container > div:nth-of-type(3) {
width: 25%;
font: 200 24px/30px OpenSans, Arial, sans-serif;
}
.content_ticketView > .container > div:nth-of-type(2) {
width: 50%;
font: 200 14px/18px OpenSans, Arial, sans-serif;
}
.content_ticketView > .container > #affiche, .content_ticketView > .container > #affiche > iframe > body{
background-color: #f0eeee;
font: 200 14px/18px OpenSans, Arial, sans-serif;
}
.content_ticketView #ticket_no_login {
display: none
}
#affiche .ticket_view_details_table td {height: 0;}
.form-ticketview textarea{
width:100%;
max-width:100%;
max-height:100%;
}
.form-ticketview p {
padding: 1em 0;
text-align: center;
}
.form-ticketview h3 {
padding-left: 0 !important;
}
.form-ticketview {
padding-left: 15px;
}
.ticket_view_columns {
width: 33%;
padding: 10px 5px;
}
.ticket_view_columns-selected {
width: 15%;
padding: 20px 5px;
}
.ticket_view_columns-red {background-color: #c30040;}
#content .ticket_view_columns-red a {color: #fff;}
.ticket_view_columns_lineGrey {background-color: #c0c0c0;}
.ticket_view_columns_lineRed {background-color: #c30040;}
#content .content_ticketView .ticket_bt_back {margin: 5px 0 15px 0;}
/*Confirmation de demande envoyée*/
#global > div {
display: inline-block;
vertical-align: top;
font-size: 14px;
}
#global #content {
width: 70%;
font-size: 22px;
line-height: 36px;
}
#global #content > i {
float: left;
font-size: 36px;
color: #C30040;
}
#global #demandeContact {
width: 30%;
text-align: center;
padding: 10px;
border: 1px solid #707070;
}
#global #demandeContact > div:first-of-type {
font-weight: bold;
}
#global #demandeContact > span {
display: block;
font-size: 18px;
color: #C30040;
}
/*****************************************************
**** @CHECKOUT NEW
******************************************************/
#popup_alert_parent { display: none; position: absolute; z-index: 500; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); }
#popup_alert_parent .popup_alert_mobile { width: 75%; margin: 20em auto 0 auto; background-color: #fff; }
#popup_alert_parent .popup_alert_content { text-align: center; padding: 1em 0 2em 0; }
#popup_alert_parent .close_popup_alert { display: block; text-align: right; font-size: 2em; padding-right: 0.5em; }
#popup_alert_parent h1 { margin: 20px; }
/*****************************************************
**** @HACK SEO (Google refnat)
******************************************************/
/* Hn tags used for SEO purpose (Google refnat) */
.seo_hn_tag {
display: inline-block !important;
color: inherit !important;
margin: inherit !important;
padding: inherit !important;
text-indent: inherit !important;
background-color: inherit !important;
font: inherit !important;
vertical-align: inherit !important;
border: none !important;
text-align: inherit !important;
position: inherit !important;
}
/*****************************************************
**** @PRESSE
******************************************************/
.presseTitle {
margin: 10px 0 0 0;
padding: 0;
}
.presseDate {
text-align: center;
width: 245px;
float: left;
margin: 10px 0 0 0;
padding: 0 0 5px 0;
border-bottom: 1px dashed #ccc;
}
.presseBloc {
margin: 0 0 0 5px;
padding: 0;
width: 240px;
float: left;
}
.fleche {
float:left;
margin-top:25px
}
/*****************************************************
**** @PAGE MERCI MAILS SHARK (thanks_for_answer.php)
******************************************************/
#contentTopThanks {
position: relative;
margin:0;
border-top: 1px #c0c0c0 dashed;
padding: 0 0 0 30px;
}
#contentTopThanks + #content {
display:flex;
width:100%;
justify-content: space-between;
}
.thanks_signature {
font-style: italic;
font-size: 15px;
margin-top: 25px;
float: left;
}
.thanks_trait {
float: left;
border: 1px #f8b333 solid;
width: 40px;
margin: 37px 0 0 15px;
}
.thanks_left {
width: 49%;
text-align: center;
padding-top:15px;
}
.thanks_right {
width: 49%;
background: url(/images/tanks-fond.jpg) no-repeat;
background-position: top right;
}
#content .thanks_right h1 {
color: #363636;
margin-top: 25px;
font-size: 26px;
margin-bottom: 30px;
}
.thanks_rose {color: var(--orange);}
.thanks_for_answer {
color: #707070;
font-size: 11px;
line-height: 18px;
text-align: justify;
padding: 0;
margin: 0 95px 0 0;
}
#texte_reduction {
color: #363636;
font-size: 15px;
padding-left: 35px;
margin-top: 40px;
float: left;
}
#thanks_code_reduc {
color: #fff;
float: left;
background-color: var(--orange);
font: bold 24px 'Work Sans', Arial, sans-serif;
padding: 5px 15px;
margin: 30px 0 0 15px;
}
#content .thanks_for_answer form {margin-top: 20px;}
.thanks_etoile {
font-size: 10px;
font-style: italic;
line-height: 16px;
margin-top: 25px;
}
#thanks_for_answer21 {
font-size: 13px;
margin-top: 70px;
text-align: center;
}
#choix_cadeau {
font-weight: bold;
font-size: 16px;
margin-bottom: 50px;
}
.encart_cadeau {
font-weight: bold;
font-size: 17px;
border : 1px solid #c0c0c0;
width: 225px;
float: left;
padding: 10px;
}
.cadeau_answer21 {
color: var(--orange);
text-transform: uppercase;
}
.condition_cadeau {
font-size: 12px;
margin: 20px 0 5px;
}
#answer21_ou{
float: left;
margin: 20px;
}
#thanks_reduction + div form input[type="submit"] {
margin: 5px;
padding: 2px 15px;
background-color:#363636;
color:#fff;
border:none;
border-radius:3px;
cursor:pointer;
}
/*****************************************************
**** @PROGRESS STATUS
******************************************************/
.text-status, .text-status-valide {
width: calc( 100% / 6 );
}
.text-status {
text-align: center;
font-family: 'Work Sans',Arial, sans-serif, Gotham, "Helvetica Neue", Helvetica;
line-height: 15px;
color: #adadad;
}
.text-status-valide {
text-align: center;
font-size: 35px;
line-height: 15px;
color: #363636;
}
.icon-status{
font-size: 35px;
text-align: center;
color: #adadad;
}
.icon-status-valide{
font-size: 35px;
text-align: center;
color: #363636;
}
.text-status-etat {font-size: 12px;}
.text-status-date {font-size: 10px;}
.numero_de_commande {margin: 1em 0;}
#content-icons {height: 2.5em; display:flex; justify-content: space-around;}
#content-text-status {display:flex;}
.progress-bar {
margin: 25px 0 0;
width: 100%;
height: 18px;
background-color: #e1e1e1;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
box-shadow: inset 0 1px 2px #919191;
-webkit-box-shadow: inset 0 1px 2px #919191;
-moz-box-shadow: inset 0 1px 2px #919191;
}
.progress-bar.marketplace {width: 100%;}
.bar-status1, .bar-status2, .bar-status3, .bar-status4, .bar-status5, .bar-status6 {
height: 18px;
background-color: var(--orange);
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
box-shadow: inset 0 1px 2px #b17a15;
-webkit-box-shadow: inset 0 1px 2px #b17a15;
-moz-box-shadow: inset 0 1px 2px #b17a15;
}
.bar-status1 {
width: calc(100% / 6);
animation: statut1 3s linear;
}
.bar-status2 {
width: calc(100% / 6 * 2);
animation: statut2 3s linear;
}
.bar-status3 {
width: calc(100% / 6 * 3);
animation: statut3 3s linear;
}
.bar-status4 {
width: calc(100% / 6 * 4);
animation: statut4 3s linear;
}
.bar-status5 {
width: calc(100% / 6 * 5);
animation: statut5 3s linear;
}
.bar-status6 {
width: calc(100% / 6 * 6);
animation: statut6 3s linear;
}
@keyframes statut1 {
0% {width: 0px;}
100% {width: calc(100% / 6);}
}
@keyframes statut2 {
0% {width: 0px;}
100% {width: calc(100% / 6 * 2);}
}
@keyframes statut3 {
0% {width: 0px;}
100% {width: calc(100% / 6 * 3);}
}
@keyframes statut4 {
0% {width: 0px;}
100% {width: calc(100% / 6 * 4);}
}
@keyframes statut5 {
0% {width: 0px;}
100% {width: calc(100% / 6 * 5);}
}
@keyframes statut6 {
0% {width: 0px;}
100% {width: calc(100% / 6 * 6);}
}
.container-triangles {
display:flex;
justify-content: space-around;
}
.triangle{
margin: 0 auto;
width: 0;
height: 0;
border-style: solid;
border-width: 9px 9px 0 9px;
border-color: #e1e1e1 transparent transparent;
}
.triangle1-red, .triangle2-red, .triangle3-red, .triangle4-red, .triangle5-red, .triangle6-red {
margin: 0 auto;
width: 0;
height: 0;
border-style: solid;
border-width: 9px 9px 0 9px;
border-color: #f8b333 transparent transparent;
}
.triangle1-red{animation: red1 3s linear;}
.triangle2-red{animation: red2 3s linear;}
.triangle3-red{animation: red3 3s linear;}
.triangle4-red{animation: red4 3s linear;}
.triangle5-red{animation: red5 3s linear;}
.triangle6-red{animation: red6 3s linear;}
@keyframes red1 {
0% {border-color: #e1e1e1 transparent transparent;}
9% {border-color: #e1e1e1 transparent transparent;}
13% {border-color: #f8b333 transparent transparent;}
100% {border-color: #f8b333 transparent transparent;}
}
@keyframes red2 {
0% {border-color: #e1e1e1 transparent transparent;}
25% {border-color: #e1e1e1 transparent transparent;}
29% {border-color: #f8b333 transparent transparent;}
100% {border-color: #f8b333 transparent transparent;}
}
@keyframes red3 {
0% {border-color: #e1e1e1 transparent transparent;}
41% {border-color: #e1e1e1 transparent transparent;}
45% {border-color: #f8b333 transparent transparent;}
100% {border-color: #f8b333 transparent transparent;}
}
@keyframes red4 {
0% {border-color: #e1e1e1 transparent transparent;}
57% {border-color: #e1e1e1 transparent transparent;}
61% {border-color: #f8b333 transparent transparent;}
100% {border-color: #f8b333 transparent transparent;}
}
@keyframes red5 {
0% {border-color: #e1e1e1 transparent transparent;}
72% {border-color: #e1e1e1 transparent transparent;}
77% {border-color: #f8b333 transparent transparent;}
100% {border-color: #f8b333 transparent transparent;}
}
@keyframes red6 {
0% {border-color: #e1e1e1 transparent transparent;}
89% {border-color: #e1e1e1 transparent transparent;}
93% {border-color: #f8b333 transparent transparent;}
100% {border-color: #f8b333 transparent transparent;}
}
/*___version popup___*/
/* Toi qui passe ne me juge pas tu n'imagines pas sur quel code legacy pourri j'ai du faire ce css moisi */
.sp_popup_content .popupSuivi h2 {margin:0;}
.popupSuivi #content-icons {
display: inline-block;
width: calc(100% - 44px - 70%);
height:360px;
}
.popupSuivi .progress-bar {
margin:0;
height: 360px;
width: 28px;
border-radius: 6px;
background-color: #cccccc;
order:2;
}
.popupSuivi .container-triangles {
flex-direction: column;
order:1;
width: 14px;
}
.popupSuivi .progress-bar > div { position: absolute; width: 28px; border-radius: 6px; background-color: var(--orange); }
.popupSuivi .bar-status1 { height: 60px; }
.popupSuivi .bar-status2 { height: 120px; }
.popupSuivi .bar-status3 { height: 180px; }
.popupSuivi .bar-status4 { height: 240px; }
.popupSuivi .bar-status5 { height: 300px; }
.popupSuivi .bar-status6 { height: 360px; }
.popupSuivi .icon-status,
.popupSuivi .icon-status-valide {
height: 60px;
width: 100%;
font-size: 3em;
color: #cccccc;
}
.popupSuivi .icon-status i, .popupSuivi .icon-status-valide i {
margin-top: 1px;
display: block;
}
.popupSuivi .icon-status-valide { color: #363636; }
.popupSuivi #content-bar-triangles {
display: inline-flex;
position: relative;
vertical-align: top;
width: 44px;
height: 360px;
}
.popupSuivi .content-triangle {
height: 60px;
width: 100%;
position: relative;
}
.popupSuivi .triangle, .popupSuivi .triangle1-red, .popupSuivi .triangle2-red, .popupSuivi .triangle3-red, .popupSuivi .triangle4-red, .popupSuivi .triangle5-red, .popupSuivi .triangle6-red {
width: 0;
height: 0;
border-top: 20px solid transparent;
border-bottom: 20px solid transparent;
border-right: 20px solid #cccccc;
margin-left: -1em;
position: absolute;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
}
.popupSuivi .triangle1-red, .popupSuivi .triangle2-red, .popupSuivi .triangle3-red, .popupSuivi .triangle4-red, .popupSuivi .triangle5-red, .popupSuivi .triangle6-red {
border-right: 20px solid var(--orange);
}
.popupSuivi #content-text-status {
display: inline-block;
vertical-align: top;
padding-left: 1em;
width: 65%;
height: 360px;
box-sizing: border-box;
}
.popupSuivi .text-status,
.popupSuivi .text-status-valide {
position: relative;
width: 100%;
height: 60px;
font-size: 1em;
text-align: left;
}
.popupSuivi .text-status > div,
.popupSuivi .text-status-valide > div {
position: absolute;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
}
#sp_popup_parent .popupSuivi .text-status-etat {
font-size: 1em;
font-weight: bold;
}
#sp_popup_parent .popupSuivi .text-status-date {
font-size: 1em;
font-style: italic;
}
.popupSuivi .triangle1-red, .popupSuivi .triangle2-red, .popupSuivi .triangle3-red, .popupSuivi .triangle4-red, .popupSuivi .triangle5-red, .popupSuivi .triangle6-red,
.popupSuivi .bar-status1, .popupSuivi .bar-status2, .popupSuivi .bar-status3, .popupSuivi .bar-status4, .popupSuivi .bar-status5, .popupSuivi .bar-status6
{animation: initial;}
/*****************************************************
**** @CGV
******************************************************/
.section-cgv li {
margin: 15px 0;
padding: 0 0 0 15px;
display: block;
width: 92%;
font-size: 13px;
text-align: justify;
}
.section-cgv li::first-line, .all-list li {
margin: 0;
padding: 0;
font: italic 16px Georgia, Utopia, Charter, serif;
color: var(--orange);
}
.all-list li, .all-list li::first-line {
font-size: 16px !important;
color: #888 !important;
}
.section-cgv li em {color: var(--orange);}
.cgv-premium {
margin: 0 0 0 78px !important;
max-width: 90% !important;
}
.section-cgv table, #envoi_1 table, #paiement_6 table {
margin: 15px 0;
padding: 0;
width: 100%;
border-collapse: collapse;
border: 1px solid #363636;
}
.section-cgv tr:first-child, #envoi_1 tr:first-child, #paiement_6 tr:first-child {
margin: 0;
padding: 5px 0;
max-width: 100%;
min-height: 40px;
text-align: center;
color: #fff;
background-color: #363636;
border: 1px solid #363636;
}
.section-cgv > table tr + tr, #envoi_1 > table tr + tr, #paiement_6 > table tr + tr {
margin: 0;
padding: 0;
font-family: 'Work Sans', Arial, sans-serif;
color: #363636;
}
.section-cgv > table td, #envoi_1 > table td, #paiement_6 > table td {
margin: 0;
padding: 5px;
max-width: 450px;
text-align: center;
border: 1px solid #363636;
}
.section-cgv > table td > em, #envoi_1 > table td > em, #paiement_6 > table td > em {
margin: 5px 0;
font-family: Georgia, Utopia, Charter, serif;
line-height: 45px;
color: var(--orange);
}
.section-cgv, .section-cnil, .section-marketplace, .section-plus, .section-mentions, .section-spartoo, .section-vourcher, .section-recrutement {
margin: 10px 0;
width: 100%;
}
#mentions-vourcher p {
min-height: 80px;
font-size: 12px;
line-height: 13px;
border: none;
}
.section-cgv h2, .section-vourcher h2 {margin: inherit !important;}
.contentCentre h2 span {
display: inline-block;
vertical-align: middle;
width: 40px;
height: 40px;
margin-right: 1%;
border-radius: 20px;
line-height: 2em;
text-align: center;
color: #fff;
background-color: var(--orange);
}
.section-cgv > strong, .section-marketplace > strong, .section-cnil > strong, .section-vourcher > strong {
margin: 0 0 0 55px;
font: italic 16px Georgia, Utopia, Charter, serif;
color: #363636;
}
.section-cgv p > strong, .section-cnil p > strong, .section-marketplace p > strong .section-vourcher p > strong {
font-size: 13px;
color: var(--orange);
}
.section-vourcher p {padding-bottom: 10px;}
.section-cnil p > a, .section-marketplace p > a {
margin: 10px 0;
font-family: Georgia, Utopia, Charter, serif;
font-style: italic;
color: #363636;
}
.section-cnil p > a:hover, .section-marketplace p > a:hover {color: var(--orange);}
.section-cgv p, .section-cnil p, .section-marketplace p, .section-plus p, .section-recrutement p {
margin: 15px 0 15px 55px;
max-width: 100%;
font-size: 11px;
text-align: justify;
}
.section-cgv p > em, .section-cnil p > em, .section-marketplace p > em, .section-plus p > em {
margin: 15px 0;
padding: 0;
font: 13px/35px Georgia, Utopia, Charter, serif;
color: var(--orange);
}
.section-cgv > span, .section-cnil > span, .section-marketplace > span, .section-cgv h3 {
margin: 10px 0 0 45px;
font: 14px 'Work Sans', Arial, sans-serif;
color: var(--orange);
padding-left: 0;
}
.section-cgv h4 {
margin: 10px 0 0 5px;
font: 14px 'Work Sans', Arial, sans-serif;
color: var(--orange);
padding-left: 0;
}
.section-marketplace img, .section-marketplace .flags div, .flags .section-marketplace div {
display: inline-block;
margin: 0 0 20px 8px;
border: 1px solid #e6e6e6;
}
.contentCentre .section-marketplace p {margin: 5px 0 15px 55px;}
.section-cgv ul, .all-list, .section-recrutement ul {
margin: 0;
width: 100%;
}
.btoostore_details, .btoostore_contact {
display: inline-block;
width: 20%;
font-size: 14px;
line-height: 20px;
vertical-align: top;
padding: 10px;
box-sizing: border-box;
}
.btoostore_details h3 {
font-size: 14px;
text-transform: uppercase;
text-align: center;
}
.btoostore_details h3 > span{
font-size: 30px;
display: block;
color: var(--orange);
}
.btoostore_contact {
background-color: #e6e6e6;
}
/*--- LOADER ---*/
#loader > div {
z-index: 1000;
}
#loader_overlay {
background: white;
position: fixed;
opacity: 0.5;
top: 0px;
right: 0px;
left: 0px;
bottom: 0px;
}
#loader > .spinner {
position: fixed;
left: 0;
top: 50%;
right: 0;
}
.spinner {
margin: auto;
width: 70px;
text-align: center;
}
.spinner > div {
width: 18px;
height: 18px;
background-color: #333;
border-radius: 100%;
display: inline-block;
-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}
.spinner .bounce1 {
-webkit-animation-delay: -0.32s;
animation-delay: -0.32s;
}
.spinner .bounce2 {
-webkit-animation-delay: -0.16s;
animation-delay: -0.16s;
}
@-webkit-keyframes sk-bouncedelay {
0%, 80%, 100% { -webkit-transform: scale(0) }
40% { -webkit-transform: scale(1.0) }
}
@keyframes sk-bouncedelay {
0%, 80%, 100% {
-webkit-transform: scale(0);
transform: scale(0);
} 40% {
-webkit-transform: scale(1.0);
transform: scale(1.0);
}
}
/*----- PAGE MAGASINS -----*/
#trouver-magasin p {
font-size: 16px;
}
input.form-control {
padding: 8px;
border: 1px solid #d9d4e0;
width: 300px;
font-size: 16px;
margin-right: 20px;
}
.form-group > button > i { font-size: 25px; }
.magMap {width:50%;display:inline-block;}
.shop_table {width: 100%;border-collapse:collapse;margin-top: 30px;}
.shop_table tr:first-of-type {background-color: #d9d4e0;text-transform:uppercase;}
.shop_table tr:first-of-type td p {text-align:center!important;}
.shop_table tr:first-of-type td:first-of-type p {text-align:left!important;}
.shop_table td {text-align:center;border-bottom: 1px solid #d9d4e0;padding: 5px 15px;}
.shop_table td div p {text-align:center!important;}
.shop_table tr td:first-of-type div p {text-align:left!important;}
#magasin-detail h2 {
width:90%;
margin:0 auto;
margin-block-start:0;
margin-block-end:0.33em;
}
.magDetails {
width:45%;
display:inline-block;
vertical-align: top;
padding-left: 30px;
font-size: 16px;
color: #7d7898;
}
.magDetails ul {
padding: 0px;
list-style: none;
}
.magDetails li {
margin: 10px;
}
.magDetails i {
font-size: 25px;
margin-right: 10px;
vertical-align: middle;
}
.magDetailsHoraires span {
display: inline-block;
width: 90px;
padding-left: 10px;
vertical-align: top;
}
.magDetailsHoraires time {
display: inline-block;
width: 240px;
padding-left: 10px;
vertical-align: top;
}
/* CHECKOUT buttons */
#input_coupon {
background-color: var(--orange);
}
.map_list_button {
background-color: #505050;
border: 0;
padding: 5px;
color: #fff;
text-shadow: 0 -1px 0 rgba(0,0,0,0.25);
cursor: pointer;
}
.map_list_button :hover {
background-color: #000;
color: #fff;
}
/*----- PAGE ANDRE TIMELINE -----*/
.timeline * {
box-sizing: border-box;
}
/* The actual timeline (the vertical ruler) */
.timeline {
background-color: #d9d4e0;
position: relative;
max-width: 1200px;
margin: 0 auto;
}
/* The actual timeline (the vertical ruler) */
.timeline::after {
content: '';
position: absolute;
width: 6px;
background-color: var(--orange);
top: 0;
bottom: 0;
left: 50%;
margin-left: -3px;
}
/* Container around content */
.container {
padding: 10px 40px;
position: relative;
background-color: inherit;
width: 50%;
}
/* The circles on the timeline */
.container::after {
content: '';
position: absolute;
width: 25px;
height: 25px;
right: -17px;
background-color: white;
border: 4px solid var(--orange);
top: 15px;
border-radius: 50%;
z-index: 1;
}
/* Place the container to the left */
.left {
left: 0;
}
/* Place the container to the right */
.right {
left: 50%;
}
/* Add arrows to the left container (pointing right) */
.left::before {
content: " ";
height: 0;
position: absolute;
top: 22px;
width: 0;
z-index: 1;
right: 30px;
border: medium solid white;
border-width: 10px 0 10px 10px;
border-color: transparent transparent transparent white;
}
/* Add arrows to the right container (pointing left) */
.right::before {
content: " ";
height: 0;
position: absolute;
top: 22px;
width: 0;
z-index: 1;
left: 30px;
border: medium solid white;
border-width: 10px 10px 10px 0;
border-color: transparent white transparent transparent;
}
/* Fix the circle for containers on the right side */
.right::after {
left: -16px;
}
/* The actual content */
.content {
padding: 20px 30px;
background-color: white;
position: relative;
border-radius: 6px;
}
/* Media queries - Responsive timeline on screens less than 600px wide */
@media screen and (max-width: 600px) {
/* Place the timelime to the left */
.timeline::after {
left: 31px;
}
/* Full-width containers */
.container {
width: 100%;
padding-left: 70px;
padding-right: 25px;
}
/* Make sure that all arrows are pointing leftwards */
.container::before {
left: 60px;
border: medium solid white;
border-width: 10px 10px 10px 0;
border-color: transparent white transparent transparent;
}
/* Make sure all circles are at the same spot */
.left::after, .right::after {
left: 15px;
}
/* Make all right containers behave like the left ones */
.right {
left: 0%;
}
}
.google-map, .map-canvas, #map-canvas, #map-canvas2, #carte {
max-height: 500px;
min-height: 500px;
margin-top:10px;
}
.form-group {
display: inline-block;
width: 50%;
}
#results {
width: 300px;
padding-left: 0px;
padding-right: 16px;
border: solid 1px;
display: none;
position: absolute;
z-index: 99;
}
#results div {
width: 300px;
padding: 8px;
border-bottom: solid 1px;
background-color: white;
color: black;
}
#results div:last-child {
border-bottom: none;
}
#results div:hover {
background-color: var(--orange);
color: #c0c0c0;
cursor: grabbing;
}
#results .result_focus {
background-color: var(--orange);
color: #c0c0c0;
}
#geolocalisation {
display: inline-block;
vertical-align: top;
}
#geolocalisation img {
position: relative;
left: 30%;
}
.unmask {
position: absolute;
right: 50px;
bottom: 0;
width: 35px;
height: 30px;
display: block;
z-index: 5;
cursor: pointer;
}
/*****************************************************
**** @RECRUTEMENT
******************************************************/
#recrutement h2 {
text-align: left;
font-family: 'Work Sans', Arial, sans serif;
margin: 40px 0 15px 0;
border-bottom:1px solid #000;
font-style : normal;
text-transform:uppercase;
}
#recrutement > div {
display: inline-block;
width: 47.5%;
vertical-align: top;
}
#recrutement > div:last-of-type {
margin-left: 5%;
}
#recrutement_bloc3 h2 {
padding-top: 2em;
font-family: 'Work Sans', Arial, sans serif;
font-style : normal;
text-transform: uppercase;
border-bottom: 1px solid #000;
}
.section-recrutement ul {margin: 5px 0 10px 18px;}
.section-recrutement p {
margin: 10px 5px;
font: 12px 'Work Sans', Arial, sans-serif;
}
.band {
margin: 10px 0;
padding: 0;
width: 955px;
height: 59px;
clear: both;
background: url(/images/andre/recrutement_band.png);
}
.band h4 {
margin: 0 10px !important;
padding: 20px 0 0 !important;
color: #FFF !important;
font-size: 14px !important;
font-weight: bold !important;
letter-spacing: 1px !important;
background: none !important;
}
/*__ MENU __*/
#animate_menu { margin: 2em 0; }
#animate_menu li {
margin: 2px;
padding: 0;
height: 100px;
width: 88px;
position: relative;
display: inline-block;
vertical-align: top;
}
#animate_menu li a {
width: 100%;
display: block;
text-align: center;
font-size: 10px;
color: #363636;
text-transform: uppercase;
text-decoration: none;
padding-top: 70px;
}
#animate_menu li a:hover {color: var(--orange);}
/* IMAGE NO HOVER */
.item_e-marketing{background:url(/images/andre//recrutement_1.png) top center no-repeat;}
.item_infographie{background:url(/images/andre//recrutement_2.png) top center no-repeat;}
.item_informatique{background:url(/images/andre//recrutement_3.png) top center no-repeat;}
.item_logistique{background:url(/images/andre//recrutement_4.png) top center no-repeat;}
.item_comptabilite{background:url(/images/andre//recrutement_5.png) top center no-repeat;}
.item_approvisionnement{background:url(/images/andre//recrutement_6.png) top center no-repeat;}
.item_services_achat{background:url(/images/andre//recrutement_7.png) top center no-repeat;}
.item_call{background:url(/images/andre//recrutement_8.png) top center no-repeat;}
.item_communication{background:url(/images/andre//recrutement_9.png) top center no-repeat;}
.item_services_etudes{background:url(/images/andre//recrutement_10.png) top center no-repeat;}
.item_rh{background:url(/images/andre//recrutement_11.png) top center no-repeat;}
.item_marketplace{background:url(/images/andre//recrutement_12.png) top center no-repeat;}
.item_magasin{background:url(/images/andre//recrutement_13.png) top center no-repeat;}
.item_entrepot{background:url(/images/andre//recrutement_14.png) top center no-repeat;}
.item_methode{background:url(/images/andre//recrutement_15.png) top center no-repeat;}
.item_studio_photo{background:url(/images/andre//recrutement_17.png) top center no-repeat;}
.item_brands{background:url(/images/andre//recrutement_20.png) top center no-repeat;}
/* IMAGE HOVER */
.item_e-marketingHover{background:url(/images/andre//recrutement1.png) top center no-repeat;}
.item_infographieHover{background:url(/images/andre//recrutement2.png) top center no-repeat;}
.item_informatiqueHover{background:url(/images/andre//recrutement3.png) top center no-repeat;}
.item_logistiqueHover{background:url(/images/andre//recrutement4.png) top center no-repeat;}
.item_comptabiliteHover{background:url(/images/andre//recrutement5.png) top center no-repeat;}
.item_approvisionnementHover{background:url(/images/andre//recrutement6.png) top center no-repeat;}
.item_services_achatHover{background:url(/images/andre//recrutement7.png) top center no-repeat;}
.item_callHover{background:url(/images/andre//recrutement8.png) top center no-repeat;}
.item_communicationHover{background:url(/images/andre//recrutement9.png) top center no-repeat;}
.item_services_etudesHover{background:url(/images/andre//recrutement10.png) top center no-repeat;}
.item_rhHover{background:url(/images/andre//recrutement11.png) top center no-repeat;}
.item_marketplaceHover{background:url(/images/andre//recrutement12.png) top center no-repeat;}
.item_magasinHover{background:url(/images/andre//recrutement13.png) top center no-repeat;}
.item_entrepotHover{ background:url(/images/andre//recrutement14.png) top center no-repeat;}
.item_methodeHover{background:url(/images/andre//recrutement15.png) top center no-repeat;}
.item_studio_photoHover{background:url(/images/andre//recrutement17.png) top center no-repeat;}
.item_brandsHover{background:url(/images/andre//recrutement20.png) top center no-repeat;}
/* IMAGE ACTIVE */
.item_hover_e-marketing{background:url(/images/andre//recrutement1.png) top center no-repeat;}
.item_hover_infographie{background:url(/images/andre//recrutement2.png) top center no-repeat;}
.item_hover_informatique{background:url(/images/andre//recrutement3.png) top center no-repeat;}
.item_hover_logistique{background:url(/images/andre//recrutement4.png) top center no-repeat;}
.item_hover_comptabilite{background:url(/images/andre//recrutement5.png) top center no-repeat;}
.item_hover_approvisionnement{background:url(/images/andre//recrutement6.png) top center no-repeat;}
.item_hover_services_achat{background:url(/images/andre//recrutement7.png) top center no-repeat;}
.item_hover_call{background:url(/images/andre//recrutement8.png) top center no-repeat;}
.item_hover_communication{background:url(/images/andre//recrutement9.png) top center no-repeat;}
.item_hover_services_etudes{background:url(/images/andre//recrutement10.png) top center no-repeat;}
.item_hover_rh{background:url(/images/andre//recrutement11.png) top center no-repeat;}
.item_hover_marketplace{background:url(/images/andre//recrutement12.png) top center no-repeat;}
.item_hover_magasin{background:url(/images/andre//recrutement13.png) top center no-repeat;}
.item_hover_entrepot{ background:url(/images/andre//recrutement14.png) top center no-repeat;}
.item_hover_methode{background:url(/images/andre//recrutement15.png) top center no-repeat;}
.item_hover_studio_photo{background:url(/images/andre//recrutement17.png) top center no-repeat;}
.item_hover_brands{background:url(/images/andre//recrutement20.png) top center no-repeat;}
/*__ LISTE EMPLOIS __*/
#accordion h3, #accordion h4 { color:var(--orange); padding-left: 0;}
#accordion h4 { letter-spacing: 0; }
#accordion h3 { font-size: 25px; }
#accordion ul { list-style: none; }
#accordion li { border-bottom: 1px dotted #363636; }
#accordion li > a {
display: block;
padding: 1em 1em 1em 0;
font: 15px 'Work Sans', Arial, sans-serif;
color: #363636;
text-decoration: none;
}
#accordion li > a i { font-size: 1.3em; }
#accordion li > a > span {
display: inline-block;
text-align: center;
border-radius: 1em;
width: 2em;
height: 2em;
padding: 0.3em;
margin-right: 1.5em;
background-color: #363636;
color: #fff;
}
#animate_menu_mobile { display: none; }
.details {
margin: 10px 30px !important;
color: #363636 !important;
font-size: 12px;
display: none;
}
.img_job {
margin: 5px;
padding: 0;
}
/* .liste_competence {width: 380px;} */
.liste_competence li {
margin: 6px;
padding: 0;
font-size: 12px;
display: block;
}
.separate {
margin: 5px 25px;
width: 335px;
}
/*****************************************************
**** @AFFILIES
******************************************************/
.affil_head {position:relative;}
.contactTop {
position:absolute;
top:0;
right:0;
background-color: #9B6FBE;
box-sizing: border-box;
height:88px;
line-height: 20px;
color:#fff;
text-align:center;
display:flex;
flex-direction: column;
justify-content: center;
padding: 0 40px;
}
.contactTop h4 {text-transform: uppercase; margin:0;}
.contactTop a {color:#fff;}
.nousvous {
display:flex;
justify-content: space-between;
margin: 40px 0;
}
.nousvous > div {
width:48%;
border: 1px solid var(--orange);
border-radius: 10px;
padding:40px;
display:flex;
flex-direction:column;
justify-content: space-between;
}
.nousvous h2 {
margin: 0 auto 20px;
padding-bottom: 10px;
display:inline-block;
border-bottom: 1px solid var(--orange);
color: var(--orange);
font: lighter 1.8em 'Work Sans', Arial, serif;
}
.nousvous p {text-align:justify;font-size: 1.1em;}
.nousvous .pics img {
width:48%;
margin: 0 1%;
}
.nousvous .joinUs {
text-align:center;
font:bold 1.5em 'Work Sans', Arial, sans serif;
color: var(--orange);
}
.nousvous .joinUs img:first-child {vertical-align: -10px;}
.nousvous .joinUs img:last-child {vertical-align: -20px; transform:rotate(180deg);}
.pointsforts h2 {
text-align:center;
color: var(--orange);
margin:40px;
font-size:1.8em;
}
.pointsforts > div {
display:flex;
justify-content: space-between;
align-items:center;
margin-bottom:40px;
}
.pointsforts div > ul, .pointsforts > img {width:48%;}
.pointsforts > div:first-of-type {background-color: #DAD4E0;}
.pointsforts div > ul {
list-style-type:none;
padding:0 40px;
}
.pointsforts div > ul > li {
padding-left:0;
margin-bottom:10px;
font-size: 1.1em;
}
.pointsforts div > ul > li i {
font-weight:bold;
font-size: 1.2em;
vertical-align: -2px;
}
.pointsforts div > ul > ul {
list-style-type:disc;
padding:0 40px;
}
.pointsforts div > ul > ul li {margin-bottom: 10px;}
.affilMask {
width: 100vw;
height: 100vh;
position: fixed;
top: 0;
left: 0;
background-color: rgba(0,0,0,0.75);
z-index: 999;
text-align: center;
display:flex;
justify-content: center;
align-items: center;
}
#image_news {
max-height: 90vh;
max-width: 80vw;
}
.magasinsAndre > * {width:24%;}
.magasinsAndre div:first-child {
background-color: var(--orange);
color: #fff;
align-self:stretch;
display:flex;
align-items: center;
}
.magasinsAndre div img {max-width: 100%;}
.magasinsAndre div ul {
width: 100%;
text-align:center;
}
.magasinsAndre div ul li {
margin:0;
}
.magasinsAndre img {cursor:pointer;}
.contactBottom {
text-align: center;
padding:20px;
border: 1px solid var(--orange);
border-radius: 10px;
color: var(--orange);
display:block;
width:30%;
margin:auto;
font-size:1.2em;
line-height: 1.3em;
}
.contactBottom h3 {
margin: 0;
text-transform: uppercase;
letter-spacing: 5px;
}
.contactBottom a, .contactBottom span {display:block;}
/* ZONE PASSWORD FORGOTTEN */
#content_password_forgotten {
font-size: 16px;
padding-bottom: 5em;
}
#content_password_forgotten .b-return {
color: #363636;
}
#content_password_forgotten h2,
#content_password_forgotten h3 {
font-family: 'Work Sans', sans-serif;
font-style: normal;
text-align: center;
padding-left: 0;
}
#content_password_forgotten h3 {
width: 60%;
margin: auto;
font-size: 9.em;
}
#content_password_forgotten h2 > div {
display: inline-block;
vertical-align: middle;
margin-right: 0.5em;
font-size: 1.2em;
border-radius: 20px;
height: 40px;
width: 40px;
background-color: var(--orange);
color: #ffffff;
}
#content_password_forgotten h2 > div i {
display: block;
margin-top: 0.25em;
}
#content_password_forgotten form {
display: block;
width: 50%;
text-align: center;
margin: auto;
padding: 3em 0;
}
#content_password_forgotten .loginContent {
width: 50%;
margin: auto;
}
#content_password_forgotten .inputGrey,
#content_password_forgotten button {
width: 100%;
}
#content_password_forgotten .inputGrey {
margin-bottom: 1.2em;
}
#content_password_forgotten button {
margin-top: 0.8em;
}
#content_password_forgotten .label {
text-align: left;
font-size: 0.8em;
}
/*****************************************************
**** @PAGE CODES PARTENAIRES
******************************************************/
.cpns_header {
position: relative;
margin-bottom:40px;
}
.cpns_header .sbanTitle {
box-sizing: border-box;
position: absolute;
top:50%;
left:50%;
transform: translate(-50%,-50%);
width:25%;
height:100%;
display:flex;
justify-content: center;
align-items: center;
background-color: rgba(255,255,255,.8);
padding:30px;
font: 2em/1.2em 'Work Sans', Arial, sans-serif;
color: #000;
text-transform: uppercase;
text-align:center;
}
.cpns_content {
display:flex;
justify-content: space-between;
flex-wrap: wrap;
}
.cpns_content > div {
box-sizing: border-box;
width: calc(96% / 3);
padding: 40px 20px;
border: 1px solid #c0c0c0;
margin-bottom:20px;
text-align:center;
display:flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
}
.cpns_content > div:nth-child(3n+2):nth-last-child(-n+3):last-child {
margin-left:2%;
margin-right:auto;
}
.cpns_content .logo {
width:100%;
height:130px;
display:flex;
align-items: center;
justify-content: center;
}
.cpns_content .logo img {
max-width:70%;
max-height:130px;
}
.cpns_content .logo + div {margin:20px 0;}
.cpns_content > div p {
margin:2px;
font-size: 1.2em;
}
.cpns_content > div p:first-of-type {
font-size: 1.4em;
font-weight: bold;
}
.cpns_content .code {
background-color: #f0eeee;
padding: 10px 20px;
border-radius: 10px;
font: bold 1.5em 'Work Sans', Arial, sans-serif;
cursor: pointer;
}
.cpns_content .code:active {background-color: #c6c6c6;}
.cpns_content .hint {color: #707070; font-size:9px;}
.cpns_content > div button {
margin:0 auto;
padding:10px 20px;
}
.cpns_content > div button i.icon-flecheDroite {vertical-align: -2px; margin:initial;}
.cpns_content > div p.conditions {
margin-top :20px;
color: #707070;
font: normal italic 11px 'Work Sans', Arial, sans-serif;
}
/* PANIER */
.panier_infos_premium, .panier_infos_papierKdo, .panier_payment > div:last-child, .panier_engagements > div:nth-child(4), .panier_engagements > div:nth-child(5), .panier_engagements > div:nth-child(7), .panier_clubFid {
display: none!important;
}
.panier_engagements > div:nth-child(6), .panier_engagements > div:nth-child(even):last-child {
width: 150px;
flex-direction: row;
justify-content: center;
}
.carousel > div a:nth-child(2) {
display: none;
}
/*---- FAQ ----*/
/* Desktop */
.contentFaqDesktop {
width: 100%;
display: flex;
align-items: flex-start;
}
.contentFaqDesktop #menu-faq {
width: 25%;
font: 15px OpenSans, Arial, sans-serif;
}
.contentFaqDesktop #menu-faq > div {
position: relative;
margin: 0;
padding: 0px;
text-align: left;
line-height: 40px;
background-color: #fff;
color: #363636;
text-transform: uppercase;
border-bottom: 1px solid #e6e6e6;
}
.contentFaqDesktop #menu-faq i {
display: inline-block;
vertical-align: middle;
font-size: 20px;
color: #707070;
top: 10px;
right: 10px;
}
.contentFaqDesktop #menu-faq a {
display: block;
text-align: justify;
color: #363636;
padding: 5px;
}
.contentFaqDesktop #menu-faq span {
display: inline-block;
vertical-align: middle;
}
.contentFaqDesktop #menu-faq a:hover{
color: #e6e6e6 !important;
background-color: #c0c0c0;
}
.contentFaqDesktop #menu-faq a:hover i {
color: #e6e6e6 !important;
}
.contentFaqDesktop .selected-menu {background-color: var(--main-color) !important;color: #e6e6e6;}
.contentFaqDesktop .selected-menu a {color: #e6e6e6!important;}
.contentFaqDesktop .selected-menu i {color: #e6e6e6!important;}
.contentFaqDesktop .selected-menu a:hover {background-color: var(--main-color) !important;}
.contentFaqDesktop .not-selected {display: none;}
.contentFaqDesktop #display {
width: 75%;
padding: 1rem 1rem 1rem 1.5rem;
}
.contentFaqDesktop #pays, .contentFaqDesktop #paiement,
.contentFaqDesktop #commande, .contentFaqDesktop #services,
.contentFaqDesktop #produits, .contentFaqDesktop #envoi,
.contentFaqDesktop #retour, .contentFaqDesktop #compte,
.contentFaqDesktop #marketplace {
display: none;
margin-bottom: 20px;
text-align: justify;
}
.contentFaqDesktop #pays > div, .contentFaqDesktop #paiement > div, .contentFaqDesktop #commande > div, .contentFaqDesktop #services > div, .contentFaqDesktop #produits > div,
.contentFaqDesktop #envoi > div, .contentFaqDesktop #retour > div, .contentFaqDesktop #compte > div, .contentFaqDesktop #marketplace > div {
padding-left: 2rem;
margin-bottom: 2rem;
font-size: 0.8rem;
}
.contentFaqDesktop #pays h4, .contentFaqDesktop #paiement h4, .contentFaqDesktop #commande h4,
.contentFaqDesktop #services h4, .contentFaqDesktop #produits h4, .contentFaqDesktop #envoi h4,
.contentFaqDesktop #retour h4, .contentFaqDesktop #compte h4, .contentFaqDesktop #marketplace h4 {
font-size: 1rem;
margin-bottom: 2rem;
padding-left: 2rem;
background: transparent url(/images/plus.png) no-repeat left center;
font-weight: normal;
cursor: pointer;
}
.contentFaqDesktop .selected-section {background: transparent url(/images/m.png) no-repeat left center !important;}
.contentFaqDesktop .content-faq {
margin-top: 30px;
margin-bottom: 20px;
font: 13px OpenSans, Arial, sans-serif;
text-align: left;
color: #707070;
}
.contentFaqDesktop .content-faq > h4 {
padding: 0 0 5px 30px !important;
font: italic 20px Georgia, Utopia, Charter, serif !important;
text-align: left;
color: #363636;
background: transparent url(/images/plus.png) no-repeat left center;
}
.contentFaqDesktop .content-faq > h4:hover {
padding: 0 0 5px 30px !important;
cursor: pointer !important;
color: var(--main-color) !important;
background: transparent url(/images/p-over.png) no-repeat left center;
}
.contentFaqDesktop .content-faq div {
padding: 20px 0 10px;
border-top: 1px solid var(--main-color) !important;
}
.contentFaqDesktop .content-faq > div > em {
font-weight:200;
font-family: OpenSans, Arial, sans-serif;
font-style: normal;
color: var(--main-color) !important;
}
.contentFaqDesktop .content-faq ul {
margin: 0 0 0 8px;
padding: 0;
width: 100%;
}
.contentFaqDesktop .content-faq li {
margin: 15px 0;
padding: 0 0 0 15px;
display: block;
font-size: 13px;
text-align: justify;
background: transparent url(/images/square.gif) no-repeat;
}
.contentFaqDesktop .content-faq li > strong {
font-weight: bold;
font-family: OpenSans, Arial, sans-serif;
color: var(--main-color) !important;
}
.contentFaqDesktop #display a {
color: var(--main-color);
text-decoration: underline;
}
.contentFaqDesktop #display a:hover {
color: var(--main-color);
text-decoration: underline;
}
/* Schema retour */
.contentFaqDesktop .roundNumber2 {
width: 20px;
height: 20px;
display: block;
padding: 5px;
font-size: 12px;
line-height: 20px;
border-radius: 15px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
background-color: #000;
color: #fff;
text-align: center;
}
.contentFaqDesktop #retour > p.steps {
display: inline-block;
width: 180px;
text-align: center !important;
margin-right: 10px;
vertical-align: top;
}
.contentFaqDesktop #retour > p.steps:last-of-type {margin-right: 0;}
.contentFaqDesktop .steps >i{
font-size: 100px;
color: #000;
}
.contentFaqDesktop #retour_schema {width: auto;}
.contentFaqDesktop #retour_schema > p.steps {
display: inline-block;
width: 120px;
text-align: center !important;
margin-right: 10px;
vertical-align: top;
}
.contentFaqDesktop #retour_schema > p.steps:last-of-type {margin-right: 0;}
.contentFaqDesktop #retour_schema > .steps >i{
font-size: 80px;
color: #000;
}
/* Schema retour end*/
.contentFaqDesktop #retour_3 .step_content {
display:inline-block;
text-align:center;
font-size:10px;
padding-right:10px;
vertical-align:top;
}
.contentFaqDesktop #retour_3 .step_content p {text-align: center;}
.contentFaqDesktop #retour_3 .step_content > img {display: block; margin: auto;}
.contentFaqDesktop #retour_3 .content_general_step {
border: 1px solid #363636;
margin: 10px 0;
padding: 5px 0;
text-align:center;
}
/* Mobile */
.contentFaqMobile .contentFaq {
padding: 1rem;
}
.contentFaqDesktop {
max-width: 1200px;
width: 100%;
margin: auto;
}
#menu-faq .selected-menu {
padding-left: 1rem !important;
background-color: var(--bleu-fonce) !important;
color: #ffffff;
}
/*---- PAGE "AIDE" ----*/
#answersTree {
width: 100%;
}
.level1Div {
display: inline-block;
width: 25%;
vertical-align: top;
text-align: center;
}
.level1Div h2, .leftTreeLevel1Div h2 {
font: bold 20px/24px OpenSans, Arial, sans-serif;
margin:0;
text-transform: uppercase;
display: inline-block;
}
.level1Div h2:first-letter {text-transform: uppercase;}
.puce_circle {
margin: 0 5px -3px -10px;
width: 28px;
height: 28px;
display: inline-block;
font: 17px Georgia, Utopia, Charter, serif;
text-align: center;
color: #fff;
-moz-border-radius: 14px;
-webkit-border-radius: 14px;
border-radius: 14px;
background: #363636;
}
.puce_circle p {
margin: 0 1px 0 0;
line-height: 22px;
}
.level2Div {
margin-left: 10px;
padding: 0;
}
.level2Div h1 {
font-size: 18px;
text-align: left;
text-transform: uppercase;
}
.level3Div {
margin-left: 0;
padding: 6px;
}
.level3DivTitle {font: 200 16px/30px OpenSans, Arial, sans-serif; text-decoration: underline;}
.level4ask {
margin: 2px 2px 2px 0;
padding: 1px;
height: 20px;
line-height: 20px;
}
.ticketContact {
margin: 10px;
padding: 2px;
text-align: center;
font-size: 14px;
}
.ticketContact a {
color: #c30040;
text-decoration: underline;
}
.ticketCourier {
padding: 10px;
text-align:center;
background-color:#fff;
}
.level4answer {
padding: 4px;
display: none;
text-align: justify;
}
.level4answerOk {
margin: 10px 0;
text-align: center;
font-weight: bold;
padding-bottom:5px;
border-bottom:1px solid #c0c0c0;
}
.level2Container {
margin: 0 auto;
}
.level2Titre {
margin: auto;
}
.level2Titre:hover {
margin: auto;
}
.level2Titre a {color: #707070;}
.level2Titre:hover a {color: #fff;}
.level2Titre:first-letter {text-transform: uppercase;}
.tagsTexte {
margin: 0 auto;
padding: 0 0 5px;
width: 895px;
text-align: center;
border-bottom: 1px solid #c0c0c0;
}
.leftTree {
margin: 0;
width: 25%;
float: left;
min-height: 360px;
}
.rightTree {
width: 75%;
float: left;
}
.leftTreeLevel1Div {text-align: left;}
.leftTreeLevel1Div h2 {
font-size: 16px;
margin-bottom:5px;
display:inline-block;
}
.leftTreeLevel1Titre {
padding: 5px 0;
display: inline-block;
font-size:12px;
}
.leftTreeLevel1Titre:first-letter {text-transform:uppercase;}
.leftTreeLevel2Titre, .leftTreeLevel2TitreSelected {
padding: 0 0 5px 18px;
text-align: left;
}
#explainBox {
margin: 10px 0 0 25px;
width: 430px;
}
.helpFollowTickets {
/* border-bottom: 1px solid #c0c0c0;
padding: 0 0 20px 0;
margin: 20px 0 10px 0;*/
}
#contact-area {
float: none;
width: 50%;
font-size: 15px;
}
.helpNumCall {
font-size: 2em;
}
#contact-area i {
font-size: 38px;
float: left;
}
.menufaq {
font-size: 12px;
font-weight: bold;
color: #c30040;
}
.faq_pays {
padding-top: 25px;
border-top: 1px solid #c0c0c0;
}
#faqBox {
font-size: 1.6em;
line-height: 1.6em;
}
#explainBox p, #faqBox p {
margin: 0 0 40px 10px;
text-align: left;
}
span[id*="desc_pj"] .icon-annuler {cursor:pointer;}
.fakeBtn {
display:inline-block;
background-color: #c30040 !important;
color:#fff;
margin:auto;
padding: 4px 12px;
font: 13px/25px OpenSans, Arial, sans-serif;
text-decoration:none;
border-radius:3px;
}
.fakeBtn i {font-size:17px;}
.fileUpload {
position: relative;
overflow: hidden;
margin: 10px auto;
}
.fileUpload input.upload {
position: absolute;
top: 0;
left: 0;
margin: 0;
padding: 0;
font-size: 20px;
cursor: pointer;
opacity: 0;
filter: alpha(opacity=0);
width:100%;
}
#aide h2, #aide h3, #aide h4, #aide h5 {
margin: 0px auto;
cursor: pointer;
}
#aide h2 {
font: bold 24px/30px OpenSans;
text-transform: uppercase;
margin: 30px auto 0 auto;
}
#aide h3 {
font: 18px/40px OpenSans, Arial, sans-serif;
color: #c30040;
padding: 0.4em 0;
border-top: 1px solid #e6e6e6;
}
#aide h4 {
font: 16px/30px OpenSans, Arial, sans-serif;
margin-left: 20px;
padding: 0.4em 0;
}
#aide h5 {
font: 200 14px/30px OpenSans, Arial, sans-serif;
padding: 0.4em 0;
}
#aide h2 i, #aide h3 i {
font-size: 18px;
}
#aide h4 i {
font-size: 16px;
}
#aide h5 i {
font-size: 12px;
}
.blocLevel1 {
display: none;
}
.blocLevel2 {
margin: 0px auto;
display: none;
}
.blocLevel3 {
display: none;
}
.blocLevel4 {
display: none;
font: 14px/20px OpenSans;
margin-left: 40px;
}
.blocLevel5 {
display: none;
margin: 0 0 20px 20px;
}
.showHelpForm {
margin: 10px auto;
}
/* Formulaire */
.formQuestion {
margin:0;
padding: 5px;
text-align: left;
border: none;
background: none;
}
.formQuestion h2 {
font: 200 24px/30px OpenSans;
text-transform: uppercase;
text-align: center;
margin: 0 auto;
}
.formQuestionTicketInfo {
display: block;
width: 100%;
text-align: left;
}
.formQuestionTicketInfo input{
display: block;
line-height: 30px;
font-size: 14px;
color: #707070;
}
.formQuestionTicketInfo b, .formQuestionTicketTextArea b {
display: block;
font-size: 14px;
margin: 14px 0 5px 0;
}
.formQuestionTicketTextArea {
margin: 0;
width: 74%;
text-align: left;
box-sizing: border-box;
display: inline-block;
}
.formQuestionTicketTextArea textarea{
margin: 10px 0;
}
.TicketInfoInputContainer {
width: 25%;
display: inline-block;
box-sizing: border-box;
vertical-align: top;
}
.helpCmdDetail {
background-color: #f0eeee;
padding: 20px;
font-size: 14px;
}
.aide {
position: relative;
padding: 0;
width: auto;
right: 0;
top: 0;
}
.helpCmdDetailProducts {
display: none;
}
.helpCmdDetailProduct {
display: inline-block;
width: 31%;
margin: 0 1%;
padding: 5px 5px 5px 15px;
box-sizing: border-box;
border: 1px solid #e6e6e6;
background-color: #fff;
}
.helpCmdDetailProduct img {
float: left;
margin-right: 20px;
}
.helpRubriques, #contactBoxes {
display: inline-block;
margin: 0 1% 0 0;
padding: 20px 0;
box-sizing: border-box;
vertical-align: top;
}
.helpRubriques {
width: 100%;
}
.helpRubriques div:first-of-type {
font: bold 30px/36px OpenSansCond;
text-align: center;
margin-bottom: 20px;
text-transform: uppercase;
}
#contactBoxes {
width: 45%;
margin: 0 10px;
padding: 20px 8px;
border: 1px solid #363636;
border-radius: 3px;
line-height: 19px;
transition: height 0.25s;
}
.chatbot {
width: 45%;
margin: 0 10px;
padding: 0;
border-radius: 3px;
line-height: 19px;
text-align: center;
transition: height 0.25s;
}
#faqBox div:first-of-type {
font: bold 1.5em/1.5em OpenSansCond;
text-transform: uppercase;
}
#startMinoo {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
font-size: 2em;
width: 100%;
height: 100%;
cursor: pointer;
transition: all 0.25s;
background-color: #e6e6e6;
}
#startMinoo:hover {
background-color: #7fd4eb;
color: #fff;
}
#startMinoo:hover > i {
color: #fff;
}
#startMinoo > i {
font-size: 5em;
color: #7fd4eb;
}
#startMinoo > span {
display: flex;
font-size: 0.75em;
align-items: center;
}
.helpRubriqueTitle{
display: inline-flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 23%;
margin: 0 1%;
padding: 5px;
box-sizing: border-box;
border-radius: 3px;
border: 1px solid #363636;
background-color: #fff;
font: bold 20px/24px OpenSansCond;
min-height: 200px;
vertical-align: top;
text-transform: uppercase;
text-align: center;
cursor: pointer;
}
.helpRubriqueTitle i {
display: block;
font-size: 50px;
margin-bottom:10px;
}
.helpNoClient {
font-size: 14px;
width: 75%;
margin: 20px auto 10px auto;
}
.helpNoClient div {
font-size: 14px;
display: inline-block;
margin: 15px 10px;
padding: 5px;
cursor: pointer;
}
.helpNoClient i {
font-size: 30px;
display: block;
}
.formQuestionTicketTextArea select {
display: inline;
box-sizing: border-box;
padding: 10px 5px;
font-size: 14px;
color: #707070;
}
.infoLogin {
width: 75%;
margin: 0 auto 10px auto;
font: bold 20px/24px OpenSansCond;
}
.sp_popup_content form {
width: 80%;
margin: auto;
}
.table_lastOrders td, .table_lastOrders th {
width: 15%;
}
.table_lastOrders td:last-of-type, .table_lastOrders th:last-of-type {
width: 25%;
}
.table_lastOrders td span:first-of-type {
display: none;
}
.button_other_cmd {
margin: 20px auto;
text-align: center;
}
#affiche td, #affiche th {
min-height: 40px;
padding-top: 10px;
vertical-align: middle;
}
#affiche th {
text-transform: uppercase;}
#affiche td.ticket_view_columns {
padding-left: 15px;
}
/** Feedback **/
.faq_feedback div {
margin-top: 15px;
}
.faq_feedback input[type="submit"] {
margin-top: 15px;
}
.faq_feedback label {
display: block;
}
.faq_feedback .green_color {
color: green;
}
/*==========================*/
/* @HOME
/*==========================*/
.js-reveal {
opacity: 0;
margin-top: 3rem;
transition: all 1s ease-in;
}
picture {
display: block;
line-height: 0;
}
.espace {
width: 100%;
height: 4rem;
}
.block {
max-width: var(--max-width);
width: 100%;
margin: auto;
}
.home_op {
position: relative;
display: flex;
justify-content: center;
align-items: center;
}
.home_op_infos {
display: flex;
justify-content: center;
position: absolute;
z-index: 1;
}
.block_op_infos > h1 {
font-size: 5rem;
margin: 0;
padding: 0;
text-align: center;
text-transform: uppercase;
color: #ffffff;
text-shadow: 0 0 5px rgba(0,0,0,0.25);
}
.block_op_infos > p {
font-family: var(--font-script);
text-align: center;
font-size: 1.5rem;
color: #ffffff;
text-shadow: 0 0 5px rgba(0,0,0,0.25);
}
.home_op_boutons {
display: grid;
grid-template-columns: repeat(2,1fr);
grid-gap: 2rem;
padding-top: 2.5rem;
justify-items: center;
}
.home_op_boutons .bt_rouge,
.home_op_boutons .bt_bleu {
text-align: center;
}
.home_op_bb {
position: relative;
display: flex;
justify-content: center;
align-items: center;
}
.home_content_ronds {
display: grid;
grid-template-columns: repeat(3,1fr);
}
.ct-rond {
position: relative;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
}
.ct-rond img {
transition: transform 0.3s ease-in-out;
}
.ct-rond:hover img {
transform: scale(1.1);
}
.h2-rond {
position: absolute;
z-index: 1;
font-family: var(--font-main-medium);
font-size: 1.5rem;
font-weight: normal;
color: #ffffff;
text-shadow: 0 0 12px rgba(0,0,0,0.5);
}
.rond_image {
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
margin: auto;
max-width: 320px;
max-height: 320px;
border-radius: 999px;
}
.home_op_bb_text_container {
position: absolute;
z-index: 1;
}
.home_op_bb_text_container > h1 {
font-size: 4rem;
color: #ffffff;
text-shadow: 0 0 10px rgba(0,0,0,0.25);
}
.histoire-gbb {
max-width: var(--max-width);
width: 100%;
margin: 2rem auto 0 auto;
}
.histoire-gbb > h2 {
font-family: var(--font-script);
font-size: 2.8rem;
margin: 0;
font-weight: normal;
text-align: center;
color: var(--bleu-fonce);
}
.histoire-gbb > p {
font-size: 1.1rem;
font-style: italic;
text-align: center;
color: var(--bleu-fonce);
}
.home-bloc-large {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
}
.invert { flex-direction: row-reverse; }
.home-bloc-large > div {
width: 50%;
}
.about-image {
line-height: 0;
}
.about-image picture {
opacity: 0;
margin-top: 3rem;
}
.mise-en-forme {
padding: 3rem;
}
.mise-en-forme h2 {
font-family: var(--font-main-medium);
font-size: 1.5rem;
margin-bottom: 3rem;
line-height: 1.2;
font-weight: normal;
}
.mise-en-forme a {
margin-top: 3rem;
}
.home-bloc-petite-histoire {
margin: auto;
padding: 1rem 0 4rem 0;
background-color: var(--orange-clair);
}
.home-bloc-petite-histoire > h2 {
font-family: var(--font-script);
font-size: 2.2rem;
font-weight: normal;
text-align: center;
color: var(--bleu-fonce);
}
.tableau-histoire {
display: grid;
grid-template-columns: repeat(3,1fr);
grid-gap: 2rem;
}
.tableau-histoire h3 {
font-size: 1.2rem;
margin-bottom: 0;
color: var(--bleu-fonce);
}
.tableau-histoire p {
margin-top: 0;
}
.bt_outline_rouge,
.bt_outline_bleu {
display: inline-block;
text-align: center;
font-size: 1rem;
font-weight: bold;
text-transform: uppercase;
width: 150px;
border: 1px solid #ffffff;
border-radius: 999px;
background: rgba(255,255,255,0.5);
padding: 0.7rem 1.5rem;
transition: all 0.3s ease-in-out;
}
.bt_outline_rouge {
color: var(--rouge) !important;
}
.bt_outline_bleu {
color: var(--bleu-fonce) !important;
}
.bt_outline_rouge:hover {
color: #ffffff !important;
border-color: var(--rouge);
background-color: var(--rouge);
}
.bt_outline_bleu:hover {
color: #ffffff !important;
border-color: var(--bleu-fonce);
background-color: var(--bleu-fonce);
}
.bt_bleu, .bt_bleu_fonce, .bt_rouge, .bt_orange, .bt_blanc {
display: inline-block;
text-align: center;
font-size: 1rem;
padding: 0.7rem 1.5rem;
border-radius: 999px;
color: #ffffff !important;
transition: all 0.3s ease-in-out;
}
.bt_bleu i, .bt_bleu_fonce i, .bt_rouge i, .bt_orange i, .bt_blanc i {
display: inline-block;
}
.bt_bleu {
background-color: var(--bleu-clair);
}
.bt_bleu_fonce {
background-color: var(--bleu-fonce);
}
.bt_rouge {
background-color: var(--rouge);
}
.bt_orange {
background-color: var(--orange);
}
.bt_blanc {
color: var(--bleu-fonce) !important;
background-color: #ffffff;
}
.bt_bleu:hover,
.bt_bleu_fonce:hover,
.bt_rouge:hover,
.bt_orange:hover,
.bt_blanc:hover {
color: #ffffff !important;
background-color: var(--noir);
}
.bleu {
background-color: var(--bleu-fonce);
color: #ffffff !important;
}
.bleu-light {
/*background-color: var(--bleu-light);*/
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
}
.rouge {
background-color: var(--rouge);
color: #ffffff !important;
}
.orange {
background-color: var(--orange);
color: var(--bleu-fonce)
}
.bleu h2 {
color: #ffffff !important;
}
.rouge h2 {
color: #ffffff !important;
}
.orange h2 {
color: var(--bleu-fonce);
}
.bloc-infos-bleu {
flex: 1;
display: flex;
flex-direction: row;
align-items: center;
padding: 1rem;
border-radius: 1rem;
color: var(--bleu-fonce);
background-color: var(--orange-clair);
}
.bloc-infos-bleu i {
font-size: 2.5rem;
margin-right: 1rem;
}
b,
p {
font-size: 0.9rem;
}
.home-bloc-frequence {
display: grid;
grid-template-columns: repeat(3,1fr);
grid-gap: 3rem;
}
.home-bloc-frequence h3 {
font-family: var(--font-main-medium);
font-size: 1.5rem;
line-height: 1.2;
font-weight: normal;
color: var(--bleu-fonce);
}
.home-bloc-frequence p {
display: flex;
font-size: 1rem;
}
.home-bloc-frequence .icon-livraisonGratuite {
font-size: 1.5rem;
margin-right: 1rem;
color: var(--bleu-clair);
}
.home-bloc-frequence ul {
list-style: decimal;
font-size: 0.8rem;
}
.home-bloc-frequence .bloc-gauche { grid-column: 1/3; }
.home-bloc-frequence .bloc-droite { grid-column: 3/4; }
.home-bloc-frequence .bloc-droite .bt_bleu { margin-top: 2rem; }
.bleu-clair {
color: #ffffff;
background-color: var(--bleu-clair);
padding-bottom: 2rem;
}
.bleu-foncer {
color: #ffffff;
background-color: var(--bleu-fonce);
padding-bottom: 2rem;
}
.bleu-clair .histoire-gbb,
.bleu-foncer .histoire-gbb {
margin: 0 auto 1.5rem auto;
}
.bleu-clair .histoire-gbb > h2,
.bleu-foncer .histoire-gbb > h2 {
color: #ffffff !important;
font-weight: normal;
padding-top: 1rem;
margin: 2rem auto 1rem auto;
}
.bleu-clair .histoire-gbb p,
.bleu-foncer .histoire-gbb p {
font-size: 1rem;
color: #ffffff;
margin-bottom: 2rem;
}
.bleu-clair .mise-en-forme,
.bleu-foncer .mise-en-forme {
padding: 0 3rem;
}
.bleu-clair h3,
.bleu-foncer h3 {
font-family: var(--font-main-medium);
font-size: 1.4rem;
font-weight: normal;
margin: 1rem 0 0.25rem;
}
.bleu-clair p ,
.bleu-foncer p{
font-size: 0.8rem;
margin: 0 0 0.25rem;
}
.content-caution {
display: flex;
}
.content-caution h2 {
font-family: var(--font-main-medium);
font-size: 1.3rem;
text-transform: uppercase;
margin-top: 0;
font-weight: normal;
color: var(--bleu-fonce);
}
.image-caution {
flex: 0 0 180px;
margin: 0 2rem 0 0;
}
.ligne_bleu::after,
.ligne_rouge::after,
.ligne_orange::after {
display: block;
content: '';
width: 100px;
height: 3px;
margin: 0.8rem 0 2rem 0;
}
.ligne_bleu::after { background-color: var(--bleu-clair); }
.ligne_rouge::after { background-color: var(--rouge); }
.ligne_orange::after { background-color: var(--orange); }
/* Homepage Catégories Principales*/
.home_marronier {
display: flex;
flex-wrap: wrap;
width:100%;
align-items: center;
padding: 2em 0;
justify-content: center;
}
.home_marronier img, .home_focus img {
max-width: 100%;
height: auto;
background-color: rgba(0,0,0,0.1);
}
.home_marronier_text, .home_focus_text {
width: 100%;
text-align: center;
padding: 2rem;
}
.home_marronier_text_title, .home_focus_text_title {
font-size: 3rem;
line-height: 3rem;
font-weight: 100;
}
.home_marronier_text_subtitle {
font-size: 1.5rem;
font-weight: 100;
}
.home_focus_text_subtitle {
font-size: 1.8rem;
font-weight: 100;
}
.home_marronier_text_button, .home_focus_buttons {
font-size: 1.2rem;
font-weight: bold;
margin-top: 1rem;
}
.home_focus_buttons > div {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.home_marronier_text_button a, .home_focus_buttons a {
border-bottom: 2px solid #fff;
color: #fff;
text-decoration: none;
}
.home_marronier_types > div {
margin-top:2em;
}
.home_marronier_types_text {
padding: 0.5em;
font-size: 1.4rem;
font-weight: 100;
text-align: center;
}
.home_marronier_types_text .home_marronier_text_button {
margin-top: 0;
}
/**
* MOBILE
*/
@media screen and (max-width: 850px) {
b, p {
font-size: 1rem;
}
.espace {
width: 100%;
height: 2rem;
}
.home_op {
justify-content: flex-end;
align-items: unset;
flex-direction: column;
line-height: 0;
margin-bottom: 0;
}
.home_op_infos {
position: relative;
background-color: var(--bleu-fonce);
}
.block_op_infos {
width: 100%;
padding: 1rem 0 3rem 0;
}
.block_op_infos h1,
.block_op_infos p {
line-height: 1;
text-align: center;
}
.block_op_infos h1 {
font-family: var(--font-main-medium);
font-size: 3rem;
font-weight: normal;
padding-bottom: 1rem;
}
.block_op_infos p {
margin: 0;
padding: 0 2rem;
}
.home_op_boutons a {
display: flex;
justify-content: center;
width: 100px;
background-color: #ffffff;
align-items: center;
font-size: 1.2rem;
}
.home_op_boutons i {
margin: unset;
}
.home-bloc-large {
flex-direction: column-reverse;
}
.mobile-revert {
flex-direction: column !important;
}
.home-bloc-large > div,
.home-bloc-large .about-image img {
width: 100%;
}
.content-vignettes-insta {
grid-template-columns: repeat(2,1fr) !important;
padding: 1rem 1rem 4rem 1rem;
}
.histoire-gbb {
padding: 1rem;
margin: 0;
}
.home_op_bb_text_container > h1 {
font-size: 2.5rem;
}
.home-bloc-petite-histoire {
margin: 0;
}
.tableau-histoire {
display: block;
padding: 1rem;
margin: 0;
}
.content-caution {
display: block;
}
.image-caution {
margin: 0;
text-align: center;
}
.image-caution img {
width: 50%;
}
.content-caution .texte {
padding: 1rem;
}
.pointures .bloc-infos-bleu { order: 1; border-radius: unset; }
.pointures .mise-en-forme { order: 2; }
.pointures .about-image { order: 3; }
.home-bloc-frequence {
display: block;
padding: 2rem 3rem;
}
.bleu-clair p {
font-size: inherit;
margin: 0;
}
.bloc-droite, .mise-en-forme {
display: flex;
flex-direction: column;
padding-bottom: 2rem;
}
.mise-en-forme a {
margin-top: 2rem;
}
.orange, .bleu-clair, .rouge {
margin: 0;
padding: 0 0 3rem 0;
}
}
@media (min-width:850px) {
.home_marronier_text {
width: 405px;
}
.home_focus_text {
width: 600px;
text-align: left;
}
.home_marronier_types {
width:1200px;
display:flex;
justify-content:space-between;
margin-top:2em;
}
.home_focus_buttons {
display: flex;
justify-content: space-between;
}
}
/*==========================*/
/* @HEADER
/*==========================*/
#allowCookies {
width: 100%;
}
.allowCookies-content {
max-width: var(--max-width);
margin: auto;
padding: 0.5em;
text-align: center;
}
.allowCookies-content-text {
font-size: 1em;
line-height: 1.4em;
}
.allowCookies-content a {
text-decoration: underline;
font-size: 1.4em;
}
.allowCookies-content-button i {
font-size: 1.5rem;
}
.topBar {
width: 100%;
padding: 0.25rem 0;
background-color: var(--bleu-fonce);
}
.topBar-infos-call {
display: flex;
align-items: center;
justify-content: space-between;
max-width: var(--max-width);
text-transform: uppercase;
margin: auto;
}
.topBar-infos-call i {
font-size: 1.2rem;
}
.topBar-infos-call > div > a {
display: flex;
align-items: center;
color: #ffffff;
margin-right: 0.5rem
}
.topBar-infos-call > div {
flex: 1;
display: flex;
flex-direction: row;
align-items: center;
}
.topBar-infos-call > div:last-of-type {
justify-content: flex-end;
}
.topBar-infos-call > div:last-of-type i {
margin-left: 1rem;
margin-right: 0 !important;
}
#header {
width: 100%;
position: sticky;
top: 0;
background-color: #fff;
z-index: 5000;
-webkit-box-shadow: 0px 5px 3px 0px rgba(23,23,23,0.10);
box-shadow: 0px 5px 3px 0px rgba(23,23,23,0.10);
}
.header-options-accounta,
.header-options-whislist,
.header-options-cart {
position: relative;
}
.header-options-account > a,
.header-options-whislist > a,
.header-options-cart > a {
text-align: center;
margin-top: 0.8rem;
color: var(--bleu-clair);
}
.header-options-account > a > span,
.header-options-whislist > a > span,
.header-options-cart > a > span {
display: block;
margin-top: 0.2rem;
font-size: 0.5rem;
color: #ffffff;
transition: color .5s ease-out .05s;
}
.header-options-account:hover > a > span,
.header-options-whislist:hover > a > span,
.header-options-cart:hover > a > span {
color: #171717;
}
.header-options-whislist {
padding: 0 1rem;
}
.nbProductsInCart,
#fav-circle {
position: absolute;
display: flex;
justify-content: center;
align-items: center;
top: 0;
right: 0;
width: 20px;
height: 20px;
font-size: 0.8rem;
color: #ffffff;
border-radius: 10px;
background-color: #171717;
}
#fav-circle {
left: 60px;
}
nav {
padding: 0.5rem 0 0 0;
border-top: 1px solid #f2f2f2;
}
nav > ul {
display: flex;
justify-content: space-between;
margin: auto;
padding: 0;
max-width: var(--max-width);
width: 100%;
}
.links_nav {
display: block;
margin: 0;
list-style: none;
font-family: var(--font-main-medium);
font-size: 1.6em;
line-height: 1.7rem;
color: var(--bleu-fonce);
text-transform: uppercase;
}
.links_nav > a:hover { color: var(--bleu-fonce); }
.links_nav::after {
display: block;
content: '';
width: 100%;
height: 4px;
background-color: #ffffff;
transition: background-color 0.3s ease-in-out;
}
.links_nav:hover::after {
background-color: var(--orange);
}
.script {
text-transform: none;
font-weight: normal;
font-family: var(--font-script);
color: var(--bleu-fonce);
}
.links_nav:hover .sous-menu {
height: 320px;
padding: 2rem 2rem;
}
.sous-menu {
display: flex;
position: absolute;
overflow: hidden;
z-index: 100;
left: 0;
height: 0;
margin-top: 4px;
padding: 0 2rem;
width: 100%;
background-color: #fff;
box-shadow: 0 4px 4px rgba(0,0,0,0.05);
transition: all 0.3s ease-in-out;
}
.ct_collection {
display: grid;
grid-template-columns: 1fr 1fr;
max-width: var(--max-width);
width: 100%;
margin: auto;
font-size: 1rem;
}
.ct_histoire {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
column-gap: 2rem;
max-width: var(--max-width);
width: 100%;
margin: auto;
font-size: 1rem;
}
.img_menu {
display: flex;
position: relative;
overflow: hidden;
justify-content: center;
align-items: center;
max-height: 260px;
}
.img_menu img {
filter: brightness(50%);
-webkit-filter: brightness(50%);
-webkit-transition: all 1s ease;
transition: all 1s ease;
object-fit: contain;
}
.img_menu:hover img {
filter: brightness(100%);
-webkit-filter: brightness(100%);
}
.liste_links {
display: block;
list-style: none;
margin: 0 0 2rem 0;
padding: 0;
text-transform: none;
}
.liste_links a {
display: flex;
padding: 0.15rem 0;
font-family: 'OpenSans', sans-serif;
font-weight: normal;
transform: translate(-0.8rem,0);
transition: all 0.3s ease-in-out;
}
.liste_links a::before {
display: block;
content: '→';
margin-right: 0.1rem;
opacity: 0;
transform: translate(-1rem,0);
transition: all 0.3s ease-in-out;
}
.liste_links a:hover,
.liste_links a:hover::before {
opacity: 1;
transform: translate(0,0);
}
.header-options-logo {
display: flex;
justify-content: center;
width: 200px;
}
.header-options-logo img {
transition: all 0.3s ease-in-out;
}
.header-content-right {
display: flex;
flex: 1;
flex-direction: column;
}
.header-options-links {
display: flex;
flex: 1;
justify-content: space-between;
max-width: var(--max-width);
margin: auto;
padding: 1rem 0;
}
.header-espace-pro i,
.header-content-ecommerce i {
display: block;
font-size: 1.5rem;
}
.header-espace-pro,
.header-content-ecommerce {
display: flex;
flex: 1;
flex-direction: row;
justify-content: flex-end;
align-items: center;
max-width: 200px;
}
.header-espace-pro {
justify-content: flex-start;
text-transform: uppercase;
font-size: 0.8rem;
color: var(--bleu-clair) !important;
}
.header-espace-pro i {
margin-right: 0.5rem;
}
/*==========================*/
/* @FOOTER
/*==========================*/
.content-vignettes-insta {
display: grid;
grid-template-columns: repeat(3,1fr);
column-gap: 1rem;
padding-bottom: 4rem;
}
.link_insta {
display: block;
overflow: hidden;
}
.link_insta > img {
transition: transform 0.3s ease-in-out;
}
.link_insta:hover > img {
transform: scale(1.1);
}
.titre-insta {
max-width: 1200px;
width: 100%;
font-size: 1.5rem;
color: var(--bleu-fonce);
text-align: center;
margin: auto;
padding: 2rem 0;
}
.services {
max-width: 1200px;
display: grid;
grid-template-columns: repeat(4,1fr);
justify-content: center;
margin: 4rem auto;
}
.services i {
display: block;
font-size: 3.5rem;
margin-bottom: 1.5rem;
color: var(--orange);
}
.services div {
font-family: var(--font-main-bold);
text-transform: uppercase;
text-align: center;
font-size: 1rem;
color: var(--bleu-fonce);
}
.services span {
display: block;
font-family: var(--font-main-light);
font-size: 0.9rem;
}
#footer {
width: 100%;
color: #fff;
padding: 4rem 0;
margin: auto;
background-color: var(--bleu-fonce);
}
.footer-content {
display: grid;
grid-template-columns: repeat(4,1fr);
grid-gap: 4rem;
max-width: 1200px;
font-size: 1rem;
margin: auto;
}
.footer-newsletter {
grid-column: 1 / 3;
}
.footer-newsletter-text,
.footer-links a {
color: #fff;
}
.footer-links a {
display: flex;
padding: 0.15rem 0;
font-family: 'OpenSans', sans-serif;
font-weight: normal;
transform: translate(-0.8rem,0);
transition: all 0.3s ease-in-out;
}
.footer-links a::before {
display: block;
content: '→';
margin-right: 0.1rem;
opacity: 0;
transform: translate(-1rem,0);
transition: all 0.3s ease-in-out;
}
.footer-links a:hover,
.footer-links a:hover::before {
opacity: 1;
transform: translate(0,0);
}
.footer-title {
font-family: var(--font-main-bold);
text-transform: uppercase;
font-size: 1.3rem;
}
.footer-newsletter-inputs {
display: flex;
overflow: hidden;
align-items: stretch;
width: 100%;
border: 1px solid #ffffff;
border-radius: 1rem;
}
.footer-newsletter-inputs > input::placeholder {
color: var(--bleu-clair);
font-style: italic;
}
.footer-newsletter-inputs > input {
flex: 1;
padding: 1rem;
margin: 0;
border: none;
color: #ffffff;
font-size: 1rem;
background-color: var(--bleu-fonce);
transition: background 0.3s ease-in-out;
}
.footer-newsletter-inputs > input:focus {
outline: none;
background-color: var(--bleu-clair);
}
.footer-newsletter-inputs > button {
display: inline-block;
height: auto;
padding: 1rem;
margin: 0;
font-size: 1rem;
border: none;
border-radius: unset;
background-color: #ffffff;
cursor: pointer;
}
.footer-reseaux {
grid-column: 4 / 5;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.footer-reseaux a {
display: inline-block;
width: 50px;
color: #ffffff;
transition: color 0.3s ease-in-out;
}
.footer-reseaux a:hover {
color: var(--bleu-clair);
}
.footer-reseaux i {
font-size: 2rem;
}
.footer-links ul {
padding: 0;
}
.footer-links li {
list-style: none;
margin: 0;
}
.footer-mentions {
text-align: center;
padding: 3rem 0 0 0;
}
.footer-mentions a {
color: #ffffff;
}
#liens_footer {
padding: 2rem 0 0 0;
text-align: center;
}
.link_footer {
color: var(--bleu-clair) !important;
}
.content_block {
max-width: 1024px;
width: 100%;
margin: auto;
}
.espace_ligne {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 6rem;
}
.espace_ligne::after {
display: block;
content: "";
position: absolute;
width: 100%;
height: 1px;
background-color: #cecece;
}
/**
* Message OK
*/
.rond_confirm_envoi {
display: flex;
justify-content: center;
align-items: center;
width: 60px;
height: 60px;
margin: auto;
font-size: 2rem;
color: #ffffff;
border-radius: 999px;
background-color: var(--bleu-fonce);
}
.garantie_form_message {
max-width: 1200px;
width: 100%;
margin: 2rem auto;
padding: 1rem;
text-align: center;
}
/**
*
*/
#containeur_garantie {
background: url(../images/gbb/bg_garantie.png) top center no-repeat;
padding: 4rem 0;
}
#containeur_garantie h1 {
text-transform: uppercase;
font-size: 1.8rem;
margin-top: 0;
margin-bottom: 2rem;
}
.ct_text_garantie {
padding: 0 2rem;
margin-bottom: 3rem;
}
.ct_text_garantie ul,
.ct_text_garantie li {
margin: 0;
padding: 0;
list-style: none;
}
.ct_text_garantie li p {
margin: 0 0 0.3rem 0;
}
.garantie_legende p {
font-size: 0.7rem;
margin: 0;
}
/**
* GROUP INPUT TEXT
*/
#contact-form * {
box-sizing: border-box;
}
#contact-form {
font-size: 1rem;
}
.group_inputs {
display: grid;
grid-template-columns: repeat(2,1fr);
column-gap: 4rem;
}
.form-group {
display: flex;
flex-direction: column;
width: 100%;
margin-bottom: 2rem;
}
.form-group > label {
display: block;
margin-bottom: 0.5rem;
}
.form-group input[type="text"] {
width: 100%;
padding: 1rem 0.5rem;
border: 1px solid #cecece;
border-radius: 0.5rem;
background-color: #fdfbfb;
}
.form-group select {
width: 70px;
padding: 0.5rem 1rem;
margin-bottom: 1rem;
}
.form-group textarea {
width: 100%;
padding: 1rem 0.5rem;
border: 1px solid #cecece;
border-radius: 0.5rem;
background-color: #fdfbfb;
resize: none;
}
.small_label {
margin-left: 0.5rem;
font-size: 0.8rem;
cursor: pointer;
}
.garantie_form_message_warning {
display: flex;
align-items: center;
padding: 0.5rem 0;
}
.garantie_form_message_warning::before {
display: flex;
justify-content: center;
align-items: center;
content: "!";
font-weight: 700;
width: 1.1rem;
height: 1.1rem;
margin-right: 0.5rem;
color: #ffffff;
background-color: var(--rouge);
}
/**
* BOUTON
*/
.gbb-button {
display: inline-block;
font-size: 1.1rem;
padding: 1rem 2rem;
border: none;
color: #ffffff;
border-radius: 0.5rem;
background-color: var(--bleu-fonce);
transition: background-color 0.2s linear;
cursor: pointer;
}
.gbb-button:active,
.gbb-button:hover {
background-color: var(--rouge);
}
/* Toogle Slider input Greg */
.ct_toggle {
display: flex;
flex-direction: row;
align-items: center;
margin: 0.5rem 0;
}
.ct_toggle > span {
flex: 1;
font-size: 0.8rem;
margin-left: 0.5rem;
}
.toggle {
position: relative;
display: inline-block;
width: 44px;
height: 24px;
}
.toggle input {
opacity: 0;
width: 0;
height: 0;
}
.toggle .slider {
display: block;
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
transition: .4s;
}
.toggle .slider:before {
position: absolute;
display: block;
content: "";
width: 12px;
height: 12px;
top: 6px;
left: 6px;
background-color: #fff;
-webkit-transition: .4s;
transition: .4s;
}
.toggle input:focus {
background-color: pink;
}
.toggle input:checked + .slider {
background-color: var(--bleu-fonce);
}
.toggle input:checked + .slider:before {
-webkit-transform: translateX(20px);
-ms-transform: translateX(20px);
transform: translateX(20px);
}
.toggle input:focus + .slider {
box-shadow: 0 0 1px #2196F3;
}
.toggle .slider.round {
border-radius: 17px;
}
.toggle .slider.round:before {
border-radius: 50%;
}
/*--- FIN toggle Slider ---*/
.list_garantie ul {
list-style: none;
}
.list_garantie li {
display: block;
margin-bottom: 1rem;
}
.list_garantie h3 {
font-size: 1rem;
padding: 0;
margin: 0;
}
.list_garantie p {
padding: 0 0 0 1.5rem;
margin: 0;
}
@media screen and (max-width: 850px) {
#containeur_garantie {
background: none;
}
#containeur_garantie h1, #containeur_garantie h2, #containeur_garantie h3 { font-weight: normal; }
#containeur_garantie h2 {
font-size: 1.2rem;
}
.ct_text_garantie {
padding: 0;
}
.content_block {
padding: 0 1rem;
}
.group_inputs {
display: block;
}
.ct_toggle > span {
font-size: 0.95rem;
}
.list_garantie ul {
padding-left: 0;
}
.list_garantie p {
padding: 1rem 0;
}
}
#contentTopCompte {
position: relative;
max-width: 1200px;
width: 100%;
margin: auto;
padding: 2rem 0;
}
#contentTopCompte h1 {
border: none;
}
#contentTopCompte::after {
display: block;
content: '';
left: 0;
bottom: 0;
position: absolute;
width: 100%;
height: 1px;
background-color: var(--orange);
}
#contentCompte {
max-width: 1200px;
width: 100%;
margin: auto;
}