/* !* Css Styles */
@import 'https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap';
@import 'https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap';
@import 'https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;700&display=swap';

@font-face {
  font-family: grunge;
  font-style: normal;
  font-weight: 400;
  src: url('fonts/GrungeFont-Regular.otf') format('opentype');
}

section {
  position: relative;
  word-wrap: break-word;
}

a {
  font-style: normal;
  font-weight: 400;
  cursor: pointer;
}

a,
a:hover {
  text-decoration: none;
}

body {
  position: relative;
}

b,
strong {
  font-weight: 700;
}

.body {
  background-color: #101010;
  font-family: roboto, sans-serif;
  color: #fff;
  margin: 0 auto;
  padding: 0;
  line-height: 1.68;
}

.body,
html {
  font-size: 17px;
}

#main-container,
#thank-you-container,
.body-text {
  max-width: 1150px;
  margin: 0 auto;
}

.header,
.shipping,
.body-text {
  padding: 0 25px;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  line-height: 1;
  word-break: break-word;
  word-wrap: break-word;
}

.header h3 {
  margin-top: 32px;
  margin-bottom: 24px;
  font-size: 20px;
}

p {
  margin-left: auto;
  margin-right: auto;
}

.hero-img-wrap {
  position: relative;
}

.header-logo {
  display: block;
  position: absolute;
  top: 6px;
  left: 29px;
  width: 95px;
  height: 38px;
  background-image: url('./images/Logo_RQS_White.svg');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50%;
}

.hero-img {
  position: relative;
  margin-right: -2px !important;
  margin-left: -2px !important;
}

header.hero {
  overflow: hidden;
}

.header {
  max-width: 1200px;
  margin: 0 auto;
  background-position: center;
  background-repeat: no-repeat;
  background-size: auto 100%;
}

.CTA-button {
  display: inline-block;
  width: 415px;
  height: 42px;
  line-height: 42px;
  background-color: #ff7600;
  cursor: pointer;
  color: #fff;
  text-transform: uppercase;
  border: 0;
  text-align: center;
  font-weight: 700;
  max-width: 100%;
  font-size: 16px;
  margin-bottom: 31px;
}

#thank-you-cta {
  height: 460px;
}

#thank-you-cta h3 {
  margin-top: 0;
}

.shipping .items-wrap {
  display: flex;
  justify-content: center;
  gap: 50px;
}

.shipping .items-wrap .item {
  display: flex;
  align-items: center;
}

.shipping .items-wrap .item img {
  margin-right: 12px;
}

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

.copyright,
.legals {
  height: 21px;
  display: flex;
  margin: 25px auto 14px;
  line-height: 21px;
  font-size: 18px;
  font-weight: 700;
  width: auto;
  text-align: center;
}

.copyright a,
.legals a {
  line-height: 18px;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
  color: #151515;
  font-family: 'DM Sans';
}

.legals a br {
  display: none;
}

.corporate-footer {
  width: 100%;
  height: 75px;
  background: #9eb52b;
  display: flex;
  align-content: center;
}

.hidden {
  display: none !important;
}

h1 {
  font-size: 1.6em;
  color: #00e600;
  font-weight: 700;
  font-family: brooklyn, sans-serif;
  letter-spacing: 0.04em;
}

.hero-img-wrapper {
  position: relative;
  padding-bottom: 38%;
}

.hero-img {
  background-size: 100% !important;
  background-repeat: no-repeat !important;
  padding-bottom: 24.1%;
  position: relative;
}

.hero-img-EN {
  background: url('images/Header-desktop_ENG.png');
}

p {
  font-weight: 200;
}

.some-text {
  max-width: 945px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 47px;
  font-weight: 400;
  font-size: 17px;
  line-height: 23px;
  text-align: center;
  font-family: 'DM Sans';
}

form .form-group label {
  display: block;
  font-size: 15px;
}

form .form-group:not(.form-group-check) label::after {
  content: '*';
  font-size: 15px;
  color: #ea717b;
}

form .form-group {
  max-width: 415px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 31px;
  font-size: 0.9em;
  font-weight: normal;
  display: flex;
  display: flex;
  display: flexbox;
  flex-direction: column;
  flex-direction: column;
  flex-direction: column;
  align-items: flex-start;
  align-items: flex-start;
  -ms-flex-align: flex-start;
}

form .form-group#country-form {
  margin-bottom: 20px;
}

form .form-group#state-form {
  margin-top: 11px;
  margin-bottom: 20px;
}

form .form-group #email {
  border-radius: 0;
}

form .form-group #email {
  border-radius: 0;
}

form .form-group input::placeholder {
  color: #767676;
}

form .form-group input::input-placeholder {
  color: #767676;
}

form .form-group input:placeholder {
  color: #767676;
}

form .form-group input::placeholder {
  color: #767676;
}

form .form-group input:input-placeholder {
  color: #767676;
}

form .form-group label.error {
  margin-bottom: -20px;
  margin-top: 5px;
  color: #fff;
}

form label {
  position: relative;
}

form input {
  width: 100%;
  box-sizing: border-box;
  border: 0;
  height: 42px;
  padding: 0 10px;
  font-size: 15px;
}

form .required_txt {
  max-width: 375px;
  font-size: 13px;
  line-height: 1.8em;
  text-align: right;
  margin: -26px auto 28px;
}

form .required_txt span {
  color: #ea717b;
}

form .form-group-check {
  display: flex !important;
  font-size: 0.79em;
  position: relative;
  justify-content: center;
  justify-content: center;
  align-items: center;
  align-items: center;
  -ms-flex-align: center;
  flex-direction: row;
  margin-bottom: 31px;
  width: 415px;
}

form .form-group-check label.error {
  position: absolute;
  bottom: -35px;
}

form .form-group-check label#consent-error {
  bottom: -5px;
  left: 0;
}

form .form-group-check input[type='checkbox'] {
  flex-basis: 10%;
  align-self: baseline;
  border: none;
  width: 24px;
  height: 24px;
  margin: 5px 16px 0 0;
}

form .form-group-check label {
  display: inline;
  margin: 0;
  font-size: 15px;
  letter-spacing: -0.15px;
  text-align: left;
  font-weight: 400;
  line-height: 21px;
}

form .form-group-check label a {
  color: #fff;
  text-decoration: underline;
}

.error {
  color: #ea717b;
  font-size: 15px;
}

.fan-pack {
  position: relative;
}

.fan-pack .fan-pack-image {
  position: relative;
  z-index: 1;
}

.fan-pack .fan-pack-image img {
  max-width: 100%;
}

.fan-pack .magenta,
.fan-pack .cyan,
.fan-pack .yellow {
  position: absolute;
  border-radius: 50%;
  filter: blur(222px);
  z-index: -1;
}

.fan-pack .magenta {
  width: 596px;
  height: 402px;
  background-color: #ff00a0;
  top: -15%;
  left: 15%;
}

.fan-pack .cyan {
  width: 410px;
  height: 276px;
  background-color: #00ffb2;
  top: -20%;
  right: 26%;
}

.fan-pack .yellow {
  width: 293px;
  height: 197px;
  background-color: #dbff00;
  bottom: 7%;
  right: 18%;
}

.promo-desc .some-text {
  max-width: 716px;
  margin-bottom: 30px;
  font-size: 18px;
  text-align: center;
}

hr {
  max-width: 635px;
  border: 1px solid #fff;
  margin: 15px auto;
}

#thank-you-container h3 {
  margin-top: 36px;
  margin-bottom: 0;
  font-size: 20px;
}

#thank-you-container p {
  max-width: 658px;
  margin: 24px auto 10px;
  height: 132px;
  font-weight: 400px;
  font-size: 17px;
  line-height: 23px;
}

.countdown {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 5px 0;
  flex-wrap: wrap;
  font-size: 20px;
  background-color: #ff00a0;
}

.countdown .time {
  padding-left: 4px;
}

.top-header {
  display: flex;
  margin: 0 auto 13px;
  width: fit-content;
  height: 105px;
  padding-top: 15px;
}

.top-text {
  display: flex;
  flex-direction: column;
  text-align: left;
  text-transform: capitalize;
  font-family: grunge;
  font-size: 48px;
  line-height: 52px;
}

.top-img-kick {
  background: url('/landings/tyson20/assets/images/top_kick_img.svg');
  width: 104px;
  height: 95px;
  margin-right: 17px;
}

#main-container {
  background: url('/landings/tyson20/assets/images/Ellipse_1.svg');
  background-size: 100%;
  background-repeat: no-repeat;
  background-position-y: 100%;
}

span.black {
  color: #151515;
}

span.white {
  color: #fff;
}

.result-block {
  display: flex;
  margin: 100px auto 0;
  width: fit-content;
  height: 67px;
  position: relative;
}

.result-block::before {
  content: '';
  background: #d62024;
  height: 57px;
  width: 2px;
  position: absolute;
  top: -70px;
  left: 50%;
}

.result-text {
  text-transform: uppercase;
  font-family: 'DM Sans';
  font-size: 22px;
  line-height: 72px;
  font-weight: bold;
}

.result-img-kick {
  background: url('/landings/tyson20/assets/images/result_kick_img.svg');
  background-size: 100%;
  background-repeat: no-repeat;
  width: 84px;
  height: 67px;
  margin-right: 20px;
}

.grower-block {
  display: flex;
  margin: 45px auto 30px;
  width: fit-content;
  height: 73px;
  position: relative;
}

.grower-img-kick {
  background: url('/landings/tyson20/assets/images/grower_kick_img.svg');
  background-size: 100%;
  background-repeat: no-repeat;
  width: 67px;
  height: 73px;
  margin-right: 17px;
}

.grower-text {
  text-transform: uppercase;
  font-family: 'DM Sans';
  font-size: 22px;
  line-height: 25px;
  font-weight: bold;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.collab-block {
  display: flex;
  margin: 45px auto 30px;
  width: fit-content;
  height: 76px;
  position: relative;
}

.collab-img-kick {
  background: url('/landings/tyson20/assets/images/collab_kick_img.svg');
  background-size: 100%;
  background-repeat: no-repeat;
  width: 55px;
  height: 76px;
  margin-right: 17px;
}

.collab-text {
  text-transform: uppercase;
  font-family: 'DM Sans';
  font-size: 22px;
  line-height: 25px;
  font-weight: bold;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.center-poster.text-center {
  background: url('/landings/tyson20/assets/images/center-poster.svg');
  background-size: cover;
  background-repeat: no-repeat !important;
  padding-bottom: 350px;
  position: relative;
}

.center-poster::before {
  content: '';
  background: #d62024;
  height: 57px;
  width: 2px;
  position: absolute;
  top: -35px;
  left: 50%;
}

.center-poster::after {
  content: '';
  background: #d62024;
  height: 57px;
  width: 2px;
  position: absolute;
  bottom: -35px;
  left: 50%;
}

.center-text {
  position: absolute;
  top: 47%;
  left: calc(50% - 212px);
  width: fit-content;
  height: 140px;
  font-family: grunge;
  font-weight: 400;
  display: flex;
  flex-direction: column;
  color: #fff;
}

.center-text span {
  font-size: 35px;
  line-height: 47px;
  color: #fff;
}

.center-text span.bigger {
  font-size: 100px;
  line-height: 95px;
}

.small-poster {
  width: 100%;
  height: 310px;
  margin: 0 auto;
  background: url('/landings/tyson20/assets/images/small-poster.png');
  max-width: 1100px;
  position: relative;
}

.small-poster::after {
  content: '';
  background: #d62024;
  height: 57px;
  width: 2px;
  position: absolute;
  bottom: -35px;
  left: 50%;
}

.product-list {
  max-width: 720px;
  margin: 0 auto 160px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.product-item {
  margin-bottom: 33px;
}

.product-text {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.product-img img,
.product-img {
  width: 325px;
  height: 324px;
}

.product-name-label {
  font-family: 'DM Sans';
  font-size: 20px;
  line-height: 23px;
  font-weight: bold;
  margin-bottom: 9px;
  color: #fff;
}

.product-price-label {
  font-family: 'DM Sans';
  font-size: 16px;
  line-height: 23px;
  font-weight: 400;
  margin-bottom: 16px;
}

.shop-button {
  width: 150px;
  height: 39px;
  background-color: #ff7a00;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  color: white;
  font-family: 'DM Sans';
  font-size: 16px;
  text-transform: uppercase;
}

.product-carousel {
  margin: 0 auto 90px;
  overflow: hidden !important;
  position: relative;
  height: 650px;
}

.img-carousel {
  max-width: 605px;
  height: 605px;
}

.img-carousel-mobile {
  display: none;
}

.product-carousel-item {
  position: relative;
  width: fit-content;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  height: 650px;
}

.quote-container {
  position: absolute;
  bottom: 0;
  width: fit-content;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  left: calc(50% - 280px);
}

.quote-text {
  max-width: 380px;
  font-size: 21px;
  line-height: 24px;
  font-family: 'DM Sans';
  font-style: italic;
  color: #fff;
}

.quote-author {
  width: 560px;
  font-size: 34px;
  line-height: 72px;
  font-family: grunge;
  text-align: end;
  color: #fff;
}

.carousel-control.carousel-control-previous {
  position: absolute;
  top: 40%;
  width: 62px;
  height: 62px;
  left: calc(50% - 350px);
  background: url('/landings/tyson20/assets/images/arrow_back.svg');
  z-index: 99999;
  cursor: pointer;
}

.carousel-control.carousel-control-next {
  position: absolute;
  top: 40%;
  width: 62px;
  height: 62px;
  left: calc(50% + 300px);
  background: url('/landings/tyson20/assets/images/arrow_forward.svg');
  z-index: 99999;
  cursor: pointer;
}

.copyright {
  background: url('/landings/tyson20/assets/images/RQS_1_Positive_2 1.svg');
  width: 115px;
  height: 55px;
  margin: auto;
}

.menu-overlay {
  position: absolute;
  z-index: 99;
  width: 100%;
  background: #151515;
  padding-bottom: 480px;
}

.menu-container {
  position: absolute;
  z-index: 999;
  left: 21%;
}

.menu-items {
  margin: 20px 0 0;
}

.menu-item {
  font-family: grunge;
  font-size: 45px;
  line-height: 52px;
  margin-bottom: 20px;
  cursor: pointer;
}

.menu-item:hover,
.menu-item a:hover {
  color: #9eb52b !important;
}

.menu-item a:visited {
  color: #fff;
}

.menu-icon.open {
  background: url('/landings/tyson20/assets/images/menu_open.svg');
  width: 50px;
  height: 50px;
  cursor: pointer;
}

.menu-icon.closed {
  background: url('/landings/tyson20/assets/images/menu_close.svg');
  width: 50px;
  height: 50px;
  cursor: pointer;
}

.de .center-text {
  bottom: 35%;
  left: calc(50% - 276px);
  top: unset;
}

.fr .shop-button {
  width: 212px;
}

.nl .quote-text,
.be .quote-text,
.it .quote-text {
  max-width: 400px;
}

.copyright a {
  width: 100%;
  height: 100%;
}

@media (max-width: 500px) {
  .desktop-visible {
    display: none !important;
  }

  .body,
  html {
    font-size: 18px;
    line-height: 1.75;
  }

  .overlay-logo {
    width: 93px;
    height: 38px;
  }

  .hero-img-EN {
    background: url('./images/Header-mobile_ENG.png');
  }

  .hero-img {
    background-repeat: no-repeat;
    padding-bottom: 70%;
    background-position: center;
    margin: 0 auto;
    z-index: -1;
    background-size: 100%;
  }

  .header {
    overflow: hidden;
  }

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

  .header h3 {
    margin-top: 20px;
    margin-bottom: 23px;
  }

  form .form-group-check,
  form .CTA-button,
  form input {
    width: 100%;
  }

  form .form-group {
    max-width: none;
  }

  form .form-group-check {
    margin-bottom: 31px;
  }

  .fan-pack .magenta {
    top: -34%;
    left: -24%;
  }

  .fan-pack .cyan {
    top: -43%;
    right: -11%;
  }

  .fan-pack .yellow {
    bottom: 31%;
    right: -35%;
  }

  .promo-desc {
    margin-top: 39px;
  }

  .promo-desc .some-text {
    margin-bottom: 20px;
  }

  hr {
    border-width: 1px;
  }

  h3 {
    font-size: 18px;
  }

  .shipping .items-wrap {
    gap: 10px;
    flex-direction: column;
  }

  .shipping .items-wrap .item {
    width: 200px;
    margin: 0 auto;
    justify-content: flex-start;
  }

  #thank-you-container h3 {
    font-size: 18px;
    margin-top: 20px;
    margin-bottom: 31px;
  }

  #thank-you-container p {
    font-size: 15px;
    margin-bottom: 31px;
  }

  #thank-you-container .button-wrap {
    margin-bottom: 44px;
  }
}

@media (max-width: 1099px) {
  .countdown {
    font-size: 17px;
  }

  .copyright {
    width: 97px;
    height: 46px;
    background-size: 100%;
    margin: 11px 0 23px 11px;
  }

  .legals {
    margin: 17px 21px 18px 86px;
    width: 150px;
    text-align: end;
  }

  .legals a {
    text-align: end;
  }

  .legals a br {
    display: block;
  }

  .corporate-footer {
    height: 68px;
    display: flex;
    flex-direction: row;
    align-content: baseline;
    justify-content: space-around;
  }

  .header {
    margin: 0 auto 15px;
  }

  .form-inner {
    height: 525px;
  }

  .header,
  .shipping,
  .body-text {
    padding: 0 20px;
  }

  #main-container {
    background: none;
  }

  .top-text {
    font-size: 30px;
    line-height: 30px;
  }

  .top-img-kick {
    background: url('/landings/tyson20/assets/images/top_kick_img.svg');
    width: 61px;
    height: 54px;
    margin-right: 5px;
    background-size: contain;
  }

  .top-header {
    width: fit-content;
    height: 65px;
  }

  .header {
    background: url('/landings/tyson20/assets/images/ellipse_mobile.svg');
    background-size: 100%;
    background-repeat: no-repeat;
    background-position-y: -95vw;
  }

  .product-list {
    flex-direction: column;
    margin: 0 auto 75px;
  }

  .product-item {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .some-text {
    font-size: 15px;
    line-height: 21px;
  }

  .result-img-kick {
    width: 50px;
    height: 40px;
  }

  .result-text {
    font-size: 17px;
    line-height: 40px;
  }

  #result-block {
    height: 40px;
    min-width: 162px;
    width: fit-content;
    margin: 90px auto 0;
  }

  .result-block::before {
    height: 42px;
    top: -53px;
  }

  .img-carousel {
    display: none;
  }

  .img-carousel-mobile {
    width: 340px;
    height: 325px;
    display: block;
  }

  #product-carousel {
    height: 450px;
  }

  .product-carousel-item {
    height: 420px;
    margin: 15px auto 0;
  }

  #center-poster {
    background: url('/landings/tyson20/assets/images/center-poster_mobile.svg');
    background-repeat: no-repeat;
    padding-bottom: 400px;
    background-size: 100% auto;
    background-position: 50% 50%;
  }

  .center-text {
    width: 325px;
    left: calc(50% - 162.5px) !important;
    top: 10% !important;
    display: flex;
    align-items: center;
  }

  .center-text span {
    font-size: 25px;
    line-height: 32px;
  }

  .center-text span.bigger {
    font-size: 69px;
    line-height: 65px;
  }

  .quote-container {
    left: calc(50% - 170px);
    top: 325px;
  }

  .quote-author {
    width: fit-content;
    font-size: 22px;
    line-height: 32px;
    margin: 5px 0 0;
  }

  .quote-text {
    max-width: 340px;
    font-size: 17px;
    line-height: 24px;
    font-family: 'DM Sans';
    font-style: italic;
  }

  .small-poster {
    background: url('/landings/tyson20/assets/images/small-poster_mobile.png');
    padding-bottom: 255px;
    height: auto;
    background-repeat: no-repeat;
    background-size: 100%;
  }

  .grower-block,
  .collab-block,
  .result-block {
    height: auto;
    max-width: 250px;
    width: fit-content;
  }

  .grower-text {
    font-size: 17px;
    line-height: 25px;
  }

  .grower-img-kick {
    width: 49px;
    height: 54px;
  }

  .collab-text {
    font-size: 17px;
    line-height: 25px;
  }

  .collab-img-kick {
    width: 49px;
    height: 69px;
  }

  .text-container {
    margin: 0 22px 45px;
  }

  .product-img img,
  .product-img {
    width: 238px;
    height: 237px;
  }

  .carousel-control.carousel-control-next {
    width: 29px;
    height: 29px;
    background-size: 100%;
    left: calc(50% + 129px);
    top: 35%;
  }

  .carousel-control.carousel-control-previous {
    width: 29px;
    height: 29px;
    background-size: 100%;
    left: calc(50% - 158px);
    top: 35%;
  }

  .menu-overlay {
    padding-bottom: 400px;
  }

  .menu-items {
    margin: 40px 0 0;
  }

  .menu-container {
    left: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .menu-item {
    font-size: 38px;
    line-height: 35px;
    margin-bottom: 25px;
    text-align: center;
  }

  .menu-icon.open {
    background: url('/landings/tyson20/assets/images/menu_open_mobile.svg');
    background-repeat: no-repeat;
    background-position: 50%;
    width: 50px;
    height: 50px;
    cursor: pointer;
  }

  .menu-icon.closed {
    background: url('/landings/tyson20/assets/images/menu_close_mobile.svg');
    background-repeat: no-repeat;
    background-position: 50%;
    width: 50px;
    height: 50px;
    cursor: pointer;
  }
}

@media (max-width: 335px) {
  .img-carousel-mobile {
    width: 325px;
    height: 310px;
  }

  .quote-text {
    max-width: 320px;
  }

  .quote-container {
    left: calc(50% - 165px);
  }
}

@media (max-width: 650px) {
  .header {
    background: url('/landings/tyson20/assets/images/ellipse_mobile.svg');
    background-size: auto;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position-y: -60vw;
  }
}