@font-face {
  font-family: "Bandera Pro";
  src: url("../font/BanderaProHeavy.eot");
  src: local("Bandera Pro Heavy"), local("BanderaProHeavy"), url("../font/BanderaProHeavy.eot?#iefix") format("embedded-opentype"), url("../font/BanderaProHeavy.woff2") format("woff2"), url("../font/BanderaProHeavy.woff") format("woff"), url("../font/BanderaProHeavy.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: "Bandera Pro";
  src: url("../font/BanderaPro.eot");
  src: local("Bandera Pro Regular"), local("BanderaPro"), url("../font/BanderaPro.eot?#iefix") format("embedded-opentype"), url("../font/BanderaPro.woff2") format("woff2"), url("../font/BanderaPro.woff") format("woff"), url("../font/BanderaPro.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Bandera Pro";
  src: url("../font/BanderaProMedium-Italic.eot");
  src: local("Bandera Pro Medium Italic"), local("BanderaProMedium-Italic"), url("../font/BanderaProMedium-Italic.eot?#iefix") format("embedded-opentype"), url("../font/BanderaProMedium-Italic.woff2") format("woff2"), url("../font/BanderaProMedium-Italic.woff") format("woff"), url("../font/BanderaProMedium-Italic.ttf") format("truetype");
  font-weight: 500;
  font-style: italic;
}
@font-face {
  font-family: "Bandera Pro";
  src: url("../font/BanderaProHeavy-Italic.eot");
  src: local("Bandera Pro Heavy Italic"), local("BanderaProHeavy-Italic"), url("../font/BanderaProHeavy-Italic.eot?#iefix") format("embedded-opentype"), url("../font/BanderaProHeavy-Italic.woff2") format("woff2"), url("../font/BanderaProHeavy-Italic.woff") format("woff"), url("../font/BanderaProHeavy-Italic.ttf") format("truetype");
  font-weight: 900;
  font-style: italic;
}
@font-face {
  font-family: "Bandera Pro";
  src: url("../font/BanderaPro-Italic.eot");
  src: local("Bandera Pro Italic"), local("BanderaPro-Italic"), url("../font/BanderaPro-Italic.eot?#iefix") format("embedded-opentype"), url("../font/BanderaPro-Italic.woff2") format("woff2"), url("../font/BanderaPro-Italic.woff") format("woff"), url("../font/BanderaPro-Italic.ttf") format("truetype");
  font-weight: normal;
  font-style: italic;
}
@font-face {
  font-family: "Bandera Pro";
  src: url("../font/BanderaPro-Bold.eot");
  src: local("Bandera Pro Bold"), local("BanderaPro-Bold"), url("../font/BanderaPro-Bold.eot?#iefix") format("embedded-opentype"), url("../font/BanderaPro-Bold.woff2") format("woff2"), url("../font/BanderaPro-Bold.woff") format("woff"), url("../font/BanderaPro-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "Bandera Pro";
  src: url("../font/BanderaProThin-Italic.eot");
  src: local("Bandera Pro Thin Italic"), local("BanderaProThin-Italic"), url("../font/BanderaProThin-Italic.eot?#iefix") format("embedded-opentype"), url("../font/BanderaProThin-Italic.woff2") format("woff2"), url("../font/BanderaProThin-Italic.woff") format("woff"), url("../font/BanderaProThin-Italic.ttf") format("truetype");
  font-weight: 100;
  font-style: italic;
}
@font-face {
  font-family: "Bandera Pro";
  src: url("../font/BanderaPro-BoldItalic.eot");
  src: local("Bandera Pro Bold Italic"), local("BanderaPro-BoldItalic"), url("../font/BanderaPro-BoldItalic.eot?#iefix") format("embedded-opentype"), url("../font/BanderaPro-BoldItalic.woff2") format("woff2"), url("../font/BanderaPro-BoldItalic.woff") format("woff"), url("../font/BanderaPro-BoldItalic.ttf") format("truetype");
  font-weight: bold;
  font-style: italic;
}
@font-face {
  font-family: "Bandera Pro";
  src: url("../font/BanderaProLight.eot");
  src: local("Bandera Pro Light"), local("BanderaProLight"), url("../font/BanderaProLight.eot?#iefix") format("embedded-opentype"), url("../font/BanderaProLight.woff2") format("woff2"), url("../font/BanderaProLight.woff") format("woff"), url("../font/BanderaProLight.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Bandera Pro";
  src: url("../font/BanderaProThin.eot");
  src: local("Bandera Pro Thin"), local("BanderaProThin"), url("../font/BanderaProThin.eot?#iefix") format("embedded-opentype"), url("../font/BanderaProThin.woff2") format("woff2"), url("../font/BanderaProThin.woff") format("woff"), url("../font/BanderaProThin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: "Bandera Pro";
  src: url("../font/BanderaProLight-Italic.eot");
  src: local("Bandera Pro Light Italic"), local("BanderaProLight-Italic"), url("../font/BanderaProLight-Italic.eot?#iefix") format("embedded-opentype"), url("../font/BanderaProLight-Italic.woff2") format("woff2"), url("../font/BanderaProLight-Italic.woff") format("woff"), url("../font/BanderaProLight-Italic.ttf") format("truetype");
  font-weight: 300;
  font-style: italic;
}
@font-face {
  font-family: "Bandera Pro";
  src: url("../font/BanderaProMedium.eot");
  src: local("Bandera Pro Medium"), local("BanderaProMedium"), url("../font/BanderaProMedium.eot?#iefix") format("embedded-opentype"), url("../font/BanderaProMedium.woff2") format("woff2"), url("../font/BanderaProMedium.woff") format("woff"), url("../font/BanderaProMedium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
p {
  margin: 0;
  letter-spacing: 1.2px;
}

#first-screen {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  z-index: 120;
  height: 100vh;
}
#first-screen button {
  border: none;
}

.hover-container {
  font-family: "Bandera Pro", sans-serif;
  display: flex;
  z-index: 99;
  justify-content: space-between;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 50%;
  overflow: hidden;
}
@media (max-width: 1000px) {
  .hover-container {
    display: none;
  }
}
.hover-container .left-window, .hover-container .right-window {
  height: 100%;
  width: 100%;
  display: flex;
  transition: all 700ms linear;
  position: relative;
}
.hover-container .left-window .primary-button, .hover-container .right-window .primary-button {
  display: none;
  padding: 5px 15px;
  color: #f0f0f0;
  background: green;
  justify-content: center;
  align-items: center;
  border-radius: 30px;
  font-size: 22px;
  font-weight: 500;
  max-width: 300px;
  margin: 0 auto;
  width: 100%;
  border: 2px #e3d321 solid;
  transition: all 300ms linear;
}
.hover-container .left-window .primary-button:hover, .hover-container .right-window .primary-button:hover {
  transform: scale(1.05);
}
.hover-container .left-window {
  max-width: 39vw;
  position: relative;
  background-size: contain;
  transition: all 500ms linear;
  text-decoration: none;
}
.hover-container .left-window .container {
  display: none;
  flex-direction: column;
  max-width: 360px;
  height: fit-content;
  margin-left: auto;
  margin-top: 10%;
}
@media (max-height: 1280px) {
  .hover-container .left-window .container {
    margin-left: 40px;
    margin-top: 0;
  }
}
.hover-container .left-window:hover > .container {
  display: flex;
  opacity: 1;
}
.hover-container .left-window:hover .primary-button {
  display: flex;
}
.hover-container .left-window svg {
  width: 100%;
  max-width: 100%;
  height: auto;
}
.hover-container .right-window {
  max-width: 35vw;
  background-size: contain;
  justify-content: end;
  position: relative;
  text-decoration: none;
}
.hover-container .right-window .container {
  display: none;
  flex-direction: column;
  max-width: 360px;
  height: fit-content;
  margin-right: auto;
  margin-top: 10%;
}
@media (max-height: 1280px) {
  .hover-container .right-window .container {
    margin-right: 40px;
    margin-top: 0;
  }
}
.hover-container .right-window:hover > .container {
  display: block;
  opacity: 1;
}
.hover-container .right-window:hover .primary-button {
  display: flex;
}
.hover-container .right-window svg {
  transition: all 500ms linear;
  width: 100%;
  height: auto;
}
.hover-container .right-window .primary-button {
  position: relative;
}

.main-s {
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 100vh;
  background: linear-gradient(187deg, rgb(14, 113, 164) 0%, rgb(156, 238, 248) 35%, rgb(193, 239, 255) 100%);
}

.main {
  position: relative;
  width: 100%;
  height: 100%;
}
.main .front {
  position: absolute;
  left: 0;
  bottom: 0;
  max-width: 100%;
  width: 100%;
  height: auto;
  z-index: 20;
}
.main .second-bg-left,
.main .second-bg-right {
  position: absolute;
  height: auto;
  background-size: 100%;
  background-position: center;
}
.main .second-bg-left {
  left: 0;
  bottom: 16.2vw;
  width: 58vw;
  z-index: 7;
}
.main .second-bg-right {
  right: 0;
  bottom: 14.5vw;
  width: 40vw;
  z-index: 7;
}

@keyframes clouds {
  100% {
    transform: translateX(-100%);
  }
}
.blink {
  width: 300px;
  height: 300px;
  max-width: 100%;
  position: absolute;
  top: -10%;
  left: 40%;
  animation: rotation 30s linear infinite;
}
@media (max-width: 1000px) {
  .blink {
    left: 25%;
    top: -5%;
    max-width: 120px;
    height: auto;
  }
}

@keyframes rotation {
  0%, 100% {
    transform: scale(0.9) rotate(0deg);
  }
  50% {
    transform: scale(1.4) rotate(180deg);
  }
}
.railing {
  max-width: 100%;
  position: absolute;
  width: 47vw;
  height: auto;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: 102;
  transition: all 1s linear;
  opacity: 0;
  transform: translateY(100%);
}
.railing.animation {
  opacity: 1;
  transform: translateY(0);
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.opacity {
  animation: fadeOut 1s forwards;
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes flow {
  0% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(50%);
  }
}
.test {
  -webkit-filter: url("#filter");
  filter: url("#filter");
  position: relative;
  transform: scale(1.05);
}

#imgWrapper {
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1000;
}

@-webkit-keyframes wipe {
  0% {
    opacity: 1;
    -webkit-mask-position: 0 0;
  }
  100% {
    opacity: 1;
    -webkit-mask-position: 450px 450px;
  }
}
.kenguru {
  width: 10vw;
  height: auto;
  bottom: 30px;
  position: absolute;
  z-index: 101;
  animation-duration: 0.5s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
@media (max-width: 768px) {
  .kenguru {
    bottom: 6px;
  }
}

@media (max-width: 768px) {
  .kenguru {
    width: 50px;
    height: auto;
  }
}
.moving {
  animation: jump 300ms infinite;
}
@media (max-width: 768px) {
  .moving {
    animation: none;
  }
}

@keyframes jump {
  0% {
    bottom: 30px;
  }
  50% {
    bottom: 50px;
  }
  100% {
    bottom: 30px;
  }
}
.water-wave {
  animation: wave 20s forwards infinite;
}

.water-wave-2 {
  animation: wave 25s forwards infinite;
}

.animation-water {
  animation: move 2s ease infinite;
}

.water-container {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 30vw;
  display: flex;
  flex-direction: column;
  z-index: -1;
  transition: all 3s linear;
}
@media (max-width: 600px) {
  .water-container {
    height: 14vw;
  }
}
.water-container.animation {
  opacity: 1;
  z-index: 6;
}

.mobile-info-container {
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: 111;
  gap: 30px;
}
@media (min-width: 1000px) {
  .mobile-info-container {
    display: none;
  }
}
.mobile-info-container .content-block {
  position: relative;
  max-width: 90vw;
}
.mobile-info-container .content-block .link {
  border-radius: 10px;
  width: 150px;
  height: 50px;
  background-size: contain;
  text-decoration: none;
  color: white;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "Bandera Pro", sans-serif;
  background: #3a7b0f;
  text-transform: uppercase;
  font-size: 18px;
}

.container {
  width: 100%;
}

.ement-1 {
  position: absolute;
  width: 100%;
  bottom: 25vw;
  z-index: 5;
}

.ement-2 {
  position: absolute;
  width: 20%;
  top: 0;
  left: -5%;
  z-index: 5;
}

.ement-3 {
  position: absolute;
  width: 20%;
  top: -5%;
  left: 10%;
  z-index: 5;
}

.ement-4 {
  position: absolute;
  width: 15%;
  top: 2%;
  right: -2%;
  z-index: 5;
}

.cloud4 {
  position: absolute;
  top: 6%;
  left: 0;
  animation: clouds 24s linear infinite;
  transform: translateX(500%);
  opacity: 1;
  z-index: 4;
}
@media (max-width: 768px) {
  .cloud4 {
    width: 20vw;
    height: auto;
  }
}

.cloud5 {
  position: absolute;
  top: 12%;
  left: 0;
  animation: clouds 22s linear infinite;
  transform: translateX(1100%);
  opacity: 1;
  z-index: 4;
}
@media (max-width: 768px) {
  .cloud5 {
    width: 20vw;
    height: auto;
  }
}

.cloud6 {
  position: absolute;
  top: 18%;
  left: 0;
  animation: clouds 20s linear infinite;
  transform: translateX(500%);
  opacity: 1;
  z-index: 4;
}
@media (max-width: 768px) {
  .cloud6 {
    width: 20vw;
    height: auto;
  }
}

.cloud7 {
  position: absolute;
  top: 24%;
  left: 0;
  animation: clouds 18s linear infinite;
  transform: translateX(500%);
  opacity: 1;
  z-index: 4;
}
@media (max-width: 768px) {
  .cloud7 {
    width: 20vw;
    height: auto;
  }
}

.cloud8 {
  position: absolute;
  top: 16%;
  left: 0;
  animation: clouds 12s linear infinite;
  transform: translateX(500%);
  opacity: 1;
  z-index: 4;
}
@media (max-width: 768px) {
  .cloud8 {
    width: 20vw;
    height: auto;
  }
}

.cloud9 {
  width: 355px;
  height: 87px;
  position: absolute;
  top: 8%;
  left: 0;
  animation: clouds 10s linear infinite;
  transform: translateX(500%);
  opacity: 1;
  z-index: 4;
}
@media (max-width: 768px) {
  .cloud9 {
    width: 20vw;
    height: auto;
  }
}

.header-loader-page .loader-page {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
}
.header-loader-page .soc {
  margin-bottom: 0;
}
.header-loader-page .dialog {
  left: 0;
  top: 0;
  position: static;
  margin-top: auto;
  max-width: 100%;
  min-width: 70%;
  margin-bottom: 10px;
}
.header-loader-page .dialog form {
  max-width: 100%;
  width: 100%;
}
.header-loader-page .dialog form .form-control {
  font-family: "Bandera Pro", sans-serif;
}

.logo_top {
  height: auto;
}

.product-img {
  display: none;
}

.smoke {
  position: absolute;
  z-index: 90;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0.8;
  display: none;
}

.hover-image-left {
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 53.7vw;
  height: auto;
  z-index: 90;
}

.hover-image-right {
  display: block;
  right: 0;
  position: absolute;
  bottom: 0;
  height: auto;
  z-index: 89;
  width: 41.5vw;
}

.separator-image {
  position: absolute;
  bottom: 0;
  left: 36.7vw;
  width: 39vw;
  z-index: 91;
}

.oct-mm-link > a, .oct-mm-simple-link a {
  color: yellow !important;
  font-weight: 500;
}

.shop-cart.oct-fixed-bar.fixed-left {
  display: none;
}

.itlab-wrapper {
  overflow-x: unset !important;
}

.mobile {
  top: 0;
  left: 0;
}

/*# sourceMappingURL=hover.css.map */