html {background:#fb4dac; scroll-behavior: smooth;}
body {font-size:14px;color:#000;font-family:'Space Grotesk';font-weight: 300;}
html,
body {height:100%;}
html.active {overflow: hidden;}

* {-webkit-font-smoothing: antialiased;}

i, em {font-style:italic;}

a {color:#000;}

a {text-decoration:none;cursor:pointer;}
a:hover {text-decoration:none;}

strong, b {font-weight:bold;}
input[type="reset"], input[type="submit"], button {cursor:pointer;}

::-webkit-input-placeholder {color:#fff;}
::-moz-placeholder {color:#fff;}
:-ms-input-placeholder {color:#fff;}
input:-moz-placeholder {color:#fff;}

select {
  -ms-box-sizing:content-box;
  -moz-box-sizing:content-box;
  -webkit-box-sizing:content-box;
  box-sizing:content-box;
}

select::-ms-expand {
  display: none;
}

::selection {
  background: #999;
  color: #fff;
}
::-moz-selection {
  background: #999;
  color: #fff;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  background:transparent !important;
}

form * {outline:0;}

form .error,
form .success {font-size:16px;margin-bottom: 15px;}
form .success {color: #0080007d;background: #e4f1d4;padding: 20px;border-radius: 4px;border: solid 2px #0080001f;font-weight: 600;}
form .error {color: #8000007d;background: #f1d4d4;padding: 20px;border-radius: 4px;border: solid 2px #8000001f;font-weight: 600;}
form .retorno {width: 100%;}

.clear {clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0;}
.last {margin-right:0px !important;}
.not-found {font-size:16px;margin:0px 0px 0px 20px;}

.wrapper {max-width:1440px;position:relative;z-index:1;left:50%;transform:translateX(-50%);width:calc(100% - 40px);}

.text {line-height:150%;}
.text p {margin-bottom:16px;}
.text img {display:table;margin:0 auto;max-width:100%;}

.loading-full {position:fixed;z-index:99;top:0;bottom:0;left:0;right:0;background:#2234637a;display:none;}

.sk-circle {
  width: 40px;
  height: 40px;
  position: fixed;
  z-index: 99;
  left: 50%;
  top: 50%;
  margin-left: -20px;
  margin-top: -20px;
}
.sk-circle .sk-child {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.sk-circle .sk-child:before {
  content: '';
  display: block;
  margin: 0 auto;
  width: 15%;
  height: 15%;
  background-color: #fff;
  border-radius: 100%;
  -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
          animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
}
.sk-circle .sk-circle2 {
  -webkit-transform: rotate(30deg);
      -ms-transform: rotate(30deg);
          transform: rotate(30deg); }
.sk-circle .sk-circle3 {
  -webkit-transform: rotate(60deg);
      -ms-transform: rotate(60deg);
          transform: rotate(60deg); }
.sk-circle .sk-circle4 {
  -webkit-transform: rotate(90deg);
      -ms-transform: rotate(90deg);
          transform: rotate(90deg); }
.sk-circle .sk-circle5 {
  -webkit-transform: rotate(120deg);
      -ms-transform: rotate(120deg);
          transform: rotate(120deg); }
.sk-circle .sk-circle6 {
  -webkit-transform: rotate(150deg);
      -ms-transform: rotate(150deg);
          transform: rotate(150deg); }
.sk-circle .sk-circle7 {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg); }
.sk-circle .sk-circle8 {
  -webkit-transform: rotate(210deg);
      -ms-transform: rotate(210deg);
          transform: rotate(210deg); }
.sk-circle .sk-circle9 {
  -webkit-transform: rotate(240deg);
      -ms-transform: rotate(240deg);
          transform: rotate(240deg); }
.sk-circle .sk-circle10 {
  -webkit-transform: rotate(270deg);
      -ms-transform: rotate(270deg);
          transform: rotate(270deg); }
.sk-circle .sk-circle11 {
  -webkit-transform: rotate(300deg);
      -ms-transform: rotate(300deg);
          transform: rotate(300deg); }
.sk-circle .sk-circle12 {
  -webkit-transform: rotate(330deg);
      -ms-transform: rotate(330deg);
          transform: rotate(330deg); }
.sk-circle .sk-circle2:before {
  -webkit-animation-delay: -1.1s;
          animation-delay: -1.1s; }
.sk-circle .sk-circle3:before {
  -webkit-animation-delay: -1s;
          animation-delay: -1s; }
.sk-circle .sk-circle4:before {
  -webkit-animation-delay: -0.9s;
          animation-delay: -0.9s; }
.sk-circle .sk-circle5:before {
  -webkit-animation-delay: -0.8s;
          animation-delay: -0.8s; }
.sk-circle .sk-circle6:before {
  -webkit-animation-delay: -0.7s;
          animation-delay: -0.7s; }
.sk-circle .sk-circle7:before {
  -webkit-animation-delay: -0.6s;
          animation-delay: -0.6s; }
.sk-circle .sk-circle8:before {
  -webkit-animation-delay: -0.5s;
          animation-delay: -0.5s; }
.sk-circle .sk-circle9:before {
  -webkit-animation-delay: -0.4s;
          animation-delay: -0.4s; }
.sk-circle .sk-circle10:before {
  -webkit-animation-delay: -0.3s;
          animation-delay: -0.3s; }
.sk-circle .sk-circle11:before {
  -webkit-animation-delay: -0.2s;
          animation-delay: -0.2s; }
.sk-circle .sk-circle12:before {
  -webkit-animation-delay: -0.1s;
          animation-delay: -0.1s; }

@-webkit-keyframes sk-circleBounceDelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
            transform: scale(0);
  } 40% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes sk-circleBounceDelay {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
            transform: scale(0);
  } 40% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

.lg-autoplay-button {
    display: none;
}

#lg-counter, .lg-toolbar .lg-icon {
    color: #fff!important;
}

.lg-object {
    border-radius: 4px;
}

.lg-toolbar {
    background-color: #fb4dac!important;
}

.lg-backdrop {
    background-color: #000!important;
}

.lg-actions .lg-next, .lg-actions .lg-prev {
    background-color: #fb4dac!important;
    border-radius: 40px!important;
    color: #fff!important;
    padding: 20px 20px 20px!important;
}

#content {position:relative;width:100%;max-width:1920px;margin:0 auto;overflow-x: clip;box-shadow: 0 0 300px #600377; animation: fadebg 5s linear infinite alternate;}

@keyframes fadebg {
    0% {
        background:#fb4dac;
    }
    50% {
        background:#fa4e76;
    }
    100% {
        background:#c84efa;
    }
}

#content-page {}

.bg-noise {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
}
.bg-noise:before {
  position: absolute;
  content: '';
  top: -10rem;
  left: -10rem;
  width: calc(100% + 20rem);
  height: calc(100% + 20rem);
  z-index: -1;
  pointer-events: none;
  background-image: url(../imagens/site/bg-noise.png);
  background-position: 50%;
  animation: BgNoise 1s steps(2) infinite;
}
@keyframes BgNoise {
  0% { transform: translate3d(0, 9rem, 0) }
  10% { transform: translate3d(-1rem, -4rem, 0) }
  20% { transform: translate3d(-8rem, 2rem, 0) }
  30% { transform: translate3d(9rem, -9rem, 0) }
  40% { transform: translate3d(-2rem, 7rem, 0) }
  50% { transform: translate3d(-9rem, -4rem, 0) }
  60% { transform: translate3d(2rem, 6rem, 0) }
  70% { transform: translate3d(7rem, -8rem, 0) }
  80% { transform: translate3d(-9rem, 1rem, 0) }
  90% { transform: translate3d(6rem, -5rem, 0) }
  to { transform: translate3d(-7rem, 0, 0) }
}

.title.size0 {font-size: 160px; line-height: 140px;}
.title.size1 {font-size: 70px;}
.title.size2 {font-size: 44px;}
.title.size3 {font-size: 24px;}
.title.size4 {font-size: 18px;}
.title b {font-weight: 800;}

.text {font-size: 16px; font-weight: 300; line-height: 120%;}
.text p {font-size: 16px;}
.text span {font-size: 16px;}
.text.size2 {font-size: 24px; line-height: 36px;}
.text.size2 p {font-size: 24px;}
.text.size2 span {font-size: 24px;}
.text.size3 {font-size: 32px;}
.text.size3 p {font-size: 32px;}
.text.size3 span {font-size: 32px;}

.button {display: flex; cursor: pointer;}
.button svg {width: 120px; height: 45px;}
.button svg path {fill: #fff; transition-duration: .4s;}
.button:hover svg path {fill: #00eace; transition-duration: .4s;}
.button.small svg {width: 78px; height: 30px;}
.button.reverse {transform: rotate(180deg);}

.semibold {font-weight: 500;}
.bold {font-weight: 600;}
.extrabold {font-weight: 700;}

.upp {text-transform: uppercase;}
.justf {text-align: justify;}

.white {color: #fff;}
.cyan {color: #00eace;}
.pink {color: #fa4eac;}
.purple {color: #600377;}

.owl-dots {display: flex; align-items: center; justify-content: center; counter-reset: dot;}
.owl-dots .owl-dot {display: flex; align-items: center; counter-increment: dot; position: relative; font-size: 18px; font-weight: 600; color: #6003774b; transition-duration: .4s;}
.owl-dots .owl-dot:hover {color: #fff; transition-duration: .4s;}
.owl-dots .owl-dot.active {color: #fff; transition-duration: .4s;}
.owl-dots .owl-dot::before {content: ""; width: 24px; height: 24px; margin-right: 10px; background: url(../imagens/site/owl_roxo.png) no-repeat center; background-size: contain; transition-duration: .4s;}
.owl-dots .owl-dot:hover::before {content: ""; width: 24px; height: 24px; background: url(../imagens/site/owl_branco.png) no-repeat center; background-size: contain; transition-duration: .4s;}
.owl-dots .owl-dot.active::before {content: ""; width: 24px; height: 24px; background: url(../imagens/site/owl_branco.png) no-repeat center; background-size: contain; transition-duration: .4s;}
.owl-dots .owl-dot span::before {content: counter(dot, decimal-leading-zero);}

.owl-nav {display: flex; align-items: center; justify-content: space-between; position: absolute; z-index: -1; top: 0; height: 100%; width: calc(100% + 100px); left:50%; transform:translateX(-50%);}
.owl-nav .owl-prev {font-size: 0; background: url(../svg/ico_arrow_left.svg) no-repeat; height: 23px; width: 13px;}
.owl-nav .owl-next {font-size: 0; background: url(../svg/ico_arrow_right.svg) no-repeat; height: 23px; width: 13px;}

.lg-close {display:none; content: "";}
.lg-item .close {position: absolute; width:30px;height:30px;background:url(../svg/ico_close.svg) no-repeat;z-index:9;cursor:pointer;left:50%;top:50%;transform:translate(-50%,-50%);margin-left:460px;margin-top:-280px;}

#erro .erro {display: flex; flex-direction: column; align-items: center; padding: 50px 0 150px;}
#erro .erro .titulo {max-width: 550px; text-align: center;}
#erro .erro .botao {margin-top: 45px;}

.cookie-bar {position:fixed;z-index:999999;bottom:0;left:0px;width:100%;}
.cookie-bar .conteudo {display: flex;background: #191719;padding: 30px 30px 0px;border-radius: 20px; margin-bottom: 30px;}
.cookie-bar .icone {margin-right: 20px;}
.cookie-bar .icone svg {width: 40px; height: 40px;}
.cookie-bar .icone svg path {fill: #c8c5a6;}
.cookie-bar .box {float:left;width: calc(100% - 380px);margin-right: 20px;}
.cookie-bar .titulo {color:#fff;font-size:18px;margin-bottom:10px;font-weight:500;}
.cookie-bar .texto {color:#fff;font-size:14px;}
.cookie-bar .texto a {text-decoration:underline;color:#fff;}
.cookie-bar .buttons {float:right;width:300px;}
.cookie-bar .buttons li {display: flex; align-items: center; justify-content: center; cursor: pointer; margin-bottom:15px; width: 100%; font-size: 14px; font-weight: 600; height: 35px; color: #191719; background: #00eace; transition-duration: .8s;}
.cookie-bar .buttons li:hover {opacity: .6; transition-duration: .8s;}
.cookie-bar .buttons li:last-child {margin-bottom:30px;}

.social {display: flex; align-items: center;}
.social li {margin-left: 10px;}
.social li:first-child {margin-left: 0!important;}
.social a {display: flex; justify-content: center; align-items: center; position: relative; box-sizing: border-box; height: 40px; width: 40px; border-radius: 50%; background: #fff0; border: solid 3px #fff; transition-duration: .8s;}
.social a:hover {background: #fff; border-color: #191719; transition-duration: .8s;}
.social a svg {height: 18px; width: 18px; transition-duration: .8s;}
.social a svg path {fill: #fff; transition-duration: .8s;}
.social a:hover svg path {fill: #191719; transition-duration: .8s;}
.social .tooltip-text {position: absolute; left: 50%; bottom: calc(100% + 10px); transform: translateX(-50%); background: #111; color: #fff; font-size: 14px; font-weight: 500; padding: 8px 12px; border-radius: 6px; white-space: nowrap; opacity: 0; visibility: hidden; pointer-events: none; transition: 0.2s ease; z-index: 9999;}
.social .tooltip-btn:hover .tooltip-text {opacity: 1; visibility: visible;}

form {display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%;}
form .box {display: flex; position: relative; box-sizing: border-box; overflow: hidden; border: none; margin-bottom: 20px; height: 60px; border-radius: 50px; background: #000; transition-duration: .8s;}
form .small4 {width: calc(25% - 10px);}
form .small2 {width: calc(50% - 10px);}
form .small {width: 100%;}
form .small.message {height: 160px; border-radius: 30px;}
form .box .label {font-size: 18px; position: absolute; top: 50%; transform: translateY(-50%); left: 35px; font-weight: 600; color: #fff; transition-duration: .8s;}
form .box.focus .label {font-size: 12px; top: 6px; color: #fa4eac; transform: none; transition-duration: .8s;}
form .box.message .label {top: 20px; transform: none;}
form .box.focus.mensagem .label {top: 10px; transform: none;}
form .box.focus.pequeno .label {top: 10px; transform: none;}
form .box.focus.pequeno input {font-size: 15px;}
form input[type="text"],
form input[type="email"],
form input[type="phone"],
form input[type="password"],
form input[type="search"],
form textarea,
form select {outline: 0; height: 100%; width: 100%; padding: 0 0 0 35px; font-size: 14px; background: #fff0; color: #fff; border: solid 2px #fa4eac; border-radius: 50px; font-weight: 600; box-sizing: border-box; transition-duration: .8s;}
form select {background: url(../svg/ico_arrow_form.svg) no-repeat right!important; background-position-x: 95%!important; background-size: 10px!important; -webkit-appearance: none;}
form select option {font-size: 16px;}
form textarea {resize: none; height: 160px; padding-top: 20px; border-radius: 30px;}
form .box-button {width: 100%; padding-right: 20px; display: flex; align-items: center; justify-content: flex-end; box-sizing: border-box;}
form .box-button .terms {display: flex; align-items: center; font-size: 14px; font-weight: 600; color: #fa4eac; margin-right: 40px;}
form .box-button .terms a {font-size: 14px; text-decoration: underline; margin-left: 3px; color: #fa4eac; transition-duration: .8s;}
form .box-button .terms a:hover {opacity: .6; transition-duration: .8s;}
form .box-button .terms input {margin-right: 10px;}
form button {outline: 0; border: none; background: none;}
form .box-button .button svg {width: 72px; height: 27px;}
form .box-button .button svg path {fill: #fff;}

.modal {position: fixed; height: 100vh; width: 100%; right: -100%; top: 0; z-index: 99; opacity: 0; overflow: auto; overflow-x: hidden; transition-duration: .8s;}
.modal .bg {position: fixed; width: 0; height: 100%; background: #600377; opacity: .9; z-index: 1; transition-duration: .8s;}
.modal.active .bg {width: 100%; right: 0; transition-duration: .8s;}
.modal.active {opacity: 1; right: 0; height: 100vh; transition-duration: .8s;display:block;}
.modal .rocket {position: absolute; z-index: 2; top: 380px; left: -400px; animation: floatrocket 8s cubic-bezier(0.25, 1.5, 0.5, 1) infinite; }
@keyframes floatrocket {
  0% {
    transform: scale(0.9) rotate(-4deg); opacity: 0;
  }
  25% {
    transform: scale(1.1) rotate(2deg); opacity: 1; top: 80px; left: 65px;
  }
  50% {
    transform: scale(1) rotate(0); opacity: 100%; top: 40px; left: 250px;
  }
  75% {
    transform: scale(1) rotate(0); opacity: 1; top: -100px; left: 500px;
  }
  99% {
    transform: scale(1) rotate(0); opacity: 1; top: -200px; left: 600px;
  }
  100% {
    transform: scale(0.9) rotate(-4deg); opacity: 0; top: -300px; left: -40px;
  }
}
.modal .rocket svg path {fill: #f4f4f4;}
.modal .big-title {text-align: right; position: fixed; z-index: 3; bottom: -80px; scale: 0; right: 0%; font-size: 328px; line-height: 260px;transition-duration: .8s;}
.modal .big-title.active {scale: .9; right: 55%;transition-duration: .8s;}
.modal .content {width: 70%; max-width: 1150px; min-height: 100vh; padding: 3% 0; background: url(../svg/dot_circle.svg) no-repeat bottom right #000; background-size: 950px; background-position-y: calc(100% + 220px); background-position-x: calc(100% + 440px); right: 0; top: 0; border-radius: 0; margin: 0; left: auto; transform: none; overflow: visible; box-sizing: border-box; position: absolute; z-index: 2;}
.modal .close {height: auto; width: auto; position: absolute; z-index: 5; transform: rotate(180deg); left: 25px; top: 105px; transition-duration: .8s;}
.modal .close:hover {left: 10px; transition-duration: .8s;}
.modal .close svg {width: 72px; height: 27px;}
.modal .close svg path {fill: #fff;}
.modal .logo {position: absolute; right: 60px; top: 40px;}
.modal .logo svg {width: 230px; height: fit-content;}
.modal .logo svg path {fill: #fa4eac;}
.modal .planet {position: absolute; z-index: -1; right: 3%; bottom: 5%; animation: zoomplanet 8s cubic-bezier(0.25, 1.5, 0.5, 1) infinite; }
@keyframes zoomplanet {
  0% {
    transform: scale(0.9) rotate(-4deg);
  }
  20% {
    transform: scale(1.1) rotate(2deg);
  }
  50% {
    transform: scale(1) rotate(0);
  }
  80% {
    transform: scale(1.1) rotate(2deg);
  }
  100% {
    transform: scale(0.9) rotate(-4deg);
  }
}
.modal .planet svg {width: 340px; height: 210px;}
.modal .planet svg path {fill: #00eace;}
.modal .box-content {width: calc(100% - 40px); max-width: 700px; margin: 0 auto; box-sizing: border-box;}
.modal .info {padding-left: 35px;}
.modal .social {margin-top: 20px;}
.modal .form {margin-top: 40px;}
.modal .links {display: flex; flex-direction: column; margin-top: 10%;}
.modal .links .item {display: flex; align-items: center; width: fit-content; cursor: pointer; font-size: 24px; margin-bottom: 25px; transition-duration: .4s;}
.modal .links .item:last-child {margin-bottom: 0;}
.modal .links .item:hover {color: #00eace; transition-duration: .4s;}
.modal .links .item svg {width: 50px; height: 50px; margin-right: 20px; animation: rotate infinite 8s linear;}
.modal .links .item svg path {fill: #00eace;}
@keyframes rotate {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(360deg) translate3D(0%, 0%, 0);}
} 

.modal.popup-age {backdrop-filter: blur(3px);}
.modal.popup-age .bg {animation: fademodal 5s linear infinite alternate;}
@keyframes fademodal {
    0% {
        background:#fb4dac;
    }
    50% {
        background:#fa4e76;
    }
    100% {
        background:#c84efa;
    }
}
.modal.popup-age .content {background: #000; max-width: 805px; padding: 250px 70px 65px; right: 50%; top: calc(50% + 50px); transform: translateX(50%) translateY(-50%); min-height: auto; display: flex; flex-direction: column; align-items: center;}
.modal.popup-age svg {position: absolute; animation: modalastronaut 10s ease-in-out infinite;}
@keyframes modalastronaut {
    0% {transform: rotate(340deg); top: -205px;}
    25% {transform: rotate(342deg); top: -195px;}
    50% {transform: rotate(340deg); top: -205px;}
    75% {transform: rotate(338deg); top: -195px;}
    100% {transform: rotate(340deg); top: -205px;}
}
.modal.popup-age svg path {fill: #fff;}
.modal.popup-age .info {width: 100%; padding: 0; text-align: center;}
.modal.popup-age .title {margin-bottom: 20px;}
.modal.popup-age .buttons {width: 100%; padding: 30px 20px 0; box-sizing: border-box; display: flex; justify-content: space-between;}
.modal.popup-age .button-modal {display: flex; flex-direction: column; cursor: pointer; font-size: 28px; letter-spacing: 2px; color: #777; transition-duration: .8s;}
.modal.popup-age .button-modal:hover {color: #fff; transition-duration: .8s;}
.modal.popup-age .button-modal .line {margin-bottom: 20px; margin-left: 10px; width: 40px; height: 7px; border-radius: 50px; background: #1cf281; opacity: 0; transition-duration: .8s;}
.modal.popup-age .button-modal:hover .line {opacity: 1; margin-left: 18px; transition-duration: .8s;}
.modal.popup-age .content-age.active {display: none; z-index: -1;}
.modal.popup-age .content-older {z-index: -1;}
.modal.popup-age .content-older.active {z-index: 2;}
.modal.popup-age .content-older .title {margin-top: 35px;}

.big-menu {position: fixed; top: 0; right: -100%; height: 100vh; width: 100%; z-index: 99; opacity: 0; overflow: hidden; transition-duration: .8s;}
.big-menu.active {opacity: 1; right: 0; transition-duration: .8s;}
.big-menu .bg {position: absolute; height: 100%; width: 100%; background: #600377; opacity: .9; z-index: 1;}
.big-menu .bg-pop {position: absolute; z-index: 2;}
.big-menu .bg-pop img {object-fit: contain;}
.big-menu .bg1 {left: 15%; filter: blur(5px); animation: floatbg1 8.5s ease-in-out infinite;}
@keyframes floatbg1 {
    0% {top: 120px;}
    25% {top: 140px;}
    50% {top: 120px;}
    75% {top: 140px;}
    100% {top: 120px;}
}
.big-menu .bg1 img {width: 220px; transform: rotate(-35deg);}
.big-menu .bg2 {left: 85px; animation: floatbg2 7s ease-in-out infinite;}
@keyframes floatbg2 {
    0% {bottom: 60px;}
    25% {bottom: 90px;}
    50% {bottom: 60px;}
    75% {bottom: 90px;}
    100% {bottom: 60px;}
}
.big-menu .bg3 {right: 26%; filter: blur(3px); animation: floatbg3 10s ease-in-out infinite;}
@keyframes floatbg3 {
    0% {bottom: 55px;}
    25% {bottom: 75px;}
    50% {bottom: 55px;}
    75% {bottom: 75px;}
    100% {bottom: 55px;}
}
.big-menu .bg3 img {height: 95px; width: 95px;}
.big-menu .content {position: relative; box-sizing: border-box; width: 100%; height: 100vh; padding-top: 70px;}
.big-menu .icon {background: url(../svg/bg_menu.svg) no-repeat right top; background-size: contain; position: absolute; z-index: 2; right: 0; top: 0; width: 70%; height: 98vh; max-height: 900px;}
.big-menu .planet {position: absolute; bottom: 27%; left: 17%; animation: menuplanet 8s cubic-bezier(0.25, 1.5, 0.5, 1) infinite;}
@keyframes menuplanet {
  0% {transform: scale(0.9) rotate(-4deg);}
  20% {transform: scale(1.1) rotate(2deg);}
  50% {transform: scale(1) rotate(0);}
  80% {transform: scale(1.1) rotate(2deg);}
  100% {transform: scale(0.9) rotate(-4deg);}
}
.big-menu .planet svg {width: 275px;}
.big-menu .planet svg path {fill: #00eace;}
.big-menu .star {position: absolute; right: 75px; top: calc(100% - 100px); animation: menuzoom infinite 4s linear;}
@keyframes menuzoom {
  0% {transform: scale(.8);}
  50% {transform: scale(1);}
  100% {transform: scale(.8);}
}
.big-menu .star svg {height: 140px; width: 140px;}
.big-menu .star svg path {fill: #1cf281;}
.big-menu .wrapper {display: flex; justify-content: flex-end; z-index: 3;}
.big-menu .ico-close {margin: 10px 30px 0 60px; cursor: pointer;}
.big-menu .menu {display: flex; flex-direction: column; width: 360px;}
.big-menu .menu li {margin-bottom: 25px;}
.big-menu .menu li:last-child {margin-bottom: 0;}
.big-menu .link {position: relative;cursor: pointer; display: block; left: 0; font-size: 38px; height: 55px; letter-spacing: 1px; font-weight: 500; color: #fff; transition-duration: .8s;}
.big-menu .link:hover {left: 30px; font-size: 42px; transition-duration: .8s;}
.big-menu .link .line {position: absolute; top: -15px; left: 15px; opacity: 0; width: 40px; height: 7px; border-radius: 50px; background: #1cf281; transition-duration: .8s;}
.big-menu .link:hover .line {left: 25px; opacity: 1; transition-duration: .8s;}
.big-menu .social {position: absolute; z-index: 3; right: 35px; top: 50%; transform: translateX(-50%); flex-direction: column;}
.big-menu .social li {margin: 6px 0;}

.slogan {margin-top: 60px; position: relative; height: 95px;}
.slogan .list {display: -webkit-box; display: flex; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; position: absolute; top: 0; white-space: nowrap; will-change: transform; animation: marquee-horizontal 26s linear infinite;}
@keyframes marquee-horizontal {
  from {transform: translateX(0)}
  to {transform: translateX(-50%)}
}
.slogan .slogan-title {font-size: 130px; line-height: 95px; margin: 0 25px;}

.about-us {display: flex; align-items: center; justify-content: flex-start; position: relative;}
.about-us .box-img {mask-image: url(../svg/big_flower.svg); background: #191719; mask-repeat: no-repeat; mask-size: 100%; height: 710px; width: 710px; position: relative; display: flex; align-items: center; justify-content: center;}
.about-us .box-img img {width: 100%; height: 100%; opacity: .6; object-fit: cover; transition-duration: .8s;}
.about-us .box-img:hover img {transform: scale(1.2); transition-duration: .8s;}
.about-us .box-img svg {position: absolute; height: 60px; width: 40px;}
.about-us .box-img svg path {fill: #fff;}
.about-us .info {width: 50%; padding-left: 80px; box-sizing: border-box; position: relative;}
.about-us .title {margin: 100px 0 50px; max-width: 380px;}
.about-us .star {position: absolute; z-index: 3; left: 650px; top: 40%; animation: zoom6 infinite 4s linear;}
@keyframes zoom6 {
  0% {transform: scale(.8);}
  50% {transform: scale(1);}
  100% {transform: scale(.8);}
}
.about-us .flower {position: absolute; z-index: 3; left: -40px; bottom: 40px; animation: rotate9 infinite 10s linear;}
@keyframes rotate9 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(-360deg) translate3D(0%, 0%, 0);}
} 
.about-us .star2 {position: absolute; bottom: 45px; right: 40%; animation: rotate10 infinite 7s linear;}
@keyframes rotate10 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(360deg) translate3D(0%, 0%, 0);}
} 
.about-us .star2 svg {height: 55px; width: 55px;}

.products {background: url(../svg/dot_circle.svg) no-repeat right top #191719; background-position-x: calc(100% + 280px); background-position-y: 70px; padding: 80px 0 60px; display: flex; align-items: flex-end; position: relative;}
.products .star {position: absolute; z-index: 2; right: 30px; bottom: 40px; animation: rotate6 infinite 6s linear;}
@keyframes rotate6 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(-360deg) translate3D(0%, 0%, 0);}
} 
.products .astronaut-flag {height: fit-content; position: absolute; z-index: 2; top: -60px; left: -45px; animation: floatastronautflag 10s ease-in-out infinite;}
@keyframes floatastronautflag {
    0% {transform: translateY(0) rotate(0deg); bottom: -110px;}
    25% {transform: translateY(-10px) rotate(2deg); bottom: -80px;}
    50% {transform: translateY(0) rotate(0deg); bottom: -110px;}
    75% {transform: translateY(10px) rotate(-2deg); bottom: -80px;}
    100% {transform: translateY(0) rotate(0deg); bottom: -110px;}
}
.products .astronaut-flag svg {height: 350px; width: fit-content;}
.products .wrapper {z-index: 3;}
.products .lists {position: relative;}
.products .list {padding-bottom: 40px; padding-top: 30px;position:absolute; top: 0; z-index: -1; opacity:0 !important;transition-duration:0.3s;}
.products .list.active {position:relative;z-index: 1; opacity:1 !important;transition-duration:4s;}
.products .list .owl-dots {flex-wrap: wrap; margin-top: 40px;}
.products .list .owl-dots .owl-dot {margin: 10px; color: #00eace;}
.products .list .owl-dots .owl-dot::before {background: url(../imagens/site/owl_azul.png) no-repeat center;}
.products .list .owl-dots .owl-dot.active {color: #fff;}
.products .list .owl-dots .owl-dot.active::before {background: url(../imagens/site/owl_branco.png) no-repeat center;}
.products .product {display: flex; flex-direction: column; align-items: center; position:relative;}
.products .product .info {width: 260px; margin-top: 60px; margin-bottom: 0; padding: 20px 30px; border-radius: 8px; transition-duration: .4s;}
.products .product:hover .info {margin-top: 0; margin-bottom: 60px; transition-duration: .4s;}
.products .product .title {margin-bottom: 20px; height: 30px; transition-duration: .4s;}
.products .product:hover .title {color: #fa4eac; font-size: 24px; transition-duration: .4s;}
.products .product .text {width: 80%; height: 40px; transition-duration: .4s;}
.products .product:hover .text {color: #fa4eac; transition-duration: .4s;}
.products .product .box-img {height: 440px; margin-top: 25px; width: 100%; position: relative; display: flex; justify-content: center; align-items: flex-start; transition-duration: .4s;}
.products .product:hover .box-img {height: 465px; margin-top: 0; transition-duration: .4s;}
.products .product .box-img img {object-fit: contain; position: relative; z-index: 3; max-height: 100%; max-width: 400px;}
.products .product .box-img .bg {position: absolute; bottom: 40px; z-index: 1; transition-duration: .4s;}
.products .product:hover .box-img .bg {bottom: 80px; transition-duration: .4s;}
.products .product .box-img svg {height: 335px; width: 335px; transition-duration: .4s;}
.products .product:hover .box-img svg {animation: rotate-product infinite 20s linear; transition-duration: .4s;}
.products .product .box-img .bg-popcorn {position: absolute; z-index: 2; top: 10px; width: 65%; opacity: 0; transition-duration: .4s;}
.products .product:hover .box-img .bg-popcorn {top: -55px; opacity: 1; transition-duration: .4s;}
.products .product .box-img .bg-popcorn img {width: 100%;}
@keyframes rotate-product {
0% {transform: rotate(0) scale(1.2) translate3D(0%, 0%, 0);}
100% {transform: rotate(-360deg) scale(1.2) translate3D(0%, 0%, 0);}
} 
.products .product.cyan .box-img svg path {fill: #00eace !important;}
.products .product.pink .box-img svg path {fill: #fa4eac !important;}
.products .product.green .box-img svg path {fill: #1cf281 !important;}
.products .product .cities {display: none;}
/* .products .product .cities {position: absolute; z-index: 5; display: flex; flex-direction: column; right: 20px; bottom: 0; transform: scale(.8); opacity: 0; transition-duration: .4s;}
.products .product:hover .cities {opacity: 1; bottom: 30px; transform: scale(1); transition-duration: .4s;}
.products .product .cities .city {margin-bottom: 5px; padding: 10px; border-radius: 8px; background: #191719db;}
.products .product .cities .city svg {width: 60px; height: 60px;}
.products .product .cities .city svg path {fill:#ccc;} */
.products .cities-menu {display:flex;flex-wrap: wrap; justify-content: center;position:relative;z-index:4;padding-top: 45px;top: 20px;}
.products .cities-menu .title {position: absolute; top: 0;}
.products .cities-menu .city {padding: 10px; border-radius: 8px; background: #191719db;margin:0 10px;cursor:pointer;transition-duration: .8s;}
.products .cities-menu .city.active {background:#00eace;transition-duration: .8s;}
.products .cities-menu .city:hover {background:#fa4eac;transition-duration: .8s;}
.products .cities-menu .city svg {width: 60px; height: 60px;}
.products .cities-menu .city svg path {fill:#ccc;transition-duration: .8s;}
.products .cities-menu .city.active svg path {fill:#fff;transition-duration: .8s;}
.products .cities-menu .city:hover svg path {fill:#fff;transition-duration: .8s;}

.box-top-internal {display: block; background: url(../imagens/site/bg_banner_eco.png); background-attachment: fixed;background-position: center 20px;background-repeat: no-repeat; will-change: transform;animation: backgroundroll 1.4s forwards;}
@keyframes backgroundroll {
    0% {
        background-position-y: 60px; opacity: 0; 
    }
    100% {
        background-position-y: center 0px; opacity: 1; 
    }
}
.box-top-internal .earth {position: absolute; left: -40px; top: 120px; animation: zoomearth 8s cubic-bezier(0.25, 1.5, 0.5, 1) infinite; }
.box-top-internal .earth svg {height: 220px; width: 220px;}
.box-top-internal .earth svg path {fill: #fff;}
@keyframes zoomearth {
  0% {
    transform: scale(0.9) rotate(-4deg);
  }
  20% {
    transform: scale(1.1) rotate(2deg);
  }
  50% {
    transform: scale(1) rotate(0);
  }
  80% {
    transform: scale(1.1) rotate(2deg);
  }
  100% {
    transform: scale(0.9) rotate(-4deg);
  }
}
.box-top-internal .star {position: absolute; right: 140px; top: 26vh; animation: zoom1 infinite 3s linear;}
@keyframes zoom1 {
  0% {transform: scale(.8);}
  50% {transform: scale(1);}
  100% {transform: scale(.8);}
}
.box-top-internal .star svg path {fill: #1cf281;}
.box-top-internal .star2 {position: absolute; bottom: 15px; left: 17vw; animation: rotate10 infinite 7s linear;}
@keyframes rotate10 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(360deg) translate3D(0%, 0%, 0);}
} 
.box-top-internal .star2 svg {width: 85px; height: 85px;}
.box-top-internal .star2 svg path {fill: #fa4eac;}
.box-top-internal .astronaut {position: absolute; height: fit-content; z-index: 3; right: 3%; animation: topastronaut 10s ease-in-out infinite;}
.box-top-internal .astronaut svg {width: 460px; height: 320px;}
.box-top-internal .astronaut svg path {fill: #fff;}
@keyframes topastronaut {
    0% {transform: translateY(0) rotate(0deg); bottom: 10px;}
    25% {transform: translateY(-10px) rotate(2deg); bottom: 30px;}
    50% {transform: translateY(0) rotate(0deg); bottom: 10px;}
    75% {transform: translateY(10px) rotate(-2deg); bottom: 30px;}
    100% {transform: translateY(0) rotate(0deg); bottom: 10px;}
}
.box-top-internal .wrapper {height: 100vh;}
.box-top-internal .info {position: absolute; bottom: 28vh; max-width: 440px;}
.box-top-internal .title {margin-bottom: 20px;}

#header {position: absolute; z-index: 9; width: 100%; animation: headerup 1.4s forwards;}
@keyframes headerup {
    0% {
        padding-top: -40px; scale: .8; opacity: 0;
    }
    100% {
        padding-top: 40px; scale: 1; opacity: 1;
    }
}
#header .content {display: flex; align-items: center; justify-content: space-between;}
#header .logo {display: flex; position: relative; transition-duration: .4s;}
#header .logo:hover {transform: scale(1.1); transition-duration: .4s;}
/* #header .logo::after {content: "TM"; position: absolute; left: 100%; top: 50%; transform: translateY(-50%); font-size: 24px; font-weight: 800; color: #000;} */
#header .logo svg {width: 230px; max-height: 140px;}
#header .menu {display: flex; justify-content: space-between; align-items: center; width: calc(50% - 300px); padding-bottom: 40px;}
#header .menu li {position: relative;}
#header .link {display: flex; justify-content: center; box-sizing: border-box; position: relative; padding: 13px 0; font-size: 24px; letter-spacing: 1px; transition-duration: .4s;}
#header .link:hover {color: #191719; padding: 0 0 26px; transition-duration: .4s;}
#header .link.active {color: #191719; padding: 0 0 26px; transition-duration: .4s;}
#header .link .line {position: absolute; bottom: 0; width: 30px; height: 7px; border-radius: 50px; opacity: 0; background: #191719; transition-duration: .4s;}
#header .link:hover .line {width: 50px; opacity: 1; transition-duration: .4s;}
#header .link.active .line {width: 50px; opacity: 1; transition-duration: .4s;}
#header .menu .submenu {position:absolute; left: 50%; transform: translateX(-50%); top: calc(100% + 20px); display:none;}
#header .menu .cities-menu {display:flex;}
#header .menu .cities-menu .city {padding: 10px; border-radius: 8px; background: #191719db;margin:0 5px;cursor:pointer;}
#header .menu .cities-menu .city.active {background:#00eace;}
#header .menu .cities-menu .city svg {width: 60px; height: 60px;}
#header .menu .cities-menu .city svg path {fill:#ccc;}
#header .menu .cities-menu .city.active svg path {fill:#fff;}
#header .ico-menu {display: flex; flex-direction: column; align-items: flex-end; justify-content: center; cursor: pointer; height: 90px; width: 90px; border-radius: 50%; background: url(../svg/ico_dot.svg) no-repeat center;}
#header .ico-menu .line {width: 36px; height: 4px; border-radius: 50px; background: #fff; margin-top: 7px; margin-right: 18px; transition-duration: .4s;}
#header .ico-menu:hover .line {width: 54px; transition-duration: .4s;}
#header .ico-menu .line:first-child {width: 54px; margin-top: 0;}
#header.header-values .link {color: #000;}

#footer {background: url(../imagens/site/footer.jpg) no-repeat center bottom #610075; padding: 20px 0 50px; position: relative;}
#footer .slogan .list {animation: marquee-horizontal 14s linear infinite;}
#footer .content {display: flex; justify-content: space-between; align-items: flex-start; padding-top: 160px;}
#footer .contacts {display: flex; flex-direction: column;}
#footer .contacts li {margin-bottom: 25px;}
#footer .contacts li:last-child {margin-bottom: 0;}
#footer .item {display: flex; align-items: center; width: fit-content; cursor: pointer; font-size: 24px; transition-duration: .4s;}
#footer .item:hover {color: #00eace; transition-duration: .4s;}
#footer .item svg {width: 50px; height: 50px; margin-right: 20px; animation: rotate infinite 8s linear;}
@keyframes rotate {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(360deg) translate3D(0%, 0%, 0);}
} 
#footer .item svg path {fill: #00eace;}
#footer .policies {display: flex; flex-direction: column; align-items: center; padding-top: 130px;}
#footer .menu {display: flex; justify-content: center; align-items: center; padding-bottom: 90px;}
#footer .menu li {margin: 0 15px;}
#footer .menu .link {font-size: 12px; transition-duration: .4s;}
#footer .menu .link:hover {color: #00eace; transition-duration: .4s;}
#footer .newsletter {max-width: 505px;}
#footer .newsletter .title {padding: 0 0 15px 35px; font-size: 20px;}
#footer .newsletter form input {border-color: #000;}
#footer.footer-values {background: #fff;}
#footer.footer-values .slogan .list .slogan-title {color: #000;}
#footer.footer-values .item {color: #000;}
#footer.footer-values .menu .link {color: #000;}
#footer.footer-values .social a {background: #fff0; border: solid 3px #000; position: relative; transition-duration: .8s;}
#footer.footer-values .social a:hover {background: #000; transition-duration: .8s;}
#footer.footer-values .social a svg path {fill: #000; transition-duration: .8s;}
#footer.footer-values .social a:hover svg path {fill: #fff; transition-duration: .8s;}
#footer.footer-values .newsletter .title {color: #000;}
#footer.footer-values form .box-button .button svg path {fill: #000;}

#home .banners {
  display: block; margin-bottom: 200px;background: url(../imagens/site/bg_banner_eco.png);
  background-attachment: fixed;background-position: center 0px;background-repeat: no-repeat;
  will-change: transform;animation: backgroundFade 1.4s forwards;}
@keyframes backgroundFade {
    0% {
        background-position-y: 60px; opacity: 0; 
    }
    100% {
        background-position-y: center 0px; opacity: 1; 
    }
}
#home .banners .flag {position: absolute; left: -30px; top: 180px; animation: shakeflag 10s ease-in-out infinite;}
@keyframes shakeflag {
    0% {
        transform: scale(1) translateY(0) rotate(0deg);
    }
    25% {
        transform: scale(1.1) translateY(-10px) rotate(5deg);
    }
    50% {
        transform: scale(1) translateY(0) rotate(0deg);
    }
    75% {
        transform: scale(1.1) translateY(10px) rotate(-5deg);
    }
    100% {
        transform: scale(1) translateY(0) rotate(0deg);
    }
}
#home .banners .flag svg {width: 200px; height: 160px;}
#home .banners .asterisk {position: absolute; left: -165px; top: 40px; animation: rotate1 infinite 20s linear;}
@keyframes rotate1 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(360deg) translate3D(0%, 0%, 0);}
} 
#home .banners .asterisk svg {height: 330px; width: 330px;}
#home .banners .asterisk svg path {fill: #f4f4f4;}
#home .banners .earth {position: absolute; left: -75px; top: 130px; animation: zoomearth 8s cubic-bezier(0.25, 1.5, 0.5, 1) infinite; }
#home .banners .earth svg {height: 200px; width: 200px;}
#home .banners .earth svg path {fill: #fff;}
@keyframes zoomearth {
  0% {
    transform: scale(0.9) rotate(-4deg);
  }
  20% {
    transform: scale(1.1) rotate(2deg);
  }
  50% {
    transform: scale(1) rotate(0);
  }
  80% {
    transform: scale(1.1) rotate(2deg);
  }
  100% {
    transform: scale(0.9) rotate(-4deg);
  }
}
#home .banners .star {position: absolute; right: 90px; top: 22vh; animation: zoom1 infinite 3s linear;}
@keyframes zoom1 {
  0% {transform: scale(.8);}
  50% {transform: scale(1);}
  100% {transform: scale(.8);}
}
#home .banners .star svg path {fill: #00eace;}
#home .banners .dot-circle {position: absolute; right: -280px; bottom: 18vh; animation: rotate2 infinite 26s linear;}
@keyframes rotate2 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(-360deg) translate3D(0%, 0%, 0);}
} 
#home .banners .dot-circle svg {height: 490px; width: 490px;}
#home .banners .dot-circle svg path {fill: #000;}
#home .banners .dot-circle2 {position: absolute; left: -260px; bottom: -200px; animation: slide1 infinite 4s linear;}
@keyframes slide1 {
  0% {left: -260px; bottom: -200px;}
  50% {left: -240px; bottom: -180px;}
  100% {left: -260px; bottom: -200px;}
}
#home .banners .dot-circle2 svg {height: 490px; width: 490px;}
#home .banners .dot-circle2 svg path {fill: #000;}
#home .banners .flower {position: absolute; right: 15vw; bottom: -100px; animation: rotate3 infinite 14s linear;}
@keyframes rotate3 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(360deg) translate3D(0%, 0%, 0);}
} 
#home .banners .astronaut {width: 350px; position: absolute; right:8%; bottom: -110px; animation: floatastronaut 10s ease-in-out infinite;}
#home .banners .astronaut svg {width: 350px;}
#home .banners .astronaut svg path {fill: #600377;}
@keyframes floatastronaut {
    0% {transform: translateY(0) rotate(0deg); bottom: -110px;}
    25% {transform: translateY(-10px) rotate(2deg); bottom: -80px;}
    50% {transform: translateY(0) rotate(0deg); bottom: -110px;}
    75% {transform: translateY(10px) rotate(-2deg); bottom: -80px;}
    100% {transform: translateY(0) rotate(0deg); bottom: -110px;}
}
#home .banners .circle {position: absolute; right: -90px; top: calc(100% - 50px); height: 180px; width: 180px; border-radius: 50%; background: #600377;}
#home .banners .dot {position: absolute; right: 20px; top: calc(100% + 60px); animation: zoom2 infinite 5s linear;}
@keyframes zoom2 {
  0% {transform: scale(.8);}
  50% {transform: scale(1);}
  100% {transform: scale(.8);}
}
#home .banners .dot svg path {fill: #00eace;}
#home .banners .list {height: 100vh;}
#home .banners .owl-dots {display: flex; flex-direction: column; height: auto; width: auto; position: absolute; left: 40px; bottom: 4vh;}
#home .banners .owl-dot {margin-top: 24px;}
#home .banners .owl-dot:first-child {margin-top: 0;}
#home .banners .social {flex-direction: column; justify-content: center; position: absolute; z-index: 5; right: 40px; height: 100vh;}
#home .banners .social li {margin: 6px 0;}
#home .banners .owl-stage-outer {overflow: visible!important;}
#home .banner {display: flex; align-items: flex-end; justify-content: center; height: 100vh; padding-top: 60px;}
#home .banner .info {padding-bottom: 110px; padding-left: 30px; z-index: 1; position: relative; box-sizing: border-box;transition-duration: .4s;}
#home .banner .title {max-width: 460px; margin-bottom: 40px;}
#home .banner .box-img {position: relative; height: 675px; max-height: 92vh; left: 50px; scale: .85; top: -3%; transition-duration: .8s;}
#home .banner .box-img:hover {scale: 1; transition-duration: .8s;}
#home .banner .box-img img {height: auto; max-height: 100%; z-index: 2; position: relative; object-fit: contain;}
#home .banner .box-img .bg {position: absolute; left: 36%; top: 10px; animation: rotate4 infinite 18s linear;}
@keyframes rotate4 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(-360deg) translate3D(0%, 0%, 0);}
} 
#home .banner .box-img .bg2 {position: absolute; right: 25%; bottom: -110px; animation: zoom3 infinite 4s linear;}
@keyframes zoom3 {
  0% {transform: scale(.8);}
  50% {transform: scale(1);}
  100% {transform: scale(.8);}
}
#home .banner .box-img .bg2 svg {height: 465px; width: 465px;}
#home .banner .box-img .bg2 svg path {fill: #00eace;}
#home .popcorn {height: 605px; margin-top: 250px; background: #600377; display: flex; justify-content: flex-start; position: relative;}
#home .popcorn .bg-pop {position: absolute; z-index: 9;}
#home .popcorn .bg-pop img {object-fit: contain;}
#home .popcorn .bg1 {top: -210px; left: -200px; filter: blur(10px);}
#home .popcorn .bg1 img {width: 315px; height: 245px; transform: rotate(-35deg);}
#home .popcorn .bg2 {bottom: 40px; left: -75px;}
#home .popcorn .bg3 {top: -60px; left: 18%; filter: blur(8px);}
#home .popcorn .bg3 img {height: 95px; width: 95px;}
#home .popcorn .bg4 {left: 22%; bottom: -180px;}
#home .popcorn .bg4 img {width: 175px; height: 135px; transform: rotate(-35deg);}
#home .popcorn .bg5 {left: 38%; top: -140px; filter: blur(6px);}
#home .popcorn .bg5 img {width: 75px; height: 80px;}
#home .popcorn .bg6 {left: 55%; top: -40px;}
#home .popcorn .bg6 img {height: 120px; width: 115px;}
#home .popcorn .bg7 {left: 51%; bottom: -50px; filter: blur(8px);}
#home .popcorn .bg7 img {height: 95px; width: 95px;}
#home .popcorn .bg8 {left: 60%; top: -240px; filter: blur(10px);}
#home .popcorn .bg8 img {width: 165px; height: 145px;}
#home .popcorn .bg9 {right: -160px; top: -55px; filter: blur(6px);}
#home .popcorn .bg9 img {width: 310px; height: 240px;}
#home .popcorn .bg10 {right: 8%; bottom: 28%;}
#home .popcorn .bg10 img {height: 95px; width: 95px; transform: rotate(15deg);}
#home .popcorn .flower {position: absolute; z-index: 3; right: 15vw; bottom: -75px; animation: zoom4 infinite 4s linear;}
@keyframes zoom4 {
  0% {transform: scale(.8);}
  50% {transform: scale(1);}
  100% {transform: scale(.8);}
}
#home .popcorn .star {position: absolute; z-index: 3; left: 40px; top: -70px; animation: rotate4 infinite 6s linear;}
@keyframes rotate4 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(360deg) translate3D(0%, 0%, 0);}
} 
#home .popcorn .star svg path {fill: #1cf281;}
#home .popcorn .spaceship {position: absolute; z-index: 3; right: 110px; bottom: -190px; animation: float 10s ease-in-out infinite;}
#home .popcorn .spaceship svg {height: 295px; width: 295px;}
#home .popcorn .spaceship svg path {fill: #f4f4f4;}
@keyframes float {
    0% {transform: translateY(0) rotate(0deg); bottom: -190px;}
    25% {transform: translateY(-10px) rotate(2deg); bottom: -160px;}
    50% {transform: translateY(0) rotate(0deg); bottom: -190px;}
    75% {transform: translateY(10px) rotate(-2deg); bottom: -160px;}
    100% {transform: translateY(0) rotate(0deg); bottom: -190px;}
}
#home .popcorn .galery {width: 60%; max-width: 1060px; z-index: 1; position: relative; display: flex; align-items: flex-start;}
#home .popcorn .box-galery {position: relative; overflow: hidden; height: 720px; width: 50%; background: #fa4eac;}
#home .popcorn .box-galery:nth-child(2) {bottom: 115px; right: 50px; width: calc(50% + 50px);}
#home .popcorn .box-galery img {height: 100%; width: 100%; object-fit: cover; transition-duration: .4s;}
#home .popcorn .box-galery:hover img {opacity: .7; transform: scale(1.05); transition-duration: .4s;}
#home .popcorn .rainbow-logo {width: 35%; height: 100%; display: flex; align-items: center; justify-content: center;}
#home .popcorn .rainbow-logo svg {position: relative; bottom: 35px; width: 80%; height: 80%;}
#home .popcorn .spaceship {position: absolute; right: 3%; bottom: -100px; animation: float 10s ease-in-out infinite;}
#home .popcorn .spaceship svg {height: 295px; width: 295px;}
#home .popcorn .spaceship svg path {fill: #f4f4f4;}
@keyframes float {
    0% {
        transform: translateY(0) rotate(0deg); bottom: -240px;
    }
    25% {
        transform: translateY(-10px) rotate(2deg); bottom: -220px;
    }
    50% {
        transform: translateY(0) rotate(0deg); bottom: -240px;
    }
    75% {
        transform: translateY(10px) rotate(-2deg); bottom: -220px;
    }
    100% {
        transform: translateY(0) rotate(0deg); bottom: -240px;
    }
}
#home .awards {background: url(../imagens/site/awards.jpg) no-repeat fixed center; position: relative; height: 960px;}
#home .awards .bg-pop {position: absolute;}
#home .awards .bg-pop img {object-fit: contain;}
#home .awards .bg1 {left: -120px; filter: blur(10px); transform: rotate(-35deg); animation: awardsbg1 8s ease-in-out infinite;}
@keyframes awardsbg1 {
    0% {top: 80px;}
    25% {top: 100px;}
    50% {top: 80px;}
    75% {top: 100px;}
    100% {top: 80px;}
}
#home .awards .bg1 img {width: 315px; height: 245px;}
#home .awards .bg2 {right: 15%; filter: blur(10px); animation: awardsbg2 10s ease-in-out infinite;}
@keyframes awardsbg2 {
    0% {bottom: 100px;}
    25% {bottom: 120px;}
    50% {bottom: 100px;}
    75% {bottom: 120px;}
    100% {bottom: 100px;}
}
#home .awards .bg2 img {width: 165px; height: 145px;}
#home .awards .bg3 {right: 4%; animation: awardsbg3 7s ease-in-out infinite;}
@keyframes awardsbg3 {
    0% {top: 120px;}
    25% {top: 140px;}
    50% {top: 120px;}
    75% {top: 140px;}
    100% {top: 120px;}
}
#home .awards .bg3 img {width: 120px; height: 125px;}
#home .awards .bg4 {left: 220px; animation: awardsbg4 9s ease-in-out infinite;}
@keyframes awardsbg4 {
    0% {bottom: 180px;}
    25% {bottom: 160px;}
    50% {bottom: 180px;}
    75% {bottom: 160px;}
    100% {bottom: 180px;}
}
#home .awards .bg4 img {width: 120px; height: 120px;}
#home .awards .alien {position: absolute; right: 40px; animation: awardsalien 10s ease-in-out infinite;}
@keyframes awardsalien {
    0% {transform: translateY(0) rotate(0deg); bottom: 80px;}
    25% {transform: translateY(-10px) rotate(6deg); bottom: 60px;}
    50% {transform: translateY(0) rotate(0deg); bottom: 80px;}
    75% {transform: translateY(10px) rotate(-6deg); bottom: 60px;}
    100% {transform: translateY(0) rotate(0deg); bottom: 80px;}
}
#home .awards .alien svg path {fill: #1cf281!important;}
#home .awards .planet {position: absolute; z-index: 1; left: -50px; bottom: -140px; animation: zoomawards 8s cubic-bezier(0.25, 1.5, 0.5, 1) infinite;}
@keyframes zoomawards {
  0% {
    transform: scale(0.9) rotate(-4deg);
  }
  20% {
    transform: scale(1.1) rotate(2deg);
  }
  50% {
    transform: scale(1) rotate(0);
  }
  80% {
    transform: scale(1.1) rotate(2deg);
  }
  100% {
    transform: scale(0.9) rotate(-4deg);
  }
}
#home .awards .planet svg {width: 340px; height: 210px;}
#home .awards .planet svg path {fill: #00eace;}
#home .awards .info {display: flex; flex-direction: column; align-items: center; padding-top: 250px;}
#home .awards img {width: 650px; height: 200px; object-fit: contain;}
#home .awards .title {margin: 70px 0 20px;}
#home .awards .button {margin-top: 25px;}
#home .bg-about {padding: 110px 0 120px; background: url(../svg/dot_circle.svg) no-repeat left bottom #600377; background-position-y: calc(100% - 150px); background-size: 650px; position: relative;}
#home .testimonials {padding-bottom: 120px; background: #600377;}
#home .testimonials .info {width: 100%; padding-bottom: 60px; text-align: center;}
#home .testimonials .owl-item {padding-top: 15px;}
#home .testimonials .owl-item:nth-child(odd) {margin-top: 70px;}
#home .testimonials .owl-dots {padding-top: 35px; flex-wrap: wrap;}
#home .testimonials .owl-dots .owl-dot {margin: 10px; color: #00eace;}
#home .testimonials .owl-dots .owl-dot::before {background: url(../imagens/site/owl_azul.png) no-repeat center;}
#home .testimonials .owl-dots .owl-dot.active {color: #fff;}
#home .testimonials .owl-dots .owl-dot.active::before {background: url(../imagens/site/owl_branco.png) no-repeat center;}
#home .testimonials .item {background: #000; padding: 60px 40px 0; margin-bottom: 40px; height: 300px; position: relative; box-sizing: border-box;}
#home .testimonials .item .balloon {position: absolute; left: 0; top: 100%;}
#home .testimonials .item .balloon svg {height: 40px; width: 90px;}
#home .testimonials .item .title {margin-bottom: 30px; font-size: 32px;}
#home .testimonials .owl-stage .owl-item:nth-child(1n + 1) .title {color: #00eace;}
#home .testimonials .owl-stage .owl-item:nth-child(2n + 1) .title {color: #fa4eac;}
#home .testimonials .owl-stage .owl-item:nth-child(3n + 1) .title {color: #1cf281;}
#home .testimonials .item .text {text-align: justify; font-size: 18px; line-height: 130%;}
#home .testimonials .item .text b {font-size: 26px; color: #fa4eac;}
#home .testimonials .item .text u {font-size: 24px; color: #1cf281; font-weight: bold; text-decoration: none;}
#home .testimonials .item .text i {font-size: 30px; color: #00eace; font-weight: bold; font-style: normal;}
#home .testimonials .item .text span {font-size: 18px!important;}
#home .testimonials .item .text p {font-size: 18px!important;}
#home .testimonials .item .marks {position: absolute; left: 40px; top: -15px;}

#about {animation: fadebg 5s linear infinite alternate;}
@keyframes fadebg {
    0% {
        background:#600377;
    }
    50% {
        background:#fa4e76;
    }
    100% {
        background:#c84efa;
    }
}
#about .box-top-internal .info {bottom: 18vh;}
#about .box-top-internal .title {font-size: 220px; line-height: 180px;}
#about .bg-text {position: relative; display: flex; align-items: center;}
#about .bg-text .spaceship {position: absolute; left: -250px; top: 0; animation: float 10s ease-in-out infinite;}
#about .bg-text .spaceship svg {height: 265px; width: 415px;}
#about .bg-text .spaceship svg path {fill: #fff;}
@keyframes float {
    0% {
        transform: translateY(0) rotate(0deg); bottom: -190px;
    }
    25% {
        transform: translateY(-10px) rotate(2deg); bottom: -160px;
    }
    50% {
        transform: translateY(0) rotate(0deg); bottom: -190px;
    }
    75% {
        transform: translateY(10px) rotate(-2deg); bottom: -160px;
    }
    100% {
        transform: translateY(0) rotate(0deg); bottom: -190px;
    }
}
#about .bg-text .dot {position: absolute; right: 20px; top: 80px; animation: zoom2 infinite 5s linear;}
@keyframes zoom2 {
  0% {transform: scale(.8);}
  50% {transform: scale(1);}
  100% {transform: scale(.8);}
}
#about .bg-text .dot svg path {fill: #00eace;}
#about .big-text {width: 100%; columns: 2; margin: 40px 0 120px; line-height: 36px;} 
#about .galery {position: relative; top: 100px; padding-top: 40px;}
#about .galery .owl-item {margin-right: -40px;}
#about .galery .owl-item:nth-child(odd) {margin-top: 100px;}
#about .galery .box-galery {display: block; position: relative; height: 720px; background: #000;}
#about .galery .box-galery img {height: 100%; width: 100%; object-fit: cover; transition-duration: .8s;}
#about .galery .box-galery:hover img {opacity: .7; transition-duration: .8s;}
#about .bg-about {padding: 180px 0 90px; background: #fa4eac; position: relative;}
#about .bg-about .bg-pop {position: absolute; z-index: 2;}
#about .bg-about .bg-pop img {object-fit: contain;}
#about .bg-about .bg1 {left: -40px; filter: blur(6px); animation: aboutbg1 8s ease-in-out infinite;}
@keyframes aboutbg1 {
    0% {top: 20px;}
    25% {top: 40px;}
    50% {top: 20px;}
    75% {top: 40px;}
    100% {top: 20px;}
}
#about .bg-about .bg1 img {width: 260px; height: fit-content; transform: rotate(-35deg);}
#about .bg-about .bg2 {right: 60px; animation: aboutbg2 9s ease-in-out infinite;}
@keyframes aboutbg2 {
    0% {bottom: 160px;}
    25% {bottom: 140px;}
    50% {bottom: 160px;}
    75% {bottom: 140px;}
    100% {bottom: 160px;}
}
#about .about-us .star svg path {fill: #00eace;}
#about .about-us .star2 svg path {fill: #600377;}
#about .about-us .button {display: none;}
#about .bg-values {background: #600377; height: 100vh; z-index: 2; position: relative; overflow: visible; isolation: isolate;}
#about .bg-values .hscroll__sticky {position: sticky; top: 0; height: 100vh;}
#about .bg-values .waves {position: absolute; left: -200px; top: calc(100vh - 200px); animation: spinwaves 20s linear infinite;}
@keyframes spinwaves {
  0% {transform: rotate(0);}
  100% {transform: rotate(360deg);}
}
#about .bg-values .waves svg {height: 450px; width: 450px;}
#about .bg-values .waves svg path {fill: #00eace;}
#about .bg-values .waves2 {position: absolute; right: 25%; top: -200px; animation: spinwaves2 20s linear infinite;}
@keyframes spinwaves2 {
  0% {transform: rotate(0);}
  100% {transform: rotate(360deg);}
}
#about .bg-values .waves2 svg {height: 450px; width: 450px;}
#about .bg-values .waves2 svg path {fill: #1cf281;}
#about .bg-values .astronaut {position: absolute; top: 40px; right: 32%; animation: valueastronaut 10s ease-in-out infinite;}
@keyframes valueastronaut {
    0% {transform: translateY(0) rotate(-40deg); top: 20px;}
    25% {transform: translateY(-10px) rotate(-42deg); top: 30px;}
    50% {transform: translateY(0) rotate(-40deg); top: 20px;}
    75% {transform: translateY(10px) rotate(-38deg); top: 30px;}
    100% {transform: translateY(0) rotate(-40deg); top: 20px;}
}
#about .bg-values .astronaut svg {width: 220px; height: 260px;}
#about .bg-values .astronaut svg path {fill: #fff;}
#about .bg-values .spaceship {position: absolute; width: 440px; z-index: 3; right: 40px; animation: valuespaceship 10s ease-in-out infinite;}
@keyframes valuespaceship {
    0% {transform: translateY(0) rotate(0deg); top: 30px;}
    25% {transform: translateY(-10px) rotate(6deg); top: 50px;}
    50% {transform: translateY(0) rotate(0deg); top: 30px;}
    75% {transform: translateY(10px) rotate(-6deg); top: 50px;}
    100% {transform: translateY(0) rotate(0deg); top: 30px;}
}
#about .bg-values .spaceship svg {width: 320px;}
#about .bg-values .spaceship svg path {fill: #fff;}
#about .bg-values .rocket {position: absolute; transform: rotate(-38deg); right: 10%; bottom: 45%;}
#about .bg-values .rocket svg {animation: shake 8s ease-in-out infinite;}
@keyframes shake {
  0% {transform: translate(0px, 0px) rotate(0deg);}
  20% {transform: translate(2px, -2px) rotate(1deg);}
  40% {transform: translate(-2px, -3px) rotate(-1deg);}
  60% {transform: translate(2px, -2px) rotate(0.8deg);}
  80% {transform: translate(-1px, -1px) rotate(-0.6deg);}
  100% {transform: translate(0px, 0px) rotate(0deg);}
}
#about .bg-values .rocket svg path {fill: #fa4eac;}
#about .bg-values .star {position: absolute; left: 0%; bottom: 50px; animation: starvalue infinite 3s linear;}
@keyframes starvalue {
  0% {transform: scale(.8);}
  50% {transform: scale(1);}
  100% {transform: scale(.8);}
}
#about .bg-values .star svg path {fill: #00eace!important;}
#about .bg-values .earth {position: absolute; right: 60px; bottom: 180px; animation: zoomvalue 4s cubic-bezier(0.25, 1.5, 0.5, 1) infinite;}
#about .bg-values .earth svg {height: 250px; width: 250px;}
#about .bg-values .earth svg path {fill: #fff;}
@keyframes zoomvalue {
  0% {
    transform: scale(0.9) rotate(-4deg);
  }
  20% {
    transform: scale(1.1) rotate(2deg);
  }
  50% {
    transform: scale(1) rotate(0);
  }
  80% {
    transform: scale(1.1) rotate(2deg);
  }
  100% {
    transform: scale(0.9) rotate(-4deg);
  }
}
#about .bg-values .bg-pop {position: absolute;}
#about .bg-values .bg-pop img {object-fit: contain;}
#about .bg-values .bg1 {left: 80px; transform: rotate(-35deg); animation: valuebg1 8s ease-in-out infinite;}
@keyframes valuebg1 {
    0% {top: 60px;}
    25% {top: 40px;}
    50% {top: 60px;}
    75% {top: 40px;}
    100% {top: 60px;}
}
#about .bg-values .bg1 img {width: 200px;}
#about .bg-values .bg2 {left: 20px; top: 100px; filter: blur(5px); animation: valuebg2 10s ease-in-out infinite;}
@keyframes valuebg2 {
    0% {top: 100px;}
    25% {top: 80px;}
    50% {top: 100px;}
    75% {top: 80px;}
    100% {top: 100px;}
}
#about .bg-values .bg2 img {width: 165px; height: 145px;}
#about .bg-values .bg3 {right: 4%; top: 120px; animation: valuebg3 7s ease-in-out infinite;}
@keyframes valuebg3 {
    0% {top: 120px;}
    25% {top: 140px;}
    50% {top: 120px;}
    75% {top: 140px;}
    100% {top: 120px;}
}
#about .bg-values .bg3 img {width: 120px; height: 125px;}
#about .bg-values .bg4 {left: 80px; filter: blur(5px); animation: valuebg4 9s ease-in-out infinite;}
@keyframes valuebg4 {
    0% {bottom: 140px;}
    25% {bottom: 120px;}
    50% {bottom: 140px;}
    75% {bottom: 120px;}
    100% {bottom: 140px;}
}
#about .bg-values .bg5 {right: 25%; animation: valuebg5 6s ease-in-out infinite;}
@keyframes valuebg5 {
    0% {bottom: 100px;}
    25% {bottom: 80px;}
    50% {bottom: 100px;}
    75% {bottom: 80px;}
    100% {bottom: 100px;}
}
#about .bg-values .bg5 img {width: 200px;}
#about .values {display: flex; position: relative; will-change: transform; transform: translate3d(0,0,0); z-index: 1; height: 100%;}
#about .values .value {position: sticky; display: grid; place-items: center; justify-items: start; align-content: center; padding-left: 12%; width: 88vw; height: 100vh; flex: 0 0 auto;}
#about .values .value .title {margin-bottom: 65px;}
#about .values .value .text {width: 75%;}
#about .bg-team {background: url(../svg/dot_circle.svg) no-repeat left bottom #fa4eac; background-position-y: 40%; padding: 100px 0 120px; position: relative;}
#about .bg-team .waves {position: absolute; right: -150px; bottom: -150px; animation: teamwaves 20s linear infinite;}
@keyframes teamwaves {
  0% {transform: rotate(0);}
  100% {transform: rotate(360deg);}
}
#about .bg-team .waves svg {height: 400px; width: 400px;}
#about .bg-team .waves svg path {fill: #00eace;}
#about .bg-team .astronaut {position: absolute; right: 80px; top: 140px; animation: teamastronaut 10s ease-in-out infinite;}
@keyframes teamastronaut {
    0% {transform: translateY(0) rotate(0deg); top: 120px;}
    25% {transform: translateY(-10px) rotate(2deg); top: 90px;}
    50% {transform: translateY(0) rotate(0deg); top: 120px;}
    75% {transform: translateY(10px) rotate(-2deg); top: 90px;}
    100% {transform: translateY(0) rotate(0deg); top: 120px;}
}
#about .bg-team .astronaut svg {width: 340px; height: 210px;}
#about .bg-team .astronaut svg path {fill: #57016c;}
#about .bg-team .alien {position: absolute; z-index: 2; left: 80px; bottom: 100px ;animation: teamalien 10s ease-in-out infinite;}
@keyframes teamalien {
    0% {transform: translateY(0) rotate(0deg); bottom: 60px;}
    25% {transform: translateY(-10px) rotate(6deg); bottom: 45px;}
    50% {transform: translateY(0) rotate(0deg); bottom: 60px;}
    75% {transform: translateY(10px) rotate(-6deg); bottom: 45px;}
    100% {transform: translateY(0) rotate(0deg); bottom: 60px;}
}
#about .bg-team .alien svg path {fill: #fff!important;}
#about .team {display: flex; align-items: center; justify-content: space-between;}
#about .team .team-stage {position: relative; width: calc(50% - 40px); height: 800px;}
#about .team .stage-viewport {position: absolute; inset: 0;}
#about .team .stage-viewport .flower {position: absolute; z-index: 5; right: -60px; top: 0; animation: rotateteam infinite 10s linear;}
@keyframes rotateteam {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(-360deg) translate3D(0%, 0%, 0);}
}
#about .team .card {position: absolute; top: 0; bottom: 0; margin: auto; height: 720px; overflow: hidden; transform-origin: center; transition: transform .55s cubic-bezier(.2,.8,.2,1), filter .55s cubic-bezier(.2,.8,.2,1), opacity .55s cubic-bezier(.2,.8,.2,1); will-change: transform,filter,opacity;}
#about .team .card img {width: 100%; height: 100%; object-fit: cover; display: block}
#about .team .card.prev {left:0;width:60%;transform:translateX(-10px) scale(.86);filter:blur(1.2px) brightness(.92);opacity:.75;z-index:1}
#about .team .card.current {left:0;right:0; width: 85%;transform:translateX(0) scale(1);filter:blur(0) brightness(1);opacity:1;z-index:3}
#about .team .card.next {right:0;width:60%;transform:translateX(10px) scale(.86);filter:blur(1.2px) brightness(.92);opacity:.75;z-index:1}
#about .team .card.current::after {content:"";position:absolute;inset:-40px;background:radial-gradient(circle at 50% 40%, rgba(0,255,213,.12), transparent 60%);pointer-events:none}
#about .team .arrow {position:absolute;top:50%;transform:translateY(-50%);cursor:pointer;user-select:none;z-index:5; transition-duration: .8s;}
#about .team .arrow:hover {opacity: .7; transition-duration: .8s;}
#about .team .arrow.left {left: -18px; transform: rotate(180deg);}
#about .team .arrow.right {right: -18px;}
#about .team .arrow svg {width: 76px; height: 30px;}
#about .team .arrow svg path {fill: #fff;}
#about .team .team-slide {display: none;}
#about .team .title {margin-bottom: 10px; opacity: 1; transition-duration: .8s;}
#about .team .social {margin: 25px 0; opacity: 1; transition-duration: .8s;}
#about .team .social li {margin: 0 10px;}
#about .team .text {max-width: 650px; opacity: 1; transition-duration: .8s;}

#ourvalues {background: #fff;}
#ourvalues .content {padding-bottom: 200px;}
#ourvalues .content .title {margin-bottom: 30px;}
#ourvalues .content .text {font-size: 20px; line-height: 30px;}

#stores .box-top-internal .earth {right: -40px; bottom: -40px; left: auto; top: auto;}
#stores .box-top-internal .astronaut {right: auto; left: -140px; animation: storeastronaut 10s ease-in-out infinite;}
@keyframes storeastronaut {
  0% {transform: translateY(0) rotate(0deg); bottom: auto; top: 160px;}
  25% {transform: translateY(-10px) rotate(2deg); bottom: auto; top: 130px;}
  50% {transform: translateY(0) rotate(0deg); bottom: auto; top: 160px;}
  75% {transform: translateY(10px) rotate(-2deg); bottom: auto; top: 130px;}
  100% {transform: translateY(0) rotate(0deg); bottom: auto; top: 160px;}
}
#stores .box-top-internal .astronaut svg {transform: scaleX(-1); width: 380px; height: fit-content;}
#stores .box-top-internal .astronaut svg path {fill: #00eace;}
#stores .stores {position: relative; bottom: 140px; padding-bottom: 100px;}

#product {animation: fadeprod 7s linear infinite alternate;}
@keyframes fadeprod {
    0% {
        background:#fb4dac;
    }
    35% {
        background:#fa4e76;
    }
    70% {
        background:#c84efa;
    }
    100% {
        background: #ff8b2e;
    }
}
#product .box-top {display: block; position: relative; background: url(../imagens/site/bg_banner_eco.png) no-repeat bottom center; margin-bottom: 160px; height: 100vh;}
#product .box-top .planet {position: absolute; left: -75px; top: 160px; animation: zoomplanet 8s cubic-bezier(0.25, 1.5, 0.5, 1) infinite; }
@keyframes zoomplanet {
  0% {
    transform: scale(0.9) rotate(-4deg);
  }
  20% {
    transform: scale(1.1) rotate(2deg);
  }
  50% {
    transform: scale(1) rotate(0);
  }
  80% {
    transform: scale(1.1) rotate(2deg);
  }
  100% {
    transform: scale(0.9) rotate(-4deg);
  }
}
#product .box-top .planet svg {width: 260px; height: auto;}
#product .box-top .planet svg path {fill: #fff;}
#product .box-top .alien {position: absolute; z-index: 3; right: 60px; animation: alien 10s ease-in-out infinite;}
@keyframes alien {
    0% {transform: translateY(0) rotate(0deg); bottom: 30px;}
    25% {transform: translateY(-10px) rotate(6deg); bottom: 50px;}
    50% {transform: translateY(0) rotate(0deg); bottom: 30px;}
    75% {transform: translateY(10px) rotate(-6deg); bottom: 50px;}
    100% {transform: translateY(0) rotate(0deg); bottom: 30px;}
}
#product .box-top .alien svg {width: 320px; height: fit-content;}
#product .box-top .alien svg path {fill: #57016c!important;}
#product .box-top .asterisk {position: absolute; left: -165px; top: 40px; animation: rotate1 infinite 20s linear;}
@keyframes rotate1 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(360deg) translate3D(0%, 0%, 0);}
} 
#product .box-top .star {position: absolute; right: 90px; top: 22vh; animation: zoom1 infinite 3s linear;}
@keyframes zoom1 {
  0% {transform: scale(.8);}
  50% {transform: scale(1);}
  100% {transform: scale(.8);}
}
#product .box-top .star svg path {fill: #00eace;}
#product .box-top .dot-circle {position: absolute; right: -280px; bottom: 18vh; animation: rotate2 infinite 26s linear;}
@keyframes rotate2 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(-360deg) translate3D(0%, 0%, 0);}
} 
#product .box-top .dot-circle svg {height: 490px; width: 490px;}
#product .box-top .dot-circle svg path {fill: #000;}
#product .box-top .dot-circle2 {position: absolute; left: -260px; bottom: -200px; animation: slide1 infinite 4s linear;}
@keyframes slide1 {
  0% {left: -260px; bottom: -200px;}
  50% {left: -240px; bottom: -180px;}
  100% {left: -260px; bottom: -200px;}
}
#product .box-top .dot-circle2 svg {height: 490px; width: 490px;}
#product .box-top .dot-circle2 svg path {fill: #000;}
#product .box-top .circle {position: absolute; right: -90px; top: calc(100% - 50px); height: 180px; width: 180px; border-radius: 50%; background: #600377;}
#product .box-top .dot {position: absolute; right: 20px; top: calc(100% + 60px); animation: zoom2 infinite 5s linear;}
@keyframes zoom2 {
  0% {transform: scale(.8);}
  50% {transform: scale(1);}
  100% {transform: scale(.8);}
}
#product .box-top .dot svg path {fill: #00eace;}
#product .box-top .astronaut {width: 350px; position: absolute; right:8%; bottom: -110px; animation: floatastronaut 10s ease-in-out infinite;}
#product .box-top .astronaut svg {width: 350px;}
#product .box-top .astronaut svg path {fill: #600377;}
@keyframes floatastronaut {
    0% {transform: translateY(0) rotate(0deg); bottom: -110px;}
    25% {transform: translateY(-10px) rotate(2deg); bottom: -80px;}
    50% {transform: translateY(0) rotate(0deg); bottom: -110px;}
    75% {transform: translateY(10px) rotate(-2deg); bottom: -80px;}
    100% {transform: translateY(0) rotate(0deg); bottom: -110px;}
}
#product .box-top .social {flex-direction: column; justify-content: center; position: absolute; z-index: 5; right: 40px; height: 100vh;}
#product .box-top .social li {margin: 6px 0;}
#product .box-top .content {display: flex; align-items: flex-end; justify-content: flex-end; height: 100vh; padding-top: 60px;}
#product .box-top .info {width: 55%; padding-bottom: 26vh; padding-left: 30px; z-index: 1; position: relative; box-sizing: border-box;transition-duration: .4s;}
#product .box-top .info .text {max-width: 600px;}
#product .box-top .title {max-width: 460px; margin-bottom: 25px;}
#product .box-top .cities {display: flex; margin-top: 25px;}
#product .box-top .cities .city {margin-right: 5px;}
#product .box-top .cities .city svg {width: 80px; height: 80px;}
#product .box-top .cities .city svg path {fill: #fff;}
#product .box-top .button-table {color:#fff;font-size:24px;font-weight:700;margin-top:45px;cursor:pointer; width: fit-content;position: relative; display: flex; align-items: center; transition-duration: .4s;}
#product .box-top .button-table:hover {color: #00eace; transition-duration: .4s;}
#product .box-top .button-table svg {margin-left: 15px; height: 32px; width: 84px; width: fit-content;}
#product .box-top .button-table svg path {fill: #fff; transition-duration: .4s;}
#product .box-top .button-table:hover svg path {fill: #00eace; transition-duration: .4s;}
.modal.popup-nutritional .content {padding-top: 65px; top: 50%;}
.modal.popup-nutritional .close {transform: none; left: auto; cursor: pointer; right: 25px; top: 25px; transition-duration: .4s;}
.modal.popup-nutritional .close:hover {transform: scale(1.3); transition-duration: .4s;}
.modal.popup-nutritional .close svg {position: relative; animation: none; width: 25px; height: 25px;}
.text.nutrition-table {font-size: 18px!important;}
.nutrition-table table {width: 100%;}
.nutrition-table{width:100%;table-layout:fixed;border-collapse:collapse;color:#000;background:#fff;border:3px solid #000}
.nutrition-table td{padding:4px 6px;border-bottom:1px solid #000;font-size:14px;line-height:1.2;text-align:left;vertical-align:middle;word-break:normal;overflow-wrap:normal}
.nutrition-table tr:nth-child(1) td,.nutrition-table tr:nth-child(2) td{font-size:13px}
.nutrition-table tr:nth-child(3) td,.nutrition-table tr:nth-child(6) td{padding:0;height:8px;background:#000;border-bottom:0;font-size:0;line-height:0}
.nutrition-table tr:nth-child(4) td{font-size:12px;font-weight:700;border-bottom:0;padding-bottom:0}
.nutrition-table tr:nth-child(5) td{font-size:20px;font-weight:900;border-bottom:6px solid #000;padding-top:0}
.nutrition-table tr:nth-child(5) td:first-child{font-size:32px;line-height:1;border: none;}
.nutrition-table tr:nth-child(4) td:last-child{font-size:56px;line-height:.9;font-weight:900;text-align:right;white-space:nowrap}
.nutrition-table tr:nth-child(7) td{font-size:12px;font-weight:900;text-align:right;border-bottom:2px solid #000}
.nutrition-table td:nth-child(2),.nutrition-table td:nth-child(3){text-align:right;white-space:nowrap}
.nutrition-table tr:nth-child(n+8) td:first-child{font-weight:700}
.nutrition-table tr:nth-child(n+8) td{font-size:13px}
#product .box-top .box-img {position: relative; height: 750px; max-height: 92vh; left: 30px; scale: .85; top: -3%; transition-duration: .8s;}
#product .box-top .box-img:hover {scale: 1; transition-duration: .8s;}
#product .box-top .box-img img {height: 100%; max-width: 640px; z-index: 2; position: relative; object-fit: contain;}
#product .box-top .box-img .bg {position: absolute; left: 36%; top: 10px; animation: rotate4 infinite 18s linear;}
@keyframes rotate4 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(-360deg) translate3D(0%, 0%, 0);}
} 
#product .box-top .box-img .bg2 {position: absolute; right: 25%; bottom: -110px; animation: zoom3 infinite 4s linear;}
@keyframes zoom3 {
  0% {transform: scale(.8);}
  50% {transform: scale(1);}
  100% {transform: scale(.8);}
}
#product .box-top .box-img .bg2 svg {height: 465px; width: 465px;}
#product .box-top .box-img .bg2 svg path {fill: #00eace;}
#product .about {padding: 110px 0 180px; background: url(../svg/dot_circle.svg) no-repeat left bottom #600377; background-position-y: calc(100% - 150px); background-size: 650px; position: relative;}
#product .about .bg-pop {position: absolute;}
#product .about .bg-pop img {object-fit: contain;}
#product .about .bg1 {right: 12%; bottom: 120px; animation: floatbg1 8s ease-in-out infinite;}
@keyframes floatbg1 {
    0% {bottom: 120px;}
    25% {bottom: 100px;}
    50% {bottom: 120px;}
    75% {bottom: 100px;}
    100% {bottom: 120px;}
}
#product .about .bg1 img {width: 200px;}
#product .about .bg2 {right: 20px; filter: blur(5px); animation: floatbg2 10s ease-in-out infinite;}
@keyframes floatbg2 {
    0% {top: 200px;}
    25% {top: 180px;}
    50% {top: 200px;}
    75% {top: 180px;}
    100% {top: 200px;}
}
#product .about .bg2 img {width: 165px; height: 145px;}
#product .about .bg3 {top: 90px; left: -20px; transform: rotate(-35deg); animation: floatbg3 7s ease-in-out infinite;}
@keyframes floatbg3 {
    0% {top: 90px;}
    25% {top: 110px;}
    50% {top: 90px;}
    75% {top: 110px;}
    100% {top: 90px;}
}
#product .about .bg3 img {width: 120px; height: 125px;}
#product .about .star {position: absolute; z-index: 3; left: 650px; top: 40%; animation: zoom6 infinite 4s linear;}
@keyframes zoom6 {
  0% {transform: scale(.8);}
  50% {transform: scale(1);}
  100% {transform: scale(.8);}
}
#product .about .flower {position: absolute; z-index: 3; left: -40px; bottom: 40px; animation: rotate9 infinite 10s linear;}
@keyframes rotate9 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(-360deg) translate3D(0%, 0%, 0);}
} 
#product .about .content {display: flex; align-items: center; justify-content: flex-start; position: relative;}
#product .about .galery {width: 40%;}
#product .about .galery .owl-dots {margin-top: 35px;}
#product .about .galery .owl-dots .owl-dot {margin: 0 6px; color: #fff; transition-duration: .4s;}
#product .about .galery .owl-dots .owl-dot:hover {color: #00eace; transition-duration: .4s;}
#product .about .galery .owl-dots .owl-dot.active {color: #00eace; transition-duration: .4s;}
#product .about .galery .owl-dots .owl-dot::before {background: url(../imagens/site/owl_branco.png) no-repeat center; transition-duration: .4s;}
#product .about .galery .owl-dots .owl-dot:hover::before {background: url(../imagens/site/owl_azul.png) no-repeat center; transition-duration: .4s;}
#product .about .galery .owl-dots .owl-dot.active::before {background: url(../imagens/site/owl_azul.png) no-repeat center; transition-duration: .4s;}
#product .about .box-galery {position: relative; display: block; height: 600px;}
#product .about .box-galery img {height: 100%; width: 100%; object-fit: contain;}
#product .about .info {width: 50%; padding-left: 80px; box-sizing: border-box; position: relative;}
#product .about .title {margin-top: 100px; max-width: 380px;}
#product .about .star2 {position: absolute; bottom: 45px; right: 25%; animation: rotate10 infinite 7s linear;}
@keyframes rotate10 {
0% {transform: rotate(0) translate3D(0%, 0%, 0);}
100% {transform: rotate(360deg) translate3D(0%, 0%, 0);}
} 
#product .about .star2 svg {height: 55px; width: 55px;}

.filters-blog {width: 20%; display: flex; flex-wrap: wrap; align-content: flex-start; position: sticky; height: fit-content; top: 40px; gap: 10px;}
.filters-blog .title {width: 100%; margin-bottom: 10px; height: fit-content;}
.filters-blog .filter {display: flex; align-items: center; box-sizing: border-box; height: 42px; width: 100%; padding: 0 18px; font-size: 16px; background: #000; transition-duration: .4s;}
.filters-blog .filter:hover {background: #fa4eac; color: #000; transition-duration: .4s;}
.filters-blog .tag {display: flex; align-items: center; box-sizing: border-box; min-height: 38px; padding: 4px 18px; font-size: 14px; background: #000; transition-duration: .4s;}
.filters-blog .tag:hover {background: #1cf281; color: #000; transition-duration: .4s;}
.filters-blog .astronaut {position: absolute; top: calc(100% + 50px); right: -40px; animation: filterastronaut 10s ease-in-out infinite;}
@keyframes filterastronaut {
    0% {transform: translateY(0) rotate(0deg); bottom: 10px;}
    25% {transform: translateY(-10px) rotate(2deg); bottom: 20px;}
    50% {transform: translateY(0) rotate(0deg); bottom: 10px;}
    75% {transform: translateY(10px) rotate(-2deg); bottom: 20px;}
    100% {transform: translateY(0) rotate(0deg); bottom: 10px;}
}
.filters-blog .astronaut svg {width: 320px; height: 200px;}

#blog {background: url(../svg/dot_circle.svg) no-repeat right bottom; background-position-x: calc(100% + 200px); background-position-y: calc(100% - 150px); background-size: 650px;}
#blog .container {display: flex; justify-content: space-between; align-items: flex-start; padding: 60px 0 120px;}
#blog .list {display: flex; flex-wrap: wrap; gap: 20px; width: calc(80% - 40px);}
#blog .list .post {width: calc(50% - 10px); padding: 20px 20px 35px; background: #000; cursor: pointer; box-sizing: border-box;}
#blog .list .post .box-img {width: 100%; height: 280px; position: relative; overflow: hidden;}
#blog .list .post .box-img img {height: 100%; width: 100%; object-fit: cover; transition-duration: .4s;}
#blog .list .post:hover .box-img img {opacity: .7; transform: scale(1.1); transition-duration: .4s;}
#blog .list .post .box-img .date {position: absolute; left: 15px; bottom: 10px; font-size: 22px;}
#blog .list .post .info {padding: 20px 15px 0;}
#blog .list .post .title {margin-bottom: 10px; transition-duration: .4s;}
#blog .list .post:hover .title {color: #1cf281; transition-duration: .4s;}
#blog .list .pagination {width: 100%; padding-top: 40px; display: flex;}
#blog .list .pagination .page {display: flex; align-items: center; margin-right: 20px; font-size: 18px; color: #fff; transition-duration: .4s;}
#blog .list .pagination .page:hover {color: #00eace; transition-duration: .4s;}
#blog .list .pagination .page::before {content: ""; display: block; width: 24px; height: 24px; margin-right: 5px; background: url(../imagens/site/owl_branco.png) no-repeat center; background-size: contain; transition-duration: .4s;}
#blog .list .pagination .page:hover::before {background: url(../imagens/site/owl_azul.png) no-repeat center; transition-duration: .4s;}
#blog .list .pagination .page.active {color: #00eace; transition-duration: .4s;}
#blog .list .pagination .page.active::before {background: url(../imagens/site/owl_azul.png) no-repeat center; transition-duration: .4s;}

#post {background: #600378;}
#post .box-top-internal {height: 75vh;}
#post .box-top-internal .wrapper {height: 75vh;}
#post .box-top-internal .info {max-width: 650px; bottom: 16vh;}
#post .box-top-internal .date {font-size: 22px; margin-top: 20px;}
#post .container {display: flex; justify-content: space-between; padding-bottom: 120px;}
#post .post-content {width: calc(80% - 40px);}
#post .post-content .text {font-size: 20px; line-height: 30px;}
#post .post-content .text a {color: #fff;}
#post .post-content .box-img {height: 560px; width: 100%; margin: 35px 0; display: block; position: relative;}
#post .post-content .box-img img {height: 100%; width: 100%; object-fit: cover;}
#post .post-content .galery {padding: 35px 0 40px;}
#post .post-content .galery .box-galery {display: flex; position: relative; overflow: hidden; height: 360px;}
#post .post-content .galery .box-galery img {height: 100%; width: 100%; object-fit: cover; transition-duration: .4s;}
#post .post-content .galery .box-galery:hover img {opacity: .7; transform: scale(1.1); transition-duration: .8s;}
#post .post-content .galery .owl-dots {margin-top: 25px;}
#post .post-content .galery .owl-dots .owl-dot {margin: 0 10px; color: #00eace;}
#post .post-content .galery .owl-dots .owl-dot::before {background: url(../imagens/site/owl_azul.png) no-repeat center;}
#post .post-content .galery .owl-dots .owl-dot.active {color: #fff;}
#post .post-content .galery .owl-dots .owl-dot.active::before {background: url(../imagens/site/owl_branco.png) no-repeat center;}
#post .post-content .tags {display: flex; flex-wrap: wrap; gap: 10px; padding-top: 45px;}
#post .post-content .tags .tag {display: flex; align-items: center; height: 38px; padding: 0 18px; font-size: 18px; background: #000; transition-duration: .4s;}
#post .post-content .tags .tag:hover {background: #1cf281; color: #000; transition-duration: .4s;}
#post .more-posts .list {padding-top: 45px;}
#post .more-posts .list .post {display: flex; flex-direction: column; box-sizing: border-box; padding: 20px 20px 35px; background: #000; height: 515px; box-sizing: border-box;}
#post .more-posts .list .post .box-img {width: 100%; height: 340px; position: relative; overflow: hidden;}
#post .more-posts .list .post .box-img img {height: 100%; width: 100%; object-fit: cover; transition-duration: .4s;}
#post .more-posts .list .post:hover .box-img img {opacity: .7; transform: scale(1.1); transition-duration: .4s;}
#post .more-posts .list .post .date {position: absolute; left: 15px; bottom: 10px; font-size: 22px;}
#post .more-posts .list .post .info {padding: 20px 15px 0;}
#post .more-posts .list .post .title {margin-bottom: 10px; transition-duration: .4s;}
#post .more-posts .list .post:hover .title {color: #1cf281; transition-duration: .4s;}
#post .more-posts .list .owl-dots {margin-top: 40px;}
#post .more-posts .list .owl-dots .owl-dot {margin: 0 10px; color: #00eace;}
#post .more-posts .list .owl-dots .owl-dot::before {background: url(../imagens/site/owl_azul.png) no-repeat center;}
#post .more-posts .list .owl-dots .owl-dot.active {color: #fff;}
#post .more-posts .list .owl-dots .owl-dot.active::before {background: url(../imagens/site/owl_branco.png) no-repeat center;}

#policy .content {padding: 120px 0; background: #600378;}
#policy .content .title {margin: 0 0 30px;}
#policy .text {font-size: 20px; line-height: 30px;}
#policy .text h2 {color: #fff!important;}
#policy .text h3 {color: #fff!important;}

#error .astronaut {animation: errorastronaut 10s ease-in-out infinite;}
@keyframes errorastronaut {
    0% {transform: translateY(0) rotate(0deg); bottom: 120px;}
    25% {transform: translateY(-10px) rotate(2deg); bottom: 100px;}
    50% {transform: translateY(0) rotate(0deg); bottom: 120px;}
    75% {transform: translateY(10px) rotate(-2deg); bottom: 100px;}
    100% {transform: translateY(0) rotate(0deg); bottom: 120px;}
}
#error .button {font-size: 24px; display: flex; align-items: center;}
#error .button svg {transform: rotate(180deg); margin-right: 25px;}