/*
--------------------------------------------------------------------------------------------- 
RESET CSS 
---------------------------------------------------------------------------------------------
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

*:focus {
  outline: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

img {
  vertical-align: middle;
  pointer-events: none;
}

@font-face {
  font-family: 'Abril Fatface';
  src: url("../fonts/AbrilFatface-Regular.eot");
  src: url("../fonts/AbrilFatface-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/AbrilFatface-Regular.woff2") format("woff2"), url("../fonts/AbrilFatface-Regular.woff") format("woff"), url("../fonts/AbrilFatface-Regular.ttf") format("truetype"), url("../fonts/AbrilFatface-Regular.svg#AbrilFatface-Regular") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Aribau Grotesk';
  src: url("../fonts/AribauGrotesk-Lt.eot");
  src: url("../fonts/AribauGrotesk-Lt.eot?#iefix") format("embedded-opentype"), url("../fonts/AribauGrotesk-Lt.woff2") format("woff2"), url("../fonts/AribauGrotesk-Lt.woff") format("woff"), url("../fonts/AribauGrotesk-Lt.ttf") format("truetype"), url("../fonts/AribauGrotesk-Lt.svg#AribauGrotesk-Lt") format("svg");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Aribau Grotesk';
  src: url("../fonts/AribauGrotesk-UltLt.eot");
  src: url("../fonts/AribauGrotesk-UltLt.eot?#iefix") format("embedded-opentype"), url("../fonts/AribauGrotesk-UltLt.woff2") format("woff2"), url("../fonts/AribauGrotesk-UltLt.woff") format("woff"), url("../fonts/AribauGrotesk-UltLt.ttf") format("truetype"), url("../fonts/AribauGrotesk-UltLt.svg#AribauGrotesk-UltLt") format("svg");
  font-weight: 150;
  font-style: normal;
}

@font-face {
  font-family: 'Aribau Grotesk';
  src: url("../fonts/AribauGrotesk-Md.eot");
  src: url("../fonts/AribauGrotesk-Md.eot?#iefix") format("embedded-opentype"), url("../fonts/AribauGrotesk-Md.woff2") format("woff2"), url("../fonts/AribauGrotesk-Md.woff") format("woff"), url("../fonts/AribauGrotesk-Md.ttf") format("truetype"), url("../fonts/AribauGrotesk-Md.svg#AribauGrotesk-Md") format("svg");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Aribau Grotesk';
  src: url("../fonts/AribauGrotesk-XLt.eot");
  src: url("../fonts/AribauGrotesk-XLt.eot?#iefix") format("embedded-opentype"), url("../fonts/AribauGrotesk-XLt.woff2") format("woff2"), url("../fonts/AribauGrotesk-XLt.woff") format("woff"), url("../fonts/AribauGrotesk-XLt.ttf") format("truetype"), url("../fonts/AribauGrotesk-XLt.svg#AribauGrotesk-XLt") format("svg");
  font-weight: 200;
  font-style: normal;
}

@font-face {
  font-family: 'Aribau Grotesk';
  src: url("../fonts/AribauGrotesk-Rg.eot");
  src: url("../fonts/AribauGrotesk-Rg.eot?#iefix") format("embedded-opentype"), url("../fonts/AribauGrotesk-Rg.woff2") format("woff2"), url("../fonts/AribauGrotesk-Rg.woff") format("woff"), url("../fonts/AribauGrotesk-Rg.ttf") format("truetype"), url("../fonts/AribauGrotesk-Rg.svg#AribauGrotesk-Rg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Aribau Grotesk';
  src: url("../fonts/AribauGrotesk-Th.eot");
  src: url("../fonts/AribauGrotesk-Th.eot?#iefix") format("embedded-opentype"), url("../fonts/AribauGrotesk-Th.woff2") format("woff2"), url("../fonts/AribauGrotesk-Th.woff") format("woff"), url("../fonts/AribauGrotesk-Th.ttf") format("truetype"), url("../fonts/AribauGrotesk-Th.svg#AribauGrotesk-Th") format("svg");
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: 'Aribau Grotesk';
  src: url("../fonts/AribauGrotesk-Bd.eot");
  src: url("../fonts/AribauGrotesk-Bd.eot?#iefix") format("embedded-opentype"), url("../fonts/AribauGrotesk-Bd.woff2") format("woff2"), url("../fonts/AribauGrotesk-Bd.woff") format("woff"), url("../fonts/AribauGrotesk-Bd.ttf") format("truetype"), url("../fonts/AribauGrotesk-Bd.svg#AribauGrotesk-Bd") format("svg");
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'Aribau Grotesk';
  src: url("../fonts/AribauGrotesk-Blk.eot");
  src: url("../fonts/AribauGrotesk-Blk.eot?#iefix") format("embedded-opentype"), url("../fonts/AribauGrotesk-Blk.woff2") format("woff2"), url("../fonts/AribauGrotesk-Blk.woff") format("woff"), url("../fonts/AribauGrotesk-Blk.ttf") format("truetype"), url("../fonts/AribauGrotesk-Blk.svg#AribauGrotesk-Blk") format("svg");
  font-weight: 900;
  font-style: normal;
}

/*
--------------------------------------------------------------------------------------------- 
GENERAL 
---------------------------------------------------------------------------------------------
*/
html {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
  width: 100vw;
  margin: 0px;
  padding: 0px;
  overflow-x: hidden;
  position: relative;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 1vw;
  font-weight: 200;
  line-height: 1.4;
  font-style: normal;
  color: #3d3d3d;
  background-color: #f9f9f9;
  overscroll-behavior-y: none;
  font-family: "Aribau Grotesk", Arial, Helvetica, sans-serif;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  body {
    font-size: 4vw;
  }
}

a,
a:hover,
a:focus {
  text-decoration: none;
  color: inherit;
}

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

.splitted {
  -webkit-font-kerning: none;
          font-kerning: none;
  -webkit-text-rendering: optimizeSpeed;
  text-rendering: optimizeSpeed;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

#guides {
  display: none;
  position: fixed;
  z-index: 1000000;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
  opacity: 0.5;
}

#guides .guides--horizontal {
  display: block;
  position: absolute;
  width: 75vw;
  height: 100%;
  margin: auto;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

@media (max-width: 900px) {
  #guides .guides--horizontal {
    width: 94vw;
  }
}

#guides .guides--horizontal .guide {
  position: relative;
  width: calc(100%/12);
  float: left;
  height: 100%;
  height: 100vh;
  border-left: 1px solid hotpink;
  border-right: 1px solid hotpink;
}

#guides .guides--vertical {
  display: none;
  position: absolute;
  width: 100vw;
  height: 100%;
  margin: auto;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}

#guides .guides--vertical .guide {
  position: relative;
  width: 100%;
  height: 6.25vw;
  opacity: 0.5;
  border-top: 1px solid lightyellow;
  border-bottom: 1px solid lightyellow;
}

#app {
  opacity: 1;
  will-change: opacity;
}

#main {
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  overflow: hidden;
  width: 100vw;
}

section {
  position: relative;
}

.wrapper {
  position: relative;
  width: 75vw;
  margin: auto;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  .wrapper {
    width: 79vw;
  }
}

*[data-scroll-call="title"],
*[data-scroll-call="description"],
*[data-scroll-call="fade"] {
  visibility: hidden;
}

.splitted {
  -webkit-text-rendering: optimizeSpeed;
  text-rendering: optimizeSpeed;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.splitted .line {
  display: block;
  white-space: nowrap;
  line-height: 1.2;
}

.splitted .line .word {
  will-change: opacity, transform;
  top: -0.1em;
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  opacity: 0;
}

.title {
  font-family: "Abril Fatface", "Times New Roman", Times, serif;
  font-weight: 400;
  line-height: 1.1;
  font-size: 4.9vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  .title {
    font-size: 9.8vw;
  }
}

.subtitle {
  font-weight: 150;
  line-height: 1.2;
  font-size: 2vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  .subtitle {
    font-size: 5vw;
  }
}

.subtitle strong {
  font-weight: 900;
}

sup {
  font-size: 40%;
  vertical-align: top;
}

.wysiwyg {
  display: block;
  font-size: 1vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  .wysiwyg {
    font-size: 3.6vw;
  }
}

.wysiwyg p {
  margin-bottom: 1em;
}

.wysiwyg b {
  color: #8c7b38;
}

.wysiwyg strong {
  font-weight: bold;
  color: #8c7b38;
}

.wysiwyg i, .wysiwyg em {
  font-style: italic;
}

.wysiwyg a {
  text-decoration: underline;
}

.dots {
  text-align: center;
}

.dots__item {
  display: inline-block;
  width: 0.4vw;
  height: 0.4vw;
  border-radius: 0.4vw;
  background-color: transparent;
  opacity: 1;
  border: 1px solid #8c7b38;
  margin: 0 0.2vw;
  cursor: pointer;
  -webkit-transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
  transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  .dots__item {
    width: 3vw;
    height: 3vw;
    border-radius: 3vw;
    margin: 0 3vw;
  }
}

.dots__item.active {
  background-color: #8c7b38;
}

.form .form__group {
  border-bottom: 1px solid #ccc;
  margin-bottom: 1vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.form .form__group label {
  display: inline-block;
  font-size: 1.6vw;
  font-family: "Abril Fatface", "Times New Roman", Times, serif;
  opacity: 0.2;
  line-height: 4vw;
  margin-right: 1vw;
  white-space: nowrap;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  .form .form__group label {
    font-size: 5vw;
    line-height: 14vw;
  }
}

.form .form__group input[type='text'],
.form .form__group input[type='phone'],
.form .form__group input[type='email'] {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  border: 0;
  outline: 0;
  font-size: 1.6vw;
  font-family: "Abril Fatface", "Times New Roman", Times, serif;
  line-height: 4vw;
  width: 100%;
  background-color: transparent;
  padding-left: 1vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  .form .form__group input[type='text'],
  .form .form__group input[type='phone'],
  .form .form__group input[type='email'] {
    font-size: 6vw;
    line-height: 14vw;
    padding-left: 7vw;
  }
}

.form .form__group .radio-container {
  position: relative;
  width: 3vw;
  height: 3vw;
  margin-left: 2vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  .form .form__group .radio-container {
    width: 10.5vw;
    height: 10.5vw;
    margin-left: 3.5vw;
    padding: 1.75vw 0;
  }
}

.form .form__group .radio-container label {
  position: absolute;
  width: 100%;
  text-align: center;
  font-size: 1.6vw;
  line-height: 3vw;
  height: 3vw;
  opacity: 0.2;
  pointer-events: none;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  .form .form__group .radio-container label {
    line-height: 10.5vw;
    font-size: 5vw;
  }
}

.form .form__group .radio-container input[type='radio'] {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
  width: 3vw;
  height: 3vw;
  border: 1px solid #868686;
  border-radius: 3vw;
  margin: 0;
  cursor: pointer;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  .form .form__group .radio-container input[type='radio'] {
    width: 10.5vw;
    height: 10.5vw;
    border-radius: 10.5vw;
  }
}

.form .form__group .radio-container:hover label {
  opacity: 1;
}

.form .form__group select {
  border: 0;
  outline: 0;
  font-size: 1.6vw;
  font-family: "Abril Fatface", "Times New Roman", Times, serif;
  line-height: 4vw;
  width: 100%;
  margin-left: 2vw;
  background-color: transparent;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  .form .form__group select {
    font-size: 6vw;
    line-height: 14vw;
  }
}

.form .button {
  border: 0;
  outline: 0;
  float: right;
  margin-bottom: 0;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  .form .button {
    padding: 0 10.5vw;
    height: 17.5vw;
    margin-top: 7vw;
  }
}

.button {
  position: relative;
  display: inline-block;
  overflow: hidden;
  vertical-align: middle;
  cursor: pointer;
  margin: 0;
  padding: 0;
  height: 4vw;
  border-radius: 2vw;
  padding: 1.5vw;
  line-height: 1.1vw;
  width: 12.5vw;
  font-size: 0.75vw;
  background-color: #ffffff;
  will-change: opacity;
  color: #3d3d3d;
  text-align: center;
  font-weight: 500;
  text-decoration: none;
  -webkit-box-shadow: 0 0 4vw 0 rgba(1, 0, 1, 0.05);
          box-shadow: 0 0 4vw 0 rgba(1, 0, 1, 0.05);
  margin-bottom: 2vw;
  -webkit-transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
  transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  .button {
    height: 21vw;
    width: auto;
    font-size: 4vw;
    line-height: 14.5vw;
    padding: 3.5vw 10.5vw;
    border-radius: 21vw;
  }
}

.button.button--active {
  background-color: #8c7b38;
  color: #ffffff;
}

.button:hover {
  background-color: #3d3d3d;
  color: #ffffff;
}

#background {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  display: none;
}

#background canvas {
  display: none;
}

#particles {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
}

#particles canvas {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

#menu {
  width: 40vw;
  height: 100vh;
  position: fixed;
  right: 0;
  top: 0;
  background-color: #ffffff;
  -webkit-transform: translateX(100%);
          transform: translateX(100%);
  padding: 6.25vw;
  -webkit-box-shadow: 0px 0px 10vw 0px rgba(0, 0, 0, 0.1);
          box-shadow: 0px 0px 10vw 0px rgba(0, 0, 0, 0.1);
  will-change: transform;
}

#menu ul {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

#menu ul li a {
  font-size: 1.6vw;
  font-family: "Abril Fatface", "Times New Roman", Times, serif;
  line-height: 4vw;
  opacity: 0.2;
  -webkit-transition: all 200ms ease-in-out;
  transition: all 200ms ease-in-out;
}

#menu ul li a.active, #menu ul li a:hover {
  opacity: 1;
}

#top {
  position: fixed;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  top: 4vw;
  right: 6.25vw;
}

#top .button {
  position: relative;
  background-color: transparent !important;
  border: 1px solid #d9d9d9;
  text-transform: uppercase;
  margin-bottom: 0px;
  -webkit-box-shadow: initial;
          box-shadow: initial;
  font-size: 60%;
  letter-spacing: 0.05em;
  height: 3.5vw;
  padding: 1.25vw 2vw;
  width: auto;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #top .button {
    height: 14vw;
    width: auto;
    font-size: 2.4vw;
    line-height: 14vw;
    padding: 0 7vw;
    border-radius: 17.5vw;
  }
}

#top .button:hover {
  color: #3d3d3d;
  border: 1px solid #868686;
}

#top .burger {
  position: relative;
  height: 3.5vw;
  width: 3.5vw;
  margin-left: 2.25vw;
  border-radius: 3.5vw;
  cursor: pointer;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #top .burger {
    display: none;
  }
}

#top .burger .icon {
  position: absolute;
  left: 0;
  top: 0;
  width: 3.5vw;
  height: 3.5vw;
  background-image: url(../img/menu.svg);
  background-position: center;
  background-size: 30% auto;
  background-repeat: no-repeat;
}

#top .burger svg {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 3.5vw;
  height: 3.5vw;
  opacity: 1;
  -webkit-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
  -webkit-transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
  transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
}

#top .burger svg circle {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  fill: none;
  stroke-width: 4;
  stroke: #d9d9d9;
}

#top .burger svg circle.back {
  stroke: #d9d9d9;
  -webkit-transition: all 250ms ease-in-out;
  transition: all 250ms ease-in-out;
}

#top .burger svg circle.front {
  opacity: 1;
  stroke-dasharray: 1194px;
  stroke-dashoffset: 1194px;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  stroke: #171717;
}

#top .burger:hover svg circle.back {
  stroke: #868686;
}

@-webkit-keyframes gradientAnimation {
  0% {
    background-position: 0% 99%;
  }
  50% {
    background-position: 100% 2%;
  }
  100% {
    background-position: 0% 99%;
  }
}

@keyframes gradientAnimation {
  0% {
    background-position: 0% 99%;
  }
  50% {
    background-position: 100% 2%;
  }
  100% {
    background-position: 0% 99%;
  }
}

#hero {
  position: relative;
  height: 100vh;
}

#hero .columns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

#hero .columns__left {
  width: 43.75vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #hero .columns__left {
    width: 100%;
  }
}

#hero .columns__right {
  width: 27vw;
  text-align: right;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #hero .columns__right {
    width: 100%;
    text-align: left;
  }
}

#hero .wrapper {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #hero .wrapper {
    position: absolute;
    bottom: 10.5vw;
    top: initial;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

#hero .logo {
  position: relative;
  margin-bottom: 0;
  margin-left: -3.5vw;
  width: 15vw;
  height: 11vw;
  opacity: 0.0001;
  will-change: opacity;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #hero .logo {
    margin-left: -10.5vw;
    width: 50vw;
    height: 35vw;
  }
}

#hero .logo__image {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

#hero .title {
  color: #ffffff;
  margin-bottom: 0;
  -webkit-font-kerning: none;
          font-kerning: none;
  text-shadow: 0px 0.5vw 4vw rgba(0, 0, 0, 0.15);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #hero .title {
    margin-bottom: 7vw;
  }
}

#hero .subtitle {
  text-align: left;
  margin-bottom: 2vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #hero .subtitle {
    margin-bottom: 7vw;
  }
}

#hero .button {
  opacity: 0.0001;
  will-change: opacity;
  margin-bottom: 1vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #hero .button {
    width: 100%;
    margin-bottom: 0;
  }
}

#slider {
  padding: 0;
  text-align: center;
  height: 100vh;
  margin-bottom: 36.25vh;
  position: relative;
  display: block;
}

#slider .wrapper {
  position: absolute;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  height: 100%;
}

#slider .slider {
  position: absolute;
  width: 100%;
  height: 100%;
}

#slider .slider .slider__inner {
  position: absolute;
  width: 100%;
  height: 60vh;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

#slider .slider .slider__inner .slide {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
          transform: translateY(-50%) translateX(-50%);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #slider .slider .slider__inner .slide {
    top: 40%;
  }
}

#slider .slider .slider__inner .slide__image {
  position: absolute;
  width: 10px;
  height: 10px;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
}

#slider .slider .slider__inner .slide__image .image {
  position: absolute;
  width: 45vw;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #slider .slider .slider__inner .slide__image .image {
    width: 100vw;
  }
}

#slider .slider .slider__inner .slide__image .image img {
  width: 100%;
  height: auto;
}

#slider .slider .slider__inner .slide__image--left {
  -webkit-transform: translateX(-50vw) translateY(0vw);
          transform: translateX(-50vw) translateY(0vw);
}

#slider .slider .slider__inner .slide__image--right {
  -webkit-transform: translateX(50vw) translateY(0vw);
          transform: translateX(50vw) translateY(0vw);
}

#slider .slider .slider__inner .slide__title {
  /*background: -webkit-linear-gradient(left, $gradientStart 0%, $gradientEnd 100%);
                    -webkit-background-clip: text;
                    -webkit-text-fill-color: transparent;
                    margin-bottom: 4vw;
                    */
  display: block;
  position: relative;
  width: 50vw;
  margin: auto;
  margin-bottom: 4vw;
  color: #806d2c;
  -webkit-font-kerning: none;
          font-kerning: none;
  -webkit-text-rendering: optimizeSpeed;
  text-rendering: optimizeSpeed;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #slider .slider .slider__inner .slide__title {
    width: 80vw;
  }
}

#slider .slider .slider__inner .slide__title .line {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  line-height: 1.3;
}

#slider .slider .slider__inner .slide__title .line .word {
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
  will-change: transform;
}

#slider .slider .slider__inner .slide__title .line {
  width: 104%;
  margin-left: -2%;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #slider .slider .slider__inner .slide__title .line {
    width: 114%;
    margin-left: -7%;
  }
}

#slider .slider .slider__inner .slide__description {
  width: 37.5vw;
  margin: auto;
  opacity: 0.0001;
  will-change: opacity;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #slider .slider .slider__inner .slide__description {
    width: 100%;
  }
}

#slider .slider .slider__inner .slide__description p {
  margin-bottom: 1vw;
}

#slider .slider .slider__navigation {
  position: absolute;
  width: 100%;
  bottom: 4vh;
  height: 8vw;
  font-family: "Abril Fatface", "Times New Roman", Times, serif;
  font-style: italic;
  font-size: 2vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #slider .slider .slider__navigation {
    font-size: 5vw;
    height: 21vw;
    bottom: 17.5vh;
  }
}

#slider .slider .slider__navigation .inner {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8vw;
  opacity: 1;
  -webkit-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
  -webkit-transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
  transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #slider .slider .slider__navigation .inner {
    width: 21vw;
  }
}

#slider .slider .slider__navigation svg {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8vw;
  height: 8vw;
  opacity: 1;
  -webkit-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
  -webkit-transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
  transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #slider .slider .slider__navigation svg {
    width: 21vw;
    height: 21vw;
  }
}

#slider .slider .slider__navigation svg circle {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  fill: none;
  stroke-width: 4;
  stroke: #d9d9d9;
}

#slider .slider .slider__navigation svg circle.front {
  opacity: 1;
  stroke-dasharray: 1194px;
  stroke-dashoffset: 1194px;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  stroke: #8c7b38;
}

#intro {
  padding: 6.25vw 0;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #intro {
    padding: 10.5vw 0;
  }
}

#intro .mask {
  width: 87.5vw;
  height: 100%;
  background-color: #171717;
  left: 0;
  top: 0;
  position: absolute;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #intro .mask {
    width: 100%;
    height: 100%;
  }
}

#intro .title {
  width: 25vw;
  margin-bottom: 3vw;
  color: #ffffff;
  font-family: "Abril Fatface", "Times New Roman", Times, serif;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #intro .title {
    width: 50vw;
    margin-bottom: 10.5vw;
  }
}

#intro .description {
  width: 25vw;
  margin-bottom: 2vw;
  color: #868686;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #intro .description {
    width: 60vw;
    margin-left: 19vw;
    margin-bottom: 14.5vw;
  }
}

#intro .video {
  position: absolute;
  right: 16vw;
  top: -11.5vw;
  width: 23.75vw;
  height: 37.25vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #intro .video {
    position: relative;
    top: initial;
    right: initial;
    width: 100%;
    height: auto;
    padding-bottom: 158%;
  }
}

#intro .video__bg {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-position: center;
  background-image: url(../img/screen.png);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

#intro .video__element {
  position: absolute;
  top: 46%;
  left: 51%;
  width: 75.1%;
  -webkit-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
  border: 1px solid #171717;
}

#intro .image {
  position: absolute;
  right: 7vw;
  bottom: -18.5vw;
  width: 6vw;
  height: 20vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #intro .image {
    position: relative;
    left: 48vw;
    width: 23vw;
    height: 51vw;
    bottom: -20vw;
  }
}

#intro .image .image__conexion {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 50%;
  background-position: center;
  background-image: url(../img/conexion2.gif);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  height: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #intro .image .image__conexion {
    -webkit-transform: translateY(-80%);
            transform: translateY(-80%);
  }
}

#intro .image .image__bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-image: url(../img/phone.png);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

#opinion {
  padding: 6.25vw 0;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #opinion {
    padding: 35vw 0;
  }
}

#opinion .title {
  width: 25vw;
  margin-bottom: 3vw;
  color: #3d3d3d;
  font-family: "Abril Fatface", "Times New Roman", Times, serif;
  color: #806d2c;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #opinion .title {
    width: 60vw;
  }
}

#opinion .description {
  width: 25vw;
  color: #3d3d3d;
  margin-bottom: 6.25vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #opinion .description {
    width: 100%;
    margin-bottom: 10.5vw;
  }
}

#opinion .quotes__slider {
  position: relative;
}

#opinion .quotes__slider__inner {
  width: 25vw;
  position: relative;
  height: 31.25vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #opinion .quotes__slider__inner {
    width: 100%;
    height: auto;
  }
}

#opinion .quotes__slider__arrows {
  position: absolute;
  left: 60vw;
  top: 40%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #opinion .quotes__slider__arrows {
    display: none;
  }
}

#opinion .quotes__slider__arrows .arrow {
  position: relative;
  width: 5vw;
  height: 5vw;
  border-radius: 5vw;
  border: 1px solid #171717;
  cursor: pointer;
  -webkit-transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
  transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
}

#opinion .quotes__slider__arrows .arrow--next {
  margin-bottom: 2vw;
}

#opinion .quotes__slider__arrows .arrow .icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: 30% auto;
  background-repeat: no-repeat;
  opacity: 1;
  -webkit-transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
  transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
}

#opinion .quotes__slider__arrows .arrow .icon--left {
  background-image: url(../img/arrow-left.svg);
  background-position: 45% center;
}

#opinion .quotes__slider__arrows .arrow .icon--right {
  background-image: url(../img/arrow-right.svg);
  background-position: 55% center;
}

#opinion .quotes__slider__arrows .arrow.disabled {
  border: 1px solid #d9d9d9;
  cursor: not-allowed;
}

#opinion .quotes__slider__arrows .arrow.disabled .icon {
  opacity: 0.1;
}

#opinion .quotes__slider__dots {
  display: none;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #opinion .quotes__slider__dots {
    display: block;
  }
}

#opinion .quotes {
  display: block;
  margin-bottom: 6.25vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #opinion .quotes {
    display: block;
    margin-bottom: 14vw;
  }
}

#opinion .quotes__item {
  width: 25vw;
  margin-right: 6.25vw;
  margin-bottom: 6.25vw;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0.0001;
  will-change: opacity, transform;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #opinion .quotes__item {
    width: 100%;
    margin-right: 0;
    margin-bottom: 10.5vw;
  }
}

#opinion .quotes__item__line {
  display: block;
  margin-bottom: 3vw;
  width: 100%;
  height: 1px;
  background-color: #3d3d3d;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #opinion .quotes__item__line {
    margin-bottom: 14vw;
  }
}

#opinion .quotes__item__description {
  font-style: italic;
  font-size: 1.8vw;
  line-height: 1.2;
  font-weight: 100;
  margin-bottom: 2vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #opinion .quotes__item__description {
    font-size: 7vw;
    margin-bottom: 7vw;
  }
}

#opinion .quotes__item__name {
  font-size: 0.75vw;
  font-weight: bold;
  opacity: 0.0001;
  will-change: opacity;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #opinion .quotes__item__name {
    font-size: 3.6vw;
  }
}

#opinion .quotes__item__position {
  font-size: 0.75vw;
  opacity: 0.0001;
  will-change: opacity;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #opinion .quotes__item__position {
    font-size: 3.6vw;
  }
}

#video {
  margin-bottom: 12.5vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #video {
    margin-bottom: 0;
  }
}

#video .quote {
  position: absolute;
  width: 12vw;
  height: 12vw;
  background-image: url(../img/quotes.png);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  top: 0vw;
  left: -6vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #video .quote {
    top: -30vw;
    left: -19vw;
    width: 40vw;
    height: 40vw;
  }
}

#video .video {
  margin-left: 12.5vw;
  width: 62.5vw;
  position: relative;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #video .video {
    width: 100vw;
    margin-left: 0;
    left: -10.5vw;
  }
}

#video .video:before {
  display: block;
  content: "";
  padding-bottom: 56.2%;
}

#video .video__element {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

#video .video__poster {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-image: url(../img/video-poster.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

#video .video__player {
  width: 3.5vw;
  height: 3.5vw;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  top: 50%;
  left: 50%;
  pointer-events: initial;
  background-image: url(../img/player.svg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  cursor: pointer;
  -webkit-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
	
	#video .video__player {
  width: 15.5vw;
  height: 15.5vw;
 
}
 
}

#page {
  padding: 6.25vw 0;
  /*! wysiwyg.css v0.0.3 | MIT License | github.com/jgthms/wysiwyg.css */
}

#page .columns {
  width: 60vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #page .columns {
    width: 100%;
  }
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #page .columns {
    display: block;
  }
}

#page .columns__left {
  width: 12vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #page .columns__left {
    width: 100%;
    padding-right: 10.5vw;
  }
}

#page .columns__right {
  width: 40vw;
  text-align: left;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #page .columns__right {
    width: 100%;
    text-align: left;
  }
}

#page .logo {
  display: block;
  position: relative;
  margin-bottom: 0;
  width: 15vw;
  height: 11vw;
  margin-left: -3.5vw;
  margin-bottom: 3vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #page .logo {
    margin-left: -10.5vw;
    width: 50vw;
    height: 35vw;
  }
}

#page .logo__image {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

#page .subtitle {
  font-weight: 900;
  color: #8c7b38;
  margin-bottom: 4vw;
}

#page .wysiwyg {
  line-height: 1.4;
}

#page .wysiwyg a {
  text-decoration: none;
  font-weight: 500;
  border-bottom: 2px solid;
}

#page .wysiwyg abbr {
  border-bottom: 1px dotted;
  cursor: help;
}

#page .wysiwyg cite {
  font-style: italic;
}

#page .wysiwyg hr {
  background: #e6e6e6;
  border: none;
  display: block;
  height: 1px;
  margin-bottom: 1.4em;
  margin-top: 1.4em;
}

#page .wysiwyg img {
  vertical-align: text-bottom;
}

#page .wysiwyg ins {
  background-color: lime;
  text-decoration: none;
}

#page .wysiwyg mark {
  background-color: #ff0;
}

#page .wysiwyg small {
  font-size: 0.8em;
}

#page .wysiwyg strong {
  font-weight: 700;
}

#page .wysiwyg sub,
#page .wysiwyg sup {
  font-size: 0.8em;
}

#page .wysiwyg sub {
  vertical-align: sub;
}

#page .wysiwyg sup {
  vertical-align: super;
}

#page .wysiwyg p,
#page .wysiwyg dl,
#page .wysiwyg ol,
#page .wysiwyg ul,
#page .wysiwyg blockquote,
#page .wysiwyg pre,
#page .wysiwyg table {
  margin-bottom: 1.4em;
}

#page .wysiwyg p:last-child,
#page .wysiwyg dl:last-child,
#page .wysiwyg ol:last-child,
#page .wysiwyg ul:last-child,
#page .wysiwyg blockquote:last-child,
#page .wysiwyg pre:last-child,
#page .wysiwyg table:last-child {
  margin-bottom: 0;
}

#page .wysiwyg p {
  margin-bottom: 1.4em;
}

#page .wysiwyg p:empty {
  display: none;
}

#page .wysiwyg h1,
#page .wysiwyg h2,
#page .wysiwyg h3,
#page .wysiwyg h4,
#page .wysiwyg h5,
#page .wysiwyg h6 {
  font-weight: 500;
  line-height: 1.2;
}

#page .wysiwyg h1:first-child,
#page .wysiwyg h2:first-child,
#page .wysiwyg h3:first-child,
#page .wysiwyg h4:first-child,
#page .wysiwyg h5:first-child,
#page .wysiwyg h6:first-child {
  margin-top: 0;
}

#page .wysiwyg h1 {
  font-size: 2.4em;
  margin-bottom: .58333em;
  line-height: 1;
}

#page .wysiwyg h2 {
  font-size: 1.6em;
  margin-bottom: .875em;
  line-height: 1.1;
}

#page .wysiwyg h3 {
  font-size: 1.3em;
  margin-bottom: 1.07692em;
}

#page .wysiwyg h4 {
  font-size: 1.2em;
  margin-bottom: 1.16667em;
}

#page .wysiwyg h5 {
  font-size: 1.1em;
  margin-bottom: 1.27273em;
}

#page .wysiwyg h6 {
  font-size: 1em;
  margin-bottom: 1.4em;
}

#page .wysiwyg dd {
  margin-left: 1.4em;
}

#page .wysiwyg ol,
#page .wysiwyg ul {
  list-style-position: outside;
  margin-left: 1.4em;
}

#page .wysiwyg ol {
  list-style-type: decimal;
}

#page .wysiwyg ol ol {
  list-style-type: lower-alpha;
}

#page .wysiwyg ol ol ol {
  list-style-type: lower-roman;
}

#page .wysiwyg ol ol ol ol {
  list-style-type: lower-greek;
}

#page .wysiwyg ol ol ol ol ol {
  list-style-type: decimal;
}

#page .wysiwyg ol ol ol ol ol ol {
  list-style-type: lower-alpha;
}

#page .wysiwyg ul {
  list-style-type: disc;
}

#page .wysiwyg ul ul {
  list-style-type: circle;
}

#page .wysiwyg ul ul ul {
  list-style-type: square;
}

#page .wysiwyg ul ul ul ul {
  list-style-type: circle;
}

#page .wysiwyg ul ul ul ul ul {
  list-style-type: disc;
}

#page .wysiwyg ul ul ul ul ul ul {
  list-style-type: circle;
}

#page .wysiwyg blockquote {
  border-left: 4px solid #e6e6e6;
  padding: 0.6em 1.2em;
}

#page .wysiwyg blockquote p {
  margin-bottom: 0;
}

#page .wysiwyg code,
#page .wysiwyg kbd,
#page .wysiwyg samp,
#page .wysiwyg pre {
  -moz-osx-font-smoothing: auto;
  -webkit-font-smoothing: auto;
  background-color: #f2f2f2;
  color: #333;
  font-size: 0.9em;
}

#page .wysiwyg code,
#page .wysiwyg kbd,
#page .wysiwyg samp {
  border-radius: 3px;
  line-height: 1.77778;
  padding: 0.1em 0.4em 0.2em;
  vertical-align: baseline;
}

#page .wysiwyg pre {
  overflow: auto;
  padding: 1em 1.2em;
}

#page .wysiwyg pre code {
  background: none;
  font-size: 1em;
  line-height: 1em;
}

#page .wysiwyg figure {
  margin-bottom: 2.8em;
  text-align: center;
}

#page .wysiwyg figure:first-child {
  margin-top: 0;
}

#page .wysiwyg figure:last-child {
  margin-bottom: 0;
}

#page .wysiwyg figcaption {
  font-size: 0.8em;
  margin-top: .875em;
}

#page .wysiwyg table {
  width: 100%;
}

#page .wysiwyg table pre {
  white-space: pre-wrap;
}

#page .wysiwyg th,
#page .wysiwyg td {
  font-size: 1em;
  padding: .7em;
  border: 1px solid #e6e6e6;
  line-height: 1.4;
}

#page .wysiwyg thead tr,
#page .wysiwyg tfoot tr {
  background-color: #f5f5f5;
}

#page .wysiwyg thead th,
#page .wysiwyg thead td {
  font-size: .9em;
  padding: .77778em;
}

#page .wysiwyg tfoot th,
#page .wysiwyg tfoot td {
  font-size: .9em;
  padding: .77778em;
}

#page .wysiwyg thead th code,
#page .wysiwyg thead td code {
  background-color: #fff;
}

#page .wysiwyg tfoot th code,
#page .wysiwyg tfoot td code {
  background-color: #fff;
}

#page .wysiwyg tbody tr {
  background-color: #fff;
}

#experience {
  padding: 15vw 0 6.25vw;
  background-color: #ffffff;
}

#experience .question {
  position: absolute;
  width: 12vw;
  height: 12vw;
  background-image: url(../img/question.png);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  top: -10vw;
  left: -6vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #experience .question {
    display: none;
  }
}

#experience .columns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #experience .columns {
    display: block;
  }
}

#experience .columns__left {
  width: 35.00vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #experience .columns__left {
    width: 100%;
    padding-right: 0vw;
  }
}

#experience .columns__right {
  width: 25vw;
  text-align: right;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #experience .columns__right {
    width: 100%;
    text-align: left;
  }
}

#experience .title {
  color: #3d3d3d;
  font-family: "Abril Fatface", "Times New Roman", Times, serif;
  margin-bottom: 13.5vw;
  color: #806d2c;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #experience .title {
    margin-bottom: 21vw;
    padding-right: 10.5vw;
  }
}

#experience .subtitle {
  margin-bottom: 2vw;
  text-align: left;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #experience .subtitle {
    margin-bottom: 10.5vw;
  }
}

#experience .subtitle sup {
  font-size: 40%;
  vertical-align: top;
}

#experience .subtitle .special {
  color: #8c7b38;
  position: relative;
  display: inline-block;
  width: 100%;
  overflow: hidden;
  text-align: right;
  margin-bottom: 0;
  font-weight: 900;
}

#experience .subtitle .special span {
  position: relative;
  display: inline-block;
}

#experience .subtitle .special span:before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background-color: #8c7b38;
  position: absolute;
  right: 110%;
  top: 50%;
}

#experience .description {
  width: 25vw;
  color: #3d3d3d;
  text-align: left;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #experience .description {
    margin-bottom: 14vw;
    width: 100%;
  }
}

#experience .button {
  opacity: 0.0001;
  will-change: opacity;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #experience .button {
    margin-bottom: 7vw;
    width: 100%;
  }
}

#map {
  background-color: #ffffff;
  padding: 6.25vw 0;
  height: 100vh;
  text-align: center;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #map {
    height: auto;
    padding: 14vw 0;
  }
}

#map .map {
  position: relative;
  margin: auto;
  width: auto;
  height: 100%;
  display: inline-block;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #map .map {
    width: 90%;
    height: auto;
  }
}

#map .map img {
  height: 100%;
  width: auto;
  vertical-align: middle;
  opacity: 0.0001;
  will-change: opacity;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #map .map img {
    width: 100%;
    height: auto;
  }
}

#map .map .locations {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}

#map .map .locations .location {
  width: 3vw;
  height: 3vw;
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
  border: 1px solid #8c7b38;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #map .map .locations .location {
    width: 3.5vw;
    height: 3.5vw;
    background-color: #8c7b38;
    border: 0;
  }
}

#map .map .locations .location:before {
  content: "";
  display: block;
  width: 0.3vw;
  height: 0.3vw;
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
  background-color: #8c7b38;
  -webkit-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #map .map .locations .location:before {
    display: none;
  }
}

#map .map .locations .location--small {
  width: 2vw;
  height: 2vw;
}

#map .map .locations .location--medium {
  width: 3vw;
  height: 3vw;
}

#map .map .locations .location--large {
  width: 4vw;
  height: 4vw;
}

#map .slider {
  position: absolute;
  width: auto;
  left: 50%;
  top: 42%;
  text-align: center;
  -webkit-transform: translateX(-50%) translateY(-50%);
          transform: translateX(-50%) translateY(-50%);
}

#map .slider .slider__inner {
  text-align: center;
  white-space: nowrap;
}

#map .slider .slider__inner span {
  display: inline-block;
  margin: 0 2vw;
  font-size: 3vw;
  font-weight: 200;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #map .slider .slider__inner span {
    font-size: 7vw;
  }
}

#control {
    padding: 13.5vw 0 13.5vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #control {
    padding: 21vw 0 10.5vw;
  }
}

#control .columns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #control .columns {
    display: block;
  }
}

#control .columns__left {
  width: 31.25vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #control .columns__left {
    width: 100%;
  }
}

#control .columns__right {
  width: 25vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #control .columns__right {
    width: 100%;
  }
}

#control .video {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  overflow: hidden;
  background-color: #000000;
}

#control .video__element {
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
	opacity: 1;
}

#control .background {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-color: #000000;
}

#control .background__bg {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  opacity: 0.3;
  background-image: url(../img/control-bg.jpg);
  background-position: center;
  background-size: cover;
}

#control .title {
  color: #ffffff;
  margin-bottom: 6.25vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #control .title {
    width: 50vw;
    margin-bottom: 10.5vw;
  }
}

#control .description {
  color: #868686;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #control .description {
    width: 60vw;
    margin-left: 19vw;
    margin-bottom: 14.5vw;
  }
}

#control .description strong {
  color: #8c7b38;
  font-weight: inherit;
}

#contact {
  background-color: #f9f9f9;
  padding: 0vw 0 8.75vw;
}

#contact .columns {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #contact .columns {
    display: block;
  }
}

#contact .columns__left {
  width: 31.25vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #contact .columns__left {
    width: 100%;
  }
}

#contact .columns__right {
  width: 12.5vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #contact .columns__right {
    width: 100%;
    border-top: 1px solid #3d3d3d;
  }
}

#contact .logo {
  position: relative;
  margin-bottom: 0;
  margin-left: -3.5vw;
  width: 15vw;
  height: 11vw;
  opacity: 0.0001;
  will-change: opacity;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #contact .logo {
    margin-left: -10.5vw;
    width: 50vw;
    height: 35vw;
  }
}

#contact .logo__image {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

#contact .title {
  font-family: "Aribau Grotesk", Arial, Helvetica, sans-serif;
  font-weight: 100;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #contact .title {
    margin-bottom: 14vw;
  }
}

#contact .title strong {
  font-weight: bold;
}

#contact .locations {
  margin-top: 14vw;
}

#contact .locations .location {
  font-weight: 200;
  opacity: 0.0001;
  will-change: opacity;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #contact .locations .location {
    margin-bottom: 14vw;
  }
}

#contact .locations .location:not(:last-child) {
  margin-bottom: 8vw;
}

#contact .locations .location__name {
  font-weight: 400;
  line-height: 1.1;
  font-size: 2vw;
  font-weight: bold;
  margin-bottom: 1vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #contact .locations .location__name {
    width: 50vw;
    font-size: 7vw;
    margin-bottom: 3.5vw;
  }
}

#contact .locations .location__phone {
  text-decoration: none;
}

#contact .locations .location__address {
  text-decoration: none;
}

#contact .locations .location__email {
  text-decoration: none;
  text-decoration: underline;
  font-weight: 400;
}

#companies {
  background-color: #ffffff;
  padding: 6.25vw 0 4vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #companies {
    padding: 14vw 0 10.5vw;
  }
}

#companies .subtitle {
  width: 25vw;
  margin-bottom: 6.25vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #companies .subtitle {
    width: 50vw;
  }
}

#companies .slider {
  position: relative;
  width: 100%;
  margin-bottom: 0vw;
}

#companies .slider .slider__inner {
  white-space: nowrap;
  height: 6.25vw;
  width: 100%;
  position: relative;
  left: 0;
  top: 0;
  overflow: hidden;
  margin-bottom: 2vw;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #companies .slider .slider__inner {
    height: 24vw;
  }
}

#companies .slider .slider__inner .slider__item {
  margin: 0;
  position: absolute;
  left: 0;
  top: 0;
  height: 6.25vw;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #companies .slider .slider__inner .slider__item {
    height: 24vw;
  }
}

#companies .slider .slider__inner .slider__item img {
  width: auto;
  height: 60%;
  vertical-align: middle;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #companies .slider .slider__dots {
    display: none;
  }
}

#form-tanatorio,
#form-user {
  width: 50vw;
  height: 100vh;
  position: fixed;
  left: 0;
  top: 0;
  background-color: #f9f9f9;
  -webkit-transform: translateX(-100%);
          transform: translateX(-100%);
  padding: 6.25vw;
  will-change: transform;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #form-tanatorio,
  #form-user {
    padding: 10.5vw;
    width: 100vw;
	position: fixed;  
  }
}

#form-tanatorio .closer,
#form-user .closer {
  position: absolute;
  top: 2vw;
  right: 2vw;
  height: 3vw;
  width: 3vw;
  border-radius: 3vw;
  border: 1px solid #d9d9d9;
  cursor: pointer;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #form-tanatorio .closer,
  #form-user .closer {
    top: 10.5vw;
    right: 10.5vw;
    height: 14vw;
    width: 14vw;
    border-radius: 14vw;
  }
}

#form-tanatorio .closer .icon,
#form-user .closer .icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: 30% auto;
  background-image: url(../img/closer.svg);
  background-repeat: no-repeat;
  opacity: 1;
  -webkit-transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
  transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
}

#form-tanatorio .form,
#form-user .form {
  position: absolute;
  width: calc(100% - 12.5vw);
}

@media (max-width: 1023px){
#form-tanatorio .form, #form-user .form {
    top: 15%;
    width: calc(100% - 21vw);
}
	
.form .form__group {
    border-bottom: 1px solid #ccc;
    margin-bottom: 5px;
    margin-top: 5px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
	
.form .form__group label {
    font-size: 16px!important;
    line-height: 40px !important;
	
}
	
	.form .form__group input[type='text'], .form .form__group input[type='phone'], .form .form__group input[type='email'] {
    font-size: 16px !important;
    line-height: 40px !important;
    padding-left: 10px !important;
}
	
	.form .form__group .radio-container {
    width: 25px !important;
    height: 25px !important;
    margin-left: 22px !important;
    padding: 0px 0 !important;
}
	
	.form .form__group .radio-container label {
    line-height: 40px !important;
    font-size: 16px !important;
    left: 4px !important;
    top: -2px !important;
}
	
	.form .form__group .radio-container input[type='radio'] {
    width: 35px !important;
    height: 35px !important;
    border-radius: 10.5vw;
}
	
}

#footer {
  position: relative;
  background-color: #ffffff;
  border-top: 1px solid #ccc;
  font-size: 0.7vw;
  padding: 3vw 0;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #footer {
    font-size: 3vw;
    text-align: center;
    padding: 7vw 0;
  }
}

#footer .copyright {
  display: inline-block;
}

#footer ul {
  display: inline-block;
}

#footer ul li {
  display: inline-block;
}

#footer ul li:before {
  content: "|";
  margin-left: 0.5vw;
  margin-right: 0.5vw;
}

#footer ul li a {
  text-decoration: underline;
  font-weight: 400;
  cursor: pointer;
}



#cookies {
  padding: 2vw 12.5vw;
  position: fixed;
  bottom: 0px;
  left: 0;
  width: 100%;
  background-color: #ffff;
  transform: translateY(100%);
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #cookies {
    padding: 21vw 10.5vw 10.5vw;
  }
}

#cookies .text a{
  text-decoration: underline;
}

#cookies .closer{
  position: absolute;
  top: 2vw;
  right: 2vw;
  height: 3vw;
  width: 3vw;
  border-radius: 3vw;
  border: 1px solid #d9d9d9;
  cursor: pointer;
}

@media all and (max-width: 1023px) and (orientation: portrait), all and (max-width: 520px){
  #cookies .closer{
    top: 7vw;
    right: 3vw;
    height: 10vw;
    width: 10vw;
    border-radius: 10vw;
    right: 50%;
    transform: translateX(50%);
  }
}

#cookies .closer .icon{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: 30% auto;
  background-image: url(../img/closer.svg);
  background-repeat: no-repeat;
  opacity: 1;
  -webkit-transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
  transition: all 300ms cubic-bezier(0.76, 0.01, 0.31, 1);
}

#advice {
  padding: 2vw 12.5vw;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #ffff;
  display: none;
}
@media all and (min-width: 640px) and (orientation: portrait),
all and (max-width: 1023px) and (orientation: landscape) {
  #advice {
    display: block;
  }
}
@media all and (max-width: 400px){
  #advice {
    display: none !important;
  }
}
#advice .wrapper{
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
  font-weight: 600;
}

#advice .icon{
  width: 4vw;#hero
  margin: auto;
  margin-bottom: 2vw;
}


#advice .text{
  color: #806d2c;
}

@media all and (max-width: 1040px) {
  #advice .icon{
    width: 10vw;
    margin: auto;
    margin-bottom: 5vw;
  }  
  #advice .text{
    font-size: 3vw;
  }
}
/* # sourceMappingURL=styles.css.map */

.cfzBWk {
    display: none !important;
}

/* checkbox */
.text_check {
    margin-top: 15px;
    font-size: 14px;
}

input[type=checkbox] + label {
    display: block;
    margin: 0.2em;
    cursor: pointer;
    padding: 0.2em;
}

input[type=checkbox] {
    display: none;
}

input[type=checkbox] + label:before {
    content: "\2713";
    border: 0.1em solid #505050;
    border-radius: 0.2em;
    display: inline-block;
    width: 1em;
    height: 1em;
    padding-left: 0.3em;
    padding-bottom: 0.3em;
    margin-right: 0.4em;
    vertical-align: bottom;
    color: transparent;
    transition: .2s;
}

input[type=checkbox] + label:active:before {
    transform: scale(0);
}

input[type=checkbox]:checked + label:before {
    background-color: #806d2c;
    border-color: #806d2c;
    color: #fff;
}

input[type=checkbox]:disabled + label:before {
    transform: scale(1);
    border-color: #aaa;
}

input[type=checkbox]:checked:disabled + label:before {
    transform: scale(1);
    background-color: #bfb;
    border-color: #bfb;
}