@font-face {
  font-family: 'Turbinado';
  src: url('../themes/glemvital2025/assets/fonts/turbinado.eot');
  src: url('../themes/glemvital2025/assets/fonts/turbinado.eot?#iefix') format('embedded-opentype'), url('../themes/glemvital2025/assets/fonts/turbinado.woff2') format('woff2'), url('../themes/glemvital2025/assets/fonts/turbinado.woff') format('woff'), url('../themes/glemvital2025/assets/fonts/turbinado.ttf') format('truetype'), url('../themes/glemvital2025/assets/fonts/turbinado.svg#Turbinado') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
header {
  z-index: 9;
  position: absolute;
  width: 100%;
  font-size: 25px;
  margin-top: 60px;
}
@media (max-width: 1299.98px) {
  header {
    font-size: 22px;
  }
}
@media (max-width: 1199.98px) {
  header {
    font-size: 20px;
  }
}
@media (max-width: 991.98px) {
  header {
    margin-top: 20px;
  }
}
header .menupoints {
  text-align: right;
  margin-right: 30px;
  margin-top: 20px;
}
@media (max-width: 1299.98px) {
  header .menupoints {
    margin-top: 25px;
  }
}
@media (max-width: 1199.98px) {
  header .menupoints {
    margin-top: 27px;
  }
}
@media (max-width: 991.98px) {
  header .menupoints {
    text-align: center;
    margin-right: 0;
    margin-top: 0;
  }
}
header .menupoints .close-menu {
  display: none;
}
@media (max-width: 991.98px) {
  header .menupoints {
    position: fixed;
    width: 100%;
    height: auto;
    left: 0;
    top: 0;
    background: #d3c7f8;
    transform: translateY(-100%);
    transition: all 0.5s cubic-bezier(0.07000000000000001, 0.28, 0.12, 1);
    z-index: 9;
  }
  header .menupoints.active {
    transform: translateY(0);
  }
  header .menupoints a {
    display: block;
    font: 34px/34px Arial, sans-serif;
    padding: 18px;
  }
  header .menupoints .close-menu {
    display: block;
    position: absolute;
    right: 0;
    top: -2px;
  }
  header .menupoints .close-menu img {
    width: 24px;
  }
}
header a {
  color: white;
  text-decoration: none;
  margin: 0 25px;
  transition: all 0.3s ease-in-out;
}
@media (max-width: 1299.98px) {
  header a {
    margin: 0 20px;
  }
}
@media (max-width: 1199.98px) {
  header a {
    margin: 0 12px;
  }
}
header a:hover {
  color: #0e3057;
}
header .logo {
  width: 210px;
  margin-top: -10px;
}
@media (max-width: 1299.98px) {
  header .logo {
    width: 180px;
  }
}
@media (max-width: 1199.98px) {
  header .logo {
    width: 150px;
  }
}
@media (max-width: 767.98px) {
  header .logo {
    width: 110px;
  }
}
header .hamburger {
  display: none;
  position: absolute;
  right: 15px;
  top: 5px;
  width: 30px;
}
@media (max-width: 991.98px) {
  header .hamburger {
    display: block;
    top: 20px;
  }
}
@media (max-width: 767.98px) {
  header .hamburger {
    top: 5px;
  }
}
header .hamburger .line {
  width: 100%;
  height: 2px;
  background: #fcf7c0;
  margin: 6px 0;
}
header .search {
  position: relative;
}
@media (max-width: 991.98px) {
  header .search {
    position: absolute;
    width: 260px;
    top: 15px;
    right: 100px;
  }
}
@media (max-width: 767.98px) {
  header .search {
    width: 260px;
    top: -10px;
    right: 100px;
  }
}
@media (max-width: 575.98px) {
  header .search {
    width: 100px;
    right: 80px;
  }
}
header .search .form-control {
  border: none;
  background: transparent;
  border-bottom: 3px solid #bce5fb;
  color: #bce5fb;
  border-radius: 0;
  padding-left: 35px;
  transition: all 0.3s ease-in-out;
  font: 20px/25px Arial, sans-serif;
}
@media (max-width: 991.98px) {
  header .search .form-control {
    border-bottom: 2px solid white !important;
    color: white !important;
  }
}
header .search button {
  left: -4px;
  background: transparent;
  border: none;
  position: absolute;
  outline: none;
}
@media (max-width: 767.98px) {
  header .search button {
    top: 5px;
  }
}
header .search button svg {
  width: 24px;
  height: 24px;
  fill: #bce5fb;
  transition: all 0.3s ease-in-out;
}
@media (max-width: 991.98px) {
  header .search button svg {
    fill: white !important;
  }
}
@media (max-width: 767.98px) {
  header .search button svg {
    width: 16px;
    height: 16px;
  }
}
footer {
  position: relative;
  z-index: 9;
  padding: 30px;
  font: 18px/28px Arial, sans-serif;
}
footer a {
  margin: 5px;
}
footer a:hover {
  color: #52bc94;
}
@media (max-width: 767.98px) {
  footer a {
    display: block;
  }
}
.btn {
  display: inline-block;
  width: auto !important;
  border: none;
  position: relative;
  border-radius: 30px;
}
.btn:focus,
.btn:active:focus {
  outline: none;
  box-shadow: none;
}
.btn.btn-primary {
  font: 30px/30px Arial, sans-serif;
  background: #0e3057;
  padding: 12px 70px 12px 25px;
  transition: all 0.3s ease-in-out;
}
@media (max-width: 1299.98px) {
  .btn.btn-primary {
    font: 24px/24px Arial, sans-serif;
    padding: 6px 48px 10px 20px;
  }
}
@media (max-width: 767.98px) {
  .btn.btn-primary {
    font: 20px/24px Arial, sans-serif;
  }
}
.btn.btn-primary:after {
  content: '';
  display: block;
  background: url('../themes/glemvital2025/assets/images/arrow.svg') no-repeat center;
  background-size: contain;
  width: 30px;
  height: 30px;
  position: absolute;
  right: 20px;
  top: 50%;
  margin-top: -15px;
}
@media (max-width: 1299.98px) {
  .btn.btn-primary:after {
    width: 20px;
    height: 20px;
    margin-top: -10px;
    right: 16px;
  }
}
.btn.btn-primary:hover {
  background: #66abe0;
}
.btn.btn-sm {
  font: 16px/16px Arial, sans-serif;
  padding: 10px 45px 11px 15px;
  margin: 4px;
}
.btn.btn-sm:after {
  right: 16px;
  width: 20px;
  height: 20px;
  margin-top: -10px;
}
.btn.btn-white {
  color: #0e3057;
  background: white !important;
}
.btn.btn-white:hover {
  background: #f7c8c3 !important;
}
.btn.btn-yellow {
  background: #fcf7c0 !important;
}
.btn.btn-yellow:hover {
  background: #f7c8c3 !important;
}
.btn.btn-green {
  background: #52bc94 !important;
}
.btn.btn-green:hover {
  background: #f7c8c3 !important;
}
.btn.btn-cookie:after {
  background: url('../themes/glemvital2025/assets/images/fingerprint.svg') no-repeat center;
  background-size: contain;
}
.btn.btn-cookie:hover {
  background: #f7c8c3 !important;
}
.btn.btn-allow-cookies:after {
  background: url('../themes/glemvital2025/assets/images/allow-all.svg') no-repeat center;
  background-size: contain;
}
.btn.btn-allow-cookies:hover {
  background: #f7c8c3 !important;
}
.btn.btn-secondary,
.btn.btn-more-info,
.btn.btn-product-family {
  outline: none;
  box-shadow: none;
  font: 60px/60px 'Turbinado', Arial, sans-serif;
  color: #0e3057;
  background: transparent;
}
@media (max-width: 1299.98px) {
  .btn.btn-secondary,
  .btn.btn-more-info,
  .btn.btn-product-family {
    font: 42px/42px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 1199.98px) {
  .btn.btn-secondary,
  .btn.btn-more-info,
  .btn.btn-product-family {
    font: 36px/36px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 991.98px) {
  .btn.btn-secondary,
  .btn.btn-more-info,
  .btn.btn-product-family {
    font: 30px/30px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 767.98px) {
  .btn.btn-secondary,
  .btn.btn-more-info,
  .btn.btn-product-family {
    font: 26px/26px 'Turbinado', Arial, sans-serif;
  }
}
.btn.btn-secondary:hover,
.btn.btn-more-info:hover,
.btn.btn-product-family:hover,
.btn.btn-secondary.active,
.btn.btn-more-info.active,
.btn.btn-product-family.active {
  color: white;
}
.btn.btn-secondary:focus,
.btn.btn-more-info:focus,
.btn.btn-product-family:focus {
  outline: none;
  box-shadow: none;
}
.btn.btn-more-info {
  padding: 25px 25px 10px 25px;
  margin: 20px 0 0 0;
}
.btn.btn-more-info:before {
  left: 50%;
  margin-left: -16px;
  top: 0;
  transform: rotate(90deg);
}
.btn.btn-more-info.opened:before {
  transform: rotate(-90deg);
}
.btn.btn-product-family {
  position: absolute;
  left: 50%;
  margin-left: -200px !important;
  width: 400px !important;
  color: #d3c7f8;
  top: 610px;
  padding: 10px 70px 13px 25px;
}
@media (max-width: 1299.98px) {
  .btn.btn-product-family {
    top: 560px;
    margin-left: -185px !important;
    width: 370px !important;
  }
}
@media (max-width: 1199.98px) {
  .btn.btn-product-family {
    top: 490px;
    font-size: 17px;
    padding: 10px 60px 13px 25px;
    margin-left: -180px !important;
    width: 360px !important;
  }
}
.btn.btn-product-family:before {
  left: initial;
  right: 20px;
}
@keyframes float {
  0% {
    transform: rotate(10deg) translateY(0);
  }
  50% {
    transform: rotate(7deg) translateY(50px);
  }
  100% {
    transform: rotate(10deg) translateY(0);
  }
}
@keyframes float-header {
  0% {
    transform: rotate(353deg) translateY(0);
  }
  50% {
    transform: rotate(351deg) translateY(50px);
  }
  100% {
    transform: rotate(353deg) translateY(0);
  }
}
@keyframes float-easy {
  0% {
    transform: rotate(20deg) translateY(0);
  }
  50% {
    transform: rotate(22deg) translateY(25px);
  }
  100% {
    transform: rotate(20deg) translateY(0);
  }
}
@keyframes float-packshot {
  0% {
    transform: scale(1) rotate(-15deg) translateY(0);
  }
  50% {
    transform: scale(0.97) rotate(-12deg) translateY(30px);
  }
  100% {
    transform: scale(1) rotate(-15deg) translateY(0);
  }
}
@keyframes float-steps-product {
  0% {
    transform: scale(1) rotate(-15deg) translateY(0);
  }
  50% {
    transform: scale(0.97) rotate(-12deg) translateY(30px);
  }
  100% {
    transform: scale(1) rotate(-15deg) translateY(0);
  }
}
@keyframes pulse {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.7);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes arrow {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(15deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
html,
body {
  font: 30px/38px Arial, sans-serif;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  color: #0e3057;
}
@media (max-width: 1299.98px) {
  html,
  body {
    font: 24px/28px Arial, sans-serif;
  }
}
@media (max-width: 1199.98px) {
  html,
  body {
    font: 18px/24px Arial, sans-serif;
  }
}
@media (max-width: 991.98px) {
  html,
  body {
    font: 16px/22px Arial, sans-serif;
  }
}
.z-top {
  z-index: 99;
}
.comment {
  font: 13px/13px Arial, sans-serif;
}
.spacer {
  position: relative;
  width: 100%;
  display: block;
}
.spacer-30 {
  height: 30px;
}
.spacer-60 {
  height: 60px;
}
.spacer-100 {
  height: 100px;
}
@media (max-width: 575.98px) {
  .spacer-100 {
    height: 70px;
  }
}
@media (max-width: 575.98px) {
  .spacer-configurator {
    height: 340px;
  }
}
a {
  text-decoration: none;
  color: #0e3057;
}
a:hover,
a.active {
  color: white;
}
a.terms {
  font-weight: bold;
  text-decoration: underline;
}
h1,
h3 {
  font: 105px/100px 'Turbinado', Arial, sans-serif;
  color: white;
}
@media (max-width: 1399.98px) {
  h1,
  h3 {
    font: 78px/60px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 1299.98px) {
  h1,
  h3 {
    font: 70px/65px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 1199.98px) {
  h1,
  h3 {
    font: 60px/50px 'Turbinado', Arial, sans-serif;
  }
}
h1 small,
h3 small {
  display: block;
  font: 60px/80px 'Turbinado', Arial, sans-serif;
}
@media (max-width: 1399.98px) {
  h1 small,
  h3 small {
    font: 44px/70px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 1299.98px) {
  h1 small,
  h3 small {
    font: 40px/68px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 1199.98px) {
  h1 small,
  h3 small {
    font: 30px/46px 'Turbinado', Arial, sans-serif;
  }
}
h2 {
  position: relative;
  font: 120px/120px 'Turbinado', Arial, sans-serif;
  width: 100%;
  z-index: 2;
}
@media (max-width: 1399.98px) {
  h2 {
    font: 100px/100px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 1299.98px) {
  h2 {
    font: 80px/80px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 1199.98px) {
  h2 {
    font: 64px/64px 'Turbinado', Arial, sans-serif;
  }
}
h2 small {
  position: relative;
  display: block;
  margin-top: -10px;
  margin-bottom: -5px;
  font: 50px/75px 'Turbinado', Arial, sans-serif;
}
@media (max-width: 1399.98px) {
  h2 small {
    font: 44px/70px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 1299.98px) {
  h2 small {
    font: 40px/68px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 1199.98px) {
  h2 small {
    font: 30px/46px 'Turbinado', Arial, sans-serif;
  }
}
main {
  overflow-x: hidden;
}
.subsite-header {
  position: relative;
  padding: 0 50px;
  height: 900px;
  min-height: 700px;
}
@media (max-width: 1399.98px) {
  .subsite-header {
    height: 800px;
  }
}
@media (max-width: 1299.98px) {
  .subsite-header {
    height: 700px;
  }
}
@media (max-width: 1199.98px) {
  .subsite-header {
    min-height: 600px;
    height: 600px;
  }
}
@media (max-width: 991.98px) {
  .subsite-header {
    min-height: 500px;
    max-height: 550px;
    height: 100vh;
    margin: 0 -50px;
  }
}
.subsite-header .headers-container {
  position: relative;
  display: block;
  height: 100%;
  z-index: 2;
}
@media (max-width: 991.98px) {
  .subsite-header .headers-container {
    position: absolute;
    width: calc(100% - 100px);
    height: auto;
    bottom: 0;
  }
}
.subsite-header .headers-container .headers {
  width: 100%;
  display: block;
  position: absolute;
  bottom: 130px;
  color: white;
}
@media (max-width: 991.98px) {
  .subsite-header .headers-container .headers {
    bottom: 60px;
    width: 50%;
    left: 50%;
    transform: translateX(-50%);
  }
}
@media (max-width: 575.98px) {
  .subsite-header .headers-container .headers {
    width: 70%;
    margin-left: -30px;
  }
}
.subsite-header .headers-container a {
  color: white;
}
.subsite-header .background-panel {
  position: absolute;
  z-index: -1;
  background: #bce5fb;
  width: 75%;
  height: calc(100% - 100px);
  left: -30px;
  transition: all 1s ease-in-out;
}
@media (max-width: 991.98px) {
  .subsite-header .background-panel {
    height: calc(100% - 70px);
    width: 100%;
    left: -80px;
  }
}
@media (max-width: 767.98px) {
  .subsite-header .background-panel {
    left: -100px;
  }
}
.subsite-header .copy {
  font: 27px/32px Arial, sans-serif;
  margin-top: 20px;
  margin-bottom: 40px;
  color: white;
  width: 100%;
}
@media (max-width: 1399.98px) {
  .subsite-header .copy {
    font: 24px/28px Arial, sans-serif;
  }
}
@media (max-width: 1299.98px) {
  .subsite-header .copy {
    font: 20px/24px Arial, sans-serif;
  }
}
@media (max-width: 1199.98px) {
  .subsite-header .copy {
    font: 18px/20px Arial, sans-serif;
  }
}
.subsite-header .product-image-header {
  position: absolute;
  right: 480px;
  top: -5px;
  width: 370px;
  height: 690px;
  transform: rotate(355deg);
  background-image: url(../themes/glemvital2025/assets/images/header-product.png);
  background-position: bottom center;
  background-repeat: no-repeat;
  background-size: contain;
  animation-name: float-header;
  animation-duration: 9s;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(0.4, 0, 0.62, 1);
}
@media (max-width: 1399.98px) {
  .subsite-header .product-image-header {
    width: 300px;
    height: 573px;
    right: 453px;
    top: -3px;
  }
}
@media (max-width: 1299.98px) {
  .subsite-header .product-image-header {
    width: 270px;
    height: 590px;
    right: 443px;
    top: -82px;
  }
}
@media (max-width: 1199.98px) {
  .subsite-header .product-image-header {
    width: 230px;
    height: 500px;
    right: 381px;
    top: -82px;
  }
}
@media (max-width: 991.98px) {
  .subsite-header .product-image-header {
    width: 200px;
    height: 430px;
    right: 7px;
    top: 93px;
  }
}
@media (max-width: 767.98px) {
  .subsite-header .product-image-header {
    width: 160px;
    height: 308px;
    right: 35px;
    top: 100px;
  }
}
@media (max-width: 575.98px) {
  .subsite-header .product-image-header {
    width: 140px;
    height: 269px;
    right: 35px;
    top: 68px;
  }
}
.loading {
  display: none;
  width: 50px;
  margin: 0 auto;
}
.error-message {
  display: none;
  background-color: #ff5050;
  color: white;
  padding: 15px 30px;
  margin-bottom: 5px;
}
.pack-back {
  background: url(../themes/glemvital2025/assets/images/pack-back.png) no-repeat left bottom;
  background-size: contain;
  width: 480px;
  height: 875px;
  position: fixed;
  right: -470px;
  bottom: 50%;
  margin-bottom: -300px;
  z-index: 10;
  transform: rotate(-20deg);
  transform-origin: top left;
  transition: all 1.8s cubic-bezier(0.7, 0, 0.3, 1);
}
@media (max-width: 1399.98px) {
  .pack-back {
    width: 400px;
    height: 750px;
    margin-bottom: -200px;
  }
}
@media (max-width: 1299.98px) {
  .pack-back {
    width: 350px;
    height: 640px;
    margin-bottom: -150px;
  }
}
@media (max-width: 1199.98px) {
  .pack-back {
    width: 320px;
    height: 580px;
    right: -430px;
    margin-bottom: -130px;
  }
}
@media (max-width: 991.98px) {
  .pack-back {
    width: 300px;
    height: 550px;
    right: -430px;
    margin-bottom: -120px;
  }
}
@media (max-width: 767.98px) {
  .pack-back {
    width: 230px;
    height: 460px;
    right: -445px;
    margin-bottom: -50px;
  }
}
.pack-back.active {
  transform: translateX(-350px) rotate(0deg);
}
.pack-back .code {
  transform-origin: left top;
  color: black;
  position: absolute;
  bottom: 346px;
  left: 162px;
  transform: rotate(44deg);
  font-size: 18px;
  font-weight: bold;
  width: 130px;
  text-align: center;
}
@media (max-width: 1399.98px) {
  .pack-back .code {
    bottom: 293px;
    left: 131px;
    font-size: 15px;
  }
}
@media (max-width: 1299.98px) {
  .pack-back .code {
    bottom: 265px;
    left: 106px;
    font-size: 13px;
  }
}
@media (max-width: 1199.98px) {
  .pack-back .code {
    bottom: 248px;
    left: 92px;
    font-size: 11px;
  }
}
@media (max-width: 991.98px) {
  .pack-back .code {
    bottom: 237px;
    left: 83px;
    font-size: 11px;
  }
}
@media (max-width: 767.98px) {
  .pack-back .code {
    bottom: 187px;
    left: 55px;
    font-size: 8px;
  }
}
.pack-back .arrow {
  position: absolute;
  width: 70px;
  height: 49px;
  background: url(../themes/glemvital2025/assets/images/arrow.png) no-repeat center;
  background-size: contain;
  bottom: 360px;
  left: 40px;
  transform-origin: 80px 100px;
  animation-name: arrow;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
}
@media (max-width: 1399.98px) {
  .pack-back .arrow {
    bottom: 289px;
    left: 17px;
  }
}
@media (max-width: 1299.98px) {
  .pack-back .arrow {
    bottom: 250px;
    left: 10px;
  }
}
@media (max-width: 1199.98px) {
  .pack-back .arrow {
    width: 56px;
    bottom: 223px;
    left: 15px;
  }
}
@media (max-width: 991.98px) {
  .pack-back .arrow {
    bottom: 211px;
    left: 8px;
  }
}
@media (max-width: 767.98px) {
  .pack-back .arrow {
    width: 40px;
    height: 30px;
    bottom: 160px;
    left: 3px;
  }
}
.step-number {
  width: 70px;
}
.steps-product {
  background: url(../themes/glemvital2025/assets/images/steps-product.png) no-repeat left bottom;
  background-size: contain;
  width: 300px;
  height: 660px;
  position: absolute;
  left: -110px;
  bottom: -240px;
  z-index: -1;
  opacity: 0;
  transition: opacity 1s linear;
}
@media (max-width: 991.98px) {
  .steps-product {
    width: 250px;
    height: 540px;
    bottom: -300px;
  }
}
@media (max-width: 767.98px) {
  .steps-product {
    display: none;
  }
}
.steps-product.active {
  z-index: 1;
  opacity: 1;
  animation-name: float-steps-product;
  animation-duration: 8s;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(0.4, 0, 0.62, 1);
}
.packshot {
  background-repeat: no-repeat;
  background-size: contain;
  width: 300px;
  height: 660px;
  position: absolute;
  right: -100px;
  top: 100px;
  z-index: -1;
  opacity: 0;
  transform: rotate(-5deg) scale(0.7);
  transform-origin: bottom center;
  transition: all 1s cubic-bezier(0.07000000000000001, 0.28, 0.12, 1), opacity 1s linear;
}
@media (max-width: 1399.98px) {
  .packshot {
    right: -180px;
  }
}
@media (max-width: 1299.98px) {
  .packshot {
    width: 274px;
    height: 595px;
  }
}
@media (max-width: 1199.98px) {
  .packshot {
    width: 229px;
    height: 498px;
  }
}
@media (max-width: 991.98px) {
  .packshot {
    width: 210px;
    height: 463px;
    right: -165px;
  }
}
@media (max-width: 767.98px) {
  .packshot {
    width: 183px;
    height: 404px;
    right: -85px;
  }
}
@media (max-width: 575.98px) {
  .packshot {
    width: 140px;
    height: 310px;
    top: 450px;
    right: 50%;
    margin-right: -110px;
  }
}
.packshot.active {
  z-index: 1;
  opacity: 1;
  transform: rotate(-15deg) scale(1);
  animation-name: float-packshot;
  animation-duration: 9s;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(0.4, 0, 0.62, 1);
}
@media (max-width: 575.98px) {
  .packshot.packshot-step-4 {
    top: 360px;
  }
}
@media (max-width: 575.98px) {
  .packshot.packshot-step-5 {
    top: 450px;
    margin-right: -240px;
  }
}
.packshot .texts {
  width: 100%;
  position: absolute;
  bottom: 265px;
}
@media (max-width: 1299.98px) {
  .packshot .texts {
    bottom: 225px;
  }
}
@media (max-width: 1199.98px) {
  .packshot .texts {
    bottom: 190px;
  }
}
@media (max-width: 991.98px) {
  .packshot .texts {
    bottom: 180px;
  }
}
@media (max-width: 767.98px) {
  .packshot .texts {
    bottom: 150px;
  }
}
@media (max-width: 575.98px) {
  .packshot .texts {
    bottom: 120px;
  }
}
.packshot .pre-title,
.packshot .title {
  width: 76%;
  position: relative;
  margin: 0 auto;
  color: #152662;
}
.packshot .pre-title {
  bottom: 0;
  font: 30px/30px 'Turbinado', Arial, sans-serif;
}
@media (max-width: 1199.98px) {
  .packshot .pre-title {
    font: 28px/28px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 991.98px) {
  .packshot .pre-title {
    font: 24px/24px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 767.98px) {
  .packshot .pre-title {
    font: 20px/20px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 575.98px) {
  .packshot .pre-title {
    font: 14px/14px 'Turbinado', Arial, sans-serif;
  }
}
.packshot .title {
  font: 50px/50px 'Turbinado', Arial, sans-serif;
}
@media (max-width: 1199.98px) {
  .packshot .title {
    font: 40px/40px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 575.98px) {
  .packshot .title {
    font: 30px/30px 'Turbinado', Arial, sans-serif;
  }
}
.dark-pack .page-content .page-content-inner {
  color: white;
}
.dark-pack .packshot .pre-title,
.dark-pack .packshot .title {
  color: white;
}
.kids-pack .packshot .texts {
  bottom: 293px;
}
@media (max-width: 1299.98px) {
  .kids-pack .packshot .texts {
    bottom: 257px;
  }
}
@media (max-width: 1199.98px) {
  .kids-pack .packshot .texts {
    bottom: 215px;
  }
}
@media (max-width: 991.98px) {
  .kids-pack .packshot .texts {
    bottom: 205px;
  }
}
@media (max-width: 767.98px) {
  .kids-pack .packshot .texts {
    bottom: 180px;
  }
}
@media (max-width: 575.98px) {
  .kids-pack .packshot .texts {
    bottom: 137px;
  }
}
.packshot-small {
  display: inline-block;
  width: 17%;
  transform: scale(0.9);
  transition: all 0.6s cubic-bezier(0.7, 0, 0.3, 1);
}
@media (max-width: 991.98px) {
  .packshot-small {
    width: 23%;
  }
}
.packshot-small.not-selected {
  transform: scale(0.6);
}
.packshot-small:hover {
  cursor: pointer;
  transform: scale(1);
}
#content {
  overflow: hidden;
}
.page-content {
  position: relative;
  margin-top: 60px;
}
.page-content .page-back-bg {
  z-index: 0;
  position: absolute;
  width: 110%;
  height: 1000px;
  top: -80px;
  right: -100px;
  background: #bce5fb;
  opacity: .5;
}
.page-content .page-content-bg {
  z-index: 1;
  position: absolute;
  width: 110%;
  height: 100%;
  top: 0;
  right: 0;
  background: #bce5fb;
  padding: 30px;
}
.page-content .page-content-inner {
  z-index: 9;
  position: relative;
  padding: 45px 30px;
  color: #0e3057;
}
.page-content .page-content-inner .step-title {
  color: white;
}
.page-content .page-content-inner p {
  padding: 15px 0;
}
.page-content .code-wrapper {
  background: #66abe0;
  padding: 0 30px;
  display: inline-block;
  margin: 0 auto;
  transition: background-color 0.3s linear;
}
.page-content .code-wrapper.has-error {
  background: #ff5050;
}
.page-content .file-wrapper {
  position: relative;
  background: #66abe0;
  padding: 0 30px;
  display: inline-block;
  margin: 0 auto;
  transition: background-color 0.3s linear;
}
.page-content .file-wrapper .file-upload-icon {
  width: 300px;
  position: absolute;
  top: -20px;
  right: -300px;
  animation: float-easy 9s cubic-bezier(0.4, 0, 0.62, 1) infinite;
}
@media (max-width: 1199.98px) {
  .page-content .file-wrapper .file-upload-icon {
    width: 200px;
    right: -200px;
  }
}
@media (max-width: 575.98px) {
  .page-content .file-wrapper .file-upload-icon {
    width: 100px;
    right: -100px;
  }
}
.page-content .file-wrapper.has-error {
  background: #ff5050;
}
.page-content .file-wrapper.has-error #uploaded-file {
  text-decoration: line-through;
}
.page-content .file-wrapper.has-error + p span {
  color: red !important;
}
.page-content .file-wrapper + p span {
  transition: color .3s linear;
}
.page-content .word-wrapper {
  position: relative;
  background: #66abe0;
  padding: 100px 30px;
  color: white;
  display: inline-block;
  margin: 0 auto;
  width: 800px;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.62, 1);
}
@media (max-width: 1299.98px) {
  .page-content .word-wrapper {
    width: 700px;
  }
}
@media (max-width: 991.98px) {
  .page-content .word-wrapper {
    width: 510px;
  }
}
@media (max-width: 767.98px) {
  .page-content .word-wrapper {
    padding: 85px 30px;
    width: 450px;
  }
}
@media (max-width: 575.98px) {
  .page-content .word-wrapper {
    padding: 70px 30px;
    width: 100%;
  }
}
.page-content .word-wrapper.has-error {
  background: #ff5050;
}
.page-content .word-wrapper .gehort {
  position: absolute;
  top: -80px;
  left: 50%;
  transform: translateX(-50%);
  font: 60px/60px 'Turbinado', Arial, sans-serif;
  color: #0e3057;
}
@media (max-width: 1199.98px) {
  .page-content .word-wrapper .gehort {
    top: -72px;
    font: 50px/50px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 991.98px) {
  .page-content .word-wrapper .gehort {
    top: -57px;
    font: 40px/40px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 575.98px) {
  .page-content .word-wrapper .gehort {
    top: -37px;
    font: 24px/24px 'Turbinado', Arial, sans-serif;
  }
}
.page-content .word-wrapper .word {
  width: 700px;
  height: 110px;
  margin: 0 auto;
  text-align: center;
  font: 90px/120px 'Turbinado', Arial, sans-serif;
}
@media (max-width: 1299.98px) {
  .page-content .word-wrapper .word {
    width: 640px;
  }
}
@media (max-width: 1199.98px) {
  .page-content .word-wrapper .word {
    width: 600px;
  }
}
@media (max-width: 991.98px) {
  .page-content .word-wrapper .word {
    width: 420px;
    height: 85px;
    font: 60px/80px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 767.98px) {
  .page-content .word-wrapper .word {
    width: 390px;
    height: 60px;
    font: 55px/60px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 575.98px) {
  .page-content .word-wrapper .word {
    width: 300px;
    height: 50px;
    font: 42px/42px 'Turbinado', Arial, sans-serif;
  }
}
.page-content .word-wrapper .word span {
  border: none;
  outline: none;
  box-shadow: none;
  height: 198px;
}
@media (max-width: 575.98px) {
  .page-content .word-wrapper .word span {
    height: 50px;
  }
}
.page-content .word-wrapper .inspiration {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 273px;
  height: 193px;
  transform: scale(0.8) rotate(-15deg);
  right: 30px;
  bottom: -120px;
  transition: transform 0.3s cubic-bezier(0.7, 0, 0.3, 1);
}
.page-content .word-wrapper .inspiration .bubble {
  width: 193px;
  height: 193px;
  border-radius: 50%;
  background: #6AFAB8;
  opacity: .6;
  position: absolute;
  transition: transform 0.3s cubic-bezier(0.7, 0, 0.3, 1);
  animation-name: pulse;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
}
@media (max-width: 991.98px) {
  .page-content .word-wrapper .inspiration .bubble {
    width: 150px;
    height: 150px;
  }
}
@media (max-width: 767.98px) {
  .page-content .word-wrapper .inspiration .bubble {
    width: 130px;
    height: 130px;
  }
}
@media (max-width: 575.98px) {
  .page-content .word-wrapper .inspiration .bubble {
    width: 100px;
    height: 100px;
  }
}
.page-content .word-wrapper .inspiration .text {
  font: 65px/65px 'Turbinado', Arial, sans-serif;
  position: absolute;
  transition: transform 0.3s cubic-bezier(0.7, 0, 0.3, 1);
}
@media (max-width: 991.98px) {
  .page-content .word-wrapper .inspiration .text {
    font: 50px/50px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 767.98px) {
  .page-content .word-wrapper .inspiration .text {
    font: 42px/42px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 575.98px) {
  .page-content .word-wrapper .inspiration .text {
    font: 36px/36px 'Turbinado', Arial, sans-serif;
  }
}
.page-content .word-wrapper .inspiration:hover {
  cursor: pointer;
  transform: rotate(0deg);
}
.page-content .word-wrapper .inspiration:hover .bubble {
  transform: scale(1.2);
}
.page-content .word-wrapper .inspiration:hover .text {
  transform: scale(0.8);
}
.page-content .code-input {
  background: transparent;
  border: none;
  color: white;
  text-align: center;
  width: 800px;
  font: 180px/180px 'Turbinado', Arial, sans-serif;
}
@media (max-width: 1399.98px) {
  .page-content .code-input {
    width: 680px;
    font: 160px/160px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 1199.98px) {
  .page-content .code-input {
    width: 600px;
    font: 140px/140px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 991.98px) {
  .page-content .code-input {
    width: 350px;
    font: 80px/80px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 767.98px) {
  .page-content .code-input {
    width: 305px;
    font: 70px/70px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 575.98px) {
  .page-content .code-input {
    width: 200px;
    font: 47px/47px 'Turbinado', Arial, sans-serif;
  }
}
.page-content .code-input:focus {
  outline: none;
  border: none;
  box-shadow: none;
}
.page-content .code-input::placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: white;
  opacity: 1;
  /* Firefox */
}
.page-content .code-input:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: white;
}
.page-content .code-input::-ms-input-placeholder {
  /* Microsoft Edge */
  color: white;
}
.page-content #file_input {
  display: none;
}
.page-content .file_input {
  position: relative;
  cursor: pointer;
  border: none;
  color: white;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 25px;
  width: 800px;
  height: 100%;
  min-height: 330px;
  background-image: url('../themes/glemvital2025/assets/images/file-select-border.svg');
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position: center center;
  font: 100px/100px 'Turbinado', Arial, sans-serif;
}
.page-content .file_input .file-select-icon {
  width: 100px;
}
.page-content .file_input #uploaded-file {
  position: absolute;
  bottom: 70px;
  font-size: 25px;
  line-height: 25px;
}
@media (max-width: 1399.98px) {
  .page-content .file_input {
    width: 680px;
    font: 80px/80px 'Turbinado', Arial, sans-serif;
  }
  .page-content .file_input .file-select-icon {
    width: 80px;
  }
  .page-content .file_input #uploaded-file {
    bottom: 85px;
    font-size: 22px;
  }
}
@media (max-width: 1199.98px) {
  .page-content .file_input {
    width: 600px;
    font: 60px/60px 'Turbinado', Arial, sans-serif;
  }
  .page-content .file_input #uploaded-file {
    bottom: 95px;
  }
}
@media (max-width: 991.98px) {
  .page-content .file_input {
    width: 370px;
    font: 50px/50px 'Turbinado', Arial, sans-serif;
    min-height: 190px;
  }
  .page-content .file_input .file-select-icon {
    width: 50px;
  }
  .page-content .file_input #uploaded-file {
    font-size: 18px;
    bottom: 40px;
  }
}
@media (max-width: 767.98px) {
  .page-content .file_input {
    width: 335px;
    font: 50px/50px 'Turbinado', Arial, sans-serif;
  }
  .page-content .file_input #uploaded-file {
    bottom: 5px;
  }
}
@media (max-width: 575.98px) {
  .page-content .file_input {
    width: 200px;
    font: 47px/47px 'Turbinado', Arial, sans-serif;
    min-height: 140px;
    background-image: none;
    text-align: left;
  }
  .page-content .file_input #uploaded-file {
    bottom: 0px;
    font-size: 16px;
  }
}
.inspiration-list {
  display: none;
  z-index: 999;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
}
.inspiration-list .inspiration-close {
  position: absolute;
  z-index: 1000;
  right: 15px;
  top: 15px;
  cursor: pointer;
}
.inspiration-list .inspiration-list-items {
  position: absolute;
  top: 30%;
  left: 50%;
  transform: translateX(-50%);
  width: 800px;
}
@media (max-width: 1299.98px) {
  .inspiration-list .inspiration-list-items {
    width: 700px;
  }
}
@media (max-width: 991.98px) {
  .inspiration-list .inspiration-list-items {
    width: 510px;
  }
}
@media (max-width: 767.98px) {
  .inspiration-list .inspiration-list-items {
    width: 450px;
  }
}
@media (max-width: 575.98px) {
  .inspiration-list .inspiration-list-items {
    width: 100%;
  }
}
.inspiration-list .inspiration-list-items .inspiration-item {
  padding: 15px 30px;
  color: white;
  font: 50px/50px 'Turbinado', Arial, sans-serif;
  background-color: #66abe0;
  transition: background-color 0.6s linear;
}
.inspiration-list .inspiration-list-items .inspiration-item:hover {
  background-color: #bce5fb;
}
.step {
  display: none;
}
.step.step-1 {
  display: block;
}
.modal .modal-content {
  border: none;
  border-radius: 0;
}
.modal .modal-header,
.modal .modal-body,
.modal .modal-footer {
  background-color: #66abe0;
  border: none;
  border-radius: 0;
  padding: 10px 30px;
  color: white;
  font: 12px/14px Arial, sans-serif;
}
.modal .modal-header h4,
.modal .modal-body h4,
.modal .modal-footer h4,
.modal .modal-header h5,
.modal .modal-body h5,
.modal .modal-footer h5 {
  font: 40px/40px 'Turbinado', Arial, sans-serif;
  color: white;
}
@media (max-width: 991.98px) {
  .modal .modal-header h4,
  .modal .modal-body h4,
  .modal .modal-footer h4,
  .modal .modal-header h5,
  .modal .modal-body h5,
  .modal .modal-footer h5 {
    font: 30px/30px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 767.98px) {
  .modal .modal-header h4,
  .modal .modal-body h4,
  .modal .modal-footer h4,
  .modal .modal-header h5,
  .modal .modal-body h5,
  .modal .modal-footer h5 {
    font: 20px/20px 'Turbinado', Arial, sans-serif;
  }
}
.modal .modal-header button,
.modal .modal-body button,
.modal .modal-footer button {
  background: none;
  border: none;
  font: 18px/22px Arial, sans-serif;
  padding-right: 50px;
}
.modal .modal-header button:after,
.modal .modal-body button:after,
.modal .modal-footer button:after {
  width: 20px;
}
.modal-backdrop {
  opacity: 0 !important;
}
.close-modal {
  padding-right: 0 !important;
}
.cookies {
  position: fixed;
  padding: 30px;
  background: #66abe0;
  color: white;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  font: 18px/22px Arial, sans-serif;
}
.cookies h3 {
  font: 40px/40px 'Turbinado', Arial, sans-serif;
}
.cookies .btn {
  font: 18px/22px Arial, sans-serif;
  padding-right: 50px;
}
.cookies .btn.no-right-padding {
  padding-right: 0;
}
.cookies .btn:after {
  width: 20px;
}
.list-cookies {
  background: white;
  padding: 15px 30px;
  color: black;
}
.list-cookies p {
  margin: 0;
}
.list-cookies .description {
  padding: 5px 0;
}
.list-cookies .form-check {
  margin: 15px 0 0 0;
  min-height: inherit;
  font: 18px/22px Arial, sans-serif;
}
.form-control {
  padding: 10px 15px;
  border: none;
  background: #66abe0;
  color: white;
  font: 50px/51px 'Turbinado', Arial, sans-serif;
}
@media (max-width: 1299.98px) {
  .form-control {
    font: 42px/42px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 1199.98px) {
  .form-control {
    font: 36px/36px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 991.98px) {
  .form-control {
    font: 30px/30px 'Turbinado', Arial, sans-serif;
  }
}
@media (max-width: 767.98px) {
  .form-control {
    font: 26px/26px 'Turbinado', Arial, sans-serif;
  }
}
.form-control.has-error {
  background: #ff5050;
}
.form-control:focus,
.form-control:active:focus {
  outline: none;
  box-shadow: none;
}
.form-control::placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: white;
  opacity: 1;
  /* Firefox */
}
.form-control:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: white;
}
.form-control::-ms-input-placeholder {
  /* Microsoft Edge */
  color: white;
}
.error-container {
  width: 100vw;
  height: 100vh;
  background: #d3c7f8 url(../themes/glemvital2025/assets/images/error/404.jpg) no-repeat center;
  background-size: cover;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}
.error-container .error-content {
  max-width: 800px;
  padding: 30px;
}
.error-container h1 {
  color: white;
  font: 40px/40px 'Turbinado', Arial, sans-serif;
}
.error-container h2 {
  color: white;
  font: 120px/120px 'Turbinado', Arial, sans-serif;
}
.error-container h3 {
  color: white;
  font: 50px/50px 'Turbinado', Arial, sans-serif;
}
.checkbox {
  height: 66px;
}
#wordplace {
  width: 100%;
  background: none;
  border: none;
  color: white;
  outline: none;
  box-shadow: none;
}
.variant-green header .search .form-control {
  border-bottom: 3px solid #0e3057;
  color: #0e3057;
}
.variant-green header .search button svg {
  fill: #0e3057;
}
.variant-green header h1,
.variant-green header .copy,
.variant-green header a {
  color: #0e3057;
}
.variant-green .subsite-header .background-panel {
  background: #fcf7c0;
}
.variant-green .subsite-header .product-image-header {
  background-image: url(../themes/glemvital2025/assets/images/header-product-green.png);
}
.variant-green .subsite-header h1,
.variant-green .subsite-header .copy,
.variant-green .subsite-header a {
  color: #0e3057;
}
.variant-orange header .search .form-control {
  border-bottom: 3px solid #f9c48e;
  color: #f9c48e;
}
.variant-orange header .search button svg {
  fill: #f9c48e;
}
.variant-orange .subsite-header .background-panel {
  background: #f9c48e;
}
.variant-orange .subsite-header .product-image-header {
  background-image: url(../themes/glemvital2025/assets/images/header-product-blue.png);
}
.variant-blue header .search .form-control {
  border-bottom: 3px solid #bce5fb;
  color: #bce5fb;
}
.variant-blue header .search button svg {
  fill: #bce5fb;
}
.variant-blue .subsite-header .background-panel {
  background: #bce5fb;
}
.variant-blue .subsite-header .product-image-header {
  background-image: url(../themes/glemvital2025/assets/images/header-product-yellow.png);
}
.variant-blue .page-content .page-back-bg,
.variant-blue .page-content .page-content-bg {
  background: #f9c48e;
}
.variant-blue .page-content .code-wrapper,
.variant-blue .page-content .word-wrapper {
  background: #eb8d56;
}
.variant-blue .inspiration-list .inspiration-list-items .inspiration-item {
  background-color: #eb8d56;
}
.variant-blue .inspiration-list .inspiration-list-items .inspiration-item:hover {
  background-color: #f9c48e;
}
.variant-blue .form-control {
  background: #eb8d56;
}
