/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file styles.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.interactive-scroller {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  bottom: 0;
  width: 100px;
  pointer-events: none;
  user-select: none;
}

.interactive-scroller__layout-white {
  color: #fff;
}

.interactive-scroller__layout-black {
  color: #000;
}

.interactive-scroller__layout,
.interactive-scroller__layout-inner {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  transform-origin: 100% 100%;
}

.interactive-scroller__layout {
  overflow: hidden;
  opacity: 0;
}

.interactive-scroller__layout-inner {
  opacity: 0;
}

.interactive-scroller__over-area,
.interactive-scroller__cursor,
.interactive-scroller__cursor-container,
.interactive-scroller__line-container,
.interactive-scroller__label {
  position: absolute;
  left: 0;
}

.interactive-scroller__cursor-container,
.interactive-scroller__line-container {
  transform-origin: 0 0;
  height: 150px;
  top: 50%;
  right: 0;
}

.interactive-scroller__over-area {
  top: 0;
  bottom: 0;
  right: 0;
  pointer-events: auto;
}

.interactive-scroller__cursor-container {
  z-index: 2;
}

.interactive-scroller__cursor {
  top: 0;
  left: 50%;
  margin-left: -7.5px;
  margin-top: -7.5px;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background-color: currentColor;
  transform: scale(.66667);
  transform-origin: 50% 50%;
  cursor: pointer;
  pointer-events: auto;
  user-select: auto;
}

.interactive-scroller__label {
  bottom: 100%;
  left: 50%;
  writing-mode: vertical-lr;
  text-orientation: mixed;
  color: currentColor;
  transform: scale(-1) translateX(50%);
  margin-bottom: 20px;
}

.ie .interactive-scroller__label {
  transform: scale(-1) translateX(50%) rotateZ(90deg);
}

.interactive-scroller__line {
  position: relative;
  bottom: 0;
  left: 50%;
  height: 150px;
  width: 1px;
  background-color: currentColor;
  transform-origin: 0 0;
  transform: scaleY(.33333);
}

/*!
 * Bootstrap Grid v4.1.3 (https://getbootstrap.com/)
 * Copyright 2011-2018 The Bootstrap Authors
 * Copyright 2011-2018 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */

@-ms-viewport {
  width: device-width;
}

html {
  box-sizing: border-box;
  -ms-overflow-style: scrollbar;
}

*,
::after,
::before {
  box-sizing: inherit;
}

.container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }
}

.container-fluid {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

.row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}

.no-gutters {
  margin-right: 0;
  margin-left: 0;
}

.no-gutters>.col,
.no-gutters>[class*=col-] {
  padding-right: 0;
  padding-left: 0;
}

.col,
.col-1,
.col-10,
.col-11,
.col-12,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-auto,
.col-lg,
.col-lg-1,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-auto,
.col-md,
.col-md-1,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-auto,
.col-sm,
.col-sm-1,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-auto,
.col-xl,
.col-xl-1,
.col-xl-10,
.col-xl-11,
.col-xl-12,
.col-xl-2,
.col-xl-3,
.col-xl-4,
.col-xl-5,
.col-xl-6,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-auto {
  position: relative;
  width: 100%;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}

.col {
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -ms-flex-positive: 1;
  flex-grow: 1;
  max-width: 100%;
}

.col-auto {
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  width: auto;
  max-width: none;
}

.col-1 {
  -ms-flex: 0 0 8.333333%;
  flex: 0 0 8.333333%;
  max-width: 8.333333%;
}

.col-2 {
  -ms-flex: 0 0 16.666667%;
  flex: 0 0 16.666667%;
  max-width: 16.666667%;
}

.col-3 {
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%;
}

.col-4 {
  -ms-flex: 0 0 33.333333%;
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
}

.col-5 {
  -ms-flex: 0 0 41.666667%;
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
}

.col-6 {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%;
}

.col-7 {
  -ms-flex: 0 0 58.333333%;
  flex: 0 0 58.333333%;
  max-width: 58.333333%;
}

.col-8 {
  -ms-flex: 0 0 66.666667%;
  flex: 0 0 66.666667%;
  max-width: 66.666667%;
}

.col-9 {
  -ms-flex: 0 0 75%;
  flex: 0 0 75%;
  max-width: 75%;
}

.col-10 {
  -ms-flex: 0 0 83.333333%;
  flex: 0 0 83.333333%;
  max-width: 83.333333%;
}

.col-11 {
  -ms-flex: 0 0 91.666667%;
  flex: 0 0 91.666667%;
  max-width: 91.666667%;
}

.col-12 {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
}

.order-first {
  -ms-flex-order: -1;
  order: -1;
}

.order-last {
  -ms-flex-order: 13;
  order: 13;
}

.order-0 {
  -ms-flex-order: 0;
  order: 0;
}

.order-1 {
  -ms-flex-order: 1;
  order: 1;
}

.order-2 {
  -ms-flex-order: 2;
  order: 2;
}

.order-3 {
  -ms-flex-order: 3;
  order: 3;
}

.order-4 {
  -ms-flex-order: 4;
  order: 4;
}

.order-5 {
  -ms-flex-order: 5;
  order: 5;
}

.order-6 {
  -ms-flex-order: 6;
  order: 6;
}

.order-7 {
  -ms-flex-order: 7;
  order: 7;
}

.order-8 {
  -ms-flex-order: 8;
  order: 8;
}

.order-9 {
  -ms-flex-order: 9;
  order: 9;
}

.order-10 {
  -ms-flex-order: 10;
  order: 10;
}

.order-11 {
  -ms-flex-order: 11;
  order: 11;
}

.order-12 {
  -ms-flex-order: 12;
  order: 12;
}

.offset-1 {
  margin-left: 8.333333%;
}

.offset-2 {
  margin-left: 16.666667%;
}

.offset-3 {
  margin-left: 25%;
}

.offset-4 {
  margin-left: 33.333333%;
}

.offset-5 {
  margin-left: 41.666667%;
}

.offset-6 {
  margin-left: 50%;
}

.offset-7 {
  margin-left: 58.333333%;
}

.offset-8 {
  margin-left: 66.666667%;
}

.offset-9 {
  margin-left: 75%;
}

.offset-10 {
  margin-left: 83.333333%;
}

.offset-11 {
  margin-left: 91.666667%;
}

@media (min-width: 576px) {
  .col-sm {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }

  .col-sm-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: none;
  }

  .col-sm-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }

  .col-sm-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }

  .col-sm-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }

  .col-sm-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }

  .col-sm-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }

  .col-sm-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }

  .col-sm-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }

  .col-sm-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }

  .col-sm-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }

  .col-sm-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }

  .col-sm-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }

  .col-sm-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .order-sm-first {
    -ms-flex-order: -1;
    order: -1;
  }

  .order-sm-last {
    -ms-flex-order: 13;
    order: 13;
  }

  .order-sm-0 {
    -ms-flex-order: 0;
    order: 0;
  }

  .order-sm-1 {
    -ms-flex-order: 1;
    order: 1;
  }

  .order-sm-2 {
    -ms-flex-order: 2;
    order: 2;
  }

  .order-sm-3 {
    -ms-flex-order: 3;
    order: 3;
  }

  .order-sm-4 {
    -ms-flex-order: 4;
    order: 4;
  }

  .order-sm-5 {
    -ms-flex-order: 5;
    order: 5;
  }

  .order-sm-6 {
    -ms-flex-order: 6;
    order: 6;
  }

  .order-sm-7 {
    -ms-flex-order: 7;
    order: 7;
  }

  .order-sm-8 {
    -ms-flex-order: 8;
    order: 8;
  }

  .order-sm-9 {
    -ms-flex-order: 9;
    order: 9;
  }

  .order-sm-10 {
    -ms-flex-order: 10;
    order: 10;
  }

  .order-sm-11 {
    -ms-flex-order: 11;
    order: 11;
  }

  .order-sm-12 {
    -ms-flex-order: 12;
    order: 12;
  }

  .offset-sm-0 {
    margin-left: 0;
  }

  .offset-sm-1 {
    margin-left: 8.333333%;
  }

  .offset-sm-2 {
    margin-left: 16.666667%;
  }

  .offset-sm-3 {
    margin-left: 25%;
  }

  .offset-sm-4 {
    margin-left: 33.333333%;
  }

  .offset-sm-5 {
    margin-left: 41.666667%;
  }

  .offset-sm-6 {
    margin-left: 50%;
  }

  .offset-sm-7 {
    margin-left: 58.333333%;
  }

  .offset-sm-8 {
    margin-left: 66.666667%;
  }

  .offset-sm-9 {
    margin-left: 75%;
  }

  .offset-sm-10 {
    margin-left: 83.333333%;
  }

  .offset-sm-11 {
    margin-left: 91.666667%;
  }
}

@media (min-width: 768px) {
  .col-md {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }

  .col-md-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: none;
  }

  .col-md-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }

  .col-md-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }

  .col-md-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }

  .col-md-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }

  .col-md-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }

  .col-md-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }

  .col-md-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }

  .col-md-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }

  .col-md-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }

  .col-md-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }

  .col-md-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }

  .col-md-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .order-md-first {
    -ms-flex-order: -1;
    order: -1;
  }

  .order-md-last {
    -ms-flex-order: 13;
    order: 13;
  }

  .order-md-0 {
    -ms-flex-order: 0;
    order: 0;
  }

  .order-md-1 {
    -ms-flex-order: 1;
    order: 1;
  }

  .order-md-2 {
    -ms-flex-order: 2;
    order: 2;
  }

  .order-md-3 {
    -ms-flex-order: 3;
    order: 3;
  }

  .order-md-4 {
    -ms-flex-order: 4;
    order: 4;
  }

  .order-md-5 {
    -ms-flex-order: 5;
    order: 5;
  }

  .order-md-6 {
    -ms-flex-order: 6;
    order: 6;
  }

  .order-md-7 {
    -ms-flex-order: 7;
    order: 7;
  }

  .order-md-8 {
    -ms-flex-order: 8;
    order: 8;
  }

  .order-md-9 {
    -ms-flex-order: 9;
    order: 9;
  }

  .order-md-10 {
    -ms-flex-order: 10;
    order: 10;
  }

  .order-md-11 {
    -ms-flex-order: 11;
    order: 11;
  }

  .order-md-12 {
    -ms-flex-order: 12;
    order: 12;
  }

  .offset-md-0 {
    margin-left: 0;
  }

  .offset-md-1 {
    margin-left: 8.333333%;
  }

  .offset-md-2 {
    margin-left: 16.666667%;
  }

  .offset-md-3 {
    margin-left: 25%;
  }

  .offset-md-4 {
    margin-left: 33.333333%;
  }

  .offset-md-5 {
    margin-left: 41.666667%;
  }

  .offset-md-6 {
    margin-left: 50%;
  }

  .offset-md-7 {
    margin-left: 58.333333%;
  }

  .offset-md-8 {
    margin-left: 66.666667%;
  }

  .offset-md-9 {
    margin-left: 75%;
  }

  .offset-md-10 {
    margin-left: 83.333333%;
  }

  .offset-md-11 {
    margin-left: 91.666667%;
  }
}

@media (min-width: 992px) {
  .col-lg {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }

  .col-lg-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: none;
  }

  .col-lg-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }

  .col-lg-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }

  .col-lg-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }

  .col-lg-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }

  .col-lg-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }

  .col-lg-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }

  .col-lg-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }

  .col-lg-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }

  .col-lg-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }

  .col-lg-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }

  .col-lg-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }

  .col-lg-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .order-lg-first {
    -ms-flex-order: -1;
    order: -1;
  }

  .order-lg-last {
    -ms-flex-order: 13;
    order: 13;
  }

  .order-lg-0 {
    -ms-flex-order: 0;
    order: 0;
  }

  .order-lg-1 {
    -ms-flex-order: 1;
    order: 1;
  }

  .order-lg-2 {
    -ms-flex-order: 2;
    order: 2;
  }

  .order-lg-3 {
    -ms-flex-order: 3;
    order: 3;
  }

  .order-lg-4 {
    -ms-flex-order: 4;
    order: 4;
  }

  .order-lg-5 {
    -ms-flex-order: 5;
    order: 5;
  }

  .order-lg-6 {
    -ms-flex-order: 6;
    order: 6;
  }

  .order-lg-7 {
    -ms-flex-order: 7;
    order: 7;
  }

  .order-lg-8 {
    -ms-flex-order: 8;
    order: 8;
  }

  .order-lg-9 {
    -ms-flex-order: 9;
    order: 9;
  }

  .order-lg-10 {
    -ms-flex-order: 10;
    order: 10;
  }

  .order-lg-11 {
    -ms-flex-order: 11;
    order: 11;
  }

  .order-lg-12 {
    -ms-flex-order: 12;
    order: 12;
  }

  .offset-lg-0 {
    margin-left: 0;
  }

  .offset-lg-1 {
    margin-left: 8.333333%;
  }

  .offset-lg-2 {
    margin-left: 16.666667%;
  }

  .offset-lg-3 {
    margin-left: 25%;
  }

  .offset-lg-4 {
    margin-left: 33.333333%;
  }

  .offset-lg-5 {
    margin-left: 41.666667%;
  }

  .offset-lg-6 {
    margin-left: 50%;
  }

  .offset-lg-7 {
    margin-left: 58.333333%;
  }

  .offset-lg-8 {
    margin-left: 66.666667%;
  }

  .offset-lg-9 {
    margin-left: 75%;
  }

  .offset-lg-10 {
    margin-left: 83.333333%;
  }

  .offset-lg-11 {
    margin-left: 91.666667%;
  }
}

@media (min-width: 1200px) {
  .col-xl {
    -ms-flex-preferred-size: 0;
    flex-basis: 0;
    -ms-flex-positive: 1;
    flex-grow: 1;
    max-width: 100%;
  }

  .col-xl-auto {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    max-width: none;
  }

  .col-xl-1 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }

  .col-xl-2 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }

  .col-xl-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }

  .col-xl-4 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }

  .col-xl-5 {
    -ms-flex: 0 0 41.666667%;
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }

  .col-xl-6 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }

  .col-xl-7 {
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }

  .col-xl-8 {
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }

  .col-xl-9 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }

  .col-xl-10 {
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }

  .col-xl-11 {
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }

  .col-xl-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }

  .order-xl-first {
    -ms-flex-order: -1;
    order: -1;
  }

  .order-xl-last {
    -ms-flex-order: 13;
    order: 13;
  }

  .order-xl-0 {
    -ms-flex-order: 0;
    order: 0;
  }

  .order-xl-1 {
    -ms-flex-order: 1;
    order: 1;
  }

  .order-xl-2 {
    -ms-flex-order: 2;
    order: 2;
  }

  .order-xl-3 {
    -ms-flex-order: 3;
    order: 3;
  }

  .order-xl-4 {
    -ms-flex-order: 4;
    order: 4;
  }

  .order-xl-5 {
    -ms-flex-order: 5;
    order: 5;
  }

  .order-xl-6 {
    -ms-flex-order: 6;
    order: 6;
  }

  .order-xl-7 {
    -ms-flex-order: 7;
    order: 7;
  }

  .order-xl-8 {
    -ms-flex-order: 8;
    order: 8;
  }

  .order-xl-9 {
    -ms-flex-order: 9;
    order: 9;
  }

  .order-xl-10 {
    -ms-flex-order: 10;
    order: 10;
  }

  .order-xl-11 {
    -ms-flex-order: 11;
    order: 11;
  }

  .order-xl-12 {
    -ms-flex-order: 12;
    order: 12;
  }

  .offset-xl-0 {
    margin-left: 0;
  }

  .offset-xl-1 {
    margin-left: 8.333333%;
  }

  .offset-xl-2 {
    margin-left: 16.666667%;
  }

  .offset-xl-3 {
    margin-left: 25%;
  }

  .offset-xl-4 {
    margin-left: 33.333333%;
  }

  .offset-xl-5 {
    margin-left: 41.666667%;
  }

  .offset-xl-6 {
    margin-left: 50%;
  }

  .offset-xl-7 {
    margin-left: 58.333333%;
  }

  .offset-xl-8 {
    margin-left: 66.666667%;
  }

  .offset-xl-9 {
    margin-left: 75%;
  }

  .offset-xl-10 {
    margin-left: 83.333333%;
  }

  .offset-xl-11 {
    margin-left: 91.666667%;
  }
}

.d-none {
  display: none !important;
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.d-block {
  display: block !important;
}

.d-table {
  display: table !important;
}

.d-table-row {
  display: table-row !important;
}

.d-table-cell {
  display: table-cell !important;
}

.d-flex {
  display: -ms-flexbox !important;
  display: flex !important;
}

.d-inline-flex {
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
}

@media (min-width: 576px) {
  .d-sm-none {
    display: none !important;
  }

  .d-sm-inline {
    display: inline !important;
  }

  .d-sm-inline-block {
    display: inline-block !important;
  }

  .d-sm-block {
    display: block !important;
  }

  .d-sm-table {
    display: table !important;
  }

  .d-sm-table-row {
    display: table-row !important;
  }

  .d-sm-table-cell {
    display: table-cell !important;
  }

  .d-sm-flex {
    display: -ms-flexbox !important;
    display: flex !important;
  }

  .d-sm-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 768px) {
  .d-md-none {
    display: none !important;
  }

  .d-md-inline {
    display: inline !important;
  }

  .d-md-inline-block {
    display: inline-block !important;
  }

  .d-md-block {
    display: block !important;
  }

  .d-md-table {
    display: table !important;
  }

  .d-md-table-row {
    display: table-row !important;
  }

  .d-md-table-cell {
    display: table-cell !important;
  }

  .d-md-flex {
    display: -ms-flexbox !important;
    display: flex !important;
  }

  .d-md-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 992px) {
  .d-lg-none {
    display: none !important;
  }

  .d-lg-inline {
    display: inline !important;
  }

  .d-lg-inline-block {
    display: inline-block !important;
  }

  .d-lg-block {
    display: block !important;
  }

  .d-lg-table {
    display: table !important;
  }

  .d-lg-table-row {
    display: table-row !important;
  }

  .d-lg-table-cell {
    display: table-cell !important;
  }

  .d-lg-flex {
    display: -ms-flexbox !important;
    display: flex !important;
  }

  .d-lg-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 1200px) {
  .d-xl-none {
    display: none !important;
  }

  .d-xl-inline {
    display: inline !important;
  }

  .d-xl-inline-block {
    display: inline-block !important;
  }

  .d-xl-block {
    display: block !important;
  }

  .d-xl-table {
    display: table !important;
  }

  .d-xl-table-row {
    display: table-row !important;
  }

  .d-xl-table-cell {
    display: table-cell !important;
  }

  .d-xl-flex {
    display: -ms-flexbox !important;
    display: flex !important;
  }

  .d-xl-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media print {
  .d-print-none {
    display: none !important;
  }

  .d-print-inline {
    display: inline !important;
  }

  .d-print-inline-block {
    display: inline-block !important;
  }

  .d-print-block {
    display: block !important;
  }

  .d-print-table {
    display: table !important;
  }

  .d-print-table-row {
    display: table-row !important;
  }

  .d-print-table-cell {
    display: table-cell !important;
  }

  .d-print-flex {
    display: -ms-flexbox !important;
    display: flex !important;
  }

  .d-print-inline-flex {
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

.flex-row {
  -ms-flex-direction: row !important;
  flex-direction: row !important;
}

.flex-column {
  -ms-flex-direction: column !important;
  flex-direction: column !important;
}

.flex-row-reverse {
  -ms-flex-direction: row-reverse !important;
  flex-direction: row-reverse !important;
}

.flex-column-reverse {
  -ms-flex-direction: column-reverse !important;
  flex-direction: column-reverse !important;
}

.flex-wrap {
  -ms-flex-wrap: wrap !important;
  flex-wrap: wrap !important;
}

.flex-nowrap {
  -ms-flex-wrap: nowrap !important;
  flex-wrap: nowrap !important;
}

.flex-wrap-reverse {
  -ms-flex-wrap: wrap-reverse !important;
  flex-wrap: wrap-reverse !important;
}

.flex-fill {
  -ms-flex: 1 1 auto !important;
  flex: 1 1 auto !important;
}

.flex-grow-0 {
  -ms-flex-positive: 0 !important;
  flex-grow: 0 !important;
}

.flex-grow-1 {
  -ms-flex-positive: 1 !important;
  flex-grow: 1 !important;
}

.flex-shrink-0 {
  -ms-flex-negative: 0 !important;
  flex-shrink: 0 !important;
}

.flex-shrink-1 {
  -ms-flex-negative: 1 !important;
  flex-shrink: 1 !important;
}

.justify-content-start {
  -ms-flex-pack: start !important;
  justify-content: flex-start !important;
}

.justify-content-end {
  -ms-flex-pack: end !important;
  justify-content: flex-end !important;
}

.justify-content-center {
  -ms-flex-pack: center !important;
  justify-content: center !important;
}

.justify-content-between {
  -ms-flex-pack: justify !important;
  justify-content: space-between !important;
}

.justify-content-around {
  -ms-flex-pack: distribute !important;
  justify-content: space-around !important;
}

.align-items-start {
  -ms-flex-align: start !important;
  align-items: flex-start !important;
}

.align-items-end {
  -ms-flex-align: end !important;
  align-items: flex-end !important;
}

.align-items-center {
  -ms-flex-align: center !important;
  align-items: center !important;
}

.align-items-baseline {
  -ms-flex-align: baseline !important;
  align-items: baseline !important;
}

.align-items-stretch {
  -ms-flex-align: stretch !important;
  align-items: stretch !important;
}

.align-content-start {
  -ms-flex-line-pack: start !important;
  align-content: flex-start !important;
}

.align-content-end {
  -ms-flex-line-pack: end !important;
  align-content: flex-end !important;
}

.align-content-center {
  -ms-flex-line-pack: center !important;
  align-content: center !important;
}

.align-content-between {
  -ms-flex-line-pack: justify !important;
  align-content: space-between !important;
}

.align-content-around {
  -ms-flex-line-pack: distribute !important;
  align-content: space-around !important;
}

.align-content-stretch {
  -ms-flex-line-pack: stretch !important;
  align-content: stretch !important;
}

.align-self-auto {
  -ms-flex-item-align: auto !important;
  align-self: auto !important;
}

.align-self-start {
  -ms-flex-item-align: start !important;
  align-self: flex-start !important;
}

.align-self-end {
  -ms-flex-item-align: end !important;
  align-self: flex-end !important;
}

.align-self-center {
  -ms-flex-item-align: center !important;
  align-self: center !important;
}

.align-self-baseline {
  -ms-flex-item-align: baseline !important;
  align-self: baseline !important;
}

.align-self-stretch {
  -ms-flex-item-align: stretch !important;
  align-self: stretch !important;
}

@media (min-width: 576px) {
  .flex-sm-row {
    -ms-flex-direction: row !important;
    flex-direction: row !important;
  }

  .flex-sm-column {
    -ms-flex-direction: column !important;
    flex-direction: column !important;
  }

  .flex-sm-row-reverse {
    -ms-flex-direction: row-reverse !important;
    flex-direction: row-reverse !important;
  }

  .flex-sm-column-reverse {
    -ms-flex-direction: column-reverse !important;
    flex-direction: column-reverse !important;
  }

  .flex-sm-wrap {
    -ms-flex-wrap: wrap !important;
    flex-wrap: wrap !important;
  }

  .flex-sm-nowrap {
    -ms-flex-wrap: nowrap !important;
    flex-wrap: nowrap !important;
  }

  .flex-sm-wrap-reverse {
    -ms-flex-wrap: wrap-reverse !important;
    flex-wrap: wrap-reverse !important;
  }

  .flex-sm-fill {
    -ms-flex: 1 1 auto !important;
    flex: 1 1 auto !important;
  }

  .flex-sm-grow-0 {
    -ms-flex-positive: 0 !important;
    flex-grow: 0 !important;
  }

  .flex-sm-grow-1 {
    -ms-flex-positive: 1 !important;
    flex-grow: 1 !important;
  }

  .flex-sm-shrink-0 {
    -ms-flex-negative: 0 !important;
    flex-shrink: 0 !important;
  }

  .flex-sm-shrink-1 {
    -ms-flex-negative: 1 !important;
    flex-shrink: 1 !important;
  }

  .justify-content-sm-start {
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
  }

  .justify-content-sm-end {
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;
  }

  .justify-content-sm-center {
    -ms-flex-pack: center !important;
    justify-content: center !important;
  }

  .justify-content-sm-between {
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
  }

  .justify-content-sm-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important;
  }

  .align-items-sm-start {
    -ms-flex-align: start !important;
    align-items: flex-start !important;
  }

  .align-items-sm-end {
    -ms-flex-align: end !important;
    align-items: flex-end !important;
  }

  .align-items-sm-center {
    -ms-flex-align: center !important;
    align-items: center !important;
  }

  .align-items-sm-baseline {
    -ms-flex-align: baseline !important;
    align-items: baseline !important;
  }

  .align-items-sm-stretch {
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
  }

  .align-content-sm-start {
    -ms-flex-line-pack: start !important;
    align-content: flex-start !important;
  }

  .align-content-sm-end {
    -ms-flex-line-pack: end !important;
    align-content: flex-end !important;
  }

  .align-content-sm-center {
    -ms-flex-line-pack: center !important;
    align-content: center !important;
  }

  .align-content-sm-between {
    -ms-flex-line-pack: justify !important;
    align-content: space-between !important;
  }

  .align-content-sm-around {
    -ms-flex-line-pack: distribute !important;
    align-content: space-around !important;
  }

  .align-content-sm-stretch {
    -ms-flex-line-pack: stretch !important;
    align-content: stretch !important;
  }

  .align-self-sm-auto {
    -ms-flex-item-align: auto !important;
    align-self: auto !important;
  }

  .align-self-sm-start {
    -ms-flex-item-align: start !important;
    align-self: flex-start !important;
  }

  .align-self-sm-end {
    -ms-flex-item-align: end !important;
    align-self: flex-end !important;
  }

  .align-self-sm-center {
    -ms-flex-item-align: center !important;
    align-self: center !important;
  }

  .align-self-sm-baseline {
    -ms-flex-item-align: baseline !important;
    align-self: baseline !important;
  }

  .align-self-sm-stretch {
    -ms-flex-item-align: stretch !important;
    align-self: stretch !important;
  }
}

@media (min-width: 768px) {
  .flex-md-row {
    -ms-flex-direction: row !important;
    flex-direction: row !important;
  }

  .flex-md-column {
    -ms-flex-direction: column !important;
    flex-direction: column !important;
  }

  .flex-md-row-reverse {
    -ms-flex-direction: row-reverse !important;
    flex-direction: row-reverse !important;
  }

  .flex-md-column-reverse {
    -ms-flex-direction: column-reverse !important;
    flex-direction: column-reverse !important;
  }

  .flex-md-wrap {
    -ms-flex-wrap: wrap !important;
    flex-wrap: wrap !important;
  }

  .flex-md-nowrap {
    -ms-flex-wrap: nowrap !important;
    flex-wrap: nowrap !important;
  }

  .flex-md-wrap-reverse {
    -ms-flex-wrap: wrap-reverse !important;
    flex-wrap: wrap-reverse !important;
  }

  .flex-md-fill {
    -ms-flex: 1 1 auto !important;
    flex: 1 1 auto !important;
  }

  .flex-md-grow-0 {
    -ms-flex-positive: 0 !important;
    flex-grow: 0 !important;
  }

  .flex-md-grow-1 {
    -ms-flex-positive: 1 !important;
    flex-grow: 1 !important;
  }

  .flex-md-shrink-0 {
    -ms-flex-negative: 0 !important;
    flex-shrink: 0 !important;
  }

  .flex-md-shrink-1 {
    -ms-flex-negative: 1 !important;
    flex-shrink: 1 !important;
  }

  .justify-content-md-start {
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
  }

  .justify-content-md-end {
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;
  }

  .justify-content-md-center {
    -ms-flex-pack: center !important;
    justify-content: center !important;
  }

  .justify-content-md-between {
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
  }

  .justify-content-md-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important;
  }

  .align-items-md-start {
    -ms-flex-align: start !important;
    align-items: flex-start !important;
  }

  .align-items-md-end {
    -ms-flex-align: end !important;
    align-items: flex-end !important;
  }

  .align-items-md-center {
    -ms-flex-align: center !important;
    align-items: center !important;
  }

  .align-items-md-baseline {
    -ms-flex-align: baseline !important;
    align-items: baseline !important;
  }

  .align-items-md-stretch {
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
  }

  .align-content-md-start {
    -ms-flex-line-pack: start !important;
    align-content: flex-start !important;
  }

  .align-content-md-end {
    -ms-flex-line-pack: end !important;
    align-content: flex-end !important;
  }

  .align-content-md-center {
    -ms-flex-line-pack: center !important;
    align-content: center !important;
  }

  .align-content-md-between {
    -ms-flex-line-pack: justify !important;
    align-content: space-between !important;
  }

  .align-content-md-around {
    -ms-flex-line-pack: distribute !important;
    align-content: space-around !important;
  }

  .align-content-md-stretch {
    -ms-flex-line-pack: stretch !important;
    align-content: stretch !important;
  }

  .align-self-md-auto {
    -ms-flex-item-align: auto !important;
    align-self: auto !important;
  }

  .align-self-md-start {
    -ms-flex-item-align: start !important;
    align-self: flex-start !important;
  }

  .align-self-md-end {
    -ms-flex-item-align: end !important;
    align-self: flex-end !important;
  }

  .align-self-md-center {
    -ms-flex-item-align: center !important;
    align-self: center !important;
  }

  .align-self-md-baseline {
    -ms-flex-item-align: baseline !important;
    align-self: baseline !important;
  }

  .align-self-md-stretch {
    -ms-flex-item-align: stretch !important;
    align-self: stretch !important;
  }
}

@media (min-width: 992px) {
  .flex-lg-row {
    -ms-flex-direction: row !important;
    flex-direction: row !important;
  }

  .flex-lg-column {
    -ms-flex-direction: column !important;
    flex-direction: column !important;
  }

  .flex-lg-row-reverse {
    -ms-flex-direction: row-reverse !important;
    flex-direction: row-reverse !important;
  }

  .flex-lg-column-reverse {
    -ms-flex-direction: column-reverse !important;
    flex-direction: column-reverse !important;
  }

  .flex-lg-wrap {
    -ms-flex-wrap: wrap !important;
    flex-wrap: wrap !important;
  }

  .flex-lg-nowrap {
    -ms-flex-wrap: nowrap !important;
    flex-wrap: nowrap !important;
  }

  .flex-lg-wrap-reverse {
    -ms-flex-wrap: wrap-reverse !important;
    flex-wrap: wrap-reverse !important;
  }

  .flex-lg-fill {
    -ms-flex: 1 1 auto !important;
    flex: 1 1 auto !important;
  }

  .flex-lg-grow-0 {
    -ms-flex-positive: 0 !important;
    flex-grow: 0 !important;
  }

  .flex-lg-grow-1 {
    -ms-flex-positive: 1 !important;
    flex-grow: 1 !important;
  }

  .flex-lg-shrink-0 {
    -ms-flex-negative: 0 !important;
    flex-shrink: 0 !important;
  }

  .flex-lg-shrink-1 {
    -ms-flex-negative: 1 !important;
    flex-shrink: 1 !important;
  }

  .justify-content-lg-start {
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
  }

  .justify-content-lg-end {
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;
  }

  .justify-content-lg-center {
    -ms-flex-pack: center !important;
    justify-content: center !important;
  }

  .justify-content-lg-between {
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
  }

  .justify-content-lg-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important;
  }

  .align-items-lg-start {
    -ms-flex-align: start !important;
    align-items: flex-start !important;
  }

  .align-items-lg-end {
    -ms-flex-align: end !important;
    align-items: flex-end !important;
  }

  .align-items-lg-center {
    -ms-flex-align: center !important;
    align-items: center !important;
  }

  .align-items-lg-baseline {
    -ms-flex-align: baseline !important;
    align-items: baseline !important;
  }

  .align-items-lg-stretch {
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
  }

  .align-content-lg-start {
    -ms-flex-line-pack: start !important;
    align-content: flex-start !important;
  }

  .align-content-lg-end {
    -ms-flex-line-pack: end !important;
    align-content: flex-end !important;
  }

  .align-content-lg-center {
    -ms-flex-line-pack: center !important;
    align-content: center !important;
  }

  .align-content-lg-between {
    -ms-flex-line-pack: justify !important;
    align-content: space-between !important;
  }

  .align-content-lg-around {
    -ms-flex-line-pack: distribute !important;
    align-content: space-around !important;
  }

  .align-content-lg-stretch {
    -ms-flex-line-pack: stretch !important;
    align-content: stretch !important;
  }

  .align-self-lg-auto {
    -ms-flex-item-align: auto !important;
    align-self: auto !important;
  }

  .align-self-lg-start {
    -ms-flex-item-align: start !important;
    align-self: flex-start !important;
  }

  .align-self-lg-end {
    -ms-flex-item-align: end !important;
    align-self: flex-end !important;
  }

  .align-self-lg-center {
    -ms-flex-item-align: center !important;
    align-self: center !important;
  }

  .align-self-lg-baseline {
    -ms-flex-item-align: baseline !important;
    align-self: baseline !important;
  }

  .align-self-lg-stretch {
    -ms-flex-item-align: stretch !important;
    align-self: stretch !important;
  }
}

@media (min-width: 1200px) {
  .flex-xl-row {
    -ms-flex-direction: row !important;
    flex-direction: row !important;
  }

  .flex-xl-column {
    -ms-flex-direction: column !important;
    flex-direction: column !important;
  }

  .flex-xl-row-reverse {
    -ms-flex-direction: row-reverse !important;
    flex-direction: row-reverse !important;
  }

  .flex-xl-column-reverse {
    -ms-flex-direction: column-reverse !important;
    flex-direction: column-reverse !important;
  }

  .flex-xl-wrap {
    -ms-flex-wrap: wrap !important;
    flex-wrap: wrap !important;
  }

  .flex-xl-nowrap {
    -ms-flex-wrap: nowrap !important;
    flex-wrap: nowrap !important;
  }

  .flex-xl-wrap-reverse {
    -ms-flex-wrap: wrap-reverse !important;
    flex-wrap: wrap-reverse !important;
  }

  .flex-xl-fill {
    -ms-flex: 1 1 auto !important;
    flex: 1 1 auto !important;
  }

  .flex-xl-grow-0 {
    -ms-flex-positive: 0 !important;
    flex-grow: 0 !important;
  }

  .flex-xl-grow-1 {
    -ms-flex-positive: 1 !important;
    flex-grow: 1 !important;
  }

  .flex-xl-shrink-0 {
    -ms-flex-negative: 0 !important;
    flex-shrink: 0 !important;
  }

  .flex-xl-shrink-1 {
    -ms-flex-negative: 1 !important;
    flex-shrink: 1 !important;
  }

  .justify-content-xl-start {
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
  }

  .justify-content-xl-end {
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;
  }

  .justify-content-xl-center {
    -ms-flex-pack: center !important;
    justify-content: center !important;
  }

  .justify-content-xl-between {
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
  }

  .justify-content-xl-around {
    -ms-flex-pack: distribute !important;
    justify-content: space-around !important;
  }

  .align-items-xl-start {
    -ms-flex-align: start !important;
    align-items: flex-start !important;
  }

  .align-items-xl-end {
    -ms-flex-align: end !important;
    align-items: flex-end !important;
  }

  .align-items-xl-center {
    -ms-flex-align: center !important;
    align-items: center !important;
  }

  .align-items-xl-baseline {
    -ms-flex-align: baseline !important;
    align-items: baseline !important;
  }

  .align-items-xl-stretch {
    -ms-flex-align: stretch !important;
    align-items: stretch !important;
  }

  .align-content-xl-start {
    -ms-flex-line-pack: start !important;
    align-content: flex-start !important;
  }

  .align-content-xl-end {
    -ms-flex-line-pack: end !important;
    align-content: flex-end !important;
  }

  .align-content-xl-center {
    -ms-flex-line-pack: center !important;
    align-content: center !important;
  }

  .align-content-xl-between {
    -ms-flex-line-pack: justify !important;
    align-content: space-between !important;
  }

  .align-content-xl-around {
    -ms-flex-line-pack: distribute !important;
    align-content: space-around !important;
  }

  .align-content-xl-stretch {
    -ms-flex-line-pack: stretch !important;
    align-content: stretch !important;
  }

  .align-self-xl-auto {
    -ms-flex-item-align: auto !important;
    align-self: auto !important;
  }

  .align-self-xl-start {
    -ms-flex-item-align: start !important;
    align-self: flex-start !important;
  }

  .align-self-xl-end {
    -ms-flex-item-align: end !important;
    align-self: flex-end !important;
  }

  .align-self-xl-center {
    -ms-flex-item-align: center !important;
    align-self: center !important;
  }

  .align-self-xl-baseline {
    -ms-flex-item-align: baseline !important;
    align-self: baseline !important;
  }

  .align-self-xl-stretch {
    -ms-flex-item-align: stretch !important;
    align-self: stretch !important;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file main.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _utils.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.u-absolute {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _dev.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.dev-grid,
.dev-blueprint {
  position: fixed;
  z-index: 1000;
  right: 0;
  bottom: 0;
  top: 0;
  left: 0;
  user-select: none;
  pointer-events: none;
}

.html-panel .dev-grid,
.html-panel .dev-blueprint {
  overflow-y: scroll;
  overflow-x: hidden;
}

.dev-grid .row>div {
  height: 100vh;
}

.dev-grid .row>div::after {
  content: '';
  display: block;
  height: 100vh;
  background-color: rgba(140,140,140,0.18);
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _bootstrap.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

@media (min-width: 0) and (max-width: 768px) {
  .container:not(.no-gutters),
  .container-fluid:not(.no-gutters),
  .row:not(.no-gutters)>.col,
  .row:not(.no-gutters)>[class*="col-"] {
    padding-right: 0;
    padding-left: 0;
  }

  .row:not(.no-gutters) {
    margin-right: 0;
    margin-left: 0;
  }

  .dev-grid .container:not(.no-gutters),
  .dev-grid .container-fluid:not(.no-gutters),
  .dev-grid .row:not(.no-gutters)>.col,
  .dev-grid .row:not(.no-gutters)>[class*="col-"] {
    padding-right: 6px;
    padding-left: 6px;
  }

  .dev-grid .row:not(.no-gutters) {
    margin-right: -6px;
    margin-left: -6px;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _mixins.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _easing.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _vars.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _common.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

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

html {
  font-size: 16px;
}

body {
  background-color: #fff;
  font-family: "rz-regular","maison-neue-mono",Helvetica,Arial,sans-serif;
  font-size: 1rem;
  padding: 0;
  margin: 0;
  color: #111;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.nav-open {
  overflow: hidden;
  height: 100vh;
  max-height: 100vh;
}

strong {
  font-family: "rz-bold","maison-neue-mono",Helvetica,Arial,sans-serif,sans-serif;
}

* {
  box-sizing: border-box;
}

h1,
h2,
.title-list li,
h3,
h4,
h5,
h6 {
  font-weight: normal;
}

h2,
.title-list li {
  font-size: 24px;
  line-height: 32px;
}

@media (min-width: 576px) {
  h2,
  .title-list li {
    font-size: calc(1.28205vw + 16.61538px);
  }
}

@media (min-width: 1200px) {
  h2,
  .title-list li {
    font-size: 32px;
  }
}

@media (min-width: 576px) {
  h2,
  .title-list li {
    line-height: calc(1.28205vw + 24.61538px);
  }
}

@media (min-width: 1200px) {
  h2,
  .title-list li {
    line-height: 40px;
  }
}

a {
  position: relative;
  color: inherit;
  text-decoration: none;
}

.markdown a,
.link-bar,
.link-bar-hover,
.nav__list-main a,
.socials a,
.footer a,
.project-share a,
.page-content.contact a:not(.big-letter),
.enquiries a {
  position: relative;
}

.markdown a::after,
.link-bar::after,
.link-bar-hover::after,
.nav__list-main a::after,
.socials a::after,
.footer a::after,
.project-share a::after,
.page-content.contact a:not(.big-letter)::after,
.enquiries a::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: currentColor;
  height: 1px;
  width: 100%;
  opacity: 0.4;
  transition: opacity 0.3s ease-out;
}

.markdown a:hover::after,
.link-bar:hover::after,
.link-bar-hover:hover::after,
.nav__list-main a:hover::after,
.socials a:hover::after,
.footer a:hover::after,
.project-share a:hover::after,
.page-content.contact a:not(.big-letter):hover::after,
.enquiries a:hover::after {
  opacity: 1;
}

.home-page .page-text-content .markdown a:last-of-type {
  display: block;
  height: 100%;
  min-height: 45px;
  margin-top: 25px;
  padding-left: 1.625rem;
}

.home-page .page-text-content .markdown a:last-of-type::after {
  width: 1px;
  bottom: 0;
  left: 0;
  top: 0;
  right: auto;
  height: 100%;
}

.home-page .page-text-content .markdown a:last-of-type::before {
  content: '';
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 0;
  top: 0;
  right: auto;
  width: 1px;
  height: 100%;
  transform-origin: 0 0;
  transform: scaleY(0);
  background-color: currentColor;
  transition: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1);
}

.home-page .page-text-content .markdown a:last-of-type:hover::after {
  opacity: 0.25;
}

.home-page .page-text-content .markdown a:last-of-type:hover::before {
  transform: scaleY(1);
}

.link-bar-hover::after,
.nav__list-main a::after,
.socials a::after,
.footer a::after,
.project-share a::after,
.page-content.contact a:not(.big-letter)::after {
  opacity: 0;
}

figure {
  margin: 0;
  padding: 0;
  overflow: hidden;
}

iframe {
  display: block;
  width: 100%;
}

*[data-layout="white"] {
  color: #fff;
  background-color: #101010;
}

.text-center {
  text-align: center;
}

.title-list li {
  list-style-type: none;
}

.title-list ul {
  margin: 0;
  padding: 0;
}

.min-height {
  height: 100vh;
}

@media screen and (orientation: portrait) and (min-width: 768px) {
  .min-height {
    max-height: 80vh;
    min-height: 750px;
  }
}

.interactive-scroller .interactive-scroller__label {
  font-size: .75rem;
}

.max-content-width {
  max-width: 336px;
}

.big-letter {
  font-size: 42px;
  line-height: 46px;
}

@media (min-width: 576px) {
  .big-letter {
    font-size: calc(13.94231vw - 38.30769px);
  }
}

@media (min-width: 992px) {
  .big-letter {
    font-size: calc(19.23077vw - 90.76923px);
  }
}

@media (min-width: 1200px) {
  .big-letter {
    font-size: 140px;
  }
}

@media (min-width: 576px) {
  .big-letter {
    line-height: calc(12.98077vw - 28.76923px);
  }
}

@media (min-width: 992px) {
  .big-letter {
    line-height: calc(19.23077vw - 90.76923px);
  }
}

@media (min-width: 1200px) {
  .big-letter {
    line-height: 140px;
  }
}

.big-letter-position {
  position: absolute !important;
  left: 8.33333%;
}

.hidden {
  display: none;
}

.position-relative {
  position: relative;
}

.no-padding {
  padding: 0;
}

.mb-4 {
  margin-bottom: 4rem;
}

@media (min-width: 768px) {
  .mb-md-0 {
    margin-bottom: 0;
  }
}

.no-margin {
  margin: 0;
}

.show-scroll>* {
  transform: translateY(10vh) translateZ(0);
  opacity: 0;
}

.lazyload,
.lazyloading {
  opacity: 0;
}

.lazyloaded {
  opacity: 1;
  transition: opacity 300ms;
}

.main_background {
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transform-origin: 100% 0;
  opacity: 0;
  pointer-events: none;
}

.main_background.generic_bg_white,
.main_background.generic_bg_black {
  position: fixed;
}

.main_background.main_background-black {
  background-color: #101010;
}

.main_background.main_background-white {
  background-color: #f4f4f4;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _page.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.page-content {
  position: relative;
  top: 0;
  left: 0;
  right: 0;
  color: #fff;
  z-index: 4;
}

.has-smooth-scroll .page-content {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.page-content[data-background-color="white"] {
  color: #101010;
}

.page-content_inner {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.page-content_wrapper {
  position: relative;
  z-index: 10;
  padding: 30vh 0 0;
  display: flex;
  flex-flow: column;
}

@media (min-width: 1200px) {
  .page-content_wrapper {
    padding: calc(50vh - 128px) 0 0;
  }
}

.page-text-content {
  padding-top: 1vw;
}

.page-text-content hr {
  margin: 3em 0 2em;
  border: none 0;
  border-top: 1px solid #d1d1d1;
}

.page-page .page-text-content {
  padding-top: 2vw;
  padding-bottom: 2vw;
}

.page-overlay {
  position: absolute;
  z-index: 11;
  top: 0;
  right: 0;
  left: 0;
  height: 100%;
  background-color: #101010;
  pointer-events: none;
  opacity: 0;
}

h5,
h2.overtitle,
.title-list li.overtitle,
.overtitle {
  font-weight: normal;
  font-size: .75rem;
  line-height: 1;
  margin-top: 0;
  margin-bottom: 1.5rem;
  font-family: "maison-neue-mono",Helvetica,Arial,sans-serif;
}

.page-text-content ul,
p {
  font-weight: normal;
  font-size: 1rem;
  line-height: 1.5rem;
  margin-top: 0;
}

.page-not-found-content {
  padding-bottom: 10vw;
  padding-top: 10vw;
}

.enquiries {
  max-width: 280px;
  margin: 0 auto 50px;
  text-align: center;
  font-size: 1.25rem;
  line-height: 1.625rem;
}

@media (min-width: 768px) {
  .enquiries {
    margin: 25px auto 4vw;
  }
}

.enquiries a {
  display: inline-block;
}

.enquiries a::after,
.enquiries a::before {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: currentColor;
  height: 2px;
  width: 100%;
  opacity: 1;
  transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1);
}

.enquiries a::after {
  transform-origin: 100% 100%;
}

.enquiries a::before {
  background-color: #D1D1D1;
  transform: scaleX(0);
  transform-origin: 0 0;
}

.enquiries a:hover::after {
  transform: scaleX(0);
}

.enquiries a:hover::before {
  transform: scaleX(1);
}

@media (min-width: 768px) {
  .enquiries {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.scroll-container>section:nth-of-type(2) {
  z-index: 10;
  background-color: #fff;
}

.has-smooth-scroll .scroll-container>section:nth-of-type(2) {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
}

.generic_bg_white,
.generic_bg_black {
  z-index: 3;
}

html {
  height: 100%;
}

body {
  margin: 0;
}

.has-smooth-scroll body {
  height: 100%;
  width: 100%;
  overflow: hidden;
}

.page-content_inner {
  height: 100%;
}

.has-smooth-scroll .page-content {
  height: 100%;
}

.scroll-container {
  position: relative;
  overflow: hidden;
  min-height: 100.1vh;
}

.has-smooth-scroll .scroll-container {
  z-index: 2;
  width: 100%;
  height: 100vh;
}

.has-smooth-scroll .o-scroll {
  height: 100%;
  min-height: 100vh;
  position: relative;
  z-index: 2;
  overflow: hidden;
}

.o-scroll {
  position: relative;
  display: block;
  height: 100%;
  transform: none;
  transition: transform 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) 0.2s,-webkit-transform 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) 0.2s;
}

[data-scrollbar] .scroll-content,
[scrollbar] .scroll-content,
scrollbar .scroll-content {
  overflow: hidden;
  width: 100%;
  min-height: 100%;
  max-width: 100vw;
}

[data-scrollbar] .scrollbar-track-x,
[scrollbar] .scrollbar-track-x,
scrollbar .scrollbar-track-x {
  display: none !important;
}

[data-scrollbar] .scrollbar-track-y,
[scrollbar] .scrollbar-track-y,
scrollbar .scrollbar-track-y {
  top: 0;
  right: 0;
  width: 7px;
  height: 100%;
}

[data-scrollbar] .scrollbar-track,
[scrollbar].scrollbar-track,
scrollbar .scrollbar-track {
  position: absolute;
  opacity: 1;
  z-index: 1;
  transition: opacity 0.5s ease-out, background 0.5s ease-out;
  background: none;
}

body.transitioning [data-scrollbar] .scrollbar-track,
body.transitioning [scrollbar].scrollbar-track,
body.transitioning scrollbar .scrollbar-track {
  opacity: 0;
}

[data-scrollbar] .scrollbar-thumb,
[scrollbar] .scrollbar-thumb,
scrollbar .scrollbar-thumb {
  position: absolute;
  top: 0;
  left: 0;
  width: 7px;
  height: 8px;
  background: rgba(0,0,0,0.2);
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _fade-in.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _fade-out.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

@keyframes fadeOut {
  from {
    opacity: 0.5;
  }

  to {
    opacity: 0;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _nav.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.nav {
  position: fixed;
  z-index: 100;
  padding-top: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  height: 55px;
}

@media (min-width: 576px) {
  .nav {
    left: calc(8.33333% + 15px);
    right: 55px;
  }
}

@media (min-width: 768px) {
  .nav {
    top: 32px;
    pointer-events: none;
  }

  .nav a.active {
    pointer-events: none;
  }
}

@media (max-width: 767.98px) {
  .nav .nav__loading,
  .nav a {
    padding: 15px 0;
  }

  .nav .nav__loading {
    position: absolute;
    top: 0;
    left: 8.33333%;
    opacity: 0;
    pointer-events: none;
    display: block;
    color: currentColor;
  }
}

@media (max-width: 991.98px) {
  .nav .nav__point div,
  .nav .nav__point {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: currentColor;
  }

  .nav .nav__point div {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(2.5);
  }

  .nav .nav__point {
    position: absolute;
    top: 50%;
    left: 4.16667%;
    margin-left: -4px;
    margin-top: -6px;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .nav .nav__point {
    position: absolute;
    top: 12px;
    left: -15px;
  }
}

@media (min-width: 768px) {
  .nav .nav__loading {
    display: none;
  }
}

.nav.nav-white {
  color: #fff;
  opacity: 0;
}

.nav.nav-black {
  color: #101010;
  opacity: 0;
}

.nav__background.nav-white {
  background-color: #101010;
}

.nav__background.nav-black {
  background-color: #fff;
}

.has-smooth-scroll .nav {
  position: absolute;
}

.nav__overlay,
.nav__background-offset,
.nav__background {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 100vh;
}

.nav__background {
  z-index: 99;
  opacity: 0;
  top: calc(-100vh + 55px);
}

@media (min-width: 768px) {
  .nav__background {
    top: calc(-100vh + 80px);
  }
}

.nav__overlay {
  z-index: 97;
  background-color: #101010;
  opacity: 0;
  pointer-events: none;
}

.nav__brand span {
  opacity: 0.5;
  line-height: 1.2;
}

@media (max-width: 767.98px) {
  .nav .mobile-list {
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
  }

  .nav .mobile-list .nav-link-wrapper {
    transform: translateY(10vh);
    opacity: 0;
  }
}

.nav__list {
  display: flex;
  list-style-type: none;
  margin: 0;
  white-space: nowrap;
}

.nav__list li {
  display: flex;
  align-items: flex-end;
  padding-left: 4vw;
}

.ie .nav__list {
  display: block;
}

.ie .nav__list li {
  display: inline-block;
}

.nav__list-main li {
  flex: 1;
}

@media (max-width: 767.98px) {
  .nav__list-main {
    position: absolute;
    top: 30vh;
    left: 8.33333%;
    flex-flow: column;
  }

  .nav__list-main,
  .nav__list-main li {
    margin: 0;
    padding: 0;
  }

  .nav__list-main a {
    font-size: 2.625rem;
    padding: 0;
    margin: 0 0 12px;
  }
}

@media (min-width: 992px) {
  .nav__list-main {
    margin-right: 8.33333%;
  }
}

.nav__lang {
  position: absolute;
  top: 15vh;
  left: 0;
}

.nav__lang li {
  padding-left: 1vw;
}

@media (max-width: 767.98px) {
  .nav__lang {
    left: 8.33333%;
  }

  .nav__lang,
  .nav__lang li {
    margin: 0;
    padding: 0;
  }
}

@media (min-width: 768px) {
  .nav__lang {
    position: relative;
    top: 4px;
  }
}

.nav__lang a {
  position: relative;
  display: block;
  font-size: .75rem;
  line-height: 0.95rem;
  text-transform: capitalize;
  padding: 0 3px;
  margin: 0 3px;
}

@media (min-width: 768px) {
  .nav__lang a {
    margin: 0;
  }
}

.nav__lang a::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  height: 1px;
  background-color: currentColor;
  opacity: 0;
  transition: opacity 0.3s ease-out;
}

.nav__lang a.active::after,
.nav__lang a:hover::after {
  opacity: 1;
}

.nav__mobile-btn {
  border: none;
  margin: 0;
  width: auto;
  overflow: visible;
  background: transparent;
  color: inherit;
  font: inherit;
  line-height: normal;
  -webkit-font-smoothing: inherit;
  -moz-osx-font-smoothing: inherit;
  -webkit-appearance: none;
  position: absolute;
  top: 0;
  right: 0;
  padding: 15px 8.3%;
  margin: 0;
  border: 0;
  background: transparent;
  color: currentColor;
  outline: none;
  display: block;
  font-size: 1rem;
  font-family: "rz-regular","maison-neue-mono",Helvetica,Arial,sans-serif !important;
  outline: 0;
  text-decoration: none;
  font-weight: 100;
  max-height: 55px;
}

@media (min-width: 768px) {
  .nav__mobile-btn {
    display: none !important;
  }
}

.nav__mobile-btn span {
  display: block;
}

.nav__mobile-btn .nav__mobile-label-wrapper {
  position: relative;
}

.nav__mobile-btn .nav__mobile-label-wrapper span:last-child {
  opacity: 0;
}

.nav-item {
  opacity: 0;
}

.nav__mobile-btn,
.nav-link {
  position: relative;
  display: inline-block;
  color: currentColor;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _introduction.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.full-width .introduction_wrapper .row,
.full-width .introduction_wrapper {
  padding: 0;
  margin: 0;
}

.introduction {
  position: relative;
  z-index: 10;
  display: inline-block;
  font-weight: 400;
  transform-origin: 0 0;
  color: currentColor;
  font-size: 26px;
  line-height: 32px;
}

@media (min-width: 320px) {
  .introduction {
    font-size: calc(10.90909vw - 8.90909px);
  }
}

@media (min-width: 375px) {
  .introduction {
    font-size: calc(4.97512vw + 13.34328px);
  }
}

@media (min-width: 576px) {
  .introduction {
    font-size: calc(9.13462vw - 10.61538px);
  }
}

@media (min-width: 992px) {
  .introduction {
    font-size: calc(9.61538vw - 15.38462px);
  }
}

@media (min-width: 1200px) {
  .introduction {
    font-size: calc(8.33333vw + 0px);
  }
}

@media (min-width: 1440px) {
  .introduction {
    font-size: calc(6.25vw + 30px);
  }
}

@media (min-width: 1600px) {
  .introduction {
    font-size: calc(6.25vw + 30px);
  }
}

@media (min-width: 1920px) {
  .introduction {
    font-size: 150px;
  }
}

@media (min-width: 320px) {
  .introduction {
    line-height: calc(14.54545vw - 14.54545px);
  }
}

@media (min-width: 375px) {
  .introduction {
    line-height: calc(2.98507vw + 28.80597px);
  }
}

@media (min-width: 576px) {
  .introduction {
    line-height: calc(8.17308vw - 1.07692px);
  }
}

@media (min-width: 992px) {
  .introduction {
    line-height: calc(9.61538vw - 15.38462px);
  }
}

@media (min-width: 1200px) {
  .introduction {
    line-height: calc(8.33333vw + 0px);
  }
}

@media (min-width: 1440px) {
  .introduction {
    line-height: calc(6.25vw + 30px);
  }
}

@media (min-width: 1600px) {
  .introduction {
    line-height: calc(6.25vw + 30px);
  }
}

@media (min-width: 1920px) {
  .introduction {
    line-height: 150px;
  }
}

.full-width .introduction {
  padding: 0;
  margin: 0;
  flex: 1;
}

.introduction:not(.no-effects) {
  perspective: 1000px;
}

body:not(.ie) .introduction:not(.no-effects) {
  opacity: 0;
}

.introduction:not(.no-effects) * {
  position: relative;
  z-index: 10;
  transform: translateZ(0) rotateX(-10deg) scale(1.0001);
  opacity: 0;
  will-change: transform, opacity;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _image-opener.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.image-opener {
  position: absolute !important;
  top: 0;
  left: 0;
  overflow: hidden;
}

.image-opener picture {
  position: relative;
  display: block;
  height: 100%;
}

.image-opener img {
  width: 100%;
  transition: none;
}

@supports (object-fit: cover) {
  .image-opener img {
    height: 100%;
    object-fit: cover;
  }
}

.image-opener .mask {
  overflow: hidden;
}

.image-opener.texture-1 {
  top: calc(50vh + 80px);
  z-index: 1;
  width: 43vw;
  max-width: 345px;
}

@media (min-width: 576px) {
  .image-opener.texture-1 {
    top: calc(50vh + 18vw);
    width: 36vw;
  }
}

@media (min-width: 992px) {
  .image-opener.texture-1 {
    top: 83vh;
    width: 24vw;
    max-width: 345px;
  }
}

@media (min-width: 1200px) {
  .image-opener.texture-1 {
    max-width: 600px;
  }
}

.image-opener.texture-1,
.image-opener.texture-1 div,
.image-opener.texture-1 img {
  height: 62vw;
}

@media (min-width: 576px) {
  .image-opener.texture-1,
  .image-opener.texture-1 div,
  .image-opener.texture-1 img {
    height: 400px;
  }
}

@media (min-width: 992px) {
  .image-opener.texture-1,
  .image-opener.texture-1 div,
  .image-opener.texture-1 img {
    height: 520px;
  }
}

@media (min-width: 1200px) {
  .image-opener.texture-1,
  .image-opener.texture-1 div,
  .image-opener.texture-1 img {
    height: 35vw;
  }
}

.image-opener.texture-2 {
  top: calc(50vh + 120px);
  z-index: 0;
  width: 70vw;
  left: 8.3vw;
  opacity: 1;
}

@media (min-width: 576px) {
  .image-opener.texture-2 {
    width: 73vw;
    top: 70vh;
  }
}

@media (min-width: 768px) {
  .image-opener.texture-2 {
    top: 80vh;
  }
}

@media (min-width: 992px) {
  .image-opener.texture-2 {
    top: 96vh;
    left: 50%;
    margin-left: -15vw;
    width: 32vw;
    max-width: 600px;
  }
}

.image-opener.texture-2,
.image-opener.texture-2 div,
.image-opener.texture-2 img {
  height: 81vw;
}

@media (min-width: 768px) {
  .image-opener.texture-2,
  .image-opener.texture-2 div,
  .image-opener.texture-2 img {
    min-height: 450px;
    height: 30vw;
  }
}

@media (min-width: 992px) {
  .image-opener.texture-2,
  .image-opener.texture-2 div,
  .image-opener.texture-2 img {
    height: 42vw;
  }
}

.image-opener.texture-3 {
  top: calc(50vh + 50px);
  z-index: 3;
  right: 0;
  left: auto;
  width: 33vw;
}

@media (min-width: 992px) {
  .image-opener.texture-3 {
    top: 65vh;
    left: auto;
    right: 0;
    width: 24vw;
    max-width: 616px;
  }
}

.image-opener.texture-3,
.image-opener.texture-3 div,
.image-opener.texture-3 img {
  height: 210px;
}

@media (min-width: 576px) {
  .image-opener.texture-3,
  .image-opener.texture-3 div,
  .image-opener.texture-3 img {
    min-height: 350px;
    height: 30vw;
    top: 60vh;
  }
}

@media (min-width: 768px) {
  .image-opener.texture-3,
  .image-opener.texture-3 div,
  .image-opener.texture-3 img {
    height: 35vw;
    top: 70vh;
  }
}

.image-opener.contact-1 {
  display: none;
}

@media (min-width: 1200px) {
  .image-opener.contact-1 {
    display: block;
    z-index: 11;
    top: calc(50vh - -72px);
    right: 0;
    bottom: 300px;
    left: auto;
    width: 30vw;
  }

  .image-opener.contact-1 div {
    height: 100%;
  }
}

.image-opener.studio {
  z-index: 2;
  top: -20vh;
}

@media (max-width: 575.98px) {
  .image-opener.studio {
    top: -40vh;
  }
}

@media (min-width: 576px) and (max-width: 767.98px) {
  .image-opener.studio {
    top: -25vh;
  }
}

@media (max-width: 575.98px) {
  .image-opener.studio,
  .image-opener.studio>div,
  .image-opener.studio img {
    width: 100vw;
    height: 40vh;
  }
}

@media (min-width: 576px) and (max-width: 767.98px) {
  .image-opener.studio,
  .image-opener.studio>div,
  .image-opener.studio img {
    width: 40vw;
    max-width: 705px;
    height: 520px;
  }
}

@media (min-width: 768px) {
  .image-opener.studio,
  .image-opener.studio>div,
  .image-opener.studio img {
    width: 44vw;
    max-width: 705px;
    height: 520px;
  }
}

@media (min-width: 992px) {
  .image-opener.studio,
  .image-opener.studio>div,
  .image-opener.studio img {
    width: 50vw;
    max-width: 705px;
    max-height: 100vh;
    height: 900px;
  }
}

@media (min-width: 1200px) {
  .image-opener.studio,
  .image-opener.studio>div,
  .image-opener.studio img {
    width: 40vw;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _project-list.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.project-names {
  position: absolute;
  z-index: 10;
  top: 0;
  left: 30vw;
  right: 30vw;
  display: flex;
  flex-flow: column;
  justify-content: space-evenly;
  height: 100vh;
  padding-left: 15vw;
  opacity: 1;
}

.project-names::before,
.project-names::after {
  content: '';
  display: block;
  width: 1px;
  flex: 1;
  background-color: #D1D1D1;
}

.project-line {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  background-color: #D1D1D1;
  display: none;
}

@media (min-width: 576px) {
  .project-line {
    display: block;
  }
}

.project-info {
  position: relative;
  z-index: 2;
  display: inline-block;
  font-size: 2.5vw;
  line-height: 1.2;
  opacity: 1;
  width: 100%;
  text-align: center;
  margin-top: 2rem;
  margin-bottom: 10rem;
}

@media (min-width: 576px) {
  .project-info {
    position: absolute;
    top: 50%;
    width: 35vw;
    text-align: left;
    margin-top: 0;
    margin-bottom: 0;
  }
}

@media (min-width: 768px) {
  .project-info {
    width: 20vw;
  }
}

.project-info.is-show .project-info_wrapper::before {
  transform: scaleY(1);
}

body.transitioning .project-info.is-show .project-info_wrapper::before {
  transition-delay: 1s;
}

.project-info.is-show .project-info_wrapper .project-info_date,
.project-info.is-show .project-info_wrapper .project-info_name {
  opacity: 1;
  transform: translateY(0) translateZ(0);
  transition-delay: 0.4s;
}

body.transitioning .project-info.is-show .project-info_wrapper .project-info_date,
body.transitioning .project-info.is-show .project-info_wrapper .project-info_name {
  transition-delay: 1.4s;
}

.project-info.is-show .project-info_wrapper .project-info_name {
  transition-delay: 0.47s;
}

body.transitioning .project-info.is-show .project-info_wrapper .project-info_name {
  transition-delay: 1.47s;
}

.project-info_date,
.project-info_name {
  transform: translateY(17px) translateZ(0);
  transition: transform 0.8s cubic-bezier(0.215, 0.61, 0.355, 1),opacity 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
  opacity: 0;
}

.project-info_wrapper {
  position: relative;
}

@media (min-width: 576px) {
  .project-info_wrapper {
    transform: translateY(-50%);
    padding: 1.9vw 0 1.4vw;
  }
}

.project-info_wrapper::before {
  content: '';
  position: absolute;
  z-index: -1;
  bottom: 0;
  width: 1px;
  background-color: #D1D1D1;
  top: calc(100% + 50px);
  height: 56px;
  transition: transform 0.6s cubic-bezier(0.645, 0.045, 0.355, 1);
  transform: scaleY(0);
  transform-origin: 0 0;
}

@media (min-width: 576px) {
  .project-info_wrapper::before {
    top: 0;
    height: auto;
    background-color: #fff;
    transform-origin: 50% 50%;
  }
}

.project-info_wrapper::after {
  content: '';
  position: absolute;
  bottom: -5px;
  right: 0.8vw;
  height: 9px;
  width: 9px;
  border-radius: 50%;
  margin-right: -5px;
  background-color: currentColor;
  transform-origin: 50% 50%;
  transform: scale(0);
  transition: transform 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  display: none;
}

@media (min-width: 768px) {
  .project-info_wrapper::after {
    display: block;
  }
}

.project-info_date {
  margin-bottom: 0.9vw;
}

.project-info_name {
  padding: 0;
  line-height: 1.3;
  font-size: 1.5rem;
  max-width: 266px;
  margin-top: 0.35rem;
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .project-info_name {
    margin: 0;
    font-size: 2.2vw;
    max-width: none;
  }
}

.project-wrapper,
.project-image-link.project {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: auto;
}

@media (min-width: 576px) {
  .project-wrapper,
  .project-image-link.project {
    width: 40.5vw;
    height: 40.5vw;
  }
}

.project-list {
  position: relative;
  display: flex;
  flex-flow: column;
  margin-top: 75px;
}

@media (min-width: 576px) {
  .project-list {
    padding-bottom: 30vh;
  }
}

@media (min-width: 576px) {
  .project-list {
    margin-top: 0;
  }
}

@media (min-width: 992px) {
  .project-list {
    padding-bottom: 15vw;
  }
}

.project-list_title {
  text-align: center;
  position: relative;
}

.project-list_title::after {
  content: '';
  position: relative;
  display: block;
  width: 1px;
  height: 70px;
  margin: 25px auto 0;
  background-color: #D1D1D1;
}

@media (min-width: 768px) {
  .project-list_title::after {
    height: 110px;
  }
}

.project-list_wrapper {
  position: relative;
  z-index: 1;
  width: 100vw;
}

.project-list_item {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  pointer-events: none;
}

@media (min-width: 576px) {
  .project-list_item {
    height: 25vw;
  }
}

.project-list_item a {
  pointer-events: auto;
  display: inline-block;
}

.project-list_item:hover .project-info_wrapper::after {
  transform: scale(1);
}

@media (min-width: 576px) {
  .project-list_item:nth-child(odd) {
    text-align: right;
  }

  .project-list_item:nth-child(odd) .project-info {
    left: 50%;
    margin-left: -0.8vw;
  }

  .project-list_item:nth-child(odd) .project-info_wrapper::before {
    left: 0.8vw;
  }

  .project-list_item:nth-child(odd) .project-info_wrapper::after {
    left: 0.8vw;
    right: auto;
    margin-left: -4px;
  }

  .project-list_item:nth-child(even) .project-info {
    text-align: right;
    right: 50%;
    margin-right: -0.8vw;
  }

  .project-list_item:nth-child(even) .project-info_wrapper::before {
    right: calc(0.8vw - 1px);
  }
}

.project-list .disable {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.project-list .project-image {
  opacity: 0;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _project-item.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.project-image {
  position: relative;
  transform-origin: 0 0;
  width: 100%;
  height: 50vh;
  overflow: hidden;
}

@media (min-width: 576px) {
  .project-list .project-image {
    width: 63vw;
    height: 46vw;
  }
}

@media (min-width: 576px) {
  .project-image {
    width: 63vw;
    height: 46vw;
  }
}

.project-image .project-list-img {
  opacity: 0;
}

.project-image .project-img {
  width: 100%;
}

@supports (object-fit: cover) {
  .project-image .project-img {
    height: 100%;
    object-fit: cover;
  }
}

.project-image_inner-reverse,
.project-image_inner {
  position: relative;
  top: 0;
  right: 0;
  left: 0;
  height: 100%;
  overflow: hidden;
}

@media (min-width: 576px) {
  .project-image_inner-reverse,
  .project-image_inner {
    position: absolute;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _project-next.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.project-next-link {
  position: relative;
  display: block;
  height: calc(50vh + 30px);
}

@media (min-width: 768px) {
  .project-next-link {
    height: 70vh;
  }
}

.project-next-link .project-next_bg {
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  height: calc(50vh + 30px);
  z-index: 1;
  background-color: #101010;
  opacity: 0;
}

@media (min-width: 992px) {
  .project-next-link .project-next_bg {
    height: 70vh;
  }
}

.has-smooth-scroll.transitioning .project-next-link .project-next_bg {
  position: fixed;
}

.project-next-loader {
  position: absolute;
  z-index: 2;
  background-color: #fff;
  top: 0;
  right: 0;
  bottom: 0;
  width: 2px;
  transform: scaleY(0);
  transform-origin: 100% 100%;
  opacity: 0.55;
}

.toggle-next-project {
  display: block;
  height: 1px;
  width: 1px;
}

.project-next {
  display: block;
  position: relative;
  z-index: 2;
  width: 100%;
  height: calc(50vh + 30px);
  padding-top: calc(50vh + 30px);
  color: #fff;
}

@media (min-width: 768px) {
  .project-next {
    height: 70vh;
    padding-top: 70vh;
  }
}

.project-next:not(.clone) {
  overflow: hidden;
}

.project-next__label {
  position: absolute;
  left: 0;
}

.project-next.clone {
  position: absolute;
  z-index: 10;
  bottom: 0;
  left: 0;
  right: 0;
  color: #fff;
}

.has-smooth-scroll .project-next.clone {
  position: absolute;
}

.project-next.clone .introduction::before {
  animation: fadeOut 1s;
  animation-fill-mode: forwards;
}

.project-next .row {
  position: relative;
  transform: translateY(-14vw);
  transform-style: preserve-3d;
}

@media (min-width: 992px) {
  .project-next .row {
    transform: translateY(-16vw);
  }
}

.project-next .introduction::before {
  content: attr(data-next-label);
  position: absolute;
  top: -45px;
  left: 0;
  font-size: .75rem;
  letter-spacing: .0125rem;
  line-height: 1;
  color: #fff;
  opacity: 0.5;
  transition: opacity 1s;
}

@media (max-width: 767.98px) {
  .project-next .introduction::before {
    left: 1rem;
  }
}

.project-next .introduction.white {
  color: #fff;
}

.project-next .introduction.black {
  color: #101010;
  opacity: 0;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _breadcrumb.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.breadcrumb-append {
  position: relative;
  width: 100%;
  flex: 1;
}

.breadcrumb {
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  list-style-type: none;
  padding: 0;
  margin: 0;
}

@media (max-width: 767.98px) {
  .breadcrumb {
    top: 1px;
    margin-left: 8.33333%;
  }
}

.breadcrumb li {
  position: relative;
  display: block;
  padding-left: 0;
}

.breadcrumb li a {
  padding-right: 8px;
}

.breadcrumb li:last-child a {
  pointer-events: none;
}

.breadcrumb li.nav-item-absolute {
  position: absolute;
  left: 19px;
  top: 10px;
  opacity: 0;
}

.breadcrumb li:not(:first-of-type) a span::before {
  position: relative;
  top: -1px;
  content: '\2014';
  padding-right: 10px;
  padding-left: 3px;
}

@media (max-width: 767.98px) {
  .breadcrumb li:nth-child(1) a {
    padding-left: 8px;
  }

  .breadcrumb li:nth-child(3) {
    display: none;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _footer.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.socials a:not(:last-child) {
  margin-right: 1.5rem;
}

.photos-copyright {
  max-width: 150px;
  text-transform: uppercase;
}

@media (max-width: 767.98px) {
  .photos-copyright {
    margin-bottom: 1rem;
  }
}

.footer {
  position: relative;
  z-index: 10;
  background: #fff;
  color: #101010;
  padding-top: 145px;
}

@media (max-width: 767.98px) {
  .footer {
    text-align: center;
  }
}

@media (min-width: 768px) {
  .footer {
    padding-top: 195px;
  }
}

.footer p:not(.footer__label) {
  margin: 0;
}

.footer .big-letter {
  position: relative;
  text-decoration: none;
}

.footer .big-letter::after {
  display: none;
}

@media (max-width: 767.98px) {
  .footer .big-letter {
    font-size: 5rem;
  }
}

@media (min-width: 768px) {
  .footer .big-letter {
    margin-bottom: 20px;
    left: -0.7vw;
  }
}

@media (max-width: 767.98px) {
  .footer p.footer__column:not(:first-child) {
    margin-top: 1rem;
  }
}

@media (max-width: 767.98px) {
  .footer__line {
    flex-flow: column;
  }
}

@media (min-width: 768px) {
  .footer__line {
    margin-bottom: 50px;
  }
}

.footer__content {
  position: relative;
  z-index: 20;
  right: 0;
  bottom: 0;
  left: 0;
  color: #fff;
  padding-top: 70px;
  padding-bottom: 100px;
  overflow: hidden;
  opacity: 1;
}

@media (min-width: 768px) {
  .footer__content {
    padding-top: 120px;
    padding-bottom: 40px;
  }
}

.footer__content-bg {
  position: absolute;
  z-index: 10;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #101010;
}

@media (min-width: 768px) {
  .footer__content-bg {
    right: 16.66667%;
  }
}

.footer__label {
  font-family: "maison-neue-mono",Helvetica,Arial,sans-serif;
  font-size: .75rem;
  opacity: 0.5;
  margin-top: 2rem;
  margin-bottom: 0.5rem;
}

@media (min-width: 768px) {
  .footer__label {
    margin-top: 0;
  }
}

.footer__brand,
.footer__info-container {
  position: relative;
  z-index: 20;
}

@media (max-width: 767.98px) {
  .footer .footer__info-container {
    margin-bottom: 50px;
  }
}

.footer__info {
  width: 100%;
  opacity: 0;
  transform: translateY(40px);
}

@media (max-width: 767.98px) {
  .footer__info .footer__column:not(:last-child) {
    margin-bottom: 15px;
  }
}

.footer__brand p {
  line-height: 1.625rem;
}

@media (max-width: 767.98px) {
  .footer__brand * {
    line-height: 1.625rem;
  }

  .footer__brand .big-letter {
    display: none;
  }
}

.footer__shape {
  position: absolute;
  z-index: 0;
  top: 145px;
  right: 0;
  left: 16.66667%;
  margin-top: -145px;
  background-color: grey;
  background-size: cover;
  opacity: 0;
  transition: opacity 0.3s;
}

.footer__shape.lazyloaded {
  opacity: 1;
}

@media (min-width: 768px) {
  .footer__shape {
    top: 195px;
    margin-top: -195px;
  }
}

.footer__shape canvas {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

@media (max-width: 767.98px) {
  .footer__shape {
    height: 160px;
  }
}

@media (min-width: 768px) {
  .footer__shape {
    left: 37.5%;
    bottom: 160px;
  }
}

.footer__first-line {
  padding-bottom: 60px;
}

@media (min-width: 768px) {
  .footer__first-line {
    padding-bottom: 128px;
  }
}

.footer__second-line {
  position: relative;
  z-index: 10;
  color: #fff;
  font-size: .625rem;
  font-family: "maison-neue-mono",Helvetica,Arial,sans-serif;
  opacity: 0.5;
}

.footer__second-line .footer__line {
  margin-bottom: 0;
}

.footer__second-line .footer__info {
  display: flex;
  align-items: flex-end;
  line-height: 1.3;
}

@media (max-width: 767.98px) {
  .footer__second-line .footer__info {
    justify-content: center;
  }
}

@media (max-width: 767.98px) {
  .footer__second-line>div {
    margin-bottom: 1rem;
  }
}

.footer__nav {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _back-to-top.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.back-to-top {
  position: absolute;
  z-index: 25;
  bottom: 0;
  right: 0;
  cursor: pointer;
}

@media (max-width: 767.98px) {
  .back-to-top {
    left: 0;
    width: 100%;
    color: #fff;
    height: 100px;
  }
}

@media (min-width: 768px) {
  .back-to-top {
    width: 16.66667%;
    height: 160px;
  }
}

.back-to-top__el {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 32px;
  height: 32px;
  padding-top: 4px;
  transform-origin: 50% 50%;
}

.back-to-top__el-top,
.back-to-top__el-bottom {
  content: '';
  position: absolute;
  background-color: currentColor;
}

.back-to-top__el-top {
  height: 2px;
  width: 16px;
  transform: scaleX(0.5);
}

.back-to-top__el-top-left {
  right: 50%;
  transform-origin: 100% 100%;
}

.back-to-top__el-top-right {
  transform-origin: 0% 0%;
  left: 50%;
}

.back-to-top__el-bottom {
  height: 16px;
  width: 2px;
  transform: translateX(-50%);
  transform-origin: 0% 0%;
  left: 50%;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _interactive-scroller.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.interactive-scroller {
  display: none;
}

@media (min-width: 992px) {
  .interactive-scroller {
    display: block;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _share.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.project-share {
  position: absolute;
  z-index: 2;
  top: 1vw;
  right: 3vw;
  width: 30px;
  height: 85px;
  display: none;
}

@media (min-width: 768px) {
  .project-share {
    display: block;
  }
}

.project-share:hover li {
  opacity: 1;
  transform: translateX(0%);
}

.project-share:hover li:nth-child(2) {
  transition-delay: 0.05s;
}

.project-share:hover .project-share__label {
  opacity: 0;
  transform: rotate(-90deg) translateY(-20px);
}

.project-share svg {
  display: block;
  margin: 0 auto;
  padding: 0;
  opacity: 0.5;
}

.project-share ul,
.project-share li {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.project-share ul {
  position: relative;
  right: 0;
  margin-top: 14px;
  text-align: center;
}

.project-share ul li {
  opacity: 0;
  transform: translateX(100%);
  margin-top: 3px;
  font-size: .75rem;
}

.project-share__label,
.project-share ul li {
  transition-property: opacity, transform;
  transition-duration: 0.55s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

.project-share__label {
  position: absolute;
  top: 40px;
  right: -6px;
  display: block;
  margin-top: 5px;
  transform: rotate(-90deg);
  opacity: 1;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _common.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.page-block {
  position: relative;
}

.page-block.layout-white {
  background-color: #fff;
  color: #101010;
}

.page-block.layout-black {
  background-color: #101010;
  color: #fff;
}

.video-block,
.single-fullscreen-image-block,
.alternate-images-block,
.single-image-block {
  overflow: hidden;
}

.video-block iframe,
.video-block img,
.single-fullscreen-image-block iframe,
.single-fullscreen-image-block img,
.alternate-images-block iframe,
.alternate-images-block img,
.single-image-block iframe,
.single-image-block img {
  display: block;
  max-width: none;
  width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}

.video-block iframe,
.single-fullscreen-image-block iframe,
.alternate-images-block iframe,
.single-image-block iframe {
  height: 100%;
}

@supports (object-fit: cover) {
  .video-block img,
  .single-fullscreen-image-block img,
  .alternate-images-block img,
  .single-image-block img {
    object-fit: cover;
    height: 100%;
  }
}

.video-block .iframe-wrapper,
.video-block .img-wrapper,
.single-fullscreen-image-block .iframe-wrapper,
.single-fullscreen-image-block .img-wrapper,
.alternate-images-block .iframe-wrapper,
.alternate-images-block .img-wrapper,
.single-image-block .iframe-wrapper,
.single-image-block .img-wrapper {
  overflow: hidden;
}

.video-block .description,
.single-fullscreen-image-block .description,
.alternate-images-block .description,
.single-image-block .description {
  font-size: .75rem;
  line-height: 1.125rem;
  letter-spacing: .0125rem;
  font-family: "rz-regular","maison-neue-mono",Helvetica,Arial,sans-serif;
  margin-top: 1.125rem;
  margin-bottom: 1.125rem;
  padding-left: 8.33333%;
}

@media (min-width: 768px) {
  .video-block .description,
  .single-fullscreen-image-block .description,
  .alternate-images-block .description,
  .single-image-block .description {
    padding-left: 20%;
  }
}

.no-margin-bottom .alternate-images-block__wrapper,
.no-margin-bottom .video-block__wrapper,
.no-margin-bottom .single-image-block__wrapper {
  padding-bottom: 0 !important;
}

.alternate-images-block__wrapper[data-mode="fullscreen"] .container-fluid,
.alternate-images-block__wrapper[data-mode="fullscreen"] .row,
.alternate-images-block__wrapper[data-mode="fullscreen"] .row>div,
.video-block__wrapper[data-mode="fullscreen"] .container-fluid,
.video-block__wrapper[data-mode="fullscreen"] .row,
.video-block__wrapper[data-mode="fullscreen"] .row>div,
.single-image-block__wrapper[data-mode="fullscreen"] .container-fluid,
.single-image-block__wrapper[data-mode="fullscreen"] .row,
.single-image-block__wrapper[data-mode="fullscreen"] .row>div {
  max-width: none;
  width: 100%;
  padding: 0;
  margin: 0;
  flex: 1;
}

.alternate-images-block__wrapper[data-mode="fullscreen"] img,
.video-block__wrapper[data-mode="fullscreen"] img,
.single-image-block__wrapper[data-mode="fullscreen"] img {
  max-width: none;
  width: 100%;
  height: 100%;
}

.alternate-images-block__wrapper[data-mode="bottom"],
.video-block__wrapper[data-mode="bottom"],
.single-image-block__wrapper[data-mode="bottom"] {
  padding-top: 20vw;
}

@media (min-width: 768px) {
  .alternate-images-block__wrapper[data-mode="bottom"],
  .video-block__wrapper[data-mode="bottom"],
  .single-image-block__wrapper[data-mode="bottom"] {
    padding-top: 10vw;
  }
}

.alternate-images-block__wrapper[data-mode="bottom"] .iframe-wrapper,
.alternate-images-block__wrapper[data-mode="bottom"] .img-wrapper,
.video-block__wrapper[data-mode="bottom"] .iframe-wrapper,
.video-block__wrapper[data-mode="bottom"] .img-wrapper,
.single-image-block__wrapper[data-mode="bottom"] .iframe-wrapper,
.single-image-block__wrapper[data-mode="bottom"] .img-wrapper {
  position: relative;
  height: 0;
}

.alternate-images-block__wrapper[data-mode="normal"],
.video-block__wrapper[data-mode="normal"],
.single-image-block__wrapper[data-mode="normal"] {
  padding-top: 20vw;
  padding-bottom: 20vw;
}

@media (min-width: 768px) {
  .alternate-images-block__wrapper[data-mode="normal"],
  .video-block__wrapper[data-mode="normal"],
  .single-image-block__wrapper[data-mode="normal"] {
    padding-top: 20vw;
    padding-bottom: 20vw;
  }
}

.alternate-images-block__wrapper[data-mode="normal"] .iframe-wrapper,
.alternate-images-block__wrapper[data-mode="normal"] .img-wrapper,
.video-block__wrapper[data-mode="normal"] .iframe-wrapper,
.video-block__wrapper[data-mode="normal"] .img-wrapper,
.single-image-block__wrapper[data-mode="normal"] .iframe-wrapper,
.single-image-block__wrapper[data-mode="normal"] .img-wrapper {
  position: relative;
  height: 0;
}

.cursor {
  position: absolute;
  z-index: 500;
  top: 0;
  left: 0;
  background-color: #101010;
  border-radius: 50%;
  transform-origin: 50% 50%;
  transform: scale(0);
  opacity: 0;
  pointer-events: none;
  display: none;
}

@media (min-width: 992px) {
  .cursor {
    display: block;
  }
}

.cursor div,
.cursor span {
  position: absolute;
  height: 1px;
  width: 17px;
  top: 50%;
  left: 50%;
  margin-left: -8px;
  background-color: #fff;
}

.cursor div {
  transform-origin: 50% 50%;
}

.cursor div:first-of-type {
  transform: rotate(-45deg);
}

.cursor div:last-of-type {
  transform: rotate(45deg);
}

.cursor span {
  transform-origin: 0 0;
  transform: scaleX(0);
}

.cursor span:first-of-type {
  margin-top: -6px;
}

.cursor span:last-of-type {
  margin-top: 6px;
  width: 9px;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _content-block.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.content-block__inner {
  padding: 8vw 0;
}

.content-block__inner[data-background-color="white"] {
  background-color: #fff;
  color: #101010;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _single-image.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.single-image-block img {
  width: 100%;
  height: auto;
}

.single-image-block .box-shadow {
  box-shadow: 0 0 145px 0px rgba(16,16,16,0.05);
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _alternate-images.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.alternate-images-block__wrapper {
  display: flex;
  flex-flow: column;
}

.alternate-images-block .text-wrapper {
  margin-left: calc(8.33333% + 6px);
  margin-right: calc(8.33333% + 6px);
  margin-bottom: 17%;
  padding-top: 8vw;
}

@media (min-width: 992px) {
  .alternate-images-block .text-wrapper {
    width: 50%;
    margin-left: auto;
    margin-right: 0;
    margin-bottom: 0;
  }
}

.alternate-images-block .text {
  max-width: 330px;
  line-height: 1.625rem;
}

.alternate-images-block .img-container {
  width: 100%;
}

@media (min-width: 992px) {
  .alternate-images-block .img-container {
    max-width: 41.66667%;
  }
}

@media (min-width: 992px) {
  .alternate-images-block .img-container:nth-child(odd) {
    align-self: flex-end;
  }
}

.alternate-images-block.layout-white .img-bg {
  background-color: #efefef;
}

.alternate-images-block.layout-black .img-bg {
  background-color: #1b1b1b;
}

.alternate-images-block .img-wrapper {
  overflow: hidden;
}

.alternate-images-block .img-container[data-mode="bottom"] .img-bg {
  padding-left: 8.33333%;
  padding-top: 80px;
  padding-right: 8.33333%;
}

@media (min-width: 768px) {
  .alternate-images-block .img-container[data-mode="bottom"] .img-bg {
    padding-left: 20%;
    padding-top: 20%;
    padding-right: 20%;
  }
}

.alternate-images-block .img-container[data-mode="normal"] .img-bg {
  padding: 8.33333%;
}

@media (min-width: 768px) {
  .alternate-images-block .img-container[data-mode="normal"] .img-bg {
    padding: 20%;
  }
}

.alternate-images-block .img-container[data-mode="fullscreen"] .img-bg {
  background-color: transparent;
}

.alternate-images-block img {
  max-width: none;
  width: 100%;
  height: auto;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _video-block.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.video-block {
  position: relative;
}

.video-block::before {
  content: '';
  position: absolute;
  z-index: 10;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: none;
}

.has-smooth-scroll .video-block::before {
  display: block;
}

.video-block .box-shadow .iframe-wrapper {
  box-shadow: 0 0 145px 0px rgba(16,16,16,0.05);
}

.video-block .vimeo {
  position: absolute;
  top: -0.2%;
  right: 0;
  left: 0;
  bottom: 0;
  height: 100.5%;
  width: 100.5%;
}

.video-block .vimeo iframe {
  opacity: 0;
  animation: fadeIn 1s 0.5s;
  animation-fill-mode: forwards;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _focus-block.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.focus-block {
  position: relative;
  padding-top: 15vw;
  max-width: 100vw;
  overflow: hidden;
}

@media (min-width: 768px) {
  .focus-block {
    padding-top: 20vw;
  }
}

@media (min-width: 992px) {
  .focus-block {
    padding-top: 10vw;
    padding-bottom: 10vw;
  }
}

.focus-block picture {
  display: inline-block;
}

.focus-block img {
  max-width: 100%;
  width: auto;
  height: auto;
  max-height: 80vh;
  transform: none !important;
}

.focus-block .img-container {
  width: 100%;
  max-width: 83.33333%;
  pointer-events: none;
  margin-left: 8.33333%;
  perspective: 1000px;
}

.focus-block .img-container img {
  pointer-events: auto;
}

@media (max-width: 991.98px) {
  .focus-block .img-container {
    margin-top: 50px;
    margin-bottom: 8vw;
  }

  .focus-block .img-container,
  .focus-block .img-container img {
    max-height: 500px;
  }
}

@media (min-width: 768px) {
  .focus-block .img-container {
    height: 80vh;
  }
}

@media (min-width: 992px) {
  .focus-block .img-container {
    height: auto;
    margin-left: 0;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    bottom: 0;
    max-width: 100%;
  }

  .focus-block .img-container .img-3d {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}

.focus-block__content {
  position: relative;
  z-index: 1;
  padding: 0 8.33333%;
}

@media (min-width: 992px) {
  .focus-block__content {
    margin-top: 0;
    left: 50%;
    width: 66.66667%;
    max-width: 932px;
    opacity: 0.1;
    padding: 0;
  }
}

@media (min-width: 992px) {
  .focus-block__content,
  .focus-block__content:hover {
    cursor: none !important;
  }
}

.focus-block__content,
.focus-block__content * {
  font-size: 9vw;
  line-height: 1;
  margin-bottom: 0;
  font-size: 32px;
  line-height: 40px;
}

@media (min-width: 576px) {
  .focus-block__content,
  .focus-block__content * {
    font-size: calc(16.34615vw - 62.15385px);
  }
}

@media (min-width: 992px) {
  .focus-block__content,
  .focus-block__content * {
    font-size: calc(19.23077vw - 90.76923px);
  }
}

@media (min-width: 1200px) {
  .focus-block__content,
  .focus-block__content * {
    font-size: 140px;
  }
}

@media (min-width: 576px) {
  .focus-block__content,
  .focus-block__content * {
    line-height: calc(14.42308vw - 43.07692px);
  }
}

@media (min-width: 992px) {
  .focus-block__content,
  .focus-block__content * {
    line-height: calc(19.23077vw - 90.76923px);
  }
}

@media (min-width: 1200px) {
  .focus-block__content,
  .focus-block__content * {
    line-height: 140px;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _mask-block.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.mask-block {
  position: relative;
  padding: 18.5vw 0;
}

@media (min-width: 768px) {
  .mask-block {
    padding: 12vw 0;
  }
}

@media (min-width: 992px) {
  .mask-block {
    cursor: none !important;
  }
}

@media (max-width: 767.98px) {
  .mask-block {
    text-align: center;
  }

  .mask-block__content {
    margin: 0 auto;
  }
}

.mask-block__content {
  max-width: 360px;
}

.mask-block__circle {
  position: absolute;
  top: 0;
  left: 0;
  width: 92px;
  height: 92px;
  background-color: currentColor;
  mix-blend-mode: difference;
  border-radius: 50%;
  transform: scale(0);
  transform-origin: 50% 50%;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _team.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.team-block {
  padding: 12vw 0;
}

@media (min-width: 1200px) {
  .team-block {
    padding: 8vw 0;
  }
}

.team-block h4 {
  font-size: 1.25rem;
  line-height: 1.625rem;
  margin: 0;
}

@media (min-width: 768px) {
  .team-block h4 {
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.team-block p {
  line-height: 1.625rem;
  margin-bottom: 25px;
}

@media (min-width: 576px) {
  .team-block p {
    margin-bottom: 62px;
  }
}

.client-list {
  text-align: center;
  margin-bottom: 16vw;
}

.client-list .line {
  font-size: 0;
  white-space: nowrap;
  cursor: grab;
  user-select: none;
}

.client-list .line:active {
  cursor: grabbing;
}

.client-list .line ::selection {
  background: none;
}

.client-list .client-name {
  margin: 0 0.32em;
  font-size: 24px;
}

@media (min-width: 576px) {
  .client-list .client-name {
    font-size: 42px;
  }
}

@media (min-width: 768px) {
  .client-list .client-name {
    font-size: 56px;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file .o-bakcground.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.o-background {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-position: center;
  background-size: cover;
  width: 100%;
}

@supports (object-fit: cover) {
  .o-background {
    height: 100%;
    object-fit: cover;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _homepage.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.home-socials {
  position: absolute;
  z-index: 20;
  top: calc(50vh - 82px);
  right: 55px;
  color: currentColor;
  display: none;
}

@media (min-width: 768px) {
  .home-socials {
    display: block;
  }
}

.home-socials ul,
.home-socials li {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.home-socials ul {
  margin-left: auto;
}

.home-socials li {
  text-align: center;
}

.home-socials a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  font-size: .75rem;
}

.home-socials__point {
  position: absolute;
  top: 14px;
  left: -19px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: currentColor;
  transform: scale(0);
}

.home-page .page-text-content {
  padding-top: calc(100vw + 33vh);
  padding-bottom: 10vh;
  margin-bottom: 10vh;
}

@media (min-width: 768px) {
  .home-page .page-text-content {
    padding-top: calc(45vw + 70vh);
    margin-bottom: 10vw;
  }
}

@media (min-width: 992px) {
  .home-page .page-text-content {
    padding-top: calc(30vw + 100vh);
  }
}

.home-page .introduction_wrapper {
  position: relative;
}

.home-page .introduction_wrapper>.row {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.home-page .home-images {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}

.home-page .page-content_wrapper {
  max-width: 100vw;
  overflow: hidden;
}

.home-page .project-list {
  margin-top: 0;
}

.home-page .introduction.offset-1 {
  margin-left: 8.33333%;
  margin-right: 8.33333%;
}

@media (min-width: 768px) {
  .home-page .introduction.offset-1 {
    margin-right: 0;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _project-page.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

@media (min-width: 576px) {
  *[data-align="right"].project-next.clone .introduction,
  *[data-align="right"] .project-next:not(.clone) .introduction {
    margin-right: 0 8.33333%;
    margin-left: 41.66667%;
  }
}

@media (min-width: 576px) {
  *[data-align="left"].project-next.clone .introduction,
  *[data-align="left"] .project-next:not(.clone) .introduction {
    margin-right: 0 8.33333%;
    margin-left: 12.5%;
  }
}

.project-next .introduction.black,
.project-page .introduction.black {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: auto;
}

@media (min-width: 576px) {
  .project-next .introduction,
  .project-page .introduction {
    width: 100%;
    max-width: 60vw;
  }
}

@media (min-width: 768px) {
  .project-next .introduction,
  .project-page .introduction {
    max-width: 1100px;
  }
}

.project-next>.row,
.project-page .introduction_wrapper>.row {
  margin: 0;
}

.project-next.clone .introduction {
  margin: 0;
  padding: 0;
}

@media (max-width: 575.98px) {
  .project-next.clone .introduction {
    padding-left: 8.33333%;
    padding-right: 8.33333%;
  }
}

.project-page-bg {
  position: absolute;
  z-index: 0;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.project-page {
  color: #fff;
}

.project-page .introduction {
  margin: 0;
  padding: 0;
}

@media (max-width: 575.98px) {
  .project-page .introduction {
    padding-left: 8.33333%;
    padding-right: 8.33333%;
  }
}

.project-page[data-align="right"] .image-append {
  display: flex;
  justify-content: flex-end;
}

@media (min-width: 576px) {
  .project-page[data-align="right"] .introduction_wrapper .introduction {
    margin-left: 8.33333%;
  }
}

@media (min-width: 768px) {
  .project-page[data-align="right"] .introduction_wrapper .introduction {
    margin-left: 12.5%;
  }
}

@media (min-width: 576px) {
  .project-page[data-align="left"] .introduction_wrapper .introduction {
    margin-left: 41.66667%;
  }
}

.project-page .first-title-offset {
  position: relative;
  left: -4px;
}

.project-page .introduction_wrapper {
  position: relative;
}

.project-page .introduction_wrapper>.row {
  margin: 0;
}

@media (max-width: 575.98px) {
  .project-page .introduction_wrapper {
    margin-bottom: 2vh;
  }
}

@media (min-width: 576px) {
  .project-page .introduction_wrapper {
    min-height: calc(43vw - 4vh);
  }
}

.project-page .image-append {
  position: absolute;
  top: 55px;
  left: 0;
  right: 0;
}

@media (min-width: 576px) {
  .project-page .image-append {
    top: 17vh;
  }
}

.project-page .back-to-top {
  color: #fff;
}

@media (max-width: 767.98px) {
  .project-page .back-to-top {
    display: none;
  }
}

.project-page .projects-images {
  margin-top: 20vh;
  overflow: hidden;
}

.project-page .projects-images .col-10 {
  display: flex;
  flex-flow: column;
}

.project-page .projects-images .section {
  opacity: 1;
}

.project-page .projects-images .white-section {
  background-color: #fff;
}

@media (min-width: 768px) {
  .project-page img:not(.project-image_background) {
    transform: translateY(70px) translateZ(0);
    transform-origin: 50% 0;
  }
}

.project-page .page-text-content {
  z-index: 2;
  margin-bottom: 8vw;
}

.project-page .page-content_wrapper p {
  line-height: 1.625rem;
}

@media (max-width: 575.98px) {
  .project-page .page-content_wrapper {
    padding: calc(50vh + 30px) 0 0 0;
  }
}

.project-page .project-image:not(.clone) {
  opacity: 0;
}

.project-page .project-image:not(.clone) img {
  transform: none;
  opacity: 1;
}

.project-page .project-image:not(.clone) .project-image_inner-reverse,
.project-page .project-image:not(.clone) .project-image_inner {
  transform-style: preserve-3d;
  transform-origin: 0 0;
}

.project-page .project-image:not(.clone) .project-image_inner {
  transform: translateY(-100%);
}

.project-page .project-image:not(.clone) .project-image_inner-reverse {
  transform: translateY(100%);
}

.project-page .external-link {
  display: flex;
  align-items: center;
  font-size: .75rem;
  letter-spacing: .0125rem;
  list-style: 1.125rem;
}

.project-page .external-link svg {
  width: 32px;
  height: 32px;
}

.project-page .external-link span {
  opacity: 0.5;
  transition: opacity 0.3s;
}

.project-page .external-link:hover span {
  opacity: 1;
}

@media (max-width: 767.98px) {
  .project-page .project-list-wrapper {
    display: flex;
    flex-wrap: wrap;
  }

  .project-page .project-list-wrapper .first-title-offset {
    width: 100%;
  }
}

.project-page .project-list {
  position: relative;
  list-style-type: none;
  margin: 0 0 75px;
  padding: 0;
  width: 50%;
}

@media (min-width: 768px) {
  .project-page .project-list {
    width: 100%;
  }
}

.project-page .project-list::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: -40px;
  left: 0;
  width: 1px;
  background-color: currentColor;
  opacity: 0.15;
}

.project-page .project-list li {
  font-size: .75rem;
  line-height: 1.5;
  letter-spacing: .0125rem;
  padding-left: 13px;
  opacity: 0.5;
  transition: opacity 0.3s;
}

.project-page .project-list li.has-link {
  pointer-events: none;
}

.project-page .project-list li.has-link a {
  pointer-events: auto;
}

.project-page .project-list li.has-link:hover {
  opacity: 1;
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _projects-page.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

@media (min-width: 768px) {
  .projects-page .page-content-wrapper {
    display: none;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _contact-page.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

.page-content.contact .page-text-content>div {
  max-width: 450px;
}

@media (max-width: 575.98px) {
  .page-content.contact .page-text-content>div {
    margin-top: 50px;
    text-align: center;
  }
}

.page-content.contact .footer-content .footer__second-line,
.page-content.contact .footer-content .footer__content-bg,
.page-content.contact .footer-content .footer__brand {
  display: none;
}

.page-content.contact .footer-content .footer__content .big-letter {
  display: none;
}

.page-content.contact .footer-content .footer__content {
  color: currentColor;
  padding-top: 0;
}

@media (max-width: 575.98px) {
  .page-content.contact .footer-content .footer__content {
    padding-bottom: 0;
  }

  .page-content.contact .footer-content .footer__content .footer__label {
    margin-top: 1rem;
  }
}

@media (min-width: 768px) {
  .page-content.contact .footer-content .footer__info-container {
    margin-left: 33.33333%;
  }
}

.page-content.contact .footer {
  padding-top: 0;
}

.page-content.contact .footer>div {
  background-color: #101010;
  color: #fff;
  padding-bottom: 40px;
  padding-top: 120px;
}

@media (min-width: 768px) {
  .page-content.contact .footer>div {
    padding-top: 190px;
  }
}

.page-content.contact .footer .footer__first-line {
  padding-bottom: 60px;
}

@media (min-width: 768px) {
  .page-content.contact .footer .footer__first-line {
    padding-bottom: 100px;
  }
}

@media (min-width: 768px) {
  .page-content.contact .footer .footer__second-line {
    margin-left: 33.33333%;
    width: 33.33333%;
  }
}

/*!
 * Copyright © 2018, Rezo Zero
 *
 * @file _studio.scss
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */

body.studio .reduce-padding-top {
  padding-top: 2vw;
}

@media (min-width: 1200px) {
  body.studio .reduce-padding-top {
    padding-top: 0;
  }
}

/* unused harmony export Draggable */
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return Draggable; });
/* harmony import */ var _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(1);
/* harmony import */ var _CSSPlugin_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(17);
/*!
 * VERSION: 0.16.5
 * DATE: 2018-08-27
 * UPDATES AND DOCS AT: http://greensock.com
 *
 * Requires TweenLite and CSSPlugin version 1.17.0 or later (TweenMax contains both TweenLite and CSSPlugin). ThrowPropsPlugin is required for momentum-based continuation of movement after the mouse/touch is released (ThrowPropsPlugin is a membership benefit of Club GreenSock - http://greensock.com/club/).
 *
 * @license Copyright (c) 2008-2018, GreenSock. All rights reserved.
 * This work is subject to the terms at http://greensock.com/standard-license or for
 * Club GreenSock members, the software agreement that was issued with your membership.
 *
 * @author: Jack Doyle, jack@greensock.com
 */




	_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* _gsScope */ "j"]._gsDefine("utils.Draggable", ["events.EventDispatcher","TweenLite","plugins.CSSPlugin"], function() {

		var _tempVarsXY = {css:{}, data:"_draggable"}, //speed optimization - we reuse the same vars object for x/y TweenLite.set() calls to minimize garbage collection tasks and improve performance.
			_tempVarsX = {css:{}, data:"_draggable"},
			_tempVarsY = {css:{}, data:"_draggable"},
			_tempVarsRotation = {css:{}},
			_globals = _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* _gsScope */ "j"]._gsDefine.globals,
			_tempEvent = {}, //for populating with pageX/pageY in old versions of IE
			_emptyFunc = function() { return false; },
			_dummyElement = {style:{}, appendChild:_emptyFunc, removeChild:_emptyFunc},
			_doc = _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* _gsScope */ "j"].document || {createElement: function() {return _dummyElement;}},
			_docElement = _doc.documentElement || {},
			_createElement = function(type) {
				return _doc.createElementNS ? _doc.createElementNS("http://www.w3.org/1999/xhtml", type) : _doc.createElement(type);
			},
			_tempDiv = _createElement("div"),
			_emptyArray = [],
			_RAD2DEG = 180 / Math.PI,
			_max = 999999999999999,
			_getTime = Date.now || function() {return new Date().getTime();},
			_isOldIE = !!(!_doc.addEventListener && _doc.all),
			_placeholderDiv = _doc.createElement("div"),
			_renderQueue = [],
			_lookup = {}, //when a Draggable is created, the target gets a unique _gsDragID property that allows gets associated with the Draggable instance for quick lookups in Draggable.get(). This avoids circular references that could cause gc problems.
			_lookupCount = 0,
			_clickableTagExp = /^(?:a|input|textarea|button|select)$/i,
			_dragCount = 0, //total number of elements currently being dragged
			_prefix,
			_isMultiTouching,
			_isAndroid = (_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* _gsScope */ "j"].navigator && _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* _gsScope */ "j"].navigator.userAgent.toLowerCase().indexOf("android") !== -1), //Android handles touch events in an odd way and it's virtually impossible to "feature test" so we resort to UA sniffing
			_lastDragTime = 0,
			_temp1 = {}, // a simple object we reuse and populate (usually x/y properties) to conserve memory and improve performance.
			_windowProxy = {}, //memory/performance optimization - we reuse this object during autoScroll to store window-related bounds/offsets.
			_slice = function(a) { //don't use Array.prototype.slice.call(target, 0) because that doesn't work in IE8 with a NodeList that's returned by querySelectorAll()
				if (typeof(a) === "string") {
					a = _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].selector(a);
				}
				if (!a || a.nodeType) { //if it's not an array, wrap it in one.
					return [a];
				}
				var b = [],
					l = a.length,
					i;
				for (i = 0; i !== l; b.push(a[i++]));
				return b;
			},
			_copy = function(obj, factor) {
				var copy = {}, p;
				if (factor) {
					for (p in obj) {
						copy[p] = obj[p] * factor;
					}
				} else {
					for (p in obj) {
						copy[p] = obj[p];
					}
				}
				return copy;
			},
			ThrowPropsPlugin,

			_renderQueueTick = function() {
				var i = _renderQueue.length;
				while (--i > -1) {
					_renderQueue[i]();
				}
			},
			_addToRenderQueue = function(func) {
				_renderQueue.push(func);
				if (_renderQueue.length === 1) {
					_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].ticker.addEventListener("tick", _renderQueueTick, this, false, 1);
				}
			},
			_removeFromRenderQueue = function(func) {
				var i = _renderQueue.length;
				while (--i > -1) {
					if (_renderQueue[i] === func) {
						_renderQueue.splice(i, 1);
					}
				}
				_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].to(_renderQueueTimeout, 0, {overwrite:"all", delay:15, onComplete:_renderQueueTimeout, data:"_draggable"}); //remove the "tick" listener only after the render queue is empty for 15 seconds (to improve performance). Adding/removing it constantly for every click/touch wouldn't deliver optimal speed, and we also don't want the ticker to keep calling the render method when things are idle for long periods of time (we want to improve battery life on mobile devices).
			},
			_renderQueueTimeout = function() {
				if (!_renderQueue.length) {
					_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].ticker.removeEventListener("tick", _renderQueueTick);
				}
			},

			_extend = function(obj, defaults) {
				var p;
				for (p in defaults) {
					if (obj[p] === undefined) {
						obj[p] = defaults[p];
					}
				}
				return obj;
			},
			_getDocScrollTop = function() {
				return (window.pageYOffset != null) ? window.pageYOffset : (_doc.scrollTop != null) ? _doc.scrollTop : _docElement.scrollTop || _doc.body.scrollTop || 0;
			},
			_getDocScrollLeft = function() {
				return (window.pageXOffset != null) ? window.pageXOffset : (_doc.scrollLeft != null) ? _doc.scrollLeft : _docElement.scrollLeft || _doc.body.scrollLeft || 0;
			},
			_addScrollListener = function(e, callback) {
				_addListener(e, "scroll", callback);
				if (!_isRoot(e.parentNode)) {
					_addScrollListener(e.parentNode, callback);
				}
			},
			_removeScrollListener = function(e, callback) {
				_removeListener(e, "scroll", callback);
				if (!_isRoot(e.parentNode)) {
					_removeScrollListener(e.parentNode, callback);
				}
			},
			_isRoot = function (e) {
				return !!(!e || e === _docElement || e === _doc || e === _doc.body || e === window || !e.nodeType || !e.parentNode);
			},
			_getMaxScroll = function(element, axis) {
				var dim = (axis === "x") ? "Width" : "Height",
					scroll = "scroll" + dim,
					client = "client" + dim,
					body = _doc.body;
				return Math.max(0, _isRoot(element) ? Math.max(_docElement[scroll], body[scroll]) - (window["inner" + dim] || _docElement[client] || body[client]) : element[scroll] - element[client]);
			},
			_recordMaxScrolls = function(e) { //records _gsMaxScrollX and _gsMaxScrollY properties for the element and all ancestors up the chain so that we can cap it, otherwise dragging beyond the edges with autoScroll on can endlessly scroll.
				var isRoot = _isRoot(e),
					x = _getMaxScroll(e, "x"),
					y = _getMaxScroll(e, "y");
				if (isRoot) {
					e = _windowProxy;
				} else {
					_recordMaxScrolls(e.parentNode);
				}
				e._gsMaxScrollX = x;
				e._gsMaxScrollY = y;
				e._gsScrollX = e.scrollLeft || 0;
				e._gsScrollY = e.scrollTop || 0;
			},

			//just used for IE8 and earlier to normalize events and populate pageX/pageY
			_populateIEEvent = function(e, preventDefault) {
				e = e || window.event;
				_tempEvent.pageX = e.clientX + _doc.body.scrollLeft + _docElement.scrollLeft;
				_tempEvent.pageY = e.clientY + _doc.body.scrollTop + _docElement.scrollTop;
				if (preventDefault) {
					e.returnValue = false;
				}
				return _tempEvent;
			},

			//grabs the first element it finds (and we include the window as an element), so if it's selector text, it'll feed that value to TweenLite.selector, if it's a jQuery object or some other selector engine's result, it'll grab the first one, and same for an array. If the value doesn't contain a DOM element, it'll just return null.
			_unwrapElement = function(value) {
				if (!value) {
					return value;
				}
				if (typeof(value) === "string") {
					value = _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].selector(value);
				}
				if (value.length && value !== window && value[0] && value[0].style && !value.nodeType) {
					value = value[0];
				}
				return (value === window || (value.nodeType && value.style)) ? value : null;
			},

			_checkPrefix = function(e, p) {
				var s = e.style,
					capped, i, a;
				if (s[p] === undefined) {
					a = ["O","Moz","ms","Ms","Webkit"];
					i = 5;
					capped = p.charAt(0).toUpperCase() + p.substr(1);
					while (--i > -1 && s[a[i]+capped] === undefined) { }
					if (i < 0) {
						return "";
					}
					_prefix = (i === 3) ? "ms" : a[i];
					p = _prefix + capped;
				}
				return p;
			},

			_setStyle = function(e, p, value) {
				var s = e.style;
				if (!s) {
					return;
				}
				if (s[p] === undefined) {
					p = _checkPrefix(e, p);
				}
				if (value == null) {
					if (s.removeProperty) {
						s.removeProperty(p.replace(/([A-Z])/g, "-$1").toLowerCase());
					} else { //note: old versions of IE use "removeAttribute()" instead of "removeProperty()"
						s.removeAttribute(p);
					}
				} else if (s[p] !== undefined) {
					s[p] = value;
				}
			},

			_getCSFunc = (typeof(window) !== "undefined" ? window : _doc.defaultView || {getComputedStyle:function() {}}).getComputedStyle,
			_getComputedStyle = function(e, s) {
				return _getCSFunc((e instanceof Element) ? e : e.host || (e.parentNode || {}).host || e, s); //the "host" stuff helps to accommodate ShadowDom objects.
			},
			_horizExp = /(?:Left|Right|Width)/i,
			_suffixExp = /(?:\d|\-|\+|=|#|\.)*/g,
			_convertToPixels = function(t, p, v, sfx, recurse) {
				if (sfx === "px" || !sfx) { return v; }
				if (sfx === "auto" || !v) { return 0; }
				var horiz = _horizExp.test(p),
					node = t,
					style = _tempDiv.style,
					neg = (v < 0),
					pix;
				if (neg) {
					v = -v;
				}
				if (sfx === "%" && p.indexOf("border") !== -1) {
					pix = (v / 100) * (horiz ? t.clientWidth : t.clientHeight);
				} else {
					style.cssText = "border:0 solid red;position:" + _getStyle(t, "position", true) + ";line-height:0;";
					if (sfx === "%" || !node.appendChild) {
						node = t.parentNode || _doc.body;
						style[(horiz ? "width" : "height")] = v + sfx;
					} else {
						style[(horiz ? "borderLeftWidth" : "borderTopWidth")] = v + sfx;
					}
					node.appendChild(_tempDiv);
					pix = parseFloat(_tempDiv[(horiz ? "offsetWidth" : "offsetHeight")]);
					node.removeChild(_tempDiv);
					if (pix === 0 && !recurse) {
						pix = _convertToPixels(t, p, v, sfx, true);
					}
				}
				return neg ? -pix : pix;
			},
			_calculateOffset = function(t, p) { //for figuring out "top" or "left" in px when it's "auto". We need to factor in margin with the offsetLeft/offsetTop
				if (_getStyle(t, "position", true) !== "absolute") { return 0; }
				var dim = ((p === "left") ? "Left" : "Top"),
					v = _getStyle(t, "margin" + dim, true);
				return t["offset" + dim] - (_convertToPixels(t, p, parseFloat(v), (v + "").replace(_suffixExp, "")) || 0);
			},

			_getStyle = function(element, prop, keepUnits) {
				var rv = (element._gsTransform || {})[prop],
					cs;
				if (rv || rv === 0) {
					return rv;
				} else if (element.style && element.style[prop]) { //shadow dom elements don't have "style".
					rv = element.style[prop];
				} else if ((cs = _getComputedStyle(element))) {
					rv = cs.getPropertyValue(prop.replace(/([A-Z])/g, "-$1").toLowerCase());
					rv = (rv || cs.length) ? rv : cs[prop]; //Opera behaves VERY strangely - length is usually 0 and cs[prop] is the only way to get accurate results EXCEPT when checking for -o-transform which only works with cs.getPropertyValue()!
				} else if (element.currentStyle) {
					rv = element.currentStyle[prop];
				}
				if (rv === "auto" && (prop === "top" || prop === "left")) {
					rv = _calculateOffset(element, prop);
				}
				return keepUnits ? rv : parseFloat(rv) || 0;
			},

			_dispatchEvent = function(instance, type, callbackName) {
				var vars = instance.vars,
					callback = vars[callbackName],
					listeners = instance._listeners[type];
				if (typeof(callback) === "function") {
					callback.apply(vars[callbackName + "Scope"] || vars.callbackScope || instance, vars[callbackName + "Params"] || [instance.pointerEvent]);
				}
				if (listeners) {
					instance.dispatchEvent(type);
				}
			},
			_getBounds = function(obj, context) { //accepts any of the following: a DOM element, jQuery object, selector text, or an object defining bounds as {top, left, width, height} or {minX, maxX, minY, maxY}. Returns an object with left, top, width, and height properties.
				var e = _unwrapElement(obj),
					top, left, offset;
				if (!e) {
					if (obj.left !== undefined) {
						offset = _getOffsetTransformOrigin(context); //the bounds should be relative to the origin
						return {left: obj.left - offset.x, top: obj.top - offset.y, width: obj.width, height: obj.height};
					}
					left = obj.min || obj.minX || obj.minRotation || 0;
					top = obj.min || obj.minY || 0;
					return {left:left, top:top, width:(obj.max || obj.maxX || obj.maxRotation || 0) - left, height:(obj.max || obj.maxY || 0) - top};
				}
				return _getElementBounds(e, context);
			},

			_svgBorderFactor,
			_svgBorderScales,
			_svgScrollOffset,
			_hasBorderBug,
			_hasReparentBug,//some browsers, like Chrome 49, alter the offsetTop/offsetLeft/offsetParent of elements when a non-identity transform is applied.
			_setEnvironmentVariables = function() { //some browsers factor the border into the SVG coordinate space, some don't (like Firefox). Some apply transforms to them, some don't. We feature-detect here so we know how to handle the border(s). We can't do this immediately - we must wait for the document.body to exist.
				if (!_doc.createElementNS) {
					_svgBorderFactor = 0;
					_svgBorderScales = false;
					return;
				}
				var div = _createElement("div"),
					svg = _doc.createElementNS("http://www.w3.org/2000/svg", "svg"),
					wrapper = _createElement("div"),
					style = div.style,
					parent = _doc.body || _docElement,
					isFlex = (_getStyle(parent, "display", true) === "flex"), //Firefox bug causes getScreenCTM() to return null when parent is display:flex and the element isn't rendered inside the window (like if it's below the scroll position)
					matrix, e1, point, oldValue;
				if (_doc.body && _transformProp) {
					style.position = "absolute";
					parent.appendChild(wrapper);
					wrapper.appendChild(div);
					oldValue = div.offsetParent;
					wrapper.style[_transformProp] = "rotate(1deg)";
					_hasReparentBug = (div.offsetParent === oldValue);
					wrapper.style.position = "absolute";
					style.height = "10px";
					oldValue = div.offsetTop;
					wrapper.style.border = "5px solid red";
					_hasBorderBug = (oldValue !== div.offsetTop); //some browsers, like Firefox 38, cause the offsetTop/Left to be affected by a parent's border.
					parent.removeChild(wrapper);
				}
				style = svg.style;
				svg.setAttributeNS(null, "width", "400px");
				svg.setAttributeNS(null, "height", "400px");
				svg.setAttributeNS(null, "viewBox", "0 0 400 400");
				style.display = "block";
				style.boxSizing = "border-box";
				style.border = "0px solid red";
				style.transform = "none";
				// in some browsers (like certain flavors of Android), the getScreenCTM() matrix is contaminated by the scroll position. We can run some logic here to detect that condition, but we ended up not needing this because we found another workaround using getBoundingClientRect().
				div.style.cssText = "width:100px;height:100px;overflow:scroll;-ms-overflow-style:none;";
				parent.appendChild(div);
				div.appendChild(svg);
				point = svg.createSVGPoint().matrixTransform(svg.getScreenCTM());
				e1 = point.y;
				div.scrollTop = 100;
				point.x = point.y = 0;
				point = point.matrixTransform(svg.getScreenCTM());
				_svgScrollOffset = (e1 - point.y < 100.1) ? 0 : e1 - point.y - 150;
				div.removeChild(svg);
				parent.removeChild(div);
				// -- end _svgScrollOffset calculation.
				parent.appendChild(svg);
				if (isFlex) {
					parent.style.display = "block"; //Firefox bug causes getScreenCTM() to return null when parent is display:flex and the element isn't rendered inside the window (like if it's below the scroll position)
				}
				matrix = svg.getScreenCTM();
				e1 = matrix.e;
				style.border = "50px solid red";
				matrix = svg.getScreenCTM();
				if (e1 === 0 && matrix.e === 0 && matrix.f === 0 && matrix.a === 1) { //Opera has a bunch of bugs - it doesn't adjust the x/y of the matrix, nor does it scale when box-sizing is border-box but it does so elsewhere; to get the correct behavior we set _svgBorderScales to true.
					_svgBorderFactor = 1;
					_svgBorderScales = true;
				} else {
					_svgBorderFactor = (e1 !== matrix.e) ? 1 : 0;
					_svgBorderScales = (matrix.a !== 1);
				}
				if (isFlex) {
					parent.style.display = "flex";
				}
				parent.removeChild(svg);
			},

			_supports3D = (_checkPrefix(_tempDiv, "perspective") !== ""),

			// start matrix and point conversion methods...
			_transformOriginProp = _checkPrefix(_tempDiv, "transformOrigin").replace(/^ms/g, "Ms").replace(/([A-Z])/g, "-$1").toLowerCase(),
			_transformProp = _checkPrefix(_tempDiv, "transform"),
			_transformPropCSS = _transformProp.replace(/^ms/g, "Ms").replace(/([A-Z])/g, "-$1").toLowerCase(),
			_point1 = {}, //we reuse _point1 and _point2 objects inside matrix and point conversion methods to conserve memory and minimize garbage collection tasks.
			_point2 = {},
			_SVGElement = _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* _gsScope */ "j"].SVGElement,
			_isSVG = function(e) {
				return !!(_SVGElement && typeof(e.getBBox) === "function" && e.getCTM && (!e.parentNode || (e.parentNode.getBBox && e.parentNode.getCTM)));
			},
			_isIE10orBelow = (_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* _gsScope */ "j"].navigator && (((/MSIE ([0-9]{1,}[\.0-9]{0,})/).exec(_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* _gsScope */ "j"].navigator.userAgent) || (/Trident\/.*rv:([0-9]{1,}[\.0-9]{0,})/).exec(_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* _gsScope */ "j"].navigator.userAgent)) && parseFloat( RegExp.$1 ) < 11)), //Ideally we'd avoid user agent sniffing, but there doesn't seem to be a way to feature-detect and sense a border-related bug that only affects IE10 and IE9.
			_tempTransforms = [],
			_tempElements = [],
			_getSVGOffsets = function(e) { //SVG elements don't always report offsetTop/offsetLeft/offsetParent at all (I'm looking at you, Firefox 29 and Android), so we have to do some work to manufacture those values. You can pass any SVG element and it'll spit back an object with offsetTop, offsetLeft, offsetParent, scaleX, and scaleY properties. We need the scaleX and scaleY to handle the way SVG can resize itself based on the container.
				if (!e.getBoundingClientRect || !e.parentNode || !_transformProp) {
					return {offsetTop:0, offsetLeft:0, scaleX:1, scaleY:1, offsetParent:_docElement};
				}
				if (Draggable.cacheSVGData !== false && e._dCache && e._dCache.lastUpdate === _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].ticker.frame) { //performance optimization. Assume that if the offsets are requested again on the same tick, we can just feed back the values we already calculated (no need to keep recalculating until another tick elapses).
					return e._dCache;
				}
				var curElement = e,
					cache = _cache(e),
					eRect, parentRect, offsetParent, cs, m, i, point1, point2, borderWidth, borderHeight, width, height;
				cache.lastUpdate = _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].ticker.frame;
				if (e.getBBox && !cache.isSVGRoot) { //if it's a nested/child SVG element, we must find the parent SVG canvas and measure the offset from there.
					curElement = e.parentNode;
					eRect = e.getBBox();
					while (curElement && (curElement.nodeName + "").toLowerCase() !== "svg") {
						curElement = curElement.parentNode;
					}
					cs = _getSVGOffsets(curElement);
					cache.offsetTop = eRect.y * cs.scaleY;
					cache.offsetLeft = eRect.x * cs.scaleX;
					cache.scaleX = cs.scaleX;
					cache.scaleY = cs.scaleY;
					cache.offsetParent = curElement || _docElement;
					return cache;
				}
				//only root SVG elements continue here...
				offsetParent = cache.offsetParent;
				if (offsetParent === _doc.body) {
					offsetParent = _docElement; //avoids problems with margins/padding on the body
				}
				//walk up the ancestors and record any non-identity transforms (and reset them to "none") until we reach the offsetParent. We must do this so that the getBoundingClientRect() is accurate for measuring the offsetTop/offsetLeft. We'll revert the values later...
				_tempElements.length = _tempTransforms.length = 0;
				while (curElement) {
					m = _getStyle(curElement, _transformProp, true);
					if (m !== "matrix(1, 0, 0, 1, 0, 0)" && m !== "none" && m !== "translate3d(0px, 0px, 0px)") {
						_tempElements.push(curElement);
						_tempTransforms.push(curElement.style[_transformProp]);
						curElement.style[_transformProp] = "none";
					}
					if (curElement === offsetParent) {
						break;
					}
					curElement = curElement.parentNode;
				}
				parentRect = offsetParent.getBoundingClientRect();
				m = e.getScreenCTM();

				point2 = e.createSVGPoint();
				point1 = point2.matrixTransform(m);
				cache.scaleX = Math.sqrt(m.a * m.a + m.b * m.b);
				cache.scaleY = Math.sqrt(m.d * m.d + m.c * m.c);
				if (_svgBorderFactor === undefined) {
					_setEnvironmentVariables();
				}
				if (cache.borderBox && !_svgBorderScales && e.getAttribute("width")) { //some browsers (like Safari) don't properly scale the matrix to accommodate the border when box-sizing is border-box, so we must calculate it here...
					cs = _getComputedStyle(e) || {};
					borderWidth = (parseFloat(cs.borderLeftWidth) + parseFloat(cs.borderRightWidth)) || 0;
					borderHeight = (parseFloat(cs.borderTopWidth) + parseFloat(cs.borderBottomWidth)) || 0;
					width = parseFloat(cs.width) || 0;
					height = parseFloat(cs.height) || 0;
					cache.scaleX *= (width - borderWidth) / width;
					cache.scaleY *= (height - borderHeight) / height;
				}
				if (_svgScrollOffset) { //some browsers (like Chrome for Android) have bugs in the way getScreenCTM() is reported (it doesn't factor in scroll position), so we must revert to a more expensive technique for calculating offsetTop/Left.
					eRect = e.getBoundingClientRect();
					cache.offsetLeft = eRect.left - parentRect.left;
					cache.offsetTop = eRect.top - parentRect.top;
				} else {
					cache.offsetLeft = point1.x - parentRect.left;
					cache.offsetTop = point1.y - parentRect.top;
				}
				cache.offsetParent = offsetParent;
				i = _tempElements.length;
				while (--i > -1) {
					_tempElements[i].style[_transformProp] = _tempTransforms[i];
				}
				return cache;
			},
			_getOffsetTransformOrigin = function(e, decoratee) { //returns the x/y position of the transformOrigin of the element, in its own local coordinate system (pixels), offset from the top left corner.
				decoratee = decoratee || {};
				if (!e || e === _docElement || !e.parentNode || e === window) {
					return {x:0, y:0};
				}
				var cs = _getComputedStyle(e),
					v = (_transformOriginProp && cs) ? cs.getPropertyValue(_transformOriginProp) : "50% 50%",
					a = v.split(" "),
					x = (v.indexOf("left") !== -1) ? "0%" : (v.indexOf("right") !== -1) ? "100%" : a[0],
					y = (v.indexOf("top") !== -1) ? "0%" : (v.indexOf("bottom") !== -1) ? "100%" : a[1];
				if (y === "center" || y == null) {
					y = "50%";
				}
				if (x === "center" || isNaN(parseFloat(x))) { //remember, the user could flip-flop the values and say "bottom center" or "center bottom", etc. "center" is ambiguous because it could be used to describe horizontal or vertical, hence the isNaN(). If there's an "=" sign in the value, it's relative.
					x = "50%";
				}
				if (e.getBBox && _isSVG(e)) { //SVG elements must be handled in a special way because their origins are calculated from the top left.
					if (!e._gsTransform) {
						_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].set(e, {x:"+=0", overwrite:false}); //forces creation of the _gsTransform where we store all the transform components including xOrigin and yOrigin for SVG elements, as of GSAP 1.15.0 which also takes care of calculating the origin from the upper left corner of the SVG canvas.
						if (e._gsTransform.xOrigin === undefined) {
							console.log("Draggable requires at least GSAP 1.17.0");
						}
					}
					v = e.getBBox();
					decoratee.x = (e._gsTransform.xOrigin - v.x);
					decoratee.y = (e._gsTransform.yOrigin - v.y);
				} else {
					if (e.getBBox && (x + y).indexOf("%") !== -1) { //Firefox doesn't report offsetWidth/height on <svg> elements.
						e = e.getBBox();
						e = {offsetWidth: e.width, offsetHeight: e.height};
					}
					decoratee.x = ((x.indexOf("%") !== -1) ? e.offsetWidth * parseFloat(x) / 100 : parseFloat(x));
					decoratee.y = ((y.indexOf("%") !== -1) ? e.offsetHeight * parseFloat(y) / 100 : parseFloat(y));
				}
				return decoratee;
			},
			_cache = function(e) { //computes some important values and stores them in a _dCache object attached to the element itself so that we can optimize performance
				if (Draggable.cacheSVGData !== false && e._dCache && e._dCache.lastUpdate === _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].ticker.frame) { //performance optimization. Assume that if the offsets are requested again on the same tick, we can just feed back the values we already calculated (no need to keep recalculating until another tick elapses).
					return e._dCache;
				}
				var cache = e._dCache = e._dCache || {},
					cs = _getComputedStyle(e),
					isSVG = (e.getBBox && _isSVG(e)),
					isSVGRoot = ((e.nodeName + "").toLowerCase() === "svg"),
					curSVG;
				cache.isSVG = isSVG;
				cache.isSVGRoot = isSVGRoot;
				cache.borderBox = (cs.boxSizing === "border-box");
				cache.computedStyle = cs;
				if (isSVGRoot) { //some browsers don't report parentNode on SVG elements.
					curSVG = e.parentNode || _docElement;
					curSVG.insertBefore(_tempDiv, e);
					cache.offsetParent = _tempDiv.offsetParent || _docElement; //in some cases, Firefox still reports offsetParent as null.
					curSVG.removeChild(_tempDiv);
				} else if (isSVG) {
					curSVG = e.parentNode;
					while (curSVG && (curSVG.nodeName + "").toLowerCase() !== "svg") { //offsetParent is always the SVG canvas for SVG elements.
						curSVG = curSVG.parentNode;
					}
					cache.offsetParent = curSVG;
				} else {
					cache.offsetParent = e.offsetParent;
				}
				return cache;
			},
			_getOffset2DMatrix = function(e, offsetOrigin, parentOffsetOrigin, zeroOrigin, isBase) {  //"isBase" helps us discern context - it should only be true when the element is the base one (the one at which we're starting to walk up the chain). It only matters in cases when it's an <svg> element itself because that's a case when we don't apply scaling.
				if (e === window || !e || !e.style || !e.parentNode) {
					return [1,0,0,1,0,0];
				}
				var cache = e._dCache || _cache(e),
					parent = e.parentNode,
					parentCache = parent._dCache || _cache(parent),
					cs = cache.computedStyle,
					parentOffsetParent = cache.isSVG ? parentCache.offsetParent : parent.offsetParent,
					m, isRoot, offsets, rect, t, sx, sy, offsetX, offsetY, parentRect, borderTop, borderLeft, borderTranslateX, borderTranslateY;
				m = (cache.isSVG && (e.style[_transformProp] + "").indexOf("matrix") !== -1) ? e.style[_transformProp] : cs ? cs.getPropertyValue(_transformPropCSS) : e.currentStyle ? e.currentStyle[_transformProp] : "1,0,0,1,0,0"; //some browsers (like Chrome 40) don't correctly report transforms that are applied inline on an SVG element (they don't get included in the computed style), so we double-check here and accept matrix values
				if (e.getBBox && (e.getAttribute("transform") + "").indexOf("matrix") !== -1) { //SVG can store transform data in its "transform" attribute instead of the CSS, so look for that here (only accept matrix()).
					m = e.getAttribute("transform");
				}
				m = (m + "").match(/(?:\-|\.|\b)(\d|\.|e\-)+/g) || [1,0,0,1,0,0];
				if (m.length > 6) {
					m = [m[0], m[1], m[4], m[5], m[12], m[13]];
				}
				if (zeroOrigin) {
					m[4] = m[5] = 0;
				} else if (cache.isSVG && (t = e._gsTransform) && (t.xOrigin || t.yOrigin)) {
					//SVGs handle origin very differently. Factor in GSAP's handling of origin values here:
					m[0] = parseFloat(m[0]);
					m[1] = parseFloat(m[1]);
					m[2] = parseFloat(m[2]);
					m[3] = parseFloat(m[3]);
					m[4] = parseFloat(m[4]) - (t.xOrigin - (t.xOrigin * m[0] + t.yOrigin * m[2]));
					m[5] = parseFloat(m[5]) - (t.yOrigin - (t.xOrigin * m[1] + t.yOrigin * m[3]));
				}
				if (offsetOrigin) {
					if (_svgBorderFactor === undefined) {
						_setEnvironmentVariables();
					}
					offsets = (cache.isSVG || cache.isSVGRoot) ? _getSVGOffsets(e) : e;
					if (cache.isSVG) { //don't just rely on "instanceof _SVGElement" because if the SVG is embedded via an object tag, it won't work (SVGElement is mapped to a different object))
						rect = e.getBBox();
						parentRect = (parentCache.isSVGRoot) ? {x:0, y:0} : parent.getBBox();
						offsets = {offsetLeft:rect.x - parentRect.x, offsetTop:rect.y - parentRect.y, offsetParent:cache.offsetParent};
					} else if (cache.isSVGRoot) {
						borderTop = parseInt(cs.borderTopWidth, 10) || 0;
						borderLeft = parseInt(cs.borderLeftWidth, 10) || 0;
						borderTranslateX = ((m[0] - _svgBorderFactor) * borderLeft + m[2] * borderTop);
						borderTranslateY = (m[1] * borderLeft + (m[3] - _svgBorderFactor) * borderTop);

						sx = offsetOrigin.x;
						sy = offsetOrigin.y;
						offsetX = (sx - (sx * m[0] + sy * m[2])); //accommodate the SVG root's transforms when the origin isn't in the top left.
						offsetY = (sy - (sx * m[1] + sy * m[3]));

						m[4] = parseFloat(m[4]) + offsetX;
						m[5] = parseFloat(m[5]) + offsetY;
						offsetOrigin.x -= offsetX;
						offsetOrigin.y -= offsetY;
						sx = offsets.scaleX;
						sy = offsets.scaleY;
						if (!isBase) { //when getting the matrix for a root <svg> element itself (NOT in the context of an SVG element that's nested inside of it like a <path>), we do NOT apply the scaling!
							offsetOrigin.x *= sx;
							offsetOrigin.y *= sy;
						}
						m[0] *= sx;
						m[1] *= sy;
						m[2] *= sx;
						m[3] *= sy;
						if (!_isIE10orBelow) {
							offsetOrigin.x += borderTranslateX;
							offsetOrigin.y += borderTranslateY;
						}
						if (parentOffsetParent === _doc.body && offsets.offsetParent === _docElement) { //to avoid issues with margin/padding on the <body>, we always set the offsetParent to _docElement in the _getSVGOffsets() function but there's a condition we check later in this function for (parentOffsetParent === offsets.offsetParent) which would fail if we don't run this logic. In other words, parentOffsetParent may be <body> and the <svg>'s offsetParent is also <body> but artificially set to _docElement to avoid margin/padding issues.
							parentOffsetParent = _docElement;
						}
					} else if (!_hasBorderBug && e.offsetParent) {
						offsetOrigin.x += parseInt(_getStyle(e.offsetParent, "borderLeftWidth"), 10) || 0;
						offsetOrigin.y += parseInt(_getStyle(e.offsetParent, "borderTopWidth"), 10) || 0;
					}
					isRoot = (parent === _docElement || parent === _doc.body);
					m[4] = Number(m[4]) + offsetOrigin.x + (offsets.offsetLeft || 0) - parentOffsetOrigin.x - (isRoot ? 0 : parent.scrollLeft || 0);
					m[5] = Number(m[5]) + offsetOrigin.y + (offsets.offsetTop || 0) - parentOffsetOrigin.y - (isRoot ? 0 : parent.scrollTop || 0);
					if (parent && _getStyle(e, "position", cs) === "fixed") { //fixed position elements should factor in the scroll position of the document.
						m[4] += _getDocScrollLeft();
						m[5] += _getDocScrollTop();
					}
					if (parent && parent !== _docElement && parentOffsetParent === offsets.offsetParent && !parentCache.isSVG && (!_hasReparentBug || _getOffset2DMatrix(parent).join("") === "100100")) {
						offsets = (parentCache.isSVGRoot) ? _getSVGOffsets(parent) : parent;
						m[4] -= offsets.offsetLeft || 0;
						m[5] -= offsets.offsetTop || 0;
						if (!_hasBorderBug && parentCache.offsetParent && !cache.isSVG && !cache.isSVGRoot) {
							m[4] -= parseInt(_getStyle(parentCache.offsetParent, "borderLeftWidth"), 10) || 0;
							m[5] -= parseInt(_getStyle(parentCache.offsetParent, "borderTopWidth"), 10) || 0;
						}
					}
				}
				return m;
			},
			_getConcatenatedMatrix = function(e, invert) {
				if (!e || e === window || !e.parentNode) {
					return [1,0,0,1,0,0];
				}
				//note: we keep reusing _point1 and _point2 in order to minimize memory usage and garbage collection chores.
				var originOffset = _getOffsetTransformOrigin(e, _point1),
					parentOriginOffset = _getOffsetTransformOrigin(e.parentNode, _point2),
					m = _getOffset2DMatrix(e, originOffset, parentOriginOffset, false, !invert),
					a, b, c, d, tx, ty, m2, determinant;
				while ((e = e.parentNode) && e.parentNode && e !== _docElement) {
					originOffset = parentOriginOffset;
					parentOriginOffset = _getOffsetTransformOrigin(e.parentNode, (originOffset === _point1) ? _point2 : _point1);
					m2 = _getOffset2DMatrix(e, originOffset, parentOriginOffset);
					a = m[0];
					b = m[1];
					c = m[2];
					d = m[3];
					tx = m[4];
					ty = m[5];
					m[0] = a * m2[0] + b * m2[2];
					m[1] = a * m2[1] + b * m2[3];
					m[2] = c * m2[0] + d * m2[2];
					m[3] = c * m2[1] + d * m2[3];
					m[4] = tx * m2[0] + ty * m2[2] + m2[4];
					m[5] = tx * m2[1] + ty * m2[3] + m2[5];
				}
				if (invert) {
					a = m[0];
					b = m[1];
					c = m[2];
					d = m[3];
					tx = m[4];
					ty = m[5];
					determinant = (a * d - b * c);
					m[0] = d / determinant;
					m[1] = -b / determinant;
					m[2] = -c / determinant;
					m[3] = a / determinant;
					m[4] = (c * ty - d * tx) / determinant;
					m[5] = -(a * ty - b * tx) / determinant;
				}
				return m;
			},
			_localToGlobal = function(e, p, fromTopLeft, decoratee, zeroOrigin) {
				e = _unwrapElement(e);
				var m = _getConcatenatedMatrix(e, false, zeroOrigin),
					x = p.x,
					y = p.y;
				if (fromTopLeft) {
					_getOffsetTransformOrigin(e, p);
					x -= p.x;
					y -= p.y;
				}
				decoratee = (decoratee === true) ? p : decoratee || {};
				decoratee.x = x * m[0] + y * m[2] + m[4];
				decoratee.y = x * m[1] + y * m[3] + m[5];
				return decoratee;
			},
			_localizePoint = function(p, localToGlobal, globalToLocal) {
				var x = p.x * localToGlobal[0] + p.y * localToGlobal[2] + localToGlobal[4],
					y = p.x * localToGlobal[1] + p.y * localToGlobal[3] + localToGlobal[5];
				p.x = x * globalToLocal[0] + y * globalToLocal[2] + globalToLocal[4];
				p.y = x * globalToLocal[1] + y * globalToLocal[3] + globalToLocal[5];
				return p;
			},

			_getElementBounds = function(e, context, fromTopLeft) {
				if (!(e = _unwrapElement(e))) {
					return null;
				}
				context = _unwrapElement(context);
				var isSVG = (e.getBBox && _isSVG(e)),
					origin, left, right, top, bottom, mLocalToGlobal, mGlobalToLocal, p1, p2, p3, p4, bbox, width, height, cache, borderLeft, borderTop, viewBox, viewBoxX, viewBoxY, computedDimensions, cs;
				if (e === window) {
					top = _getDocScrollTop();
					left = _getDocScrollLeft();
					right = left + (_docElement.clientWidth || e.innerWidth || _doc.body.clientWidth || 0);
					bottom = top + (((e.innerHeight || 0) - 20 < _docElement.clientHeight) ? _docElement.clientHeight : e.innerHeight || _doc.body.clientHeight || 0); //some browsers (like Firefox) ignore absolutely positioned elements, and collapse the height of the documentElement, so it could be 8px, for example, if you have just an absolutely positioned div. In that case, we use the innerHeight to resolve this.
				} else if (context === undefined || context === window) {
					return e.getBoundingClientRect();
				} else {
					origin = _getOffsetTransformOrigin(e);
					left = -origin.x;
					top = -origin.y;
					if (isSVG) {
						bbox = e.getBBox();
						width = bbox.width;
						height = bbox.height;
					} else if ((e.nodeName + "").toLowerCase() !== "svg" && e.offsetWidth) { //Chrome dropped support for "offsetWidth" on SVG elements
						width = e.offsetWidth;
						height = e.offsetHeight;
					} else {
						computedDimensions = _getComputedStyle(e);
						width = parseFloat(computedDimensions.width);
						height = parseFloat(computedDimensions.height);
					}
					right = left + width;
					bottom = top + height;
					if (e.nodeName.toLowerCase() === "svg" && !_isOldIE) { //root SVG elements are a special beast because they have 2 types of scaling - transforms on themselves as well as the stretching of the SVG canvas itself based on the outer size and the viewBox. If, for example, the SVG's viewbox is "0 0 100 100" but the CSS is set to width:200px; height:200px, that'd make it appear at 2x scale even though the element itself has no CSS transforms but the offsetWidth/offsetHeight are based on that css, not the viewBox so we need to adjust them accordingly.
						cache = _getSVGOffsets(e);
						cs = cache.computedStyle || {};
						viewBox = (e.getAttribute("viewBox") || "0 0").split(" ");
						viewBoxX = parseFloat(viewBox[0]);
						viewBoxY = parseFloat(viewBox[1]);
						borderLeft = parseFloat(cs.borderLeftWidth) || 0;
						borderTop = parseFloat(cs.borderTopWidth) || 0;
						right -= width - ((width - borderLeft) / cache.scaleX) - viewBoxX;
						bottom -= height - ((height - borderTop) / cache.scaleY) - viewBoxY;
						left -= borderLeft / cache.scaleX - viewBoxX;
						top -= borderTop / cache.scaleY - viewBoxY;
						if (computedDimensions) { //when we had to use computed styles, factor in the border now.
							right += (parseFloat(cs.borderRightWidth) + borderLeft) / cache.scaleX;
							bottom += (borderTop + parseFloat(cs.borderBottomWidth)) / cache.scaleY;
						}
					}
				}
				if (e === context) {
					return {left:left, top:top, width: right - left, height: bottom - top};
				}
				mLocalToGlobal = _getConcatenatedMatrix(e);
				mGlobalToLocal = _getConcatenatedMatrix(context, true);
				p1 = _localizePoint({x:left, y:top}, mLocalToGlobal, mGlobalToLocal);
				p2 = _localizePoint({x:right, y:top}, mLocalToGlobal, mGlobalToLocal);
				p3 = _localizePoint({x:right, y:bottom}, mLocalToGlobal, mGlobalToLocal);
				p4 = _localizePoint({x:left, y:bottom}, mLocalToGlobal, mGlobalToLocal);
				left = Math.min(p1.x, p2.x, p3.x, p4.x);
				top = Math.min(p1.y, p2.y, p3.y, p4.y);
				_temp1.x = _temp1.y = 0;
				if (fromTopLeft) {
					_getOffsetTransformOrigin(context, _temp1);
				}
				return {left:left + _temp1.x, top:top + _temp1.y, width:Math.max(p1.x, p2.x, p3.x, p4.x) - left, height:Math.max(p1.y, p2.y, p3.y, p4.y) - top};
			},
			// end matrix and point conversion methods



			_isArrayLike = function(e) {
				return (e && e.length && e[0] && ((e[0].nodeType && e[0].style && !e.nodeType) || (e[0].length && e[0][0]))) ? true : false; //could be an array of jQuery objects too, so accommodate that.
			},

			_flattenArray = function(a) {
				var result = [],
					l = a.length,
					i, e, j;
				for (i = 0; i < l; i++) {
					e = a[i];
					if (_isArrayLike(e)) {
						j = e.length;
						for (j = 0; j < e.length; j++) {
							result.push(e[j]);
						}
					} else if (e && e.length !== 0) {
						result.push(e);
					}
				}
				return result;
			},

			_isTouchDevice = (typeof(window) !== "undefined" && ("ontouchstart" in _docElement) && ("orientation" in window)),
			_touchEventLookup = (function(types) { //we create an object that makes it easy to translate touch event types into their "pointer" counterparts if we're in a browser that uses those instead. Like IE10 uses "MSPointerDown" instead of "touchstart", for example.
				var standard = types.split(","),
					converted = ((_tempDiv.onpointerdown !== undefined) ? "pointerdown,pointermove,pointerup,pointercancel" : (_tempDiv.onmspointerdown !== undefined) ? "MSPointerDown,MSPointerMove,MSPointerUp,MSPointerCancel" : types).split(","),
					obj = {},
					i = 4;
				while (--i > -1) {
					obj[standard[i]] = converted[i];
					obj[converted[i]] = standard[i];
				}
				return obj;
			}("touchstart,touchmove,touchend,touchcancel")),

			_addListener = function(element, type, func, capture) {
				if (element.addEventListener) {
					var touchType = _touchEventLookup[type];
					capture = capture || {passive:false};
					element.addEventListener(touchType || type, func, capture);
					if (touchType && type !== touchType) { //some browsers actually support both, so must we.
						element.addEventListener(type, func, capture);
					}
				} else if (element.attachEvent) {
					element.attachEvent("on" + type, func);
				}
			},

			_removeListener = function(element, type, func) {
				if (element.removeEventListener) {
					var touchType = _touchEventLookup[type];
					element.removeEventListener(touchType || type, func);
					if (touchType && type !== touchType) {
						element.removeEventListener(type, func);
					}
				} else if (element.detachEvent) {
					element.detachEvent("on" + type, func);
				}
			},

			_hasTouchID = function(list, ID) {
				var i = list.length;
				while (--i > -1) {
					if (list[i].identifier === ID) {
						return true;
					}
				}
				return false;
			},

			_onMultiTouchDocumentEnd = function(e) {
				_isMultiTouching = (e.touches && _dragCount < e.touches.length);
				_removeListener(e.target, "touchend", _onMultiTouchDocumentEnd);
			},

			_onMultiTouchDocument = function(e) {
				_isMultiTouching = (e.touches && _dragCount < e.touches.length);
				_addListener(e.target, "touchend", _onMultiTouchDocumentEnd);
			},

			_parseThrowProps = function(draggable, snap, max, min, factor, forceZeroVelocity) {
				var vars = {},
					a, i, l;
				if (snap) {
					if (factor !== 1 && snap instanceof Array) { //some data must be altered to make sense, like if the user passes in an array of rotational values in degrees, we must convert it to radians. Or for scrollLeft and scrollTop, we invert the values.
						vars.end = a = [];
						l = snap.length;
						if (typeof(snap[0]) === "object") { //if the array is populated with objects, like points ({x:100, y:200}), make copies before multiplying by the factor, otherwise we'll mess up the originals and the user may reuse it elsewhere.
							for (i = 0; i < l; i++) {
								a[i] = _copy(snap[i], factor);
							}
						} else {
							for (i = 0; i < l; i++) {
								a[i] = snap[i] * factor;
							}
						}
						max += 1.1; //allow 1.1 pixels of wiggle room when snapping in order to work around some browser inconsistencies in the way bounds are reported which can make them roughly a pixel off. For example, if "snap:[-$('#menu').width(), 0]" was defined and #menu had a wrapper that was used as the bounds, some browsers would be one pixel off, making the minimum -752 for example when snap was [-753,0], thus instead of snapping to -753, it would snap to 0 since -753 was below the minimum.
						min -= 1.1;
					} else if (typeof(snap) === "function") {
						vars.end = function(value) {
							var result = snap.call(draggable, value),
								copy, p;
							if (factor !== 1) {
								if (typeof(result) === "object") {
									copy = {};
									for (p in result) {
										copy[p] = result[p] * factor;
									}
									result = copy;
								} else {
									result *= factor;
								}
							}
							return result; //we need to ensure that we can scope the function call to the Draggable instance itself so that users can access important values like maxX, minX, maxY, minY, x, and y from within that function.
						};
					} else {
						vars.end = snap;
					}
				}
				if (max || max === 0) {
					vars.max = max;
				}
				if (min || min === 0) {
					vars.min = min;
				}
				if (forceZeroVelocity) {
					vars.velocity = 0;
				}
				return vars;
			},

			_isClickable = function(e) { //sometimes it's convenient to mark an element as clickable by adding a data-clickable="true" attribute (in which case we won't preventDefault() the mouse/touch event). This method checks if the element is an <a>, <input>, or <button> or has an onclick or has the data-clickable or contentEditable attribute set to true (or any of its parent elements).
				var data;
				return (!e || !e.getAttribute || e.nodeName === "BODY") ? false : ((data = e.getAttribute("data-clickable")) === "true" || (data !== "false" && (e.onclick || _clickableTagExp.test(e.nodeName + "") || e.getAttribute("contentEditable") === "true"))) ? true : _isClickable(e.parentNode);
			},

			_setSelectable = function(elements, selectable) {
				var i = elements.length,
					e;
				while (--i > -1) {
					e = elements[i];
					e.ondragstart = e.onselectstart = selectable ? null : _emptyFunc;
					_setStyle(e, "userSelect", (selectable ? "text" : "none"));
				}
			},

			_addPaddingBR = (function() { //this function is in charge of analyzing browser behavior related to padding. It sets the _addPaddingBR to true if the browser doesn't normally factor in the bottom or right padding on the element inside the scrolling area, and it sets _addPaddingLeft to true if it's a browser that requires the extra offset (offsetLeft) to be added to the paddingRight (like Opera).
				var div = _doc.createElement("div"),
					child = _doc.createElement("div"),
					childStyle = child.style,
					parent = _doc.body || _tempDiv,
					val;
				childStyle.display = "inline-block";
				childStyle.position = "relative";
				div.style.cssText = child.innerHTML = "width:90px; height:40px; padding:10px; overflow:auto; visibility: hidden";
				div.appendChild(child);
				parent.appendChild(div);
				val = (child.offsetHeight + 18 > div.scrollHeight); //div.scrollHeight should be child.offsetHeight + 20 because of the 10px of padding on each side, but some browsers ignore one side. We allow a 2px margin of error.
				parent.removeChild(div);
				return val;
			}()),




			//The ScrollProxy class wraps an element's contents into another div (we call it "content") that we either add padding when necessary or apply a translate3d() transform in order to overscroll (scroll past the boundaries). This allows us to simply set the scrollTop/scrollLeft (or top/left for easier reverse-axis orientation, which is what we do in Draggable) and it'll do all the work for us. For example, if we tried setting scrollTop to -100 on a normal DOM element, it wouldn't work - it'd look the same as setting it to 0, but if we set scrollTop of a ScrollProxy to -100, it'll give the correct appearance by either setting paddingTop of the wrapper to 100 or applying a 100-pixel translateY.
			ScrollProxy = function(element, vars) {
				element = _unwrapElement(element);
				vars = vars || {};
				var content = _doc.createElement("div"),
					style = content.style,
					node = element.firstChild,
					offsetTop = 0,
					offsetLeft = 0,
					prevTop = element.scrollTop,
					prevLeft = element.scrollLeft,
					scrollWidth = element.scrollWidth,
					scrollHeight = element.scrollHeight,
					extraPadRight = 0,
					maxLeft = 0,
					maxTop = 0,
					elementWidth, elementHeight, contentHeight, nextNode, transformStart, transformEnd;

				if (_supports3D && vars.force3D !== false) {
					transformStart = "translate3d(";
					transformEnd = "px,0px)";
				} else if (_transformProp) {
					transformStart = "translate(";
					transformEnd = "px)";
				}

				this.scrollTop = function(value, force) {
					if (!arguments.length) {
						return -this.top();
					}
					this.top(-value, force);
				};

				this.scrollLeft = function(value, force) {
					if (!arguments.length) {
						return -this.left();
					}
					this.left(-value, force);
				};

				this.left = function(value, force) {
					if (!arguments.length) {
						return -(element.scrollLeft + offsetLeft);
					}
					var dif = element.scrollLeft - prevLeft,
						oldOffset = offsetLeft;
					if ((dif > 2 || dif < -2) && !force) { //if the user interacts with the scrollbar (or something else scrolls it, like the mouse wheel), we should kill any tweens of the ScrollProxy.
						prevLeft = element.scrollLeft;
						_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].killTweensOf(this, true, {left:1, scrollLeft:1});
						this.left(-prevLeft);
						if (vars.onKill) {
							vars.onKill();
						}
						return;
					}
					value = -value; //invert because scrolling works in the opposite direction
					if (value < 0) {
						offsetLeft = (value - 0.5) | 0;
						value = 0;
					} else if (value > maxLeft) {
						offsetLeft = (value - maxLeft) | 0;
						value = maxLeft;
					} else {
						offsetLeft = 0;
					}
					if (offsetLeft || oldOffset) {
						if (transformStart) {
							if (!this._suspendTransforms) {
								style[_transformProp] = transformStart + -offsetLeft + "px," + -offsetTop + transformEnd;
							}
						} else {
							style.left = -offsetLeft + "px";
						}
						if (offsetLeft + extraPadRight >= 0) {
							style.paddingRight = offsetLeft + extraPadRight + "px";
						}
					}
					element.scrollLeft = value | 0;
					prevLeft = element.scrollLeft; //don't merge this with the line above because some browsers adjsut the scrollLeft after it's set, so in order to be 100% accurate in tracking it, we need to ask the browser to report it.
				};

				this.top = function(value, force) {
					if (!arguments.length) {
						return -(element.scrollTop + offsetTop);
					}
					var dif = element.scrollTop - prevTop,
						oldOffset = offsetTop;
					if ((dif > 2 || dif < -2) && !force) { //if the user interacts with the scrollbar (or something else scrolls it, like the mouse wheel), we should kill any tweens of the ScrollProxy.
						prevTop = element.scrollTop;
						_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].killTweensOf(this, true, {top:1, scrollTop:1});
						this.top(-prevTop);
						if (vars.onKill) {
							vars.onKill();
						}
						return;
					}
					value = -value; //invert because scrolling works in the opposite direction
					if (value < 0) {
						offsetTop = (value - 0.5) | 0;
						value = 0;
					} else if (value > maxTop) {
						offsetTop = (value - maxTop) | 0;
						value = maxTop;
					} else {
						offsetTop = 0;
					}
					if (offsetTop || oldOffset) {
						if (transformStart) {
							if (!this._suspendTransforms) {
								style[_transformProp] = transformStart + -offsetLeft + "px," + -offsetTop + transformEnd;
							}
						} else {
							style.top = -offsetTop + "px";
						}
					}
					element.scrollTop = value | 0;
					prevTop = element.scrollTop;
				};

				this.maxScrollTop = function() {
					return maxTop;
				};

				this.maxScrollLeft = function() {
					return maxLeft;
				};

				this.disable = function() {
					node = content.firstChild;
					while (node) {
						nextNode = node.nextSibling;
						element.appendChild(node);
						node = nextNode;
					}
					if (element === content.parentNode) { //in case disable() is called when it's already disabled.
						element.removeChild(content);
					}
				};

				this.enable = function() {
					node = element.firstChild;
					if (node === content) {
						return;
					}
					while (node) {
						nextNode = node.nextSibling;
						content.appendChild(node);
						node = nextNode;
					}
					element.appendChild(content);
					this.calibrate();
				};

				this.calibrate = function(force) {
					var widthMatches = (element.clientWidth === elementWidth),
						x, y;
					prevTop = element.scrollTop;
					prevLeft = element.scrollLeft;
					if (widthMatches && element.clientHeight === elementHeight && content.offsetHeight === contentHeight && scrollWidth === element.scrollWidth && scrollHeight === element.scrollHeight && !force) {
						return; //no need to recalculate things if the width and height haven't changed.
					}
					if (offsetTop || offsetLeft) {
						x = this.left();
						y = this.top();
						this.left(-element.scrollLeft);
						this.top(-element.scrollTop);
					}
					//first, we need to remove any width constraints to see how the content naturally flows so that we can see if it's wider than the containing element. If so, we've got to record the amount of overage so that we can apply that as padding in order for browsers to correctly handle things. Then we switch back to a width of 100% (without that, some browsers don't flow the content correctly)
					if (!widthMatches || force) {
						style.display = "block";
						style.width = "auto";
						style.paddingRight = "0px";
						extraPadRight = Math.max(0, element.scrollWidth - element.clientWidth);
						//if the content is wider than the container, we need to add the paddingLeft and paddingRight in order for things to behave correctly.
						if (extraPadRight) {
							extraPadRight += _getStyle(element, "paddingLeft") + (_addPaddingBR ? _getStyle(element, "paddingRight") : 0);
						}
					}
					style.display = "inline-block";
					style.position = "relative";
					style.overflow = "visible";
					style.verticalAlign = "top";
					style.width = "100%";
					style.paddingRight = extraPadRight + "px";
					//some browsers neglect to factor in the bottom padding when calculating the scrollHeight, so we need to add that padding to the content when that happens. Allow a 2px margin for error
					if (_addPaddingBR) {
						style.paddingBottom = _getStyle(element, "paddingBottom", true);
					}
					if (_isOldIE) {
						style.zoom = "1";
					}
					elementWidth = element.clientWidth;
					elementHeight = element.clientHeight;
					scrollWidth = element.scrollWidth;
					scrollHeight = element.scrollHeight;
					maxLeft = element.scrollWidth - elementWidth;
					maxTop = element.scrollHeight - elementHeight;
					contentHeight = content.offsetHeight;
					style.display = "block";
					if (x || y) {
						this.left(x);
						this.top(y);
					}
				};

				this.content = content;
				this.element = element;
				this._suspendTransforms = false;
				this.enable();
			},





			Draggable = function(target, vars) {
				_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* EventDispatcher */ "c"].call(this, target);
				target = _unwrapElement(target); //in case the target is a selector object or selector text
				if (!ThrowPropsPlugin) {
					ThrowPropsPlugin = _globals.com.greensock.plugins.ThrowPropsPlugin;
				}
				this.vars = vars = _copy(vars || {});
				this.target = target;
				this.x = this.y = this.rotation = 0;
				this.dragResistance = parseFloat(vars.dragResistance) || 0;
				this.edgeResistance = isNaN(vars.edgeResistance) ? 1 : parseFloat(vars.edgeResistance) || 0;
				this.lockAxis = vars.lockAxis;
				this.autoScroll = vars.autoScroll || 0;
				this.lockedAxis = null;
				this.allowEventDefault = !!vars.allowEventDefault;
				var type = (vars.type || (_isOldIE ? "top,left" : "x,y")).toLowerCase(),
					xyMode = (type.indexOf("x") !== -1 || type.indexOf("y") !== -1),
					rotationMode = (type.indexOf("rotation") !== -1),
					xProp = rotationMode ? "rotation" : xyMode ? "x" : "left",
					yProp = xyMode ? "y" : "top",
					allowX = (type.indexOf("x") !== -1 || type.indexOf("left") !== -1 || type === "scroll"),
					allowY = (type.indexOf("y") !== -1 || type.indexOf("top") !== -1 || type === "scroll"),
					minimumMovement = vars.minimumMovement || 2,
					self = this,
					triggers = _slice(vars.trigger || vars.handle || target),
					killProps = {},
					dragEndTime = 0,
					checkAutoScrollBounds = false,
					autoScrollMarginTop = vars.autoScrollMarginTop || 40,
					autoScrollMarginRight = vars.autoScrollMarginRight || 40,
					autoScrollMarginBottom = vars.autoScrollMarginBottom || 40,
					autoScrollMarginLeft = vars.autoScrollMarginLeft || 40,
					isClickable = vars.clickableTest || _isClickable,
					clickTime = 0,
					enabled, scrollProxy, startPointerX, startPointerY, startElementX, startElementY, hasBounds, hasDragCallback, maxX, minX, maxY, minY, tempVars, cssVars, touch, touchID, rotationOrigin, dirty, old, snapX, snapY, snapXY, isClicking, touchEventTarget, matrix, interrupted, startScrollTop, startScrollLeft, applyObj, allowNativeTouchScrolling, touchDragAxis, isDispatching, clickDispatch, trustedClickDispatch,

					onContextMenu = function(e) { //used to prevent long-touch from triggering a context menu.
						if (self.isPressed && e.which < 2) {
							self.endDrag();
						} else {
							e.preventDefault();
							e.stopPropagation();
							return false;
						}
					},

					//this method gets called on every tick of TweenLite.ticker which allows us to synchronize the renders to the core engine (which is typically synchronized with the display refresh via requestAnimationFrame). This is an optimization - it's better than applying the values inside the "mousemove" or "touchmove" event handler which may get called many times inbetween refreshes.
					render = function(suppressEvents) {
						if (self.autoScroll && self.isDragging && (checkAutoScrollBounds || dirty)) {
							var e = target,
								autoScrollFactor = self.autoScroll * 15, //multiplying by 15 just gives us a better "feel" speed-wise.
								parent, isRoot, rect, pointerX, pointerY, changeX, changeY, gap;
							checkAutoScrollBounds = false;
							_windowProxy.scrollTop = ((window.pageYOffset != null) ? window.pageYOffset : (_docElement.scrollTop != null) ? _docElement.scrollTop : _doc.body.scrollTop);
							_windowProxy.scrollLeft = ((window.pageXOffset != null) ? window.pageXOffset : (_docElement.scrollLeft != null) ? _docElement.scrollLeft : _doc.body.scrollLeft);
							pointerX = self.pointerX - _windowProxy.scrollLeft;
							pointerY = self.pointerY - _windowProxy.scrollTop;
							while (e && !isRoot) { //walk up the chain and sense wherever the pointer is within 40px of an edge that's scrollable.
								isRoot = _isRoot(e.parentNode);
								parent = isRoot ? _windowProxy : e.parentNode;
								rect = isRoot ? {bottom:Math.max(_docElement.clientHeight, window.innerHeight || 0), right: Math.max(_docElement.clientWidth, window.innerWidth || 0), left:0, top:0} : parent.getBoundingClientRect();
								changeX = changeY = 0;
								if (allowY) {
									gap = parent._gsMaxScrollY - parent.scrollTop;
									if (gap < 0) {
										changeY = gap;
									} else if (pointerY > rect.bottom - autoScrollMarginBottom && gap) {
										checkAutoScrollBounds = true;
										changeY = Math.min(gap, (autoScrollFactor * (1 - Math.max(0, (rect.bottom - pointerY)) / autoScrollMarginBottom)) | 0);
									} else if (pointerY < rect.top + autoScrollMarginTop && parent.scrollTop) {
										checkAutoScrollBounds = true;
										changeY = -Math.min(parent.scrollTop, (autoScrollFactor * (1 - Math.max(0, (pointerY - rect.top)) / autoScrollMarginTop)) | 0);
									}
									if (changeY) {
										parent.scrollTop += changeY;
									}
								}
								if (allowX) {
									gap = parent._gsMaxScrollX - parent.scrollLeft;
									if (gap < 0) {
										changeX = gap;
									} else if (pointerX > rect.right - autoScrollMarginRight && gap) {
										checkAutoScrollBounds = true;
										changeX = Math.min(gap, (autoScrollFactor * (1 - Math.max(0, (rect.right - pointerX)) / autoScrollMarginRight)) | 0);
									} else if (pointerX < rect.left + autoScrollMarginLeft && parent.scrollLeft) {
										checkAutoScrollBounds = true;
										changeX = -Math.min(parent.scrollLeft, (autoScrollFactor * (1 - Math.max(0, (pointerX - rect.left)) / autoScrollMarginLeft)) | 0);
									}
									if (changeX) {
										parent.scrollLeft += changeX;
									}
								}

								if (isRoot && (changeX || changeY)) {
									window.scrollTo(parent.scrollLeft, parent.scrollTop);
									setPointerPosition(self.pointerX + changeX, self.pointerY + changeY);
								}
								e = parent;
							}
						}
						if (dirty) {
							var x = self.x,
								y = self.y,
								min = 0.000001;
							if (x < min && x > -min) { //browsers don't handle super small decimals well.
								x = 0;
							}
							if (y < min && y > -min) {
								y = 0;
							}
							if (rotationMode) {
								self.deltaX = x - applyObj.data.rotation;
								applyObj.data.rotation = self.rotation = x;
								applyObj.setRatio(1); //note: instead of doing TweenLite.set(), as a performance optimization we skip right to the method that renders the transforms inside CSSPlugin. For old versions of IE, though, we do a normal TweenLite.set() to leverage its ability to re-reroute to an IE-specific 2D renderer.
							} else {
								if (scrollProxy) {
									if (allowY) {
										self.deltaY = y - scrollProxy.top();
										scrollProxy.top(y);
									}
									if (allowX) {
										self.deltaX = x - scrollProxy.left();
										scrollProxy.left(x);
									}
								} else if (xyMode) {
									if (allowY) {
										self.deltaY = y - applyObj.data.y;
										applyObj.data.y = y;
									}
									if (allowX) {
										self.deltaX = x - applyObj.data.x;
										applyObj.data.x = x;
									}
									applyObj.setRatio(1); //note: instead of doing TweenLite.set(), as a performance optimization we skip right to the method that renders the transforms inside CSSPlugin. For old versions of IE, though, we do a normal TweenLite.set() to leverage its ability to re-reroute to an IE-specific 2D renderer.
								} else {
									if (allowY) {
										self.deltaY = y - parseFloat(target.style.top || 0);
										target.style.top = y + "px";
									}
									if (allowX) {
										self.deltaY = x - parseFloat(target.style.left || 0);
										target.style.left = x + "px";
									}
								}
							}
							if (hasDragCallback && !suppressEvents && !isDispatching) {
								isDispatching = true; //in case onDrag has an update() call (avoid endless loop)
								_dispatchEvent(self, "drag", "onDrag");
								isDispatching = false;
							}
						}
						dirty = false;
					},

					//copies the x/y from the element (whether that be transforms, top/left, or ScrollProxy's top/left) to the Draggable's x and y (and rotation if necessary) properties so that they reflect reality and it also (optionally) applies any snapping necessary. This is used by the ThrowPropsPlugin tween in an onUpdate to ensure things are synced and snapped.
					syncXY = function(skipOnUpdate, skipSnap) {
						var x = self.x,
							y = self.y,
							snappedValue;
						if (!target._gsTransform && (xyMode || rotationMode)) { //just in case the _gsTransform got wiped, like if the user called clearProps on the transform or something (very rare), doing an x tween forces a re-parsing of the transforms and population of the _gsTransform.
							_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].set(target, {x:"+=0", overwrite:false, data:"_draggable"});
						}
						if (xyMode) {
							self.y = target._gsTransform.y;
							self.x = target._gsTransform.x;
						} else if (rotationMode) {
							self.x = self.rotation = target._gsTransform.rotation;
						} else if (scrollProxy) {
							self.y = scrollProxy.top();
							self.x = scrollProxy.left();
						} else {
							self.y = parseInt(target.style.top, 10) || 0;
							self.x = parseInt(target.style.left, 10) || 0;
						}
						if ((snapX || snapY || snapXY) && !skipSnap && (self.isDragging || self.isThrowing)) {
							if (snapXY) {
								_temp1.x = self.x;
								_temp1.y = self.y;
								snappedValue = snapXY(_temp1);
								if (snappedValue.x !== self.x) {
									self.x = snappedValue.x;
									dirty = true;
								}
								if (snappedValue.y !== self.y) {
									self.y = snappedValue.y;
									dirty = true;
								}
							}
							if (snapX) {
								snappedValue = snapX(self.x);
								if (snappedValue !== self.x) {
									self.x = snappedValue;
									if (rotationMode) {
										self.rotation = snappedValue;
									}
									dirty = true;
								}
							}
							if (snapY) {
								snappedValue = snapY(self.y);
								if (snappedValue !== self.y) {
									self.y = snappedValue;
								}
								dirty = true;
							}
						}
						if (dirty) {
							render(true);
						}
						if (!skipOnUpdate) {
							self.deltaX = self.x - x;
							self.deltaY = self.y - y;
							_dispatchEvent(self, "throwupdate", "onThrowUpdate");
						}
					},

					calculateBounds = function() {
						var bounds, targetBounds, snap, snapIsRaw;
						hasBounds = false;
						if (scrollProxy) {
							scrollProxy.calibrate();
							self.minX = minX = -scrollProxy.maxScrollLeft();
							self.minY = minY = -scrollProxy.maxScrollTop();
							self.maxX = maxX = self.maxY = maxY = 0;
							hasBounds = true;
						} else if (!!vars.bounds) {
							bounds = _getBounds(vars.bounds, target.parentNode); //could be a selector/jQuery object or a DOM element or a generic object like {top:0, left:100, width:1000, height:800} or {minX:100, maxX:1100, minY:0, maxY:800}
							if (rotationMode) {
								self.minX = minX = bounds.left;
								self.maxX = maxX = bounds.left + bounds.width;
								self.minY = minY = self.maxY = maxY = 0;
							} else if (vars.bounds.maxX !== undefined || vars.bounds.maxY !== undefined) {
								bounds = vars.bounds;
								self.minX = minX = bounds.minX;
								self.minY = minY = bounds.minY;
								self.maxX = maxX = bounds.maxX;
								self.maxY = maxY = bounds.maxY;
							} else {
								targetBounds = _getBounds(target, target.parentNode);
								self.minX = minX = _getStyle(target, xProp) + bounds.left - targetBounds.left;
								self.minY = minY = _getStyle(target, yProp) + bounds.top - targetBounds.top;
								self.maxX = maxX = minX + (bounds.width - targetBounds.width);
								self.maxY = maxY = minY + (bounds.height - targetBounds.height);
							}
							if (minX > maxX) {
								self.minX = maxX;
								self.maxX = maxX = minX;
								minX = self.minX;
							}
							if (minY > maxY) {
								self.minY = maxY;
								self.maxY = maxY = minY;
								minY = self.minY;
							}
							if (rotationMode) {
								self.minRotation = minX;
								self.maxRotation = maxX;
							}
							hasBounds = true;
						}
						if (vars.liveSnap) {
							snap = (vars.liveSnap === true) ? (vars.snap || {}) : vars.liveSnap;
							snapIsRaw = (snap instanceof Array || typeof(snap) === "function");
							if (rotationMode) {
								snapX = buildSnapFunc((snapIsRaw ? snap : snap.rotation), minX, maxX, 1);
								snapY = null;
							} else {
								if (snap.points) {
									snapXY = buildPointSnapFunc((snapIsRaw ? snap : snap.points), minX, maxX, minY, maxY, snap.radius, scrollProxy ? -1 : 1);
								} else {
									if (allowX) {
										snapX = buildSnapFunc((snapIsRaw ? snap : snap.x || snap.left || snap.scrollLeft), minX, maxX, scrollProxy ? -1 : 1);
									}
									if (allowY) {
										snapY = buildSnapFunc((snapIsRaw ? snap : snap.y || snap.top || snap.scrollTop), minY, maxY, scrollProxy ? -1 : 1);
									}
								}
							}
						}

					},

					onThrowComplete = function() {
						self.isThrowing = false;
						_dispatchEvent(self, "throwcomplete", "onThrowComplete");
					},
					onThrowOverwrite = function() {
						self.isThrowing = false;
					},

					animate = function(throwProps, forceZeroVelocity) {
						var snap, snapIsRaw, tween, overshootTolerance;
						if (throwProps && ThrowPropsPlugin) {
							if (throwProps === true) {
								snap = vars.snap || vars.liveSnap || {};
								snapIsRaw = (snap instanceof Array || typeof(snap) === "function");
								throwProps = {resistance:(vars.throwResistance || vars.resistance || 1000) / (rotationMode ? 10 : 1)};
								if (rotationMode) {
									throwProps.rotation = _parseThrowProps(self, snapIsRaw ? snap : snap.rotation, maxX, minX, 1, forceZeroVelocity);
								} else {
									if (allowX) {
										throwProps[xProp] = _parseThrowProps(self, snapIsRaw ? snap : snap.points || snap.x || snap.left || snap.scrollLeft, maxX, minX, scrollProxy ? -1 : 1, forceZeroVelocity || (self.lockedAxis === "x"));
									}
									if (allowY) {
										throwProps[yProp] = _parseThrowProps(self, snapIsRaw ? snap : snap.points || snap.y || snap.top || snap.scrollTop, maxY, minY, scrollProxy ? -1 : 1, forceZeroVelocity || (self.lockedAxis === "y"));
									}
									if (snap.points || (snap instanceof Array && typeof(snap[0]) === "object")) {
										throwProps.linkedProps = xProp + "," + yProp;
										throwProps.radius = snap.radius; //note: we also disable liveSnapping while throwing if there's a "radius" defined, otherwise it looks weird to have the item thrown past a snapping point but live-snapping mid-tween. We do this by altering the onUpdateParams so that "skipSnap" parameter is true for syncXY.
									}
								}
							}
							self.isThrowing = true;
							overshootTolerance = (!isNaN(vars.overshootTolerance)) ? vars.overshootTolerance : (vars.edgeResistance === 1) ? 0 : (1 - self.edgeResistance) + 0.2;
							self.tween = tween = ThrowPropsPlugin.to(scrollProxy || target, {throwProps:throwProps, data:"_draggable", ease:(vars.ease || _globals.Power3.easeOut), onComplete:onThrowComplete, onOverwrite:onThrowOverwrite, onUpdate:(vars.fastMode ? _dispatchEvent : syncXY), onUpdateParams:(vars.fastMode ? [self, "onthrowupdate", "onThrowUpdate"] : (snap && snap.radius) ? [false, true] : _emptyArray)}, Math.max(vars.minDuration || 0, vars.maxDuration || 0) || 2, (!isNaN(vars.minDuration) ? vars.minDuration : (overshootTolerance === 0 || (typeof(throwProps) === "object" && throwProps.resistance > 1000)) ? 0 : 0.5), overshootTolerance);
							if (!vars.fastMode) {
								//to populate the end values, we just scrub the tween to the end, record the values, and then jump back to the beginning.
								if (scrollProxy) {
									scrollProxy._suspendTransforms = true; //Microsoft browsers have a bug that causes them to briefly render the position incorrectly (it flashes to the end state when we seek() the tween even though we jump right back to the current position, and this only seems to happen when we're affecting both top and left), so we set a _suspendTransforms flag to prevent it from actually applying the values in the ScrollProxy.
								}
								tween.render(tween.duration(), true, true);
								syncXY(true, true);
								self.endX = self.x;
								self.endY = self.y;
								if (rotationMode) {
									self.endRotation = self.x;
								}
								tween.play(0);
								syncXY(true, true);
								if (scrollProxy) {
									scrollProxy._suspendTransforms = false;
								}
							}
						} else if (hasBounds) {
							self.applyBounds();
						}
					},

					updateMatrix = function(shiftStart) {
						var start = matrix || [1,0,0,1,0,0],
							a, b, c, d, tx, ty, determinant, pointerX, pointerY;
						matrix = _getConcatenatedMatrix(target.parentNode, true);
						if (shiftStart && self.isPressed && start.join(",") !== matrix.join(",")) { //if the matrix changes WHILE the element is pressed, we must adjust the startPointerX and startPointerY accordingly, so we invert the original matrix and figure out where the pointerX and pointerY were in the global space, then apply the new matrix to get the updated coordinates.
							a = start[0];
							b = start[1];
							c = start[2];
							d = start[3];
							tx = start[4];
							ty = start[5];
							determinant = (a * d - b * c);
							pointerX = startPointerX * (d / determinant) + startPointerY * (-c / determinant) + ((c * ty - d * tx) / determinant);
							pointerY = startPointerX * (-b / determinant) + startPointerY * (a / determinant) + (-(a * ty - b * tx) / determinant);
							startPointerY = pointerX * matrix[1] + pointerY * matrix[3] + matrix[5];
							startPointerX = pointerX * matrix[0] + pointerY * matrix[2] + matrix[4];
						}
						if (!matrix[1] && !matrix[2] && matrix[0] == 1 && matrix[3] == 1 && matrix[4] == 0 && matrix[5] == 0) { //if there are no transforms, we can optimize performance by not factoring in the matrix
							matrix = null;
						}

					},

					recordStartPositions = function() {
						var edgeTolerance = 1 - self.edgeResistance;
						updateMatrix(false);
						if (matrix) {
							startPointerX = self.pointerX * matrix[0] + self.pointerY * matrix[2] + matrix[4]; //translate to local coordinate system
							startPointerY = self.pointerX * matrix[1] + self.pointerY * matrix[3] + matrix[5];
						}
						if (dirty) {
							setPointerPosition(self.pointerX, self.pointerY);
							render(true);
						}
						if (scrollProxy) {
							calculateBounds();
							startElementY = scrollProxy.top();
							startElementX = scrollProxy.left();
						} else {
							//if the element is in the process of tweening, don't force snapping to occur because it could make it jump. Imagine the user throwing, then before it's done, clicking on the element in its inbetween state.
							if (isTweening()) {
								syncXY(true, true);
								calculateBounds();
							} else {
								self.applyBounds();
							}
							if (rotationMode) {
								rotationOrigin = self.rotationOrigin = _localToGlobal(target, {x:0, y:0});
								syncXY(true, true);
								startElementX = self.x; //starting rotation (x always refers to rotation in type:"rotation", measured in degrees)
								startElementY = self.y = Math.atan2(rotationOrigin.y - self.pointerY, self.pointerX - rotationOrigin.x) * _RAD2DEG;
							} else {
								startScrollTop = target.parentNode ? target.parentNode.scrollTop || 0 : 0;
								startScrollLeft = target.parentNode ? target.parentNode.scrollLeft || 0 : 0;
								startElementY = _getStyle(target, yProp); //record the starting top and left values so that we can just add the mouse's movement to them later.
								startElementX = _getStyle(target, xProp);
							}
						}
						if (hasBounds && edgeTolerance) {
							if (startElementX > maxX) {
								startElementX = maxX + (startElementX - maxX) / edgeTolerance;
							} else if (startElementX < minX) {
								startElementX = minX - (minX - startElementX) / edgeTolerance;
							}
							if (!rotationMode) {
								if (startElementY > maxY) {
									startElementY = maxY + (startElementY - maxY) / edgeTolerance;
								} else if (startElementY < minY) {
									startElementY = minY - (minY - startElementY) / edgeTolerance;
								}
							}
						}
						self.startX = startElementX;
						self.startY = startElementY;
					},

					isTweening = function() {
						return (self.tween && self.tween.isActive());
					},

					removePlaceholder = function() {
						if (_placeholderDiv.parentNode && !isTweening() && !self.isDragging) { //_placeholderDiv just props open auto-scrolling containers so they don't collapse as the user drags left/up. We remove it after dragging (and throwing, if necessary) finishes.
							_placeholderDiv.parentNode.removeChild(_placeholderDiv);
						}
					},

					buildSnapFunc = function(snap, min, max, factor) {
						if (typeof(snap) === "function") {
							return function(n) {
								var edgeTolerance = !self.isPressed ? 1 : 1 - self.edgeResistance; //if we're tweening, disable the edgeTolerance because it's already factored into the tweening values (we don't want to apply it multiple times)
								return snap.call(self, (n > max ? max + (n - max) * edgeTolerance : (n < min) ? min + (n - min) * edgeTolerance : n)) * factor;
							};
						}
						if (snap instanceof Array) {
							return function(n) {
								var i = snap.length,
									closest = 0,
									absDif = _max,
									val, dif;
								while (--i > -1) {
									val = snap[i];
									dif = val - n;
									if (dif < 0) {
										dif = -dif;
									}
									if (dif < absDif && val >= min && val <= max) {
										closest = i;
										absDif = dif;
									}
								}
								return snap[closest];
							};
						}
						return isNaN(snap) ? function(n) { return n; } : function() { return snap * factor; };
					},

					buildPointSnapFunc = function(snap, minX, maxX, minY, maxY, radius, factor) {
						radius = (radius && radius < _max) ? radius * radius : _max; //so we don't have to Math.sqrt() in the functions. Performance optimization.
						if (typeof(snap) === "function") {
							return function(point) {
								var edgeTolerance = !self.isPressed ? 1 : 1 - self.edgeResistance,
									x = point.x,
									y = point.y,
									result, dx, dy; //if we're tweening, disable the edgeTolerance because it's already factored into the tweening values (we don't want to apply it multiple times)
								point.x = x = (x > maxX ? maxX + (x - maxX) * edgeTolerance : (x < minX) ? minX + (x - minX) * edgeTolerance : x);
								point.y = y = (y > maxY ? maxY + (y - maxY) * edgeTolerance : (y < minY) ? minY + (y - minY) * edgeTolerance : y);
								result = snap.call(self, point);
								if (result !== point) {
									point.x = result.x;
									point.y = result.y;
								}
								if (factor !== 1) {
									point.x *= factor;
									point.y *= factor;
								}
								if (radius < _max) {
									dx = point.x - x;
									dy = point.y - y;
									if (dx * dx + dy * dy > radius) {
										point.x = x;
										point.y = y;
									}
								}
								return point;
							};
						}
						if (snap instanceof Array) {
							return function(p) {
								var i = snap.length,
									closest = 0,
									minDist = _max,
									x, y, point, dist;
								while (--i > -1) {
									point = snap[i];
									x = point.x - p.x;
									y = point.y - p.y;
									dist = x * x + y * y;
									if (dist < minDist) {
										closest = i;
										minDist = dist;
									}
								}
								return (minDist <= radius) ? snap[closest] : p;
							};
						}
						return function(n) { return n; };
					},

					//called when the mouse is pressed (or touch starts)
					onPress = function(e, force) {
						var i;
						if (!enabled || self.isPressed || !e || ((e.type === "mousedown" || e.type === "pointerdown") && !force && _getTime() - clickTime < 30 && _touchEventLookup[self.pointerEvent.type])) { //when we DON'T preventDefault() in order to accommodate touch-scrolling and the user just taps, many browsers also fire a mousedown/mouseup sequence AFTER the touchstart/touchend sequence, thus it'd result in two quick "click" events being dispatched. This line senses that condition and halts it on the subsequent mousedown.
							return;
						}
						interrupted = isTweening();
						self.pointerEvent = e;
						if (_touchEventLookup[e.type]) { //note: on iOS, BOTH touchmove and mousemove are dispatched, but the mousemove has pageY and pageX of 0 which would mess up the calculations and needlessly hurt performance.
							touchEventTarget = (e.type.indexOf("touch") !== -1) ? (e.currentTarget || e.target) : _doc; //pointer-based touches (for Microsoft browsers) don't remain locked to the original target like other browsers, so we must use the document instead. The event type would be "MSPointerDown" or "pointerdown".
							_addListener(touchEventTarget, "touchend", onRelease);
							_addListener(touchEventTarget, "touchmove", onMove);
							_addListener(touchEventTarget, "touchcancel", onRelease);
							_addListener(_doc, "touchstart", _onMultiTouchDocument);
						} else {
							touchEventTarget = null;
							_addListener(_doc, "mousemove", onMove); //attach these to the document instead of the box itself so that if the user's mouse moves too quickly (and off of the box), things still work.
						}
						touchDragAxis = null;
						_addListener(_doc, "mouseup", onRelease);
						if (e && e.target) {
							_addListener(e.target, "mouseup", onRelease); //we also have to listen directly on the element because some browsers don't bubble up the event to the _doc on elements with contentEditable="true"
						}
						isClicking = (isClickable.call(self, e.target) && !vars.dragClickables && !force);
						if (isClicking) {
							_addListener(e.target, "change", onRelease); //in some browsers, when you mousedown on a <select> element, no mouseup gets dispatched! So we listen for a "change" event instead.
							_dispatchEvent(self, "pressInit", "onPressInit");
							_dispatchEvent(self, "press", "onPress");
							_setSelectable(triggers, true); //accommodates things like inputs and elements with contentEditable="true" (otherwise user couldn't drag to select text)
							return;
						}
						allowNativeTouchScrolling = (!touchEventTarget || allowX === allowY || self.vars.allowNativeTouchScrolling === false || (self.vars.allowContextMenu && e && (e.ctrlKey || e.which > 2))) ? false : allowX ? "y" : "x"; //note: in Chrome, right-clicking (for a context menu) fires onPress and it doesn't have the event.which set properly, so we must look for event.ctrlKey. If the user wants to allow context menus we should of course sense it here and not allow native touch scrolling.
						if (_isOldIE) {
							e = _populateIEEvent(e, true);
						} else if (!allowNativeTouchScrolling && !self.allowEventDefault) {
							e.preventDefault();
							if (e.preventManipulation) {
								e.preventManipulation();  //for some Microsoft browsers
							}
						}
						if (e.changedTouches) { //touch events store the data slightly differently
							e = touch = e.changedTouches[0];
							touchID = e.identifier;
						} else if (e.pointerId) {
							touchID = e.pointerId; //for some Microsoft browsers
						} else {
							touch = touchID = null;
						}
						_dragCount++;
						_addToRenderQueue(render); //causes the Draggable to render on each "tick" of TweenLite.ticker (performance optimization - updating values in a mousemove can cause them to happen too frequently, like multiple times between frame redraws which is wasteful, and it also prevents values from updating properly in IE8)
						startPointerY = self.pointerY = e.pageY; //record the starting x and y so that we can calculate the movement from the original in _onMouseMove
						startPointerX = self.pointerX = e.pageX;
						_dispatchEvent(self, "pressInit", "onPressInit");
						if (allowNativeTouchScrolling || self.autoScroll) {
							_recordMaxScrolls(target.parentNode);
						}
						if (target.parentNode && self.autoScroll && !scrollProxy && !rotationMode && target.parentNode._gsMaxScrollX && !_placeholderDiv.parentNode && !target.getBBox) { //add a placeholder div to prevent the parent container from collapsing when the user drags the element left.
							_placeholderDiv.style.width = target.parentNode.scrollWidth + "px";
							target.parentNode.appendChild(_placeholderDiv);
						}
						recordStartPositions();
						if (self.tween) {
							self.tween.kill();
						}
						self.isThrowing = false;
						_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].killTweensOf(scrollProxy || target, true, killProps); //in case the user tries to drag it before the last tween is done.
						if (scrollProxy) {
							_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].killTweensOf(target, true, {scrollTo:1}); //just in case the original target's scroll position is being tweened somewhere else.
						}
						self.tween = self.lockedAxis = null;
						if (vars.zIndexBoost || (!rotationMode && !scrollProxy && vars.zIndexBoost !== false)) {
							target.style.zIndex = Draggable.zIndex++;
						}
						self.isPressed = true;
						hasDragCallback = !!(vars.onDrag || self._listeners.drag);
						if (!rotationMode) {
							i = triggers.length;
							while (--i > -1) {
								_setStyle(triggers[i], "cursor", vars.cursor || "move");
							}
						}
						_dispatchEvent(self, "press", "onPress");
					},

					//called every time the mouse/touch moves
					onMove = function(e) {
						var originalEvent = e,
							touches, pointerX, pointerY, i, dx, dy;
						if (!enabled || _isMultiTouching || !self.isPressed || !e) {
							return;
						}
						self.pointerEvent = e;
						touches = e.changedTouches;
						if (touches) { //touch events store the data slightly differently
							e = touches[0];
							if (e !== touch && e.identifier !== touchID) { //Usually changedTouches[0] will be what we're looking for, but in case it's not, look through the rest of the array...(and Android browsers don't reuse the event like iOS)
								i = touches.length;
								while (--i > -1 && (e = touches[i]).identifier !== touchID) {}
								if (i < 0) {
									return;
								}
							}
						} else if (e.pointerId && touchID && e.pointerId !== touchID) { //for some Microsoft browsers, we must attach the listener to the doc rather than the trigger so that when the finger moves outside the bounds of the trigger, things still work. So if the event we're receiving has a pointerId that doesn't match the touchID, ignore it (for multi-touch)
							return;
						}
						if (_isOldIE) {
							e = _populateIEEvent(e, true);
						} else {
							if (touchEventTarget && allowNativeTouchScrolling && !touchDragAxis) { //Android browsers force us to decide on the first "touchmove" event if we should allow the default (scrolling) behavior or preventDefault(). Otherwise, a "touchcancel" will be fired and then no "touchmove" or "touchend" will fire during the scrolling (no good).
								pointerX = e.pageX;
								pointerY = e.pageY;
								if (matrix) {
									i = pointerX * matrix[0] + pointerY * matrix[2] + matrix[4];
									pointerY = pointerX * matrix[1] + pointerY * matrix[3] + matrix[5];
									pointerX = i;
								}
								dx = Math.abs(pointerX - startPointerX);
								dy = Math.abs(pointerY - startPointerY);
								if ((dx !== dy && (dx > minimumMovement || dy > minimumMovement)) || (_isAndroid && allowNativeTouchScrolling === touchDragAxis)) {
									touchDragAxis = (dx > dy && allowX) ? "x" : "y";
									if (self.vars.lockAxisOnTouchScroll !== false) {
										self.lockedAxis = (touchDragAxis === "x") ? "y" : "x";
										if (typeof(self.vars.onLockAxis) === "function") {
											self.vars.onLockAxis.call(self, originalEvent);
										}
									}
									if (_isAndroid && allowNativeTouchScrolling === touchDragAxis) {
										onRelease(originalEvent);
										return;
									}
								}
							}
							if (!self.allowEventDefault && (!allowNativeTouchScrolling || (touchDragAxis && allowNativeTouchScrolling !== touchDragAxis)) && originalEvent.cancelable !== false) {
								originalEvent.preventDefault();
								if (originalEvent.preventManipulation) { //for some Microsoft browsers
									originalEvent.preventManipulation();
								}
							}
						}
						if (self.autoScroll) {
							checkAutoScrollBounds = true;
						}
						setPointerPosition(e.pageX, e.pageY);
					},

					setPointerPosition = function(pointerX, pointerY) {
						var dragTolerance = 1 - self.dragResistance,
							edgeTolerance = 1 - self.edgeResistance,
							xChange, yChange, x, y, dif, temp;

						self.pointerX = pointerX;
						self.pointerY = pointerY;
						if (rotationMode) {
							y = Math.atan2(rotationOrigin.y - pointerY, pointerX - rotationOrigin.x) * _RAD2DEG;
							dif = self.y - y;
							if (dif > 180) {
								startElementY -= 360;
								self.y = y;
							} else if (dif < -180) {
								startElementY += 360;
								self.y = y;
							}
							if (self.x !== startElementX || Math.abs(startElementY - y) > minimumMovement) {
								self.y = y;
								x = startElementX + (startElementY - y) * dragTolerance;
							} else {
								x = startElementX;
							}

						} else {
							if (matrix) {
								temp = pointerX * matrix[0] + pointerY * matrix[2] + matrix[4];
								pointerY = pointerX * matrix[1] + pointerY * matrix[3] + matrix[5];
								pointerX = temp;
							}
							yChange = (pointerY - startPointerY);
							xChange = (pointerX - startPointerX);
							if (yChange < minimumMovement && yChange > -minimumMovement) {
								yChange = 0;
							}
							if (xChange < minimumMovement && xChange > -minimumMovement) {
								xChange = 0;
							}
							if ((self.lockAxis || self.lockedAxis) && (xChange || yChange)) {
								temp = self.lockedAxis;
								if (!temp) {
									self.lockedAxis = temp = (allowX && Math.abs(xChange) > Math.abs(yChange)) ? "y" : allowY ? "x" : null;
									if (temp && typeof(self.vars.onLockAxis) === "function") {
										self.vars.onLockAxis.call(self, self.pointerEvent);
									}
								}
								if (temp === "y") {
									yChange = 0;
								} else if (temp === "x") {
									xChange = 0;
								}
							}
							x = startElementX + xChange * dragTolerance;
							y = startElementY + yChange * dragTolerance;
						}

						if ((snapX || snapY || snapXY) && (self.x !== x || (self.y !== y && !rotationMode))) {
							if (snapXY) {
								_temp1.x = x;
								_temp1.y = y;
								temp = snapXY(_temp1);
								x = temp.x;
								y = temp.y;
							}
							if (snapX) {
								x = snapX(x);
							}
							if (snapY) {
								y = snapY(y);
							}
						} else if (hasBounds) {
							if (x > maxX) {
								x = maxX + (x - maxX) * edgeTolerance;
							} else if (x < minX) {
								x = minX + (x - minX) * edgeTolerance;
							}
							if (!rotationMode) {
								if (y > maxY) {
									y = maxY + (y - maxY) * edgeTolerance;
								} else if (y < minY) {
									y = minY + (y - minY) * edgeTolerance;
								}
							}
						}
						if (!rotationMode && !matrix) {
							x = Math.round(x); //helps work around an issue with some Win Touch devices
							y = Math.round(y);
						}
						if (self.x !== x || (self.y !== y && !rotationMode)) {
							if (rotationMode) {
								self.endRotation = self.x = self.endX = x;
								dirty = true;
							} else {
								if (allowY) {
									self.y = self.endY = y;
									dirty = true; //a flag that indicates we need to render the target next time the TweenLite.ticker dispatches a "tick" event (typically on a requestAnimationFrame) - this is a performance optimization (we shouldn't render on every move because sometimes many move events can get dispatched between screen refreshes, and that'd be wasteful to render every time)
								}
								if (allowX) {
									self.x = self.endX = x;
									dirty = true;
								}
							}
							if (!self.isDragging && self.isPressed) {
								self.isDragging = true;
								_dispatchEvent(self, "dragstart", "onDragStart");
							}
						}
					},

					//called when the mouse/touch is released
					onRelease = function(e, force) {
						if (!enabled || !self.isPressed || (e && touchID != null && !force && ((e.pointerId && e.pointerId !== touchID) || (e.changedTouches && !_hasTouchID(e.changedTouches, touchID))))) {  //for some Microsoft browsers, we must attach the listener to the doc rather than the trigger so that when the finger moves outside the bounds of the trigger, things still work. So if the event we're receiving has a pointerId that doesn't match the touchID, ignore it (for multi-touch)
							return;
						}
						self.isPressed = false;
						var originalEvent = e,
							wasDragging = self.isDragging,
							isContextMenuRelease = (self.vars.allowContextMenu && e && (e.ctrlKey || e.which > 2)),
							placeholderDelayedCall = _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].delayedCall(0.001, removePlaceholder),
							touches, i, syntheticEvent, eventTarget, syntheticClick;
						if (touchEventTarget) {
							_removeListener(touchEventTarget, "touchend", onRelease);
							_removeListener(touchEventTarget, "touchmove", onMove);
							_removeListener(touchEventTarget, "touchcancel", onRelease);
							_removeListener(_doc, "touchstart", _onMultiTouchDocument);
						} else {
							_removeListener(_doc, "mousemove", onMove);
						}
						_removeListener(_doc, "mouseup", onRelease);
						if (e && e.target) {
							_removeListener(e.target, "mouseup", onRelease);
						}
						dirty = false;
						if (isClicking && !isContextMenuRelease) {
							if (e) {
								_removeListener(e.target, "change", onRelease);
								self.pointerEvent = originalEvent;
							}
							_setSelectable(triggers, false);
							_dispatchEvent(self, "release", "onRelease");
							_dispatchEvent(self, "click", "onClick");
							isClicking = false;
							return;
						}
						_removeFromRenderQueue(render);
						if (!rotationMode) {
							i = triggers.length;
							while (--i > -1) {
								_setStyle(triggers[i], "cursor", vars.cursor || "move");
							}
						}
						if (wasDragging) {
							dragEndTime = _lastDragTime = _getTime();
							self.isDragging = false;
						}
						_dragCount--;
						if (e) {
							if (_isOldIE) {
								e = _populateIEEvent(e, false);
							}
							touches = e.changedTouches;
							if (touches) { //touch events store the data slightly differently
								e = touches[0];
								if (e !== touch && e.identifier !== touchID) { //Usually changedTouches[0] will be what we're looking for, but in case it's not, look through the rest of the array...(and Android browsers don't reuse the event like iOS)
									i = touches.length;
									while (--i > -1 && (e = touches[i]).identifier !== touchID) {}
									if (i < 0) {
										return;
									}
								}
							}
							self.pointerEvent = originalEvent;
							self.pointerX = e.pageX;
							self.pointerY = e.pageY;
						}
						if (isContextMenuRelease && originalEvent) {
							originalEvent.preventDefault();
							if (originalEvent.preventManipulation) {
								originalEvent.preventManipulation();  //for some Microsoft browsers
							}
							_dispatchEvent(self, "release", "onRelease");
						} else if (originalEvent && !wasDragging) {
							if (interrupted && (vars.snap || vars.bounds)) { //otherwise, if the user clicks on the object while it's animating to a snapped position, and then releases without moving 3 pixels, it will just stay there (it should animate/snap)
								animate(vars.throwProps);
							}
							_dispatchEvent(self, "release", "onRelease");
							if ((!_isAndroid || originalEvent.type !== "touchmove") && originalEvent.type.indexOf("cancel") === -1) { //to accommodate native scrolling on Android devices, we have to immediately call onRelease() on the first touchmove event, but that shouldn't trigger a "click".
								_dispatchEvent(self, "click", "onClick");
								if (_getTime() - clickTime < 300) {
									_dispatchEvent(self, "doubleclick", "onDoubleClick");
								}
								eventTarget = originalEvent.target || originalEvent.srcElement || target; //old IE uses srcElement
								clickTime = _getTime();
								syntheticClick = function () { // some browsers (like Firefox) won't trust script-generated clicks, so if the user tries to click on a video to play it, for example, it simply won't work. Since a regular "click" event will most likely be generated anyway (one that has its isTrusted flag set to true), we must slightly delay our script-generated click so that the "real"/trusted one is prioritized. Remember, when there are duplicate events in quick succession, we suppress all but the first one. Some browsers don't even trigger the "real" one at all, so our synthetic one is a safety valve that ensures that no matter what, a click event does get dispatched.
									if (clickTime !== clickDispatch && self.enabled() && !self.isPressed) {
										if (eventTarget.click) { //some browsers (like mobile Safari) don't properly trigger the click event
											eventTarget.click();
										} else if (_doc.createEvent) {
											syntheticEvent = _doc.createEvent("MouseEvents");
											syntheticEvent.initMouseEvent("click", true, true, window, 1, self.pointerEvent.screenX, self.pointerEvent.screenY, self.pointerX, self.pointerY, false, false, false, false, 0, null);
											eventTarget.dispatchEvent(syntheticEvent);
										}
									}
								};
								if (!_isAndroid && !originalEvent.defaultPrevented) { //iOS Safari requires the synthetic click to happen immediately or else it simply won't work, but Android doesn't play nice.
									_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].delayedCall(0.00001, syntheticClick); //in addition to the iOS bug workaround, there's a Firefox issue with clicking on things like a video to play, so we must fake a click event in a slightly delayed fashion. Previously, we listened for the "click" event with "capture" false which solved the video-click-to-play issue, but it would allow the "click" event to be dispatched twice like if you were using a jQuery.click() because that was handled in the capture phase, thus we had to switch to the capture phase to avoid the double-dispatching, but do the delayed synthetic click.
								}
							}
						} else {
							animate(vars.throwProps); //will skip if throwProps isn't defined or ThrowPropsPlugin isn't loaded.
							if (!_isOldIE && !self.allowEventDefault && originalEvent && (vars.dragClickables || !isClickable.call(self, originalEvent.target)) && wasDragging && (!allowNativeTouchScrolling || (touchDragAxis && allowNativeTouchScrolling === touchDragAxis)) && originalEvent.cancelable !== false) {
								originalEvent.preventDefault();
								if (originalEvent.preventManipulation) {
									originalEvent.preventManipulation();  //for some Microsoft browsers
								}
							}
							_dispatchEvent(self, "release", "onRelease");
						}
						if (isTweening()) {
							placeholderDelayedCall.duration( self.tween.duration() ); //sync the timing so that the placeholder DIV gets
						}
						if (wasDragging) {
							_dispatchEvent(self, "dragend", "onDragEnd");
						}
						return true;
					},

					updateScroll = function(e) {
						if (e && self.isDragging && !scrollProxy) {
							var parent = e.target || e.srcElement || target.parentNode,
								deltaX = parent.scrollLeft - parent._gsScrollX,
								deltaY = parent.scrollTop - parent._gsScrollY;
							if (deltaX || deltaY) {
								if (matrix) {
									startPointerX -= deltaX * matrix[0] + deltaY * matrix[2];
									startPointerY -= deltaY * matrix[3] + deltaX * matrix[1];
								} else {
									startPointerX -= deltaX;
									startPointerY -= deltaY;
								}
								parent._gsScrollX += deltaX;
								parent._gsScrollY += deltaY;
								setPointerPosition(self.pointerX, self.pointerY);
							}
						}
					},

					onClick = function(e) { //this was a huge pain in the neck to align all the various browsers and their behaviors. Chrome, Firefox, Safari, Opera, Android, and Microsoft Edge all handle events differently! Some will only trigger native behavior (like checkbox toggling) from trusted events. Others don't even support isTrusted, but require 2 events to flow through before triggering native behavior. Edge treats everything as trusted but also mandates that 2 flow through to trigger the correct native behavior.
						var time = _getTime(),
							recentlyClicked = (time - clickTime < 40),
							recentlyDragged = (time - dragEndTime < 40),
							alreadyDispatched = (recentlyClicked && clickDispatch === clickTime),
							isModern = !!e.preventDefault,
							defaultPrevented = (self.pointerEvent && self.pointerEvent.defaultPrevented),
							alreadyDispatchedTrusted = (recentlyClicked && trustedClickDispatch === clickTime),
							trusted = e.isTrusted || (e.isTrusted == null && recentlyClicked && alreadyDispatched); //note: Safari doesn't support isTrusted, and it won't properly execute native behavior (like toggling checkboxes) on the first synthetic "click" event - we must wait for the 2nd and treat it as trusted (but stop propagation at that point). Confusing, I know. Don't you love cross-browser compatibility challenges?
						if (isModern && (alreadyDispatched || (recentlyDragged && self.vars.suppressClickOnDrag !== false) )) {
							e.stopImmediatePropagation();
						}
						if (recentlyClicked && !(self.pointerEvent && self.pointerEvent.defaultPrevented) && (!alreadyDispatched || (trusted !== alreadyDispatchedTrusted))) { //let the first click pass through unhindered. Let the next one only if it's trusted, then no more (stop quick-succession ones)
							if (trusted && alreadyDispatched) {
								trustedClickDispatch = clickTime;
							}
							clickDispatch = clickTime;
							return;
						}
						if (self.isPressed || recentlyDragged || recentlyClicked) {
							if (!isModern) {
								e.returnValue = false;
							} else if (!trusted || !e.detail || !recentlyClicked || defaultPrevented) {
								e.preventDefault();
								if (e.preventManipulation) {
									e.preventManipulation();  //for some Microsoft browsers
								}
							}
						}
					},

					localizePoint = function(p) {
						return matrix ? {x:p.x * matrix[0] + p.y * matrix[2] + matrix[4], y:p.x * matrix[1] + p.y * matrix[3] + matrix[5]} : {x:p.x, y:p.y};
					};

				old = Draggable.get(this.target);
				if (old) {
					old.kill(); // avoids duplicates (an element can only be controlled by one Draggable)
				}

				//give the user access to start/stop dragging...
				this.startDrag = function(e, align) {
					var r1, r2, p1, p2;
					onPress(e || self.pointerEvent, true);
					//if the pointer isn't on top of the element, adjust things accordingly
					if (align && !self.hitTest(e || self.pointerEvent)) {
						r1 = _parseRect(e || self.pointerEvent);
						r2 = _parseRect(target);
						p1 = localizePoint({x:r1.left + r1.width / 2, y:r1.top + r1.height / 2});
						p2 = localizePoint({x:r2.left + r2.width / 2, y:r2.top + r2.height / 2});
						startPointerX -= p1.x - p2.x;
						startPointerY -= p1.y - p2.y;
					}
					if (!self.isDragging) {
						self.isDragging = true;
						_dispatchEvent(self, "dragstart", "onDragStart");
					}
				};
				this.drag = onMove;
				this.endDrag = function(e) {
					onRelease(e || self.pointerEvent, true);
				};
				this.timeSinceDrag = function() {
					return self.isDragging ? 0 : (_getTime() - dragEndTime) / 1000;
				};
				this.timeSinceClick = function() {
					return (_getTime() - clickTime) / 1000;
				};
				this.hitTest = function(target, threshold) {
					return Draggable.hitTest(self.target, target, threshold);
				};

				this.getDirection = function(from, diagonalThreshold) { //from can be "start" (default), "velocity", or an element
					var mode = (from === "velocity" && ThrowPropsPlugin) ? from : (typeof(from) === "object" && !rotationMode) ? "element" : "start",
						xChange, yChange, ratio, direction, r1, r2;
					if (mode === "element") {
						r1 = _parseRect(self.target);
						r2 = _parseRect(from);
					}
					xChange = (mode === "start") ? self.x - startElementX : (mode === "velocity") ? ThrowPropsPlugin.getVelocity(this.target, xProp) : (r1.left + r1.width / 2) - (r2.left + r2.width / 2);
					if (rotationMode) {
						return xChange < 0 ? "counter-clockwise" : "clockwise";
					} else {
						diagonalThreshold = diagonalThreshold || 2;
						yChange = (mode === "start") ? self.y - startElementY : (mode === "velocity") ? ThrowPropsPlugin.getVelocity(this.target, yProp) : (r1.top + r1.height / 2) - (r2.top + r2.height / 2);
						ratio = Math.abs(xChange / yChange);
						direction = (ratio < 1 / diagonalThreshold) ? "" : (xChange < 0) ? "left" : "right";
						if (ratio < diagonalThreshold) {
							if (direction !== "") {
								direction += "-";
							}
							direction += (yChange < 0) ? "up" : "down";
						}
					}
					return direction;
				};


				this.applyBounds = function(newBounds) {
					var x, y, forceZeroVelocity, e, parent, isRoot;
					if (newBounds && vars.bounds !== newBounds) {
						vars.bounds = newBounds;
						return self.update(true);
					}
					syncXY(true);
					calculateBounds();
					if (hasBounds) {
						x = self.x;
						y = self.y;
						if (x > maxX) {
							x = maxX;
						} else if (x < minX) {
							x = minX;
						}
						if (y > maxY) {
							y = maxY;
						} else if (y < minY) {
							y = minY;
						}
						if (self.x !== x || self.y !== y) {
							forceZeroVelocity = true;
							self.x = self.endX = x;
							if (rotationMode) {
								self.endRotation = x;
							} else {
								self.y = self.endY = y;
							}
							dirty = true;
							render(true);
							if (self.autoScroll && !self.isDragging) {
								_recordMaxScrolls(target.parentNode);
								e = target;
								_windowProxy.scrollTop = ((window.pageYOffset != null) ? window.pageYOffset : (_docElement.scrollTop != null) ? _docElement.scrollTop : _doc.body.scrollTop);
								_windowProxy.scrollLeft = ((window.pageXOffset != null) ? window.pageXOffset : (_docElement.scrollLeft != null) ? _docElement.scrollLeft : _doc.body.scrollLeft);
								while (e && !isRoot) { //walk up the chain and sense wherever the scrollTop/scrollLeft exceeds the maximum.
									isRoot = _isRoot(e.parentNode);
									parent = isRoot ? _windowProxy : e.parentNode;
									if (allowY && parent.scrollTop > parent._gsMaxScrollY) {
										parent.scrollTop = parent._gsMaxScrollY;
									}
									if (allowX && parent.scrollLeft > parent._gsMaxScrollX) {
										parent.scrollLeft = parent._gsMaxScrollX;
									}
									e = parent;
								}
							}
						}
						if (self.isThrowing && (forceZeroVelocity || self.endX > maxX || self.endX < minX || self.endY > maxY || self.endY < minY)) {
							animate(vars.throwProps, forceZeroVelocity);
						}
					}
					return self;
				};

				this.update = function(applyBounds, sticky, ignoreExternalChanges) {
					var x = self.x,
						y = self.y;
					updateMatrix(!sticky);
					if (applyBounds) {
						self.applyBounds();
					} else {
						if (dirty && ignoreExternalChanges) {
							render(true);
						}
						syncXY(true);
					}
					if (sticky) {
						setPointerPosition(self.pointerX, self.pointerY);
						if (dirty) {
							render(true);
						}
					}
					if (self.isPressed && !sticky && ((allowX && Math.abs(x - self.x) > 0.01) || (allowY && (Math.abs(y - self.y) > 0.01 && !rotationMode)))) {
						recordStartPositions();
					}
					if (self.autoScroll) {
						_recordMaxScrolls(target.parentNode);
						checkAutoScrollBounds = self.isDragging;
						render(true);
					}
					if (self.autoScroll) { //in case reparenting occurred.
						_removeScrollListener(target, updateScroll);
						_addScrollListener(target, updateScroll);
					}
					return self;
				};

				this.enable = function(type) {
					var id, i, trigger;
					if (type !== "soft") {
						i = triggers.length;
						while (--i > -1) {
							trigger = triggers[i];
							_addListener(trigger, "mousedown", onPress);
							_addListener(trigger, "touchstart", onPress);
							_addListener(trigger, "click", onClick, true); //note: used to pass true for capture but it prevented click-to-play-video functionality in Firefox.
							if (!rotationMode) {
								_setStyle(trigger, "cursor", vars.cursor || "move");
							}
							_setStyle(trigger, "touchCallout", "none");
							_setStyle(trigger, "touchAction", (allowX === allowY) ? "none" : allowX ? "pan-y" : "pan-x");
							if (_isSVG(trigger)) { // a bug in chrome doesn't respect touch-action on SVG elements - it only works if we set it on the parent SVG.
								_setStyle(trigger.ownerSVGElement || trigger, "touchAction", (allowX === allowY) ? "none" : allowX ? "pan-y" : "pan-x");
							}
							if (!this.vars.allowContextMenu) {
								_addListener(trigger, "contextmenu", onContextMenu);
							}
						}
						_setSelectable(triggers, false);
					}
					_addScrollListener(target, updateScroll);
					enabled = true;
					if (ThrowPropsPlugin && type !== "soft") {
						ThrowPropsPlugin.track(scrollProxy || target, (xyMode ? "x,y" : rotationMode ? "rotation" : "top,left"));
					}
					if (scrollProxy) {
						scrollProxy.enable();
					}
					target._gsDragID = id = "d" + (_lookupCount++);
					_lookup[id] = this;
					if (scrollProxy) {
						scrollProxy.element._gsDragID = id;
					}
					_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].set(target, {x:"+=0", overwrite:false, data:"_draggable"}); //simply ensures that there's a _gsTransform on the element.
					applyObj = {
						t:target,
						data:_isOldIE ? cssVars : target._gsTransform,
						tween:{},
						setRatio:(_isOldIE ? function() { _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].set(target, tempVars); } : _CSSPlugin_js__WEBPACK_IMPORTED_MODULE_1__[/* default */ "a"]._internals.setTransformRatio || _CSSPlugin_js__WEBPACK_IMPORTED_MODULE_1__[/* default */ "a"]._internals.set3DTransformRatio)
					};
					recordStartPositions();
					self.update(true);
					return self;
				};

				this.disable = function(type) {
					var dragging = self.isDragging,
						i, trigger;
					if (!rotationMode) {
						i = triggers.length;
						while (--i > -1) {
							_setStyle(triggers[i], "cursor", null);
						}
					}
					if (type !== "soft") {
						i = triggers.length;
						while (--i > -1) {
							trigger = triggers[i];
							_setStyle(trigger, "touchCallout", null);
							_setStyle(trigger, "touchAction", null);
							_removeListener(trigger, "mousedown", onPress);
							_removeListener(trigger, "touchstart", onPress);
							_removeListener(trigger, "click", onClick);
							_removeListener(trigger, "contextmenu", onContextMenu);
						}
						_setSelectable(triggers, true);
						if (touchEventTarget) {
							_removeListener(touchEventTarget, "touchcancel", onRelease);
							_removeListener(touchEventTarget, "touchend", onRelease);
							_removeListener(touchEventTarget, "touchmove", onMove);
						}
						_removeListener(_doc, "mouseup", onRelease);
						_removeListener(_doc, "mousemove", onMove);
					}
					_removeScrollListener(target, updateScroll);
					enabled = false;
					if (ThrowPropsPlugin && type !== "soft") {
						ThrowPropsPlugin.untrack(scrollProxy || target, (xyMode ? "x,y" : rotationMode ? "rotation" : "top,left"));
					}
					if (scrollProxy) {
						scrollProxy.disable();
					}
					_removeFromRenderQueue(render);
					self.isDragging = self.isPressed = isClicking = false;
					if (dragging) {
						_dispatchEvent(self, "dragend", "onDragEnd");
					}
					return self;
				};

				this.enabled = function(value, type) {
					return arguments.length ? (value ? self.enable(type) : self.disable(type)) : enabled;
				};

				this.kill = function() {
					self.isThrowing = false;
					_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].killTweensOf(scrollProxy || target, true, killProps);
					self.disable();
					_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].set(triggers, {clearProps:"userSelect"});
					delete _lookup[target._gsDragID];
					return self;
				};

				if (type.indexOf("scroll") !== -1) {
					scrollProxy = this.scrollProxy = new ScrollProxy(target, _extend({onKill:function() { //ScrollProxy's onKill() gets called if/when the ScrollProxy senses that the user interacted with the scroll position manually (like using the scrollbar). IE9 doesn't fire the "mouseup" properly when users drag the scrollbar of an element, so this works around that issue.
						if (self.isPressed) {
							onRelease(null);
						}}}, vars));
					//a bug in many Android devices' stock browser causes scrollTop to get forced back to 0 after it is altered via JS, so we set overflow to "hidden" on mobile/touch devices (they hide the scroll bar anyway). That works around the bug. (This bug is discussed at https://code.google.com/p/android/issues/detail?id=19625)
					target.style.overflowY = (allowY && !_isTouchDevice) ? "auto" : "hidden";
					target.style.overflowX = (allowX && !_isTouchDevice) ? "auto" : "hidden";
					target = scrollProxy.content;
				}

				if (vars.force3D !== false) {
					_TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].set(target, {force3D:true}); //improve performance by forcing a GPU layer when possible
				}
				if (rotationMode) {
					killProps.rotation = 1;
				} else {
					if (allowX) {
						killProps[xProp] = 1;
					}
					if (allowY) {
						killProps[yProp] = 1;
					}
				}
				if (rotationMode) {
					tempVars = _tempVarsRotation;
					cssVars = tempVars.css;
					tempVars.overwrite = false;
				} else if (xyMode) {
					tempVars = (allowX && allowY) ? _tempVarsXY : allowX ? _tempVarsX : _tempVarsY;
					cssVars = tempVars.css;
					tempVars.overwrite = false;
				}

				this.enable();
			},
			p = Draggable.prototype = new _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* EventDispatcher */ "c"]();

		p.constructor = Draggable;
		p.pointerX = p.pointerY = p.startX = p.startY = p.deltaX = p.deltaY = 0;
		p.isDragging = p.isPressed = false;
		Draggable.version = "0.16.5";
		Draggable.zIndex = 1000;

		_addListener(_doc, "touchcancel", function() {
			//some older Android devices intermittently stop dispatching "touchmove" events if we don't listen for "touchcancel" on the document. Very strange indeed.
		});
		_addListener(_doc, "contextmenu", function(e) {
			var p;
			for (p in _lookup) {
				if (_lookup[p].isPressed) {
					_lookup[p].endDrag();
				}
			}
		});

		Draggable.create = function(targets, vars) {
			if (typeof(targets) === "string") {
				targets = _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* default */ "k"].selector(targets);
			}
			var a = (!targets || targets.length === 0) ? [] : _isArrayLike(targets) ? _flattenArray(targets) : [targets],
				i = a.length;
			while (--i > -1) {
				a[i] = new Draggable(a[i], vars);
			}
			return a;
		};

		Draggable.get = function(target) {
			return _lookup[(_unwrapElement(target) || {})._gsDragID];
		};

		Draggable.timeSinceDrag = function() {
			return (_getTime() - _lastDragTime) / 1000;
		};

		var _tempRect = {}, //reuse to reduce garbage collection tasks
			_oldIERect = function(e) { //IE8 doesn't support getBoundingClientRect(), so we use this as a backup.
				var top = 0,
					left = 0,
					width, height;
				e = _unwrapElement(e);
				width = e.offsetWidth;
				height = e.offsetHeight;
				while(e) {
					top += e.offsetTop;
					left += e.offsetLeft;
					e = e.offsetParent;
				}
				return {top: top, left: left, width: width, height: height};
			},
			_parseRect = function(e, undefined) { //accepts a DOM element, a mouse event, or a rectangle object and returns the corresponding rectangle with left, right, width, height, top, and bottom properties
				if (e === window) {
					_tempRect.left = _tempRect.top = 0;
					_tempRect.width = _tempRect.right = _docElement.clientWidth || e.innerWidth || _doc.body.clientWidth || 0;
					_tempRect.height = _tempRect.bottom = ((e.innerHeight || 0) - 20 < _docElement.clientHeight) ? _docElement.clientHeight : e.innerHeight || _doc.body.clientHeight || 0;
					return _tempRect;
				}
				var r = (e.pageX !== undefined) ? {left:e.pageX - _getDocScrollLeft(), top:e.pageY - _getDocScrollTop(), right:e.pageX - _getDocScrollLeft() + 1, bottom:e.pageY - _getDocScrollTop() + 1} : (!e.nodeType && e.left !== undefined && e.top !== undefined) ? e : _isOldIE ? _oldIERect(e) : _unwrapElement(e).getBoundingClientRect();
				if (r.right === undefined && r.width !== undefined) {
					r.right = r.left + r.width;
					r.bottom = r.top + r.height;
				} else if (r.width === undefined) { //some browsers don't include width and height properties. We can't just set them directly on r because some browsers throw errors, so create a new generic object.
					r = {width: r.right - r.left, height: r.bottom - r.top, right: r.right, left: r.left, bottom: r.bottom, top: r.top};
				}
				return r;
			};

		Draggable.hitTest = function(obj1, obj2, threshold) {
			if (obj1 === obj2) {
				return false;
			}
			var r1 = _parseRect(obj1),
				r2 = _parseRect(obj2),
				isOutside = (r2.left > r1.right || r2.right < r1.left || r2.top > r1.bottom || r2.bottom < r1.top),
				overlap, area, isRatio;
			if (isOutside || !threshold) {
				return !isOutside;
			}
			isRatio = ((threshold + "").indexOf("%") !== -1);
			threshold = parseFloat(threshold) || 0;
			overlap = {left:Math.max(r1.left, r2.left), top:Math.max(r1.top, r2.top)};
			overlap.width = Math.min(r1.right, r2.right) - overlap.left;
			overlap.height = Math.min(r1.bottom, r2.bottom) - overlap.top;
			if (overlap.width < 0 || overlap.height < 0) {
				return false;
			}
			if (isRatio) {
				threshold *= 0.01;
				area = overlap.width * overlap.height;
				return (area >= r1.width * r1.height * threshold || area >= r2.width * r2.height * threshold);
			}
			return (overlap.width > threshold && overlap.height > threshold);
		};

		_placeholderDiv.style.cssText = "visibility:hidden;height:1px;top:-1px;pointer-events:none;position:relative;clear:both;";

		return Draggable;

	}, true);

var Draggable = _TweenLite_js__WEBPACK_IMPORTED_MODULE_0__[/* globals */ "l"].Draggable;
__webpack_require__.r(__webpack_exports__);

// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/classCallCheck.js
var classCallCheck = __webpack_require__(3);
var classCallCheck_default = /*#__PURE__*/__webpack_require__.n(classCallCheck);

// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/createClass.js
var createClass = __webpack_require__(4);
var createClass_default = /*#__PURE__*/__webpack_require__.n(createClass);

// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/assertThisInitialized.js
var assertThisInitialized = __webpack_require__(7);
var assertThisInitialized_default = /*#__PURE__*/__webpack_require__.n(assertThisInitialized);

// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/inherits.js
var inherits = __webpack_require__(5);
var inherits_default = /*#__PURE__*/__webpack_require__.n(inherits);

// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/possibleConstructorReturn.js
var possibleConstructorReturn = __webpack_require__(6);
var possibleConstructorReturn_default = /*#__PURE__*/__webpack_require__.n(possibleConstructorReturn);

// EXTERNAL MODULE: ./node_modules/@babel/runtime/helpers/getPrototypeOf.js
var getPrototypeOf = __webpack_require__(2);
var getPrototypeOf_default = /*#__PURE__*/__webpack_require__.n(getPrototypeOf);

// EXTERNAL MODULE: ./themes/rezozero/src/js/interactive-scroller/scss/styles.scss
var styles = __webpack_require__(187);

// EXTERNAL MODULE: ./node_modules/gsap/index.js
var gsap = __webpack_require__(0);

// EXTERNAL MODULE: ./node_modules/gsap/Draggable.js
var Draggable = __webpack_require__(35);

// CONCATENATED MODULE: ./themes/rezozero/src/js/interactive-scroller/js/States.js
/*
 * Copyright © 2018, Rezo Zero
 *
 * @file States.js
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */
var INITIAL = 'INITIAL';
var COMPACT = 'COMPACT';
var EXPANDED = 'EXPANDED';
var FINAL = 'FINAL';
// CONCATENATED MODULE: ./themes/rezozero/src/js/interactive-scroller/js/EventEmitter.js



function _createForOfIteratorHelper(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }

function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }

function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }

/*
 * Copyright © 2018, Rezo Zero
 *
 * @file EventEmitter.js
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */
var EventEmitter_EventEmitter = /*#__PURE__*/function () {
  function EventEmitter() {
    classCallCheck_default()(this, EventEmitter);

    this._triggers = {};
  }

  createClass_default()(EventEmitter, [{
    key: "dispatchEvent",
    value: function dispatchEvent(eventName, params) {
      var callbacks = this._triggers[eventName];

      if (callbacks && callbacks.length) {
        var _iterator = _createForOfIteratorHelper(callbacks),
            _step;

        try {
          for (_iterator.s(); !(_step = _iterator.n()).done;) {
            var callback = _step.value;
            callback(params);
          }
        } catch (err) {
          _iterator.e(err);
        } finally {
          _iterator.f();
        }
      }
    }
  }, {
    key: "on",
    value: function on(eventName, callback) {
      if (!this._triggers[eventName]) {
        this._triggers[eventName] = [];
      }

      this._triggers[eventName].push(callback);
    }
  }, {
    key: "off",
    value: function off(eventName, callbackToRemove) {
      var callbacks = this._triggers[eventName];

      if (callbacks && callbacks.length) {
        for (var i in callbacks) {
          if (callbacks.hasOwnProperty(i)) {
            var callback = callbacks[i];

            if (callback === callbackToRemove) {
              callbacks.splice(i, 1);
            }
          }
        }
      }
    }
  }]);

  return EventEmitter;
}();


// CONCATENATED MODULE: ./themes/rezozero/src/js/interactive-scroller/interactive-scroller.js







function interactive_scroller_createForOfIteratorHelper(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = interactive_scroller_unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }

function interactive_scroller_unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return interactive_scroller_arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return interactive_scroller_arrayLikeToArray(o, minLen); }

function interactive_scroller_arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }

function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = getPrototypeOf_default()(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = getPrototypeOf_default()(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return possibleConstructorReturn_default()(this, result); }; }

function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }

/*
 * Copyright © 2018, Rezo Zero
 *
 * @file interactive-scroller.js
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */






var interactive_scroller_InteractiveScroller = /*#__PURE__*/function (_EventEmitter) {
  inherits_default()(InteractiveScroller, _EventEmitter);

  var _super = _createSuper(InteractiveScroller);

  function InteractiveScroller() {
    var _this;

    var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

    classCallCheck_default()(this, InteractiveScroller);

    _this = _super.call(this);
    _this.options = options; // Main container

    _this.container = document.getElementById('interactive-scroller');

    if (!_this.container) {
      throw new Error('No container found (#inteactive-scroller)');
    } // Elements


    _this.layouts = _this.container.querySelectorAll('.interactive-scroller__layout');
    _this.layoutInners = _this.container.querySelectorAll('.interactive-scroller__layout-inner');
    _this.cursors = _this.container.querySelectorAll('.interactive-scroller__cursor');
    _this.cursorContainers = _this.container.querySelectorAll('.interactive-scroller__cursor-container');
    _this.lines = _this.container.querySelectorAll('.interactive-scroller__line');
    _this.lineContainers = _this.container.querySelectorAll('.interactive-scroller__line-container');
    _this.overAreas = _this.container.querySelectorAll('.interactive-scroller__over-area');
    _this.labels = _this.container.querySelectorAll('.interactive-scroller__label'); // Values

    _this.windowHeight = 0;
    _this.halfWindowHeight = 0;
    _this.currentLayoutIndex = null;
    _this.previousState = null;
    _this.currentState = null;
    _this.latestCursorPosY = 0;
    _this.isLock = false;
    _this.draggables = [];
    _this.areaIsOver = false;
    _this.cursorPositionY = _this.options.cursorPositionY || 200;
    _this.cursorPositionYEnd = _this.options.cursorPositionYEnd || 50;
    _this.lineHeightReduce = _this.options.lineHeightReduce || 50;
    _this.lineHeightExpand = _this.options.lineHeightReduce || 150;
    _this.cursorSize = _this.options.cursorSize || 10;
    _this.cursorSizeExpand = _this.options.cursorSizeExpand || 15;
    _this.initialCursorScale = 1 / (_this.cursorSizeExpand / _this.cursorSize);
    _this.initialLineScale = 1 / (_this.lineHeightExpand / _this.lineHeightReduce);
    _this.currentPosY = 0; // Bind methods

    _this.onOverAreaEnter = _this.onOverAreaEnter.bind(assertThisInitialized_default()(_this));
    _this.onOverAreaLeave = _this.onOverAreaLeave.bind(assertThisInitialized_default()(_this));
    return _this;
  }

  createClass_default()(InteractiveScroller, [{
    key: "init",
    value: function init() {
      this.setValues();
      this.initEvents();

      var _self = this;

      this.draggables = Draggable["a" /* default */].create(this.cursors, {
        type: 'y',
        autoScroll: 0,
        force3D: true,
        edgeResistance: 1,
        bounds: {
          top: -_self.cursorSize / 2,
          left: 0,
          width: 0,
          bottom: this.lineHeightExpand,
          height: this.lineHeightExpand + _self.cursorSize + 2
        },
        lockAxis: true,
        throwProps: false,
        onDrag: function onDrag() {
          this.update(false, true);
          _self.isLock = true;
          _self.latestCursorPosY = Math.round(Math.abs(Math.round(this.y)) / _self.lineHeightExpand * 100);

          _self.updateCursors(this.target);

          _self.dispatchEvent('drag', _self.latestCursorPosY);
        },
        onPressInit: function onPressInit() {
          _self.isLock = true;
          _self.latestCursorPosY = Math.round(Math.abs(Math.round(this.y)) / _self.lineHeightExpand * 100);
          gsap["g" /* TweenLite */].to(_self.lines, 0.74, {
            force3D: true,
            scaleY: 1,
            ease: gsap["a" /* Expo */].easeOut
          });
          gsap["g" /* TweenLite */].to(_self.cursors, 0.74, {
            force3D: true,
            scale: 1,
            ease: gsap["a" /* Expo */].easeOut
          });
          gsap["g" /* TweenLite */].to(_self.lineContainers, 0.74, {
            force3D: true,
            y: 0,
            ease: gsap["a" /* Expo */].easeOut
          });
        },
        onDragEnd: function onDragEnd() {
          _self.isLock = false;
        },
        onRelease: function onRelease() {
          _self.isLock = false;

          _self.dispatchEvent('onRelease');

          gsap["g" /* TweenLite */].to(_self.lines, 0.4, {
            force3D: true,
            scaleY: _self.initialLineScale,
            ease: gsap["d" /* Power3 */].easeOut
          });
          gsap["g" /* TweenLite */].to(_self.cursors, 0.4, {
            force3D: true,
            scale: _self.initialCursorScale,
            ease: gsap["d" /* Power3 */].easeOut
          });
          gsap["g" /* TweenLite */].to(_self.lineContainers, 0.4, {
            force3D: true,
            y: _self.currentPosY,
            ease: gsap["d" /* Power3 */].easeOut
          });
        }
      });
      this.disableDraggables();
    }
  }, {
    key: "updateCursors",
    value: function updateCursors(target) {
      var _iterator = interactive_scroller_createForOfIteratorHelper(this.cursors),
          _step;

      try {
        for (_iterator.s(); !(_step = _iterator.n()).done;) {
          var cursor = _step.value;

          if (cursor !== target) {
            gsap["g" /* TweenLite */].set(this.cursors, {
              force3D: true,
              y: this.lineHeightExpand * (this.latestCursorPosY / 100)
            });
          }
        }
      } catch (err) {
        _iterator.e(err);
      } finally {
        _iterator.f();
      }
    }
  }, {
    key: "destroy",
    value: function destroy() {
      this.destroyEvents();
    }
  }, {
    key: "initEvents",
    value: function initEvents() {
      var _iterator2 = interactive_scroller_createForOfIteratorHelper(this.overAreas),
          _step2;

      try {
        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
          var el = _step2.value;
          el.addEventListener('mouseenter', this.onOverAreaEnter);
          el.addEventListener('mouseleave', this.onOverAreaLeave);
        }
      } catch (err) {
        _iterator2.e(err);
      } finally {
        _iterator2.f();
      }
    }
  }, {
    key: "destroyEvents",
    value: function destroyEvents() {
      var _iterator3 = interactive_scroller_createForOfIteratorHelper(this.overAreas),
          _step3;

      try {
        for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
          var el = _step3.value;
          el.removeEventListener('mouseenter', this.onOverAreaEnter);
          el.removeEventListener('mouseleave', this.onOverAreaLeave);
        }
      } catch (err) {
        _iterator3.e(err);
      } finally {
        _iterator3.f();
      }
    }
  }, {
    key: "onOverAreaEnter",
    value: function onOverAreaEnter() {
      this.areaIsOver = true;
      this.dispatchEvent('mouseenter');
    }
  }, {
    key: "onOverAreaLeave",
    value: function onOverAreaLeave() {
      this.areaIsOver = false;
      this.dispatchEvent('mouseleave');
    }
  }, {
    key: "onScroll",
    value: function onScroll(percentY) {
      this.latestCursorPosY = Math.round(percentY);
      gsap["g" /* TweenLite */].to(this.cursors, 0.4, {
        force3D: true,
        ease: gsap["d" /* Power3 */].easeOut,
        y: this.lineHeightExpand * (this.latestCursorPosY / 100)
      });
      this.currentPosY = (this.lineHeightExpand - this.lineHeightReduce) * (this.latestCursorPosY / 100);
      gsap["g" /* TweenLite */].to(this.lineContainers, 0.4, {
        force3D: true,
        y: this.currentPosY,
        ease: gsap["d" /* Power3 */].easeOut
      });
    }
  }, {
    key: "enableDraggables",
    value: function enableDraggables() {
      var _iterator4 = interactive_scroller_createForOfIteratorHelper(this.draggables),
          _step4;

      try {
        for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
          var draggable = _step4.value;
          draggable.enable();
        }
      } catch (err) {
        _iterator4.e(err);
      } finally {
        _iterator4.f();
      }
    }
  }, {
    key: "disableDraggables",
    value: function disableDraggables() {
      var _iterator5 = interactive_scroller_createForOfIteratorHelper(this.draggables),
          _step5;

      try {
        for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
          var draggable = _step5.value;
          draggable.disable();
        }
      } catch (err) {
        _iterator5.e(err);
      } finally {
        _iterator5.f();
      }
    }
  }, {
    key: "cursorScaleUp",
    value: function cursorScaleUp() {
      gsap["g" /* TweenLite */].to(this.cursors, 0.75, {
        force3D: true,
        scale: 1,
        ease: gsap["a" /* Expo */].easeOut
      });
    }
  }, {
    key: "resetCursorScale",
    value: function resetCursorScale() {
      gsap["g" /* TweenLite */].to(this.cursors, 0.4, {
        force3D: true,
        scale: this.initialCursorScale,
        ease: gsap["a" /* Expo */].easeOut
      });
    }
  }, {
    key: "resetLineScale",
    value: function resetLineScale() {
      gsap["g" /* TweenLite */].to(this.lines, 1, {
        force3D: true,
        scaleY: this.initialLineScale,
        ease: gsap["d" /* Power3 */].easeOut
      });
    }
  }, {
    key: "setValues",
    value: function setValues() {
      this.windowHeight = window.innerHeight;
      this.halfWindowHeight = this.windowHeight / 2;
      this.cursorPositionY = this.options.cursorPositionY || 200;
      this.lineHeightReduce = this.options.lineHeightReduce || 50;
      this.lineHeightExpand = this.options.lineHeightReduce || 150;
      this.cursorSize = this.options.cursorSize || 10;
      this.cursorSizeExpand = this.options.cursorSizeExpand || 15;
      this.initialCursorScale = 1 / (this.cursorSizeExpand / this.cursorSize);
      this.initialLineScale = 1 / (this.lineHeightExpand / this.lineHeightReduce);
    }
  }, {
    key: "setState",
    value: function setState(state) {
      if (this.currentState === state) return;

      if (state === INITIAL) {
        this.disableDraggables();
        this.resetCursorScale();
        gsap["g" /* TweenLite */].to(this.cursors, 1, {
          force3D: true,
          pointerEvents: 'auto',
          y: 0,
          ease: gsap["d" /* Power3 */].easeOut
        });
        gsap["g" /* TweenLite */].to(this.cursorContainers, 1, {
          force3D: true,
          y: -this.halfWindowHeight + this.cursorPositionY,
          ease: gsap["d" /* Power3 */].easeOut
        });
        gsap["g" /* TweenLite */].to(this.lineContainers, 1, {
          force3D: true,
          yPercent: 55,
          y: 0,
          ease: gsap["d" /* Power3 */].easeOut
        });
      } else if (state === COMPACT) {
        gsap["g" /* TweenLite */].to(this.cursorContainers, 1, {
          force3D: true,
          y: 0,
          ease: gsap["d" /* Power3 */].easeOut
        });
        gsap["g" /* TweenLite */].set(this.cursors, {
          pointerEvents: 'auto'
        });
        gsap["g" /* TweenLite */].to(this.lineContainers, 0.4, {
          force3D: true,
          yPercent: 0,
          ease: gsap["d" /* Power3 */].easeOut
        });
        this.enableDraggables();
      } else if (state === FINAL) {
        this.disableDraggables();
        gsap["g" /* TweenLite */].to(this.cursors, 1, {
          force3D: true,
          pointerEvents: 'none',
          y: this.lineHeightExpand,
          ease: gsap["d" /* Power3 */].easeOut
        });
        gsap["g" /* TweenLite */].to(this.cursorContainers, 1, {
          force3D: true,
          y: this.windowHeight / 2 - this.lineHeightExpand - this.cursorPositionYEnd,
          ease: gsap["d" /* Power3 */].easeOut
        });
      }

      this.previousState = this.currentState;
      this.currentState = state;
    }
  }, {
    key: "activeLayout",
    value: function activeLayout() {
      var _this2 = this;

      var index = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
      var duration = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 2;
      var type = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'translate';

      if (type === 'translate') {
        if (this.layouts[this.currentLayoutIndex] && this.layoutInners[this.currentLayoutIndex]) {
          var layout = this.layouts[this.currentLayoutIndex];
          var layoutInner = this.layoutInners[this.currentLayoutIndex];
          gsap["g" /* TweenLite */].to(layout, duration, {
            force3D: true,
            y: -this.windowHeight,
            ease: gsap["d" /* Power3 */].easeOut,
            onComplete: function onComplete() {
              gsap["g" /* TweenLite */].set(layout, {
                force3D: true,
                y: _this2.windowHeight
              });
            }
          });
          gsap["g" /* TweenLite */].to(layoutInner, duration, {
            force3D: true,
            y: this.windowHeight,
            ease: gsap["d" /* Power3 */].easeOut,
            onComplete: function onComplete() {
              gsap["g" /* TweenLite */].set(layoutInner, {
                force3D: true,
                y: -_this2.windowHeight
              });
            }
          });
        }

        if (this.layouts[index] && this.layoutInners[index]) {
          this.currentLayoutIndex = index;
          var _layout = this.layouts[this.currentLayoutIndex];
          var _layoutInner = this.layoutInners[this.currentLayoutIndex];
          gsap["g" /* TweenLite */].to(_layout, duration, {
            force3D: true,
            ease: gsap["d" /* Power3 */].easeOut,
            y: 0
          });
          gsap["g" /* TweenLite */].to(_layoutInner, duration, {
            force3D: true,
            ease: gsap["d" /* Power3 */].easeOut,
            y: 0
          });
        }
      } else if (type === 'fade') {
        if (this.layouts[this.currentLayoutIndex] && this.layoutInners[this.currentLayoutIndex]) {
          var _layout2 = this.layouts[this.currentLayoutIndex];
          var _layoutInner2 = this.layoutInners[this.currentLayoutIndex];
          gsap["g" /* TweenLite */].to([_layout2, _layoutInner2], duration, {
            force3D: true,
            alpha: 0.1,
            ease: gsap["d" /* Power3 */].easeOut
          });
        }

        if (this.layouts[index] && this.layoutInners[index]) {
          this.currentLayoutIndex = index;
          var _layout3 = this.layouts[this.currentLayoutIndex];
          var _layoutInner3 = this.layoutInners[this.currentLayoutIndex];
          gsap["g" /* TweenLite */].to([_layout3, _layoutInner3], duration, {
            force3D: true,
            alpha: 1,
            ease: gsap["d" /* Power3 */].easeOut
          });
        }
      }
    }
  }]);

  return InteractiveScroller;
}(EventEmitter_EventEmitter);


// EXTERNAL MODULE: ./themes/rezozero/src/js/utils/window.js
var utils_window = __webpack_require__(10);

// EXTERNAL MODULE: ./node_modules/starting-blocks/dist/main.esm.js
var main_esm = __webpack_require__(9);

// CONCATENATED MODULE: ./themes/rezozero/src/js/elements/InteractiveScroller.js



/*
 * Copyright © 2018, Rezo Zero
 *
 * @file InteractiveScroller.js
 * @author Adrien Scholaert <adrien@rezo-zero.com>
 */





var InteractiveScroller_InteractiveScrollEl = /*#__PURE__*/function () {
  function InteractiveScrollEl() {
    classCallCheck_default()(this, InteractiveScrollEl);

    /** @type {(InteractiveScroller|null)} */
    this.interactiveScroller = null;
    /** @type {(number|null)} */

    this.scrollLimitStart = null;
    /** @type {(number|null)} */

    this.scrollHeight = null;
    /** @type {ScrollManager|null} */

    this.scrollManager = null;
    /** @type {number} */

    this.scrollY = 0;
    /** @type {boolean} */

    this.initiated = false;
    this.previousLayout = null;
    this.currentLayout = null;
    this.layoutAnimationDelay = 0;
    this.offsetY = 30;
    this.values = {
      y: 0
    }; // Bind methods

    this.onChangeLayout = this.onChangeLayout.bind(this);
    this.onTransitionStart = this.onTransitionStart.bind(this);
    this.onTransitionComplete = this.onTransitionComplete.bind(this);
    this.scrollTo = this.scrollTo.bind(this);
    this.init();
    this.initListeners();
  }

  createClass_default()(InteractiveScrollEl, [{
    key: "init",
    value: function init() {
      this.initiated = true; // Build interactive scroller

      this.interactiveScroller = new interactive_scroller_InteractiveScroller({
        cursorPositionY: Object(utils_window["a" /* getWindowHeight */])() / 2 - 64
      }); // Init it

      this.interactiveScroller.init();
    }
  }, {
    key: "initListeners",
    value: function initListeners() {
      var _this = this;

      // Listen some events
      this.interactiveScroller.on('drag', function (percent) {
        // Set window scroll position on drag
        if (_this.interactiveScroller.isLock) {
          gsap["h" /* TweenMax */].to(_this.values, 0.65, {
            y: Math.round(percent / 100 * _this.scrollManager.getScrollHeight()),
            ease: gsap["d" /* Power3 */].easeOut,
            onUpdate: _this.scrollTo
          });
        }
      });
      this.interactiveScroller.on('onRelease', function () {
        _this.update();
      });
      this.interactiveScroller.on('mouseenter', function () {
        if (_this.interactiveScroller.currentState === 'FINAL') return;

        _this.interactiveScroller.setState('COMPACT');
      });
      this.interactiveScroller.on('mouseleave', function () {
        if (_this.scrollY < _this.scrollLimitStart) {
          _this.interactiveScroller.setState('INITIAL');
        }
      });
      document.addEventListener('scroll.changeLayout', this.onChangeLayout, window.passiveSupported ? {
        passive: true
      } : false);
      window.addEventListener(main_esm["h" /* EventTypes */].TRANSITION_START, this.onTransitionStart, window.passiveSupported ? {
        passive: true
      } : false);
      window.addEventListener(main_esm["h" /* EventTypes */].TRANSITION_COMPLETE, this.onTransitionComplete, window.passiveSupported ? {
        passive: true
      } : false);
    }
  }, {
    key: "scrollTo",
    value: function scrollTo() {
      this.scrollManager.scrollTo(0, Math.round(this.values.y));
    }
  }, {
    key: "onTransitionStart",
    value: function onTransitionStart() {
      this.layoutAnimationDelay = 1;
    }
  }, {
    key: "onTransitionComplete",
    value: function onTransitionComplete() {
      this.layoutAnimationDelay = 0;
    }
  }, {
    key: "onChangeLayout",
    value: function onChangeLayout(_ref) {
      var detail = _ref.detail;
      var way = detail.way,
          options = detail.options;
      var layout = options.layout;

      if (way === 'enter') {
        this.setLayout(layout);
      }
    }
    /**
     * @param {ScrollManager} scrollManager
     */

  }, {
    key: "attachScrollManager",
    value: function attachScrollManager(scrollManager) {
      var _this2 = this;

      this.scrollManager = scrollManager;
      this.scrollLimitStart = Object(utils_window["a" /* getWindowHeight */])() / 3;
      this.scrollHeight = this.scrollManager.getScrollHeight();
      this.interactiveScroller.isLock = false;
      this.scrollY = this.scrollManager.getPositions().y;
      this.values.y = this.scrollY;
      this.update();
      this.updateScroll(); // TODO: This is f*** hijacking all website scroll

      this.scrollManager.instance.callbacks.onScroll = function (scroll) {
        _this2.scrollY = scroll.y;
        if (_this2.interactiveScroller.isLock) return;
        _this2.values.y = _this2.scrollY;

        _this2.update();

        _this2.updateScroll();
      };
    }
  }, {
    key: "updateScroll",
    value: function updateScroll() {
      if (this.interactiveScroller.isLock) return;
      this.interactiveScroller.onScroll(this.scrollY / this.scrollManager.getScrollHeight() * 100);
    }
  }, {
    key: "setState",
    value: function setState() {
      if (this.scrollY > this.scrollLimitStart && this.scrollY < this.scrollManager.getScrollHeight() - this.offsetY) {
        this.interactiveScroller.setState('COMPACT');
      } else if (this.scrollY >= this.scrollManager.getScrollHeight() - this.offsetY) {
        this.interactiveScroller.setState('FINAL');
      } else {
        if (!this.interactiveScroller.areaIsOver) {
          this.interactiveScroller.setState('INITIAL');
        }
      }
    }
  }, {
    key: "setLayout",
    value: function setLayout() {
      var _this3 = this;

      var color = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'black';
      this.previousLayout = this.currentLayout;

      if (color === 'black') {
        gsap["h" /* TweenMax */].delayedCall(this.layoutAnimationDelay, function () {
          _this3.interactiveScroller.activeLayout(1, 1, 'fade');
        });
      } else {
        gsap["h" /* TweenMax */].delayedCall(this.layoutAnimationDelay, function () {
          _this3.interactiveScroller.activeLayout(0, 1, 'fade');
        });
      }

      this.currentLayout = color;
    }
  }, {
    key: "update",
    value: function update() {
      this.setState();
    }
  }, {
    key: "updateValues",
    value: function updateValues() {
      if (this.scrollManager) {
        this.scrollLimitStart = Object(utils_window["a" /* getWindowHeight */])() / 3;
        this.scrollHeight = this.scrollManager.getScrollHeight();
      }
    }
  }]);

  return InteractiveScrollEl;
}();

/* harmony default export */ var elements_InteractiveScroller = __webpack_exports__["default"] = (new InteractiveScroller_InteractiveScrollEl());