/* **************** GRILLE BOOTSTRAP *************** */
/* **************** MEDIA WIDTH *************** */
/* Nav store navigation */
/*@animation-nav-stores-timing : @animation-timing;*/
/* ease-in-out */
/* **************** COULEURS *************** */
/* **************** SPECIFIQUE MODULES *************** */
/* **************** COULEURS *************** */
/* **************** TEXTES *************** */
.line-through {
  text-decoration: line-through;
}
/* **************** BOX SIZING *************** */
/* **************** FLEX *************** */
/* **************** BLOCKS *************** */
/* **************** BACKGROUNDS *************** */
/* **************** MARGINS / PADDINGS *************** */
/* **************** BORDERS *************** */
/* **************** ARRONDIS *************** */
/* **************** SHADOW *************** */
/* **************** MISC *************** */
/* **************** ANIMATIONS *************** */
/* **************** SPECIFIQUE *************** */
/*.nav_link{
    .typo;font-size:1.4em;line-height:2em;text-decoration:none;color:#000000;
  }
  .nav_hover(@bg-color:#0099cc, @color:#FFFFFF){
  .br(transparent,4px);
  &.haschild{
  background:url(../img/puce-n.png) 185px center no-repeat ;
  padding-right:15px;
}
&:hover{
background-color:@bg-color;
& when (@bg-color = #ffffff){
&:before{
content:'';
background:url(../img/bg-nav.png) left repeat-y transparent;
width:13px;
height:28px;
.abs;
left:0px;
}
}
.br(#ff8700,4px);
>a{
color:@color;
}
&.haschild when (@bg-color = #0099cc){
background:url(../img/puce.png) 185px center no-repeat @bg-color ;
padding-right:15px;
}

}
}


/* **************** VISUELS PRINCIPAUX *************** */
/* **************** IMAGES *************** */
/* **************** BLOC *************** */
/* **************** CTA *************** */
/* **************** CTA *************** */
/* **************** CTA *************** */
/* **************** PLACEHOLDER *************** */
/* **************** Animations / Transitions *************** */
/* new mixins */
/* use like this :
div{
.transition(background, 1s; border-color, 2s; color, 2s);
}
*/
/* use like this :
div#div2{
.transform(rotate, 20deg; scale, 1.5; translateX, 10px);
}
*/
@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
@keyframes fadeOutDown {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
  }
}
@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
  }
}
@-moz-keyframes fadeInRight {
  from {
    opacity: 0;
    -moz-transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -moz-transform: none;
  }
}
@-ms-keyframes fadeInRight {
  from {
    opacity: 0;
    -ms-transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -ms-transform: none;
  }
}
@-o-keyframes fadeInRight {
  from {
    opacity: 0;
    -o-transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -o-transform: none;
  }
}
/*
Utilisation :
.cta_hamburger_cross(~'.top-navigation-sideNav-icons', ~'.top-navigation-sideNav-icon',~'.sb-active-left', @okaidi,@width-step2);
HTML :
.top-navigation-sideNav-icons
.top-navigation-sideNav-icon.top
.top-navigation-sideNav-icon.middle
.top-navigation-sideNav-icon.bottom
Déclencheur :
.sb-active-left .top-navigation-sideNav-icons
.top-navigation-sideNav-icon.top
.top-navigation-sideNav-icon.middle
.top-navigation-sideNav-icon.bottom
Need : translateRotate - animated - fadeInDown - fadeOutDown
*/
/*

@-webkit-keyframes zoomOut {
from {
opacity: 1;
}

50% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}

to {
opacity: 0;
}
}

@keyframes zoomOut {
from {
opacity: 1;
}

50% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}

to {
opacity: 0;
}
}

.zoomOut() {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;

-webkit-animation-name: zoomOut;
animation-name: zoomOut;
}
/* **************** Formes *************** */
/* **************** nakaa-sticky-header *************** */
/* **************** custom scrollbars *************** */
/* **************** TEMPLATES de modules *************** */
/* **************** TEMPLATE : module-hub-1 *************** */
/* Header hub*/
#header .top-navigation-content {
  padding-top: 4.8em;
  padding-bottom: 16px;
  text-align: center;
  height: 100px;
  margin: 0;
}
#header .top-navigation-content .main-logo {
  position: relative;
  right: auto;
  bottom: auto;
  left: auto;
}
.page.hub#content {
  padding-top: 100px;
}
.page.hub#content #container {
  position: relative;
}
@media (max-width: 1023px) {
  #container {
    padding-top: 100px;
  }
}
/* 1024px -> infini */
@media (min-width: 1024px) {
  #container {
    background: url('../img//hub/map.png') center center no-repeat #ffffff;
  }
}
/* 768px -> 1279px*/
@media (min-width: 768px) and (max-width: 1023px) {
  html,
  body,
  #content,
  #container,
  body > .container {
    height: 100%;
  }
  footer {
    position: fixed;
    width: 100%;
    bottom: 0px;
  }
}
/* 320px -> 767px*/
@media (max-width: 767px) {
  body > .container {
    background: url('../img//hub/map.png') -400px -40px no-repeat #ffffff;
  }
  #header .container,
  #header .top-navigation-content {
    background: transparent;
  }
  #container {
    padding-top: 0px;
  }
}
.module-hub-1 {
  /* 1024px -> infini */
  /* 1280px -> infini */
  /* 1280px -> 1379px*/
  /* 1024px -> 1279px*/
  /* 768px -> 1023px*/
  /* 320px -> 767px*/
}
.module-hub-1 .hub_wrapper {
  width: 100%;
  padding: 15px 20px;
}
.module-hub-1 .hub_wrapper .legend {
  text-align: center;
  margin: 0 auto;
  width: 280px;
}
.module-hub-1 .hub_wrapper .legend .right {
  display: inline-block;
  float: right;
}
.module-hub-1 .hub_wrapper .legend .left {
  display: inline-block;
  float: left;
}
.module-hub-1 .hub_wrapper p {
  text-decoration: none;
}
.module-hub-1 .hub_wrapper h6 {
  margin: 0;
}
.module-hub-1 .hub_wrapper .cta-form {
  margin: 5px;
  border: 0;
  border-left: 1px solid #16216a;
  float: right;
}
.module-hub-1 .hub_wrapper .bg {
  max-width: 100%;
}
.module-hub-1 .hub_wrapper {
  position: relative;
}
.module-hub-1 .hub_wrapper .legend {
  padding: 10px 0px;
}
.module-hub-1 .hub_wrapper .legend .left,
.module-hub-1 .hub_wrapper .legend .right {
  padding-left: 25px;
  position: relative;
  line-height: 18px;
}
.module-hub-1 .hub_wrapper .legend .left i,
.module-hub-1 .hub_wrapper .legend .right i {
  position: absolute;
}
.module-hub-1 .hub_wrapper .legend .left i.basket-sm,
.module-hub-1 .hub_wrapper .legend .right i.basket-sm {
  top: -1px;
  left: 3px;
}
.module-hub-1 .hub_wrapper .legend .left i.hanger-sm,
.module-hub-1 .hub_wrapper .legend .right i.hanger-sm {
  top: -1px;
  left: 0px;
}
@media (min-width: 1024px) {
  .module-hub-1 {
    padding-top: 0;
  }
  .module-hub-1 .hub_wrapper .legend {
    position: absolute;
    left: 30px;
    bottom: 50px ;
    background-color: #ffffff;
    padding: 20px 35px;
    border: 1px solid #cdcdcd;
  }
  .module-hub-1 .hub_wrapper .legend .left,
  .module-hub-1 .hub_wrapper .legend .right {
    padding-left: 25px;
    position: relative;
    line-height: 18px;
  }
  .module-hub-1 .hub_wrapper .legend .left i,
  .module-hub-1 .hub_wrapper .legend .right i {
    position: absolute;
  }
  .module-hub-1 .hub_wrapper .legend .left i.basket-sm,
  .module-hub-1 .hub_wrapper .legend .right i.basket-sm {
    top: -1px;
    left: 3px;
  }
  .module-hub-1 .hub_wrapper .legend .left i.hanger-sm,
  .module-hub-1 .hub_wrapper .legend .right i.hanger-sm {
    top: -1px;
    left: 0px;
  }
  .module-hub-1 .wrapper-dropdown-5 h6 {
    display: none;
  }
  .module-hub-1 .wrapper-dropdown-5 .dropdown {
    display: table;
    width: 100%;
  }
  .module-hub-1 .wrapper-dropdown-5 ul {
    display: table-cell;
    width: 20%;
    display: inline-block;
    float: left;
  }
  .module-hub-1 .wrapper-dropdown-5 ul li {
    font-size: 1.6em;
    line-height: 2.25em;
    position: relative;
  }
  .module-hub-1 .wrapper-dropdown-5 ul li i.hanger-sm {
    position: absolute;
    left: -25px;
    top: 2px;
  }
  .module-hub-1 .wrapper-dropdown-5 ul li i.basket-sm {
    position: absolute;
    left: -24px;
    top: 2px;
  }
  .module-hub-1 .wrapper-dropdown-5 ul li a {
    position: relative;
    color: #16216a;
    text-decoration: none;
  }
  .module-hub-1 .wrapper-dropdown-5 ul li .title-niv1 {
    font-weight: 500;
    color: #16216a;
    font-size: 1.25em;
  }
  .module-hub-1 .wrapper-dropdown-5 ul li .title-niv2 {
    font-weight: 700;
    color: #16216a;
  }
}
@media (min-width: 1280px) {
  .module-hub-1 .hub_wrapper .legend {
    position: absolute;
    left: 60px;
    bottom: 80px ;
  }
  .module-hub-1 .wrapper-dropdown-5 .dropdown {
    width: 1050px;
    margin: 0 auto;
  }
}
@media (max-width: 1023px) {
  .module-hub-1 {
    /* liste box */
    /* Hover state */
    /* opened state */
  }
  .module-hub-1 .hub_wrapper .legend {
    width: 220px;
  }
  .module-hub-1 .wrapper-dropdown-5 {
    clear: both;
    margin: 40px auto 35px;
  }
  .module-hub-1 .wrapper-dropdown-5 {
    /* Size & position */
    border: 1px solid #16216a;
    background-color: #ffffff;
    padding: 0 1.8em;
    color: #16216a;
    width: 220px;
    /* Chevron */
    position: relative;
  }
  .module-hub-1 .wrapper-dropdown-5 ::-webkit-input-placeholder {
    color: #575757;
  }
  .module-hub-1 .wrapper-dropdown-5 :-moz-placeholder {
    color: #575757;
  }
  .module-hub-1 .wrapper-dropdown-5 ::-moz-placeholder {
    color: #575757;
  }
  .module-hub-1 .wrapper-dropdown-5 :-ms-input-placeholder {
    color: #575757;
  }
  .module-hub-1 .wrapper-dropdown-5 h6 {
    font-size: 1.4em;
    line-height: 1.71428571em;
  }
  .module-hub-1 .wrapper-dropdown-5 .title-niv1,
  .module-hub-1 .wrapper-dropdown-5 .title-niv2 {
    padding-left: 32px;
  }
  .module-hub-1 .wrapper-dropdown-5 ul li a,
  .module-hub-1 .wrapper-dropdown-5 .title-niv1,
  .module-hub-1 .wrapper-dropdown-5 .title-niv2 {
    font-size: 1.4em;
    line-height: 2.57142857em;
  }
  .module-hub-1 .wrapper-dropdown-5::before {
    border-style: solid;
    border-width: 0.25em 0.25em 0 0;
    border-color: #16216a;
    content: '';
    display: inline-block;
    height: 0.9em;
    transform: rotate(-45deg);
    vertical-align: top;
    width: 0.9em;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -moz-transition: all 0.4s ease-in-out 0s;
    -o-transition: all 0.4s ease-in-out 0s;
    -ms-transition: all 0.4s ease-in-out 0s;
    transition: all 0.4s ease-in-out 0s;
  }
  .module-hub-1 .wrapper-dropdown-5:before {
    top: 50%;
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
  }
  .module-hub-1 .wrapper-dropdown-5.opened:before {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
  }
  .module-hub-1 .wrapper-dropdown-5:before {
    transform-origin: center 2px;
    position: absolute;
    right: 9px;
    top: 9px;
  }
  .module-hub-1 .wrapper-dropdown-5 .dropdown {
    /* Size & position */
    position: absolute;
    top: 100%;
    left: -1px;
    right: -1px;
    z-index: 99;
    margin-top: 2px;
    /* Styles */
    background-color: #ffffff;
    border: none;
    list-style: none;
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    -o-transition: all 0.3s ease-in-out 0s;
    -ms-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
    /* Hiding */
    max-height: 0px;
    overflow: scroll;
  }
  .module-hub-1 .wrapper-dropdown-5 .dropdown .title-niv1 {
    font-weight: 500;
    font-size: 1.6em;
    line-height: 2.25em;
  }
  .module-hub-1 .wrapper-dropdown-5 .dropdown .picto.hanger {
    width: 18px;
    margin: 0 8px;
  }
  .module-hub-1 .wrapper-dropdown-5 .dropdown li {
    padding: 0px;
  }
  .module-hub-1 .wrapper-dropdown-5 .dropdown li a {
    display: block;
    text-decoration: none;
    color: #16216a;
    padding-left: 32px;
    position: relative;
  }
  .module-hub-1 .wrapper-dropdown-5 .dropdown li:last-of-type a {
    border: none;
  }
  .module-hub-1 .wrapper-dropdown-5 .dropdown li i {
    position: absolute;
    top: 10px;
    left: 10px;
    vertical-align: middle;
  }
  .module-hub-1 .wrapper-dropdown-5 .dropdown li:hover a {
    color: #ffffff;
    background-color: #16216a;
  }
  .module-hub-1 .wrapper-dropdown-5.opened {
    border-radius: 0px;
    background-color: #ffffff;
    box-shadow: none;
    color: #16216a;
  }
  .module-hub-1 .wrapper-dropdown-5.opened:after {
    border-color: #16216a transparent;
  }
  .module-hub-1 .wrapper-dropdown-5.opened .dropdown {
    max-height: 400px;
  }
}
@media (max-width: 1023px) and (min-width: 768px) {
  .module-hub-1 {
    padding-top: 51.53846154%;
    background: url('../img//hub/map.png') center center no-repeat;
    background-size: 100% auto;
  }
  .module-hub-1 .hub_wrapper {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
  }
}
@media (max-width: 767px) {
  .module-hub-1 {
    min-height: 500px;
  }
}
html {
  background-color: white !important;
}
.page-template-page-hub {
  background-color: white !important;
}
.page-template-page-hub .with-banner {
  padding-top: 1em !important;
  height: auto !important;
}
.page-template-page-hub .banner {
  padding: 1.1em;
  color: #ffffff;
}
.page-template-page-hub .banner .container {
  background-color: transparent;
}
.page-template-page-hub .banner a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.page-template-page-hub .banner p {
  margin: 0;
  color: #ffffff;
  font-size: 1.7em;
  line-height: 1em;
}
@media (max-width: 767px) {
  .page-template-page-hub .banner p {
    font-size: 1.4em;
  }
}
.page-template-page-hub #footer .footer {
  padding: 0;
}
