@charset "UTF-8";
/* CSS Document */
@import url(https://fonts.googleapis.com/css?family=Lato:400,300,100,300italic,400italic,700,700italic,900,900italic,100italic|Montserrat:400,700|Domine:400,700);
/*---  HTML5 READY ---*/
body { color: #000; font-family: 'Lato', sans-serif; overflow-x: hidden; }
article, footer, section, header, main, aside, nav, a, form, ul, li, i, div, span, label { -webkit-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; }
.cycle-slideshow, .cycle-slide, .gmap div { transition: none !important; -webkit-transition: none !important; -ms-transition: none !important; -o-transition: none !important; }
main:after, section:after, header:after, aside:after, footer:after, nav:after, form:after, article:after, ul:after, div:after, .tabs_content li:after { clear: both; content: ""; display: block; font-size: 0; height: 0; line-height: 0; visibility: hidden; width: 0; }
/* style gen */
p { font-family: 'Lato', sans-serif; color: #111; }
a { text-decoration: none; color: #e52629; font-size: 16px; position: relative; }
a:hover { color: #e52629; }
h1 { font-family: 'Montserrat', sans-serif; font-weight: 500; font-size: 30px; color: #000; margin:30px 0; position: relative; }
h1:after { content: ""; width: 70px; height: 2px; background: #000; position: absolute; bottom: -15px; left: 0; }
h2 { color: #333; text-transform: uppercase; font-size: 18px; font-weight: 600; margin: 0 0 10px 0; }
h3 { font-size: 16px; }
hr { margin: 0px 0px 70px; clear: both; height: 4px; background: #E9E9E9; border: none; }
/* custom form */
input { font-family: 'Lato', sans-serif; font-weight: 500; }
input[type="submit"]{ background:#000; margin:10px 0;}
input[type="submit"]:hover { background:#e52629;}
input:hover, textarea:hover, select:hover, file:hover { border-color: #e52629;}
input:focus, textarea:focus, select:focus, file:focus { border-color: #e52629;}
label span{ background:#000;}
.selectElem:hover i, .selectElem:focus i { color: #e52629;}
input:hover + .checkbox, input:hover + .radio { border-color: #e52629;}
input:focus + .checkbox, input:focus + .radio {  border-color: #e52629;}
input:focus + .radio::before {  background: #e52629;}
input:focus + .checkbox::before { border-color: #e52629;}
input:checked + .checkbox, input:checked + .radio { border: 3px solid #e52629;}
.checkbox:before { border-color:#e52629;}
.radio::before{ background: #e52629;}
.radioElem{ float:left; margin:0 10px;}
.form_authent input[type="submit"]:hover{ background:#FFF;}
/*------------*/
/*HEADER*/
/*------------*/
header{ height:91px; transition: all .5s;}
#logo{ position:absolute; top:120px; left:5%; z-index:500; transition: all .5s;}
#logo h1, #logo a{ background: url("/images/logo.svg") no-repeat 0 0 / contain rgba(0, 0, 0, 0); text-indent: -999em; display: block; width: 362px;
height: 130px; margin:0; transition: all 0.5s;}
//#logo a{ width:270px; height:90px;}
#logo h1:after{ display: none;}
/* boutons sous logo */
.home .link{ position: absolute; top:240px; left: 5%; z-index:2000; display: block}
.mag .link, .edito .link{ position: relative; top:auto; left: auto; display: block;}
.link{ display: none; margin: 20px 0 0; }
.link .bt { width: 170px; height: 57px; border: 2px solid #000; background: #FFF; color: #000 !important; font-weight: 600; margin: 0 20px 0 0; cursor:pointer; text-transform: none !important; font-size: 16px !important; display: flex; float: left; justify-content: center; align-items: center; padding: 0 20px; text-align: center;}
.link .bt.abon{ background: #000; color: #FFF !important;}
.link .bt:hover { background: #CCC !important; color: #FFF !important; }
/* menu top */
#menu { display: flex; flex-direction: column; position: fixed; z-index: 8000; width: 100%; top:0;}
.fixed #menu{ box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.2);}
#menu ul li { display: inline-block; list-style: none; font-family: 'Lato', sans-serif; font-size: 18px; position:relative;}
/**/
#menu .nav_top { background: radial-gradient(circle, rgba(118,118,118,1) 0%, rgba(197,201,219,1) 71%); width: 100%; position: relative;/*  top: 0; left: 0;  */height: 39px; line-height: 36px; transition: all .5s; order: 0;}
#menu .nav_top > ul { margin:2px 0 0;}
#menu .nav_top > ul li a { display: block; height: 32px; line-height: 32px; padding: 0 15px; color: #000; font-size: 16px;}
#menu .nav_top > ul li a:hover { color: #e52629; }
#menu .nav_top > ul.fst{ float: left; margin: 2px 0 0 20px;}
#menu .nav_top > ul.fst li a{ border: 1px solid #000; border-radius:32px; padding: 0; height: 32px; line-height: 32px; width:32px; text-align: center;}
#menu .nav_top > ul.fst li a:hover{ border: 1px solid #e52629;}
#menu .nav_top > ul.snd{ float: right;}
#menu .nav_top > ul.thd{ float: right;}
#menu .nav_top > ul.thd li a{ display: flex; align-items: center; justify-content: center;}
#menu .nav_top > ul.thd li .submenu { min-width: auto;}
#menu .nav_top > ul.thd li .submenu li{ padding: 0;}
#menu .nav_top > ul.thd li .submenu li a{ padding: 0;}
/**menu_general**/
#menu .nav_main { background: #FFF; /* margin:0 0px 40px 0; */ text-align: center; width: 100%; position: relative; /* top:36px; left: 0; */ order:1;}
#menu .nav_main > li { float: none; margin: 0px; font-weight: bold; }
#menu .nav_main > li > a { color: #333; height:50px; line-height:50px; margin:0 10px; font-size: 18px;}
/**/
.boxes { max-width: 1000px; margin: 0 auto; width: 93%; position: absolute; top: 70px; }
.logo { /* height: 170px; */ width: 380px; float: left; }
.pub { width: 429px; background: #333; float: right; }
/* Underline From Center */
#menu .nav_main li a { display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; overflow: hidden; }
#menu .nav_main li a:before { content: ""; position: absolute; z-index: -1; left: 50%; right: 50%; bottom: -3px; ; background: #F00; height: 5px; -webkit-transition-property: left, right; transition-property: left, right; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; }
#menu .nav_main li a:hover:before, #menu .nav_main li a:focus:before, #menu .nav_main li a:active:before { left: 0; right: 0; }
.fa-angle-down { color: #e52629; padding: 0 0 0 5px; }
/* submenu */
#menu ul > li .submenu { background: rgba(255,255,255,0.9); left: 0; position: absolute; top:96%; z-index: 1000; opacity: 0; overflow: hidden; height: 0; min-width: 150px; }
#menu ul > li:hover .submenu { height: auto; opacity: 1; overflow: visible; }
/* sub column */
.submenu li { clear:both; padding:5px 10px;  width:100%; text-align:left;}
.submenu li a { color:#000; display: block; line-height: 32px; white-space: nowrap; padding: 0 10px; font-size: 16px; width:100%; }
.submenu li a:hover {  background: rgba(255,255,255,0.2); }
/*---------------*/
/* !SLIDER Home */
/*---------------*/
.slider{ position: relative; margin: 0; padding: 0; max-width:none; width: 100%; z-index: 10;}
.cycle-slideshow{  position: relative; overflow: hidden;}
.slide { width: 100%; position: relative;}
.slide img { display: block; border: 0; }
.slide a{ position: absolute; left: 0: top:0; height:calc(100vh - 84px); width: 100%; z-index: 10;}
#home_slider{ height:calc(100vh - 84px);}
.fleche{ position: absolute; left: 50%; bottom: 2%; z-index: 100;}
.fleche i{ color:#FFF; font-size:44px; background: url("/images/fleche.svg") no-repeat 0 0 / contain; width: 40px; height: 40px; display: block;}
#partners_slider .slide img { width: 100%; }
/*------------*/
/* GEN */
/*------------*/
#header_before { min-width: 100%; position: relative; top:84px; left: 0; z-index: 0;}
#header_before img { width: 100%; max-height: 555px;}
.home #header_before{ display: none;}
footer { margin: 0 auto; max-width: 1000px; width: 100%; }
main { margin: 0 auto; max-width: 1000px; width: 100%; position: relative;}
.home main { margin: 0; max-width:none;}
.home main > section { max-width: 1000px; width: 100%; margin:40px auto;}
main section { margin: 0px auto 70px 0; position: relative; }
/* main section img { width: 100%; } */
.form_authent #form_authent_forgot { right: 155px; }
.form_authent #form_authent_create, .form_authent #form_authent_forgot { bottom: -25px; background: #e52629; }
.form_authent #form_authent_create:hover, .form_authent #form_authent_forgot:hover { background: #000; }
.form_authent input[type="submit"]:hover { color: #e52629; border-bottom: 1px solid #e52629; }
.error{ line-height:40px; background-color: #d9534f; color:#FFF; font-size:14px; font-weight:600; text-align:center; margin:20px 0; border-radius:5px;}
/* pagination*/
.paging { width:100%;}
.pagine { clear:both; margin:0;}
.pagine li{ padding:0;}
.pagine li.active a { color:#FFF; background:#E11B32;}
.pagine a:hover{ color:#FFF; background:#E11B32;}
/**/
.social_sharing{ position:absolute; top:0; right:0; z-index:1000;}
.social_sharing a span{ display:none;}
.social_sharing li a:hover { background: #e52629;  transform: scale(0.9, 0.9);}
/**/
main .retour{ background: #000;  border-radius: 4px; -webkit-border-radius: 4px;  color: #fff; height: 20px; padding:2px 8px; font-size:14px; font-weight:500;font-family: 'Montserrat', sans-serif; display:block; float:left;}
main .retour:hover { background: #e52629; color:#FFF;}
main .bandeau_pub { background: #e9e9e9; width:100%;  margin:0 auto 40px auto; clear:both;}
main .bandeau_pub img { width:100%;}
/* lien fleche */
.arrow_link{ line-height:27px;}
.arrow_link img{ height:30px; width:30px;}
.arrow_link:hover img{ animation: move_arrow 0.5s ease 0s infinite; -webkit-animation: move_arrow 0.5s ease 0s infinite;}
@-webkit-keyframes move_arrow { 0%, 100% { transform:translateX(0) } 50% { transform:translateX(8px)} }
@-o-keyframes move_arrow { 0%, 100% { transform:translateX(0) } 50% { transform:translateX(8px)} }
@keyframes move_arrow { 0%, 100% { transform:translateX(0) } 50% { transform:translateX(8px)} }

/*------------*/
/* Magazine + Title */
/*------------*/
.mag article { width: 40%; right: 32px; top:43px; position: absolute; }
.mag article > img{ height: 70px;}
.mag article h1 { font-family: 'Montserrat', sans-serif; font-size: 60px; text-transform: uppercase; color: #e52629; position: relative; margin: 10px 0 30px; }
.mag article h1:after { content: ""; width: 70px; height: 2px; background: #e52629; position: absolute; bottom: -15px; left: 0; }
.mag article p { font-family: 'Lato', sans-serif; font-size: 17px; color: #7B7B7B; margin: 20px 0; }
.mag article p.date { font-weight: 700; color: black; }
.mag article a { font-family: 'Lato', sans-serif; font-size: 14px; text-transform: uppercase; font-weight: 500; color: #000; }
.mag article a i{ font-size:12px; padding: 1px 4px 1px 6px;}
.mag article a:hover { color: #e52629; }
a.ante { color: #000; text-transform: uppercase; font-family: "Lato", sans-serif; font-size: 12px; font-weight: 500; }
a.ante i { color: #e52629; margin: 0px 5px; border: 2px solid #e52629; padding: 0 4px 2px 6px; border-radius: 100%; font-weight: 600; }

/* title */
.title { width: 348px; height: auto; min-width: 0px; background: #FFF none repeat scroll 0% 0%; border: 4px solid #E9E9E9; padding: 30px; z-index: 100; margin: -17% 0 0 5%;
position: relative; }
.title p { font-size: 18px; color: #000; line-height: 25px; font-weight: 500; }
.title h1 { font-size: 20px; margin: 0px 0px 20px 0px; }
.title h1:after { bottom: 2px; }
.title h1 img { width: 45px; height: 45px; margin: 0 0 -10px 30px; }
/*------------*/
/* Focus */
/*------------*/
.focuhs{ display: flex; justify-content: space-between;}
.focus { width:69%; max-height: 449px; overflow: hidden; margin: 0 1% 0 0; position: relative;}
.focus .article { position: relative; float: left; width: calc(100% - 330px); }
.focus .text_focus { background: #FFF none repeat scroll 0% 0%; position: absolute; width: 35%; top: 30px; right: 30px; padding: 23px; }
.focus .text_focus h1 { font-size: 30px; margin: 0 0 30px;}
.focus .text_focus p { line-height: 19px; margin: 0px 0px 25px; }
.focus .text_focus a { display: block; }
.focus_details{ float:right; width:70%;}
.focus_details article{ margin:20px 0;}
/**/
aside{ float:left; width:30%; padding:30px 20px;}
aside ul li{ list-style:none; margin:0 0 5px 20px;}
aside ul li a{ color:#666;}
aside ul li a:hover{ color:#e52629;}
#toggle2 {  display:none;}
/*------------*/
/* Hors-serie */
/*------------*/
.hs { width: 30%; max-width: 289px; border: 5px solid #E2E2E2; padding: 10px; height: 450px; margin: 0; position: relative;}
.hs h1 { font-size: 30px; color: #F00; margin: 0px 0px 40px 9px; }
.hs .img_mag { text-align: center; margin: 0 0 10px; padding: 0 8px; }
.hs .liens { }
.hs a { color: #a0a0a0; }
.hs a:hover { color: #F00; }
.hs #sliderPager { position: absolute; bottom:5px; left: 50%; transform: translateX(-50%); z-index: 1000;}
.hs #sliderPager span{ display: block; border-radius: 10px; width: 10px; height: 10px; background: #CCC; margin: 0 2px; display: inline-block;}
.hs #sliderPager span.cycle-pager-active{ background: #212121;}
/*------------*/
/* Focus */
/*------------*/
.blog_details{ float:right; width:70%;}
.blog_details + aside{ float:left; width:30%;}
.blog_details + aside ul li{ list-style:none; margin:0 0 0 20px;}
.blog_details article ul li{ margin:10px 20px;}
.blog_details + aside ul li a{ color:#666;}
.blog_details + aside ul li a:hover{ color:#e52629;}
.blog_details article{ margin:20px 0;}
/*------------*/
/* Vidéo */
/*------------*/
.videox { width: 70%; position:relative;}
.videox .video { padding-top: 0; margin:0;}
.videox .descr_video { background: #FFF; /* width:140px; */ padding:20px 10px; position:relative; top:0; left:0; background: #CCC;}
.videox .descr_video h1 { font-size: 30px; line-height: 30px; margin:0;}
.videox .descr_video p { font-size: 16px; width: 91%; margin: 0px 0px 10px; }
.videox .descr_video a { /* display: block; width: 100px;  */}
/**/
.albums_videos article {  background: #F4F4F4; display: block; float: left; margin: 5px; padding: 2%; position: relative; text-align: center; width: calc(20% - 5px);}
.albums_videos article:hover { background: #CCC; cursor: pointer; transform: scale(0.95, 0.95); -webkit-transform: scale(0.95, 0.95);}
.albums_videos article img{ width:100%;}
/**/
.details_videos ul li{ float:left; display:block; margin:10px; padding:20px 10px; list-style:none; background:#F4F4F4; width:48%; height:490px;}
.details_videos h2{ margin:20px 10px 10px 10px;}
.details_videos .v_descr{ padding:10px;}
/*------------*/
/* interstijah */
/*------------*/
#interstijah{ position:fixed; z-index:11000; top:50%; left:50%; width: 100vw; height:100vh; transform:translate(-50%,-50%); background:rgba(0, 0, 0, 0.8);}
#interstijah .jahcontent{ display: flex; justify-content: center; align-items: center; width: 100%; height: 100%;}
#interstijah .jahcontent a{ display:inline-block;}
#interstijah .jahcontent img{ max-width:100%;}
#closejah{ font-size: 2em; color:#FFF; position:absolute; top:50px; right:15px; width:30px; height:30px; text-align:center; line-height:30px;}
#closejah:hover{ color:#FFF; transform: rotate(90deg);}
/*------------*/
/* Esapce Pub */
/*------------*/
.espace_pub { border: 5px solid #E2E2E2; width: 30%; max-width: 289px; }
.espace_pub h1 { height: 30px; margin: 20px; font-weight:900; text-transform:uppercase;}
.espace_pub p { font-size: 14px; font-weight: 600; margin: 32px 0px 22px; padding: 0 20px; }
.espace_pub a { display: block; padding: 0 20px 20px 20px; }
.espace_pub .ei { padding: 15px; background: #E9E9E9; height: 170px; overflow: hidden; }
/*------------*/
/* Phrase */
/*------------*/
.txt_accueil{ clear: both; padding: 10px 0; margin: 40px auto;}
.txt_accueil p{ font-style: italic; font-size: 18px; text-align: center; text-transform: uppercase; color: #7B7B7B;}
/*------------*/
/* Partenaires */
/*------------*/
main section.partenaires img{ width:auto;}
.partenaires { clear: both; border-top: 3px solid #E9E9E9; border-bottom: 3px solid #E9E9E9; padding: 10px 0;}
#navDP { position: absolute; right: -40px; top: 6px; display:none;}
#navGP { left: -40px; position: absolute; top: 6px; display:none; }
.partenaires .cycle-slide{ margin:0 10px;}
/*------------*/
/* Exclu Web */
/*------------*/
.exclu_web { overflow: hidden;}
.exclu_web .exclu_text { position: absolute; top: 80px; background: #FFF none repeat scroll 0% 0%; width: 279px; left: 90px; padding: 30px; max-height: 80%; overflow: hidden;}
.exclu_web .exclu_text h1 { font-size: 36px; margin: 0px 0px 46px; }
.exclu_web .exclu_text h3 { font-family: "Montserrat", sans-serif; font-size: 16px; font-weight:500; }
.exclu_web .exclu_text p { font-size: 16px; margin: 0 0  20px; line-height: 22px; }
.exclu_web .exclu_text a { display: block; }
.exclu_web > img{ width: 100%;}
/*------------*/
/* wysi */
/*------------*/
.wysi {  margin: 0px auto 70px; position:relative;}
.wysi h1 { font-size: 33px; }
.wysi p { margin: 20px 0px; line-height: 23px; }
.wysu ul li{ margin:0 0 0 20px;}
/*------------*/
/* GESTION DE COMPTE */
/*------------*/
.gestion_compte aside { float: left; width: 25%; }
.gestion_compte aside ul li { list-style: outside none none; margin: 5px 0; }
.gestion_compte aside ul li a, .retour { background: #000 none repeat scroll 0 0; border-radius: 5px; color: #fff; display: block; font-size: 14px; padding: 0.5em 1em; text-decoration: none; }
.retour { clear: both; color: #fff; float: right; }
.gestion_compte aside ul li a:hover, .retour:hover { color: #fff; transform: scale(0.95, 0.95); }
.gestion_compte section { float: left; padding: 0 0 0 20px; width: 75%; }
.gestion_compte section > div { border: 1px solid #ddd; border-radius: 10px; float: left; height: 280px; margin: 20px; overflow: hidden; padding: 10px 20px; position: relative; width: 250px; }
.gestion_compte section > div a { background: #000 none repeat scroll 0 0; border-radius: 5px; color: #fff; display: block; font-size: 14px; padding: 2px 10px; text-align: center; text-decoration: none; }
.gestion_compte section > div a:hover { transform: scale(0.95, 0.95); }
.gestion_compte section h1 { }
.gestion_compte section h2 { border-bottom: 1px solid #ccc; font-family: "Roboto Condensed", sans-serif; font-size: 18px; font-weight: 500; margin: 10px auto; text-align: left; }
.gestion_compte #tab_livraison { background: #f4f4f4 none repeat scroll 0 0; border: medium none; float: none; height: auto; margin: 20px; padding: 20px; width: auto; }
.gestion_compte #tab_livraison a { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; color: #000; }
.gestion_compte #tab_livraison a.mod_adr_liv:hover, .gestion_compte #tab_livraison a.del_adr_liv:hover { transform: scale(1.3, 1.3); }
.gestion_compte section.carte > div { float: none; height: auto; width: auto; }
.gestion_compte section.carte > div p { float: left; }
.gestion_compte section.carte > div p.solde { background: #f4f4f4 none repeat scroll 0 0; border-radius: 5px; clear: both; margin: 20px 0 0; padding: 10px 30px; }
.gestion_compte section.carte > div a { float: right; margin: 20px 0 0; padding: 10px; }
/*-------------------CONTACT--------------------------------*/
.infos { width: 30%; height: 200px; display: inline-table; margin: 100px 0px 100px; }
.infos ul { list-style: none; }
.infos li { color: #999; margin: 30px 0px 0px 30px; }
.infos li i { color: #F00; margin: 0px 10px 0px 0px; border: 2px solid #F00; border-radius: 21px; padding: 0px 1px 0px 5px; width: 9px; height: 15px; }
.formulaire { width: 69%; height: 200px; display: inline-table; margin: 100px 0px 100px; }
/*---------------*/
/* LISTING MAG */
/*---------------*/
.listing figure { width: calc(25% - 20px); float: left; margin: 10px; position: relative; overflow: hidden; background-color:#df4e4e;}
.listing figure > img{ width: 100%;}
.listing figure a { height: 100%; left: 0; position: absolute; top: 0; width: 100%; font-size: 0; opacity: 0; text-indent: 200%; white-space: nowrap; z-index: 1000; }
.listing figure h3, .listing figure p { bottom: 0; left: 0; position: absolute; color: #FFF; }
.listing figure h3 { background: #000; padding: 0 10px; margin: 10px; }
.listing figure p { font-size: 12px; text-transform: uppercase; font-weight: 600; opacity: 0; transform: translate3d(0px, 50px, 0px); transition: opacity 0.35s ease 0s, transform 0.35s ease 0s; padding: 20px; }
.listing figure img { backface-visibility: hidden; }
.listing figure img, .listing figure h3 { transition: transform 0.35s ease 0s; }
.listing figure:hover p { opacity: 1; transform: translate3d(0px, 0px, 0px); }
.listing figure:hover img { transform: translate3d(0px, -60px, 0px); }
.listing figure:hover h3 { transform: translate3d(0px, -80px, 0px); }
.listing .anum{ height:12px; width:12px; position:absolute; top:10px; right:10px; border-radius:12px; display:block; background:#3F9;}
/*---------------*/
/* LISTING projets */
/*---------------*/
.listing_projets .intro{ margin: 20px auto 22px auto;}
.listing_projets .intro > img{ width: calc(50% - 19px); margin: 0 15px 0 0; display: inline-block; vertical-align: top;}
.listing_projets .intro > div{ /* width: calc(50% - 15px); */ margin: 0 0 0 15px; display: inline-block; vertical-align: top;}
.listing_projets .intro > div > h2 { font-family: 'lato', sans-serif; font-weight: 400; font-size: 22px; color: #e52629; display: block; margin: 0 0 14px 0;}
.listing_projets .intro > div > p{ font-family: 'lato', sans-serif; font-weight: 400; font-size: 14px; line-height: 18px; color: #999; margin: 14px 0 0 0;}
/**/
.listing_projets #menualpha{ width: 100%; display: block; margin: 22px auto; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; flex-flow: row wrap; justify-content: space-around; align-items: flex-start;}
.listing_projets #menualpha h2{ -webkit-flex: 1 0 100%; -moz-flex: 1 0 100%; -ms-flex: 1 0 100%; -o-flex: 1 0 100%; flex: 1 0 100%; font-family: 'lato', sans-serif; font-size: 20px; font-weight: 400; color: #010101; text-transform: lowercase;}
.listing_projets #menualpha h2:first-letter{ text-transform: uppercase;}
.listing_projets #menualpha a{ position: relative; font-family: "lato", sans-serif; font-size: 20px; font-weight: 400; text-align: center; line-height: 30px; border-bottom: 1px solid #c1c1c1; width: 30px; cursor: pointer;}
.listing_projets #menualpha a:before{ content: ''; width: 0; height: 1px; position: absolute; bottom: -1px; left: 0; background: #fff; transition: width 0.3s ease-in;}
.listing_projets #menualpha a:after{ content: ''; width: 0; height: 1px; position: absolute; bottom: -1px; left: 0; background: #e52629; transition: width 0.3s ease-out; transition-delay: 0.25s;}
.listing_projets #menualpha a:hover:before,
.listing_projets #menualpha a:hover:after { width: 100%;}
/**/
.listing_projets .listing{ width: 100%; margin: 0 auto 60px auto;}
.listing_projets .listing > article.row { position: relative; width:calc(50% - 17px); height: 464px; display: inline-block; vertical-align: top; margin: 15px 15px 15px 0; background: #f4f4f4; padding: 0 0 20px 0; overflow: hidden;}
.listing_projets .listing > article.row:before{content:''; width: 100%; height: 20px; position: absolute; bottom: 0; left: 0; background: #f4f4f4; z-index: 999;}
.listing_projets .listing > article.row:nth-of-type(odd){ margin: 15px 0 15px 15px;}
.listing_projets .listing > article.row:first-of-type{display: none;}
.listing_projets .listing > article.row > img{width: 100%; margin: 0; transform: scale(1, 1); z-index: 0; transition: all 0.3s;}
.listing_projets .listing > article.row:hover > img{width: 100%; margin: 0; transform: scale(1.1, 1.1);}
.listing_projets .listing > article.row > img + *{ margin: 20px 20px 0 20px; position: relative;}
.listing_projets .listing > article.row > img + *:before{ content:''; width: calc(100% + 40px); height: 20px; position: absolute; top: -20px; left: -20px; background: #f4f4f4; z-index: 999;}
.listing_projets .listing > article.row > h3,
.listing_projets .listing > article.row > p{ font-family: 'lato', sans-serif; font-weight: 400; font-size: 16px; color: #333333;}
.listing_projets .listing > article.row > h3:first-of-type { text-transform: uppercase; font-weight: 700; font-size: 18px; line-height: 23px;}
.listing_projets .listing > article.row > * { margin: 0 20px; z-index: 0;}
.listing_projets .listing > article.row p:nth-last-of-type(2){display: inline-block; margin: 0 0 0 20px;}
.listing_projets .listing > article.row .btn{ display: block; margin: 20px 0 0 20px;}
.listing_projets .listing > article.row .btn a{ font-family: 'lato', sans-serif; font-weight: 700; font-size: 16px; color: #fff; background: #e52629; display: inline-block; margin: 0; padding: 5px 10px; }
.listing_projets .listing > article.row > a:last-child{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0;}
/**/
.listing_projets #lastPostsLoader { margin: 35px 0 0 0; width: 100%; height: 40px; display: block; background: #000; color: #fff; font-family: 'lato', sans-serif; font-weight: 700; font-size: 14px; line-height: 40px; text-align: center; text-transform: uppercase; cursor: pointer;}
/*---------------*/
/* DETAILS MAG */
/*---------------*/
.details > div { margin:20px 0 0 0;}
.details .issuu { width: 30%; float: left;  clear:both;}
.details .edito { width: 60%; float: right; }
/*---------------*/
/* ACHAT/ ABO MAG */
/*---------------*/
.modal_content{ background:#333; width:85%; overflow-y: auto; max-height: 80%;}
.modal_content h1{ color:#FFF;}
.modal_content h1:after{ display:none;}
.modal_content a{ margin:25px 10px; cursor:pointer; border-radius:5px; background:#900; color:#FFF; text-transform:uppercase; font-size:15px; font-weight:600;}
.modal_content select{  margin: 20px 3%;  width: 94%;}
.modal_content > div.md_effect_show, .md_effect_show, .alert.md_effect_show{ opacity:1; max-height:5000px; -webkit-transition: all 1s; transition: all 1s; overflow:hidden;}
.modal_content > div, .md_effect_hide{ opacity:0; max-height:0; -webkit-transition: all 1s; transition: all 1s; overflow:hidden;}
/**/
.alert{ opacity:0; max-height:0; -webkit-transition: all 1s; transition: all 1s; overflow:hidden; border-radius:5px; margin:10px 0;}
.alert p{ color:#FFF; line-height:40px;}
/**/
.chxliv{ padding:10px 0; text-transform:uppercase; color:#FFF;}
#chxversion > div label{ min-height:190px;  background:#FFF; color:#333; display:block; padding:20px 10px; border-radius:5px; cursor:pointer; border:4px solid white;}
#chxversion > div label:hover{ border:4px solid #900;}
.chxtxt h2{ margin:10px 0;}
.chxtxt .chxprx { color: #900; font-size: 18px;}
.chxtxt .chxprx span{ background:none; color: #900; font-size: 24px; font-weight: 400; left: auto; max-height: inherit; overflow: hidden; position: inherit; top: auto;}
#chxversion > div{ float:none; display:inline-block; width:45%; vertical-align:top;}
/**/
#chxabo > div label{ min-height:190px;  background:#FFF; color:#333; display:block; padding:20px 10px; border-radius:5px; cursor:pointer; border:4px solid white;}
#chxabo > div label:hover{ border:4px solid #900;}
#chxabo > div{ float:none; display:inline-block; width:45%; vertical-align:top;}

.abop > .radioElem{ margin:5px; width: 100%;}
.abop > p, .abon > p{ color: #FFF; font-size:1.4rem; text-transform: uppercase; margin: 0 0 10px;}
.abon { background: none; margin: 0 0 0 10px;}
.abon > .radioElem{ margin:5px; width: 100%;}
/*---------------*/
/* MINI PANIER */
/*---------------*/
#min_cart{  height:0; padding:0; overflow:hidden; top:100%;z-index:99999;}
#min_cart article{ display:table-row; width:calc(100% - 40px);}
#min_cart article > div {  display:table-cell; border-right:none !important; padding:10px 0;  width:100%;  color: #fff; font-size: 14px; font-weight: 600; text-align: left; text-transform: capitalize; white-space:nowrap;  border-bottom: 1px solid #FFF;}
#min_cart article div + div{ text-align:right; padding:10px 0 10px 40px}
#min_cart article.total > div{ border:none !important;}
/**/
#cart_btn:hover #min_cart{ padding:20px; color: #fff;}
/**/
#min_cart p.tit { display:none;}
#min_cart p.tit::after { display:none;}
#min_cart p.prix { padding: 0; text-transform: uppercase; text-align:center; width:100%; margin:10px 0;}
#min_cart a.supprimer { font-size: 14px; color: #fff; display: block; background:none; padding: 0; text-align:center; margin:0; position:absolute; top:0; right:0;}
#min_cart a.supprimer:hover { color:#e52629;}
#menu .nav_top ul li a.voir_panier { background: #e52629; color: #FFF; display: block; font-size: 11px; text-transform:uppercase; font-weight:700; height: 20px; line-height: 20px; margin: 10px 15px 0 15px; padding: 0; text-align: center; width:calc(100% - 30px); clear:both; }
#min_cart a.voir_panier:hover { transform: scale(0.95, 0.95); -webkit-transform: scale(0.95, 0.95); }
/*---------------*/
/* TUNNEL ACHAT */
/*---------------*/
main section#compte_choix{ text-align:center;}
#compte_choix article{ display:inline-block; float:none;}
#compte_choix a{ background:#e52629;}
#etapes .actif p span { border: 2px solid #e52629;  color: #e52629;}
#etapes .actif p::after { background: #e52629;}
#etapes .actif:hover p { color: #e52629;}
#etapes p::after{ top:-180%; left: calc(50% + 20px); width: calc(100% - 36px);}
/*---------------*/
/* FOOTER */
/*---------------*/
footer { padding:20px 0 40px 0; display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap;}
footer > div{ margin:0; border-left: 2px solid #EAEAEA; display: inline-block;}
footer .sitemap li a:hover { color: #F00; }
footer h3 { font-size: 24px; font-family:'MontSerrat'; color: #A0A0A0; margin: 0px 0px 10px 20px; }
footer ul { list-style: outside none none; line-height: 18px; margin: 0px 0px 0px 20px; }
footer li { font-family: 'Lato', sans-serif; color: #52504e; }
footer a { color: grey; font-size: 15px; }
footer .conect ul { }
footer .conect li { display: inline-block; }
footer .conect li:last-child{ border:none;}
footer .conect .last { border: none; }
footer .conect i { padding: 10px; }
footer .conect li a{ color: #000; border: 1px solid #000; border-radius: 40px; padding: 6px 0;}
footer .conect li a:hover { color: #F00; border: 1px solid #F00; }
/*---------------*/
/* MEDIA QUERIES */
/*---------------*/
@media all and (max-width: 1024px) {
	/*btn mobile*/
	header{ height: 0;}
	#toggle { display: block; background:#e52629 url(../images/block_nav.svg) no-repeat scroll center center / 65% auto; top: 40px; }
	.expand #toggle { left: 211px !important; }
	/*menu mobile*/
	#menu { background: #FFF; box-shadow: 3px 0 5px -2px #666; -webkit-box-shadow: 3px 0 5px -2px #666; height: 100%; left: -260px; margin: 0; position: fixed; top: 0; width: 250px; z-index: 3000; overflow-y: auto; }
	#menu .nav_main { position:relative; margin:10px 0 0; top:auto;}
	#menu > ul > li { border-bottom: 1px solid #EAEAEA; position: relative; }
	#menu > ul > li > a { clear: both; display: block; line-height: normal; height: auto; padding: 10px 5px; width: 200px; border: none; }
	#menu .nav_main > li > a{ margin:0; height:auto; line-height:normal;}
	#menu > ul > li.active > a:after { display: none; }
	#menu > ul > li > .submenu { position: inherit; margin: 0; padding: 0; }
	#min_cart{ right: 0; width:100%; left: 50%; transform: translateX(-50%)}
	/**/
	#menu .nav_top{ display: flex; flex-direction: column; position: relative; left: 0; top:0; background: none; margin: 10px 0 0; height: auto;}
	#menu .nav_top > ul.snd, #menu .nav_top > ul.thd{ display: flex; flex-direction: column; align-items: center;}
	#menu .nav_top > ul li a{ text-align: center;}
	/* sub column */
	.submenu ul { padding: 0; width: 100%;}
	.submenu li a { font-size: 14px; max-height: 0; text-align:center;}
	.submenu li a:hover { color: #000; }
	#menu > ul > li:hover .submenu li a { max-height: 15em; }
	/**/
	.details_videos ul li{ width: calc(50% - 20px);}
	/**/
	.listing_projets .listing > article.row{height: 449px;}
	/**/
	#logo {  top: 40px; left: 50%; transform: translateX(-50%)}
	#header_before{ top:0;}
	.home .link { top: 170px; left: 50%; transform: translateX(-50%);
}
}
 @media all and (max-width: 800px) {
	.home main > section{ width: 96%;}
	.home main{ width: 100%;}
	main, footer{ width: 93%;}
	.boxes { top: 20px; text-align: center; }
	.logo { float: none; height: inherit; width: inherit; }
	.logo img { width: 200px; }
	.pub { background:none; float:none; max-width:100%; margin: 20px auto; }
	main .mag { /* min-height:600px; */ background:#D6D6D6; }
	main .mag article { top: 17px; right: 13px; }
	main .mag article h1 { font-family: "Montserrat", sans-serif; font-size: 54px; text-transform: uppercase; color: #E52629; position: relative; }
	main .mag article .arre { margin: 0px 7px 0px 9px; }
	main .mag article p { font-family: "Lato", sans-serif; font-size: 17px; }
	
	.focus{ width:60%; max-height:none;}
	.focus .text_focus { width:100%; position: relative; top: 0; left: 0px; padding: 30px; float:left;}
	.focus .text_focus h1{ margin:0 0 30px 0;}
	.videox .video{ margin:0;}
	.videox .descr_video { position:relative; top:0; left:0; z-index:1000; width:auto; padding:30px;}
	.videox .descr_video a{ width:auto;}
	.exclu_web .exclu_text{ position:relative; width:100%; top:0; left:0;}
	.espace_pub .events img { padding: 21px 28px; width: 100%; }
	.hs { height: auto; width: auto;}
	.modal_content{ width:90%;}
	#cart_btn:hover #min_cart{ padding:20px 10px;}
	#min_cart article{ border-bottom:1px solid #FFF; display:block; width:100%;}
	#min_cart article > div{ display:block; border:none; width:140px; overflow: hidden;  text-overflow: ellipsis;  white-space: nowrap; float:left; margin:0 0 0 5px; padding:5px 0;}
	#min_cart article div + div{ padding:5px 0; float:right; width:70px;}
	/**/
	#compte_choix article{ width:calc(50% - 2px);}
	/**/
	.details_videos ul li{ width: 100%; max-width: 640px; margin: 10px auto; float: none; }
	/**/
	.listing_projets .listing > article.row{height: 399px;}
	.wysi{ width: 96%;}
	.focus > img{ width: 100%;}
}
 @media all and (max-width: 640px) {
	.listing_projets #menualpha {width: 80%; max-height: 40px; padding: 0; margin: 20px auto; overflow: hidden; transition: all 0.5s; cursor: pointer;}
	.listing_projets #menualpha:hover{ max-height: 100%; padding: 10px;}
	.listing_projets #menualpha a{margin: 0 10px;}
	.listing_projets #menualpha a::before,
	.listing_projets #menualpha a::after{ content: none; display: none;}
	/**/
	.listing_projets .intro > img{ width: auto; max-width: 100%; margin: auto; text-align: center; display: block; margin:0 0 15px 0;}
	.listing_projets .intro > div{ display: block; width: 100%; margin: 15px 0;}
	.listing_projets .listing > article.row,
	.listing_projets .listing > article.row:nth-of-type(even),
	.listing_projets .listing > article.row:nth-of-type(odd) {width: 100%; display: block; height: auto; margin:15px 0;}
	.listing_projets .listing > article.row:before{display: none;}
	.listing_projets .listing > article.row:first-of-type{display: none;}
	.listing_projets .listing > article.row .btn {margin: 20px auto 0 auto; width: calc(100% - 40px); }
	.listing_projets .listing > article.row .btn a{display: block; width: 100%; margin: 0; text-align: center;}
	.focus{ width: 100%;}
	.hs{ max-width: none;}
	.hs #sliderPager{ bottom: -5px;}
	.listing figure{ width:calc(50% - 20px);}
	.details .issuu, .details .issuu > img{ width:100%;}
	.details .edito{ float:none; width:100%; clear:both; padding:20px;}
	.details > div { margin: 20px 0 0 0;}

/* 	#header_before{ min-height:220px;} */
	main .mag{ overflow:hidden;}
	main .mag > img{ width:180%;}
	main .mag article{ position:relative; top:auto; right:auto; width:100%; padding:20px;}
	main .mag article h1{ margin:0;}
	main .mag{ min-height:680px;}
	main .title{ position:relative; margin: 0 auto;} 
	.focuhs{ flex-direction: column; align-items: center}	
	.focus{ width: auto;}
	.hs{ width: auto;}	
	.focus_details{ float:none; margin: 0 auto; width: 100%;}
	.focus_details img{ max-width: 100%;}
	main .bandeau_pub{ margin:20px auto;}
	aside{ float:none; width:100%; clear:both;}
	.form_authent{ padding:0;}
	.details{ margin: 40px auto 0}
	/**/
	#toggle2{ display:block; background: #E52629; color: #FFF; cursor: pointer; font-size:14px; font-weight:600; padding:0; text-align: center; width: 100%; text-transform:uppercase; height:40px; line-height:40px;}
	aside { padding:40px 0 0 0; float: none; width: 100%; clear: both;}
	aside h2{ display:none;}
	aside nav ul li{ margin:0;}
	aside nav ul li a{ text-align:center; background: #CCC; color: #000; font-size:14px;  font-weight:600; display:block; border-bottom:1px solid white; height: 0; line-height: 0; margin: 0; opacity: 0; overflow: hidden;}
	aside nav:hover ul li a { height:40px; line-height:40px; opacity: 1; overflow: visible; padding: 0; }
	/**/
	#modal_box{ overflow: auto; height:100%;}
	.modal_content{ padding:20px 0; width:100%; overflow:auto; position:relative; top:0;}
	.modal_content.md_cshow{ transform:translateX(-50%) translateY(0); -webkit-transform:translateX(-50%) translateY(0);}
	#chxversion > div, #chxabo > div{ width:90%; margin:5px 0;}
	/**/
	.form_authent input { float: none; width: calc(100% - 20px); clear:both;}
	.form_authent input[type="submit"]{ width: calc(40% - 20px);}
	.form_authent #form_authent_close{ float:right; width:calc(20% - 20px);}
	/*RECAP  COMMANDE */
	.recap .intitule{ display:none;}
	.recap article { height: auto; position: relative; width: calc(100% - 10px); margin: 20px 5px; padding: 20px 10px; background: #eee; display:block; }
	.recap article:hover{ background: #eee;}
	.recap article > div { height: auto; line-height: normal; border: none; margin: 5px 5px 5px 0; font-weight: 600; width: auto; }
	.recap article > div:first-child, .recap_prixunitaire { display: none !important; }
	.recap article > div:nth-child(2) { width: 100%; ; clear: both; }
	.recap h3 { white-space: normal; }
	.recap_taille, .recap_couleur { padding: 5px 10px; }
	.recap_montantligne { color: #e52629; padding: 5px 10px; font-size:20px;}
	.recap_actions a { position: absolute; top: -10px; right: 0; background: #e52629; padding: 5px 10px; color: #FFF !important; }
	.recap_quantite { position: absolute; top: -15px; right: 50px; background: #e52629; padding: 5px 10px; color: #FFF !important; }
	.recap_quantite a { color: #FFF !important; padding: 0 5px; }
	/**/
	#compte_choix article{ width:90%; padding:0; border-right:none;}
	.gestion_compte aside{ float:none; width:auto;}
	#etapes{ margin:20px auto;}
	#etapes div{ display:block; width:100%; background: #eee; line-height:40px;}
	#etapes div.actif{ background: #e52629;}
	#etapes span{ margin:0; top:0; left:0; border:none;}
	#etapes .actif p, #etapes .actif p span{ color:#FFF; border:none;} 
	#etapes .actif:hover p{ color:#FFF; background:#000;}
	#etapes p::after{ display:none;}
	#tab_facturation, #tab_livraison{ width:auto;}
	.min_authent{ background:#000;}
	.min_authent a:hover { color: #FFF !important;}
	.min_authent a + a {  border-left:none;}
	.pub {}
	.pub img{ width:100%;}
	/**/
	.listing_projets .intro, .listing_projets .listing, .listing_projets #menualpha{width: 80% !important;}
	footer > div{ margin:10px 0;}
	#header_before img{ width: auto; max-height: 155px;}
	#logo a{ width: 200px;}
	.social_sharing{ top:-10px;}	
	/* boutons sous logo */
	.home .link{ position:fixed; top:auto; left:0; bottom: 0; width: 100%; transform: none;}
	.home .link .bt{ margin: 0 !important; width: 50%; display: flex; align-items: center; justify-content: center; line-height: 1; padding: 0;}
	.link{ display: none;}
	footer{ padding: 20px 0 80px 0;}
	#logo h1, #logo a{ width: 250px; height: 100px;}
}
@media all and (max-width: 320px) {
	.listing figure{ width:calc(100% - 20px);}
}
