@charset "utf-8"; @import url('fonts/Roboto/roboto.css?v=1.3.0'); @import url("slick.css?v=1.3.0"); @import url("tunnel-rdv.css?v=1.3.0"); .reassurance { background-color:#F5F5F5;font-size:0;position:relative;z-index:1; } .reassurance .content-wrapper { padding:0 22px; } .reassurance .items { padding:0;display:flex;flex-direction:row;justify-content:space-between;height:58px;margin-bottom:0; } .reassurance .items .slick-track{ width:100%; } .reassurance .items .slick-track .slick-list{ height:100%; } .reassurance .items a { box-sizing:border-box;height:58px;font-family: Roboto, serif;color:#6F6E6B;font-size:15px;display:flex;flex-direction:column;justify-content:center;padding-left:54px;position:relative; } .reassurance .items a:before { content:" ";display:block;width:42px;height:42px;position:absolute;left:0;top:8px;background-repeat:no-repeat;background-position:center; } .reassurance .items a.shed:before { background-image:url('/media/home/sousnav/centre.png'); } .reassurance .items a.paiement-2x:before { background-image:url('/media/home/sousnav/2x.png'); } .reassurance .items a.capital:before { background-image:url('/media/home/sousnav/capital.png');background-size:cover; } /*.reassurance .items a.avis-verifies:before { background-image:url(../img/icons/logo_avisverifies.png); }*/ .reassurance .items a.avis-verifies img { position:absolute;left:-5px; } .flash-sales-and-code { margin-top:-100px;position:relative; } .flash-sales-and-code .content-wrapper { position:relative;padding:12px;display:flex;flex-direction:row; } .flash-sales-and-code .content-wrapper::before { content:" ";display:block;border-radius:4px;background-color:white;position:absolute;top:12px;bottom:12px;left:12px;right:12px;z-index:0;box-shadow: 0px 2px 12px rgba(40, 40, 40, 0.15); } .flash-sales-and-code .content-wrapper .flash-sales-content, .flash-sales-and-code .content-wrapper .code-content { position:relative;z-index:1;padding-top:20px; } .flash-sales-and-code .content-wrapper .flash-sales-content { width:774px;padding:20px 30px 10px 96px;flex-shrink:0;border-right:2px solid #EDEDED;box-sizing: border-box; } .flash-sales-and-code .content-wrapper .flash-sales-content span, .flash-sales-and-code .content-wrapper .code-content > span { font-family:"Intro-Regular";font-size:18px; } .flash-sales-and-code .content-wrapper .flash-sales-content p, .flash-sales-and-code .content-wrapper .code-content p { color:#6F6E6B;margin-top:5px;font-size:12px;line-height:24px; } .flash-sales-and-code .content-wrapper .flash-sales-content::before { content:" ";position:absolute;left:27px;top:13px;background:url('../tunnel/img/icon-venteflash.png') no-repeat center;width:49px;height:66px; } .flash-sales-and-code .content-wrapper .flash-sales-content form { padding:8px;background-color:#F7E5F1; } /*.flash-sales-and-code .content-wrapper .flash-sales-content form input { width:100%;height:48px;font-size:14px;padding:0 15px;border-radius:5px; }*/ .flash-sales-and-code .content-wrapper .flash-sales-content form .container-autocomplete-adress { margin-right:8px; } .flash-sales-and-code .content-wrapper .flash-sales-content form input[type=button] { width:248px;font-size:16px;height:54px; } .flash-sales-and-code .content-wrapper .flash-sales-content small { font-size:10px;color:#6F6E6B;line-height:14px;display:inline-block;margin:10px 5px 0; } .flash-sales-and-code .content-wrapper .code-content { padding-left:117px;position:relative;z-index:0; } .flash-sales-and-code .content-wrapper .code-content::before { content:" ";position:absolute;left:27px;top:18px;background:url('../img/visuels/hp_logo-lecode.png') no-repeat center;width:66px;height:62px; } .flash-sales-and-code .content-wrapper .code-content p { margin-bottom:10px;font-size:15px; } .flash-sales-and-code .content-wrapper .code-content .new-code, .home-offres .content-wrapper > ul li.item .content .new-lecode { background-color:#00823F;color:white;font-size:14px;font-weight:400;padding:8px;margin-bottom:22px;display:inline-block; } .flash-sales-and-code .content-wrapper .code-content .new-code span, .home-offres .content-wrapper > ul li.item .content .new-lecode span { font-weight:300; } .flash-sales-and-code .content-wrapper .code-content .dekra-btn { width:220px;box-shadow:none;margin-top:28px; } @media only screen and (max-width:1140px) { .flash-sales-and-code .content-wrapper .flash-sales-content { width:100%;border-right:0;border-bottom:2px solid #EDEDED; } .flash-sales-and-code .content-wrapper { flex-direction:column;} .flash-sales-and-code .content-wrapper .code-content p br { display:none; } .flash-sales-and-code .content-wrapper .code-content .dekra-btn { position:absolute;right:37px;bottom:16px; } .flash-sales-and-code .geo { position: absolute; right: 6px; top: 12px; background: none; } .flash-sales-and-code .content-wrapper .code-content { padding-left:96px; } .flash-sales-and-code .content-wrapper .code-content::before { width: 56px; height: 53px; left: 19px; top: 13px; background-size: contain; } } @media only screen and (max-width:979px) { /*body { font-size:0; }*/ .reassurance { background-color:#FFF; } .reassurance .content-wrapper { padding:0; } .reassurance .items { opacity:0;display:block; } .reassurance .items.slick-initialized { opacity:1; } .reassurance .items .slick-track, .reassurance .items .slick-track .slick-list, .reassurance .items .slick-track .slick-list .draggable, .reassurance .items .slick-track .slick-list .draggable > div { height:100%; } .reassurance .items a { margin-left:20px;font-size:13px;padding-left:50px; } .reassurance .items a.avis-verifies img { position: static;margin-right:10px;margin-left: -52px; } .reassurance .items a br { display:none; } .reassurance .items a span { flex-direction:column;justify-content:center;margin-right:3px; } .reassurance .items .slick-track .slick-slide { opacity: 0.6; } .reassurance .items .slick-track .slick-slide.slick-active { opacity: 1; } .reassurance .items { width:100%; } .reassurance .items a { margin-left:0;padding-left:0;display:flex;flex-direction:row;align-items:center; } .reassurance .items a:before { position:static;margin-right:10px; } .reassurance .items .slick-track .slick-slide { min-width:250px; } } /*****************************************************************************************************************************/ /* HOME PAGE */ /*****************************************************************************************************************************/ .header-container h2 { color:#FFF; text-align:center; padding:0 2em; font-weight:normal; line-height:normal} .header-container fieldset { padding:10px 3px 0 10px; background:rgba(255,255,255,0.25); overflow:hidden;} .header-container form.search input, .header-container form.search select, .header-container form.search button { margin:0 11px 10px 0; float:left; } .header-container form.search button.jq-cta-geoloc { font-weight:500; background:url(../img/icons/ico-geo.jpg) no-repeat 3px 50% #fff; color:#57ab27; padding-left:40px; line-height: 1.2em; position:relative; } .header-container form.search input[type="submit"]{margin-right:0px;} .header-container form.search button:before { content:'Ou'; position:absolute; left:-40px; top:0px; display:block; border:1px solid #ccc; border-bottom:0; border-top:0; padding:15px 7px; background:#fff; z-index:9; color:#ccc; width:24px; } .header-container form input, .header-container form button { padding:15px } .header-container form input[type="text"] { margin:0 0 10px 0; color:#999999; } .header-container form.search input[type="text"] {border-top-right-radius: 0;border-bottom-right-radius: 0;} .header-container form.search input[type="text"].error { border:0!important; background:#FFD5D5; } .header-container form.focus button:before { display:none;} .header-container form cite { font-size:11px; color:#b7b2ac; font-style:normal; } .header-container .flash-sales { background:#b80073; color:#fff; width:100%; padding:10px 5px; overflow:hidden;} .header-container .flash-sales span, .header-container .flash-sales p{margin:0; font-size:0.9em;} .header-container .flash-sales span { font-style:italic; font-size:1.6em; font-weight:normal; letter-spacing:1px; text-transform:uppercase; } .header-container .flash-sales form { } .header-container .flash-sales form input[type="text"] { font-size: 1em; padding: 11px 20px; width:138px; margin:0 10px 0 0; border:1px solid transparent; } .header-container .flash-sales form input[type="submit"] { font-size: 1em; padding: 11px 20px 7px 20px; } /**/ section ul { list-style:none; margin:0; padding:0;} section h2 { text-align:center; font-weight:300; font-size:2.5em; color:#303030; } section.offres {} section.offres .thumb{ position:relative; display:block; overflow:hidden;} section.offres .thumb img { max-width:100%; } section.offres .thumb span{ position:absolute; bottom:0; left:0px; width:73%; display:block; padding:10px 3%; line-height:normal; color:#fff; font-size:1.1em; text-transform:uppercase;} section.offres .thumb span:before{ content:""; position:absolute; bottom:0; right:-42px; display:block; width: 0; height: 0; border-bottom: 41px solid #c0c0c0; border-right: 43px solid transparent;} section.offres .carousel li.item { margin:0 10px 0 0; outline:0; /*margin:0 10px; width:307px!important; */} section.offres .item .content{ background:#FFF; padding: 20px; min-height:120px; font-size:1.05em; line-height:1.5em; position:relative; padding-bottom:50px;} section.offres .item .content p{ margin:0 0 10px 0} section.offres .item a.action { position:absolute; right:20px; bottom:20px; } section.offres .item a.action:after { } /**/ section.offres .item.green .thumb span{ background:#57ab27} section.offres .item.red .thumb span{ background:#ee232d} section.offres .item.purple .thumb span{ background:#9e1c45} section.offres .item.green a.action{ color:#57ab27} section.offres .item.red a.action{ color:#ee232d} section.offres .item.purple a.action{ color:#9e1c45} section.offres .item.green a.action:after{ border-color:#57ab27} section.offres .item.red a.action:after{ border-color:#ee232d} section.offres .item.purple a.action:after{ border-color:#9e1c45} section.offres .item.green .thumb span:before{ border-bottom-color:#57ab27} section.offres .item.red .thumb span:before{ border-bottom-color:#ee232d} section.offres .item.purple .thumb span:before{ border-bottom-color:#9e1c45} /**/ section.about { } section.about .grid-50{ margin:10px 20px; width:45%; } section.about h2 { text-align:left; line-height:43px; } section.about h2 i { display:inline-block; width:54px; height:43px; position:relative; top:9px; } section.about h2 i.about { background:url(../img/icons/ico-info.png) no-repeat; } section.about h2 i.faq { background:url(../img/icons/ico-faq.png) no-repeat; width:63px; } section.about h3 { font-size:1em; } section.about span { font-size:1em; font-weight: bold; } section.about ul li {} section.about ul li a{ color:#333333; text-decoration:none; display:block; padding:0 0 14px 0; font-weight:400; font-size:1.2em; } section.about ul li a:hover{ text-decoration:none; color:#57ab27;} .slick-arrow { text-decoration: none; display: block; width: 38px; height: 72px; margin: -36px 0 0; position: absolute; top: 50%; z-index: 10; overflow: hidden; opacity: 1; cursor: pointer; color: rgba(0, 0, 0, 0.8); font-size: 0; outline: none;} .slick-arrow.slick-next { right: -50px; background: url(../img/layout/arrow-slider-next.png) no-repeat 50% 50%;} .slick-arrow.slick-prev { left: -50px; background: url(../img/layout/arrow-slider-prev.png) no-repeat 50% 50%;} .slick-arrow.slick-next.slick-disabled,.slick-arrow.slick-prev.slick-disabled { opacity:0.05;} .slick-dots { display: block; width: 100%; padding: 0; list-style: none; text-align: center; position:relative; top:-25px;} .slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer;} .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent;} .slick-dots li.slick-active button:before { opacity: 1; color:#57ab27;} .slick-dots li button:before { font-size: 50px; line-height: 50px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; content: '•'; text-align: center; opacity: .25; color: black; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;} .carousel { position:relative; padding:0 0 0 0;} .search.jq-validate input[type="submit"].jq-cta-sear { background: #58ab27; border-bottom-color: #017d41;} .search.jq-validate input[type="submit"].jq-cta-sear.disabled { background: #d6d4d5; border-bottom-color: #9b9b9b;} /*****************************************************************************************************************************/ @media only screen and (min-width: 980px) { .main-container { padding-bottom:30px;} .main-container.home { padding-top:30px; } .header-container.home { height:600px; } .header-container h2 { font-size:3em; padding:0 2em; } .header-container form.search input[type="text"] { width:292px; } .header-container .capital-first { width: 400px; height:150px; padding: 10px 5px; position: absolute; bottom: -50px; left: 0; cursor:pointer; } .header-container .capital-first:before { content:""; display:block; position:absolute; top:0; left:0; right:0; bottom:0; background-color:white; opacity:0.6; border-radius:0 10px 10px 0; } .header-container .capital-first img, .header-container .capital-first .txt { position:absolute; } .header-container .capital-first img { width:150px;height:150px; } .header-container .capital-first .txt { position:absolute;right:10px;width:260px;text-align:center;font-size:21px;top:20px;line-height:28px; } .header-container .capital-first .txt strong { display:block;font-size:23px;margin-top:15px; } .header-container .flash-sales { border:5px solid #ccc8bf; max-width:620px;padding:10px 5px; position:absolute; bottom:-20px; right:0px; -moz-box-shadow: 2px 2px 15px 0px #656565; -webkit-box-shadow: 2px 2px 15px 0px #656565;-o-box-shadow: 2px 2px 15px 0px #656565;box-shadow: 2px 2px 15px 0px #656565;filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=134, Strength=15);background: #b2006f;background: -moz-linear-gradient(top, #b2006f 0%, #c5007b 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#b2006f), color-stop(100%,#c5007b)); background: -webkit-linear-gradient(top, #b2006f 0%,#c5007b 100%); background: -o-linear-gradient(top, #b2006f 0%,#c5007b 100%);background: -ms-linear-gradient(top, #b2006f 0%,#c5007b 100%);background: linear-gradient(to bottom, #b2006f 0%,#c5007b 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2006f', endColorstr='#c5007b',GradientType=0 );-webkit-border-top-left-radius: 5px;-webkit-border-bottom-left-radius: 5px;-moz-border-radius-topleft: 5px;-moz-border-radius-bottomleft: 5px;border-top-left-radius: 5px;border-bottom-left-radius: 5px; overflow:inherit!important;} .header-container .flash-sales form { float:left; width:46%; margin:13px 1% 0 1%; } .header-container .flash-sales .content { background:url(../img/icons/ico-flash-big.png) no-repeat 0% 50%; padding-left:50px; float:left; width:41%; margin:0 1%; } .header-container .flash-sales .sec-infos{ position: absolute; top: 96px; left: 18px; color: #444; font-size: 0.75em; font-style: italic; max-width:600px;} .header-container .flash-sales .sec-infos i{ text-decoration:underline;} .header-container form.search button.jq-cta-geoloc { font-weight:500; background:url(../img/icons/ico-geo.jpg) no-repeat 3px 50% #fff; color:#57ab27; padding-left:40px; line-height: 1.2em; border-top-left-radius: 0;border-bottom-left-radius: 0; position:relative; } .flex-direction-nav .flex-next { background:url(../img/layout/arrow-slider-next.png) no-repeat 50% 50%;} body .pac-container { /*width:490px!important;*/} section.offres .carousel .slick-track{ display: flex; flex-wrap: wrap;} section.offres .carousel li.item { /*margin:0 10px; width:307px!important; */ display:inline-block;vertical-align:middle;float:left;max-width:calc((100% / 3) - 12px);} section.offres .carousel .slides{display:block;width:100%;max-height:600px;} section.offres .carousel .slides.initialize{overflow:initial;max-height:initial;} section.offres .carousel li.item .blv_item{transition: all 300ms ease;margin:20px 10px;} section.offres .carousel li.item.slick-center .blv_item, section.offres .carousel .no-slide li.item:nth-child(2) .blv_item{ -moz-transform: scale(1.09); -ms-transform: scale(1.09); -o-transform: scale(1.09); -webkit-transform: scale(1.09); transform: scale(1.09);} section.offres .carousel .slick-slider{width:100%;} section.engagements { background: url(../img/layout/bg-gradient-green.jpg) no-repeat 50%; overflow: hidden; padding: 15px 0;} section.engagements h3, section.engagements p { margin:1em 0.6em;} section h2 b.fa { display:none;} body .carousel { padding: 0 0 40px 0;} .slick-dots { top:0} } /*****************************************************************************************************************************/ @media only screen and (max-width: 979px) { .header-container form input,.header-container form select,.header-container form button { width:auto; float:none; } .header-container form.search input[type="text"], .header-container form.search select, .header-container form.search button, .header-container form.search input[type="submit"] { border-radius:5px; border-top-right-radius:5px; border-bottom-right-radius:5px; display:block; margin:0 auto 10px auto; width:100%; padding:15px 0; text-align:center; } .header-container fieldset { padding:10px; margin:10px 10px 30px 10px;} .header-container form.search button:before, .slick-arrow { display:none!important;} .header-container .capital-first { cursor:pointer;display:flex;padding:10px;background-color:white;text-align:center;font-size:16px;line-height:28px; } .header-container .capital-first img { width:130px;height:130px; } .header-container .capital-first .txt { width:100%; } .header-container .capital-first .txt strong { display:block;font-size:18px;margin-top:18px; } .header-container .flash-sales { padding:30px 10px; text-align:center} .header-container .flash-sales form{ margin:20px 0 0 0; } .header-container .flash-sales h3 { font-size:2em; } .header-container .flash-sales h3:before { content:''; display:inline-block; background:url(../img/icons/ico-flash-big.png) no-repeat; width: 25px; height: 30px; background-size: 100% 100%;} section.offres .thumb img { width:100%} section.offres .carousel li.item { margin:8px!important; padding: 0;} section.about .grid-50 { width:auto; float:none; margin:0;} .header-container form.search select.hide-mobile, section.about h2 i { display:none;} section.engagements {/*padding-bottom:30px;*/} .wrapper { padding:0;} .wrapper .toggle-content p,.wrapper .toggle-content h3{ padding:0 10px;} section.about ul { list-style:inside; padding:10px 0;} section.about ul li { padding:0px ;} section.about ul li a { padding:5px 10px ; text-decoration:underline; font-size:1em;} .header-container .flash-sales .sec-infos{ margin:15px 0 0 0; font-size: 0.75em; font-style: italic;} .header-container .flash-sales .sec-infos i{ text-decoration:underline;} } /*****************************************************************************************************************************/