/*pour voir, ou 640 ? */
/*121212*/
/*AAAAAA*/
/*tous paragraphes, infos fiche, */
.fondsombre {
  background: #343434;
}
/*
                          note forcer les weight corrects à chaque police pour éviter le bavage :
                          */
.fontLight {
  font-family: 'akkurat-light', Helvetica, sans-serif !important;
  font-weight: 200 !important;
}
.fontLightItalic {
  font-family: 'akkurat-light-italic', Helvetica, sans-serif !important;
  font-weight: 200 !important;
}
.fontRegular {
  font-family: 'akkurat', Helvetica, sans-serif !important;
  font-weight: 400 !important;
}
.fontBold {
  font-family: 'akkurat-bold', Helvetica, sans-serif !important;
  font-weight: 600 !important;
}
/*
div#transitionVolet2
{
    background-color: rgba(255, 255, 255, 0.40); //255, 0.4
    display:          block;
    position:         fixed;
    height:           100%;
    z-index:          10;
    width:            0;
    right:            0;
    top:              0;
}
*/
.loader_infinite {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  display: none;
  z-index: 999;
  width: 21px;
  height: 21px;
}
.loader_infinite img {
  width: 21px;
  height: 21px;
  position: absolute;
  top: 0;
  left: 0;
}
.loader_infinite .tourne {
  -webkit-animation: spin 1s infinite linear;
  -o-animation: spin 1s infinite linear;
  animation: spin 1s infinite linear;
}
@-moz-keyframes spin {
  from {
    -moz-transform: rotate(0deg);
  }
  to {
    -moz-transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
div#transitionVolet {
  background-color: white;
  display: block;
  position: fixed;
  height: 100%;
  z-index: 11;
  width: 100%;
  right: 0;
  top: 0;
  opacity: 1;
  pointer-events: none;
}
div#transitionVolet #voletBorder {
  height: 100%;
  width: 0;
  position: fixed;
  top: 0;
  left: 0;
  border-right: 1px solid #e7e7e7;
  z-index: 66;
  pointer-events: none;
}
.langue {
  top: 46px;
  padding: 0px 20px;
  right: 20px;
  position: absolute;
  font-size: 11px;
  color: #919191;
  font-family: 'akkurat', Helvetica, sans-serif !important;
  font-weight: 400 !important;
  cursor: pointer;
  transition: color 0.2s, opacity 0.2s;
  height: 34px;
  top: 0;
  padding-top: 46px;
}
@media screen and (max-width: 1084px) {
  .langue {
    right: 0;
    z-index: 12;
  }
}
@media screen and (max-width: 1023px) {
  .langue {
    opacity: 0;
    pointer-events: none;
    cursor: default;
    transition-delay: 0s;
  }
}
@media screen and (max-width: 1023px) {
  .langue {
    /*
        padding:       0;
        padding-top:   40px;
        padding-right: 70px;
        */
  }
}
.langue span {
  position: relative;
  display: inline-block;
  vertical-align: top;
  height: 100%;
}
.langue:hover {
  transition: color .2s;
  color: #252525;
}
.langue:hover .actif {
  transition: color .4s;
  color: #919191;
}
.langue:hover .inactif {
  transition: color .2s;
  color: #252525;
}
.langue:hover .inactif::after {
  width: 100%;
}
.langue .actif {
  color: #252525;
}
.langue .inactif::after {
  height: 1px;
  width: 0;
  font-size: 0;
  position: absolute;
  display: block;
  opacity: 1;
  content: '.';
  bottom: 0;
  background-color: #252525;
  transition: width 0.3s;
  left: 0;
}
.langue .tiret {
  color: #e7e7e7;
  margin: 5px;
  display: initial;
}
li:hover .langue {
  transition: color .2s;
  color: #252525;
}
li:hover .langue .actif {
  transition: color .4s;
  color: #919191;
}
#headerrelative .langue {
  color: rgba(255, 255, 255, 0.5);
}
#headerrelative .langue:hover {
  color: #ffffff;
}
#headerrelative .langue:hover .actif {
  color: rgba(255, 255, 255, 0.5);
}
#headerrelative .langue:hover .inactif {
  color: #ffffff;
}
#headerrelative .langue .actif {
  color: #ffffff;
}
#headerrelative .langue .inactif::after {
  background-color: #ffffff;
}
#headerrelative .langue .tiret {
  color: rgba(255, 255, 255, 0.5);
}
#headerrelative li:hover .langue {
  color: rgba(255, 255, 255, 0.5);
}
#headerrelative li:hover .langue .actif {
  color: rgba(255, 255, 255, 0.5);
}
#header,
#headerrelative,
#headernormal {
  height: 80px;
  transition: opacity .5s, top .5s, margin 0.5s;
  width: 100%;
  z-index: 11;
  overflow: hidden;
  color: #121212;
  background-color: white;
  -webkit-user-select: none;
  /* Chrome all / Safari all */
  -moz-user-select: none;
  /* Firefox all */
  -ms-user-select: none;
  /* IE 10+ */
  user-select: none;
  /*
                         .logo.vr
                         {

                             left:                -100px;

                             transition:          left @dureeMainTransitions;

                             @media only screen and (max-width: 1450px)
                             {
                                 left: -100px;
                             }
                             @media only screen and (max-width: @limiteTabletteMode)
                             {
                                 left: 15px;
                             }
                             @media only screen and (max-width: @limiteMobileMode)
                             {
                                 left: 15px;
                             }
                         }
                         */
}
@media screen and (max-width: 1450px) {
  #header,
  #headerrelative,
  #headernormal {
    margin-top: -10px;
  }
}
@media screen and (max-width: 1024px) {
  #header,
  #headerrelative,
  #headernormal {
    margin-top: -20px;
  }
}
#header .bordure_bas,
#headerrelative .bordure_bas,
#headernormal .bordure_bas {
  width: 100%;
  position: absolute;
  bottom: 0px;
  background: #e7e7e7;
  height: 1px;
}
#header .logo,
#headerrelative .logo,
#headernormal .logo {
  position: absolute;
  z-index: 11;
  width: 82px;
  left: -100px;
  transition: left 0.5s, opacity 0.5s;
  transition-delay: 0s;
  top: auto;
  bottom: 20px;
  background-image: url('https://nedd.me//images/logomix.png');
  background-size: cover;
  background-position: 0%;
  height: 27px;
}
@media only screen and (max-width: 1450px) {
  #header .logo,
  #headerrelative .logo,
  #headernormal .logo {
    left: -100px;
  }
}
@media only screen and (max-width: 1084px) {
  #header .logo,
  #headerrelative .logo,
  #headernormal .logo {
    left: 40px;
    bottom: 15px;
    left: 15px;
  }
}
@media only screen and (max-width: 766px) {
  #header .logo,
  #headerrelative .logo,
  #headernormal .logo {
    left: 15px;
  }
}
#header .logo2,
#headerrelative .logo2,
#headernormal .logo2 {
  position: absolute;
  z-index: 11;
  width: 82px;
  left: 40px;
  transition: left 0.5s, opacity 0.5s;
  transition-delay: 0s;
  top: auto;
  bottom: 20px;
  background-image: url('https://nedd.me//images/logomix.png');
  background-size: cover;
  background-position: 0%;
  height: 27px;
}
@media only screen and (max-width: 1450px) {
  #header .logo2,
  #headerrelative .logo2,
  #headernormal .logo2 {
    left: 40px;
  }
}
@media only screen and (max-width: 1084px) {
  #header .logo2,
  #headerrelative .logo2,
  #headernormal .logo2 {
    left: 40px;
    bottom: 15px;
    left: 15px;
    /*deja là*/
  }
}
@media only screen and (max-width: 766px) {
  #header .logo2,
  #headerrelative .logo2,
  #headernormal .logo2 {
    left: 15px;
  }
}
#header .logovrpastille,
#headerrelative .logovrpastille,
#headernormal .logovrpastille {
  height: 28px;
  -webkit-backface-visibility: hidden;
  -webkit-transform: translateZ(0) scale(1, 1);
  position: absolute;
  right: -48px;
  transition: opacity 0.5s;
  opacity: 0;
}
#header .logovrpastille.vr,
#headerrelative .logovrpastille.vr,
#headernormal .logovrpastille.vr {
  transition: opacity 0.5s;
  opacity: 1;
}
#header .burger,
#headerrelative .burger,
#headernormal .burger {
  display: block;
  position: absolute;
  padding: 20px;
  right: 5px;
  bottom: 15px;
  width: 18px;
  opacity: 0;
  transition: opacity .3s;
  transition-delay: 0s;
  color: #000;
  z-index: 11;
  cursor: auto !important;
  pointer-events: none;
}
@media screen and (max-width: 1023px) {
  #header .burger,
  #headerrelative .burger,
  #headernormal .burger {
    opacity: 1;
    transition-delay: .5s;
    cursor: pointer !important;
    pointer-events: auto;
    bottom: 5px;
    right: 5px;
    top: auto;
  }
}
#header .burger:hover,
#headerrelative .burger:hover,
#headernormal .burger:hover {
  cursor: pointer;
}
#header div#desktop,
#headerrelative div#desktop,
#headernormal div#desktop {
  padding: 0;
  width: calc(61% + 2 * 100px);
  max-width: 1200px;
  margin: auto;
  height: 100%;
  /*
                           transition:       width @dureeMainTransitions;
                           transition-delay: 0s;
                           */
}
@media screen and (max-width: 1450px) {
  #header div#desktop,
  #headerrelative div#desktop,
  #headernormal div#desktop {
    width: calc(61% + 2 * 60px);
  }
}
@media screen and (max-width: 1084px) {
  #header div#desktop,
  #headerrelative div#desktop,
  #headernormal div#desktop {
    width: 100%;
  }
}
@media screen and (max-width: 766px) {
  #header div#desktop,
  #headerrelative div#desktop,
  #headernormal div#desktop {
    max-width: none;
    width: 100%;
    transition-delay: 0s;
  }
}
#header div#desktop ul,
#headerrelative div#desktop ul,
#headernormal div#desktop ul {
  margin: auto;
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  text-align: right;
  line-height: 1.1em;
  opacity: 1;
  transition: opacity 1s;
  transition-delay: 0.15s;
  /*langues en bas du mobile ?*/
}
@media screen and (max-width: 1084px) {
  #header div#desktop ul,
  #headerrelative div#desktop ul,
  #headernormal div#desktop ul {
    width: calc(100% - 110px);
    margin: 0;
  }
}
@media screen and (max-width: 1023px) {
  #header div#desktop ul,
  #headerrelative div#desktop ul,
  #headernormal div#desktop ul {
    opacity: 0;
    pointer-events: none;
    cursor: default;
    transition-delay: 0s;
  }
}
#header div#desktop ul li,
#headerrelative div#desktop ul li,
#headernormal div#desktop ul li {
  display: inline-block;
  height: 100%;
  padding-left: 60px;
  padding-right: 0px;
}
#header div#desktop ul li a,
#headerrelative div#desktop ul li a,
#headernormal div#desktop ul li a {
  height: calc(100% - 50px);
  color: #343434;
  font-size: 11px;
  font-family: 'akkurat', Helvetica, sans-serif !important;
  font-weight: 400 !important;
  text-transform: uppercase;
  display: block;
  transition: padding 1s;
  position: relative;
  padding: 48px 0px 2px;
}
@media only screen and (max-width: 766px) {
  #header div#desktop ul li a,
  #headerrelative div#desktop ul li a,
  #headernormal div#desktop ul li a {
    pointer-events: none !important;
  }
}
#header div#desktop ul li a::after,
#headerrelative div#desktop ul li a::after,
#headernormal div#desktop ul li a::after {
  height: 1px;
  width: 0;
  font-size: 0;
  position: absolute;
  display: block;
  opacity: 1;
  content: '.';
  bottom: 0;
  background-color: #252525;
  transition: width 0.3s;
  left: 0;
}
#header div#desktop ul li a.actif::after,
#headerrelative div#desktop ul li a.actif::after,
#headernormal div#desktop ul li a.actif::after {
  width: 100%;
  transition: width 0s;
}
#header div#desktop ul li a:hover:after,
#headerrelative div#desktop ul li a:hover:after,
#headernormal div#desktop ul li a:hover:after {
  width: 100%;
}
#header div#desktop ul li:nth-child(4),
#headerrelative div#desktop ul li:nth-child(4),
#headernormal div#desktop ul li:nth-child(4) {
  height: auto;
  position: absolute;
  right: -15%;
  top: 50px;
}
#header div#desktop ul li:nth-child(4) p,
#headerrelative div#desktop ul li:nth-child(4) p,
#headernormal div#desktop ul li:nth-child(4) p {
  color: #343434;
  text-transform: uppercase;
  font-size: 10px;
}
@media only screen and (min-width: 1023px) {
  .showit {
    opacity: 1 !important;
  }
}
.showit.logo,
.showit.logo2 {
  opacity: 1 !important;
}
/*
.showit.burger
{

    opacity: 1 !important;

}
*/
.showit.langue {
  opacity: 1 !important;
}
@media only screen and (max-width: 1023px) {
  .showit.langue {
    opacity: 0 !important;
    transition-delay: 0.0s !important;
  }
}
#headerrelative {
  position: relative;
  background: transparent;
  color: white !important;
  /*
                div#desktop ul
                {
                    display: none;
                }
                */
}
#headerrelative .burger {
  display: block;
  position: absolute;
  padding: 20px;
  right: 5px;
  bottom: 15px;
  width: 18px;
  opacity: 0;
  transition: opacity .3s;
  transition-delay: 0s;
  color: #000;
}
@media screen and (max-width: 1023px) {
  #headerrelative .burger {
    opacity: 1;
    transition-delay: .5s;
    cursor: pointer !important;
    pointer-events: auto;
    bottom: 5px;
    right: 5px;
    top: auto;
  }
}
#headerrelative .langue {
  opacity: 0;
  transition: opacity 1.0s;
  transition-delay: 1.0s;
}
#headerrelative .logo {
  opacity: 0;
  transition: opacity 1.0s;
  transition-delay: 1.0s;
}
@media only screen and (max-width: 1084px) {
  #headerrelative .logo {
    left: 15px;
  }
}
@media only screen and (max-width: 766px) {
  #headerrelative .logo {
    /*
            left:   0;
            right:  0;
            margin: auto;*/
  }
}
#headerrelative .logo2 {
  opacity: 0;
  transition: opacity 1.0s;
  transition-delay: 1.0s;
}
@media only screen and (max-width: 1084px) {
  #headerrelative .logo2 {
    left: 15px;
  }
}
@media only screen and (max-width: 766px) {
  #headerrelative .logo2 {
    /*
            left:   0;
            right:  0;
            margin: auto;*/
  }
}
#headerrelative a::after {
  background-color: #FFF !important;
}
#headerrelative li {
  opacity: 0;
  transition: opacity 1.0s;
  transition-delay: 1.0s;
}
#headerrelative .logo,
#headerrelative .logo2 {
  background-image: url('https://nedd.me//images/home/logomix-blanc.png');
}
#headerrelative .centreur {
  overflow: visible;
}
@media screen and (max-width: 1084px) {
  #headerrelative .centreur {
    width: calc(100% - 2 * 40px) !important;
  }
}
@media only screen and (max-width: 766px) {
  #headerrelative .centreur {
    width: calc(100% - 2 * 15px) !important;
  }
}
.headerblanc {
  background-color: white !important;
}
div#mobileMenu {
  display: block;
  position: absolute;
  position: fixed;
  right: 0;
  top: 0;
  width: 0;
  height: calc(100% + 350px);
  overflow: hidden;
  z-index: 12;
  transition: width 0.2s ease-out;
  transition-delay: .4s;
}
@media screen and (max-width: 1084px) {
  div#mobileMenu {
    height: calc(100% + 500px);
  }
}
div#mobileMenu #content {
  z-index: 13;
  overflow: hidden;
  background-color: white;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  max-width: none;
  width: 100%;
  height: 100%;
  transform: translateX(100%);
  transition: transform 0.4s ease-out;
  transition-delay: .2s;
}
div#mobileMenu #content #border {
  left: 0;
  z-index: 15;
  border-right: 1px solid #e7e7e7;
  border-left: 1px solid #e7e7e7;
  height: 100%;
  width: 0;
  position: absolute;
  background-color: white;
  transition: width 0.6s ease-in-out;
  transition-delay: .5s;
}
div#mobileMenu #content #ulContainer {
  z-index: 14;
  right: 0;
  height: 100%;
  width: calc(100% - 30px);
  position: absolute;
}
div#mobileMenu #content #ulContainer #fleche {
  display: block;
  position: absolute;
  padding: 20px;
  top: 5px;
  right: 40px;
  width: 18px;
  opacity: 0;
  transition: right 1s ease-in-out, opacity 0.2s ease-in-out;
  transition-delay: 0s;
}
div#mobileMenu #content #ulContainer #fleche:hover {
  cursor: pointer;
}
div#mobileMenu #content #ulContainer ul {
  overflow: hidden;
  height: calc(100% - 100px);
  top: 100px;
  position: absolute;
  margin-left: -100%;
  transition: margin-left 0.3s ease-in-out;
  transition-delay: 0s;
  width: 100%;
}
@media only screen and (max-height: 500px) {
  div#mobileMenu #content #ulContainer ul {
    top: 50px;
    height: calc(100% - 50px);
  }
}
div#mobileMenu #content #ulContainer ul li {
  display: block;
  /*a:hover::after
                             {
                                 width: 100%;
                             }*/
}
div#mobileMenu #content #ulContainer ul li a {
  margin-left: -100%;
  color: #343434;
  text-transform: uppercase;
  white-space: nowrap;
  display: inline-block;
  position: relative;
  padding: 28px 0;
  font-size: 18px;
  transition-delay: .5s;
  min-width: 100%;
}
@media only screen and (max-height: 430px) {
  div#mobileMenu #content #ulContainer ul li a {
    padding: 24px 0;
  }
}
div#mobileMenu #content #ulContainer ul li a p {
  display: inline-block;
  width: auto;
  padding-left: 4px;
  transition-delay: 1s;
  transform: translateX(-100%);
}
div#mobileMenu #content #ulContainer ul li a::after {
  height: 1px;
  width: 0;
  font-size: 0;
  position: absolute;
  display: block;
  opacity: 1;
  content: '.';
  bottom: 20px;
  background-color: #252525;
  transition: width 0.5s;
  left: 0;
}
div#mobileMenu #content #ulContainer ul li:nth-child(4) {
  position: absolute;
  bottom: 10px;
  left: 5px;
}
div#mobileMenu #content #ulContainer ul li:nth-child(4) .langue {
  position: static;
  display: block;
  opacity: 1;
  transition-delay: 1s;
  pointer-events: auto;
  cursor: pointer;
  transform: translateX(calc(-100% - 5px));
}
.headerFixed {
  position: fixed;
  top: -100px;
  left: 0;
  width: 100%;
  transition: opacity .5s, top .5s, margin 0.5s;
}
.headerFixedEnters {
  top: 0;
  opacity: 1.00;
  transition: opacity .5s, top .5s, margin 0.5s;
}
.notransition {
  transition: none !important;
}
div.mobileOpen {
  width: 100% !important;
  transition-delay: 0s !important;
}
div.mobileOpen #content {
  transform: translateX(0) !important;
  transition-delay: .2s !important;
}
div.mobileOpen #content #border {
  width: 30px !important;
  transition-delay: .4s !important;
}
div.mobileOpen #content #ulContainer #fleche {
  opacity: 1 !important;
  right: 5px !important;
  transition: right 0.4s ease-in-out, opacity 0.4s ease-in-out !important;
  transition-delay: .5s !important;
}
div.mobileOpen #content #ulContainer ul {
  transition: margin-left 0s !important;
  transition-delay: 0s !important;
  margin-left: 0 !important;
}
div.mobileOpen #content #ulContainer ul li a {
  transition: margin-left 0.5s !important;
  margin-left: 0 !important;
}
div.mobileOpen #content #ulContainer ul li a p {
  transition: transform 0.5s ease-in-out !important;
  transform: translateX(0%) !important;
}
div.mobileOpen #content #ulContainer ul li div {
  transition: transform 0.5s ease-in-out !important;
  transform: translateX(0%) !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(1) a {
  transition-delay: 0.3s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(1) a p {
  transition-delay: 0.3s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(1) div {
  transition-delay: 0.3s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(2) a {
  transition-delay: 0.4s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(2) a p {
  transition-delay: 0.4s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(2) div {
  transition-delay: 0.4s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(3) a {
  transition-delay: 0.5s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(3) a p {
  transition-delay: 0.5s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(3) div {
  transition-delay: 0.5s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(4) a {
  transition-delay: 0.6s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(4) a p {
  transition-delay: 0.6s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(4) div {
  transition-delay: 0.6s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(5) a {
  transition-delay: 0.7s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(5) a p {
  transition-delay: 0.7s !important;
}
div.mobileOpen #content #ulContainer ul li:nth-child(5) div {
  transition-delay: 0.7s !important;
}
