h2 {width:100%; display:block; margin:45px auto !important; line-height:35px !important; color:#333 !important; font-weight:bold !important; letter-spacing:-0.8px !important; text-align: center;} .bl_accueil {width:100%; height:auto; margin:0px auto 40px auto;} .pubband {width:100%; height:auto; margin:0px auto; display: block;overflow: hidden; background:#fff; margin: 0px auto 30px auto;} .pubband .innerpub {display: block; width:100%; height:auto; transition:all 1.5s ease-in-out;} .pubband .innerpub .slidy {position: relative; width:100%; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; align-content: center;} .pubband .innerpub .slidy img {width:25%; height:auto; display: block; margin:50px 10% 50px 0px;} .pubband .innerpub .slidy .blbtit {width:55%; height:auto; margin:25px 0px 25px 10%;} .pubband .innerpub .slidy .blbtit .infomi {width:100%; height:auto; font-size:18px; color:#444; margin-bottom:30px; display: block;} .pubband .innerpub .slidy .blbtit h3 {width: 100%; height: auto; font-size: 45px; color: #222; margin-bottom: 50px; display: block; letter-spacing: -0.5px; font-weight: bold; } .pubband .innerpub .slidy .blbtit .descr {width: 100%; height: auto; font-size: 14px; color: #444; margin-bottom: 30px; display: block;} .pubband .innerpub .slidy .blbtit .zoneaction {width: 100%; max-width:450px; height: 45px; display: flex; align-items: center; justify-content: space-between;} .pubband .innerpub .slidy .blbtit .zoneaction .price {width: 100%; height: auto; font-size: 45px; color: #024b00; display: block;} .pubband .innerpub .slidy .blbtit .zoneaction .addcart {position: relative; border: solid 1px #73b43e; padding: 10px 50px; margin: 0; cursor: pointer; width: 50px; background:rgba(255,255,255,0.9); text-align: center; display: flex; transition: all .2s ease-out; border-radius:3px; margin-top: 10px;} .pubband .innerpub .slidy .blbtit .zoneaction .addcart:before {content: "+"; position: absolute; width: 10px; height: 10px; left: 42px; top: -20px; font-size: 12px; font-weight: 700; opacity: 0; -webkit-transition: .2s; transition: .2s;} .pubband .innerpub .slidy .blbtit .zoneaction .addcart svg {height:1.4em; margin: 0px 13px;} .pubband .innerpub .slidy .blbtit .zoneaction .addcart:hover {background:#f8f8f8;} .pubband .innerpub .slidy .blbtit .zoneaction .addcart:hover::before {top:6px; opacity:1;} .infoport {width:100%; height:600px; background:url('../img/illustration/fond-transport.jpg') center center no-repeat; background-size: cover; display: flex; flex-direction: column; justify-content: center; align-items: center; align-content: center; margin-bottom: 30px;} .infoport .zonetext {display: flex; flex-direction: column; justify-content: center; align-items: flex-start; align-content: center; width:auto; height:auto; margin:0px auto 0px 5%; padding: 0px 20px; text-align: center;} .infoport .zonetext .ttx1 {font-size:50px; color:#fff; font-weight: bold; margin: 0px; text-shadow: 0px 3px 12px rgba(0,0,0,0.4); line-height:1.8em;} .infoport .zonetext .ttx2 {font-size:80px; color:#e41616; font-weight: bold; margin: 0px; text-shadow: 0px 3px 12px rgba(0,0,0,0.4); line-height: 1.6em; display: flex; flex-direction: row; justify-content: center; align-items: center; align-content: center;} .explain-livr {margin:10px 0px 35px 0px; padding:2px;} .zonetabs {width:100%; margin:0px auto; height:auto;} .zonetabs .tabs-container {width: 100%;} .zonetabs div#tabs-nav {position: relative; display: flex; justify-content: flex-start; background: #dbdbdb;} .zonetabs div#tabs-nav a:nth-child(even) {margin:0px;} .zonetabs a.tabs-menu {display: inline-block; position:relative; background-color: #dbdbdb; font-size: 16px;text-transform: uppercase; line-height: 22px; color: #505050;padding: 10px 20px;text-decoration: none; border-top: solid 3px #dbdbdb;} .zonetabs a.tabs-menu.tabs-menu img {display: none;} .zonetabs a.tabs-menu:after {content:""; position:absolute; width:1px; height:45px; background:#fff; top: -3px; right: 0px;} .zonetabs a.tabs-menu.tabs-menu-active {background-color: #fff; border-top: solid 3px var(--color_theme); color: var(--color_theme);} .zonetabs .tabs-content {margin-top: -2px; overflow: hidden;line-height: 1.25; transition:all .2s ease-in-out;} .zonetabs .tabs-content .flex-content {display: flex; flex-direction: row; } .zonetabs .tabs-panel {display: none; min-height: 150px; overflow: auto; padding:25px 0px; height: auto; font-size: 14px; width:100%;} .zonetabs .tabs-panel .flex-content h2 {color:#444; margin:35px 0px 50px 0px; text-transform: uppercase; font-size:18px; display: flex; align-items: center; letter-spacing: -0.5px;} .zonetabs .tabs-panel .gridprod {width:100%; height:auto; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; align-content: center;} .zonetabs .gridprod .row_prod {width:calc(20% - 15px); min-width: 310px; height:480px; background:#fff; color:#353535; margin:0px 0px 15px 0px; display:inline-block; overflow:hidden; transition:all .2s ease-out;} .zonetabs .gridprod .row_prod:hover {box-shadow:0px 0px 5px rgba(0,0,0,0.4) ;} .zonetabs .gridprod .inner {position:relative; width:100%; height:100%; margin:0px; display:block; } .zonetabs .gridprod .inner .title {width:calc(100% - 30px); height:30px; display:block; font-size:14px; line-height:1.2em; text-align:center; color:#333; padding:15px;} .zonetabs .gridprod .inner .contener_img_1 {width:80%; height:480px; display:block; z-index:2; overflow:hidden;} .zonetabs .gridprod .inner .back_img {width:100%; height:auto; display:flex; text-align: center; margin:15px auto; position: relative;} .zonetabs .gridprod .inner .back_img img {width:60%; max-width:220px; margin:0px auto;} .zonetabs .gridprod .inner .zone-price {width:100%; font-size:20px; font-weight:300; line-height:28px; color:var(--color_theme); text-align:center; display: flex; align-items: center; justify-content: center;} .zonetabs .gridprod .inner .zone-price sup {vertical-align: super; font-size: 13px;} .zonetabs .gridprod .inner .zone-price .zone-price_ht {width:auto; font-size:12px; font-weight:normal; color:#afafaf; margin:0px 0px 0px 5px; line-height: 28px;} .zonetabs .gridprod .inner .zone-price .zone-price_ht sup {vertical-align: super; font-size: 11px;} .zonetabs .gridprod .inner .refinterne {font-size:11px; color:#999; margin:5px 0px; width:100%; text-align: center;} .zonetabs .gridprod .inner .logointerne {width:100%; height:26px; position:relative;} .zonetabs .gridprod .inner .infomarque {position: absolute; top:0px; right:15px;} .zonetabs .gridprod .inner .infomarque img {width:85px;} .zonetabs .gridprod .inner .tag {background: #eee; border-radius: 3px 0 0 3px; color: #999; display: inline-block; height: 26px; line-height: 26px; padding: 0 20px 0 23px; position: absolute; top:0px; left: 10px; margin: 0 10px 10px 0; text-decoration: none;} .zonetabs .gridprod .inner .tag::before {background: #fff; border-radius: 10px; box-shadow: inset 0 1px rgba(0, 0, 0, 0.25); content: ''; height: 6px; left: 10px; position: absolute; width: 6px; top: 10px;} .zonetabs .gridprod .inner .tag::after {background: #fff; border-bottom: 13px solid transparent; border-left: 10px solid #eee; border-top: 13px solid transparent; content: ''; position: absolute; right: 0; top: 0; } .zonetabs .gridprod .inner .nouveau {background:#fffb00; color:#000;} .zonetabs .gridprod .inner .nouveau:after {border-left: 10px solid #fffb00;} .zonetabs .gridprod .inner .promo {background:#4be064; color:#000;} .zonetabs .gridprod .inner .promo:after {border-left: 10px solid #4be064;} .zonetabs .gridprod .inner .destock {background:var(--color_theme); color:#fff;} .zonetabs .gridprod .inner .destock:after {border-left: 10px solid var(--color_theme);} .zonetabs .gridprod .inner .zoneaction {width:100%; height:45px; display: flex; align-items: center; justify-content: space-around; padding-top: 20px;} .zonetabs .gridprod .inner .zoneaction .addcart {position: relative; border: solid 1px #73b43e; padding: 10px 20px; margin: 0; cursor: pointer; width: 50px; background:rgba(255,255,255,0.9); text-align: center; display: flex; transition: all .2s ease-out; border-radius:3px;} .zonetabs .gridprod .inner .zoneaction .addcart:before {content: "+"; position: absolute; width: 10px; height: 10px; left: 42px; top: -20px; font-size: 12px; font-weight: 700; opacity: 0; -webkit-transition: .2s; transition: .2s;} .zonetabs .gridprod .inner .zoneaction .addcart svg {height:1.4em; margin: 0px 13px;} .zonetabs .gridprod .inner .zoneaction .addcart:hover {background:#f8f8f8;} .zonetabs .gridprod .inner .zoneaction .addcart:hover::before {top:6px; opacity:1;} .zonetabs .gridprod .inner .zoneaction .nocart {position: relative; border: solid 1px #ff5e00; padding: 10px 20px; margin: 0; cursor: pointer; width: 50px; background:rgba(255,255,255,0.9); color:#ca4814; font-size:11px; text-align: center; display: flex; transition: all .2s ease-out; border-radius:3px;} .zonetabs .gridprod .inner .zoneaction .viewdet {position: relative; border: solid 1px #73b43e; padding: 10px 20px; margin: 0; cursor: pointer; width: 50px; background:rgba(255,255,255,0.9); text-align: center; display: flex; transition: all .2s ease-out; border-radius:3px;} .zonetabs .gridprod .inner .zoneaction .viewdet:before {content: "i"; color:#000; position: absolute; width: 10px; height: 10px; left: 40px; top: -20px; font-size: 12px; font-weight: 700; opacity: 0; -webkit-transition: .2s; transition: .2s;} .zonetabs .gridprod .inner .zoneaction .viewdet svg {height:1.4em; margin: 0px 13px;} .zonetabs .gridprod .inner .zoneaction .viewdet:hover {background:#f8f8f8; } .zonetabs .gridprod .inner .zoneaction .viewdet:hover::before {top:11px; opacity:1;} .zonetabs .animated-tabs {-webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .zonetabs .contact-content {display: flex; align-items: center; justify-content: center;} .zonetabs .contact-content img {margin:0px 50px 50px 0px;} .zonetabs .contact-content p {font-size:15px;} .zonetabs .contact-content .boutonQ {position:relative; background: var(--background_good); color: #fff !important; padding: 12px 30px; margin:10px auto; font-size: 18px; cursor: pointer; letter-spacing: -0.5px; width: 215px; text-align: center; display:block; transition:all .2s ease-out;} .zonetabs .contact-content .boutonQ a {color:#fff;} .zonetabs .contact-content .boutonQ:hover {background-color:#ca4814;} .bl_accueil .gridcat {width:100%; height:auto; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center; align-content: center; margin:30px auto 0 auto; box-shadow: 0px 50px 20px rgba(0,0,0,0.04);} .bl_accueil .gridcat .row_cat {width:calc((100% / 6) - 5px); height:auto; background:#fff; color:#353535; margin:0px; display:inline-block; overflow:hidden; transition:all .2s ease-out;} .bl_accueil .gridcat .row_cat:hover {box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.25);} .bl_accueil .gridcat .row_cat img {width:200px; margin: 10px auto 0px auto; display: block;} .bl_accueil .gridcat .row_cat h3 {display:block; margin:30px auto; text-align: center; position: relative; width: fit-content; letter-spacing: -0.5px; font-size: 18px;} .bl_accueil .gridcat .row_cat h3:after {content: "chevron_right"; font-family: Material Icons; color: var(--color_hview); position: absolute; top: 1px; right: -35px; font-size: 32px !important; width: 30px; height: 30px;} .bl_accueil .gridbrand {width:100%; height:auto; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: center; align-content: center; box-shadow: 0px 50px 20px rgba(0,0,0,0.04);} .bl_accueil .gridbrand .prev_arrow {width:30px; margin-right:25px;} .bl_accueil .gridbrand .next_arrow {width:30px; margin-left:25px;} .bl_accueil .gridbrand .innercarrou {width:100%; height:auto; display:block; overflow: hidden; background: #fff;} .bl_accueil .gridbrand .innercarrou .slider {width:auto; height:auto; display: flex;flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: center; align-content: space-between; transition:all .8s ease-out;} .bl_accueil .gridbrand .innercarrou .slider .cardin {height: auto; flex: 0 0 10%; max-width: 10%; margin: 20px 30px; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word;} .bl_accueil .gridbrand .innercarrou .slider .cardin img {display:block; width:100%;} .bl_accueil .infomark {width:100%; height:auto; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: center; align-content: center; background:#333; box-shadow: 0px 50px 20px rgba(0,0,0,0.04);} .bl_accueil .affichenotif {cursor: pointer;} .bl_accueil .infomark .boxy {height: auto; width:calc((100% / 6) - 20px); padding:10px; margin: 20px; display: flex; flex-direction: column; min-width: 0; font-size:18px; text-transform: uppercase; color:#ddd; text-align:center;} .bl_accueil .infomark .boxy a {color:var(--background_good);} .bl_accueil .infomark .boxy a:hover {color:#fff;} .bl_accueil .infomark .boxy img {width:110px; display: block; margin:0px auto 25px auto;} .bl_accueil .infomark .boxya {width:60%; padding:20px; color:#eee; font-size: 18px;} .bl_accueil .infomark .boxyb {width:20%; padding:20px;} .bl_accueil .infomark .infopay {width:100%; max-width:450px; margin:5px auto;} @media screen and (min-width:100px) and (max-width:640px) { .infoport {height: auto;} .infoport .zonetext {margin: 30px 0px;} .infoport .zonetext .ttx1 {font-size: 28px;} .infoport .zonetext .ttx2 {font-size: 50px;} .infoport .zonetext .ttx2 img {width: 100px;} .explain-livr {padding:10px;} .pubband .innerpub .slidy img {width: 100% !important; max-width: 100% !important; margin: 25px 5% 25px 5%;} .pubband .innerpub .slidy .blbtit {width:90%; margin: 25px 5% 25px 5%;} .pubband .innerpub .film_roll_prev {display:none !important;} .pubband .innerpub .film_roll_next {display:none !important;} .gridprod {flex-direction: column !important;} .gridprod .row_prod {width: 90% !important; height: 480px !important;} .bl_accueil .gridcat {width: 100%; height: auto; flex-wrap: wrap;} .bl_accueil .gridcat .row_cat {width:calc(50% - 5px); margin-bottom:5px;} .bl_accueil .gridcat .row_cat h3 {font-size: 16px;} .bl_accueil .gridcat .row_cat h3::after {top: 0px; right: -25px; font-size: 25px !important;} .bl_accueil .gridprod .inner .tag {top: -25px !important; left: 5px !important;} .bl_accueil .gridprod .inner .infomarque {top: -25px !important; right: 5px !important;} .bl_accueil .gridprod .row_pub2x1 {width: 100% !important; height: auto !important;} .bl_accueil .gridprod .row_pub2x1 img {width: 100% } .bl_accueil .infoconfig .back2 {display:none;} .bl_accueil .infoconfig .back3 {opacity: 0.6;} .bl_accueil .infoconfig .infotext h5 {font-size: 30px;} .bl_accueil .infoconfig .back4 {left: -90px; font-size: 270px;} .bl_accueil .contain .reabox {flex-direction: column;} .bl_accueil .contain .reabox .blog-article {width: 100% !important;} .bl_accueil .infomark {flex-direction: column;} .bl_accueil .infomark .boxy {width: calc(100% - 60px);} .bl_accueil .gridbrand {flex-direction: column;} .bl_accueil .gridbrand .innercarrou .slider {flex-direction: column;} .bl_accueil .gridbrand .innercarrou .slider .cardin {max-width: 70%;} } @media screen and (min-width:641px) and (max-width:1080px) { .bl_accueil .gridcat {width: 100%; height: auto; flex-wrap: wrap;} .bl_accueil .gridcat .row_cat {width:calc(33.33% - 5px); margin-bottom:5px;} .bl_accueil .gridcat .row_cat h3 {font-size: 16px;} .bl_accueil .gridcat .row_cat h3::after {top: 0px; right: -25px; font-size: 25px !important;} .gridprod {flex-wrap: wrap;} .gridprod .row_prod {width: 48% !important; height: 480px !important;} }