
.WlayuoutGRID_ANIMBANNER {
  display: -ms-grid;
  display: grid;
  grid-auto-columns: 1fr;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  -ms-grid-rows: auto auto;
  grid-template-rows: auto auto;
  /*grid-row-gap: 16px;*/
  grid-column-gap: 16px;
}

.ANIMBANNER_marqueTit {
  position: relative;
  z-index: 2;
  overflow: hidden;
  width: 100%;
  height: 12em;
}

.ANIMBANNER_marqueTit_esquerda {
  position: absolute;
  left: 0%;
  top: 0%;
  right: auto;
  bottom: auto;
  margin-top: 0px;
  margin-bottom: 0px;
  float: none;
  clear: both;
  font-family: Bebasneue, Impact, sans-serif;
  color: hsla(0, 0%, 100%, 0);
  font-size: 13em;
  line-height: 1em;
  font-weight: 400;
  white-space: nowrap;
}

.ANIMBANNER_marqueTit_direita {
  position: absolute;
  left: 0%;
  top: 0%;
  right: auto;
  bottom: auto;
  margin-top: 0px;
  margin-bottom: 0px;
  float: none;
  clear: both;
  font-family: Bebasneue, Impact, sans-serif;
  color: hsla(0, 0%, 100%, 0);
  font-size: 13em;
  line-height: 1em;
  font-weight: 400;
  white-space: nowrap;
}

.ANIMBANNER_hero-features {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 6em;
}

.ANIMBANNER_CAIXINHA {
  margin-top: 0px;
  margin-bottom: 0px;
  padding-top: 0.25em;
  /*padding-bottom: 0.5em;*/
  font-family: Bebasneue, Impact, sans-serif;
  font-size: 2.3em;
  line-height: 1em;
  font-weight: 700;
}

.ANIMBANNER_CAIXINHA.text-template.padding-top {
  margin-top: 1em;
}

.AniParagraph-small {
  margin-bottom: 0px;
  color: #414141;
  font-size: 1em;
  /*line-height: 1.7em;*/
  font-weight: 300;
}

.AniParagraph-small._80 {
  width: 80%;
}

.AniParagraph-small._80.mobile-100.text-template {
  padding-top: 1em;
  padding-bottom: 2em;
}

.AniParagraph-small._80.mobile-half {
  font-family: din-2014, sans-serif;
}

.AniParagraph-small._80.center {
  text-align: center;
}

.AniParagraph-small.white {
  color: #dadada;
}

.AniParagraph-small.white.center {
  text-align: center;
}

.AniParagraph-small.white.roadmap {
  padding-left: 3em;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.AniSection {
  padding-top: 8em;
}

.AniSection.gray {
  overflow: hidden;
  padding-top: 0em;
  padding-bottom: 0em;
  background-color: #f6f6f6;
}

.AniSection.more-space {
  padding-top: 12em;
}

.AniSection.black {
  overflow: hidden;
  padding-bottom: 4em;
  background-color: #000;
}

.AniSection.hero {
  overflow: hidden;
  /*margin-top: 4em;*/
  padding-top: 0em;
}

.ANIMBANNER_marqueTexto {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 14em;
}

.ANIMBANNER_marque_direita_texto {
  position: absolute;
  left: 0%;
  top: auto;
  right: auto;
  bottom: 0%;
  margin-top: 0px;
  margin-bottom: 0px;
  float: none;
  clear: both;
  font-family: Bebasneue, Impact, sans-serif;
  font-size: 1em;
  line-height: 1em;
  font-weight: 400;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  white-space: nowrap;
}

.ANIMBANNER_marque_esquerda_texto {
  position: absolute;
  left: 0%;
  top: auto;
  right: auto;
  bottom: 0%;
  margin-top: 0px;
  margin-bottom: 0px;
  float: none;
  clear: both;
  font-family: Bebasneue, Impact, sans-serif;
  font-size: 1em;
  line-height: 1em;
  font-weight: 400;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  white-space: nowrap;
}

.ANIMBANNER_PhoneHero {
  position: relative;
  z-index: 10;
  width: 80%;
  margin-top: 6em;
}

#ANIMBANNER_FOTO {
  -ms-grid-column-span: 4;
  grid-column-end: 14;
  -ms-grid-column: 10;
  grid-column-start: 10;
  -ms-grid-row-span: 1;
  grid-row-end: 2;
  -ms-grid-row: 1;
  grid-row-start: 1;
  -ms-grid-row-align: center;
  align-self: center;
  -ms-grid-column-align: center;
  justify-self: center;
}

#ANIMBANNER_1 {
  -ms-grid-column-span: 7;
  grid-column-end: 9;
  -ms-grid-column: 2;
  grid-column-start: 2;
  -ms-grid-row-span: 1;
  grid-row-end: 2;
  -ms-grid-row: 1;
  grid-row-start: 1;
  -ms-grid-row-align: end;
  align-self: end;
}

#ANIMBANNER_2 {
  -ms-grid-column-span: 14;
  grid-column-end: 15;
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row-span: 1;
  grid-row-end: 2;
  -ms-grid-row: 1;
  grid-row-start: 1;
  -ms-grid-column-align: center;
  justify-self: center;
  -ms-grid-row-align: center;
  align-self: center;
}

#ANIMBANNER_3 {
  -ms-grid-column-span: 14;
  grid-column-end: 15;
  -ms-grid-column: 1;
  grid-column-start: 1;
  -ms-grid-row-span: 1;
  grid-row-end: 2;
  -ms-grid-row: 1;
  grid-row-start: 1;
  -ms-grid-column-align: center;
  justify-self: center;
  -ms-grid-row-align: center;
  align-self: center;
}

@media screen and (max-width: 479px) {

  #ANIMBANNER_FOTO {
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-column-span: 6;
    grid-column-end: 7;
  }

  #ANIMBANNER_1 {
    -ms-grid-row: 2;
    grid-row-start: 2;
    -ms-grid-row-span: 1;
    grid-row-end: 3;
    -ms-grid-column-span: 6;
    grid-column-end: 6;
  }

  #ANIMBANNER_2 {
    -ms-grid-column-span: 6;
    grid-column-end: 7;
    -ms-grid-column: 1;
    grid-column-start: 1;
    -ms-grid-row-span: 1;
    grid-row-end: 2;
    -ms-grid-row: 1;
    grid-row-start: 1;
    -ms-grid-column-align: center;
    justify-self: center;
    -ms-grid-row-align: center;
    align-self: center;
  }

  #ANIMBANNER_3 {
    -ms-grid-column-span: 7;
    grid-column-end: 7;
  }

}

@font-face {
  font-family: 'Bebasneue';
  src: url('../fonts/BebasNeue-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: auto;
}



/*  MOBILE */
@media (max-width: 700px) {

  #ANIMBANNER_1 {
    display: none
  }

  .ANIMBANNER_PhoneHero {
    margin-top: 8em;
  }

}




/*      ------------------------------------------      */






@keyframes marquee-left {
  from {
    transform: translateX(0%);
  }
  to {
    transform: translateX(100%);
  }
}

@keyframes marquee-right {
  from {
    transform: translateX(-100%);
  }
  to {
  transform: translateX(0%);
  }
}

.ANIMBANNER_marqueTit_esquerda {
  animation: 12s linear infinite marquee-left reverse;
  -webkit-text-stroke: 1px black;
}
.ANIMBANNER_marqueTit_direita {
  animation: 12s linear infinite marquee-right reverse;
  -webkit-text-stroke: 1px black;
}
.ANIMBANNER_marque_esquerda_texto {
  animation: 22s linear infinite marquee-left;
}
.ANIMBANNER_marque_direita_texto {
  animation: 22s linear infinite marquee-right;
}























