* {
      -webkit-box-sizing: inherit;
      box-sizing: inherit
  }

  html {
      -ms-touch-action: none;
      padding: 0;
      margin: 0;
      border: 0;
  }



  body,
  ul,
  li {
      padding: 0;
      margin: 0;
      border: 0;

  }



  body {
      font-size: 12px;
      font-family: ubuntu, helvetica, arial;
      overflow: hidden;
      /* this is important to prevent the whole page to bounce */
      background: #fff;
  }

  html,
  body {
      position: relative;
      height: 100%;
      width: 100%;
  }



  .very-specific-design {
      display: block;
      height: 768px;
      padding: 0px;
      text-align: center;
      background-color: rgba(0, 0, 0, 0);
      position: relative;

      left: 50%;
      top: 50%;
      -webkit-transform: translate(50%, 50%);
      transform: translate(50%, 50%);
      -webkit-transform-origin: center center;
      transform-origin: center center;
      overflow: hidden;
  }

  .scaleable-wrapper {
      padding: 0px;
      resize: both;
      position: relative;
      background-color: rgba(0, 0, 0, 0);
  }

  #wrapper-img {
      position: absolute;
      z-index: 1;
      top: 0px;
      bottom: 0px;
      left: 0;
      width: 100%;
      background-color: rgba(0, 0, 0, 0);
      overflow: hidden;
  }

  #scroller-img ul {
      list-style: none;
      padding: 0;
      margin: 0;
      width: 100%;
      height: 100%;
      text-align: center;
  }




  img {
      vertical-align: middle;
      border-style: none;
      padding: 0;
      margin: 0;
      border: 0;
      max-width: 100%;
      height: auto;
  }

  .fluide {
      -webkit-transition: opacity .5s ease-out;
      transition: opacity .5s ease-out;
  }




  @font-face {
      font-family: 'roboto_condensedregular';
      src: url('assets/font/RobotoCondensed-Bold-webfont.eot');
      src: url('assets/font/RobotoCondensed-Bold-webfont.eot?#iefix') format('embedded-opentype'),
          url('assets/font/RobotoCondensed-Bold-webfont.woff') format('woff'),
          url('assets/font/RobotoCondensed-Bold-webfont.ttf') format('truetype'),
          url('assets/font/RobotoCondensed-Bold-webfont.svg#roboto_condensedbold') format('svg');
      font-weight: normal;
      font-style: normal;

  }

  @font-face {
      font-family: 'Material Icons';
      font-style: normal;
      font-weight: 400;
      src: url(assets/font/MaterialIcons-Regular.eot);
      /* For IE6-8 */
      src: local('assets/font/Material Icons'),
          local('assets/font/MaterialIcons-Regular'),
          url(assets/font/MaterialIcons-Regular.woff2) format('woff2'),
          url(assets/font/MaterialIcons-Regular.woff) format('woff'),
          url(assets/font/MaterialIcons-Regular.ttf) format('truetype');
  }

  .material-icons {
      font-family: 'Material Icons';
      font-weight: normal;
      font-style: normal;
      font-size: 24px;
      /* Preferred icon size */
      display: inline-block;
      line-height: 1.2;
      text-transform: none;
      letter-spacing: normal;
      word-wrap: normal;
      white-space: nowrap;
      direction: ltr;

      /* Support for all WebKit browsers. */
      -webkit-font-smoothing: antialiased;
      /* Support for Safari and Chrome. */
      text-rendering: optimizeLegibility;

      /* Support for Firefox. */
      -moz-osx-font-smoothing: grayscale;

      /* Support for IE. */
      -webkit-font-feature-settings: 'liga';
      font-feature-settings: 'liga';
  }


  #loader {
      width: 100%;
      height: 100%;
      background: #fff;
      position: absolute;
      top: 0;
      overflow: hidden;
      display: block;
      z-index: 1000;
      opacity: 1;
      visibility: visible;
      /*            background-color: rgba(0, 0, 0, 0);*/
      background-image: url(../images/loading.gif);
      background-origin: padding-box;
      background-size: auto;
      background-repeat: no-repeat;
      background-position: center;
  }


  /* Rules for sizing the icon. */

  .material-icons.md-18 {
      font-size: 18px;
  }

  .material-icons.md-24 {
      font-size: 24px;
  }

  .material-icons.md-36 {
      font-size: 36px;
  }

  .material-icons.md-48 {
      font-size: 48px;
  }

  /* Rules for using icons as black on a light background. */

  .material-icons.md-dark {
      color: rgba(0, 0, 0, 0.54);
  }

  .material-icons.md-dark.md-inactive {
      color: rgba(0, 0, 0, 0.26);
  }

  /* Rules for using icons as white on a dark background. */

  .material-icons.md-light {
      color: rgba(255, 255, 255, 1);
  }

  .material-icons.md-light.md-inactive {
      color: rgba(255, 255, 255, 0.3);
  }



  #scroller-img {
      position: absolute;
      z-index: 1;
      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
      width: calc(var(--largeur_img) * var(--nombre_img));
      height: 100%;
      background-color: rgba(0, 0, 0, 0);
      -webkit-transform: translateZ(0);
      transform: translateZ(0);
      -webkit-touch-callout: none;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      -webkit-text-size-adjust: none;
      -moz-text-size-adjust: none;
      -ms-text-size-adjust: none;
      -o-text-size-adjust: none;
      text-size-adjust: none;
  }

        #scroller-img li {
            display: block;
            float: left;
            width: var(--largeur_img);
            height: var(--hauteur_img);
            background-color: rgba(0, 0, 0, 0);
            font-size: 14px;
        }