:root {
  --background-color: #000000;
  --background-color-2: #111111;
  --background-color-3: #1a1a1a;
  --background-color-4: #00ffff;
  --background-color-3-op-65: rgba(26, 26, 26, 0.65);
  --background-color-3-op-75: rgba(26, 26, 26, 0.75);
  --background-color-3-op-85: rgba(26, 26, 26, 0.85);
  --background-color-3-op-95: rgba(26, 26, 26, 0.95);

  --table-color: #636363;
  --border-color: #787878;
  --border-color-blue: #00ffff;
  
  --gradient-first-color: #00eaff;
  --gradient-middle-color: #8371f7;
  --gradient-second-color: #ff00f0;
  
  --font-color-white: #ffffff;
  --font-color-black: #111111;
  --font-color-dark: #636363;
  --font-color-medium: #787878;
  --font-color-light: #cccccc;
  --font-color-blue: #00ffff;
  --font-color-deep-blue: #1dd0fd;
  --font-color-gold: #a8d518;
  
  --icon-stroke-color: #777777;
}

html {
  scrollbar-color: #00ffff #787878;
  scrollbar-width: thin;
}

::-webkit-scrollbar {
  width: 6px;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(to bottom, var(--gradient-middle-color), var(--gradient-first-color));
  border-radius: 3px;
}

::-webkit-scrollbar-track {
  background-color: #787878;
}

::-webkit-scrollbar-button {
  display: none;
}

@font-face {
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 300;
  src: local(''),
       url('../fonts/nunito-sans-300.woff2') format('woff2'),
       url('../fonts/nunito-sans-300.woff') format('woff');
  font-display: swap;
}

@font-face {
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('../fonts/nunito-sans-regular.woff2') format('woff2'),
       url('../fonts/nunito-sans-regular.woff') format('woff');
  font-display: swap;
}

@font-face {
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 600;
  src: local(''),
       url('../fonts/nunito-sans-600.woff2') format('woff2'),
       url('../fonts/nunito-sans-600.woff') format('woff');
  font-display: swap;
}

@font-face {
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       url('../fonts/nunito-sans-700.woff2') format('woff2'),
       url('../fonts/nunito-sans-700.woff') format('woff');
  font-display: swap;
}

.text-left {
  text-align: left !important;
}

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

.text-right {
  text-align: right !important;
}

.text-uppercase {
  text-transform: uppercase !important;
}

.font-color-white {
  color: var(--font-color-white) !important;
}

.font-color-black {
  color: var(--font-color-black) !important;
}

.font-color-dark {
  color: var(--font-color-dark) !important;
}

.font-color-medium {
  color: var(--font-color-medium) !important;
}

.font-color-light {
  color: var(--font-color-blue) !important;
}

.font-color-lightest {
  color: var(--font-color-light) !important;
}

.background-color {
  background-color: var(--background-color) !important;
}

.background-color-2 {
  background-color: var(--background-color-2) !important;
}

.background-color-3 {
  background-color: var(--background-color-3) !important;
}

.relative {
  position: relative;
}

.height-100 {
  height: 100%;
}

.flex {
  display: flex;
}

.flex-column {
  flex-direction: column !important;
}

.flex-row {
  flex-direction: row !important;
}

.flex-1-1-auto {
  flex: 1 1 auto !important;
}

.justify-content-center {
  justify-content: center !important;
}

.justify-content-space-between {
  justify-content: space-between !important;
}

.justify-content-end {
  justify-content: flex-end !important;
}

.align-items-center {
  align-items: center !important;
}

.align-items-start {
  align-items: flex-start !important;
}

.align-items-end {
  align-items: flex-end !important;
}

*,
*:after,
*:before {
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
  font-size: 62.5%;
  overflow-x: hidden;
}

body {
  background-color: var(--background-color);
  font-family: 'Nunito Sans', sans-serif;
  font-style: normal;
  font-size: 1.7rem;
  font-weight: 400;
  font-display: swap;
  line-height: 1.25;
  overflow-x: hidden;
}

#yuplay-root {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  flex: 1;
  min-height: 100vh;
}

.no-style {
  background: transparent;
  border: none;
  outline: none;  
}

.icon {
  position: relative;
  display: inline-block;
}

.icon.icon-headline-left.headline-level.level-4 {
  padding-left: 4.7rem;
  line-height: 3.6rem;
}

.icon:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  width: 65.789473%;
  height: 65.789473%;
  background-repeat: no-repeat;
  background-position-x: center;
  background-position-y: center;
}

.icon.icon-headline-left.headline-level.level-4:before {
  left: 0;
  transform: translateY(-50%);
  width: 3.6rem;
  height: 3.6rem;
}

.icon-arrowup-gradient:before {
  background-image: url('../icons/arrowup_icon_gradient.svg');
}

.icon-cart:before {
  background-image: url('../icons/shopping_cart_icon_grey.svg');  
}

.icon-cart.is_active:before,
.icon-cart.open-popup:before,
.icon-cart:not(.icon-no-hover):hover:before,
.icon-cart:not(.icon-no-hover):active:before {
  background-image: url('../icons/shopping_cart_icon_blue.svg');  
}

.icon-instant-delivery:before {
  background-image: url('../icons/instantdelivery_icon_grey.svg');
}

.icon-instant-delivery.is_active:before,
.icon-instant-delivery:not(.icon-no-hover):focus:before,
.icon-instant-delivery:not(.icon-no-hover):hover:before,
.icon-instant-delivery:not(.icon-no-hover):active:before {
  background-image: url('../icons/instantdelivery_icon_blue.svg');
}

.icon-user:before {
  background-image: url('../icons/user_icon_grey.svg');
}

.icon-user.is_active:before,
.icon-user.open-popup:before,
.icon-user:not(.icon-no-hover):hover:before {
  background-image: url('../icons/user_icon_blue.svg');
}

.icon-currency:before {
  background-image: url('../icons/currency_icon_grey.svg');  
}

.icon-currency.is_active:before,
.icon-currency:not(.icon-no-hover):focus:before,
.icon-currency:not(.icon-no-hover):hover:before,
.icon-currency:not(.icon-no-hover):active:before {
  background-image: url('../icons/currency_icon_blue.svg');  
}

.icon-delete:before {
  background-image: url('../icons/close_icon_grey.svg');
}

.icon-delete.is_active:before,
.icon-delete:not(.icon-no-hover):focus:before,
.icon-delete:not(.icon-no-hover):hover:before,
.icon-delete:not(.icon-no-hover):active:before {
  background-image: url('../icons/close_icon_blue.svg');
}

.icon-edit:before {
  background-image: url('../icons/edit_icon_grey.svg');
}

.icon-edit.is_active:before,
.icon-edit:not(.icon-no-hover):focus:before,
.icon-edit:not(.icon-no-hover):hover:before {
  background-image: url('../icons/edit_icon_blue.svg');
}

.icon-send:before {
  background-image: url('../icons/send_icon_grey.svg');
}

.icon-send.is_active:before,
.icon-send:not(.icon-no-hover):focus:before,
.icon-send:not(.icon-no-hover):hover:before {
  background-image: url('../icons/send_icon_blue.svg');
}

.icon-favorite:before {
  background-image: url('../icons/favorite_icon_grey.svg');  
}

.icon-favorite.is_active:before,
.icon-favorite:not(.icon-no-hover):hover:before {
  background-image: url('../icons/favorite_icon_blue.svg');
}

.icon-yucoin:before {
  background-image: url('../icons/my_new_yucoin_icon_grey.svg');
}

.icon-yucoin.is_active:before,
.icon-yucoin:not(.icon-no-hover):hover:before {
  background-image: url('../icons/my_new_yucoin_icon_blue.svg');
}

.icon-genre-action:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M33.63,22.82V20.18a1,1,0,0,0-1-1H30.15a5.13,5.13,0,0,0,.48-1.36,5.32,5.32,0,0,0,.08-1.54,5.4,5.4,0,0,0-.15-.88,5.64,5.64,0,0,0-.31-.81c-.22-.47-.54-.89-.76-1.35a1.81,1.81,0,0,1-.09-.31c0-.1,0-.2,0-.3s.07-.27.11-.4a3.35,3.35,0,0,1,.27-.45,3.31,3.31,0,0,1,.5-.49,7.18,7.18,0,0,1,1.33-.74.73.73,0,0,0,.35-.18.84.84,0,0,0,.27-.29,1,1,0,0,0-.37-1.41,1,1,0,0,0-.8-.1,9.23,9.23,0,0,0-1.58.77,5.86,5.86,0,0,0-.79.6,4.91,4.91,0,0,0-.64.72,3.76,3.76,0,0,0-.36.61,3.71,3.71,0,0,0-.29.91,4.07,4.07,0,0,0-.06.6,2.45,2.45,0,0,0,.06.6,3.35,3.35,0,0,0,.32.92c.22.46.52.86.74,1.32a3.86,3.86,0,0,1,.2.74,5.34,5.34,0,0,1,0,.8,5.2,5.2,0,0,1-.23.86,4.15,4.15,0,0,1-.38.64c-.1.12-.21.24-.32.35a1.15,1.15,0,0,0-.14.17H24.33a1,1,0,0,0-1,1v2.64a17.39,17.39,0,1,0,10.29,0Z"/><rect class="cls-1" x="35.35" y="2.25" width="1.98" height="5.39" rx="0.99" transform="translate(14.14 -24.25) rotate(45)"/><rect class="cls-1" x="37.17" y="6.98" width="1.98" height="5.39" rx="0.99" transform="translate(47.83 -28.49) rotate(90)"/><rect class="cls-1" x="35.11" y="11.6" width="1.98" height="5.39" rx="0.99" transform="translate(71.74 -1.12) rotate(135)"/><rect class="cls-1" x="30.64" y="0.14" width="1.98" height="5.39" rx="0.99"/><rect class="cls-1" x="25.91" y="2.13" width="1.98" height="5.39" rx="0.99" transform="translate(4.47 20.43) rotate(-45)"/></svg>');
}

.icon-genre-action.is_active:before,
.icon-genre-action:not(.icon-no-hover):focus:before,
.icon-genre-action:not(.icon-no-hover):hover:before,
.icon-genre-action:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M33.63,22.82V20.18a1,1,0,0,0-1-1H30.15a5.13,5.13,0,0,0,.48-1.36,5.32,5.32,0,0,0,.08-1.54,5.4,5.4,0,0,0-.15-.88,5.64,5.64,0,0,0-.31-.81c-.22-.47-.54-.89-.76-1.35a1.81,1.81,0,0,1-.09-.31c0-.1,0-.2,0-.3s.07-.27.11-.4a3.35,3.35,0,0,1,.27-.45,3.31,3.31,0,0,1,.5-.49,7.18,7.18,0,0,1,1.33-.74.73.73,0,0,0,.35-.18.84.84,0,0,0,.27-.29,1,1,0,0,0-.37-1.41,1,1,0,0,0-.8-.1,9.23,9.23,0,0,0-1.58.77,5.86,5.86,0,0,0-.79.6,4.91,4.91,0,0,0-.64.72,3.76,3.76,0,0,0-.36.61,3.71,3.71,0,0,0-.29.91,4.07,4.07,0,0,0-.06.6,2.45,2.45,0,0,0,.06.6,3.35,3.35,0,0,0,.32.92c.22.46.52.86.74,1.32a3.86,3.86,0,0,1,.2.74,5.34,5.34,0,0,1,0,.8,5.2,5.2,0,0,1-.23.86,4.15,4.15,0,0,1-.38.64c-.1.12-.21.24-.32.35a1.15,1.15,0,0,0-.14.17H24.33a1,1,0,0,0-1,1v2.64a17.39,17.39,0,1,0,10.29,0Z"/><rect class="cls-1" x="35.35" y="2.25" width="1.98" height="5.39" rx="0.99" transform="translate(14.14 -24.25) rotate(45)"/><rect class="cls-1" x="37.17" y="6.98" width="1.98" height="5.39" rx="0.99" transform="translate(47.83 -28.49) rotate(90)"/><rect class="cls-1" x="35.11" y="11.6" width="1.98" height="5.39" rx="0.99" transform="translate(71.74 -1.12) rotate(135)"/><rect class="cls-1" x="30.64" y="0.14" width="1.98" height="5.39" rx="0.99"/><rect class="cls-1" x="25.91" y="2.13" width="1.98" height="5.39" rx="0.99" transform="translate(4.47 20.43) rotate(-45)"/></svg>');
}

.icon-genre-adventure:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M42.66,5.31,28.48,8.69,14.31,5.31.14,8.69v43l14.17-3.38,14.17,3.38,14.18-3.38,14.17,3.38v-43ZM5.28,23.45,3,20.94a21.3,21.3,0,0,1,1.84-1.42l1.93,2.77C5.84,23,5.29,23.44,5.28,23.45Zm5-3.19L8.82,17.21a24.57,24.57,0,0,1,4.34-1.6L14,18.87A21.81,21.81,0,0,0,10.28,20.26Zm11.47-1.57a14.6,14.6,0,0,0-3.85-.39l-.1-3.38a18.6,18.6,0,0,1,4.72.48ZM27.12,23a9.22,9.22,0,0,0-2.22-2.86l2.16-2.6a12.61,12.61,0,0,1,3.05,3.88Zm2.39,6.7c-.28-1-.57-2-.88-3l3.21-1c.33,1,.63,2.08.92,3.09.1.37.21.74.31,1.1l-3.24.94C29.72,30.49,29.61,30.11,29.51,29.74Zm4.72,9.55a10.49,10.49,0,0,1-2.94-4.14l3.1-1.35a7.32,7.32,0,0,0,2,2.86Zm5.87.89-1.69-2.93c.38-.22,1-.85,1.63-2.64l3.17,1.19C42.37,38.05,41.38,39.44,40.1,40.18Zm4.59-9.47-.2.77-3.27-.84c.06-.25.13-.51.19-.76.3-1.17.6-2.37.94-3.48l3.23,1C45.27,28.42,45,29.58,44.69,30.71Zm8.36-9.62A7.72,7.72,0,0,0,51.33,21a8.65,8.65,0,0,0-.89.11l-.42.09-.2.05a12.5,12.5,0,0,0-2,.76c.65,1.89,1.26,3.8,2,5.65a1,1,0,0,1-1.88.77c-.69-1.71-1.27-3.46-1.86-5.2l-.27-.21a16.87,16.87,0,0,1-5.39,1.84,1,1,0,0,1-.27-2,15.84,15.84,0,0,0,5-1.76l.14-.12c-.38-1-.81-2.07-1.29-3.07a1,1,0,1,1,1.87-.78c.47,1,.88,2,1.26,3a11.12,11.12,0,0,1,6.13-1.06A1,1,0,0,1,53.05,21.09Z"/></svg>');
}

.icon-genre-adventure.is_active:before,
.icon-genre-adventure:not(.icon-no-hover):focus:before,
.icon-genre-adventure:not(.icon-no-hover):hover:before,
.icon-genre-adventure:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M42.66,5.31,28.48,8.69,14.31,5.31.14,8.69v43l14.17-3.38,14.17,3.38,14.18-3.38,14.17,3.38v-43ZM5.28,23.45,3,20.94a21.3,21.3,0,0,1,1.84-1.42l1.93,2.77C5.84,23,5.29,23.44,5.28,23.45Zm5-3.19L8.82,17.21a24.57,24.57,0,0,1,4.34-1.6L14,18.87A21.81,21.81,0,0,0,10.28,20.26Zm11.47-1.57a14.6,14.6,0,0,0-3.85-.39l-.1-3.38a18.6,18.6,0,0,1,4.72.48ZM27.12,23a9.22,9.22,0,0,0-2.22-2.86l2.16-2.6a12.61,12.61,0,0,1,3.05,3.88Zm2.39,6.7c-.28-1-.57-2-.88-3l3.21-1c.33,1,.63,2.08.92,3.09.1.37.21.74.31,1.1l-3.24.94C29.72,30.49,29.61,30.11,29.51,29.74Zm4.72,9.55a10.49,10.49,0,0,1-2.94-4.14l3.1-1.35a7.32,7.32,0,0,0,2,2.86Zm5.87.89-1.69-2.93c.38-.22,1-.85,1.63-2.64l3.17,1.19C42.37,38.05,41.38,39.44,40.1,40.18Zm4.59-9.47-.2.77-3.27-.84c.06-.25.13-.51.19-.76.3-1.17.6-2.37.94-3.48l3.23,1C45.27,28.42,45,29.58,44.69,30.71Zm8.36-9.62A7.72,7.72,0,0,0,51.33,21a8.65,8.65,0,0,0-.89.11l-.42.09-.2.05a12.5,12.5,0,0,0-2,.76c.65,1.89,1.26,3.8,2,5.65a1,1,0,0,1-1.88.77c-.69-1.71-1.27-3.46-1.86-5.2l-.27-.21a16.87,16.87,0,0,1-5.39,1.84,1,1,0,0,1-.27-2,15.84,15.84,0,0,0,5-1.76l.14-.12c-.38-1-.81-2.07-1.29-3.07a1,1,0,1,1,1.87-.78c.47,1,.88,2,1.26,3a11.12,11.12,0,0,1,6.13-1.06A1,1,0,0,1,53.05,21.09Z"/></svg>');
}

.icon-genre-anime:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M28.48,4.07A24.41,24.41,0,0,1,45.74,45.74,24.41,24.41,0,1,1,11.22,11.22,24.25,24.25,0,0,1,28.48,4.07m0-3.93A28.35,28.35,0,1,0,56.83,28.48,28.34,28.34,0,0,0,28.48.14Z"/><path class="cls-1" d="M22.18,28.27a2,2,0,0,1-1.32-.51l-4.22-3.84-4.21,3.84a2,2,0,1,1-2.65-2.91l5.54-5.05a2,2,0,0,1,2.65,0l5.54,5.05a2,2,0,0,1,.13,2.78A2,2,0,0,1,22.18,28.27Z"/><path class="cls-1" d="M28.48,46.65a2,2,0,0,1-1.32-.51l-5.54-5a2,2,0,0,1,2.65-2.91L28.48,42l4.21-3.84a2,2,0,0,1,2.66,2.91l-5.54,5A2,2,0,0,1,28.48,46.65Z"/><path class="cls-1" d="M44.35,28.27A2,2,0,0,1,43,27.76l-4.21-3.84L34.6,27.76A2,2,0,1,1,32,24.85l5.54-5.05a2,2,0,0,1,2.65,0l5.53,5.05a2,2,0,0,1,.13,2.78A1.93,1.93,0,0,1,44.35,28.27Z"/></svg>');
}

.icon-genre-anime.is_active:before,
.icon-genre-anime:not(.icon-no-hover):focus:before,
.icon-genre-anime:not(.icon-no-hover):hover:before,
.icon-genre-anime:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M28.48,4.07A24.41,24.41,0,0,1,45.74,45.74,24.41,24.41,0,1,1,11.22,11.22,24.25,24.25,0,0,1,28.48,4.07m0-3.93A28.35,28.35,0,1,0,56.83,28.48,28.34,28.34,0,0,0,28.48.14Z"/><path class="cls-1" d="M22.18,28.27a2,2,0,0,1-1.32-.51l-4.22-3.84-4.21,3.84a2,2,0,1,1-2.65-2.91l5.54-5.05a2,2,0,0,1,2.65,0l5.54,5.05a2,2,0,0,1,.13,2.78A2,2,0,0,1,22.18,28.27Z"/><path class="cls-1" d="M28.48,46.65a2,2,0,0,1-1.32-.51l-5.54-5a2,2,0,0,1,2.65-2.91L28.48,42l4.21-3.84a2,2,0,0,1,2.66,2.91l-5.54,5A2,2,0,0,1,28.48,46.65Z"/><path class="cls-1" d="M44.35,28.27A2,2,0,0,1,43,27.76l-4.21-3.84L34.6,27.76A2,2,0,1,1,32,24.85l5.54-5.05a2,2,0,0,1,2.65,0l5.53,5.05a2,2,0,0,1,.13,2.78A1.93,1.93,0,0,1,44.35,28.27Z"/></svg>');
}

.icon-genre-casual:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><rect class="cls-1" x="0.14" y="10.03" width="17.11" height="17.11"/><rect class="cls-1" x="0.14" y="29.82" width="17.11" height="17.11"/><rect class="cls-1" x="19.93" y="29.82" width="17.11" height="17.11"/><rect class="cls-1" x="39.72" y="29.82" width="17.11" height="17.11"/></svg>');
}

.icon-genre-casual.is_active:before,
.icon-genre-casual:not(.icon-no-hover):focus:before,
.icon-genre-casual:not(.icon-no-hover):hover:before,
.icon-genre-casual:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><rect class="cls-1" x="0.14" y="10.03" width="17.11" height="17.11"/><rect class="cls-1" x="0.14" y="29.82" width="17.11" height="17.11"/><rect class="cls-1" x="19.93" y="29.82" width="17.11" height="17.11"/><rect class="cls-1" x="39.72" y="29.82" width="17.11" height="17.11"/></svg>');
}

.icon-bell-gradient:before {
  background-image: url('../icons/notification_icon_gradient_mouseover.svg');
}

.icon-bell-gradient.is_active:before {
  background-image: url('../icons/notification_icon_gradient_active.svg');
}

@keyframes bellshake {
  0% {
    transform: rotate(0) translateX(-50%) translateY(-50%);
  }
  15% {
    transform: rotate(5deg) translateX(-50%) translateY(-50%);
  }
  30% {
    transform: rotate(-5deg) translateX(-50%) translateY(-50%);
  }
  45% {
    transform: rotate(4deg) translateX(-50%) translateY(-50%);
  }
  60% {
    transform: rotate(-4deg) translateX(-50%) translateY(-50%);
  }
  75% {
    transform: rotate(2deg) translateX(-50%) translateY(-50%);
  }
  85% {
    transform: rotate(-2deg) translateX(-50%) translateY(-50%);
  }
  92% {
    transform: rotate(1deg) translateX(-50%) translateY(-50%);
  }
  100% {
    transform: rotate(0) translateX(-50%) translateY(-50%);
  }
}

.icon-bell-gradient:not(.icon-no-hover):hover:before {
  animation: bellshake 0.5s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
  backface-visibility: hidden;
  transform-origin: center center;
}

.icon-blog:before {
  background-image: url('../icons/blog_icon_grey.svg');  
}

.icon-blog.icon-white:before {
  background-image: url('../icons/blog_icon_white.svg');  
}

.icon-blog.is_active:before,
.icon-blog:not(.icon-no-hover):focus:before,
.icon-blog:not(.icon-no-hover):hover:before,
.icon-blog:not(.icon-no-hover):active:before {
  background-image: url('../icons/blog_icon_blue.svg');  
}

.icon-genre-indie:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M43.24,15H13.36A13.48,13.48,0,1,0,24.08,37a3,3,0,0,1,2.3-1.1h4.19A3,3,0,0,1,32.89,37a13.47,13.47,0,0,0,23.94-8.46A13.61,13.61,0,0,0,43.24,15ZM20.4,29.36H14.82v5.58H11.43V29.36H6.11V26h5.32V20.65h3.39V26H20.4ZM38.82,30A2.23,2.23,0,1,1,41,27.8,2.23,2.23,0,0,1,38.82,30Zm4.92,4.92A2.22,2.22,0,1,1,46,32.72,2.22,2.22,0,0,1,43.74,34.94Zm0-9.84A2.23,2.23,0,1,1,46,22.88,2.22,2.22,0,0,1,43.74,25.1ZM48.66,30a2.23,2.23,0,1,1,2.22-2.22A2.22,2.22,0,0,1,48.66,30Z"/></svg>');
}

.icon-genre-indie.is_active:before,
.icon-genre-indie:not(.icon-no-hover):focus:before,
.icon-genre-indie:not(.icon-no-hover):hover:before,
.icon-genre-indie:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M43.24,15H13.36A13.48,13.48,0,1,0,24.08,37a3,3,0,0,1,2.3-1.1h4.19A3,3,0,0,1,32.89,37a13.47,13.47,0,0,0,23.94-8.46A13.61,13.61,0,0,0,43.24,15ZM20.4,29.36H14.82v5.58H11.43V29.36H6.11V26h5.32V20.65h3.39V26H20.4ZM38.82,30A2.23,2.23,0,1,1,41,27.8,2.23,2.23,0,0,1,38.82,30Zm4.92,4.92A2.22,2.22,0,1,1,46,32.72,2.22,2.22,0,0,1,43.74,34.94Zm0-9.84A2.23,2.23,0,1,1,46,22.88,2.22,2.22,0,0,1,43.74,25.1ZM48.66,30a2.23,2.23,0,1,1,2.22-2.22A2.22,2.22,0,0,1,48.66,30Z"/></svg>');
}

.icon-genre-mmo:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M53.6,25.08a3.22,3.22,0,0,0-3.21,3l-7.1.38A8.17,8.17,0,0,0,38.88,22l2.87-6.42a4.83,4.83,0,1,0-3.25-4.8l-10.83.41A3.74,3.74,0,1,0,21,14.07L12.36,23.5a7.48,7.48,0,1,0-2.11,12.79l3.67,8.35a3.34,3.34,0,1,0,4.55.83L29.54,35.14a8.13,8.13,0,0,0,13.79-5.85v0l7.1-.38a3.23,3.23,0,1,0,3.17-3.81ZM15.08,28.87A7.45,7.45,0,0,0,13,24.07l8.62-9.41a3.71,3.71,0,0,0,2.38.86,3.82,3.82,0,0,0,1.66-.38l4.83,7.53a8.12,8.12,0,0,0-3.39,6.2ZM38.13,21.7a8.17,8.17,0,0,0-2.94-.55,8.08,8.08,0,0,0-4,1.07l-4.83-7.53a3.73,3.73,0,0,0,1.37-2.64l10.83-.41A4.86,4.86,0,0,0,41,15.27ZM11,36a7.48,7.48,0,0,0,4.07-6.26h12A8.09,8.09,0,0,0,29,34.53L17.9,44.86a3.34,3.34,0,0,0-2.14-.78,3.29,3.29,0,0,0-1.09.19Z"/></svg>');
}

.icon-genre-mmo.is_active:before,
.icon-genre-mmo:not(.icon-no-hover):focus:before,
.icon-genre-mmo:not(.icon-no-hover):hover:before,
.icon-genre-mmo:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M53.6,25.08a3.22,3.22,0,0,0-3.21,3l-7.1.38A8.17,8.17,0,0,0,38.88,22l2.87-6.42a4.83,4.83,0,1,0-3.25-4.8l-10.83.41A3.74,3.74,0,1,0,21,14.07L12.36,23.5a7.48,7.48,0,1,0-2.11,12.79l3.67,8.35a3.34,3.34,0,1,0,4.55.83L29.54,35.14a8.13,8.13,0,0,0,13.79-5.85v0l7.1-.38a3.23,3.23,0,1,0,3.17-3.81ZM15.08,28.87A7.45,7.45,0,0,0,13,24.07l8.62-9.41a3.71,3.71,0,0,0,2.38.86,3.82,3.82,0,0,0,1.66-.38l4.83,7.53a8.12,8.12,0,0,0-3.39,6.2ZM38.13,21.7a8.17,8.17,0,0,0-2.94-.55,8.08,8.08,0,0,0-4,1.07l-4.83-7.53a3.73,3.73,0,0,0,1.37-2.64l10.83-.41A4.86,4.86,0,0,0,41,15.27ZM11,36a7.48,7.48,0,0,0,4.07-6.26h12A8.09,8.09,0,0,0,29,34.53L17.9,44.86a3.34,3.34,0,0,0-2.14-.78,3.29,3.29,0,0,0-1.09.19Z"/></svg>');
}

.icon-genre-racing:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M28.48.14A28.35,28.35,0,1,0,56.83,28.48,28.34,28.34,0,0,0,28.48.14ZM5.31,26a23.31,23.31,0,0,1,46.34,0Zm.4,7.49H12A12.55,12.55,0,0,1,24.49,46v5.44A23.37,23.37,0,0,1,5.71,33.45ZM32,51.53V46A12.54,12.54,0,0,1,44.52,33.45h6.73A23.37,23.37,0,0,1,32,51.53Z"/></svg>');
}

.icon-genre-racing.is_active:before,
.icon-genre-racing:not(.icon-no-hover):focus:before,
.icon-genre-racing:not(.icon-no-hover):hover:before,
.icon-genre-racing:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M28.48.14A28.35,28.35,0,1,0,56.83,28.48,28.34,28.34,0,0,0,28.48.14ZM5.31,26a23.31,23.31,0,0,1,46.34,0Zm.4,7.49H12A12.55,12.55,0,0,1,24.49,46v5.44A23.37,23.37,0,0,1,5.71,33.45ZM32,51.53V46A12.54,12.54,0,0,1,44.52,33.45h6.73A23.37,23.37,0,0,1,32,51.53Z"/></svg>');
}

.icon-genre-roleplaying:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><polygon class="cls-1" points="12.28 27.65 8.88 28.54 28.43 48.08 29.32 44.69 22.94 34.03 12.28 27.65"/><path class="cls-1" d="M8.26,43.54a6.79,6.79,0,0,1,3.34,1.83,6.66,6.66,0,0,1,1.82,3.34l7-6.21-6-6Z"/><path class="cls-1" d="M3.19,46.55a5.11,5.11,0,1,0,7.22,0A5.12,5.12,0,0,0,3.19,46.55Z"/><path class="cls-1" d="M45.72,4,21,31l2.82,1.62.39.23.23.39L26,36,52.94,11.25,55.27,1.7Zm-3.8,11.91L26.4,31.46a.63.63,0,1,1-.89-.89L41,15.05a.63.63,0,0,1,.89.89Z"/></svg>');
}

.icon-genre-roleplaying.is_active:before,
.icon-genre-roleplaying:not(.icon-no-hover):focus:before,
.icon-genre-roleplaying:not(.icon-no-hover):hover:before,
.icon-genre-roleplaying:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><polygon class="cls-1" points="12.28 27.65 8.88 28.54 28.43 48.08 29.32 44.69 22.94 34.03 12.28 27.65"/><path class="cls-1" d="M8.26,43.54a6.79,6.79,0,0,1,3.34,1.83,6.66,6.66,0,0,1,1.82,3.34l7-6.21-6-6Z"/><path class="cls-1" d="M3.19,46.55a5.11,5.11,0,1,0,7.22,0A5.12,5.12,0,0,0,3.19,46.55Z"/><path class="cls-1" d="M45.72,4,21,31l2.82,1.62.39.23.23.39L26,36,52.94,11.25,55.27,1.7Zm-3.8,11.91L26.4,31.46a.63.63,0,1,1-.89-.89L41,15.05a.63.63,0,0,1,.89.89Z"/></svg>');
}

.icon-genre-shooter:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M55.39,27.05H49.13A20.7,20.7,0,0,0,29.92,7.84V1.57a1.44,1.44,0,0,0-2.87,0V7.84A20.68,20.68,0,0,0,7.84,27.05H1.57a1.44,1.44,0,0,0,0,2.87H7.84A20.7,20.7,0,0,0,27.05,49.13v6.26a1.44,1.44,0,1,0,2.87,0V49.13A20.72,20.72,0,0,0,49.13,29.92h6.26a1.44,1.44,0,1,0,0-2.87Zm-14.3,14a17.76,17.76,0,0,1-11.17,5.16V40.09a1.44,1.44,0,1,0-2.87,0v6.16A17.81,17.81,0,0,1,10.72,29.92h6.16a1.44,1.44,0,1,0,0-2.87H10.72A17.81,17.81,0,0,1,27.05,10.72v6.16a1.44,1.44,0,1,0,2.87,0V10.72A17.81,17.81,0,0,1,46.25,27.05H40.09a1.44,1.44,0,1,0,0,2.87h6.16A17.76,17.76,0,0,1,41.09,41.09Z"/><circle class="cls-1" cx="28.48" cy="28.48" r="1.22"/></svg>');
}

.icon-genre-shooter.is_active:before,
.icon-genre-shooter:not(.icon-no-hover):focus:before,
.icon-genre-shooter:not(.icon-no-hover):hover:before,
.icon-genre-shooter:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M55.39,27.05H49.13A20.7,20.7,0,0,0,29.92,7.84V1.57a1.44,1.44,0,0,0-2.87,0V7.84A20.68,20.68,0,0,0,7.84,27.05H1.57a1.44,1.44,0,0,0,0,2.87H7.84A20.7,20.7,0,0,0,27.05,49.13v6.26a1.44,1.44,0,1,0,2.87,0V49.13A20.72,20.72,0,0,0,49.13,29.92h6.26a1.44,1.44,0,1,0,0-2.87Zm-14.3,14a17.76,17.76,0,0,1-11.17,5.16V40.09a1.44,1.44,0,1,0-2.87,0v6.16A17.81,17.81,0,0,1,10.72,29.92h6.16a1.44,1.44,0,1,0,0-2.87H10.72A17.81,17.81,0,0,1,27.05,10.72v6.16a1.44,1.44,0,1,0,2.87,0V10.72A17.81,17.81,0,0,1,46.25,27.05H40.09a1.44,1.44,0,1,0,0,2.87h6.16A17.76,17.76,0,0,1,41.09,41.09Z"/><circle class="cls-1" cx="28.48" cy="28.48" r="1.22"/></svg>');
}

.icon-genre-simulation:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><rect class="cls-1" x="49.61" y="11.61" width="7.22" height="13.59"/><rect class="cls-1" x="51.21" y="26.8" width="5.62" height="19.25"/><path class="cls-1" d="M44.1,50.86v1.91h-2V27.86H19.53V52.77H16.32V18H14.23V10.56H9.57V2H6.89v8.59H2.23V18H.14V55H56.83V47.65H51.21ZM1.74,22.7H6.28v4.54H1.74Zm0,7.75H6.28V35H1.74Zm0,7.75H6.28v4.54H1.74ZM13.28,52.77H3.19V48.23H13.28Zm1.44-10H10.18V38.2h4.54Zm0-7.75H10.18V30.45h4.54Zm0-7.75H10.18V22.7h4.54Zm13.81,3.21h4.54V35H28.53Zm0,7.75h4.54v4.54H28.53Zm-2.86,4.54H21.13V38.2h4.54Zm0-7.75H21.13V30.45h4.54ZM35.85,52.77H25.76V48.23H35.85Zm4.62-10H35.93V38.2h4.54Zm0-7.75H35.93V30.45h4.54Z"/><polygon class="cls-1" points="26.54 5.17 26.54 9.96 27.68 9.96 27.68 23.48 29.28 23.48 29.28 9.96 56.83 9.96 56.83 5.17 26.54 5.17"/></svg>');
}

.icon-genre-simulation.is_active:before,
.icon-genre-simulation:not(.icon-no-hover):focus:before,
.icon-genre-simulation:not(.icon-no-hover):hover:before,
.icon-genre-simulation:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><rect class="cls-1" x="49.61" y="11.61" width="7.22" height="13.59"/><rect class="cls-1" x="51.21" y="26.8" width="5.62" height="19.25"/><path class="cls-1" d="M44.1,50.86v1.91h-2V27.86H19.53V52.77H16.32V18H14.23V10.56H9.57V2H6.89v8.59H2.23V18H.14V55H56.83V47.65H51.21ZM1.74,22.7H6.28v4.54H1.74Zm0,7.75H6.28V35H1.74Zm0,7.75H6.28v4.54H1.74ZM13.28,52.77H3.19V48.23H13.28Zm1.44-10H10.18V38.2h4.54Zm0-7.75H10.18V30.45h4.54Zm0-7.75H10.18V22.7h4.54Zm13.81,3.21h4.54V35H28.53Zm0,7.75h4.54v4.54H28.53Zm-2.86,4.54H21.13V38.2h4.54Zm0-7.75H21.13V30.45h4.54ZM35.85,52.77H25.76V48.23H35.85Zm4.62-10H35.93V38.2h4.54Zm0-7.75H35.93V30.45h4.54Z"/><polygon class="cls-1" points="26.54 5.17 26.54 9.96 27.68 9.96 27.68 23.48 29.28 23.48 29.28 9.96 56.83 9.96 56.83 5.17 26.54 5.17"/></svg>');
}

.icon-genre-sport:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M1.57,24.36a6.66,6.66,0,0,0,0,8.25,34.13,34.13,0,0,0,9.5,8.26V16.09A34.31,34.31,0,0,0,1.57,24.36Z"/><path class="cls-1" d="M55.39,24.36a34.16,34.16,0,0,0-9.5-8.27V40.87a34,34,0,0,0,9.5-8.26A6.63,6.63,0,0,0,55.39,24.36Z"/><path class="cls-1" d="M14.81,14.23v28.5A34.8,34.8,0,0,0,28.48,45.4a34.81,34.81,0,0,0,13.68-2.67V14.23a34.82,34.82,0,0,0-13.68-2.66A34.8,34.8,0,0,0,14.81,14.23Zm15,10.9a1.23,1.23,0,0,1,2.45,0v2.13H35V25.13a1.23,1.23,0,0,1,2.45,0v2.13H38a1.23,1.23,0,0,1,0,2.45h-.6v2.12a1.23,1.23,0,1,1-2.45,0V29.71H32.28v2.12a1.23,1.23,0,1,1-2.45,0V29.71H27.14v2.12a1.23,1.23,0,0,1-1.23,1.23h0a1.23,1.23,0,0,1-1.22-1.23V29.71H22v2.12a1.23,1.23,0,1,1-2.45,0V29.71H19a1.23,1.23,0,0,1,0-2.45h.6V25.13a1.23,1.23,0,0,1,2.45,0v2.13h2.69V25.13a1.22,1.22,0,0,1,1.22-1.22h0a1.23,1.23,0,0,1,1.23,1.22v2.13h2.69Z"/></svg>');
}

.icon-genre-sport.is_active:before,
.icon-genre-sport:not(.icon-no-hover):focus:before,
.icon-genre-sport:not(.icon-no-hover):hover:before,
.icon-genre-sport:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M1.57,24.36a6.66,6.66,0,0,0,0,8.25,34.13,34.13,0,0,0,9.5,8.26V16.09A34.31,34.31,0,0,0,1.57,24.36Z"/><path class="cls-1" d="M55.39,24.36a34.16,34.16,0,0,0-9.5-8.27V40.87a34,34,0,0,0,9.5-8.26A6.63,6.63,0,0,0,55.39,24.36Z"/><path class="cls-1" d="M14.81,14.23v28.5A34.8,34.8,0,0,0,28.48,45.4a34.81,34.81,0,0,0,13.68-2.67V14.23a34.82,34.82,0,0,0-13.68-2.66A34.8,34.8,0,0,0,14.81,14.23Zm15,10.9a1.23,1.23,0,0,1,2.45,0v2.13H35V25.13a1.23,1.23,0,0,1,2.45,0v2.13H38a1.23,1.23,0,0,1,0,2.45h-.6v2.12a1.23,1.23,0,1,1-2.45,0V29.71H32.28v2.12a1.23,1.23,0,1,1-2.45,0V29.71H27.14v2.12a1.23,1.23,0,0,1-1.23,1.23h0a1.23,1.23,0,0,1-1.22-1.23V29.71H22v2.12a1.23,1.23,0,1,1-2.45,0V29.71H19a1.23,1.23,0,0,1,0-2.45h.6V25.13a1.23,1.23,0,0,1,2.45,0v2.13h2.69V25.13a1.22,1.22,0,0,1,1.22-1.22h0a1.23,1.23,0,0,1,1.23,1.22v2.13h2.69Z"/></svg>');
}

.icon-genre-strategy:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M39.93,44c-2-5.73-4.4-11.64-5.23-17.65l-.35-2.54H22.61l-.35,2.54C21.44,32.34,19,38.25,17,44L17,47H40Z"/><rect class="cls-1" x="12.7" y="48.99" width="31.56" height="7.84" rx="1.11"/><path class="cls-1" d="M38.18,17.7h-2l1.46-4.55A3.52,3.52,0,0,0,35.42,8.7L35,8.6l-4.16-.73h-.38V6h1.89V2H30.46V.14H26.51V2H24.62V6h1.89V7.87h-.38l-4.42.9-.21.05a3.51,3.51,0,0,0-2.32,4.61l1.57,4.27h-2v3.92H38.18Z"/></svg>');
}

.icon-genre-strategy.is_active:before,
.icon-genre-strategy:not(.icon-no-hover):focus:before,
.icon-genre-strategy:not(.icon-no-hover):hover:before,
.icon-genre-strategy:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M39.93,44c-2-5.73-4.4-11.64-5.23-17.65l-.35-2.54H22.61l-.35,2.54C21.44,32.34,19,38.25,17,44L17,47H40Z"/><rect class="cls-1" x="12.7" y="48.99" width="31.56" height="7.84" rx="1.11"/><path class="cls-1" d="M38.18,17.7h-2l1.46-4.55A3.52,3.52,0,0,0,35.42,8.7L35,8.6l-4.16-.73h-.38V6h1.89V2H30.46V.14H26.51V2H24.62V6h1.89V7.87h-.38l-4.42.9-.21.05a3.51,3.51,0,0,0-2.32,4.61l1.57,4.27h-2v3.92H38.18Z"/></svg>');
}

.icon-newsletter:before {
  background-image: url('../icons/newsletter_icon_grey.svg');  
}

.icon-newsletter.icon-white:before {
  background-image: url('../icons/newsletter_icon_white.svg');  
}

.icon-newsletter.is_active:before,
.icon-newsletter:not(.icon-no-hover):focus:before,
.icon-newsletter:not(.icon-no-hover):hover:before,
.icon-newsletter:not(.icon-no-hover):active:before {
  background-image: url('../icons/newsletter_icon_blue.svg');  
}

.icon-language:before {
  background-image: url('../icons/language_icon_grey.svg');  
}

.icon-language.is_active:before,
.icon-language:not(.icon-no-hover):focus:before,
.icon-language:not(.icon-no-hover):hover:before,
.icon-language:not(.icon-no-hover):active:before {
  background-image: url('../icons/language_icon_blue.svg');  
}

.icon-payment-mastercard:before {
  background-image: url('../icons/payment_mastercard_icon_grey.svg');  
}

.icon-payment-mastercard.is_active:before,
.icon-payment-mastercard:not(.icon-no-hover):focus:before,
.icon-payment-mastercard:not(.icon-no-hover):hover:before,
.icon-payment-mastercard:not(.icon-no-hover):active:before {
  background-image: url('../icons/payment_mastercard_icon_blue.svg');  
}

.icon-payment-paypal:before {
  background-image: url('../icons/payment_paypal_icon_grey.svg');  
}

.icon-payment-paypal.is_active:before,
.icon-payment-paypal:not(.icon-no-hover):focus:before,
.icon-payment-paypal:not(.icon-no-hover):hover:before,
.icon-payment-paypal:not(.icon-no-hover):active:before {
  background-image: url('../icons/payment_paypal_icon_blue.svg');  
}

.icon-payment-paysafecard:before {
  background-image: url('../icons/payment_paysafecard_icon_grey.svg');  
}

.icon-payment-paysafecard.is_active:before,
.icon-payment-paysafecard:not(.icon-no-hover):focus:before,
.icon-payment-paysafecard:not(.icon-no-hover):hover:before,
.icon-payment-paysafecard:not(.icon-no-hover):active:before {
  background-image: url('../icons/payment_paysafecard_icon_blue.svg');  
}

.icon-payment-visa:before {
  background-image: url('../icons/payment_visa_icon_grey.svg');  
}

.icon-payment-visa.is_active:before,
.icon-payment-visa:not(.icon-no-hover):focus:before,
.icon-payment-visa:not(.icon-no-hover):hover:before,
.icon-payment-visa:not(.icon-no-hover):active:before {
  background-image: url('../icons/payment_visa_icon_blue.svg');  
}

.icon-platform:before {
  background-image: var(--data-icon), var(--data-icon-hover);
  background-size: 100% !important;
  background-position: center center, -1000px -1000px !important;
}

.icon-platform:not(.icon-no-hover):hover:before,
.icon-platform.is_active:before {
  background-position: -1000px -1000px, center center !important;
}

.icon-platform-origin:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M28.42.53c.12.29-.08.57-.25.8a13.82,13.82,0,0,0-2.43,5.45c-.14.4-.11.7,0,.74a24.17,24.17,0,0,1,7,.3,21.11,21.11,0,0,1,15,29.33,43.8,43.8,0,0,1-18.29,19.6.65.65,0,0,1-.8-.13.73.73,0,0,1,.09-.89,13.87,13.87,0,0,0,2.22-5,3.59,3.59,0,0,0,.15-1.13c-.13-.17-.34-.11-.53-.11A21.14,21.14,0,0,1,10,18.19a43.68,43.68,0,0,1,17.5-18,.62.62,0,0,1,.88.32Zm-1.1,19.79a8.29,8.29,0,0,0-5.69,3.57,8.29,8.29,0,0,0,.86,10.25,8.22,8.22,0,0,0,10.43,1.28,8.13,8.13,0,0,0,3.44-4.53,8.25,8.25,0,0,0-9-10.57Z"/></svg>');
}

.icon-platform-origin.is_active:before,
.icon-platform-origin:not(.icon-no-hover):focus:before,
.icon-platform-origin:not(.icon-no-hover):hover:before,
.icon-platform-origin:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M28.42.53c.12.29-.08.57-.25.8a13.82,13.82,0,0,0-2.43,5.45c-.14.4-.11.7,0,.74a24.17,24.17,0,0,1,7,.3,21.11,21.11,0,0,1,15,29.33,43.8,43.8,0,0,1-18.29,19.6.65.65,0,0,1-.8-.13.73.73,0,0,1,.09-.89,13.87,13.87,0,0,0,2.22-5,3.59,3.59,0,0,0,.15-1.13c-.13-.17-.34-.11-.53-.11A21.14,21.14,0,0,1,10,18.19a43.68,43.68,0,0,1,17.5-18,.62.62,0,0,1,.88.32Zm-1.1,19.79a8.29,8.29,0,0,0-5.69,3.57,8.29,8.29,0,0,0,.86,10.25,8.22,8.22,0,0,0,10.43,1.28,8.13,8.13,0,0,0,3.44-4.53,8.25,8.25,0,0,0-9-10.57Z"/></svg>');
}

.icon-platform-psn:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path id="logo" class="cls-1" d="M34.12,15.84a11.21,11.21,0,0,1,.11,2.32c0,4.27,0,8.54,0,12.83A9.67,9.67,0,0,0,38.36,32a5.74,5.74,0,0,0,2.73-.64,5.55,5.55,0,0,0,2.09-2,8.85,8.85,0,0,0,1.14-3.1,17.37,17.37,0,0,0,.19-3.81,14.6,14.6,0,0,0-1.22-5.69,9.09,9.09,0,0,0-1.88-2.64A12.68,12.68,0,0,0,39,12.27a29.18,29.18,0,0,0-6.24-2.6c-1.36-.44-2.75-.85-4.13-1.26-2.41-.69-4.84-1.35-7.3-1.81V47.44l9.23,2.92V16a3,3,0,0,1,.55-1.86,1.14,1.14,0,0,1,1.08-.42,2.28,2.28,0,0,1,1.1.51A2.53,2.53,0,0,1,34.12,15.84ZM10,40l9.52-3.4a4.61,4.61,0,0,0,0-.64V31.26c-4,1.41-8,2.85-12,4.27-1,.35-2,.67-2.92,1.08a16.62,16.62,0,0,0-3.21,1.68,3.08,3.08,0,0,0-1,1.16A2,2,0,0,0,.27,41a3.42,3.42,0,0,0,1.15,1.43,9.26,9.26,0,0,0,3,1.4A30.2,30.2,0,0,0,14.5,45.35a32.76,32.76,0,0,0,5.05-.53c0-.27,0-.54,0-.8V40c-1.36.48-2.71,1-4.06,1.47a8.59,8.59,0,0,1-1.59.48,11.38,11.38,0,0,1-2.47.25,6.74,6.74,0,0,1-2.19-.35,1.14,1.14,0,0,1-.64-.52.59.59,0,0,1,.19-.62A3,3,0,0,1,10,40ZM55.92,37a8,8,0,0,0-2.81-1.52c-.57-.18-1.12-.41-1.69-.57a30.49,30.49,0,0,0-8.91-1.29c-.92,0-1.83.05-2.75.16a33.52,33.52,0,0,0-7.46,1.65v5.54l10-3.51a11.62,11.62,0,0,1,3.46-.53,6.23,6.23,0,0,1,2.22.36,1.08,1.08,0,0,1,.62.51.73.73,0,0,1-.32.75,6.56,6.56,0,0,1-1.85.83l-14,5c-.09,0-.06.14-.07.21v5.18L50.77,43.1a25.85,25.85,0,0,0,3-1.19,8.05,8.05,0,0,0,2.48-1.74,2.19,2.19,0,0,0,.59-1.49A2.49,2.49,0,0,0,55.92,37Z"/></svg>');
}

.icon-platform-psn.is_active:before,
.icon-platform-psn:not(.icon-no-hover):focus:before,
.icon-platform-psn:not(.icon-no-hover):hover:before,
.icon-platform-psn:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path id="logo" class="cls-1" d="M34.12,15.84a11.21,11.21,0,0,1,.11,2.32c0,4.27,0,8.54,0,12.83A9.67,9.67,0,0,0,38.36,32a5.74,5.74,0,0,0,2.73-.64,5.55,5.55,0,0,0,2.09-2,8.85,8.85,0,0,0,1.14-3.1,17.37,17.37,0,0,0,.19-3.81,14.6,14.6,0,0,0-1.22-5.69,9.09,9.09,0,0,0-1.88-2.64A12.68,12.68,0,0,0,39,12.27a29.18,29.18,0,0,0-6.24-2.6c-1.36-.44-2.75-.85-4.13-1.26-2.41-.69-4.84-1.35-7.3-1.81V47.44l9.23,2.92V16a3,3,0,0,1,.55-1.86,1.14,1.14,0,0,1,1.08-.42,2.28,2.28,0,0,1,1.1.51A2.53,2.53,0,0,1,34.12,15.84ZM10,40l9.52-3.4a4.61,4.61,0,0,0,0-.64V31.26c-4,1.41-8,2.85-12,4.27-1,.35-2,.67-2.92,1.08a16.62,16.62,0,0,0-3.21,1.68,3.08,3.08,0,0,0-1,1.16A2,2,0,0,0,.27,41a3.42,3.42,0,0,0,1.15,1.43,9.26,9.26,0,0,0,3,1.4A30.2,30.2,0,0,0,14.5,45.35a32.76,32.76,0,0,0,5.05-.53c0-.27,0-.54,0-.8V40c-1.36.48-2.71,1-4.06,1.47a8.59,8.59,0,0,1-1.59.48,11.38,11.38,0,0,1-2.47.25,6.74,6.74,0,0,1-2.19-.35,1.14,1.14,0,0,1-.64-.52.59.59,0,0,1,.19-.62A3,3,0,0,1,10,40ZM55.92,37a8,8,0,0,0-2.81-1.52c-.57-.18-1.12-.41-1.69-.57a30.49,30.49,0,0,0-8.91-1.29c-.92,0-1.83.05-2.75.16a33.52,33.52,0,0,0-7.46,1.65v5.54l10-3.51a11.62,11.62,0,0,1,3.46-.53,6.23,6.23,0,0,1,2.22.36,1.08,1.08,0,0,1,.62.51.73.73,0,0,1-.32.75,6.56,6.56,0,0,1-1.85.83l-14,5c-.09,0-.06.14-.07.21v5.18L50.77,43.1a25.85,25.85,0,0,0,3-1.19,8.05,8.05,0,0,0,2.48-1.74,2.19,2.19,0,0,0,.59-1.49A2.49,2.49,0,0,0,55.92,37Z"/></svg>');
}

.icon-platform-steam:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><g id="Steam"><circle class="cls-1" cx="36.75" cy="22.57" r="5.91"/><path class="cls-1" d="M20.62,43.46a3.54,3.54,0,0,1-3.95-.5,1.18,1.18,0,0,0-1.55,1.77,5.9,5.9,0,1,0,4.72-10.27,1.16,1.16,0,0,0-1.32,1v0a1.18,1.18,0,0,0,1,1.33,3.54,3.54,0,0,1,1.11,6.68Z"/><path class="cls-1" d="M28.49.13A28.35,28.35,0,0,0,.14,27.3a1.14,1.14,0,0,0,.33.87,1.19,1.19,0,0,0,.61.31c.81.26,7.09,3,10.75,4.72A1.19,1.19,0,0,0,13.06,33a9.11,9.11,0,0,1,6.76-2.2,1.16,1.16,0,0,0,1.06-.45l5-6.52a1.16,1.16,0,0,0,.24-.82v-.52A10.63,10.63,0,1,1,37.46,33.2a1.23,1.23,0,0,0-.66.26L28.89,40a1.18,1.18,0,0,0-.43.85A9.44,9.44,0,0,1,19,49.74,9.29,9.29,0,0,1,10,42.82a1.24,1.24,0,0,0-.62-.76L4.86,39.87a1.18,1.18,0,0,0-1.59.51,1.17,1.17,0,0,0,0,1.09A28.35,28.35,0,1,0,28.49.13Z"/></g></svg>');
}

.icon-platform-steam.is_active:before,
.icon-platform-steam:not(.icon-no-hover):focus:before,
.icon-platform-steam:not(.icon-no-hover):hover:before,
.icon-platform-steam:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><g id="Steam"><circle class="cls-1" cx="36.75" cy="22.57" r="5.91"/><path class="cls-1" d="M20.62,43.46a3.54,3.54,0,0,1-3.95-.5,1.18,1.18,0,0,0-1.55,1.77,5.9,5.9,0,1,0,4.72-10.27,1.16,1.16,0,0,0-1.32,1v0a1.18,1.18,0,0,0,1,1.33,3.54,3.54,0,0,1,1.11,6.68Z"/><path class="cls-1" d="M28.49.13A28.35,28.35,0,0,0,.14,27.3a1.14,1.14,0,0,0,.33.87,1.19,1.19,0,0,0,.61.31c.81.26,7.09,3,10.75,4.72A1.19,1.19,0,0,0,13.06,33a9.11,9.11,0,0,1,6.76-2.2,1.16,1.16,0,0,0,1.06-.45l5-6.52a1.16,1.16,0,0,0,.24-.82v-.52A10.63,10.63,0,1,1,37.46,33.2a1.23,1.23,0,0,0-.66.26L28.89,40a1.18,1.18,0,0,0-.43.85A9.44,9.44,0,0,1,19,49.74,9.29,9.29,0,0,1,10,42.82a1.24,1.24,0,0,0-.62-.76L4.86,39.87a1.18,1.18,0,0,0-1.59.51,1.17,1.17,0,0,0,0,1.09A28.35,28.35,0,1,0,28.49.13Z"/></g></svg>');
}

.icon-platform-uplay:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M55.27,24.87C53.51,10.19,42.17,3.94,37,1.82A19.67,19.67,0,0,0,32.73.6C12.41-2.78,3,13.45,1.79,15.69a.29.29,0,0,0,.11.4l2,1.21a.3.3,0,0,1,.12.38c-7.82,17.14,2.78,29,7,32.8a19.18,19.18,0,0,0,2.8,2.08C32,63.45,46.34,50.08,46.34,50.08a27,27,0,0,0,8.93-25.21ZM9.78,27.8c-2.24,4.42-1.73,8.43-1.9,9.46s-.78.12-.86,0a0,0,0,0,0,0,0c-1.27-2.16-1-7.15-1-7.48v0C6.51,27.15,8,23.21,9.19,22s2.13-3.14,6.88-5.45a16.44,16.44,0,0,1,14.09,0c4.53,2,8,6.93,8.32,9,.31,1.84-.85.57-1.1.29a.31.31,0,0,1-.05-.1c-.06-.16-.5-.9-3.83-3.51a15.74,15.74,0,0,0-13.11-2.87A17,17,0,0,0,9.78,27.8ZM33.67,38.43c-5,5.42-10,1.46-10.14,1.3h0c-4.94-3.59-2.27-9.11-2.06-9.53l0-.05c3.32-4.33,6.74-3.81,8.51-3.09a5.57,5.57,0,0,1,1.93,1.35,6.2,6.2,0,0,1,.28,8.17.3.3,0,0,0,.06.42l1.36,1A.3.3,0,0,1,33.67,38.43Zm16.27-1.75s-5.5,16.84-23.37,15c0,0-11.79-1.72-13.75-14.19v0c-.08-.3-1.54-6.54,5.77-12.13h0c.08-.05.42-.23.27.43s-2.33,1.37-3.19,7.7,4.47,10.08,5.84,11,10,4.38,16.5-1.93A18.21,18.21,0,0,0,43.42,28.1v0c0-.36-.3-7.57-7.56-13.49s-16.32-4.19-16.62-4.13h0c-.19,0-3.87.61-9.47,4.27a1.07,1.07,0,0,0-.16.14.8.8,0,0,1-1,.27c-.6-.25-.48-.35.3-1.14S10,12.8,10.05,12.73l0,0c.28-.37,10.25-13.09,27.89-5a8.29,8.29,0,0,1,1.24.68c3.3,2.06,16.26,11.45,10.74,28.32Z"/></svg>');
}

.icon-platform-uplay.is_active:before,
.icon-platform-uplay:not(.icon-no-hover):focus:before,
.icon-platform-uplay:not(.icon-no-hover):hover:before,
.icon-platform-uplay:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M55.27,24.87C53.51,10.19,42.17,3.94,37,1.82A19.67,19.67,0,0,0,32.73.6C12.41-2.78,3,13.45,1.79,15.69a.29.29,0,0,0,.11.4l2,1.21a.3.3,0,0,1,.12.38c-7.82,17.14,2.78,29,7,32.8a19.18,19.18,0,0,0,2.8,2.08C32,63.45,46.34,50.08,46.34,50.08a27,27,0,0,0,8.93-25.21ZM9.78,27.8c-2.24,4.42-1.73,8.43-1.9,9.46s-.78.12-.86,0a0,0,0,0,0,0,0c-1.27-2.16-1-7.15-1-7.48v0C6.51,27.15,8,23.21,9.19,22s2.13-3.14,6.88-5.45a16.44,16.44,0,0,1,14.09,0c4.53,2,8,6.93,8.32,9,.31,1.84-.85.57-1.1.29a.31.31,0,0,1-.05-.1c-.06-.16-.5-.9-3.83-3.51a15.74,15.74,0,0,0-13.11-2.87A17,17,0,0,0,9.78,27.8ZM33.67,38.43c-5,5.42-10,1.46-10.14,1.3h0c-4.94-3.59-2.27-9.11-2.06-9.53l0-.05c3.32-4.33,6.74-3.81,8.51-3.09a5.57,5.57,0,0,1,1.93,1.35,6.2,6.2,0,0,1,.28,8.17.3.3,0,0,0,.06.42l1.36,1A.3.3,0,0,1,33.67,38.43Zm16.27-1.75s-5.5,16.84-23.37,15c0,0-11.79-1.72-13.75-14.19v0c-.08-.3-1.54-6.54,5.77-12.13h0c.08-.05.42-.23.27.43s-2.33,1.37-3.19,7.7,4.47,10.08,5.84,11,10,4.38,16.5-1.93A18.21,18.21,0,0,0,43.42,28.1v0c0-.36-.3-7.57-7.56-13.49s-16.32-4.19-16.62-4.13h0c-.19,0-3.87.61-9.47,4.27a1.07,1.07,0,0,0-.16.14.8.8,0,0,1-1,.27c-.6-.25-.48-.35.3-1.14S10,12.8,10.05,12.73l0,0c.28-.37,10.25-13.09,27.89-5a8.29,8.29,0,0,1,1.24.68c3.3,2.06,16.26,11.45,10.74,28.32Z"/></svg>');
}

.icon-platform-xbox:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path id="logo" class="cls-1" d="M29.05.7a29.17,29.17,0,0,0-9.28,1.35,22.71,22.71,0,0,0-5,2c-.16.26,1.56,1,3.82,1.59A34.4,34.4,0,0,1,25.4,8.32c3.31,2,3.19,1.95,5.77.36,3-1.83,10.35-4.08,12-3.67.76.18-.51-.58-2.82-1.72A27.33,27.33,0,0,0,29.05.7ZM46.92,7.08,44.5,8.39a36,36,0,0,0-5.76,4.36l-3.3,3,3.69,4.61C46.76,29.88,51,38,51.05,43.42l0,2.56L53,43.1c3-4.45,4-9,3.77-16-.19-5.26-.51-6.7-2.34-10.4a31,31,0,0,0-4.8-6.93L46.92,7.08ZM10.7,7.49A2.91,2.91,0,0,0,9,8.2C6.9,9.56,3.08,15.37,1.45,19.64-1.17,26.53.26,37.15,4.64,43.58c1.73,2.53,2.1,2.79,1.56,1-1.12-3.5,4.62-15,12.08-24.27L22,15.75l-3.49-3.11a39.86,39.86,0,0,0-5.71-4.3,5.27,5.27,0,0,0-2.12-.85ZM28.48,21.93,23.79,26c-8.35,7.21-16,17-16,20.45,0,2.6,7.51,7.42,14.24,9.14,7.18,1.82,17.24-.15,23.38-4.56,5.11-3.66,5.25-5,1.42-10.75C44.48,36.7,33.92,25.74,30.61,23.43l-2.13-1.5Z"/></svg>');
}

.icon-platform-xbox.is_active:before,
.icon-platform-xbox:not(.icon-no-hover):focus:before,
.icon-platform-xbox:not(.icon-no-hover):hover:before,
.icon-platform-xbox:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path id="logo" class="cls-1" d="M29.05.7a29.17,29.17,0,0,0-9.28,1.35,22.71,22.71,0,0,0-5,2c-.16.26,1.56,1,3.82,1.59A34.4,34.4,0,0,1,25.4,8.32c3.31,2,3.19,1.95,5.77.36,3-1.83,10.35-4.08,12-3.67.76.18-.51-.58-2.82-1.72A27.33,27.33,0,0,0,29.05.7ZM46.92,7.08,44.5,8.39a36,36,0,0,0-5.76,4.36l-3.3,3,3.69,4.61C46.76,29.88,51,38,51.05,43.42l0,2.56L53,43.1c3-4.45,4-9,3.77-16-.19-5.26-.51-6.7-2.34-10.4a31,31,0,0,0-4.8-6.93L46.92,7.08ZM10.7,7.49A2.91,2.91,0,0,0,9,8.2C6.9,9.56,3.08,15.37,1.45,19.64-1.17,26.53.26,37.15,4.64,43.58c1.73,2.53,2.1,2.79,1.56,1-1.12-3.5,4.62-15,12.08-24.27L22,15.75l-3.49-3.11a39.86,39.86,0,0,0-5.71-4.3,5.27,5.27,0,0,0-2.12-.85ZM28.48,21.93,23.79,26c-8.35,7.21-16,17-16,20.45,0,2.6,7.51,7.42,14.24,9.14,7.18,1.82,17.24-.15,23.38-4.56,5.11-3.66,5.25-5,1.42-10.75C44.48,36.7,33.92,25.74,30.61,23.43l-2.13-1.5Z"/></svg>');
}

.icon-platform-arenanet {
  width: 4.8rem !important;
}

.icon-platform-roblox {
  width: 8.4rem !important;
}

.icon-platform-call-of-duty-ii-beta {
  width: 8.4rem !important;
}

.icon-platform-fmredeem {
  width: 6rem !important;
  margin-right: 0.3rem !important;
}

.icon-search:before {
  background-image: url('../icons/search_icon_grey.svg');  
}

.icon-search.is_active:before,
.icon-search:not(.icon-no-hover):focus:before,
.icon-search:not(.icon-no-hover):hover:before,
.icon-search:not(.icon-no-hover):active:before {
  background-image: url('../icons/search_icon_blue.svg');  
}

.icon-support:before {
  background-image: url('../icons/support_icon_grey.svg');  
}

.icon-support.is_active:before,
.icon-support:not(.icon-no-hover):focus:before,
.icon-support:not(.icon-no-hover):hover:before,
.icon-support:not(.icon-no-hover):active:before {
  background-image: url('../icons/support_icon_blue.svg');  
}

.icon-yxp:before {
  background-image: url('../icons/yxp.svg');
}

.icon-yxp.is_active:before,
.icon-yxp:not(.icon-no-hover):focus:before,
.icon-yxp:not(.icon-no-hover):hover:before,
.icon-yxp:not(.icon-no-hover):active:before {
  background-image: url('../icons/yxp-blue.svg');
}

.icon-socialmedia-facebook:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M37.48,9.55h5.18v-9a65.23,65.23,0,0,0-7.54-.4c-7.46,0-12.58,4.69-12.58,13.32V21.4H14.31V31.47h8.23V56.83h10.1V31.48h7.9L41.8,21.4H32.64V14.46c0-2.92.78-4.91,4.84-4.91Z"/></svg>');
}

.icon-socialmedia-facebook.icon-white:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:white;}</style></defs><path class="cls-1" d="M37.48,9.55h5.18v-9a65.23,65.23,0,0,0-7.54-.4c-7.46,0-12.58,4.69-12.58,13.32V21.4H14.31V31.47h8.23V56.83h10.1V31.48h7.9L41.8,21.4H32.64V14.46c0-2.92.78-4.91,4.84-4.91Z"/></svg>');
}

.icon-socialmedia-facebook.icon-blue:before,
.icon-socialmedia-facebook.is_active:before,
.icon-socialmedia-facebook:not(.icon-no-hover):focus:before,
.icon-socialmedia-facebook:not(.icon-no-hover):hover:before,
.icon-socialmedia-facebook:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M37.48,9.55h5.18v-9a65.23,65.23,0,0,0-7.54-.4c-7.46,0-12.58,4.69-12.58,13.32V21.4H14.31V31.47h8.23V56.83h10.1V31.48h7.9L41.8,21.4H32.64V14.46c0-2.92.78-4.91,4.84-4.91Z"/></svg>');
}

.icon-socialmedia-twitter:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M56.83,10.9a24.2,24.2,0,0,1-6.7,1.84,11.6,11.6,0,0,0,5.12-6.42,23.32,23.32,0,0,1-7.37,2.81,11.62,11.62,0,0,0-20.11,7.95A12.09,12.09,0,0,0,28,19.73a32.9,32.9,0,0,1-24-12.16A11.62,11.62,0,0,0,7.66,23.1,11.39,11.39,0,0,1,2.4,21.67v.13a11.67,11.67,0,0,0,9.32,11.42,11.59,11.59,0,0,1-3.05.38,10,10,0,0,1-2.2-.2,11.72,11.72,0,0,0,10.86,8.1,23.4,23.4,0,0,1-14.41,5A21.09,21.09,0,0,1,.14,46.3,32.7,32.7,0,0,0,18,51.51c21.38,0,33.08-17.71,33.08-33.07,0-.51,0-1,0-1.5A23.1,23.1,0,0,0,56.83,10.9Z"/></svg>');
}

.icon-socialmedia-twitter.icon-white:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:white;}</style></defs><path class="cls-1" d="M56.83,10.9a24.2,24.2,0,0,1-6.7,1.84,11.6,11.6,0,0,0,5.12-6.42,23.32,23.32,0,0,1-7.37,2.81,11.62,11.62,0,0,0-20.11,7.95A12.09,12.09,0,0,0,28,19.73a32.9,32.9,0,0,1-24-12.16A11.62,11.62,0,0,0,7.66,23.1,11.39,11.39,0,0,1,2.4,21.67v.13a11.67,11.67,0,0,0,9.32,11.42,11.59,11.59,0,0,1-3.05.38,10,10,0,0,1-2.2-.2,11.72,11.72,0,0,0,10.86,8.1,23.4,23.4,0,0,1-14.41,5A21.09,21.09,0,0,1,.14,46.3,32.7,32.7,0,0,0,18,51.51c21.38,0,33.08-17.71,33.08-33.07,0-.51,0-1,0-1.5A23.1,23.1,0,0,0,56.83,10.9Z"/></svg>');
}

.icon-socialmedia-twitter.icon-blue:before,
.icon-socialmedia-twitter.is_active:before,
.icon-socialmedia-twitter:not(.icon-no-hover):focus:before,
.icon-socialmedia-twitter:not(.icon-no-hover):hover:before,
.icon-socialmedia-twitter:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M56.83,10.9a24.2,24.2,0,0,1-6.7,1.84,11.6,11.6,0,0,0,5.12-6.42,23.32,23.32,0,0,1-7.37,2.81,11.62,11.62,0,0,0-20.11,7.95A12.09,12.09,0,0,0,28,19.73a32.9,32.9,0,0,1-24-12.16A11.62,11.62,0,0,0,7.66,23.1,11.39,11.39,0,0,1,2.4,21.67v.13a11.67,11.67,0,0,0,9.32,11.42,11.59,11.59,0,0,1-3.05.38,10,10,0,0,1-2.2-.2,11.72,11.72,0,0,0,10.86,8.1,23.4,23.4,0,0,1-14.41,5A21.09,21.09,0,0,1,.14,46.3,32.7,32.7,0,0,0,18,51.51c21.38,0,33.08-17.71,33.08-33.07,0-.51,0-1,0-1.5A23.1,23.1,0,0,0,56.83,10.9Z"/></svg>');
}

.icon-socialmedia-tiktok:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="rgb(105,105,105)" d="m448,209.91a210.06,210.06 0 0 1 -122.77,-39.25l0,178.72a162.55,162.55 0 1 1 -140.23,-161.07l0,89.89a74.62,74.62 0 1 0 52.23,71.18l0,-349.38l88,0a121.18,121.18 0 0 0 1.86,22.17l0,0a122.18,122.18 0 0 0 53.91,80.22a121.43,121.43 0 0 0 67,20.14l0,87.38z"></path></svg>');
}

.icon-socialmedia-tiktok.icon-white:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="white" d="m448,209.91a210.06,210.06 0 0 1 -122.77,-39.25l0,178.72a162.55,162.55 0 1 1 -140.23,-161.07l0,89.89a74.62,74.62 0 1 0 52.23,71.18l0,-349.38l88,0a121.18,121.18 0 0 0 1.86,22.17l0,0a122.18,122.18 0 0 0 53.91,80.22a121.43,121.43 0 0 0 67,20.14l0,87.38z"></path></svg>');
}

.icon-socialmedia-tiktok.icon-blue:before,
.icon-socialmedia-tiktok.is_active:before,
.icon-socialmedia-tiktok:not(.icon-no-hover):focus:before,
.icon-socialmedia-tiktok:not(.icon-no-hover):hover:before,
.icon-socialmedia-tiktok:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="aqua" d="m448,209.91a210.06,210.06 0 0 1 -122.77,-39.25l0,178.72a162.55,162.55 0 1 1 -140.23,-161.07l0,89.89a74.62,74.62 0 1 0 52.23,71.18l0,-349.38l88,0a121.18,121.18 0 0 0 1.86,22.17l0,0a122.18,122.18 0 0 0 53.91,80.22a121.43,121.43 0 0 0 67,20.14l0,87.38z"></path></svg>');
}

.icon-socialmedia-instagram:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M39.94.14H17A16.9,16.9,0,0,0,.14,17V39.94A16.91,16.91,0,0,0,17,56.83H39.94A16.91,16.91,0,0,0,56.83,39.94V17A16.91,16.91,0,0,0,39.94.14Zm11.19,39.8A11.19,11.19,0,0,1,39.94,51.13H17A11.19,11.19,0,0,1,5.84,39.94V17A11.19,11.19,0,0,1,17,5.84H39.94A11.19,11.19,0,0,1,51.13,17V39.94Z"/><path class="cls-1" d="M28.48,13.82A14.67,14.67,0,1,0,43.15,28.48,14.68,14.68,0,0,0,28.48,13.82Zm0,23.62a9,9,0,1,1,9-9A9,9,0,0,1,28.48,37.44Z"/><circle class="cls-1" cx="43.17" cy="13.93" r="3.51"/></svg>');
}

.icon-socialmedia-instagram.icon-white:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:white;}</style></defs><path class="cls-1" d="M39.94.14H17A16.9,16.9,0,0,0,.14,17V39.94A16.91,16.91,0,0,0,17,56.83H39.94A16.91,16.91,0,0,0,56.83,39.94V17A16.91,16.91,0,0,0,39.94.14Zm11.19,39.8A11.19,11.19,0,0,1,39.94,51.13H17A11.19,11.19,0,0,1,5.84,39.94V17A11.19,11.19,0,0,1,17,5.84H39.94A11.19,11.19,0,0,1,51.13,17V39.94Z"/><path class="cls-1" d="M28.48,13.82A14.67,14.67,0,1,0,43.15,28.48,14.68,14.68,0,0,0,28.48,13.82Zm0,23.62a9,9,0,1,1,9-9A9,9,0,0,1,28.48,37.44Z"/><circle class="cls-1" cx="43.17" cy="13.93" r="3.51"/></svg>');
}

.icon-socialmedia-instagram.icon-blue:before,
.icon-socialmedia-instagram.is_active:before,
.icon-socialmedia-instagram:not(.icon-no-hover):focus:before,
.icon-socialmedia-instagram:not(.icon-no-hover):hover:before,
.icon-socialmedia-instagram:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M39.94.14H17A16.9,16.9,0,0,0,.14,17V39.94A16.91,16.91,0,0,0,17,56.83H39.94A16.91,16.91,0,0,0,56.83,39.94V17A16.91,16.91,0,0,0,39.94.14Zm11.19,39.8A11.19,11.19,0,0,1,39.94,51.13H17A11.19,11.19,0,0,1,5.84,39.94V17A11.19,11.19,0,0,1,17,5.84H39.94A11.19,11.19,0,0,1,51.13,17V39.94Z"/><path class="cls-1" d="M28.48,13.82A14.67,14.67,0,1,0,43.15,28.48,14.68,14.68,0,0,0,28.48,13.82Zm0,23.62a9,9,0,1,1,9-9A9,9,0,0,1,28.48,37.44Z"/><circle class="cls-1" cx="43.17" cy="13.93" r="3.51"/></svg>');
}

.icon-socialmedia-youtube:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M54.42,12.75c-1.54-2.73-3.21-3.24-6.6-3.43S35.88,9,28.49,9s-15.95.1-19.34.33S4.09,10,2.54,12.75.14,20.19.14,28.47h0c0,8.25.81,13,2.4,15.69s3.22,3.24,6.61,3.47S21.08,48,28.49,48s15.93-.12,19.33-.31,5.07-.73,6.6-3.46,2.41-7.45,2.41-15.7h0C56.83,20.19,56,15.48,54.42,12.75Zm-33,26.36V17.85L39.11,28.48Z"/></svg>');
}

.icon-socialmedia-youtube.icon-white:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:white;}</style></defs><path class="cls-1" d="M54.42,12.75c-1.54-2.73-3.21-3.24-6.6-3.43S35.88,9,28.49,9s-15.95.1-19.34.33S4.09,10,2.54,12.75.14,20.19.14,28.47h0c0,8.25.81,13,2.4,15.69s3.22,3.24,6.61,3.47S21.08,48,28.49,48s15.93-.12,19.33-.31,5.07-.73,6.6-3.46,2.41-7.45,2.41-15.7h0C56.83,20.19,56,15.48,54.42,12.75Zm-33,26.36V17.85L39.11,28.48Z"/></svg>');
}

.icon-socialmedia-youtube.icon-blue:before,
.icon-socialmedia-youtube.is_active:before,
.icon-socialmedia-youtube:not(.icon-no-hover):focus:before,
.icon-socialmedia-youtube:not(.icon-no-hover):hover:before,
.icon-socialmedia-youtube:not(.icon-no-hover):active:before {
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56.97 56.97"><defs><style>.cls-1{fill:aqua;}</style></defs><path class="cls-1" d="M54.42,12.75c-1.54-2.73-3.21-3.24-6.6-3.43S35.88,9,28.49,9s-15.95.1-19.34.33S4.09,10,2.54,12.75.14,20.19.14,28.47h0c0,8.25.81,13,2.4,15.69s3.22,3.24,6.61,3.47S21.08,48,28.49,48s15.93-.12,19.33-.31,5.07-.73,6.6-3.46,2.41-7.45,2.41-15.7h0C56.83,20.19,56,15.48,54.42,12.75Zm-33,26.36V17.85L39.11,28.48Z"/></svg>');
}

.icon-flags-en:before {
  background-image: url('../icons/flags/gb.svg');  
}

.icon-flags-es:before {
  background-image: url('../icons/flags/es.svg');  
}

.icon-flags-ru:before {
  background-image: url('../icons/flags/ru.svg');  
}

.icon-flags-se:before {
  background-image: url('../icons/flags/se.svg');  
}

.icon-flags-de:before {
  background-image: url('../icons/flags/de.svg');  
}

.icon-flags-pt:before {
  background-image: url('../icons/flags/pt.svg');  
}

.icon-flags-fr:before {
  background-image: url('../icons/flags/fr.svg');  
}

.icon-check:before {
  background-image: url('../icons/check_icon_blue.svg');
}

.icon-uncheck:before {
  background-image: url('../icons/check_icon_red.svg');
}

hr {
  width: 100%;
  border: initial;
  border-bottom: 1px solid var(--border-color);
}

a {
  color: var(--font-color-blue);
}

.socials {
  display: flex;
  align-items: center;
}

.socials > .icon {
  width: 3.2rem;
  height: 3.2rem;
  margin: 0 1rem; 
}

.socials > .icon:first-child {
  margin-left: 0; 
}

.socials > .icon:last-child {
  margin-right: 0; 
}

.socials > .icon:before {
  width: 100%;
  height: 100%;
}

.payments {
  display: flex;
  align-items: center;
}

.form-group {
  margin-bottom: 2rem;
  display: flex;
  align-items: start;
  flex-direction: column;
  position: relative;
}

.form-group.form-group-button-checkbox {
  margin-bottom: 1.8rem;
}

.form-group:last-child {
  margin-bottom: 0;
}

.form-group.form-group-end {
  align-items: flex-end;
}

.form-group.form-group-center {
  align-items: center;
}

.form-avatar-group {
  align-items: flex-end;
  position: relative;
  width: 100%;
}

.form-avatar-group:before {
  content: '';
  padding-bottom: 100%;
}

.form-avatar-group img {
  position: absolute;
  width: 100%;
  display: block;
  border: 1px solid var(--border-color);
}

.form-avatar-group .field-notification {
  margin-top: 1.6rem;
}

.form-avatar-group > label {
  position: absolute;
  --catalog-item-discount-label-top: -0.8rem;
  top: var(--catalog-item-discount-label-top);
  right: 4rem;
  width: 6.9rem;
  height: 6.9rem;
  background: var(--font-color-white);
  box-shadow: inset 0 0 20px 2px rgb(1 1 1 / 25%), 1px 2px 3px rgb(1 1 1 / 25%);
  padding: 1.2rem 0.6rem;
  font-size: 1.1rem !important;
  font-weight: 600;
  color: var(--font-color-medium) !important;
  line-height: 1.1;
}

.form-avatar-group > label:after {
  position: absolute;
  top: 0;
  right: calc(0.5*var(--catalog-item-discount-label-top));
  content: '';
  width: 0;
  height: 0;
  border-style: inset;
  border-width: calc(-1*var(--catalog-item-discount-label-top)) 0 0 calc(-0.5*var(--catalog-item-discount-label-top));
  border-color: grey;
  -webkit-transform: rotate(360deg);
}

.form-avatar-group > label > span {
  top: 1rem !important;
  bottom: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 5.9rem !important;
  height: 5.9rem !important;
  text-align: center;
  cursor: pointer;
}

.form-avatar-group > label > span:hover,
.form-avatar-group > label > span:active {
  color: var(--font-color-blue) !important;
}

.form-avatar-group > label > span:before {
  width: 2.8rem !important;
  height: 2.8rem !important;
  background-size: 2.8rem !important;
}

.form-group a {
  margin-left: 0.4rem;
  margin-right: 0.4rem;
  color: var(--font-color-light);
}

.form-group .icon {
  position: absolute;
  right: 0;
  bottom: 1rem;
  width: 2rem;
  height: 2rem;
}

.form-group .icon:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  background-size: 2rem;
  background-repeat: no-repeat;
  width: 2rem;
  height: 2rem;
}

.form-group > label {
  font-size: 1.7rem;
  color: var(--font-color-medium);
}

.field-error {
  margin: 0.5rem 0 0;
  text-transform: initial;
  font-size: 1.3rem;
}

.form-error,
.form-success,
.form-notification {
  margin: 0.5rem 0 1.6rem;
  text-transform: initial;
}

.form-error,
.field-error {
  color: red;
}

.form-error.form-error-checkout {
  margin-bottom: 6.4rem;
  border: 1px solid red;
  width: fit-content;
  padding: 2rem;
  color: red;
  margin-left: auto;
  margin-right: auto;
}

.form-success {
  color: var(--font-color-blue);
}

.form-notification {
  color: var(--font-color-light);
}

.field-notification {
  text-transform: initial;
  color: var(--font-color-medium);
  font-size: 1.3rem;
}

input[type="text"],
input[type="date"],
input[type="email"],
input[type="password"],
input[type="search"],
textarea {
  width: 100%;
  background: transparent;
  border: none;
  outline: none;
  border-bottom: 0.1rem solid var(--border-color);
  border-radius: unset;
  font-size: 1.7rem;
  color: var(--font-color-white);
  -webkit-appearance: none;
  padding: 1.6rem 0 0.7rem;
  height: 4.0rem;
}

textarea {
  border: 0.1rem solid var(--border-color);
  background-color: var(--background-color);
  padding: 0.8rem 1rem;
  resize: vertical;
}

input::placeholder,
textarea::placeholder {
  color: var(--font-color-medium);
}

input[type='text']:-internal-autofill-selected,
input[type='date']:-internal-autofill-selected,
input[type='email']:-internal-autofill-selected,
input[type='password']:-internal-autofill-selected,
input[type='search']:-internal-autofill-selected,
input:not([type]):-internal-autofill-selected {
  -webkit-text-fill-color: var(--font-color-white) !important;
  -webkit-box-shadow: unset !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  caret-color: auto;
}

input[type="text"].gradient-border:disabled,
input[type="date"].gradient-border:disabled,
input[type="email"].gradient-border:disabled,
input[type="password"].gradient-border:disabled,
input[type="search"].gradient-border:disabled,
textarea.gradient-border {
  border-image-source: none;
}

input[type="text"].gradient-border,
input[type="date"].gradient-border,
input[type="email"].gradient-border,
input[type="password"].gradient-border,
input[type="search"].gradient-border,
textarea.gradient-border {
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border-image-slice: 1;
  border-bottom-width: 0.1rem;
  box-sizing: border-box !important;
  border-width: 0px 0px 0.1rem 0px;
  border-image-source: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
}

input[type="date"]::before {
  content: attr(placeholder);
  position: absolute;
  color: var(--font-color-medium);
  z-index: 10;
}

input[type="date"]:valid {
  color: var(--font-color-white);
}

input[type="date"]:valid::before {
  content: "";
}

input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 1;
  background-image: url('data:image/svg+xml;charset=utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 610.398 610.398" style="enable-background:new 0 0 610.398 610.398;"><defs><style>.cls-1{fill:rgb(105,105,105);}</style></defs><path class="cls-1" d="M159.567,0h-15.329c-1.956,0-3.811,0.411-5.608,0.995c-8.979,2.912-15.616,12.498-15.616,23.997v10.552v27.009v14.052c0,2.611,0.435,5.078,1.066,7.44c2.702,10.146,10.653,17.552,20.158,17.552h15.329c11.724,0,21.224-11.188,21.224-24.992V62.553V35.544V24.992C180.791,11.188,171.291,0,159.567,0z"/><path class="cls-1" d="M461.288,0h-15.329c-11.724,0-21.224,11.188-21.224,24.992v10.552v27.009v14.052c0,13.804,9.5,24.992,21.224,24.992h15.329c11.724,0,21.224-11.188,21.224-24.992V62.553V35.544V24.992C482.507,11.188,473.007,0,461.288,0z"/><path class="cls-1" d="M539.586,62.553h-37.954v14.052c0,24.327-18.102,44.117-40.349,44.117h-15.329c-22.247,0-40.349-19.79-40.349-44.117V62.553H199.916v14.052c0,24.327-18.102,44.117-40.349,44.117h-15.329c-22.248,0-40.349-19.79-40.349-44.117V62.553H70.818c-21.066,0-38.15,16.017-38.15,35.764v476.318c0,19.784,17.083,35.764,38.15,35.764h468.763c21.085,0,38.149-15.984,38.149-35.764V98.322C577.735,78.575,560.671,62.553,539.586,62.553z M527.757,557.9l-446.502-0.172V173.717h446.502V557.9z"/></svg>');
  background-color: transparent;
  background-repeat: no-repeat;
  background-position-y: center;
  background-position-x: right;
  background-size: 2rem;
  width: 100%;
  height: 100%;
  cursor: pointer;
  margin: 0;
  padding: 0;
  z-index: 20;
}

input[type="date"]:valid::-webkit-calendar-picker-indicator {
  position: absolute;
  top: 0;
  left: 0;
  background-position-y: 1.7rem;
}

input[type='checkbox'],
input[type='radio'] {
  position: absolute;
  z-index: -1;
  opacity: 0;
}

input[type='checkbox'] + label,
input[type='radio'] + label {
  position: relative;
  display: inline-flex;
  align-items: center;
  user-select: none;
  cursor: pointer;
  font-size: 1.7rem;
  color: var(--font-color-dark);
  padding-left: 3.2rem;
  text-transform: initial;
}

.catalog-top-filter-content input[type='checkbox'] + label {
  padding: 0 !important;
}

input[type='checkbox'] + label.button-checkbox {
  border: 0.1rem solid var(--border-color);
  padding: 0.4rem 1.5rem 0;
  height: 3.6rem;
  min-width: 20rem;
  max-width: 100%;
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  justify-content: space-between;
  font-size: 1rem;
  color: var(--font-color-white);
}

@media (min-width: 1900px) {
  input[type='checkbox'] + label.button-checkbox {
    height: 4.8rem;
    font-size: 1.2rem;
  }
}

input[type='checkbox'] + label.button-checkbox span {
  width: 100%;
  text-transform: uppercase;
}

input[type='checkbox'] + label.button-checkbox:hover,
input[type='checkbox']:checked + label.button-checkbox {
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border: 10px solid;
  border-image-slice: 1;
  border-width: 0.1rem;
  border-image-source: linear-gradient(135deg, var(--start-background-color), var(--end-background-color));
}

input[type='checkbox'] + label:before,
input[type='radio'] + label:before {
  content: '';
  position: absolute;
  top: calc(50% - 0.1rem);
  transform: translateY(-50%);
  left: 0;
  width: 1.8rem;
  height: 1.8rem;
  flex-shrink: 0;
  flex-grow: 0;
  border: none;
  border-radius: 0;
  margin: 0 1.5rem 0 0;
  background-color: transparent;
  border: 0.1rem solid var(--border-color);
}

.catalog-top-filter-content input[type='checkbox'] + label:before {
  content: none !important;
}

input[type='checkbox'] + label.button-checkbox:before {
  position: relative;
  top: 0.1rem;
  right: initial;
  left: initial;
  display: block;
  margin: 0;
  order: 1;
  padding: 0;
}

input[type='checkbox'] + label:hover:before,
input[type='checkbox'] + label:active:before,
input[type='radio'] + label:hover:before,
input[type='radio'] + label:active:before {
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border: 10px solid;
  border-image-slice: 1;
  border-width: 0.1rem;
  border-image-source: linear-gradient(135deg, var(--start-background-color), var(--end-background-color));
}

input[type='checkbox']:checked + label:before,
input[type='radio']:checked + label:before {
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border: 10px solid;
  border-image-slice: 1;
  border-width: 0.1rem;
  border-image-source: linear-gradient(135deg, var(--start-background-color), var(--end-background-color));
  background-image: linear-gradient(135deg, var(--start-background-color), var(--end-background-color));
  box-shadow: inset 0 0 0 0.3rem var(--background-color-3);
}

input[type='checkbox'].switch + label {
  padding-left: 4.4rem;
  font-size: 1.3rem;
  line-height: 2rem;
}

input[type='checkbox'].switch + label.std_fontsize {
  font-size: 1.7rem;
}

input[type='checkbox'].switch + label:before {
  content: '';
  position: absolute;
  left: 0;
  width: 3.2rem;
  height: 1.8rem;
  border-radius: 0.8rem;
  background-color: transparent;
  border: 0.1rem solid var(--border-color);
  box-shadow: inset 0 0 1px 0px var(--border-color);
}

input[type='checkbox'].switch + label:after {
  content: '';
  position: absolute;
  top: calc(50% - 0.1rem);
  transform: translateY(-50%);
  left: 0.3rem;
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 0.6rem;
  background-color: var(--border-color);
}

input[type='checkbox'].switch + label:hover:before,
input[type='checkbox'].switch + label:active:before {
  border: 0.1rem solid var(--border-color);
  border-image-slice: initial;
  border-image-source: unset;
}

input[type='checkbox'].switch:checked + label:before {
  border: 0.1rem solid var(--border-color);
  border-image-slice: initial;
  border-image-source: unset;
  background-image: unset;
  box-shadow: inset 0 0 1px 0px var(--border-color);
}

input[type='checkbox'].switch:checked + label:after {
  left: 1.7rem;
  background-color: var(--border-color-blue);
}

.hidden-file-input {
  position: absolute;
  left: -99999rem;
}

.file-items {
  margin: 1.6rem 0 0;
  color: var(--font-color-medium);
}

.file-item {
  margin: 0 0 0.8rem;
  display: flex;
  position: relative;
  line-height: 1;
  align-items: center;
  align-content: center;
  justify-content: flex-start;
}

.file-item.file-item-error {
  color: red;
}

.file-item button.icon {
  position: relative;
  width: 1.2rem;
  height: 1.6rem;
  margin-top: 0.2rem;
  margin-right: 2.4rem;
  bottom: auto;
  top: auto;
  right: auto;
}

.file-item .icon-delete:before {
  background-image: url('../icons/close_icon_blue.svg');
  background-size: 1.2rem;
  width: 1.2rem;
  height: 1.2rem;
}

.file-item.file-item-error .icon-delete:before,
.file-item.file-item-error .icon-delete:hover:before,
.file-item.file-item-error .icon-delete:active:before {
  background-image: url('../icons/close_icon_red.svg');
}

.file-item > span:nth-of-type(1) {
  margin-right: 2.4rem;
}

.file-item.file-item-error > span:nth-of-type(1) {
  text-decoration: line-through;
}

.superselect {
  transform: translateX(-10000px) translateY(-10000px);
  position: absolute;
}

.superselect-container {
  position: relative;
}

.form-group.form-select-date {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.form-group.form-select-date > label,
.form-group.form-select-date > .annotation {
  flex: 1;
  width: 100%;
  min-width: 100%;
}

.form-group.form-select-date > .annotation {

}

.form-group > .superselect-container.form-select {
  width: 100%;
}

.form-group.form-select-date > .superselect-container.form-select:nth-of-type(1) {
  width: 10rem;
  max-width: 10rem;
}

.form-group.form-select-date > .superselect-container.form-select:nth-of-type(2) {
  width: 15rem;
  max-width: 15rem;
}

.form-group.form-select-date > .superselect-container.form-select:nth-of-type(3) {
  width: 8rem;
  max-width: 8rem;
}

.form-group.form-select-date > .superselect-container.form-select:last-of-type {
  margin-right: 0;
}

.superselect-label {
  cursor: pointer;  
}

.superselect-label,
.superselect-option {
  padding-left: 1.2rem;
  padding-right: 4rem;
}

.superselect-label,
.superselect-option,
.superselect-option > a {
  display: flex;
  align-items: center;
  width: 100%;
  font-size: 2rem;
  line-height: 3.8rem;
  color: var(--font-color-medium);
  cursor: pointer;
}

.superselect-label {
  border: 0.1rem solid var(--border-color);
}

.superselect-label:before {
  content: '';
  position: absolute;
  right: 1.2rem;
  top: 0;
  width: 1.8rem;
  height: 100%;
  background-image: url('../icons/dropdown_down_icon_grey.svg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 5rem;
}

.superselect-container.is_active .superselect-label:before {
  background-image: url('../icons/dropdown_up_icon_grey.svg');
}

.superselect-options {
  position: absolute;
  width: 100%;
  left: 0;
  transform: translateX(-10000px) translateY(-10000px);
  border: 0.1rem solid var(--border-color);
  border-top: none;
  background: var(--background-color);
  display: flex;
  flex-direction: column;
  z-index: 20;
}

.superselect-container.is_active .superselect-options {
  transform: unset;
}

.superselect-option:hover,
.superselect-option:active {
  background-color: var(--background-color-2);
}

.superselect-container .icon {
  width: 2.7rem;
  height: 3.8rem;
  margin-right: 1.2rem;
}

.superselect-container .icon:before {
  width: 100%;
  height: 100%;
}

.superselect-container.form-select {
  margin-right: 4rem;
}

.superselect-container.form-select:last-child {
  margin-right: 0;
}

.superselect-container.form-select .superselect-label {
  padding: 0.2rem 4rem 0.2rem 0;
  background: transparent;
  border: none;
  outline: none;
  border-bottom: 0.1rem solid var(--border-color);  
}

.superselect-container.form-select .superselect-label:before {
  right: 0;
}

.superselect-container.form-select .superselect-options {
  border: none;
}

.superselect-container.form-select .superselect-label,
.superselect-container.form-select .superselect-option,
.superselect-container.form-select .superselect-option > a {
  display: flex;
  align-items: center;
  width: 100%;
  font-size: 1.7rem;
  font-weight: 400;
  line-height: 1.4;
  color: var(--font-color-medium);
  -webkit-appearance: none;  
}

.superselect-container.form-select .superselect-option {
  padding: 0.5rem 1.2rem;
}

.superselect-container.form-select .superselect-option:hover,
.superselect-container.form-select .superselect-option:active {
  background-color: var(--background-color-4);
}

.grecaptcha-badge { visibility: hidden; }

.button {
  display: inline-block;
  white-space: nowrap;
  background-color: var(--background-color-2);
  border: 0.1rem solid var(--border-color);
  color: var(--font-color-white); 
  padding: 0 2.6rem;
  height: 4.0rem;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 4.0rem;
}

.button[disabled] {
  opacity: 0.6;
  cursor: initial;
}

.button.full-width-button {
  width: 100%;
}

.button.icon {
  width: 4.0rem;
  height: 4.0rem;
}

.button.outline-button {
  background-color: transparent;
  border: 0.1rem solid var(--border-color);
  color: var(--font-color-white);
}

.button.outline-gradient-button {
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border: 10px solid;
  border-image-slice: 1;
  border-width: 0.1rem;
  border-image-source: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  color: var(--font-color-white);
}

.button:not(.icon):not(.hover-change-only-text):not([disabled]):not(.no-hover):hover,
.button.is_hover {
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);  
  background-image: linear-gradient(135deg, var(--start-background-color), var(--end-background-color) 77%);
}

.button:not(.hover-change-only-text):not([disabled]):not(.no-hover):hover,
.button.is_hover {
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);  
  border: 10px solid;
  border-image-slice: 1;
  border-width: 0.1rem;
  border-image-source: linear-gradient(135deg, var(--start-background-color), var(--end-background-color) 77%);
}

.button.hover-change-only-text:hover {
  color: var(--font-color-deep-blue);
}

@keyframes animated-as-hover-change-only-text {
  0% {background-position: 100%;}
  0% {background-position: 100%;}
}

.button.animated-as-hover-change-only-text {
  position: relative;
  display: inline-block;
  font-weight: 800;
  color: #FFFFFF;
  overflow: hidden;
  background: linear-gradient(to left, var(--font-color-deep-blue), var(--font-color-deep-blue) 50%, #FFFFFF 50%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-size: 200% 100%;
  background-position: 0;
  transition: background-position 200ms ease;
  text-decoration: none;
  animation: animated-as-hover-change-only-text 1s linear infinite;
}

.button.without-outline-button {
  background-color: transparent;
  border: none;
}

.button.small-button,
.button.extra-small-button {
  height: 2.8rem;
  line-height: 2.8rem;
  border-width: 0.1rem;
  font-size: 0.986842rem;
  padding: 0 1.184211rem;
}

.button.small-button.increased-padding {
  padding-left: 6.4rem;
  padding-right: 6.4rem;
}

.button.small-button.icon,
.button.extra-small-button.icon {
  width: 2.8rem;
  height: 2.8rem;
}

.button.border-top-none {
  border-top: none;
}

.button[disabled],
button[disabled] {
  border: 0.1rem solid var(--border-color);
  border-image-slice: initial;
}

.button.text-button {
  width: auto;
  height: auto;
  padding: 0;
  background: transparent;
  border: none;
  line-height: initial;
  border-bottom: 0.1rem solid var(--background-color-4);
  color: var(--font-color-blue);
}

.button.text-button:hover {
  background: none !important;
  border: none !important;
  border-bottom: 0.1rem solid var(--font-color-deep-blue) !important;
  color: var(--font-color-deep-blue) !important;
}

.button.no-cursor {
  cursor: auto;
}

.to-top-section {
  padding-top: 12.5rem !important;
  padding-bottom: 10rem !important;
  margin-bottom: 0 !important;
  background-color: var(--background-color-2);
  max-width: initial;
}

.to-top {
  width: auto !important;
  font-size: 2.5rem !important;
  color: var(--font-color-medium) !important;
  text-transform: uppercase;
  cursor: pointer;
  line-height: 1 !important;
  height: initial !important;
}

.to-top:before {
  background-size: 5.6rem;
  width: 100%;
  height: calc(100% + 1.6rem);
  top: -1.6rem;
}

.bottom-content-section {
  background-color: var(--background-color-2);
  max-width: initial;
  padding-top: 5.6rem;
}

.section.bottom-content-section {
  padding-bottom: 0;
}

.bottom-content-section .row div:not(.headline) {
  background-color: rgba(27,27,27,0.5);
  padding: 2.4rem 3.6rem;
  color: var(--font-color-light);
}

.bottom-content-section .row div:not(.headline) *:last-child {
  margin-bottom: 0;
}

.m-t-auto {
  margin-top: auto !important;
}

.m-t-0 {
  margin-top: 0 !important;
}

.m-t-0-8 {
  margin-top: 0.8rem !important;
}

.m-t-1-6 {
  margin-top: 1.6rem !important;  
}

.m-t-2-4 {
  margin-top: 2.4rem !important;  
}

.m-t-3-2 {
  margin-top: 3.2rem !important;  
}

.m-b-0 {
  margin-bottom: 0 !important;
}

.m-b-0-8 {
  margin-bottom: 0.8rem !important;
}

.m-b-1-6 {
  margin-bottom: 1.6rem !important;  
}

.m-b-2-4 {
  margin-bottom: 2.4rem !important;  
}

.m-b-3-2 {
  margin-bottom: 3.2rem !important;  
}

.m-l-0 {
  margin-left: 0 !important;
}

.m-l-0-8 {
  margin-left: 0.8rem !important;
}

.m-l-1-6 {
  margin-left: 1.6rem !important;  
}

.m-l-2-4 {
  margin-left: 2.4rem !important;  
}

.m-l-3-2 {
  margin-left: 3.2rem !important;  
}

.m-r-0 {
  margin-right: 0 !important;
}

.m-r-0-8 {
  margin-right: 0.8rem !important;
}

.m-r-1-6 {
  margin-right: 1.6rem !important;  
}

.m-r-2-4 {
  margin-right: 2.4rem !important;  
}

.m-r-3-2 {
  margin-right: 3.2rem !important;  
}

.p-t-0 {
  padding-top: 0 !important;
}

.p-t-0-8 {
  padding-top: 0.8rem !important;
}

.p-t-1-6 {
  padding-top: 1.6rem !important;  
}

.p-t-2-4 {
  padding-top: 2.4rem !important;  
}

.p-t-3-2 {
  padding-top: 3.2rem !important;  
}

.p-b-0 {
  padding-bottom: 0 !important;
}

.p-b-0-8 {
  padding-bottom: 0.8rem !important;
}

.p-b-1-6 {
  padding-bottom: 1.6rem !important;  
}

.p-b-2-4 {
  padding-bottom: 2.4rem !important;  
}

.p-b-3-2 {
  padding-bottom: 3.2rem !important;  
}

.p-l-0 {
  padding-left: 0 !important;
}

.p-l-0-8 {
  padding-left: 0.8rem !important;
}

.p-l-1-6 {
  padding-left: 1.6rem !important;  
}

.p-l-2-4 {
  padding-left: 2.4rem !important;  
}

.p-l-3-2 {
  padding-left: 3.2rem !important;  
}

.p-r-0 {
  padding-right: 0 !important;
}

.p-r-0-8 {
  padding-right: 0.8rem !important;
}

.p-r-1-6 {
  padding-right: 1.6rem !important;  
}

.p-r-2-4 {
  padding-right: 2.4rem !important;  
}

.p-r-3-2 {
  padding-right: 3.2rem !important;  
}

.table {
  display: block;
  margin: 0 auto;
  width: 100%;
  overflow-x: scroll;
  scrollbar-width: none;
}

.table::-webkit-scrollbar {
  height: 0.8rem;
}

.table::-webkit-scrollbar-track {
  background-color: transparent;
}

.table::-webkit-scrollbar-thumb {
  background-color: var(--border-color);
  border-radius: 6px;
}

.tr {
  display: flex;
  flex-flow: row nowrap;
  border-bottom: solid 0.1rem var(--table-color);
  transition: 0.5s;
  min-width: 100.6rem;
}

.tr.empty,
.tr.header {
  border-bottom: none;
}

.table .tr:last-child {
  margin-bottom: 5.4rem;
}

.td {
  flex: 1 1 100%;
  width: 100%;
  text-align: left;
  padding: 1.38rem 1rem 1.38rem 0;
  font-size: 1.7rem;
  font-weight: normal;
  color: var(--font-color-white);
  line-height: 1.25;
  word-break: break-word;
}

.tr.header .td {
  padding-bottom: 2rem;
  font-weight: bold;
  color: var(--font-color-blue);
}

.tr.empty .td {
  width: 100%;
  flex: 1 1 100%;
  padding: 0;
}

.table-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 5.4rem;
}

.tr + .table-footer {
  margin-top: 5.4rem;
}

.table-footer > .pagination-container {
  margin: 0;
}

.table-footer > .pagination-container > .pagination-to-previous-page,
.table-footer > .pagination-container > .pagination-to-next-page {
  width: 2rem;
  height: 2rem;
}

.table-footer > .pagination-container > .pagination-information {
  font-size: 1.6rem;
}

@media all and (max-width: 767px) {
  .td.first {
    width: 100%;
  }
}

.gradient-separator {
  position: relative;
}

.gradient-separator:before {
  content: '';
  width: 190.3rem;
  height: 0.2rem;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url('../images/line.png');
  background-position: center center;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.gradient-separator-100:before {
  content: '';
  width: 100%;
  height: 0.2rem;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url('../images/line.png');
  background-position: center center;
  position: absolute;
  left: 50%;
  transform: translateX(-50%) translateY(-0.1rem);
}

.read-more-separator:before {
  content: '';
  width: 30%;
  height: 0.1rem;
  background-color: var(--border-color);
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.accordion-title {
  position: relative;
  cursor: pointer;
  padding-top: 0.2rem;
  padding-bottom: 1.2rem;
  padding-right: 2.2rem;
}

.accordion-title:before {
  content: '';
  position: absolute;
  right: 0;
  top: 0.2rem;
  width: 1.8rem;
  height: calc(100% - 1.4rem);
  background-image: url('../icons/dropdown_down_icon_grey.svg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 5rem;  
}

[data-state="expanded"] > .accordion-title:before {
  background-image: url('../icons/dropdown_up_icon_grey.svg');
}

.accordion-content {
  display: none !important;
}

[data-state="expanded"] > .accordion-content {
  display: flex !important;
}

.dropdown {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  -webkit-line-break: normal;
  position: relative;
}

.dropdown[data-state="expanded"] {
  -webkit-line-clamp: initial;
}

.dropdown + .dropdown-more-button {
  color: var(--font-color-blue);
  padding: 0;
  font-size: 90%;
}

.tooltip {
  background-image: url(../icons/help_icon_grey.svg);
  background-size: 1.6rem;
  width: 1.6rem;
  height: 1.6rem;
  position: absolute;
  top: -0.3rem;
  right: -2rem;
  cursor: pointer;
  font-size: initial;
}

.tooltip-content-container {
  display: none;
  z-index: 10000;
  width: 40rem;
  height: auto;
  padding: 1rem 0.8rem 1rem 1.6rem;
  background-color: var(--background-color-2);
  color: var(--font-color-light);
  font-weight: normal;
  position: absolute;
  top: 4rem;
  right: 0;
  border-radius: 4px;
}

.tooltip-content-container:before {
  content: '';
  position: absolute;
  right: 0.7rem;
  top: -2.4rem;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 2.4rem 1.6rem;
  border-color: transparent transparent var(--background-color-2) transparent;
}

.tooltip-content {
  height: 20rem;
  padding-right: 1.6rem;
  overflow-y: scroll;
  scrollbar-width: none;
  line-height: 1.6;
}

.tooltip-content-container.is_active {
  display: block;
}

.tooltip-content::-webkit-scrollbar {
  height: 0.8rem;
  width: 0.2rem;
  margin-right: -0.8rem;
}

.tooltip-content::-webkit-scrollbar-track {
  background-color: transparent;
}

.tooltip-content::-webkit-scrollbar-thumb {
  background-color: var(--border-color);
}

@media all and (max-width: 1199px) {
  .tooltip {
    display: none;
  }
}

.tabs {
  position: relative;
}

.tab {
  visibility: hidden;
  position: absolute;
  transform: translateX(-10000px);
  top: 0;
  left: 0;
  display: none !important;
}

.tab.is_active {
  visibility: visible;
  position: relative;
  transform: initial;
  display: inherit !important;
}

.tab-target {
  color: var(--font-color-medium);
  cursor: pointer;
}

.tab-target.is_active,
.tab-target:hover,
.tab-target:active {
  color: var(--font-color-blue);
}

.top-placement {
  background-color: var(--background-color-3);
}

.top-placement .message {
  font-size: 1.7rem;
  color: var(--font-color-blue);
  text-align: center;
  padding: 0.8rem 0 0.6rem;
}
  
.container {
  height: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: 2rem;
  padding-left: 2rem;
}

.row {
  box-sizing: border-box;
  margin-right: -2rem;
  margin-left: -2rem;
  -webkit-box-flex: 0;
  -webkit-box-direction: normal;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  flex: 0 1 auto;
  -webkit-flex: 0 1 auto;
  -ms-flex: 0 1 auto;
  -webkit-box-flex: 0;
  flex-direction: row;
  flex-direction: row;
  box-orient: horizontal;
  box-orient: horizontal;
  -webkit-flex-wrap: wrap;
  -moz-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-wrap: wrap;
}

.row.reverse {
  flex-direction: row-reverse;
  flex-direction: row-reverse;
  box-orient: horizontal;
  box-orient: horizontal;
  -webkit-box-direction: reverse;
}

.column {
  flex: 1;
}

.column,
[class*="column-"],
[class^='column-'] {
  margin: 0 2rem;
}

.column:first-child,
[class*="column-"]:first-child,
[class^='column-']:first-child {
  margin-left: 0;
}

.column:last-child,
[class*="column-"]:last-child,
[class^='column-']:last-child {
  margin-right: 0;
}

.column-25 {
  flex: initial;
  width: calc(25% - 3rem);
}

.column-50 {
  flex: initial;
  width: calc(50% - 2rem);
}

.column-75 {
  flex: initial;
  width: calc(75% - 1rem);
}

@media screen and (max-width: 767px) {
  .container {
    width: 100%;
  }

  .column,
  [class*="column-"],
  [class^='column-'] {
    flex: 0 1 100%;
    max-width: 100%;
  }
}

@media all and (min-width: 768px) {
  .container {
    width: calc(100% - 2rem);
  }

  .row {
    justify-content: space-between;
  }
}

@media all and (min-width: 992px) {
  .container {
    width: calc(100% - 2rem);
  }
}

@media all and (min-width: 1200px) {
  .container {
    width: calc(100% - 2rem)
  }

  input[type="text"],
  input[type="date"],
  input[type="email"],
  input[type="password"],
  input[type="search"],
  textarea {
    height: 4.8rem;
  }

  .button {
    height: 4.8rem;
    line-height: 4.8rem;
    font-size: 1.7rem;
    padding: 0 6rem;
  }

  .button.icon {
    width: 4.8rem;
    height: 4.8rem;
  }

  .button.small-button {
    height: 3.6rem;
    line-height: 3.6rem;
    font-size: 1.3rem;
    padding: 0 2.5rem;
  }

  .button.small-button.icon {
    width: 3.6rem;
    height: 3.6rem;
  }

  .button.extra-small-button {
    height: 2.8rem;
    line-height: 2.8rem;
    border-width: 0.1rem;
    font-size: 0.986842rem;
    padding: 0 1.184211rem;
  }

  .button.extra-small-button.icon {
    width: 2.8rem;
    height: 2.8rem;
  }
}

@media all and (min-width: 1440px) {
  .container {
    width: 1366px;
  }
}

@media all and (min-width: 1900px) {
  .container {
    width: 1720px;
  }

  .button.small-button {
    height: 4.8rem;
    line-height: 4.8rem;
    font-size: 1.7rem;
    padding: 0 3.5rem;
  }

  .button.small-button.icon {
    width: 4.8rem;
    height: 4.8rem;
  }

  .button.extra-small-button {
    height: 3.6rem;
    line-height: 3.6rem;
    font-size: 1.3rem;
    padding: 0 2.2rem;
  }

  .button.extra-small-button.icon {
    width: 3.6rem;
    height: 3.6rem;
  }
}

.popup-container,
.popup-background {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  display: block;
}

.popup-background {
  background: var(--background-color-2);
  opacity: 0.25;
}

.popup-icon-close {
  position: absolute;
  cursor: pointer;
  width: 1rem;
  height: 1rem;
  top: 1rem;
  right: 1rem;
  z-index: 2;
}

.popup-icon-close:before {
  background-image: url('../icons/close_icon_grey.svg');
  background-size: 1rem;
  width: 100%;
  height: 100%;
}

.popup-window.lootbox-notification-popup-window + .popup-icon-close:before {
  background-image: url('../icons/close_icon_white.svg');
  background-size: 1.6rem;
}

.popup-icon-close:hover:before,
.popup-icon-close:active:before {
  background-image: url('../icons/close_icon_blue.svg');
}

.popup-window {
  position: absolute;
  width: calc(100% - 2rem);
  min-height: 1rem;
  max-height: calc(100% - 4rem);
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border: 10px solid;
  border-image-slice: 1;
  border-width: 0.2rem;
  border-image-source: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  background: var(--background-color-2);
  padding: 2.4rem;
  z-index: 1010;
  overflow-y: auto;
}

header {
  z-index: 1000;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  position: static;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  color: transparent;
  padding-bottom: 0.2rem;
}

.nav-flex-container {
  width: 100%;
  background-color: var(--background-color-2);
}

.nav-flex {
  position: relative;
  display: flex;
  flex: 1 1 calc(100% - 4rem);
  max-width: calc(100% - 4rem);
  min-width: calc(100% - 4rem);
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  zoom: 1;
  height: 13.8rem;
  background-color: var(--background-color-2);
  margin: 0 auto;
}

.nav-flex * {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

.nav-logo, .nav-search, .nav-center-menu, .nav-yxp-menu, .nav-right-menu, .nav-menu {
  position: relative;
  display: flex;
  align-items: center;
  margin: 0;
  height: 6.9rem;
}

.burger-btn {
  position: relative;
  order: 1;
  margin-left: 2rem;
  width: 2.5rem;
  height: 100%;
  cursor: pointer;
}

.nav-logo {
  order: 1;
}

.nav-search {
  order: 4;
  max-width: calc(100% + 4rem);
  min-width: 27.8rem;
  flex: 1 1 100%;
  margin: 0 -2rem;
  padding: 0 2rem;
  height: 6.8rem;
  background-color: var(--background-color-3);
  justify-content: center;
}

.nav-center-menu {
  display: none;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  flex: 1 1 auto;
}

.nav-yxp-menu {
  order: 3;
  margin: 0 auto;
  flex: 1 1 auto;
  display: none;
}

.nav-right-menu {
  order: 3;
}

.nav-menu {
  display: none;
  order: 4;
  min-width: 100%;
  flex: 1 1 100%;
  height: 6.8rem;
  background-color: var(--background-color);
  justify-content: center;
}

.burger-btn > div:not(.burger-menu-notification) {
  width: 2.5rem;
  height: 1.7rem;
  transition: .5s ease-in-out;
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%) rotate(0deg);
}

.burger-btn > div > span {
  display: block;
  position: absolute;
  height: 0.2rem;
  width: 100%;
  background-color: var(--font-color-medium);
  border-radius: 0.9rem;
  opacity: 1;
  left: 0;
  transform: rotate(0deg);
  transition: .1s ease-in-out;
}

.burger-btn.burger-btn-auth:not(.open-popup) > div:not(.burger-menu-notification):before {
  background-image: url('../icons/user_logged_white.svg?v2');
  background-repeat: no-repeat;
  background-position: center center;
  position: absolute;
  top: 0.1rem;
  height: inherit;
  width: inherit;
  content: '';
}

.burger-btn.burger-btn-auth:not(.open-popup):hover > div:before {
  background-image: url('../icons/user_logged_blue.svg?v2');
}

.burger-btn.burger-btn-auth:not(.open-popup) > div > span {
  background-color: transparent;
}

.burger-btn:not(.burger-btn-auth):hover > div > span {
  background-color: var(--font-color-blue);
}

.burger-btn > div > span:nth-child(1) {
  top: 0.1rem;
}

.burger-btn.open-popup > div > span:nth-child(1) {
  top: 0.9rem;
  transform: rotate(135deg);
  background-color: var(--font-color-blue);
}

.burger-btn > div > span:nth-child(2) {
  top: 0.85rem;
  width: 70%;
}

.burger-btn.open-popup > div > span:nth-child(2) {
  opacity: 0;
  right: -100px;
}

.burger-btn > div > span:nth-child(3) {
  top: 1.6rem;
}

.burger-btn.open-popup > div > span:nth-child(3) {
  top: 0.9rem;
  transform: rotate(-135deg);
  background-color: var(--font-color-blue);
}

.logo {
  display: block;
  height: 2rem;
  aspect-ratio: 5.433333;
}

.nav-icon:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  background-size: 2rem;
  background-repeat: no-repeat;
  width: 2rem;
  height: 2rem;
}

.nav-icon-left:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(calc(-50% - 0.1rem));
  background-size: 2rem;
  background-repeat: no-repeat;
  background-position-y: center;
  width: 2rem;
  height: 3rem;
}

.nav-search form {
  position: relative;
}

.nav-search-input-container {
  border-bottom: 0.1rem solid var(--border-color);
}

.nav-search input[type="text"] {
  outline: none;
  border-bottom: none;
  color: var(--font-color-medium);
  padding: 0;
  width: calc(100% - 4.6rem);
  height: 2.8rem;
  line-height: 1rem;
}

.nav-search button[type="submit"] {
  position: absolute;
  right: 0.1rem;
  top: 0;
  transform: translateY(-15%);
  width: 2rem;
  height: 2.8rem;
}

.nav-link,
.nav-link > a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 5.2rem;
  cursor: pointer;
  color: var(--font-color-medium);
}

.nav-center-menu > .nav-link {
  width: auto;
  margin-right: 1.8rem;
  padding-right: 1.8rem;
}

.nav-center-menu > .nav-link:before {
  content: '';
  position: absolute;
  top: calc(50% - 0.1rem);
  transform: translateY(-50%);
  right: 0;
  height: 1.5rem;
  border-right: 0.1rem solid var(--border-color);
}

.nav-center-menu > .nav-link:last-child:before {
  content: unset;
}

.nav-yxp-menu a {
  margin-right: 1.6rem;
}

.nav-yxp-menu a img {
  display: block;
}

.nav-yxp-menu .daily-boost-btn {
  visibility: hidden;
}

.daily-boost-link {
  display: none;
}

.nav-link-delimiter {
  width: 100%;
  height: 0.1rem;
  margin: 0 0 2rem;
  background: var(--border-color);
  opacity: 0.4;
}

.nav-mobile-menu-container > .nav-link,
.nav-mobile-menu-container > .nav-link > a {
  width: 100%;
  font-size: 1.7rem;
  justify-content: flex-start;
  padding-left: 3.2rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  margin-bottom: 0;
}

.nav-mobile-menu-container > .nav-link.with-bubble:after {
  content: '';
  position: absolute;
  background-color: var(--background-color-4);
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 0.2rem;
  border-radius: 50%;
  left: 2.2rem;
  top: 0.6rem;
}

.nav-menu > .nav-link {
  width: auto;
}

.nav-menu > .nav-link.is_active,
.nav-menu > .nav-link:hover {
  color: var(--triangle-color);
}

.nav-link.open-popup,
.nav-link:hover {
  color: var(--font-color-blue);
}

.nav-menu > .nav-link > span {
  line-height: 1.7rem;
  padding: 0 2.4rem;
}

.nav-link.icon-cart > span {
  font-size: 1.2rem;
  font-weight: bold;
  color: var(--font-color-black);
  background: var(--border-color);
  display: flex;
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 1rem;
  position: absolute;
  top: 0.6rem;
  justify-content: center;
  align-items: center;
  left: 50%;
  transform: translateX(calc(0.2rem - 50%));
}

.nav-link.icon-cart:hover > span,
.nav-link.icon-cart.open-popup > span {
  background: var(--background-color-4);
}

.nav-link.icon-currency {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.nav-link.icon-currency:after {
  content: '';
  width: 1.8rem;
  height: 100%;
  background-image: url(../icons/dropdown_down_icon_grey.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 3.6rem;
}

.nav-link.icon-currency:hover:after {
  background-image: url(../icons/dropdown_down_icon_blue.svg);
}

.nav-link.icon-currency.is_active:after {
  background-image: url(../icons/dropdown_up_icon_blue.svg);
}

.nav-link.icon-currency .superselect-label {
  display: none;
}

.nav-link.icon-currency .superselect-options {
  top: 7.1rem;
  left: initial;
  right: 0;
  min-width: 6.4rem;
  padding: 1.2rem 0;
  background-color: var(--background-color-3-op-95);
  border: none;
}

.nav-link.icon-currency .superselect-option {
  font-size: 1.6rem;
  line-height: 1.75;
  padding: 0 1.2rem;
  justify-content: flex-end;
}

.nav-link.icon-currency .superselect-option:hover,
.nav-link.icon-currency .superselect-option:active {
  background-color: transparent;
}

.nav-link.icon-currency .superselect-option > a {
  font-size: 1.6rem;
  line-height: 1.75;
  justify-content: flex-end;
}

.nav-link.icon-currency .superselect-option.selected > a,
.nav-link.icon-currency .superselect-option:hover > a {
  color: var(--font-color-blue);
}

.with-gradient-triangle {
  position: relative;
  --triangle-color: transparent;
}

.with-gradient-triangle.is_active:after,
.with-gradient-triangle:hover:after,
.with-gradient-triangle:focus:after,
.with-gradient-triangle:active:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 9px 7px 9px;
  border-color: transparent transparent var(--triangle-color) transparent;
  z-index: 20;
}

.nav-link-popup {
  display: none;
  z-index: 1000;
  background: var(--background-color-3);
  min-width: 23rem;
  min-height: fit-content;
  position: absolute;
  top: 7rem;
  right: 0;
}

.nav-link-popup.popup-under-link {
  right: initial;
  background: var(--background-color-3-op-85);
}

.nav-link-popup.open-popup,
.showing-popup-on-hover:hover .nav-link-popup {
  display: block;
}

.nav-link-popup-container {
  position: relative;
  display: flex;
  justify-content: center;
  width: 100%;
  height: 100%;
  background-color: var(--background-color-3-op-95);
}

.menu-popup-container {
  flex-direction: column;
  padding: 6.3rem 2rem 0;
}

.nav-link-popup-sub-container {
  width: calc(100% - 4rem);
  flex: 1 1 calc(100% - 4rem);
  margin: 2.4rem 2.5rem 1rem;
}

.nav-link-popup-headline {
  text-align: center;
  font-size: 1.7rem;
  font-weight: bold;
  color: var(--font-color-blue);
}

.login-popup-sub-container .nav-link-popup-headline > .tab-target:not(.is_active) {
  display: none;
}

.nav-genres-container,
.nav-platforms-container {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  margin: 4.6rem auto 1.5rem;
  width: 43rem;
}

.nav-genres-item,
.nav-platforms-item {
  position: relative;
  display: block;
  min-width: 6rem;
  height: auto;
  padding-top: 7rem;
  text-align: center;
  color: var(--font-color-medium);
  font-size: 1.7rem;
}

.nav-genres-item {
  min-width: 10rem;
  max-width: 10rem;
  height: 7.4rem;
  flex: 1 1 10rem;
  font-size: 1.5rem;
  font-weight: bold;
  background: var(--background-color-2);
  padding-top: 4.4rem;
  margin-bottom: 1rem;
  line-height: 2;
}

.nav-genres-item:last-of-type {
  margin-right: auto;
  margin-left: 1rem;
}

.nav-platforms-item {
  min-width: 10rem;
  max-width: 10rem;
  height: 9.275rem;
  flex: 1 1 10rem;
  font-size: 1.5rem;
  font-weight: bold;
  background: var(--background-color-2);
  padding-top: 4.956rem;
  margin-bottom: 1rem;
  line-height: 1.25;
  margin-left: 1rem;
}

.nav-platforms-item:nth-child(4n+1) {
  margin-left: 0 !important;
}

.nav-platforms-item:last-of-type {
  margin-right: auto;
  margin-left: 1rem;
}

.nav-genres-item:focus,
.nav-genres-item:hover,
.nav-genres-item:active,
.nav-platforms-item:focus,
.nav-platforms-item:hover,
.nav-platforms-item:active {
  color: var(--font-color-blue);
}

.nav-platforms-item.nav-icon:before {
  width: 5rem;
  height: 5rem;
  background-size: 3.8rem !important;
  background-position: center;
  top: 0;
  transform: translateX(-50%);
}

.nav-genres-item.nav-icon:before {
  width: 5rem;
  height: 5rem;
  background-size: 3.8rem;
  background-position: center;
  top: 0;
  transform: translateX(-50%);
}

.login-popup-sub-container .tab-target.is_active {
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background-color: var(--start-background-color);
  background: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  background-size: 100%;
  -webkit-background-clip: text;
  -moz-background-clip: text;
  -webkit-text-fill-color: transparent;
  -moz-text-fill-color: transparent;
}

.login-popup-sub-container .tab-target ~ .tab-target {
  position: relative;
}

.login-popup-sub-container .tab-target.tab-target-forgot-password {
  font-size: 1.5rem;
  color: var(--font-color-light);
  padding: 0;
}

.login-popup-sub-container .tab {
  width: 100%;
  margin: 0 auto;
  padding: 2rem 4rem;
  background-color: var(--background-color-2);
  border-radius: 4px;
}

.login-popup-sub-container .socials-headline {
  font-size: 1.3rem;
  font-weight: normal;
  color: var(--font-color-blue);
  text-transform: initial;
  margin-bottom: 0.8rem;
  margin-top: -0.8rem;
}

.login-popup-sub-container .socials > .icon {
  width: 1.8rem;
  height: 1.8rem;
  margin: 0 1.6rem 0 0;
}

.login-popup-sub-container .socials > .icon.icon-socialmedia-facebook {
  margin-right: 1.2rem;
  margin-left: -0.4rem;
}

.login-popup-sub-container .form-manage {
  flex-direction: column-reverse;
  align-items: flex-start;
  padding-top: 4rem;
}

.login-popup-sub-container .form-tab-target {
  margin-bottom: 1rem;
}

.login-popup-sub-container .form-manage > button {
  width: 100%;
}

.login-popup-sub-container .form-error,
.login-popup-sub-container .form-success,
.login-popup-sub-container .form-notification {
  text-transform: initial;
  font-size: 1.6rem;
  padding-top: 1.2rem;
  margin-top: 0;
  text-align: center;
}

.auth-menu-widget-user-data {
  display: flex;
  margin-bottom: 2.4rem;
  text-transform: initial;
  font-size: 1.7rem;
}

.auth-menu-widget-user-email,
.auth-menu-widget-user-balance {
  color: var(--font-color-blue);
}

.auth-menu-widget-user-balance {
  text-align: right;
}

.auth-menu-widget-user-email > span,
.auth-menu-widget-user-balance > span {
  color: var(--font-color-medium);
  display: inline-block;
  padding-top: 0.2rem;
}

.auth-menu-widget-user-menu {
  margin-bottom: 1.6rem;
  display: flex;
  flex-direction: column;
}

.auth-menu-widget-user-menu-item {
  color: var(--font-color-medium);
  text-transform: initial;
  font-size: 1.7rem;
  margin-bottom: 1.6rem;
  display: flex;
  align-items: center;
  padding-left: 3rem;
}

.auth-menu-widget-user-menu-item.is_active,
.auth-menu-widget-user-menu-item:hover,
.auth-menu-widget-user-menu-item:active {
  color: var(--font-color-blue);
}

.auth-menu-widget-user-menu-item:nth-last-child(2) {
  margin-bottom: 4.0rem;
}

.auth-menu-widget-user-menu-item.icon:before {
  left: 1rem;
  width: 100%;
  height: 100%;
}

.icon-my_orders_page:before {
  background-image: url('../icons/my_orders_icon_grey.svg?v=2');
}

.icon-my_orders_page.is_active:before,
.icon-my_orders_page:not(.icon-no-hover):focus:before,
.icon-my_orders_page:not(.icon-no-hover):hover:before,
.icon-my_orders_page:not(.icon-no-hover):active:before {
  background-image: url('../icons/my_orders_icon_blue.svg?v=2');
}

.icon-my_tickets_page:before {
  background-image: url('../icons/my_tickets_icon_grey.svg');
}

.icon-my_tickets_page.is_active:before,
.icon-my_tickets_page:not(.icon-no-hover):focus:before,
.icon-my_tickets_page:not(.icon-no-hover):hover:before,
.icon-my_tickets_page:not(.icon-no-hover):active:before {
  background-image: url('../icons/my_tickets_icon_blue.svg');
}

.icon-product_library:before {
  background-image: url('../icons/my_library_icon_grey.svg');
}

.icon-product_library.is_active:before,
.icon-product_library:not(.icon-no-hover):focus:before,
.icon-product_library:not(.icon-no-hover):hover:before,
.icon-product_library:not(.icon-no-hover):active:before {
  background-image: url('../icons/my_library_icon_blue.svg');
}

.icon-profile_settings:before {
  background-image: url('../icons/settings_icon_grey.svg');
}

.icon-profile_settings.is_active:before,
.icon-profile_settings:not(.icon-no-hover):focus:before,
.icon-profile_settings:not(.icon-no-hover):hover:before,
.icon-profile_settings:not(.icon-no-hover):active:before {
  background-image: url('../icons/settings_icon_blue.svg');
}

.icon-customer_support:before {
  background-image: url('../icons/support_icon_grey.svg');
}

.icon-customer_support.is_active:before,
.icon-customer_support:not(.icon-no-hover):focus:before,
.icon-customer_support:not(.icon-no-hover):hover:before,
.icon-customer_support:not(.icon-no-hover):active:before {
  background-image: url('../icons/support_icon_blue.svg');
}

.icon-logout:before {
  background-image: url('../icons/logout_icon_grey.svg');
  transform: translateY(calc(-50% - 0.1rem)) scaleY(0.9);
}

.icon-logout.is_active:before,
.icon-logout:not(.icon-no-hover):focus:before,
.icon-logout:not(.icon-no-hover):hover:before,
.icon-logout:not(.icon-no-hover):active:before {
  background-image: url('../icons/logout_icon_blue.svg');
}

/* Cart widget */

.cart-container {
  cursor: auto;
}

.cart-items {
  
}

.empty-cart-text {
  text-align: center;
  font-size: 2.5rem;
}

.cart-item {
  position: relative;
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  flex-wrap: wrap;
  padding-bottom: 4rem;
  margin-bottom: 4rem;
  border-bottom: 0.2rem solid var(--border-color);
  color: var(--font-color-light);
}

.bonus-cart-item {
  border-top: var(--font-color-gold) 0.4rem solid;
  padding-top: 4rem;
  margin-top: -4.2rem;
}

.cart-item-image-container {
  width: 100%;
  flex: 1 1 100%;
  margin-bottom: 2rem;
}

.cart-item-image-container img {
  width: 100%;
  display: block;
  aspect-ratio: 1.73953488;
}

.cart-item-information-container {
  flex: 1 1 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  height: 100%;
  margin: 0 0 4rem;
}

.cart-item-title-container {
  width: 100%;
  flex: 1 1 100%;
  margin-bottom: 2rem;
}

.cart-item-title-container > a {
  font-size: 2.5rem;
  font-weight: bold;
  color: var(--font-color-white);
  text-overflow: ellipsis;
}

.cart-item-additional-information-container {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.cart-item-additional-information {
  font-size: 1.8rem;
  color: var(--font-color-dark);
  display: flex;
  flex-direction: row;
  align-items: flex-start;
}

.cart-item-additional-information.cart-item-errors {
  color: red;
}

.cart-item-additional-information-title {
  font-weight: bold;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  min-width: 10rem;
}

.cart-item-additional-information-title:after {
  content: ':';
  margin-right: 1rem;
}

.cart-item-additional-information-content {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
}

.cart-item-errors > .cart-item-additional-information-content {
  height: auto;
}

.cart-item-additional-information-content.check-region {
  color: var(--font-color-blue);
}

.cart-item-additional-information-content.uncheck-region {
  color: red;
}

.cart-item-additional-information-content i.icon {
  width: 2rem;
  min-width: 2rem;
  height: 2rem;
  display: none;
  margin: 0 0.7rem 0 0;
}

.cart-item-additional-information-content i.icon:before {
  width: 100%;
  height: 100%;
}

.cart-item-additional-information-content i.icon.icon-instant-delivery {
  width: 2.9rem;
  height: 2.8rem;
}

.cart-item-additional-information-content i.icon.icon-instant-delivery:before {
  background-size: 3rem;
}

.cart-bonus-item-information {
  font-size: 1.5rem;
  margin-top: 1.5rem;
  color: var(--font-color-white);
}

.cart-item-extensions-container {
  flex: 1 1 100%;
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
}

.cart-item .cart-item-qnt-container {
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 1.6rem;
  justify-content: flex-end;
}

.cart-item-qnt-container:before {
  content: attr(data-label);
  font-size: 2.5rem;
  font-weight: bold;
  color: var(--font-color-dark);
  margin-right: auto;
}

.cart-item-qnt-container > span,
.cart-item-qnt-container > .cart-item-qnt-increment,
.cart-item-qnt-container > .cart-item-qnt-decrement {
  font-size: 2rem;
  line-height: 2.5rem;
  background-color: var(--background-color);
  border: 0.1rem solid var(--font-color-light);
  padding: 0 1.2rem;
  display: inline-block;
  border-image-slice: 1;
}

.cart-item-qnt-container > span {
  color: var(--font-color-light);
  border-right: none;
  border-left: none;
  --start-background-color: #4ba6fb;
  --end-background-color: #c635f4;
  border-image-source: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
}

.cart-item-qnt-container > .cart-item-qnt-increment,
.cart-item-qnt-container > .cart-item-qnt-decrement {
  padding: 0;
  width: 3rem;
  background-color: var(--background-color);
  font-size: 2.5rem;
  color: var(--font-color-light);
}

.cart-item-qnt-container > .cart-item-qnt-increment {
  border-left: none;
  --start-background-color: #c635f4;
  --end-background-color: var(--gradient-second-color);
  border-image-source: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
}

.cart-item-qnt-container > .cart-item-qnt-decrement {
  border-right: none;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: #4ba6fb;
  border-image-source: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
}

.cart-item-qnt-container > .cart-item-qnt-increment:hover,
.cart-item-qnt-container > .cart-item-qnt-decrement:hover {
  color: var(--font-color-blue);
}

.cart-item-manage-container,
.cart-item-delete-container {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin-bottom: 1.6rem;
}

.cart-item-manage-container > button,
.cart-item-delete-container > button {
  color: var(--font-color-light);
  display: block;
  font-size: 1.8rem;
  white-space: nowrap;
  margin-bottom: 1rem;
  border-bottom: 1px solid;
  padding: 0;
}

.cart-item-manage-container > button:hover,
.cart-item-delete-container > button:hover {
  color: var(--font-color-blue);
}

.cart-item-manage-container > button.cart-item-delete-button,
.cart-item-delete-container > button.cart-item-delete-button {
  width: 3rem;
  height: 3rem;
  border-bottom: none;
  margin-bottom: 0;
}

.cart-item-price-container {
  flex: 1 1 100%;
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  position: relative;
}

.cart-item-price-container:before {
  content: attr(data-label);
  font-size: 2.5rem;
  font-weight: bold;
  color: var(--font-color-dark);
  white-space: nowrap;
  margin-right: auto;
  line-height: 2.5rem;
  order: 2;
}

.cart-item-discount-container {
  order: 4;
}

.cart-item-discount-info-container {
  order: 4;
  padding: .4rem 0 0;
  font-size: 1.4rem;
  text-align: right;
  width: 100%;
  color: var(--gradient-second-color);
}

.cart-item-full-price {
  font-size: 2.5rem;
  font-weight: 300;
  color: var(--font-color-dark);
  text-decoration: line-through;
  flex: 1 1 100%;
  order: 1;
  line-height: 0.73;
  margin-bottom: 0.6rem;
}

.cart-item-price {
  font-size: 4rem;
  font-weight: bold;
  color: var(--font-color-blue);
  line-height: 0.73;
  margin-left: 2rem;
}

.cart-item-price sup {
  top: 0;
  right: 0;
  position: relative;
  vertical-align: super;
}

.cart-item-price-container > .cart-item-price {
  line-height: 2.5rem;
  position: relative;
  display: block;
  margin-left: 0;
  order: 3;
}

.cart-item-discount-container > .cart-item-price {
  line-height: 2.5rem;
  position: relative;
  display: block;
  font-size: 2.5rem;
  order: 3;
}

.cart-item-price-small {
  font-weight: bold;
  line-height: 0.73;
}

.cart-item .cart-item-delete {
  position: absolute;
  top: 2.5rem;
  transform: translateY(-50%);
  left: -1.8rem;
  width: 1rem;
  height: 1rem;
  background-image: url('../icons/close_icon_grey.svg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1rem;
}

.cart-item .cart-item-delete:hover,
.cart-item .cart-item-delete:active {
  background-image: url('../icons/close_icon_blue.svg');  
}

.cart-footer {
  display: flex;
  flex-direction: column;
  margin-bottom: 4rem;
}

#checkout-form {
  --margin-top-payment-methods: 0;
}

.cart-discount-container,
.cart-balance-container,
.cart-total-container,
.cart-pay-container {
  width: 100%;
  flex: 1 1 100%;
  margin-bottom: 4rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.cart-pay-container {
  margin-bottom: 0;
}

.cart-discount-container-label {
  font-size: 2.5rem;
  line-height: 5rem;
  font-weight: bold;
  color: var(--font-color-light);
  margin-bottom: 3rem;
}

.cart-discount-form {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-bottom: 4rem;
}

.cart-discount-form .form-group {
  width: 100%;
}

.cart-discount-form .form-group.form-group-payments {
  min-width: 100%;
}

.number-of-items-in-cart,
.burger-menu-notification {
  position: absolute;
  top: 0.7rem;
  right: 0.3rem;
  font-size: 1.2rem;
  font-weight: bold;
  line-height: 1.8rem;
  color: var(--font-color-black);
  width: 1.8rem;
  height: 1.8rem;
  background: var(--background-color-4);
  border-radius: 50%;
  text-align: center;
}

.burger-menu-notification {
  right: -1.3rem;
}

.form-group-payments {
  flex-direction: row;
  flex-wrap: wrap;
}

.form-group-payment > label {
  width: 12rem;
  height: 12rem;
  margin: 0 1rem 1rem 0;
  padding: 1px !important;
  background-color: var(--background-color-2);
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  color: var(--font-color-light) !important;
  border: 0.1rem solid transparent;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
}

.form-group-payment > label > img {
  width: 80%;
  height: 50%;
  margin: 0 0 auto;
}

.form-group-payment > label:before {
  content: '' !important;
  width: 100% !important;
  height: 100% !important;
  background-color: var(--background-color-2) !important;
  position: absolute;
  top: 0 !important;
  left: 0 !important;
  transform: initial !important;
  z-index: -1;
}

.form-group-payment > label,
.form-group-payment > input + label {
  text-align: center;
  padding: 1rem 0 !important;
}

.form-group-payment > input[disabled] + label:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: var(--background-color-3-op-65);
}

.form-group-payment > input:not([disabled]) + label:hover,
.form-group-payment > input:checked + label {
  border: 0.1rem solid;
  border-image-slice: 1;
  border-image-source: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
}

.cart-discount-form .form-group > button {
  width: 100%;
}

.cart-total-container {
  font-size: 2.5rem;
  line-height: 5rem;
  font-weight: bold;
  color: var(--font-color-light);
}

.cart-total-item {
  margin-bottom: 3rem;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-direction: row;
  width: 100%;
  white-space: nowrap;
}

.cart-total-container > button,
.cart-pay-container > button {
  width: 100%;
}

@media (min-width: 640px) {
  .nav-flex {
    height: 6.9rem;
  }

  .nav-search {
    order: 2;
    flex: 1;
    margin: 0 4rem;
    max-width: 27.8rem;
    padding: 0;
    height: 7.2rem;
    background-color: transparent;
  }

  .nav-link-popup {
    top: 7.1rem;
  }
}
@media (min-width: 768px) {
  .popup-window {
    max-width: 76rem;
    min-width: 70rem;
    width: auto;
  }

  .popup-window.min-content {
    max-width: initial;
    min-width: 70rem;
    width: min-content;
  }

  .login-popup-sub-container .tab {
    width:60%;
  }

  .cart-item-image-container {
    margin-bottom: 4.8rem;
  }

  .cart-item-title-container {
    margin-bottom: 4rem;
  }

  .cart-item-information-container {
    flex: 1;
    margin: 0 4rem 0 0;
  }

  .cart-item-extensions-container {
    flex: 0;
    align-items: flex-end;
    flex-direction: column;
    flex-wrap: nowrap;
    min-width: 30rem;
  }

  .cart-item-manage-container {
    height: 100%;
  }

  .cart-item-qnt-container:before {
    width: 16.6rem;
    text-align: right;
  }

  .cart-item-price-container {
    flex: 1;
    width: 100%;
    align-items: flex-end;
  }

  .cart-item-price-container:before {
    width: 16.6rem;
    text-align: right;
  }
}
@media (min-width: 992px) {
  .popup-window.lootbox-notification-popup-window {
    max-width: 98rem;
    min-width: 70rem;
    width: max-content;
  }

  .logo {
    height: 3.6rem;
  }

  .nav-search {
    margin: 0 6rem;
  }

  .login-popup-sub-container .tab {
    width: 50%;
  }

  .cart-footer {
    flex-direction: row;
    justify-content: space-between;
  }

  #checkout-form .cart-footer {
    margin-top: var(--margin-top-payment-methods);
  }

  .cart-discount-container,
  .cart-balance-container,
  .cart-total-container,
  .cart-pay-container {
    justify-content: space-between;
    flex: 0;
  }

  .cart-discount-container {
    flex: 1 1 auto;
    align-items: flex-start;
    justify-content: flex-start;
    margin-bottom: 0;
  }

  .cart-item {
    flex-wrap: nowrap;
  }

  .cart-item-image-container {
    width: 40rem;
    flex: 1 1 40rem;
    margin-bottom: 0;
  }

  .cart-item-image-container img {
    width: 40rem;
  }

  .cart-item-title-container {
    margin-bottom: 2rem;
  }

  .cart-item-information-container {
    margin: 0 4rem;
    flex: 1 1 100%;
  }

  .cart-item-additional-information-container {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .cart-item-additional-information {
    font-size: 2.0rem;
    flex-direction: column;
    margin-bottom: 1rem;
  }

  .cart-item-additional-information-content {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    line-height: 1;
    height: 3.2rem;
  }

  .cart-item-additional-information:first-of-type {
    margin-right: 2rem;
  }

  .cart-item-additional-information:last-of-type {
    width: 100%;
    margin-bottom: 0;
  }

  .cart-item-title-container {
    margin-bottom: 2.4rem;
  }

  .cart-discount-container {
    flex: 1 1 calc(55% - 2rem);
    max-width: calc(55% - 2rem);
  }

  .cart-discount-form > .form-group > button,
  .cart-total-container > button {
    width: auto;
    min-width: 30rem;
  }

  .cart-item-additional-information-title {
    margin-right: 0;
  }

  .cart-item-additional-information-title:after {
    content: '';
  }

  .cart-item-additional-information-content i.icon {
    width: 2.2rem;
    height: 2.2rem;
    display: inline-block;
  }

  .cart-item-additional-information-content i.icon.icon-instant-delivery {
    height: 3.2rem;
    width: 3.2rem;
  }

  .cart-item-additional-information-content i.icon.icon-instant-delivery:before {
    background-size: 3.2rem;
  }

  .cart-item-manage-container > button,
  .cart-item-delete-container > button {
    margin-bottom: 0;
  }

  .cart-discount-form {
    flex-direction: row;
    justify-content: space-between;
  }

  .cart-discount-form > .form-group {
    margin-bottom: 0;
    flex: 0;
  }

  .cart-discount-form > .form-group:first-child {
    width: 100%;
    flex: 1;
  }

  .cart-discount-form > .form-group > button {
    margin-left: 4rem;
  }

  .cart-total-container {
    align-items: flex-end;
    margin-left: auto;
    margin-bottom: 0;
  }

  .cart-pay-container {
    justify-content: flex-end;
    min-width: 28rem;
  }

  .cart-total-item {
    justify-content: flex-end;
  }

  .cart-total-item:last-of-type {
    margin-bottom: 0;
  }

  .cart-item-price-small,
  .cart-total-item .cart-item-price {
    margin-left: 0;
    width: 13.4rem;
    text-align: right;
  }
}
@media (min-width: 1200px) {
  .only-mobile {
    display: none;
  }

  .logo {
    height: 3rem;
  }

  .nav-right-menu {
    order: 4;
  }

  .nav-menu {
    display: flex;
  }

  .nav-link.icon-user > span,
  .nav-link.icon-favorite > span,
  .nav-link.icon-support > span {
    display: block;
  }

  .login-popup-sub-container .tab {
    width: 44rem;
  }

  .cart-item-title-container {
    margin-bottom: 4rem;
  }

  .cart-item-additional-information-container {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .cart-item-additional-information {
    font-size: 2.5rem;
    flex-direction: column;
    margin-bottom: 2rem;
  }

  .cart-item-additional-information-content {
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    line-height: 1;
    height: 3.2rem;
  }

  .cart-item-additional-information:first-of-type {
    margin-right: 10rem;
  }

  .cart-item-additional-information:last-of-type {
    width: 100%;
    margin-bottom: 0;
  }

  .cart-item-title-container {
    margin-bottom: 4rem;
  }

  .cart-item-extensions-container {
    min-width: 34.8rem;
  }

  .cart-discount-container {
    flex: 1 1 calc(50% - 2rem);
    max-width: calc(50% - 2rem);
  }

  .cart-discount-form > .form-group > button,
  .cart-total-container > button {
    width: auto;
    min-width: 30rem;
  }

  .cart-item-additional-information-title {
    margin-right: 0;
  }

  .cart-item-additional-information-title:after {
    content: '';
  }

  .cart-item-additional-information-content i.icon {
    width: 2.2rem;
    height: 2.2rem;
    display: inline-block;
  }

  .cart-item-additional-information-content i.icon.icon-instant-delivery {
    height: 3.2rem;
    width: 3.2rem;
  }

  .cart-item-additional-information-content i.icon.icon-instant-delivery:before {
    background-size: 3.2rem;
  }

  .cart-item .cart-item-qnt-container {
    justify-content: initial;
  }

  .cart-item-qnt-container:before {
    content: attr(data-label);
    font-size: 2.5rem;
    font-weight: bold;
    color: var(--font-color-dark);
    margin-right: 2.4rem;
    width: 17.2rem;
  }

  .cart-item-price-container:before {
      width: 17.2rem;
      text-align: right;
  }

  .cart-item-discount-container:before {
    color: var(--font-color-light);
  }

  .cart-item-qnt-container > span,
  .cart-item-qnt-container > .cart-item-qnt-increment,
  .cart-item-qnt-container > .cart-item-qnt-decrement {
    line-height: 4.6rem;
    height: 4.8rem;
    width: 4rem;
  }

  .cart-item-delete-container {
    margin-bottom: 2.4rem;
  }

  .cart-item-qnt-container > span {
    width: 6.6rem;
    text-align: center;
  }

  .nav-center-menu {
    display: flex;
    order: 3;
  }
}
@media (min-width: 1440px) {
  .nav-flex {
    flex: 1 1 136.6rem;
    max-width: 136.6rem;
    min-width: 136.6rem;
  }

  .nav-yxp-menu {
    display: flex;
  }

  .cart-discount-container {
    flex: 1 1 calc(50% - 2rem);
    max-width: calc(50% - 2rem);
  }
}
@media (min-width: 1900px) {
  .nav-flex {
    flex: 1 1 172rem;
    max-width: 172rem;
    min-width: 172rem;
  }

  .nav-search {
    margin: 0 12rem;
  }
}
@media (max-width: 992px) {
  .cart-item-delete-container {
    position: absolute;
    top: 0;
    left: 0;
    margin-bottom: 0;
    background-color: var(--background-color-3-op-75);
  }
}

.section {
  padding-bottom: 6.4rem;
}

.section.search {
  padding-top: 6.2rem;
}

.section.product-information {
  margin-bottom: 6.2rem;
}

.section.product-information.breadcrumb {
  padding-top: 1.8rem
}

.headline {
  position: relative;
  padding: 2.8rem 0 3.2rem;
  margin: 0 2rem;
  width: 100%;
}

.headline > .sup {
  position: absolute;
  top: -1.7rem;
  left: 50%;
  transform: translateX(-50%);
}

.headline-level {
  color: var(--font-color-white);
  white-space: nowrap;
  display: inline-block;
  width: fit-content;
  font-weight: 300;
}

.headline-level.no-padding {
  padding: 0;
}

.content-header[data-version="catalog-1"] {
  min-height: 4rem;
}

.headline-level.level-1 {
  font-size: 3.2rem;
  white-space: pre-wrap;
}

.headline-level.level-2 {
  font-size: 2.5rem;
  white-space: pre-wrap;
}

.headline-level.level-3 {
  font-size: 2.2rem;
  white-space: pre-wrap;
}

.headline-level.level-error {
  margin: 8rem 0;
}

.gradient-color,
.gradient-color-hover:hover {
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background-color: var(--start-background-color);
  background: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  background-size: 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gradient-line-background {
  display: flex;
  align-items: center;
  justify-content: center;
}

.gradient-line-background > span {
  position: relative;
}

.gradient-line-background > span:before,
.gradient-line-background > span:after {
  content: '';
  width: 80rem;
  height: 0.2rem;
  background-size: cover;
  background-repeat: no-repeat;
  position: absolute;
  top: calc(50% - 0.1rem);
}

.gradient-line-background > span:before {
  background-image: url('../images/leftheadline.png');
  background-position-x: right;
  right: 100%;
}

.gradient-line-background > span:after {
  background-image: url('../images/rightheadline.png');
  background-position-x: left;
  left: 100%;
}

.gradient-cardio-background {
  display: flex;
  align-items: center;
  justify-content: center;
}

.gradient-cardio-background > .headline-level.level-1:last-of-type {
  position: relative;
}

.gradient-cardio-background > .headline-level.level-1:last-of-type:before,
.gradient-cardio-background > .headline-level.level-1:last-of-type:after {
  content: '';
  width: 70.3rem;
  height: 9rem;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url('../icons/headline_cardio_separator.png');
  background-position-y: center;
  margin-top: -2rem;
  position: absolute;
}

.gradient-cardio-background > .headline-level.level-1:last-of-type:before {
  background-position-x: right;
  right: 100%;
}

.gradient-cardio-background > .headline-level.level-1:last-of-type:after {
  background-position-x: left;
  left: 100%;
}

@media (min-width: 576px) {
  .content-header[data-version="catalog-1"] {
    min-height: 5rem;
  }

  .headline-level.level-1 {
    font-size: 4rem;
  }
}
@media (min-width: 768px) { }
@media (min-width: 992px) { }
@media (min-width: 1200px) {
  .content-header[data-version="catalog-1"] {
    min-height: 7.5rem;
  }

  .headline-level.level-1 {
    font-size: 6rem;
  }
}
@media (min-width: 1440px) { }
@media (min-width: 1900px) {

}

.section.search > .container > div {
  padding-left: calc(25% + 2rem);
  padding-right: calc(25% + 2rem);
}  

.section.search form {
  padding: 0 4rem;
}

.products-search-hints-container {
  display: flex;
  flex-direction: column;
  position: absolute;
  top: 100%;
  background-color: var(--background-color-3-op-95);
  border-left: 0.1rem solid var(--border-color);
  border-right: 0.1rem solid var(--border-color);
  border-bottom: 0.1rem solid var(--border-color);
  width: 100%;
  padding: 0.5rem 0.5rem 0;
  z-index: 40;
}

.product-search-show-all-button {
  position: relative !important;
  margin: 1rem -0.5rem -0.6rem;
  background-color: var(--border-color);
  width: calc(100% + 1.1rem) !important;
  height: auto !important;
  color: var(--font-color-light);
  text-transform: uppercase;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1;
  right: initial !important;
  top: initial !important;
  transform: initial !important;
  padding: 1.2rem 0 1rem;
}

.products-search-hints {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.product-search-hint {
  display: flex;
  width: 100%;
  padding: 0.5rem;
  cursor: pointer;
}

.product-search-hint:hover,
.product-search-hint:active {
  background-color: var(--background-color);
}

.product-search-hint-image {

}

.product-search-hint-image > img {
  display: block;
  width: 10rem;
}

.product-search-hint-data {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-left: 1rem;
}

.product-search-hint-data > span {
  display: block;
  font-size: 1.3rem;
  color: var(--font-color-white);
  line-height: 1.4;
}

.catalog-page {
  margin-top: 10rem;
}

.catalog-page.catalog-tag {
  margin: 2.4rem 0;
}

.catalog-page.breadcrumb {
  margin-top: 4rem;
}

.catalog-page-sidebar {
  display: none;
}

.catalog-page-sidebar.is_open {
  display: block;
  width: 100vw;
  height: 100vh;
  z-index: 30000;
  position: fixed;
  bottom: 0;
  left: 0;
  overflow: hidden;
  background: var(--background-color-3-op-65);
  backdrop-filter: blur(5px);
}

.catalog-page-content {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}

.catalog {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 0 1rem;
  width: 100%;
}

.catalog-tag .catalog {
  padding: 0;
}

.catalog[data-version="catalog-1"] {
  background-color: var(--background-color-2);
  padding-top: 2rem;
}

.catalog[data-version="3"] {
  padding-left: 0;
  padding-right: 0;
}

.catalog-header {
  display: none;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4rem;
  padding: 0 2rem;
}

.catalog-header[data-version="catalog-1"] {
  background-color: var(--background-color-2);
  padding-top: 1rem;
  padding-bottom: 2rem;
  margin-bottom: 0;
}

.catalog-mobile-header {
  padding: 0 2rem;
  margin: 0 0 4rem;
  display: flex;
  justify-content: flex-end;
  width: 100%;
}

.catalog-mobile-header[data-version="catalog-1"],
.catalog-mobile-header[data-target="my-library-catalog"] {
  display: none !important;
}

.catalog-mobile-header.is_active {
  position: fixed;
  top: 0;
  left: 0;
  padding: 1rem 2rem;
  z-index: 10000;
  background: var(--background-color-3-op-95);
}

.catalog-filters-open-button > span {
  margin-left: 0.5rem;
  color: var(--font-color-light);
}

.catalog-total {
  font-size: 1.7rem;
  font-weight: bold;
  color: var(--font-color-dark);
  flex: 1 1 auto;
}

.catalog-filters {
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;  
}

.catalog-header > .catalog-filters {
  flex-direction: row;
}

.catalog-header > .catalog-filters > .form-select {
  width: 18rem;
}

.catalog-sidebar {
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;
  transition: all 1s;
}

.catalog-page-sidebar.is_open > .catalog-sidebar {
  height: 100vh;
}

.catalog-mobile-sidebar-title {
  padding: 1.6rem 2rem;
  margin-top: 25vh;
  width: 100%;
  height: 6rem;
  background: #292929;
  border-radius: 2rem 2rem 0 0;
  display: flex;
  justify-content: center;
}

.catalog-mobile-sidebar-footer {
  padding: 1.6rem 2rem;
  width: 100%;
  height: 6rem;
  background: #292929;
  display: flex;
  justify-content: center;
}

.catalog-sidebar > .catalog-filters {
  flex-direction: column;
}

.catalog-page-sidebar.is_open > .catalog-sidebar > .catalog-filters {
  background: var(--background-color-3);
  padding: 2rem;
  overflow-y: scroll;
  scrollbar-width: none;
  height: calc(75vh - 6rem);
}

.catalog-filter {
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;  
}

.catalog-filter-title {
  font-size: 1.7rem;
  font-weight: bold;
  color: var(--font-color-dark);
  line-height: 1.4;
  padding-top: 0.2rem;
  padding-bottom: 1.2rem;
  margin-bottom: 1.5rem;
  border-bottom: 0.1rem solid var(--border-color);
}

.catalog-filter-content {
  display: flex;
  flex-direction: column;
  margin-bottom: 3.2rem;
}

.catalog-filter-content .form-group {
  margin-bottom: 1.2rem;
}

.catalog-item {
  position: relative;
  width: calc(100% - 2rem);
  max-width: calc(100% - 2rem);
  margin-bottom: 4rem;
  margin-right: 1rem;
  margin-left: 1rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.catalog-item:last-child {
  margin-right: auto;
}

.catalog-notification {
  color: var(--font-color-light);
  padding: 0 1rem;
  font-size: 2rem;
}

.catalog[data-version="2"] > .catalog-item {
  width: calc(100% - 2rem);
  max-width: calc(100% - 2rem);
  margin-bottom: 4.6rem;
}

.catalog-data-container {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.catalog[data-version="3"] .catalog-data-container {
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
}

.catalog-data-layout-1 {
  justify-content: space-between;
  margin-bottom: 1.8rem;
}

.catalog[data-version="2"] .catalog-data-layout-1 {
  display: flex;
}

.catalog[data-version="3"] .catalog-data-layout-1 {
  width: 100%;
}

.catalog[data-version="2"] .catalog-item-name {
  margin-bottom: 0;
}

.catalog[data-version="3"] .catalog-item-name {
  margin-bottom: 0;
}

.catalog-data-layout-2 {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex: 1 1 auto;
}

.catalog-item-prices {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
}

.buy-and-earn-btn {
  width: 100%;
  min-width: fit-content;
  padding: 0 .44rem;
  line-height: 2.1rem;
  position: relative;
  color: var(--font-color-black);
  text-transform: uppercase;
  font-size: 1.3rem;
  font-weight: bold;
  text-align: center;
  margin-top: 1rem;
  background: linear-gradient(to right, #e5b900, #fee409);
  text-wrap: nowrap;
  overflow-wrap: normal;
  white-space: nowrap;
}

.catalog-item-activations {
  justify-content: space-between;
  display: flex;
}

.catalog[data-version="3"] > .catalog-item .catalog-item-activations {
  display: none;
}

.catalog-item-purchase-date {
  margin-bottom: 0;
  margin-top: auto;
  letter-spacing: -0.1rem;
  font-size: 1.6rem;
  line-height: 2.7rem;
}

.catalog-item-review-btn {
  display: inline-block;
  margin-top: auto;
  margin-right: 0.2rem;
  margin-left: auto;
  padding: 0.2rem 0.7rem 0.1rem;
  border-radius: 0.2rem;
  font-size: 1.5rem;
  line-height: 1;
  height: 2.615rem;
  text-transform: capitalize;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border: 0.1rem solid;
  border-image-slice: 1;
  border-image-source: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  color: var(--font-color-white);
  background-color: var(--background-color-3-op-85);
}

.catalog-item-review-btn:hover {
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background-image: linear-gradient(135deg, var(--start-background-color), var(--end-background-color) 77%);
}

.catalog-review-container {
  --star-size: 2rem;
  margin-bottom: 2.4rem;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.catalog-review-target-link {
  order: 2;
  line-height: 1;
  padding-top: 0.6rem;
  color: var(--font-color-light);
  border-bottom: 1px solid;
}

.product-review-score {}

.catalog-image-container {
  position: relative;
  width: 100%;
}

.catalog-lootbox-badge {
  width: 7.2rem;
  height: 7.2rem;
  position: absolute;
  top: -0.8rem;
  right: 0.8rem;
}

.catalog-lootbox-badge img {
  width: 100%;
  display: block;
  margin: 0;
  padding: 0;
}

.catalog-image-ratio-container {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

.catalog-image-ratio-container:before {
  content: '';
  display: block;
  height: 0;
  width: 100%;
  padding-bottom: 57.31%;
  margin-bottom: 1.6rem;
}

.catalog[data-version="2"] .catalog-image-ratio-container:before {
  width: calc(100% + 4rem);
  padding-bottom: calc(57.31% + 2.292207rem);
  margin-left: -2rem;
}

.catalog-release-layout {
  position: absolute;
  bottom: 1.6rem;
  left: 0;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0.2rem;
  background-color: var(--background-color-3-op-75);
  color: var(--font-color-white);
  font-size: 1.4rem;
}

.catalog-release-layout:before {
  content: '';
  display: block;
  width: 3.6rem;
  height: 2.8rem;
  background-size: 2.4rem;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../icons/clock_icon_white.svg");
}

.catalog-item-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  max-height: 100%;
}

.catalog[data-version="2"] .catalog-item-image {
  left: -2rem;
  width: calc(100% + 4rem);
}

.catalog-item-name {
  margin-bottom: 0.6rem;
}

.catalog-item-name h1 {
  margin: 0;
  line-height: 1;
  font-size: 1.6rem;
}

.catalog-item-name h1 a {
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1;
  color: var(--font-color-white);
  overflow-wrap: anywhere;
}

.catalog-item-description {
  font-size: 1.4rem;
  line-height: 1.42;
  color: var(--font-color-white);
  margin-bottom: 3rem;
}

.catalog-item-activation {
}

.catalog-item-activation.icon {
  width: 1.8rem;
  height: 1.8rem;
}

.catalog-item-activation.icon:before {
  width: 100%;
  height: 100%;
  background-image: var(--data-icon);
}

.catalog-data-layout-3 {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.catalog-data-layout-4 {
  display: flex;
  justify-content: flex-end;
  margin-top: 0.8rem;
}

.catalog-item-note {
  color: var(--font-color-blue);
  text-align: right;
  margin-bottom: 2rem;
}

.catalog-item-buttons {
  display: flex;
}

.catalog-item-full-price,
.catalog-item-sale-price,
.cart-item-full-price,
.cart-item-price,
.slider-content-full-price,
.slider-content-price {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
}

.cart-item-full-price,
.cart-item-price,
.slider-content-full-price,
.slider-content-price {
  justify-content: flex-end;
}

.catalog-item-full-price sup,
.catalog-item-sale-price sup,
.cart-item-full-price sup,
.cart-item-price sup,
.slider-content-full-price sup,
.slider-content-price sup {
  top: initial;
  line-height: inherit;
}

.catalog-item-full-price {
  font-size: 1.6rem;
  color: var(--font-color-dark);
  text-decoration: line-through;
  line-height: 0.74;
  margin-bottom: 0.6rem;
}

.catalog-item-sale-price {
  font-size: 2.5rem;
  font-weight: bold;
  color: var(--font-color-blue);
  line-height: 0.74;
}

.catalog-item-discount-label {
  position: absolute;
  --catalog-item-discount-label-top: -0.8rem;
  top: var(--catalog-item-discount-label-top);
  right: 1rem;
  width: 5.2rem;
  height: 5rem;
  --catalog-item-discount-label-background-start: yellow;
  --catalog-item-discount-label-background-end: yellow;
  background: var(--catalog-item-discount-label-background-start);
  background: linear-gradient(165deg, var(--catalog-item-discount-label-background-start) 0%, var(--catalog-item-discount-label-background-end) 100%);
  box-shadow: 1px 2px 3px var(--background-color-3-op-65);
  padding: 0.9rem 0.6rem;
  font-size: 0.83rem;
  font-weight: 600;
  color: var(--font-color-black);
  line-height: 1.1;
}

.catalog[data-version="2"] > .catalog-item .catalog-item-discount-label {
  --catalog-item-discount-label-top: -1.2rem;
}

.catalog-item-discount-label.discount-20 {
  --catalog-item-discount-label-background-start: #16fff7;
  --catalog-item-discount-label-background-end: #4fa4df;
}

.catalog-item-discount-label.discount-35 {
  --catalog-item-discount-label-background-start: #a9d617;
  --catalog-item-discount-label-background-end: #86a712;
}

.catalog-item-discount-label.discount-50 {
  --catalog-item-discount-label-background-start: #fc01ff;
  --catalog-item-discount-label-background-end: #870079;
}

.catalog-item-discount-label.discount-75 {
  --catalog-item-discount-label-background-start: #ff3140;
  --catalog-item-discount-label-background-end: #a02029;
}

.catalog-item-discount-label:after {
  position: absolute;
  top: 0;
  right: calc(0.5*var(--catalog-item-discount-label-top));
  content: '';
  width: 0;
  height: 0;
  border-style: inset;
  border-width: calc(-1*var(--catalog-item-discount-label-top)) 0 0 calc(-0.5*var(--catalog-item-discount-label-top));
  border-color: transparent transparent transparent var(--catalog-item-discount-label-background-end);
  -webkit-transform:rotate(360deg);
}

.catalog-item-discount-label > span {
  font-size: 2.42rem;
  display: block;
  position: relative;
  line-height: 0.8;
  margin-top: 0.2rem;
}

.catalog-item-discount-label > span:after {
  content: '%';
  font-size: 50%;
  font-weight: bold;
  line-height: 1;
  position: absolute;
  vertical-align: initial;
  top: 50%;
  transform: translateY(-50%);
}

.catalog-item-additional-data-layout {
  margin: 2rem 0 0;
}

.second-sub-container .catalog-item-additional-data-layout {
  margin-top: 0;
}

.catalog-item-additional-data {
  font-size: 2rem;
  color: var(--font-color-medium);
  font-weight: 300;
  margin-bottom: 1.2rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.catalog-item-additional-data:last-of-type {
  margin-bottom: 0;
}

.catalog-item-additional-data > span {
  font-weight: bold;
  display: inline-block;
  position: relative;
}

.catalog-item-additional-data > a {
  color: var(--font-color-medium);
}

.catalog-item-additional-data > a:hover {
  color: var(--font-color-blue);
}

.catalog-item-age-rating-icons {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 0.4rem 0;
}

.catalog-item-age-rating-icons img {
  height: 6.4rem !important;
  margin: 0.4rem 0.8rem 0.4rem 0;
  display: block;
}

.catalog-pagination {
  width: 100%;
  text-align: center;
}

.catalog-pagination > .gradient-separator {
  margin-top: 4.8rem;
}

.pagination-container {
  margin-top: 4.8rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.pagination-to-previous-page,
.pagination-to-next-page {
  display: block;
  width: 4rem;
  height: 4rem;
  position: relative;
  cursor: auto;
}

.pagination-to-previous-page.is_active,
.pagination-to-next-page.is_active {
  cursor: pointer;
}

.pagination-to-previous-page:before,
.pagination-to-next-page:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: url('../icons/arrowup_icon_grey.svg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 4rem;
}

.pagination-to-previous-page:before {
  transform: rotate(270deg);
}

.pagination-to-next-page:before {
  transform: rotate(90deg);
}

.pagination-to-previous-page.is_active:before,
.pagination-to-next-page.is_active:before {
  background-image: url('../icons/arrowup_icon_white.svg');
}

.pagination-to-previous-page.is_active:hover:before,
.pagination-to-previous-page.is_active:active:before,
.pagination-to-next-page.is_active:hover:before,
.pagination-to-next-page.is_active:active:before {
  background-image: url('../icons/arrowup_icon_gradient.svg');
}

.pagination-information {
  color: var(--font-color-white);
  padding: 0 2rem;
}

.product-main-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  --margin-left-for-content-container: 0;
}

.product-first-container {
  width: 100%;
}

.product-second-container {
  width: 100%;
}

.product-second-container .first-sub-container,
.product-second-container .second-sub-container {
  width: 100%;
  padding: 2rem;
  background-color: var(--background-color-3-op-65);
  margin-bottom: 0;
}

.product-second-container .first-sub-container {
  min-height: 48rem;
}

.product-main-container .catalog-data-layout-2 {
  align-items: flex-start;
}

.product-name {
  color: var(--font-color-light);
  font-size: 2rem;
  margin-bottom: 0.8rem;
}

.product-content-container {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: 2rem;
  padding-left: 2rem;
  padding-top: 10rem;
  position: relative;
}

.base-product-content {
  background-color: rgba(71,29,75,0.85);
  padding: 2.2rem;
  color: var(--font-color-white);
  margin-bottom: 8rem;
  display: flex;
  flex-direction: column;
  line-height: 1.75;
}

.my-affiliate-sub-container {
  background-color: rgba(71,29,75,0.85);
  padding: 2.2rem;
  color: var(--font-color-white);
  margin: 2rem 0;
  display: flex;
  flex-direction: column;
}

.my-affiliate-sub-container .my-affiliate-program-code {
  margin-top: 2rem;
  padding-right: 4.2rem;
}

.my-affiliate-sub-container .my-affiliate-program-code-copy {
  bottom: initial;
  top: 0.4rem;
}

.my-affiliate-sub-container .my-affiliate-program-code-copy:after {
  background-image: url(../icons/copy_icon_white.svg);
}

.base-product-content > span {
  display: block;
}

.base-product-content > a {
  color: var(--font-color-white);
  border-bottom: 0.1rem solid var(--font-color-white);
  display: inline-block;
  width: fit-content;
}

.product-content-header {
  display: flex;
  margin-bottom: 7rem;
  margin-top: 5.2rem;
  overflow-x: scroll;
  overflow-y: hidden;
  scrollbar-width: none;
}

.product-content-header::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.product-content-header-title {
  position: relative;
  font-size: 2.5rem;
  font-weight: 400;
  line-height: 1.1;
  margin-bottom: 0;
  margin-right: 4.4rem;
  padding-right: 4.4rem;
}

.product-content-header-title:after {
  content: '';
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateX(-50%) translateY(-47%);
  height: 75%;
  width: 2px;
  background-color: var( --border-color);
}

.product-content-header-title:last-child {
  margin-right: 0;
  padding-right: 0;
}

.product-content-header-title:last-child:after {
  content: none;
}

.product-content {

}

.product-legal-content {
  margin: 2rem 0;
  color: var(--font-color-medium) !important;
  font-size: 90%;
}

.system-requirements-container {
  display: flex;
  flex-direction: column;
}

.system-requirements-item {
  display: flex;
  flex-direction: column;
  margin-bottom: 1.6rem;
  font-size: 1.6rem;
  font-weight: bold;
  color: var(--font-color-light)
}

.system-requirements-item > span {
  width: 18rem;
  max-width: 18rem;
  min-width: 18rem;
}

.system-requirements-item:last-child {
  margin-bottom: 0;
}

.system-requirements-title {
  text-transform: uppercase;
  color: var(--font-color-light);
  font-weight: bold;
  margin-bottom: 2rem;
}

.system-requirements-item + .system-requirements-title {
  margin-top: 4rem;
}

.catalog-item-additional-data i.icon {
  width: 2.2rem;
  height: 2.2rem;
  display: inline-block;
  margin: 0 1rem;
}

.catalog-item-additional-data i.icon:first-of-type {
  margin-left: 0;
}

.catalog-item-additional-data i.icon:before {
  width: 100%;
  height: 100%;
  top: calc(50% + 0.3rem);
}

.catalog-item-additional-data .check-region,
.catalog-item-additional-data .uncheck-region {
  padding-left: 3rem;
  position: relative;
}

.catalog-item-additional-data .check-region,
.catalog-item-additional-data .instant-delivery {
  color: var(--font-color-blue);
  margin-right: 2rem;
}

.catalog-item-additional-data .instant-delivery {
  padding-left: 3.8rem;
}

.catalog-item-additional-data .uncheck-region {
  color: red;
}

.catalog-item-additional-data .check-region.icon-check:before,
.catalog-item-additional-data .instant-delivery.icon-instant-delivery:before,
.catalog-item-additional-data .uncheck-region.icon-uncheck:before {
  left: 0;
  transform: translateY(-50%);
  width: 3rem;
  height: 2rem;
  background-position-x: left;
  background-size: 2rem;
}

.catalog-item-additional-data .instant-delivery.icon-instant-delivery:before {
  width: 3.6rem;
  height: 3rem;
  background-size: 3rem;
}

@media (min-width: 576px) {
  .catalog-item {
    width: calc(50% - 2rem);
    max-width: calc(50% - 2rem);
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .catalog[data-version="2"] > .catalog-item {
    width: calc(50% - 2rem);
    max-width: calc(50% - 2rem);
    margin-bottom: 5rem;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1),
  .catalog[data-version="2"] > .catalog-item:nth-child(2) {
    width: calc(100% - 2rem);
    max-width: calc(100% - 2rem);
    flex-direction: column;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) .catalog-image-ratio-container:before,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .catalog-image-ratio-container:before {
    margin-bottom: 2.4rem;
  }

  .catalog[data-version="2"] > .catalog-item:not(:nth-child(1)):not(:nth-child(2)) .catalog-image-ratio-container:before {
    width: 100%;
    padding-bottom: 57.31%;
    margin-left: 0;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) .catalog-release-layout,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .catalog-release-layout {
    bottom: 2.4rem;
  }

  .catalog[data-version="2"] > .catalog-item:not(:nth-child(1)):not(:nth-child(2)) .catalog-item-image {
    left: 0;
    width: 100%;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) .catalog-data-layout-1,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .catalog-data-layout-1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 2.4rem;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) .catalog-item-name,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .catalog-item-name {
    text-align: center;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) .catalog-item-name h1 a,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .catalog-item-name h1 a,
  .catalog[data-version="2"] > .catalog-item:nth-child(1) .catalog-item-name h1,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .catalog-item-name h1 {
    font-size: 2.5rem;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) .catalog-data-layout-2,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .catalog-data-layout-2 {
    flex-direction: row-reverse;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) .catalog-item-prices,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .catalog-item-prices {
    justify-content: flex-end;
    align-items: flex-end;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) .catalog-item-full-price,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .catalog-item-full-price {
    font-size: 2.0rem;
    margin-bottom: 1rem;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) .catalog-item-sale-price,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .catalog-item-sale-price {
    font-size: 5.5rem;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) .button.small-button,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .button.small-button {
    height: 3.8rem;
    line-height: 3.8rem;
    font-size: 1.5rem;
    padding: 0 1.8rem;
  }
}
@media (min-width: 768px) {
  .catalog-page-sidebar {
    display: block;
    margin: 0 1rem;
    width: 22rem;
    min-width: 22rem;
    max-width: 22rem;
  }

  .catalog-mobile-sidebar-title,
  .catalog-mobile-sidebar-footer {
    display: none;
  }

  .catalog-page-content {
    width: calc(100% - 26rem);
  }

  .catalog-tag .catalog-page-content {
    width: calc(100% + 2rem);
    margin-left: -1rem;
  }

  .catalog-header {
    padding: 0 1rem;
    display: flex;
  }

  .catalog-mobile-header {
    display: none;
  }

  .catalog {
    padding: 0;
  }

  .catalog-item {
    width: calc(33.333333% - 2rem);
    max-width: calc(33.333333% - 2rem);
  }

  .catalog[data-version="2"] > .catalog-item {
    width: calc(100% - 2rem);
    max-width: calc(100% - 2rem);
    margin-bottom: 5rem;
    flex-direction: row;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(even) {
    flex-direction: row-reverse;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1),
  .catalog[data-version="2"] > .catalog-item:nth-child(2) {
    width: calc(50% - 2rem);
    max-width: calc(50% - 2rem);
    flex-direction: column;
  }

  .catalog-page .catalog-item {
    width: calc(50% - 2rem);
    max-width: calc(50% - 2rem);
  }

  .catalog[data-version="catalog-1"] .catalog-item:nth-last-child(-n+2) {
    margin-bottom: 2rem;
  }

  .catalog[data-version="2"] > .catalog-item:not(:nth-child(1)):not(:nth-child(2)) .catalog-image-container {
    width: calc(50% - 1rem);
    max-width: calc(50% - 1rem);
  }

  .catalog[data-version="2"] > .catalog-item:not(:nth-child(1)):not(:nth-child(2)) .catalog-data-container {
    width: calc(50% - 1rem);
    max-width: calc(50% - 1rem);
  }

  .catalog[data-version="2"] .catalog-image-ratio-container:before {
    width: 100%;
    padding-bottom: 57.31%;
    margin-left: 0;
  }

  .catalog[data-version="2"] > .catalog-item:not(:nth-child(1)):not(:nth-child(2)) .catalog-image-ratio-container:before {
    margin-bottom: 0;
  }

  .catalog[data-version="2"] > .catalog-item:not(:nth-child(1)):not(:nth-child(2)) .catalog-release-layout {
    bottom: 0;
  }

  .catalog[data-version="2"] .catalog-item-image {
    left: 0;
    width: 100%;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-item-discount-label {
    right: 2rem;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-data-layout-1 {
    margin-bottom: 1.2rem;
    justify-content: flex-start;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-item-activations {
    margin-left: 2rem;
  }

  .catalog-item-description {
    font-size: 1.25rem;
    line-height: 1.8;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
  }

  .catalog[data-version="2"] > .catalog-item:not(:nth-child(1)):not(:nth-child(2)) .catalog-item-description {
    margin-bottom: 0;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-item-full-price {
    font-size: 2rem;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-item-sale-price {
    font-size: 5.5rem;
  }

  .system-requirements-item {
    flex-direction: row;
  }
}
@media (min-width: 992px) {
  .catalog-page-sidebar {
    width: 24rem;
    min-width: 24rem;
    max-width: 24rem;
  }

  .catalog-page-content {
    width: calc(100% - 28rem);
  }

  .catalog-tag .catalog-page-content {
    width: calc(100% + 2rem);
    margin-left: -1rem;
  }

  .catalog-page .catalog-item {
    width: calc(33.333333% - 2rem);
    max-width: calc(33.333333% - 2rem);
  }

  .catalog-page .catalog[data-version="3"] .catalog-item {
    width: calc(50% - 2rem);
    max-width: calc(50% - 2rem);
  }

  .catalog[data-version="catalog-1"] .catalog-item:nth-last-child(-n+3) {
    margin-bottom: 2rem;
  }

  .catalog-page.catalog-tag .catalog-item {
    width: calc(50% - 2rem);
    max-width: calc(50% - 2rem);
  }

  .product-main-container {
    flex-direction: row-reverse;
  }

  .product-first-container {
    flex: 1 1 72%;
    min-width: 72%;
    max-width: 72%;
  }

  .product-second-container {
    flex: 1 1 28%;
    min-width: 28%;
    max-width: 28%;
  }

  .product-second-container .second-sub-container {
    margin-top: 10rem;
  }

  .product-content-container {
    width: calc(100% - 6rem);
    margin-right: 4rem;
    padding-left: 0;
    padding-right: 0;
  }
}
@media (min-width: 1200px) {
  .catalog-page-sidebar {
    width: 28rem;
    min-width: 28rem;
    max-width: 28rem;
  }

  .catalog-page-content {
    width: calc(100% - 32rem);
  }

  .catalog-tag .catalog-page-content {
    width: calc(100% + 2rem);
    margin-left: -1rem;
  }

  .catalog-item {
    width: calc(25% - 2rem);
    max-width: calc(25% - 2rem);
  }

  .catalog-page .catalog-item {
    width: calc(33.333333% - 2rem);
    max-width: calc(33.333333% - 2rem);
  }

  .catalog-page .catalog[data-version="3"] .catalog-item {
    width: calc(50% - 2rem);
    max-width: calc(50% - 2rem);
  }

  .catalog[data-version="catalog-1"] .catalog-item:nth-last-child(-n+3) {
    margin-bottom: 2rem;
  }

  .catalog-page.catalog-tag .catalog-item {
    width: calc(50% - 2rem);
    max-width: calc(50% - 2rem);
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1),
  .catalog[data-version="2"] > .catalog-item:nth-child(2) {
    width: calc(50% - 3.5rem);
    max-width: calc(50% - 3.5rem);
    margin-bottom: 9.8rem;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) {
    margin-right: 2.5rem;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(2) {
    margin-left: 2.5rem;
  }

  .catalog[data-version="2"] > .catalog-item:not(:nth-child(1)):not(:nth-child(2)) .catalog-image-container {
    width: calc(50% - 3.5rem);
    max-width: calc(50% - 3.5rem);
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) .catalog-image-ratio-container:before,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .catalog-image-ratio-container:before {
    margin-bottom: 2.5rem;
  }

  .catalog[data-version="2"] > .catalog-item:not(:nth-child(1)):not(:nth-child(2)) .catalog-data-container {
    width: calc(50% - 3.5rem);
    max-width: calc(50% - 3.5rem);
    justify-content: flex-end;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) .catalog-release-layout,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .catalog-release-layout {
    bottom: 2.5rem;
  }

  .catalog-data-layout-1 {
    display: flex;
    margin-bottom: 2.8rem;
  }

  .catalog[data-version="2"] .catalog-data-layout-1,
  .catalog[data-version="2"] > .catalog-item:not(:nth-child(1)):not(:nth-child(2)) .catalog-data-layout-1 {
    margin-bottom: 3.6rem;
  }

  .catalog[data-version="3"] .catalog-data-layout-1 {
    margin-bottom: 1.8rem;
  }

  .catalog[data-version="3"] > .catalog-item .catalog-item-activations {
    display: flex;
  }

  .catalog[data-version="2"] > .catalog-item:not(:nth-child(1)):not(:nth-child(2)) .catalog-data-layout-2 {
    flex: 0;
  }

  .catalog-item-name {
    margin-bottom: 0;
  }

  .catalog-item-name h1 a,
  .catalog-item-name h1 {
    font-size: 1.9rem;
  }

  .catalog[data-version="2"] .catalog-item-name h1 a,
  .catalog[data-version="2"] .catalog-item-name h1 {
    font-size: 2.25rem;
  }

  .catalog-item-discount-label {
    right: 2rem;
  }

  .catalog[data-version="2"] .catalog-item-discount-label {
    width: 7.8rem;
    height: 7.7rem;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-item-discount-label {
    right: 2rem;
    font-size: 1.243rem;
    padding: 1.3rem 0.8rem;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-item-discount-label > span {
    font-size: 3.955rem;
  }

  .catalog-item-description {
    -webkit-line-clamp: 6;
  }

  .catalog[data-version="2"] > .catalog-item:nth-child(1) .catalog-item-description,
  .catalog[data-version="2"] > .catalog-item:nth-child(2) .catalog-item-description {
    flex: 1 1 100%;
  }

  .catalog[data-version="2"] > .catalog-item:not(:nth-child(1)):not(:nth-child(2)) .catalog-item-description {
    margin-bottom: 4rem;
  }

  .catalog-item-full-price {
    font-size: 1.9rem;
  }

  .catalog-item-sale-price {
    font-size: 3.0rem;
    line-height: 0.73;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-item-full-price {
    font-size: 2.641rem;
    margin-bottom: 1rem;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-item-sale-price {
    font-size: 9.055rem;
  }

  .catalog-item-additional-data-layout {
    margin: 4rem 0 0;
  }

  .catalog-item-additional-data {
    margin-bottom: 2rem;
    font-size: 2rem;
  }

  .product-information .catalog-item-additional-data-layout {
    margin: 2.4rem 0 0;
  }

  .product-information .catalog-image-container {
    margin-bottom: 0;
  }

  .product-information .catalog-item-additional-data {
    margin-bottom: 1.2rem;
  }

  .product-content-container {
    width: calc(100% - 6rem);
  }

  .product-content-header-title {
    font-size: 2.8rem;
  }

  .buy-and-earn-btn {
    width: calc(100% - 2.71rem);
  }

  .buy-and-earn-btn:after {
    content: '';
    position: absolute;
    background-image: url('../icons/buy_and_earn.png');
    background-repeat: no-repeat;
    height: 2.1rem;
    width: 2.7rem;
    display: block;
    top: 0;
    right: 0;
    transform: translateX(100%);
  }
}
@media (min-width: 1440px) {
  .catalog-page-sidebar {
    width: 30rem;
    min-width: 30rem;
    max-width: 30rem;
  }

  .catalog-page-content {
    width: calc(100% - 34rem);
  }

  .catalog-tag .catalog-page-content {
    width: calc(100% + 2rem);
    margin-left: -1rem;
  }

  .catalog-page .catalog[data-version="3"] .catalog-item {
    width: calc(33.333333% - 2rem);
    max-width: calc(33.333333% - 2rem);
  }

  .catalog-item-discount-label {
    right: 3rem;
  }

  .catalog-item-additional-data > i.icon {
    width: 2.2rem;
    height: 2.2rem;
  }

  .catalog-item-additional-data .check-region,
  .catalog-item-additional-data .uncheck-region {
    padding-left: 3.2rem;
  }

  .catalog-item-additional-data .instant-delivery {
    padding-left: 4rem;
  }

  .catalog-item-additional-data .check-region.icon-check:before,
  .catalog-item-additional-data .uncheck-region.icon-uncheck:before {
    width: 3.2rem;
    height: 2.2rem;
    background-size: 2.2rem;
  }

  .catalog-item-additional-data .instant-delivery.icon-instant-delivery:before {
    width: 4rem;
    height: 3.2rem;
    background-size: 3.2rem;
  }

  .product-main-container {
    --margin-left-for-content-container: calc(50vw - 64.3rem);
  }

  .product-content-container {
    width: calc(100% - var(--margin-left-for-content-container));
  }

  .product-name {
    font-size: 2.5rem;
    margin-bottom: 2rem;
  }

  .product-information .catalog-item-additional-data-layout {
    margin: 4rem 0 0;
  }

  .product-information .catalog-image-container {
    margin-bottom: 3.2rem;
  }

  .product-information .catalog-item-additional-data {
    margin-bottom: 2rem;
  }

  .catalog-review-container {
    --star-size: 2.6rem;
  }
}
@media (min-width: 1660px) {
  .catalog-item-additional-data-layout {
    margin: 6rem 0 0;
  }

  .catalog-item-additional-data {
    font-size: 2.5rem;
    margin-bottom: 2.5rem;
  }

  .product-name {
    color: var(--font-color-light);
    font-size: 3.8rem;
    font-weight: normal;
  }

  .product-information .catalog-item-additional-data {
    margin-bottom: 2.2rem;
  }

  .product-information .catalog-item-additional-data:last-child {
    margin-bottom: 0;
  }

  .product-information .catalog-item-additional-data-layout {
    margin: 4rem 0 0;
  }
}
@media (min-width: 1900px) {
  .catalog-page-sidebar {
    width: 36rem;
    min-width: 36rem;
    max-width: 36rem;
  }

  .catalog-page-content {
    width: calc(100% - 40rem);
  }

  .catalog-tag .catalog-page-content {
    width: calc(100% + 2rem);
    margin-left: -1rem;
  }

  .catalog-item-discount-label {
    right: 4rem;
    width: 6.8rem;
    height: 6.7rem;
    font-size: 1.1rem;
  }

  .catalog-item-discount-label > span {
    font-size: 3.5rem;
    margin-top: 0.6rem;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-item-discount-label {
    right: 4rem;
    width: 10.4rem;
    height: 10.2rem;
    font-size: 1.65rem;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-item-discount-label > span {
    font-size: 5.25rem;
    margin-top: 0.6rem;
  }

  .catalog-data-layout-1 {
    margin-bottom: 3.2rem;
  }

  .catalog-item-activation.icon {
    width: 2.2rem;
    height: 2.2rem;
  }

  .catalog-image-ratio-container:before {
    margin-bottom: 2rem;
  }

  .catalog-release-layout {
    bottom: 2rem;
  }

  .catalog[data-version="2"] .catalog-data-layout-1,
  .catalog[data-version="2"] > .catalog-item:not(:nth-child(1)):not(:nth-child(2)) .catalog-data-layout-1 {
    margin-bottom: 4.6rem;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-data-layout-1 {
    align-items: center;
  }

  .catalog[data-version="3"] .catalog-data-layout-1 {
    margin-bottom: 1.8rem;
  }

  .catalog-item-name h1 a,
  .catalog-item-name h1 {
    font-size: 2.5rem;
  }

  .catalog[data-version="2"] .catalog-item-name h1 a,
  .catalog[data-version="2"] .catalog-item-name h1 {
    font-size: 3rem;
  }

  .catalog-item-description {
    font-size: 1.6rem;
    line-height: 1.875;
  }

  .catalog-item-full-price {
    font-size: 2.5rem;
    margin-bottom: 1.3rem;
  }

  .catalog-item-sale-price {
    font-size: 4.0rem;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-item-full-price {
    font-size: 3.5rem;
  }

  .catalog[data-version="2"] > .catalog-item .catalog-item-sale-price {
    font-size: 12.0rem;
  }

  .catalog-item-additional-data {
    margin-bottom: 3.2rem;
  }

  .product-main-container {
    --margin-left-for-content-container: calc(50vw - 82rem);
  }

  .product-second-container .first-sub-container,
  .product-second-container .second-sub-container {
    padding: 2.6rem;
  }

  .product-content-header-title {
    font-size: 3rem;
  }
}

.blog {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 0;
  margin: 0 -1rem;
  width: calc(100% + 2rem);
  color: var(--font-color-light);
}

.blog.news-and-update {
  padding: 0 2rem;
}

.blog.home-page-blog {
  margin: 0;
  width: 100%;
}

.blog-item {
  position: relative;
  width: calc(100% - 2rem);
  max-width: calc(100% - 2rem);
  margin-bottom: 4rem;
  margin-right: 1rem;
  margin-left: 1rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.blog.home-page-blog .blog-item-shadow-layout {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 15rem 1.5rem .5rem;
  background: rgb(0,0,0);
  background: linear-gradient(0deg, rgba(10,10,10,0.95) 15%, rgba(255,255,255,0) 90%);
  display: flex;
  justify-content: space-between;
  color: var(--font-color-light);
}

.blog-item-image-container {
  position: relative;
  width: 100%;
  margin-bottom: 1.6rem;
}

.blog-item-data-container {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
}

.blog-item-image-ratio-container {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

.blog-item-image-ratio-container:before {
  content: '';
  display: block;
  height: 0;
  width: 100%;
  padding-bottom: 57.31%;
}

.blog-item-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.blog-item-title {
  font-size: 2rem;
  font-weight: bold;
  line-height: 1;
  color: var(--font-color-white);
  overflow-wrap: anywhere;
  min-width: 100%;
}

.blog.home-page-blog .blog-item-title {
  font-size: 1.8rem;
}

.blog-item-title a {
  color: var(--font-color-white);
}

.blog-item-lead {
  color: var(--font-color-light);
  margin-bottom: 1.6rem;
  min-width: 100%;
}

.blog-item-published-date {
  font-size: 1.6rem;
}

.blog-item-number-views {
  display: flex;
  align-items: center;
  font-size: 1.6rem;
}

.blog-item-number-views:before {
  content: '';
  display: inline-block;
  width: 2.6rem;
  height: 2rem;
  background-image: url('../icons/views_icon_light.svg');
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 2rem;
}

.blog.news-and-update .blog-item-published-date {
  font-size: 2rem;
  color: var(--font-color-medium);
  margin-bottom: 0.4rem;
}

.blog.news-and-update .blog-item-title {
  font-size: 3rem;
  line-height: 1.25;
  min-height: 7.5rem;
}

.blog.news-and-update .blog-item-more-button-container {
  width: 100%;
  display: flex;
  justify-content: flex-end;
}

.blog.news-and-update .blog-read-more-btn {
  font-size: 2rem;
  color: var(--font-color-blue);

}

.loading {
  width: 100%;
  height: 6.4rem;
  margin-top: 4.8rem;
  background-size: 4.8rem;
  background-image: url('../icons/loading.svg');
  background-repeat: no-repeat;
  background-position: center;
}

.faq {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  width: calc(100% + 2rem);
  margin: 0 -1rem;
}

.faq-item {
  width: calc(50% - 2rem);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1.6rem 1rem 2rem;
  background-color: var(--background-color-2);
  margin: 1rem;
  cursor: pointer;
}

.faq-item-image {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 2.4rem;
}

.faq-item-image img {
  height: 7rem;
  display: block;
}

.faq-item-title {
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1;
  text-align: center;
  margin-bottom: 1rem;
}

.faq-item-title a,
.faq-item-title a:hover {
  color: var(--font-color-light);
}

.faq-answer {
  display: flex;
  flex-direction: column;
}

.faq-answer-item {
  display: block;
}

.faq-answer-item-title {
  display: block;
  font-size: 1.7rem;
  font-weight: bold;
  color: var(--font-color-light);
  line-height: 1.4;
  margin-bottom: 1.5rem;
  border-bottom: 0.1rem solid var(--border-color);
}

.faq-answer-item-content {
  flex-direction: column;
  margin-bottom: 2rem;
  color: var(--font-color-light);
}

.social-share {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.static-social-share {
  margin-bottom: 3rem;
}

.social-share-headline {
  color: var(--font-color-blue);
  padding: 0 2rem;
}

.social-share-container {
  display: flex;
  padding: 0 1rem;
}

.social-share-item {
  background-position: center top;
  background-repeat: no-repeat;
  background-size: 2.6rem;
  width: fit-content;
  min-width: 2.6rem;
  padding-top: 2.6rem;
  display: block;
  margin: 1rem;
}

.social-share-item:hover {

}

@media (min-width: 768px) {
  .social-share-headline {
    padding: 0 1rem;
  }

  .social-share-container {
    padding: 0;
  }
}

@media (min-width: 992px) {
  .blog.home-page-blog {
    margin: 0 -1rem;
    width: calc(100% + 2rem);
  }

  .blog-item {
    width: calc(50% - 3rem);
    max-width: calc(50% - 3rem);
  }

  .blog.home-page-blog .blog-item {
    width: calc(33.333333% - 3rem);
    max-width: calc(33.333333% - 3rem);
    justify-content: flex-start;
  }

  .blog.home-page-blog .blog-item-title {
    min-width: 78%;
    width: 78%;
    font-size: 2.4rem;
  }

  .faq-item {
    width: calc(33.333333% - 2rem);
  }
}

@media (min-width: 1200px) {
  .faq-item-image img {
    height: 14.8rem;
  }

  .faq-item-title {
    font-size: 3rem;
  }

  .faq-answer-item-title {
    font-size: 2.3rem;
  }

  .social-share-item {
    background-size: 3.6rem;
    min-width: 3.6rem;
    padding-top: 3.6rem;
  }
}

@media (min-width: 1440px) {
  .static-social-share {
    position: absolute;
    right: 17.5%;
    transform: translateX(50%);
    flex-direction: column;
  }

  .social-share-container {
    flex-direction: column;
  }

  .social-share-headline {
    display: none;
  }
}

@media (min-width: 1900px) {
  .faq {
    width: calc(100% + 4rem);
    margin: 0 -2rem;
  }

  .faq-item {
    width: calc(33.333333% - 4rem);
    margin: 2rem;
  }
}

.slider {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
}

.slider.main-slider.waiting {
  padding-bottom: calc(76.413333% + 33.865107rem);
  background: rgba(149, 98, 247, 0.19);
}

.slider-preview-container-decorator {
  overflow: hidden;
  position: relative;
  margin-bottom: 6rem;
}

.slider-preview-container {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  transform: translateX(calc(-0.466667rem - 33.3333333%))
}

.slider-preview-container.scroll-prev {
  transform: translateX(-54.8rem);
}

.slider-preview-container.scroll-next {
  transform: translateX(0rem);
}

.slider-preview-item {
  width: calc(33.333333% - 0.933333rem);
  min-width: calc(33.333333% - 0.933333rem);
  margin: 0 0.7rem;
  background-color: var(--background-color-2);
  color: var(--font-color-white);
  position: relative;
  display: flex;
  flex-direction: column;
}

.slider-preview-item:first-child {
  margin-left: 0;
}

.slider-preview-item:last-child {
  margin-right: 0;
}

.slider-preview-item-image {
  width: 100%;
  height: auto;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: relative;
}

.slider-preview-item-image picture {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
}

.slider-preview-item-image picture > img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.slider-preview-item-image:before {
  content: '';
  display: block;
  height: 0;
  width: 100%;
  padding-bottom: 57.31%;
}

.slider.coming-soon-slider .slider-preview-item-image:before {
  padding-bottom: 100%;
}

.slider-preview-item-image > .button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: none;
  z-index: 2;
}

.slider-preview-item:hover .slider-preview-item-image > .button,
.slider-preview-item:active .slider-preview-item-image > .button {
  display: block;
}

.slider-preview-info {
  padding: 1.4rem 1.0rem;
  flex: 1 1 auto;
}

.slider.coming-soon-slider .slider-preview-info {
  padding: 1.2rem 0.9rem;
  flex: 1 1 auto;
  text-align: center;
}

.slider-preview-title,
.slider-preview-title a,
.slider-preview-title a:focus,
.slider-preview-title a:hover,
.slider-preview-title a:active {
  font-weight: bold;
  font-size: 1.2rem;
  color: inherit;
  line-height: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.slider-preview-title.line-clamp-2 {
  -webkit-line-clamp: 2;
}

.slider-preview-description,
.slider-preview-description a,
.slider-preview-description a:focus,
.slider-preview-description a:hover,
.slider-preview-description a:active {
  font-size: 1.2rem;
  line-height: 1;
  font-weight: 300;
  color: inherit;
}

.slider-preview-description {
  margin-top: 0.4rem;
}

.button-alert {
  width: 2.3rem !important;
  height: 2.5rem !important;
  min-width: 2.3rem;
  padding: 0;
  line-height: 2.5rem;
}

.button-alert:hover {
  border: unset !important;
  border-width: unset !important;
}

.button-alert:before {
  width: 100% !important;
  height: 100% !important;
}

.slider-preview-button-prev,
.slider-preview-button-next {
  position: absolute;
  top: 0;
  width: 16rem;
  height: 100%;
  z-index: 10;
  visibility: hidden;
}

.slider-preview-button-prev {
  left: -1000px;
  background: linear-gradient(to right, var(--background-color-3-op-95), rgba(26,26,26,0));
}

.slider-preview-button-next {
  right: -1000px;
  background: linear-gradient(to left, var(--background-color-3-op-95), rgba(26,26,26,0));
}

@media (hover: hover) {
  .slider.screenshots-slider:hover .slider-preview-button-prev,
  .slider.coming-soon-slider:hover .slider-preview-button-prev {
    left: 0;
    visibility: visible;
  }

  .slider.screenshots-slider:hover .slider-preview-button-next,
  .slider.coming-soon-slider:hover .slider-preview-button-next {
    right: 0;
    visibility: visible;
  }
}

.slider-preview-button-prev > span,
.slider-preview-button-next > span {
  position: absolute;
  top: 50%;
  width: 18rem;
  height: 8rem;
  background-image: url('../icons/arrowup_icon_white.svg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 6rem;
  cursor: pointer;
  pointer-events: all;
}

.slider-preview-button-prev > span {
  left: -6rem;
  transform: translateY(-50%) rotate(270deg);
}

.slider-preview-button-next > span {
  right: -6rem;
  transform: translateY(-50%) rotate(90deg);
}

.slider-preview-button-prev > span:hover,
.slider-preview-button-prev > span:active,
.slider-preview-button-next > span:hover,
.slider-preview-button-next > span:active {
  background-image: url('../icons/arrowup_icon_gradient.svg');
}

.slider.main-slider .slider-preview-container-decorator,
.slider.screenshots-slider .slider-preview-container-decorator {
  padding-top: 0.2rem;
  padding-bottom: 0.2rem;
  margin-bottom: 0;
  --start-background-color: var(--gradient-second-color);
  --end-background-color: var(--gradient-first-color);
}

.slider.main-slider .slider-preview-container-decorator:before,
.slider.main-slider .slider-preview-container-decorator:after,
.slider.screenshots-slider .slider-preview-container-decorator:before,
.slider.screenshots-slider .slider-preview-container-decorator:after {
  content: '';
  position: absolute;
  left: 0;
  width: 100%;
  height: 0.2rem;
}

.slider.main-slider .slider-preview-container-decorator:before,
.slider.screenshots-slider .slider-preview-container-decorator:before {
  top: 0;
  background: linear-gradient(to left, var(--start-background-color), var(--end-background-color));  
}

.slider.main-slider .slider-preview-container-decorator:after,
.slider.screenshots-slider .slider-preview-container-decorator:after {
  bottom: 0;
  background: linear-gradient(to right, var(--start-background-color), var(--end-background-color));  
}

.slider.main-slider .slider-preview-info {
  width: 100%;
  background-color: var(--background-color-3-op-95);
  color: var(--font-color-medium);
  z-index: 2;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.slider.main-slider .slider-preview-item,
.slider.screenshots-slider .slider-preview-item {
  cursor: pointer;
}

.slider.main-slider .slider-preview-item .slider-preview-item-image:after,
.slider.screenshots-slider .slider-preview-item .slider-preview-item-image:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--background-color-3-op-65);
  z-index: 1;
}

.slider.screenshots-slider .slider-preview-item .slider-preview-item-image.slider-preview-item-youtube-cover:after {
  background-image: url('../icons/youtube-play-btn.svg');
  background-size: 30%;
  background-repeat: no-repeat;
  background-position: center;
}

.slider.screenshots-slider .slider-preview-item.is_active .slider-preview-item-image.slider-preview-item-youtube-cover:after,
.slider.screenshots-slider .slider-preview-item .slider-preview-item-image.slider-preview-item-youtube-cover:hover:after {
  background-image: none;
}

.slider.main-slider .slider-preview-item.is_active .slider-preview-item-image:after,
.slider.main-slider .slider-preview-item:hover .slider-preview-item-image:after,
.slider.screenshots-slider .slider-preview-item.is_active .slider-preview-item-image:after,
.slider.screenshots-slider .slider-preview-item:hover .slider-preview-item-image:after {
  background-color: transparent;
}

.slider.main-slider .slider-preview-button-prev,
.slider.main-slider .slider-preview-button-next {
  top: 50%;
  transform: translateY(-50%);
  height: calc(100% - 0.4rem);
}

.slider.coming-soon-slider .slider-preview-item .slider-preview-item-image .layout-for-hover {
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  background-color: var(--background-color-3-op-95);
  z-index: 1;
  cursor: pointer;
}

.slider.coming-soon-slider .slider-preview-item:hover .slider-preview-item-image .layout-for-hover,
.slider.coming-soon-slider .slider-preview-item:active .slider-preview-item-image .layout-for-hover {
  width: 100%;
  height: 100%;
}

.slider-content-container {
  width: 100%;
  display: flex;
  flex-direction: row;
  position: relative;
}

.slider-content-main,
.slider-content-main-screenshots {
  flex: 1 1 auto;
  height: auto;
}

.slider-content-main.simple-banner {
  flex: 1 1 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
}

.slider-content-additional {
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 7.2rem;
}

.slider-content-additional.products-slider {
  bottom: 0;
}

.slider-content-main-product,
.slider-content-additional-product,
.slider-content-main-banner,
.slider-content-main-screenshot {
  width: 100%;
  height: 100%;
  background-position-x: 0;
  background-position-y: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.slider-content-main-product {
  aspect-ratio: 1.744903;
  background-color: rgba(149, 98, 247, 0.19);
}

.slider-content-additional-product {
  background-size: 0;
}

.slider-content-main-product,
.slider-content-main-banner,
.slider-content-main-screenshot {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  margin-bottom: 0;
  cursor: pointer;
}

.simple-banner .slider-content-main-banner {
  margin-bottom: 0;
  background-position: center;
}

.slider-content-main-screenshot {
  margin-bottom: 0;
  background-size: contain;
  background-position: center;
  cursor: initial;
  background-color: var(--background-color-3-op-65);
  overflow: hidden;
  aspect-ratio: 16/9;
}

.slider-content-main-screenshot iframe,
.youtube-player-container {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.youtube-player-container button {
  width: 100%;
  height: 100%;
  object-fit: cover;
  cursor: pointer;
  padding: 0;
  margin: 0;
}

.youtube-player-container button:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 15rem;
  height: 15rem;
  transform: translate(-50%, -50%);
  background-image: url('../icons/youtube-play-btn.svg');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 15rem 15rem;
  background-color: rgba(204, 204, 204, 0.2);
}

.youtube-player-container button:hover:before {
  background-image: url('../icons/youtube-play-btn-blue.svg');
}

.youtube-player-container button img {
  width: 100%;
  height: 100%;
  display: block;
}

.youtube-player-container iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  border: none;
  margin-left: 0;
  outline: none;
}

.youtube-player-container iframe.active {
  opacity: 1;
}

.youtube-btn-container {
  position: relative;
  z-index: 2;
}

.youtube-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
}

.slider-content-main-screenshot picture,
.slider-content-main-product picture {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  z-index: 1;
  aspect-ratio: 1.744903;
}

.slider-content-main-screenshot picture > img,
.slider-content-main-product picture > img {
  display: block;
  width: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
  aspect-ratio: 1.744903;
}

.slider-content-main-product:before,
.slider-content-main-banner:before,
.slider-content-main-screenshot:before {
  content: '';
  display: block;
  height: 0;
  width: 100%;
  padding-bottom: 57.31%;
}

.simple-banner .slider-content-main-banner:before {
  padding-bottom: calc(57.31% + 29rem);
}

.slider-content-main-screenshot:before {
  padding-bottom: 56.25%;
}

.slider-content-layouts {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 29rem;
  transform: translateY(100%);
  padding: 2rem;
  background: var(--background-color-3-op-65);
  background: linear-gradient(to top, rgba(0,0,0,1), rgba(0,0,0,0) 60%), var(--background-color-3-op-65);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  z-index: 2;
}

.slider-content-layout-1 {

}

.slider-content-layout-2 {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-end;
  flex-direction: row-reverse;
}

.slider-content-buttons {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}

.slider-content-notification,
.slider-content-name,
.slider-content-description {
  width: 100%;
  text-align: center;
}

.slider-content-notification {
  font-size: 1.8rem;
  line-height: 1;
  font-weight: 300;
  color: var(--font-color-medium);
  margin-bottom: 0.5rem;
}

.slider-content-name {
  font-size: 2.5rem;
  line-height: 1;
  font-weight: bold;
  color: var(--font-color-white);
  margin-bottom: 2rem;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  cursor: pointer;
}

.slider-content-description {
  font-size: 1.4rem;
  color: var(--font-color-white);
  line-height: 1.5;
  height: 6.3rem;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.slider-content-prices {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.slider-content-full-price {
  font-size: 1.4rem;
  font-weight: 300;
  color: var(--font-color-dark);
  text-decoration: line-through;
  line-height: 1;
  margin-bottom: 0.8rem;
}

.slider-content-price {
  font-size: 3.2rem;
  font-weight: 600;
  color: var(--font-color-blue);
  line-height: 0.75;
}

.slider-content-additional-container {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 0 2rem;
}

.products-slider .slider-content-additional-container {
  height: 29rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding-top: 3.8rem;
  background: var(--background-color-3-op-65);
  background: linear-gradient(to top, rgba(0,0,0,1), rgba(0,0,0,0) 60%), var(--background-color-3-op-65);
}

.slider-content-additional-title {
  font-size: 2rem;
  font-weight: 600;
  color: var(--font-color-white);
  margin-bottom: 1.5rem;
  display: none;
}

.products-slider .slider-content-additional-title {
  display: block;
  width: 100%;
  text-align: center;
  font-size: 2.5rem;
}

.slider-content-screenshots-container {
  flex-wrap: wrap;
  margin-bottom: 2rem;
  display: none;
}

.products-slider .slider-content-screenshots-container {
  display: flex;
  width: 100%;
  justify-content: space-between;
  flex-wrap: nowrap;
  margin-bottom: 0;
}

.slider-content-screenshot {
  width: calc(50% - 0.5rem);
  max-width: 18.2rem;
  height: auto;
  margin: 0.5rem 1rem 0.5rem 0;
  position: relative;
}

.slider-content-screenshot:nth-child(even) {
  margin-right: 0;
}

.products-slider .slider-content-screenshot {
  display: none;
  max-width: 50%;
  margin-right: 0;
}

.products-slider .slider-content-screenshot:nth-child(1),
.products-slider .slider-content-screenshot:nth-child(2) {
  display: block;
}

.products-slider .slider-content-screenshot:nth-child(1) {
  margin-right: 1rem;
}

.slider-content-screenshot:before {
  content: '';
  display: block;
  height: 0;
  width: 100%;
  padding-bottom: 83.516483%;
}

.products-slider .slider-content-screenshot:before  {
  padding-bottom: 57.31%;
  margin-bottom: 1rem;
}

.products-slider .slider-content-screenshot a {
  margin-bottom: 2rem;
  display: inline-block;
  color: white;
  font-size: 1.4rem;
}

.slider-content-screenshot img {
  position: absolute;
  left: 0;
  top: 0;
  inset: 0px;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.products-slider .slider-content-screenshot img {
  height: auto;
}

.slider-content-additional-data {
  font-size: 1.4rem;
  color: var(--font-color-medium);
  font-weight: 300;
  margin-bottom: 0.6rem;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.slider-content-additional-data > span {
  font-weight: bold;
  display: block;
  margin-right: 0.5rem;
}

.slider-content-additional-data > i.icon {
  width: 2rem;
  height: 2rem;
  display: inline-block;
  margin: 0 0.7rem;
}

.slider-content-additional-data > i.icon:first-of-type {
  margin-left: 0;
}

.slider-content-additional-data > i.icon:before {
  width: 100%;
  height: 100%;
  top: calc(50% + 0.2rem);
}

.slider-content-main {
  margin-bottom: 29rem;
}

.slider-content-main-banner {
  display: flex;
  align-items: flex-end;
  cursor: pointer;
}

.banner-countdown-timer-container {
  position: absolute;
  color: white;
  background-color: rgba(26,26,26,0.65);
  padding: 1rem;
  z-index: 2;
}

.banner-countdown-timer-container.tl {
  left: 0;
  top: 0;
}

.banner-countdown-timer-container.tr {
  right: 0;
  top: 0;
  display: block;
  flex-flow: initial;
  border-bottom: none;
  min-width: initial;
}

.banner-countdown-timer-container.bl {
  left: 0;
  bottom: 0;
}

.banner-countdown-timer-container.br {
  right: 0;
  bottom: 0;
}

.banner-countdown-timer-container.cc {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.banner-countdown-timer-label {
  color: var(--background-color-4);
}

.banner-countdown-timer {
  font-size: 1.7rem;
}

.slider-content-main-banner .ext-1 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 50%;
}

.slider-content-main-banner .ext-2,
.slider-content-main-banner .ext-3 {
  display: block;
}

.slider-content-main-banner .ext-2 {
  font-size: 2.5rem;
  color: var(--font-color-blue);
}

.slider-content-main-banner .ext-3 {
  font-size: 12rem;
  font-weight: 600;
  color: var(--font-color-white);
}

@media (min-width: 479px) {
  .products-slider .slider-content-screenshots-container {
    width: 90%;
  }
}

@media (min-width: 576px) {
  .slider.main-slider.waiting {
    padding-bottom: calc(71.6375% + 33.798245rem);
  }

  .products-slider .slider-content-screenshots-container {
    width: 80%;
  }

  .products-slider .slider-content-screenshot a {
    font-size: 1.2rem;
  }

  .slider-content-full-price {
    font-size: 2rem;
  }

  .slider-preview-container {
    transform: translateX(calc(-0.35rem - 25%));
  }

  .slider-preview-container.scroll-prev {
    transform: translateX(calc(0.35rem + 25%));
  }

  .slider-preview-item {
    width: calc(25% - 1.05rem);
    min-width: calc(25% - 1.05rem);
  }

  .slider.coming-soon-slider .slider-preview-info {
    padding: 1.2rem 1.6rem 1.2rem 0.9rem;
    flex: 1 1 auto;
    text-align: left;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .slider-preview-description {
    margin-top: 0.8rem;
  }

  .button-alert {
    margin-left: 0.4rem;
  }
}
@media (min-width: 640px) {
  .products-slider .slider-content-screenshot:nth-child(2) {
    margin-right: 1rem;
  }

  .products-slider .slider-content-screenshot:nth-child(3) {
    display: block;
  }
}
@media (min-width: 768px) {
  .slider.main-slider.waiting {
    padding-bottom: calc(66.861666% + 33.731383rem);
  }

  .banner-countdown-timer {
    font-size: 2rem;
  }

  .slider-preview-container {
    transform: translateX(calc(-0.233334rem - 16.666666%));
  }

  .slider-preview-container.scroll-prev {
    transform: translateX(calc(0.233334rem + 16.666666%));
  }

  .slider.coming-soon-slider .slider-preview-container {
    transform: translateX(calc(-0.35rem - 25%));
  }

  .slider.coming-soon-slider .slider-preview-container.scroll-prev {
    transform: translateX(calc(0.35rem + 25%));
  }

  .slider-preview-item {
    width: calc(16.666666% - 1.166666rem);
    min-width: calc(16.666666% - 1.166666rem);
  }

  .slider.coming-soon-slider .slider-preview-item {
    width: calc(25% - 1.05rem);
    min-width: calc(25% - 1.05rem);
  }
}
@media (min-width: 992px) {
  .slider.main-slider.waiting {
    padding-bottom: calc(50.146249% + 4.731383rem);
  }

  .slider.screenshots-slider {
    border-right: 4px solid var(--background-color-2);
  }

  .slider-content-main {
    flex: 1 1 75%;
    min-width: 75%;
    max-width: 75%;
    margin-bottom: 0;
  }

  .slider-content-additional {
    position: relative;
    left: initial;
    bottom: initial;
  }

  .slider-content-main-product,
  .slider-content-main-banner {
    margin-bottom: 0;
  }

  .simple-banner .slider-content-main-banner:before {
    padding-bottom: 41.355%;
  }

  .slider-content-layouts {
    transform: initial;
    flex-direction: row;
    height: auto;
  }

  .slider-content-layout-1 {
    margin-right: 2rem;
  }

  .slider-content-notification,
  .slider-content-name,
  .slider-content-description {
    text-align: left;
    white-space: pre-wrap;
  }

  .slider-content-name {
    margin-bottom: auto;
  }

  .slider-content-layout-2 {
    flex-direction: column;
  }

  .slider-content-prices {
    margin-bottom: 2rem;
  }

  .slider-content-additional-product {
    background-size: cover;
  }

  .slider-content-additional-container {
    position: relative;
    bottom: initial;
    left: initial;
    height: 100%;
    background: var(--background-color-3-op-85);
    padding-top: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .products-slider .slider-content-additional-container {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: initial;
    padding-top: 2rem;
    background: var(--background-color-3-op-85);
  }

  .slider-content-additional-title {
    display: block;
  }

  .products-slider .slider-content-additional-title {
    text-align: left;
    font-size: 2rem;
  }

  .slider-content-screenshots-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-bottom: auto;
  }

  .products-slider .slider-content-screenshots-container {
    display: flex;
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .products-slider .slider-content-screenshot {
    display: block;
  }

  .products-slider .slider-content-screenshot:nth-child(even) {
    margin-right: 0;
  }

  .slider-content-additional-data {
    display: block;
  }

  .slider-content-additional-data:last-child {
    margin-bottom: 2rem;
  }

  .slider-content-additional-data > i.icon {
    margin-top: 0.5rem;
  }
}
@media (min-width: 1200px) {
  .slider.main-slider.waiting {
    padding-bottom: calc(49.122855% + 4.71228rem);
  }

  .banner-countdown-timer-container {
    background-color: rgba(26,26,26,0.25);
  }

  .slider-content-layouts {
    padding: 3rem 2rem 3rem 4rem;
  }

  .slider-content-layout-1 {
    margin-right: 4rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .slider-content-notification {
    font-size: 2rem;
  }

  .slider-content-description {
    margin-top: auto;
  }

  .slider-content-prices {
    margin-bottom: 3rem;
  }

  .products-slider .slider-content-screenshot a {
    font-size: 1.3rem;
  }

  .slider-content-additional-title,
  .products-slider .slider-content-additional-title {
    font-size: 2.5rem;
  }

  .slider-content-additional-data {
    font-size: 2rem;
    margin-bottom: 2rem;
  }

  .slider-preview-container {
    transform: translateX(calc(-0.2rem - 14.28571%));
  }

  .slider-preview-container.scroll-prev {
    transform: translateX(calc(0.2rem + 14.28571%));
  }

  .slider.coming-soon-slider .slider-preview-container {
    transform: translateX(calc(-0.28rem - 20%));
  }

  .slider.coming-soon-slider .slider-preview-container.scroll-prev {
    transform: translateX(calc(0.28rem + 20%));
  }

  .slider-preview-item {
    width: calc(14.28571% - 1.2rem);
    min-width: calc(14.28571% - 1.2rem);
  }

  .slider.coming-soon-slider .slider-preview-item {
    width: calc(20% - 1.12rem);
    min-width: calc(20% - 1.12rem);
  }

  .slider.coming-soon-slider .slider-preview-info {
    padding: 1.6rem 2.0rem 2.4rem 1.6rem;
  }

  .slider.coming-soon-slider .slider-preview-title,
  .slider.coming-soon-slider .slider-preview-title a {
    font-size: 1.7rem;
  }

  .slider.coming-soon-slider .slider-preview-description,
  .slider.coming-soon-slider .slider-preview-description a {
    font-size: 1.7rem;
  }

  .slider.coming-soon-slider .slider-preview-description {
    margin-top: 1.2rem;
  }

  .button-alert {
    width: 3rem !important;
    height: 3.4rem !important;
    min-width: 3rem;
    padding: 0;
    line-height: 3.4rem;
  }
}
@media (min-width: 1440px) {
  .banner-countdown-timer-container {
    padding: 2rem 4.8rem;
  }

  .banner-countdown-timer {
    font-size: 3.6rem;
  }

  .slider-content-layouts {
    padding: 4rem 6rem 4rem 6rem;
  }

  .slider-content-layout-1 {
    margin-right: 9rem;
  }

  .slider-content-notification {
    font-size: 2.5rem;
  }

  .slider-content-name {
    font-size: 3rem;
  }

  .slider-content-description {
    font-size: 1.6rem;
    height: auto;
  }

  .slider-content-full-price {
    font-size: 3.5rem;
  }

  .slider-content-price {
    font-size: 8rem;
  }

  .products-slider .slider-content-screenshot a {
    font-size: 1.4rem;
  }

  .slider-content-additional-container,
  .products-slider .slider-content-additional-container {
    padding: 2.4rem 2.6rem 0;
  }

  .slider-content-additional-title,
  .products-slider .slider-content-additional-title {
    font-size: 3.6rem;
    margin-bottom: 2rem;
  }

  .slider-content-additional-data {
    font-size: 2.5rem;
    margin-bottom: 2.4rem;
  }

  .slider-content-additional-data > i.icon {
    width: 2.2rem;
    height: 2.2rem;
  }
}
@media (min-width: 1900px) {
  section {
    max-width: 190.3rem;
    margin-left: auto;
    margin-right: auto;
  }

  .slider.main-slider.waiting {
    padding-bottom: 101.4rem;
  }

  .slider.coming-soon-slider .slider-preview-container {
    transform: translateX(calc(-0.2rem - 14.28571%));
  }

  .slider.coming-soon-slider .slider-preview-container.scroll-prev {
    transform: translateX(calc(0.2rem + 14.28571%));
  }

  .slider.coming-soon-slider .slider-preview-item {
    width: calc(14.28571% - 1.2rem);
    min-width: calc(14.28571% - 1.2rem);
  }

  .slider-content-main {
    flex: 1 1 72.096689%;
    min-width: 72.096689%;
    max-width: 72.096689%;
  }

  .slider-content-layouts {
    padding: 6rem 7rem 6rem 9rem;
  }

  .products-slider .slider-content-screenshot a {
    font-size: 1.7rem;
  }

  .slider-content-additional {
    margin-left: 4rem;
  }

  .slider-content-additional-container,
  .products-slider .slider-content-additional-container {
    padding-top: 4.6rem;
    padding-bottom: 3.6rem;
  }

  .slider-content-additional-data {
    margin-bottom: 3.2rem;
  }

  .slider-preview-info {
    padding: 1.9rem 1.8rem 2.2rem;
  }

  .slider-preview-title,
  .slider-preview-title a,
  .slider-preview-description,
  .slider-preview-description a {
    font-size: 1.7rem;
  }

  .slider.coming-soon-slider .slider-preview-description {
    margin-top: 1.6rem;
  }
}

.section.page {
  padding-top: 8rem;
  margin-top: 0;
}

.section.page.breadcrumb {
  padding-top: 4rem;
}

.page-sidebar {
  display: none;
}

.sidebar-menu {
  display: flex;
  flex-direction: column;
}

.sidebar-menu-item {
  display: flex;
  flex-direction: column;
  flex: 1 1 100%;
}

.sidebar-menu-item-title {
  display: block;
  font-size: 1.7rem;
  font-weight: bold;
  color: var(--font-color-dark);
  line-height: 1.4;
  padding-top: 0.2rem;
  padding-bottom: 1.2rem;
  margin-bottom: 1.5rem;
  border-bottom: 0.1rem solid var(--border-color);
}

.sidebar-menu-item-title.is_active,
.sidebar-menu-item-title:not(.without-hover):hover {
  color: var(--font-color-blue);
}

.sidebar-menu > *:last-child > a.sidebar-menu-item-title {
  border-bottom: none;
}

.sidebar-submenu {
  margin-bottom: 1.5rem;
  padding-left: 0.2rem;
  flex-direction: column;
}

.sidebar-submenu > .sidebar-menu-item-title {
  border-bottom: none;
  margin-bottom: 0;
  font-weight: normal;
}

.page-content {
  width: 100%;
}

.content-header,
.content-container {
  margin-bottom: 4rem;
  padding: 0 2rem;
}

.content-header > h1 {
  margin-top: -1rem;
}

.content-container,
.product-content {
  display: flex;
  flex-direction: column;
}

.content-container {
  position: relative;
}

.content-container.static-content-container {
  width: 100%;
}

.content-container,
.content-container > *,
.product-content,
.product-content > * {
  color: var(--font-color-light);
}

.content-container > img {
  width: 100%;
}

.content-container > h2,
.content-container > h3,
.product-content > h2 {
  color: #e6e6e6;
  margin-bottom: 2rem;
}

.content-container > h2 {
  font-size: 2.5rem;
}

.product-content > h3,
.product-content > h4 {
  font-size: 1.7rem;
  color: var(--font-color-blue);
  margin-bottom: 2rem;
  text-transform: uppercase;
}

.content-container > * + h2,
.product-content > * + h3 {
  margin-top: 4rem;
}

.product-content ul > li {
  list-style: disc;
}

.error-text {
  font-size: 4.8rem;
  font-weight: bold;
}

.error-small-text {
  font-size: 2.5rem;
}

.error-text,
.error-small-text {
  width: fit-content;
  display: inline-block;
  margin: 0 auto;
}

.error-404-container {
  width: 100%;
  padding: 0 2rem;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}

.contact-form-container {
  margin-top: 4rem;
}

.contact-form-container textarea {
  height: 23rem;
}

.activations-detail-container {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  align-items: flex-start;
  padding: 0;
  margin-top: 1rem;
  margin-bottom: 0;
}

.activations-detail-item {
  position: relative;
  min-width: 25%;
  max-width: 25%;
  padding-top: 8rem;
  font-size: 1.6rem;
  font-weight: bold;
  color: var(--font-color-light);
  padding-right: 2rem;
  margin-bottom: 6.2rem;
  list-style: none !important;
}

.activations-detail-item:before {
  content: attr(marker);
  position: absolute;
  top: 0;
  left: 0;
  width: 6.2rem;
  height: 6.2rem;
  border: 0.5rem solid var( --border-color-blue);
  border-radius: 3.1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  font-weight: bold;
}

@media (min-width: 768px) {
  .page-sidebar {
    display: block;
    margin: 0 1rem;
    width: 22rem;
    min-width: 22rem;
    max-width: 22rem;
  }

  .page-content {
    width: calc(100% - 26rem);
  }

  .page-content.page-cart-content {
    width: 100%;
  }

  .content-header,
  .content-container {
    padding: 0 1rem;
  }

  .content-header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .error-404-container {
    width: 50rem;
    flex-direction: row;
    justify-content: space-between;
  }
}

@media (min-width: 992px) {
  .page-sidebar {
    width: 24rem;
    min-width: 24rem;
    max-width: 24rem;
  }

  .page-content {
    width: calc(100% - 28rem);
  }
}

@media (min-width: 1200px) {
  .page-sidebar {
    width: 28rem;
    min-width: 28rem;
    max-width: 28rem;
  }

  .page-content {
    width: calc(100% - 32rem);
  }

  .content-container > h2 {
    font-size: 3rem;
  }
}

@media (min-width: 1440px) {
  .page-sidebar {
    width: 30rem;
    min-width: 30rem;
    max-width: 30rem;
  }

  .page-content {
    width: calc(100% - 34rem);
  }

  .content-container.static-content-container {
    width: 65%;
  }

  .content-container.content-container-with-sharing-buttons {
    min-height: 24rem;
  }
}

@media (min-width: 1900px) {
  .page-sidebar {
    width: 36rem;
    min-width: 36rem;
    max-width: 36rem;
  }

  .page-content {
    width: calc(100% - 40rem);
  }
}

.section.profile {
  padding-top: 10rem;
}

.profile-block {
  margin: 0 0 7.2rem;
}

.profile-block-header {
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 2.4rem;
}

.profile-block:first-child .profile-block-header {
  margin-bottom: 8rem;
}

.profile-block-header .headline-level.level-1 {
  margin-left: -0.4rem;
  line-height: 1;
  white-space: initial;
}

.profile-block-filters {
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-direction: row;
}

.profile-block-filters > .form-select {
  width: 18rem;
}

.profile-block:first-child > .column-50:last-child {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.profile-menu-sidebar {
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;
}

.profile-menu-sidebar > .profile-menu {
  flex-direction: column;
}

.profile-menu-item {
  display: -webkit-box;
  display: -moz-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;
}

.profile-menu-item-title {
  font-size: 1.7rem;
  font-weight: 600;
  color: var(--font-color-dark);
  line-height: 1.4;
  padding-top: 0.2rem;
  padding-bottom: 1.2rem;
  margin-bottom: 1.5rem;
  border-bottom: 0.1rem solid var(--border-color);
}

.profile-menu-item-title.accordion-title:before {
  top: 0.2rem;
  height: 2.3rem;
}

.user-data-form-container {
  margin-bottom: 4rem;
}

.user-data-form-container > form {
  width: auto;
}

.user-data-form-container > form > .form-group {
  width: 100%;
}

.user-data-form-container > form > .form-group > input[type="email"],
.user-data-form-container > form > .form-group > input[type="password"],
.user-data-form-container > form > .form-group > input[type="text"] {
  font-size: 2.5rem;
  padding: 0;
}

.user-data-form-container > form > .form-group > input[type="email"][disabled],
.user-data-form-container > form > .form-group > input[type="password"][disabled],
.user-data-form-container > form > .form-group > input[type="text"][disabled] {
  caret-color: transparent;
  border-bottom: none;
  color: var(--font-color-medium);
}

.user-data-form-container > form > .form-group > label {
  font-size: 2.5rem;
  font-weight: bold;
  color: var(--font-color-light);
}

.user-data-form-container > form > .form-group > input[type="checkbox"] + label {
  font-size: 2.4rem;
  font-weight: normal;
}

.user-data-form-container > form > .form-group .icon {
  top: 4.4rem;
  bottom: initial;
}

.form-group-checkbox + .communication-preferences-title {
  display: none;
}

.user-email-container > *:not(a) {
  color: var(--font-color-light);
  font-size: 2.5rem;
}

[class~='communication-preferences-title']:first-of-type {
  display: block;
}

.profile-internal-balance {
  width: 100%;
  margin-top: 3.2rem;
  margin-bottom: 4rem;
}

.profile-internal-balance > div:nth-of-type(1) {
  font-size: 2.5rem;
  font-weight: bold;
  color: var(--font-color-white);
  line-height: 1;
}

.profile-internal-balance > div:nth-of-type(2) {
  font-size: 8.0rem;
  font-weight: bold;
  color: var(--font-color-blue);
  line-height: 1;
  margin-top: 3.2rem;
  text-align: left;
}

.profile-internal-balance > a {
  font-size: 1.6rem;
  color: var(--font-color-blue);
}

.table-form {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 5.4rem;
}

.table-form > .form-group:first-child {
  width: 100%;
  flex: 1;
  margin-bottom: 0;
  margin-right: 5rem;
  justify-content: flex-end;
}

.my-orders-table > .tr > .td:nth-child(1),
.my-orders-table > .tr > .td:nth-child(4),
.my-orders-table > .tr > .td:nth-child(5),
.my-orders-table > .tr > .td:nth-child(6) {
  min-width: 18rem;
  flex: 1 1 18rem;
}

.my-orders-table > .tr > .td:nth-child(2) {
  min-width: 18rem;
  flex: 1 1 18rem;
}

.my-affiliate-program-table > .tr > .td:nth-child(1),
.my-affiliate-program-table > .tr > .td:nth-child(4),
.my-affiliate-program-table > .tr > .td:nth-child(5) {
  min-width: 11rem;
  flex: 1 1 11rem;
}

.my-affiliate-program-table > .tr > .td:nth-child(3),
.my-affiliate-program-table > .tr > .td:nth-child(6) {
  min-width: 15rem;
  flex: 1 1 15rem;
}

.my-tickets-table > .tr:not(.empty) > .td:nth-child(1) {
  min-width: 11rem;
  flex: 1 1 11rem;
}

.my-tickets-table > .tr > .td:nth-child(2),
.my-tickets-table > .tr > .td:nth-child(4),
.my-tickets-table > .tr > .td:nth-child(5),
.my-tickets-table > .tr > .td:nth-child(6) {
  min-width: 18rem;
  flex: 1 1 18rem;
}

.my-tickets-table > .tr > .td:nth-child(6) {
  text-align: right;
  padding-right: 0;
}

.my-tickets-table > .tr:not(.header):not(.empty) > .td:nth-child(1):before,
.my-tickets-table > .tr:not(.header) > .td:nth-child(2):before {
  content: '\2022';
  margin-right: 0.5rem;
}

.my-tickets-table > .tr:not(.header):not(.pending-ticket) > .td:nth-child(1):before {
  color: transparent;
}

.my-tickets-table > .tr:not(.header) > .td:nth-child(2):before {
  color: #4aa314;
}

.my-tickets-table > .tr.pending-ticket:not(.header) > .td:nth-child(2):before {
  color: #f4e71e;
}

.my-tickets-table > .tr.new-ticket:not(.header) > .td {
  color: var(--gradient-second-color);
}

.table a {
  color: var(--font-color-blue);
  padding: 0;
  margin: 0;
}

.my_affiliate_program-header {
  margin-bottom: 3.2rem;
}

.my-affiliate-program-information {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-item: stretch;
  margin-bottom: 7.6rem;
}

.my-affiliate-program-information > div {
  font-size: 2.5rem;
  font-weight: bold;
  color: var(--font-color-white);
}

.my-affiliate-program-information > div:first-child {
  min-width: 30rem;
  max-width: 100%;
  margin-bottom: 4rem;
}

.my-affiliate-program-information > div:last-child {
  flex: 1 1 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.my-affiliate-program-information > div > span {
  display: block;
}

.my-affiliate-program-balance {
  font-size: 5rem;
  font-weight: bold;
  line-height: 1;
  color: var(--font-color-blue);
  padding-top: 2.4rem;
}

.my-affiliate-program-code {
  font-size: 1.7rem;
  width: 100%;
  border-bottom: 0.1rem solid var(--font-color-white);
  position: relative;
  padding-bottom: 0.4rem;
}

.my-affiliate-program-code-copy {
  position: absolute;
  right: 0;
  bottom: 0.4rem;
  color: var(--font-color-blue);
  cursor: pointer;
  display: flex;
  align-items: flex-end;
}

.my-affiliate-program-code-copy:active {
  opacity: 0.8;
  transform: scale(0.98);
}

.my-affiliate-program-code-copy:after {
  content: '';
  display: inline-block;
  margin-left: 0.4rem;
  width: 2.6rem;
  height: 2.6rem;
  background-image: url('../icons/copy_icon_blue.svg');
}

.my-affiliate-purchases-table-form-container {
  margin-bottom: 4rem;
}

.my-affiliate-purchases-table-form-container > form {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}

.my-affiliate-purchases-table-form-container > form .form-group {
  margin-bottom: 0;
  margin-right: 2.4rem;
  min-width: 15rem;
}

.my-affiliate-purchases-table-form-container > form .button.small-button {
  height: 4.6rem;
  line-height: 4.6rem;
  font-size: 1.3rem;
  padding: 0 2.5rem;
}

.my-affiliate-purchases-table-form-container > form .form-notification {
  padding: 1.6rem 0 0.7rem;
  margin: 0 3rem 0 0;
  white-space: nowrap;
}

.my-affiliate-purchases-table > .tr > .td:nth-child(1) {
  min-width: 25rem;
  flex: 1 1 25rem;
}

.my-affiliate-purchases-table > .tr > .td:nth-child(3),
.my-affiliate-purchases-table > .tr > .td:nth-child(4) {
  min-width: 15rem;
  flex: 1 1 15rem;
}

.add-ticket-container .tab-target {
  font-size: 1.7rem;
  line-height: 1.7rem;
  text-transform: none;
}

.add-ticket-container div > .tab-target {
  padding-left: 0;
  margin-left: 0;
  border-left: none;
}

.add-ticket-container div > .tab-target ~ .tab-target {
  padding-left: 2.4rem;
  margin-left: 2.4rem;
  border-left: 0.1rem solid var(--border-color);
}

.add-ticket-container .tab {
  margin-top: 3.2rem;
}

.add-ticket-container textarea {
  height: 23.2rem;
  margin-top: 2.7rem;
}

.add-ticket-container form .form-group {
  flex-wrap: wrap;
}

.add-ticket-container form .form-group:last-child {
  flex-direction: row;
  justify-content: space-between;
}

.add-ticket-container form .form-group:last-child > label,
.add-ticket-container form .form-group:last-child > button {
  min-width: 20rem;
  flex: 0 0 20rem;
}

.add-ticket-button {
  margin-bottom: 0.8rem;
}

.ticket-information-container {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.ticket-information-item {
  color: var(--font-color-light);
  font-weight: normal;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  text-align: right;;
}

.ticket-information-item:last-of-type {
  margin-bottom: 2rem;
}

.ticket-information-item > span {
  color: var(--font-color-white);
  font-weight: bold;
  width: 15rem;
  display: block;
  text-align: right;
  margin-right: 1.7rem;
}

.ticket-information-item.resolved > span,
.ticket-information-item.pending > span {
  margin-right: 0.2rem;
}

.ticket-information-item.resolved > span:after,
.ticket-information-item.pending > span:after {
  content: '\2022';
  margin-left: 0.6rem;
  width: 0.9rem;
  display: inline-block;
}

.ticket-information-item.resolved,
.ticket-information-item.resolved > span:after {
  color: #4aa314;
}

.ticket-information-item.pending,
.ticket-information-item.pending > span:after {
  color: #f4e71e;
}

.ticket-messages-container {
  margin-bottom: 2.4rem;
}

.ticket-messages-title + .ticket-messages-container {
  display: none;
}

.ticket-messages {

}

.ticket-messages-title {
  display: none;
}

.ticket-message {
  display: flex;
  align-items: stretch;
  background-color: var(--background-color);
  border: 1px solid var(--border-color);
  margin-bottom: 4rem;
}

@media (max-width: 991px) {
  .ticket-message {
    flex-direction: column;
  }
}

.ticket-message:last-of-type {
  margin-bottom: 0;
}

.ticket-message-layout {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: stretch;
  padding: 2rem;
  color: var(--font-color-medium);
}

.ticket-message.is_admin > .ticket-message-layout:first-child {
  background-color: #481d4b;
}

.ticket-message-layout:last-child:not(:only-child) {
  flex-direction: column;
  justify-content: space-between;
  min-width: calc(25% - 1px);
  background-color: var(--background-color-3);
  border-left: 1px solid var(--border-color);
}

@media (max-width: 991px) {
  .ticket-message .ticket-message-layout:last-child:not(:only-child) {
    min-width: 100%;
    border: none;
    border-top: 1px solid var(--border-color);
  }

  .ticket-message-layout label.button {
    max-width: 24rem;
    margin: 2rem 0 !important;
  }
}

.ticket-message-layout:first-child {
  min-width: 75%;
  width: 100%;
}

.ticket-message-author {
  color: var(--font-color-white);
  font-weight: bold;
  margin-bottom: 2.4rem;
}

.ticket-message-date {
  font-weight: bold;
}

.ticket-message-content {
  width: 100%;
}

.ticket-attachments-title {
  color: var(--font-color-white);
  font-weight: bold;
  margin-bottom: 2.4rem;
}

.ticket-attachments {
  display: flex;
  flex-direction: column;
  margin-bottom: auto;
  width: 100%;
}

.ticket-attachment,
.ticket-file {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  color: var(--font-color-medium);
  cursor: pointer;
}

.ticket-attachment:before,
.ticket-file:before {
  content: '';
  background-image: url(../icons/download_icon_blue.svg);
  background-size: 100%;
  background-repeat: no-repeat;
  background-position-x: left;
  background-position-y: center;
  width: 2rem;
  margin-right: 2rem;
}

.ticket-file:before {
  background-image: url(../icons/close_icon_blue.svg);
  width: 1rem;
}

.ticket-attachment > span:first-child,
.ticket-file > span:first-child {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 50%;
  margin-right: auto;
}

.ticket-message-layout label.button {
  cursor: pointer;
}

.ticket-textarea {
  width: calc(100% + 4rem);
  height: calc(100% + 4rem);
  min-height: 18rem;
  border: none;
  outline: none;
  margin: -2rem;
  padding: 2rem;
}

.ticket-message-layout > .field-error {
  margin-top: 2.5rem;
}

.order-information-item {
  display: flex;
  color: var(--font-color-light);
}

.order-information-item > span {
  min-width: 20rem;
  font-weight: bold;
  color: var(--font-color-white);
}

.my-order-table > .tr > .td:nth-child(1) {
  min-width: 18rem;
  width: 18rem;
  flex: 1 1 18rem;
}

.my-order-table > .tr > .td:nth-child(2) {
  min-width: 22rem;
  width: 22rem;
  flex: 1 1 22rem;
}

.my-order-table > .tr > .td:nth-child(4),
.my-order-table > .tr > .td:nth-child(5),
.my-order-table > .tr > .td:nth-child(6) {
  min-width: 11rem;
  width: 11rem;
  flex: 1 1 11rem;
}

.content-sub-container {
  background-color: var(--background-color-3-op-75);
  padding: 2rem;
  border-radius: 2px;
}

.order-message > *:last-child {
  margin-bottom: 0;
}

.order-message-title {
  font-weight: bold;
  color: var(--font-color-light);
  margin-bottom: 2rem;
}

.order-message-content.payment-waiting-message p {
  color: var(--font-color-blue);
  text-transform: uppercase;
}

.not-enough-item {}

.order-item {
  display: flex;
  flex-direction: column;
}

.order-item-image {
  width: 100%;
  margin-bottom: 2rem;
}

.order-item-image * {
  width: 100%;
  display: block;
}

.order-item-additional {
  display: flex;
  flex-direction: column;
}

.order-item-title {
  font-size: 2.2rem;
  color: var(--font-color-light);
  margin-bottom: 2rem;
}

.order-item-content {
  display: flex;
  flex-direction: column;
}

.order-item-message {

}

.order-item-activation-code {
  margin-bottom: 2.4rem;
}

.order-item-activation-code:last-of-type {
  margin-bottom: 0;
}

.order-item-activation-code-title {
  margin-bottom: 1rem;
}

.order-item-activation-code-value {
  padding: 0.8rem 2rem;
  border: 1px solid var(--border-color);
  text-align: center;
  color: var(--font-color-white);
  background-color: var(--background-color);
  cursor: pointer;
}

.order-item-activation-code-link {
  margin-top: 1rem;
  display: inline-block;
  float: right;
}

.order-item-notification {
  color: var(--font-color-deep-blue);
  margin-bottom: 2.4rem;
}

.order-item-downloads {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

.order-item-downloads > * {
  margin: 0 1rem 1rem 0;
}

.order-message-wait {
  padding-bottom: 4.8rem;
}

.order-message-wait:after {
  content: '';
  display: block;
  width: 100%;
  height: 6.4rem;
  margin-top: 4.8rem;
  background-size: 4.8rem;
  background-image: url('../icons/loading.svg');
  background-repeat: no-repeat;
  background-position: center;
}

.stay-connected {
  width: 100%;
  min-height: initial;
  height: initial;
  background-image: url('../images/subscribe_background.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  margin-bottom: 0;
}

.stay-connected .headline {
  padding: 2.4rem 0 2.4rem;
  margin: 0;
  line-height: 1;
  font-weight: bold;
}

.stay-connected .headline-level.level-1 {
  font-weight: bold;
  line-height: 1;
}

.stay-connected-content-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.stay-connected-content {
  min-width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 3.2rem;
}

.subscribe-add-form-container {
  width: 100%;
}

.stay-connected-content .icon.icon-headline-left.headline-level.level-4 {
  padding-top: 3rem;
  padding-left: 0;
  line-height: 1;
  width: 100%;
  text-align: center;
}

.stay-connected-content.stay-connected-newsletter input[type="text"]::placeholder,
.stay-connected-content.stay-connected-newsletter input[type="email"]::placeholder {
  color: var(--font-color-white);
}

.stay-connected-content.stay-connected-blog .icon.icon-headline-left.headline-level.level-4 {
  margin-bottom: 0.8rem;
}

.stay-connected-content .icon.icon-headline-left.headline-level.level-4:before {
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  width: 2.4rem;
  height: 2.4rem;
}

.stay-connected-content .form-group {
  align-items: flex-start;
}

.stay-connected-follow-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.stay-connected .socials-headline {
  font-size: 3.2rem;
  font-weight: bold;
  line-height: 1;
  margin-bottom: 1.2rem;
}

.stay-connected .socials {
  margin-bottom: 2.5rem;
}

.stay-connected .socials > .icon {
  width: 3.2rem;
  height: 3.2rem;
  margin: 0 1.375rem;
}

footer {
  position: static;
  z-index: 100;
  float: none;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  color: transparent;
  padding-top: 0.2rem;
}

main.open-popup,
section.open-popup,
footer.open-popup {
  position: absolute;
  transform: translateX(-10000px);
  visibility: hidden;
}

body.background-3 {
  background-color: var(--background-color-3) !important;
  background-image: initial;
}

body.background-yuplay {
  background-image: initial;
}

body.background-yuplay main {
  background-image: url('../images/yuplay_background.jpg');
  background-position-x: center;
  background-position-y: 0;
  background-repeat: no-repeat;
}

.yuplay-bg {
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  position: fixed;
  height: 100vh;
  width: 100vw;
}

body[class^="background"] .yuplay-bg {
  background-image: initial;
  height: initial;
  width: initial;
}

.footer-layout-1 {
  background-color: var(--background-color-2);
  padding: 4.7rem 0 3.2rem;
}

.footer-layout-1-sublayout {
  display: flex;
  flex-direction: column;
}

.footer-layout-2 {
  background-color: var(--background-color-3);
  padding: 4rem 0;
}

.footer-menu-container {
  display: flex;
  flex-direction: row;
  margin-bottom: 4rem;
  flex-wrap: wrap;
  justify-content: space-between;
}

.footer-menu {
  display: flex;
  align-items: center;
  flex-direction: column;
  margin-bottom: 2rem;
  padding-bottom: 2rem;
  min-width: 100%;
}

.footer-menu:nth-child(1) {
  order: 1;
}

.footer-menu:nth-child(2) {
  order: 3;
}

.footer-menu:nth-child(3) {
  order: 3;
}

.footer-menu:nth-child(4) {
  order: 6;
  margin: 2rem 0 0;
  padding: 0;
}

.footer-menu:nth-child(5) {
  order: 5;
}

.footer-menu-title {
  font-size: 2rem;
  line-height: 1;
  font-weight: bold;
  color: var(--font-color-white);
  margin-bottom: 3rem;
}

.footer-menu > a {
  display: inline;
  font-size: 1.6rem;
  color: var(--font-color-medium);
  margin-bottom: 1.6rem;
  width: fit-content;
}

.footer-menu > a:hover {
  color: var(--font-color-blue);
}

.footer-menu-container > .payments {
  display: flex;
  order: 4;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  margin-bottom: 4rem;
  max-width: 100%;
  min-width: 100%;
  font-size: 2rem;
  line-height: 1;
  font-weight: bold;
  color: var(--font-color-white);
}

.footer-menu-container > .payments .footer-menu-title {
  min-width: 100%;
  text-align: center;
}

.footer-menu-container > .payments img {
  height: 3.6rem;
  margin: 0 0.8rem 1.6rem 0;
}

.footer-menu-container > .payments img:first-child {
  margin-top: 3rem;
}

.footer-tools-container {
  display: flex;
  flex-direction: column;
}

.footer-tool {

}

.footer-tool-title {
  font-size: 2rem;
  font-weight: bold;
  color: var(--font-color-white);
  margin-bottom: 3rem;
}

.footer-layout-2-sublayout {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.footer-logo-container {
  order: 1;
  margin-bottom: 2.4rem;
}

.copyright {
  order: 3;
  font-size: 1.7rem;
  color: var(--font-color-dark);
  text-align: center;
  width: 100%;
  display: block;
}

.socials.footer-socials {
  order: 2;
  justify-content: flex-end;
  margin-bottom: 2.4rem;
}

.footer-languages {
  margin-bottom: 4rem;
}

.no-auth-notification > *,
.popup-notification > *{
  color: var(--font-color-light);
}

.no-auth-notification > *:last-child,
.popup-notification > *:last-child {
  margin-bottom: 0;
}

.check-age-rating-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: calc(100% - 0.2rem);
  text-align: center;
  background-color: var(--background-color-3-op-65);
  height: auto;
  min-height: 100%;
}

.check-age-rating-description {
  font-size: 3rem;
  font-weight: 700;
  line-height: 1.5;
  text-transform: uppercase;
  margin-bottom: 4.8rem;
  color: var(--font-color-light);
  padding: 1rem 2rem;
}

.check-age-rating-form {

}

.check-age-rating-form .form-select-date {
  display: flex;
  justify-content: center;
}

.check-age-rating-form .form-select-date > label {
  font-size: 2.5rem;
  font-weight: 700;
  margin-bottom: 2.4rem;
}

.check-age-rating-form .form-select-date > .annotation {
  font-size: 1.8rem;
  margin-top: 2rem;
  color: var(--font-color-medium);
}

.check-age-rating-form .form-manage {
  display: flex;
  flex-direction: row;
  justify-content: center;
}

.check-age-rating-form .form-manage > * {
  margin-right: 2rem;
}

.check-age-rating-form .form-manage > *:last-child {
  margin-right: 0;
}

.breadcrumb {
  z-index: 100;
  padding-top: 2rem;
}

.breadcrumb-list {
  list-style: none;
  margin: 0;
  padding: 0 1rem;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
}

.breadcrumb-list > li {
  color: var(--font-color-light);
  font-size: 1.6rem;
  font-weight: 600;
  margin-right: 0.5rem;
}

.breadcrumb-list > li:after {
  content: '>';
  font-weight: 500;
  margin-left: 0.5rem;
}

.breadcrumb-list > li:last-of-type {
  margin-right: 0;
}

.breadcrumb-list > li:last-of-type:after {
  content: '';
}

.breadcrumb-list > li > a {
  color: inherit;
  font-weight: 500;
  transition: .1s ease-in-out;
}

.breadcrumb-list > li > a:hover {
  color: inherit;
  border-bottom: 1px solid var(--font-color-light);
}

.bonus-popup-window {
  position: absolute;
  width: calc(100% - 2rem);
  min-height: 1rem;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  padding: 4rem 0 4rem 0;
  background: rgb(30,118,128);
  background: -moz-linear-gradient(144deg, rgba(30,118,128,1) 0%, rgba(129,29,123,1) 100%);
  background: -webkit-linear-gradient(144deg, rgba(30,118,128,1) 0%, rgba(129,29,123,1) 100%);
  background: linear-gradient(144deg, rgba(30,118,128,1) 0%, rgba(129,29,123,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1e7680",endColorstr="#811d7b",GradientType=1);
  background-position: center center;
  background-repeat: no-repeat;
  z-index: 1010;
}

.bonus-popup-top-text {
  color: var(--font-color-white);
  font-size: 3.7rem;
  font-weight: bold;
  text-align: center;
  padding: 0 4rem 2rem 4rem;
}

.bonus-popup-title-image {
  text-align: center;
  padding: 0 4rem;
}

.bonus-popup-top-text img {
  max-width: 100%;
}

.bonus-popup-item {
  flex-wrap: nowrap;
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  padding: 2rem 4rem;
  margin-bottom: 2rem;
  background-color: var(--background-color-3-op-65);
}

.bonus-popup-item-image {
  flex: 1 1 35rem;
  margin-right: 2rem;
  position:relative;
}

.bonus-popup-image-label {
  position: absolute;
  top: 0;
  left: 0;
  padding: 1rem;
  color: var(--font-color-white);
  font-weight: 600;
  background: #fc01ff;
  background: linear-gradient(165deg, #fc01ff 0%, #870079 100%);
}

.bonus-popup-image-label.free {
  background: #a9d617;
  background: linear-gradient(165deg, #a9d617 0%, #86a712 100%);
}

.bonus-popup-item-image img {
  border: 2px solid var(--font-color-white);
  width: 100%;
}

.bonus-popup-item-information {
  flex: 1 1 100%;
  display: grid;
}

.bonus-popup-item-name {
  color: var(--font-color-white);
  font-size: 2.5rem;
  font-weight: bold;
}

.bonus-popup-item-platform {
  color: var(--font-color-white);
}

.bonus-popup-item-platform img {
  width: 2.5rem;
  vertical-align: text-bottom;
  margin-left: 1rem;
}

.bonus-popup-item-price-container {
  align-self: flex-end;
  display:grid;
  justify-content: left;
  justify-items: end;
}

.bonus-popup-item-full-price {
  color: var(--font-color-medium);
  font-size: 1.2rem;
  text-decoration: line-through;
}

.bonus-popup-item-price {
  color: var(--font-color-gold);
  font-size: 2.5rem;
  font-weight: bold;
  text-transform: uppercase;
}

.bonus-popup-item-form-group {
  display:flex;
  align-items: center;
}

.bonus-popup-item-check {
  border: 0.5rem solid var(--font-color-blue);
  border-radius: 1rem;
  width: 4rem;
  height: 4rem;
  cursor:pointer;
}

.bonus-popup-item-check:hover, .bonus-popup-item-check.active {
  border-color: var(--font-color-gold);
}

.bonus-popup-item-check.active {
  background-image: url('../images/bonus-check.png');
  background-position: center center;
  border-width: 0;
}

@media (max-height: 660px) {
  .bonus-popup-item-image {
    flex: 1 1 24rem;
  }
  .bonus-popup-item-name {
    font-size: 1.6rem;
  }
  .bonus-popup-item-price {
    font-size: 1.6rem;
  }
}

@media (max-height: 600px) {
  .bonus-popup-item-image {
    flex: 1 1 18rem;
  }
  .bonus-popup-image-label {
    transform: scale(0.75)
  }
  .bonus-popup-item {
    padding: 1rem 4rem;
    margin-bottom: 1rem;
  }
}


.bonus-popup-footer {
  padding: 0 4rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.bonus-popup-bottom-text {
  color: var(--font-color-white);
  font-size: 1rem;
}

.bonus-popup-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.bonus-popup-actions button {
  padding-left: 2rem;
  padding-right: 2rem;
}

.bonus-popup-actions button:first-of-type {
  margin-right: 2rem;
}

@media (min-width: 822px) {
  .bonus-popup-window {
    width: 80rem;
  }
}

@media (min-width: 540px) {
  .stay-connected .headline {
    padding: 4.5rem 0 9rem;
  }

  .stay-connected-content-container {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: nowrap;
    margin-bottom: 3rem;
  }

  .stay-connected-content {
    min-width: calc(50% - 2rem);
    max-width: calc(50% - 2rem);
    flex: 1 1 calc(50% - 2rem);
    margin-bottom: 0;
  }

  .stay-connected .socials-headline {
    margin-bottom: 2.5rem;
  }

  .stay-connected .socials {
    margin-bottom: 5rem;
  }

  .footer-menu {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 2rem;
    padding-bottom: 0;
    max-width: 25%;
    min-width: 25%;
    flex: 1 1 25%;
  }

  .footer-menu:nth-child(4) {
    order: 5;
    margin: 0;
    padding: 0;
    max-width: 25rem;
  }

  .footer-menu:nth-child(5) {
    order: 6;
    max-width: 21rem;
    margin: 0;
    padding: 0;
  }

  .footer-menu:nth-child(5) img {
    width: 100%;
  }

  .footer-menu-container > .payments {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    max-width: 100%;
    min-width: 100%;
    flex: 1 1 100%;
    font-size: 1.5rem;
    font-weight: normal;
    color: var(--font-color-medium);
  }

  .footer-menu-container > .payments .footer-menu-title {
    text-align: left;
  }

  .footer-menu-container > .payments img:first-child {
    margin-top: 0;
    margin-left: 1.7rem;
  }

  .footer-tools-container {
    flex-direction: row;
    justify-content: space-between;
  }

  .footer-tool {
    min-width: calc(50% - 2rem);
  }

  .footer-tool.subscribe-tool > .footer-tool-title {
    margin-bottom: 2.4rem;
  }
}

@media (min-width: 768px) {
  .add-ticket-button {
    margin-bottom: 0;
  }

  .stay-connected-content-container {
    justify-content: center;
    align-items: stretch;
  }

  .stay-connected-content {
    min-width: 28rem;
    max-width: 28rem;
    flex: 1 1 28rem;
  }

  .stay-connected-content.stay-connected-newsletter {
    align-items: flex-end;
    align-content: flex-end;
    margin-right: 4rem;
    margin-left: auto;
  }

  .stay-connected-content.stay-connected-blog {
    align-items: flex-start;
    align-content: flex-start;
    margin-right: auto;
  }

  .stay-connected-content .icon.icon-headline-left.headline-level.level-4 {
    padding-top: 0;
    padding-left: 4.2rem;
    line-height: 3.5rem;
    text-align: initial;
    margin-bottom: 0.6rem;
  }

  .stay-connected-content .icon.icon-headline-left.headline-level.level-4:before {
    left: 0;
    top: calc(50% - 0.1rem);
    transform: translateY(-50%);
    width: 3.5rem;
    height: 3.5rem;
  }

  .stay-connected-content.stay-connected-blog .icon.icon-headline-left.headline-level.level-4 {
    margin-bottom: 1rem;
  }

  .stay-connected-content .form-group.form-manage,
  .subscribe-add-form-container .form-group.form-manage{
    align-items: flex-end;
    text-align: initial;
  }

  .stay-connected .socials-headline {
    margin-bottom: 2.5rem;
    font-size: 4rem;
  }

  .stay-connected .socials > .icon {
    width: 4rem;
    height: 4rem;
  }

  .footer-layout-1-sublayout {
    flex-direction: row;
  }

  .footer-menu-container {
    min-width: 100%;
    margin-bottom: 0;
  }

  .footer-tools-container {
    min-width: 35%;
    flex-direction: column;
    justify-content: flex-start;
  }

  .footer-menu {
    max-width: unset;
    min-width: unset;
    flex: initial;
  }

  .footer-menu:nth-child(4) {
    order: 6;
  }

  .footer-menu:nth-child(5) {
    order: 4;
  }

  .footer-menu-container > .payments {
    order: 5;
  }

  .footer-layout-2-sublayout {
    flex-direction: row;
    justify-content: space-between;
  }

  .footer-logo-container {
    margin-bottom: 0;
  }

  .copyright {
    order: 2;
  }

  .socials.footer-socials {
    order: 3;
    margin-bottom: 0;
  }
}
@media (min-width: 992px) {
  .footer-menu:nth-child(4) {
    order: 4;
    max-width: 21rem;
  }

  .footer-menu:nth-child(5) {
    order: 5;
  }

  .footer-menu-container > .payments {
    order: 6;
  }

  .footer-menu-container > .payments .footer-menu-title {
    min-width: auto;
    margin: 0 1.7rem 0 0;
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--font-color-medium);
  }

  .footer-menu-container > .payments img {
    margin-bottom: 0;
  }
}
@media (min-width: 1200px) {
  .profile-settings-layout {
    width: 60%;
  }

  .profile-settings-sub-layout {
    position: absolute;
    top: 0;
    right: 1rem;
    width: 26rem;
  }

  .user-data-form-container > form > .form-group {
    width: 34rem;
  }

  .my-affiliate-program-information {
    flex-direction: row;
  }

  .my-affiliate-program-information > div:first-child {
    flex: 1 1 44rem;
    max-width: 44rem;
    margin-bottom: 0;
  }

  .my-affiliate-purchases-table-form-container > form .form-group {
    min-width: 25rem;
  }

  .order-item {
    flex-direction: row;
  }

  .order-item-image {
    width: 30%;
    margin-bottom: 0;
  }

  .order-item-additional {
    width: 70%;
    padding-left: 3rem;
  }

  .order-item-title {
    font-size: 2.5rem;
  }

  .order-item-activation-code {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }

  .order-item-activation-code-title {
    width: 100%;
  }

  .order-item-activation-code-link {
    margin-top: 0;
    margin-left: 2rem;
    float: initial;
  }

  .order-item-activation-code-value {
    min-width: 34rem;
  }

  .stay-connected .headline {
    padding: 4.5rem 0 7.5rem;
  }

  .stay-connected-content {
    min-width: 40rem;
    max-width: 40rem;
    flex: 1 1 40rem;
  }

  .stay-connected-content-container {
    margin-bottom: 10rem;
  }

  .stay-connected-content .form-group {
    width: 100%;
  }

  .stay-connected .socials-headline {
    margin-bottom: 4rem;
  }

  .stay-connected .socials {
    margin-bottom: 4rem;
  }

  .stay-connected .socials > .icon {
    width: 4.5rem;
    height: 4.5rem;
  }

  .footer-menu-container {
    min-width: 100%;
  }

  .footer-tools-container {
    min-width: 40rem;
  }

  .footer-menu:nth-child(4) {
    max-width: 25rem;
  }
}
@media (min-width: 1440px) {
  .profile-settings-sub-layout {
    width: 40rem;
  }

  .user-data-form-container > form > .form-group {
    width: 40rem;
  }

  .profile-internal-balance > div:nth-of-type(2) {
    text-align: right;
  }
}
@media (min-width: 1900px) {
  section {
    max-width: 190.3rem;
    margin-left: auto;
    margin-right: auto;
  }

.my-affiliate-purchases-table-form-container > form .button.small-button {
  font-size: 1.7rem;
  padding: 0 3.5rem;
}

  .to-top-section {
    padding-bottom: 14rem !important;
  }

  .stay-connected .headline {
    padding: 4.5rem 0 8.2rem;
  }
}

.catalog-socialsharing {
  margin: 6.8rem auto 1rem;
}

.catalog-socialsharing.left,
.catalog-socialsharing.right {
  position: fixed;
  top: 0;
  right: 2.4rem;
  height: 100%;
  margin: 0;
}

.catalog-socialsharing.left {
  right: auto;
  left: 2.4rem;
}

.catalog-socialsharing-container {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}

.catalog-socialsharing.left .catalog-socialsharing-container,
.catalog-socialsharing.right .catalog-socialsharing-container {
  flex-direction: column;
  height: 100vh;
}

.catalog-socialsharing-container a {
  margin: 0 0.6rem;
  display: inline-block;
}

.catalog-socialsharing.left .catalog-socialsharing-container a,
.catalog-socialsharing.right .catalog-socialsharing-container a {
  margin: 0.6rem 0;
}

.catalog-socialsharing-container a:hover div {
  opacity: 0.95;
}

.catalog-socialsharing-container > span {
  position: absolute;
  left: -0.6rem;
  transform: translateX(-100%);
  font-size: 1.7rem;
  font-weight: bold;
  color: var(--font-color-blue);
}

.catalog-socialsharing.left .catalog-socialsharing-container > span,
.catalog-socialsharing.right .catalog-socialsharing-container > span {
  display: none;
}

.buy-it-today-banner {
  width: 100%;
  z-index: 1;
  text-align: center;
  color: white;
  background-color: slateblue;
  padding: 0 2rem;
  font-size: 1.6rem;
  line-height: 1.64;
  cursor: pointer;
}

.top-banner-list {
  width: 100%;
  z-index: 1;
  background-color: black;
}

.top-banner {
  width: 100%;
  text-align: center;
  color: white;
  --top-banner-background_color: slateblue;
  background-color: var(--top-banner-background_color);
  padding: 0 2rem;
  font-size: 1.6rem;
  line-height: 1.64;
  cursor: pointer;
}

.top-banner.hidden {
  visibility: hidden;
  height: 0;
}

.steam-deck-headline {
  color: var(--font-color-light);
  font-size: 2rem;
  margin-bottom: 2.4rem;
}

.steam-deck-description {
  color: var(--font-color-light);
  line-height: 2.2rem;
  margin-bottom: 1rem;
  padding-left: 2.6rem;
  position: relative;
}

.steam-deck-description:before {
  content: '';
  position: absolute;
  display: block;
  top: .9rem;
  left: 0;
  transform: translateY(-50%);
  width: 1.6rem;
  height: 1.6rem;
  background-size: 1.6rem;
  background-repeat: no-repeat;
  background-position: center;
}

.steam-deck-description-info:before {
  background-image: url('../icons/attention_icon_white.svg');
}

.steam-deck-description-playable:before {
  background-image: url('../icons/check_icon_white.svg');
}

.steam-deck-description-unsupported:before {
  background-image: url('../icons/unsupported_icon_grey.svg');
}

.steam-deck-description-verified:before {
  background-image: url('../icons/check_icon_gradient.svg');
}

.product-reviews-page.breadcrumb {
  margin-top: 4rem;
}

.product-reviews {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 4.8rem;
}

.product-review,
.product-my-review {
  --star-size: 2rem;
  --margin-product-review: 1rem;
  --number-per-row-product-review: 1;
  --user-image-size-product-review: 6.4rem;
  --line-clamp-product-review-description: 3;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  padding: 1.2rem 2rem 1.6rem;
  margin: 0 var(--margin-product-review) 4rem;
  width: calc(100%/var(--number-per-row-product-review) - 2*var(--margin-product-review));
  font-size: 1.6rem;
  color: var(--font-color-medium);
  background-color: var(--background-color-3-op-75);
}

.product-my-review {
  padding: 0;
  background: transparent;
}

.product-review-popup-container .product-review {
  margin: 0;
  padding: 0;
  width: 100%;
  background: initial;
}

.product-review.add-review-block {
  min-height: 24rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.product-review.add-review-block:last-child:first-child {
  width: 100%;
}

.add-review-block-call {
  margin-bottom: 1rem;
  color: var(--font-color-medium);
  display: none;
}

.product-review.add-review-block:last-child:first-child .add-review-block-call {
  display: block;
}

.product-review-product-name {
  order: 1;
  width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-bottom: 1.4rem;
  line-height: 1;
}

.product-review-popup-container .product-review-product-name {
  text-overflow: initial;
  overflow: initial;
  white-space: normal;
  line-break: anywhere;
}

.product-my-review .product-review-product-name {
  font-size: 1.6rem;
}

.product-review-product-link {
  color: var(--font-color-white);
  font-size: 2rem;
}

.product-review-product-link:hover,
.product-review-product-link:focus {
  color: var(--font-color-white);
}

.add-review-block-title {
  color: var(--font-color-white);
  font-size: 2rem;
  margin-bottom: 0.8rem;
}

.product-review-image-container {
  position: relative;
  width: 100%;
}

.product-review-image-wrapper {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

.product-review-image-wrapper:before {
  content: '';
  display: block;
  height: 0;
  width: 100%;
  padding-bottom: 57.31%;
  margin-bottom: 1.6rem;
}

.product-review-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  max-height: 100%;
}

.product-review-score {
  order: 2;
  --star-url: url('../icons/star.svg');
  --star-empty-url: url('../icons/star-empty.svg');
  --star-half-url: url('../icons/star-half.svg');
  width: calc(5*var(--star-size) + 1.6rem);
  height: var(--star-size);
  padding: 0;
  margin: 0 1.2rem 4.8rem 0;
}

.product-my-review .product-review-score {
  margin-bottom: 0;
  cursor: pointer;
}

.add-review-block .product-review-score {
  order: initial;
  margin: 0 0 2rem;
  cursor: pointer;
}

.catalog-review-container .product-review-score {
  display: flex;
  align-items: center;
  width: auto;
  margin-right: auto;
  margin-bottom: 0;
  font-size: 1.8rem;
  color: var(--font-color-light);
  line-height: 1;
}

.catalog-data-container .product-review-score {
  order: initial;
  --star-size: 2rem;
  margin: auto 0 0;
  cursor: pointer;
}

.catalog-review-container .product-review-score span {
  padding-top: 0.6rem;
  padding-left: 1rem;
}

.product-review-score:before,
.product-review-score[data-score="0"]:before,
.product-review-score[data-score="0.0"]:before {
  content: '';
  display: block;
  width: calc(5*var(--star-size) + 1.6rem);
  height: 100%;
  background-image:
      var(--star-empty-url),
      var(--star-empty-url),
      var(--star-empty-url),
      var(--star-empty-url),
      var(--star-empty-url);
  background-position:
      0 center,
      calc(1*var(--star-size) + 0.4rem) center,
      calc(2*var(--star-size) + 0.8rem) center,
      calc(3*var(--star-size) + 1.2rem) center,
      calc(4*var(--star-size) + 1.6rem) center;
  background-repeat: no-repeat;
  background-size: var(--star-size);
}
.product-review-score[data-score="0.5"]:before {
  background-image:
      var(--star-half-url),
      var(--star-empty-url),
      var(--star-empty-url),
      var(--star-empty-url),
      var(--star-empty-url);
}
.product-review-score[data-score="1"]:before,
.product-review-score[data-score="1.0"]:before {
  background-image:
      var(--star-url),
      var(--star-empty-url),
      var(--star-empty-url),
      var(--star-empty-url),
      var(--star-empty-url);
}
.product-review-score[data-score="1.5"]:before {
  background-image:
      var(--star-url),
      var(--star-half-url),
      var(--star-empty-url),
      var(--star-empty-url),
      var(--star-empty-url);
}
.product-review-score[data-score="2"]:before,
.product-review-score[data-score="2.0"]:before {
  background-image:
      var(--star-url),
      var(--star-url),
      var(--star-empty-url),
      var(--star-empty-url),
      var(--star-empty-url);
}
.product-review-score[data-score="2.5"]:before {
  background-image:
      var(--star-url),
      var(--star-url),
      var(--star-half-url),
      var(--star-empty-url),
      var(--star-empty-url);
}
.product-review-score[data-score="3"]:before,
.product-review-score[data-score="3.0"]:before {
  background-image:
      var(--star-url),
      var(--star-url),
      var(--star-url),
      var(--star-empty-url),
      var(--star-empty-url);
}
.product-review-score[data-score="3.5"]:before {
  background-image:
      var(--star-url),
      var(--star-url),
      var(--star-url),
      var(--star-half-url),
      var(--star-empty-url);
}
.product-review-score[data-score="4"]:before,
.product-review-score[data-score="4.0"]:before {
  background-image:
      var(--star-url),
      var(--star-url),
      var(--star-url),
      var(--star-url),
      var(--star-empty-url);
}
.product-review-score[data-score="4.5"]:before {
  background-image:
      var(--star-url),
      var(--star-url),
      var(--star-url),
      var(--star-url),
      var(--star-half-url);
}
.product-review-score[data-score="5"]:before,
.product-review-score[data-score="5.0"]:before {
  background-image:
      var(--star-url),
      var(--star-url),
      var(--star-url),
      var(--star-url),
      var(--star-url);
}

.product-review-ago-text {
  order: 3;
  line-height: calc(1.307692*var(--star-size));
  font-size: 1.6rem;
  margin-right: auto;
  max-width: 100%;
  min-width: calc(100% - 20rem);
}

.product-my-review .product-review-ago-text {
  min-width: auto;
}

.product-review-edit-button {
  order: 4;
  display: inline-block;
  margin-right: 0.2rem;
  padding: 0.1rem 0.7rem 0;
  border-radius: 0.2rem;
  font-size: 1.5rem;
  line-height: 1;
  text-transform: capitalize;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border: 0.1rem solid;
  border-image-slice: 1;
  border-image-source: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  color: var(--font-color-white);
  background-color: var(--background-color-3-op-85);
}

.product-review-edit-button:hover {
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background-image: linear-gradient(135deg, var(--start-background-color), var(--end-background-color) 77%);
}

.product-review-description-container {
  order: 4;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: calc(100% - var(--user-image-size-product-review));
  padding-right: 1.6rem;
}

.product-review-popup-container .product-review-description-container {
  order: 5;
  width: 100%;
  padding-right: 0;
}

.product-review-description {
  max-width: 100%;
  height: 6.2rem;
  padding-right: 1.6rem;
  overflow: hidden;
  font-size: 1.6rem;
  line-height: 2rem;
  -webkit-line-clamp: 3;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  margin-bottom: 0.8rem;
}

.product-review-popup-container .product-review-description {
  -webkit-line-clamp: initial;
  -webkit-box-orient: initial;
  display: block;
  height: auto;
}

.product-review-description-more {
  color: var(--font-color-dark);
  visibility: hidden;
}

.product-review-description-more.visible {
  visibility: visible;
}

.product-review-popup-container .product-review-description-more {
  display: none;
}

.product-review-description-more:hover {
  color: var(--font-color-medium);
}

.product-review-user {
  order: 5;
  margin-top: 0;
}

.product-review-popup-container .product-review-user {
  order: 4;
  margin-bottom: 2rem;
  min-width: 100%;
}

.product-review-user-image-container {
  display: block;
  width: var(--user-image-size-product-review);
  height: var(--user-image-size-product-review);
  --product-review-user-image-translateY: calc(-1*0.348837209*var(--user-image-size-product-review));
  --product-review-user-badge-image: none;
  --product-review-user-badge-color-border: none;
  margin: 0;
  transform: translateY(var(--product-review-user-image-translateY));
  padding: 0;
  position: relative;
}

.product-review-user-image-container:before {
  content: attr(data-title);
  position: absolute;
  display: none;
  justify-content: center;
  align-items: center;
  width: 100%;
  aspect-ratio: 4.2;
  left: 50%;
  top: 100%;
  transform: translateX(-50%) translateY(1rem);
  font-size: 1.1rem;
  font-weight: bold;
  color: var(--font-color-black);
  text-transform: uppercase;
  z-index: 1;
}

.product-review-user-image-container:after {
  content: '';
  position: absolute;
  display: none;
  top: 100%;
  left: 50%;
  width: calc(var(--user-image-size-product-review) - 0.2rem);
  height: calc(0.348837209*var(--user-image-size-product-review));
  transform: translateY(0) translateX(-50%);
  background-repeat: no-repeat;
  background-size: calc(var(--user-image-size-product-review) - 0.2rem) calc(0.348837209*var(--user-image-size-product-review));
  background-image: var(--product-review-user-badge-image);
}

@media (min-width: 600px) {
    .product-review-user-image-container:before,
    .product-review-user-image-container:after {
        display: flex;
    }
}

.product-review-user-image {
  display: block;
  width: var(--user-image-size-product-review);
  height: var(--user-image-size-product-review);
  margin: 0;
  padding: 0;
  border: 0.1rem solid var(--product-review-user-badge-color-border);
}

.product-reviews-pagination {
  width: 100%;
  text-align: center;
}

.not-product-reviews {
  margin: 0 1.2rem auto;
  font-size: 2rem;
  color: var(--font-color-light);
}

.error-popup-container {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.error-popup-message {
  color: var(--font-color-light);
  font-size: 1.8rem;
  margin-bottom: 3.2rem;
}

.error-popup-notification {
  color: var(--font-color-light);
  font-size: 1.6rem;
}

.product-review-popup-container {
  padding-top: 1rem;
}

.product-review-popup-container form {
  display: flex;
  flex-direction: column;
  margin: 0;
}

.product-review-form-group {
  position: relative;
  display: block;
  margin-bottom: 2.4rem;
}

.product-review-form-group:last-child {
  margin-bottom: 0;
}

.product-review-form-group .product-review-score {
  --star-size: 2.6rem;
  margin: 0;
  cursor: pointer;
}

.product-review-form-description {
  width: 100%;
  height: 19.2rem;
}

.yxp_daily_boost_container {
  --parent-padding: 2.4rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 30rem;
  position: relative;
}

.yxp_daily_boost_container:before {
  content: '';
  position: absolute;
  top: calc(-1*var(--parent-padding));
  left: calc(-1*var(--parent-padding));
  width: calc(100% + 2*var(--parent-padding));
  height: calc(100% + 2*var(--parent-padding));
  background-image: url('../images/yxp_popup_background.jpg');
  background-size: cover;
}

.yxp_daily_boost_message {
  position: relative;
  font-size: 6.4rem;
  line-height: 0.8;
  text-transform: uppercase;
  color: var(--font-color-light);
}

.yxp_daily_boost_error {
  position: relative;
  font-size: 3.2rem;
  line-height: 1.4;
  text-align: center;
  text-transform: uppercase;
  color: var(--font-color-light);
}

.yxp_daily_boost_reward {
  position: relative;
  font-size: 12.8rem;
  font-weight: bold;
  line-height: 0.8;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background-color: var(--start-background-color);
  background: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  background-size: 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.yxp-program-header-section {
  position: relative;
  width: 100%;
  max-width: 100%;
  height: 38.6rem;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  color: transparent;
  margin-bottom: 10rem;
  padding: 0;
}

.yxp-program-header-section:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(100% - 0.3rem);
  background-image: url('../images/yxp_program_header.jpg');
  background-size: cover;
  z-index: 1;
}

.yxp-program-header-section .container {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  justify-content: center;
}

.yxp-program-headline {
  text-transform: uppercase;
  font-weight: bold;
  line-height: 0.8;
  margin: 0;
}

.yxp-program-sub-headline {
  text-transform: uppercase;
  font-weight: bold;
  line-height: 0.8;
  margin: 0;
  color: var(--font-color-light);
}

.yxp-program-description-section {
  margin-bottom: 1.6rem;
}

.yxp-program-description-section .page-content {
  color: var(--font-color-light);
}

.yxp-program-description-section .content-container {
  height: 100%;
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  line-height: 1.5;
}

.yxp-program-description-section .page-sidebar img {
  width: 100%;
  display: block;
  margin-top: 4.2rem;
}

.membership-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: linear-gradient(to right, #303030, #1f1f1f);
  padding: 0 2.4rem 2rem;
  border-radius: 1rem;
}

.yxp-program-description-section .membership-container {
  margin-top: auto;
  margin-block-start: 4.8rem;
}

.membership-badge {
  background-size: 100%;
  background-repeat: no-repeat;
  --membership-badge-width: 8.2rem;
  width: var(--membership-badge-width);
  height: calc(0.3823529*var(--membership-badge-width));
  margin-bottom: 3.8rem;
  padding-top: calc(0.1470588*var(--membership-badge-width));
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  position: relative;
  font-size: calc(0.117647*var(--membership-badge-width));
  font-weight: bold;
  text-transform: uppercase;
  color: var(--background-color-3);
}

.membership-badge.locked {
  background-image: url('../icons/badges/locked.png');
}

.membership-badge.welcome {
  background-image: url('../icons/badges/welcome.png');
}

.membership-badge.rookie {
  background-image: url('../icons/badges/rookie.png');
}

.membership-badge.bronze {
  background-image: url('../icons/badges/bronze.png');
}

.membership-badge.silver {
  background-image: url('../icons/badges/silver.png');
}

.membership-badge.gold {
  background-image: url('../icons/badges/gold.png');
}

.membership-badge:before,
.membership-badge:after {
  position: absolute;
  top: calc(50% + 0.0735294*var(--membership-badge-width));
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background-color: var(--start-background-color);
  background: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  background-size: 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: calc(0.176470*var(--membership-badge-width));
  font-weight: bold;
  text-transform: uppercase;
  text-wrap: nowrap;
  overflow-wrap: normal;
  white-space: nowrap;
}

.membership-badge:before {
  content: attr(data-before-text);
  left: 0;
  transform: translate(calc(-100% - 1rem), -50%);
}

.membership-badge:after {
  content: attr(data-after-text);
  right: 0;
  transform: translate(calc(100% + 1rem), -50%);
}

.yxp-progress-bar-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
}

.yxp-progress-bar-label {
  width: 0.1rem;
  height: 2.4rem;
  background-color: var(--border-color);
  margin-top: 1rem;
  margin-bottom: 1rem;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1;
  color: var(--border-color);
  position: relative;
}

.yxp-progress-bar-label.end {
  margin-left: auto;
}

.yxp-progress-bar-label.current {
  margin-bottom: 2.4rem;
  margin-left: var(--yxp_percent);
}

.yxp-progress-bar-label:before {
  content: attr(data-label);
  position: absolute;
  top: -2rem;
  left: -1.6rem;
}

.yxp-progress-bar-label.end:before {
  left: initial;
  right: -1.6rem;
}

.yxp-progress-bar-label.current:before {
  left: 0;
  right: initial;
  top: calc(100% + 0.8rem);
  transform: translateX(-50%);
}

.yxp-progress-bar-label.delimiter:after {
  content: '';
  position: absolute;
  bottom: 0;
  height: 2.2rem;
  border: 0.1rem dashed var(--border-color);
  transform: translateY(calc(100% + 1.2rem)) translateX(-0.05rem);
}

.yxp-progress-bar {
  position: relative;
  width: 100%;
  height: 2.4rem;
  border: 0.2rem solid var(--border-color);
  border-radius: 1.2rem;
}

.yxp-progress-bar:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 50%;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: #6b89f9;
  background-color: var(--start-background-color);
  background: linear-gradient(to right, var(--start-background-color), var(--end-background-color) var(--orders_yxp_percent), transparent var(--orders_yxp_percent));
  width: 100%;
  border-radius: 1.1rem 1.1rem 0 0;
}

.yxp-progress-bar:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  height: 50%;
  --start-background-color: #866ff7;
  --end-background-color: var(--gradient-second-color);
  background-color: var(--start-background-color);
  background: linear-gradient(to right, var(--start-background-color) 0%, var(--end-background-color) var(--challenges_yxp_percent), transparent var(--challenges_yxp_percent));
  width: 100%;
  border-radius: 0 0 1.1rem 1.1rem;
}

.yxp-program-lootbox-list-section {
  padding-bottom: 0;
  margin-bottom: 0;
}

.yxp-program-lootbox-list-section .container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
}

.yxp-program-lootbox {
  width: 100%;
  display: grid;
  grid-template-areas: "image" "title" "description" "items";
  grid-template-rows: auto auto 1fr auto;
  grid-template-columns: auto;
  margin-bottom: 8rem;
  font-size: 1.4rem;
  color: var(--font-color-light);
}

.yxp-program-lootbox-image-container {
  grid-area: image;
  margin-bottom: 2rem;
}

.yxp-program-lootbox-image {
  display: block;
  margin: 0;
  width: 100%;
}

.yxp-program-lootbox-title {
  grid-area: title;
  margin-bottom: 1.6rem;
  padding: 0 2rem;
  font-size: 2rem;
}

.yxp-program-lootbox-description {
  grid-area: description;
  margin-bottom: 3.6rem;
  padding: 0 2rem;
}

.yxp-program-lootbox-items {
  grid-area: items;
  align-self: start;
  padding-left: 2rem;
  padding-right: 2rem;
}

.yxp-program-lootbox-item {
  position: relative;
  margin-bottom: 2.4rem;
  padding-left: 3.6rem;
  color: var(--font-color-blue);
}

.yxp-program-lootbox-item:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 3.6rem;
  height: 1.6rem;
  background-image: url('../icons/check_icon_blue.svg');
  background-repeat: no-repeat;
  background-position: left top;
}

.yxp-program-lootbox-item:last-child {
  margin-bottom: 0;
}

.yxp-program-go-to-my-achievements .gradient-separator {
  width: 100%;
}

.go-to-my-achievements-btn {
  margin-left: auto;
  margin-right: auto;
}

.my-ach-page .page-content > *:last-child {
  margin-bottom: 3.6rem;
}

.my-ach-user-info-container {
  width: 100%;
  display: grid;
  grid-template-areas: "avatar" "username" "rank" "yxp" "yxp-list";
  grid-template-columns: auto;
  grid-template-rows: min-content auto min-content;
  margin-bottom: 9rem;
}

.my-ach-user-name {
  grid-area: username;
  margin: 0 auto 1.6rem;
  font-size: 4.6rem;
  font-weight: bold;
  line-height: 1;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background-color: var(--start-background-color);
  background: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  background-size: 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  overflow-wrap: anywhere;
  text-align: center;
}

.my-ach-user-image-container {
  grid-area: avatar;
  max-width: 64%;
  margin: 0 auto 1.6rem;
}

.my-ach-user-image {
  display: block;
  width: fit-content;
  border-width: 0.2rem;
  border-style: solid;
  --locked-border: #868686;
  --welcome-border: #02FEFF;
  --rookie-border: #FD3BFE;
  --bronze-border: #FEB862;
  --silver-border: #EBEBED;
  --gold-border: #DC8E43;
  --badge-image: url('../icons/badges/locked.png');
  --badge-color-border: #868686;
  border-color: var(--badge-color-border);
  position: relative;
}

.my-ach-user-image.locked-badge {
  border-color: var(--locked-border);
}

.my-ach-user-image.welcome-badge {
  border-color: var(--welcome-border);
}

.my-ach-user-image.rookie-badge {
  border-color: var(--rookie-border);
}

.my-ach-user-image.bronze-badge {
  border-color: var(--bronze-border);
}

.my-ach-user-image.silver-badge {
  border-color: var(--silver-border);
}

.my-ach-user-image.gold-badge {
  border-color: var(--gold-border);
}

.my-ach-user-image:before {
  content: attr(data-title);
  position: absolute;
  display: none;
  justify-content: center;
  align-items: center;
  width: 100%;
  aspect-ratio: 4.2;
  left: 50%;
  top: 100%;
  transform: translateX(-50%) translateY(1rem);
  font-size: 1.1rem;
  font-weight: bold;
  color: var(--font-color-black);
  text-transform: uppercase;
  z-index: 1;
}

.my-ach-user-image:after {
  content: '';
  position: absolute;
  display: none;
  top: 100%;
  left: 50%;
  width: 8.6rem;
  height: 3rem;
  transform: translateY(0) translateX(-50%);
  background-repeat: no-repeat;
  background-size: 8.6rem 3rem;
  background-image: var(--badge-image);
}

.my-ach-user-image.locked-badge:after {
  background-image: url('../icons/badges/locked.png');
}

.my-ach-user-image.welcome-badge:after {
  background-image: url('../icons/badges/welcome.png');
}

.my-ach-user-image.rookie-badge:after {
  background-image: url('../icons/badges/rookie.png');
}

.my-ach-user-image.bronze-badge:after {
  background-image: url('../icons/badges/bronze.png');
}

.my-ach-user-image.silver-badge:after {
  background-image: url('../icons/badges/silver.png');
}

.my-ach-user-image.gold-badge:after {
  background-image: url('../icons/badges/gold.png');
}

.my-ach-user-image img {
  display: block;
  width: 100%;
  margin: 0;
}

.my-ach-user-rank,
.my-ach-user-yxp {
  align-self: start;
  justify-self: start;
  margin: 0 auto 1.6rem;
  padding: 1.1rem 2rem;
  background: linear-gradient(to right, #303030, #1f1f1f);
  border-radius: 1.2rem;
  white-space: nowrap;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1;
  color: var(--font-color-light);
}

.my-ach-user-rank span,
.my-ach-user-yxp span {
  font-weight: normal;
  color: var(--font-color-blue);
}

.my-ach-user-rank {
  grid-area: rank;
}

.my-ach-user-yxp {
  grid-area: yxp;
}

.my-ach-user-yxp-list {
  grid-area: yxp-list;
  padding: 1.6rem 2.4rem 0 2rem;
}

.my-ach-user-orders-yxp,
.my-ach-user-challenges-yxp {
  margin: 0;
  font-size: 1.4rem;
  font-weight: bold;
  color: var(--font-color-light);
  line-height: 1.6;
}

.my-ach-user-orders-yxp {
  margin-bottom: 1rem;
}

.my-ach-user-orders-yxp span {
  color: var(--gradient-first-color);
}

.my-ach-user-challenges-yxp span {
  color: var(--gradient-second-color);
}

.rewards-loading-container {
  display: flex;
  flex-wrap: wrap;
  padding: 2.6rem 3.6rem;
  background-color: var(--background-color-3);
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border: 0.1rem solid;
  border-image-slice: 1;
  border-image-source: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
}

@media (min-width: 1280px) {
  .rewards-loading-container {
    flex-wrap: nowrap;
  }
}

.rewards-loading-container-title {
  width: auto;
  margin: 1.2rem auto;
}

.rewards-loading-container-title h2 {
  margin: 0;
  line-height: 1.2;
}

.rewards-loading-container-title span:first-child {
  font-weight: bold;
  padding-right: 1rem;
}

@media (min-width: 1280px) {
  .rewards-loading-container-title {
    min-width: 33.333333%;
    margin: 0 auto;
  }

  .rewards-loading-container-title h2 span {
    display: block;
    --start-background-color: var(--gradient-first-color);
    --end-background-color: var(--gradient-second-color);
    background: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
    background-size: 100%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
}

.rewards-loading-items {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  position: relative;
}

.rewards-loading-item {
  z-index: 1;
  position: relative;
  --rewards-loading-item-width: 46%;
  min-width: var(--rewards-loading-item-width);
  flex-basis: var(--rewards-loading-item-width);
  aspect-ratio: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  --rewards-loading-item-margin-lr: calc(50% - var(--rewards-loading-item-width));
  margin: 1.2rem var(--rewards-loading-item-margin-lr);
  padding: 0.9rem;
  font-size: 1.3rem;
  text-align: center;
  text-transform: uppercase;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border: 0.1rem solid;
  border-image-slice: 1;
  border-image-source: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  color: var(--font-color-light);
}

.rewards-loading-item:nth-child(2n+1) {
  margin-left: 0;
}

.rewards-loading-item:nth-child(2n+2) {
  margin-right: 0;
}

@media (min-width: 640px) {
  .rewards-loading-item {
    --rewards-loading-item-width: 12.4rem;
    --rewards-loading-item-margin-lr: calc(16.666666% - 0.666666*var(--rewards-loading-item-width));
    font-size: 1.39rem;
  }

  .rewards-loading-item:nth-child(2n+1),
  .rewards-loading-item:nth-child(3n+1) {
    margin-left: var(--rewards-loading-item-margin-lr);
  }

  .rewards-loading-item:nth-child(2n+2),
  .rewards-loading-item:nth-child(3n+3) {
    margin-right: var(--rewards-loading-item-margin-lr);
  }

  .rewards-loading-item:nth-child(4n+1) {
    margin-left: 0;
  }

  .rewards-loading-item:nth-child(4n+4) {
    margin-right: 0;
  }
}

@media (min-width: 520px) and (max-width: 639px), (min-width: 768px) and (max-width: 911px)  {
  .rewards-loading-item {
    --rewards-loading-item-width: 12.8rem;
    --rewards-loading-item-margin-lr: calc(25% - 0.75*var(--rewards-loading-item-width));
  }

  .rewards-loading-item:nth-child(2n+1) {
    margin-left: var(--rewards-loading-item-margin-lr);
  }

  .rewards-loading-item:nth-child(2n+2) {
    margin-right: var(--rewards-loading-item-margin-lr);
  }

  .rewards-loading-item:nth-child(3n+1) {
    margin-left: 0;
  }

  .rewards-loading-item:nth-child(3n+3) {
    margin-right: 0;
  }
}

.rewards-loading-item:last-child {
  margin-right: auto;
}

.rewards-loading-item.full-width {
  padding: 0.1rem;
}

.rewards-loading-item:before {
  content: '';
  z-index: -1;
  position: absolute;
  width: calc(100% - 0.2rem);
  height: calc(100% - 0.2rem);
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  background-image: url('../images/entity_background.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}

.rewards-loading-item picture {
  display: block;
  width: calc(100% - 0.2rem);
  margin: 0 0.1rem;
  position: relative;
}

.rewards-loading-item.is_badge {
  --badge-level-title: '';
}

.rewards-loading-item.is_badge > picture:before {
  content: var(--badge-level-title);
  position: absolute;
  top: calc(50% + 0.8rem);
  left: 50%;
  transform: translateX(-50%) translateY(-50%) scaleY(.94);
  color: var(--font-color-black);
  font-size: 1.4rem;
  font-weight: bold;
}

.rewards-loading-item picture > img {
  display: block;
  margin: 0;
  width: 100%;
}

.rewards-loading-item span {
  font-weight: normal;
  display: block;
}

.rewards-loading-item span:first-child {
  font-weight: bold;
}

.rewards-loading-item.is_yxp span,
.rewards-loading-item.is_coin span {
  font-size: 2rem;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background: linear-gradient(45deg, var(--start-background-color), var(--end-background-color) 70%);
  background-size: 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.rewards-loading-item-product-link {
  width: 100%;
  padding: 0.4rem 0.8rem;
  overflow: hidden;
  color: var(--font-color-light);
  background: var(--background-color-3-op-75);
  white-space: nowrap;
  text-overflow: ellipsis;
}

.my-badge-list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
  background: linear-gradient(to right, #303030, #1f1f1f);
  padding: 2rem;
  border-radius: 1rem;
}

.my-badge-item {
  position: relative;
  width: calc(33.333333% - 1rem);
  margin: 0 .5rem
}

.my-badge-item:nth-child(3n+1):nth-last-child(-n+3),
.my-badge-item:nth-child(3n+1):nth-last-child(-n+3) ~ .my-badge-item {
  margin-top: 2rem;
}

.my-badge-item:after {
  content: attr(data-title);
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  aspect-ratio: 4.2;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%) translateY(0);
  font-size: 1.2rem;
  font-weight: bold;
  color: var(--font-color-black);
  text-transform: uppercase;
}

.my-badge-item img {
  display: block;
  width: 100%;
  margin: 0;
}

.my-loyalty-event-list {
  display: flex;
  width: 100%;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;
}

.my-loyalty-event {
  position: relative;
  display: grid;
  justify-items: center;
  grid-template-areas: "status" "title" "description" "repetitions" "xp";
  grid-template-rows: 40% min-content auto minmax(3.4rem, min-content) min-content;
  width: 100%;
  aspect-ratio: 1.6;
  margin-bottom: 2rem;
  padding: 2rem 1rem 1.8rem;
  background: linear-gradient(to right, #000F1E, #171F22);
  border: 2px solid #39373A;
  font-size: 1.4rem;
  font-weight: bold;
  line-height: 1;
  color: var(--font-color-light);
}

.my-loyalty-event.has-countdown:not(.locked) {
  grid-template-areas: "status" "title" "description" "countdown" "repetitions" "xp";
  grid-template-rows: 0 min-content auto 36% minmax(3.4rem, min-content) min-content;
  border-color: #14D6DF;
}

.my-loyalty-event.completed {
  border-color: #38F8D1;
}

.my-loyalty-event:last-child {
  margin-bottom: 0;
}

.my-loyalty-event:hover:not(.completed):not(.locked):not(.has-countdown) {
  border-color: #F40FFF;
}

.my-loyalty-event.locked:before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 36%;
  aspect-ratio: 2;
  background-image: url('../icons/badges/locked.png');
  background-position: top center;
  background-size: 100%;
  background-repeat: no-repeat;
  z-index: 10;
}

.my-loyalty-event-status {
  grid-area: status;
  position: inherit;
  z-index: 1;
  width: 100%;
  height: 100%;
}

.my-loyalty-event-status:before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center 0.8rem;
  background-size: 4rem;
}

.my-loyalty-event.completed .my-loyalty-event-status:before {
  background-image: url('../icons/check_icon_green.svg');
}

.my-loyalty-event-title {
  grid-area: title;
  position: inherit;
  z-index: 1;
  font-size: 2rem;
  color: var(--font-color-white);
  padding-bottom: 1rem;
}

.my-loyalty-event-description {
  grid-area: description;
  position: inherit;
  z-index: 1;
  font-weight: normal;
  color: #656067;
}

.my-loyalty-event-countdown {
  grid-area: countdown;
  position: inherit;
  z-index: 1;
  height: 100%;
  margin: auto 0;
  font-size: 3.4rem;
  font-weight: bold;
  line-height: 1;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background-color: var(--start-background-color);
  background: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  background-size: 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.my-loyalty-event-repetitions {
  grid-area: repetitions;
  position: inherit;
  z-index: 1;
  display: flex;
  margin-bottom: 2rem;
}

.my-loyalty-event-repetitions span {
  display: block;
  width: 1.4rem;
  height: 1.4rem;
  border-radius: 0.7rem;
  margin: 0 0.6rem;
  background-color: #4C4C4C;
}

.my-loyalty-event-repetitions span.completed {
  background-color: #3CF4B4;
}

.my-loyalty-event-repetitions span:first-child {
  margin-left: 0;
}

.my-loyalty-event-repetitions span:last-child {
  margin-right: 0;
}

.my-loyalty-event-xp {
  grid-area: xp;
  position: inherit;
  z-index: 1;
}

.my-loyalty-event.completed .my-loyalty-event-xp {
  color: var(--font-color-blue);
}

.my-loyalty-event-image {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.my-loyalty-event-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.my-avatar-list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;
}

.my-avatar-list.hidden {
  display: none;
}

.my-avatar-item {
  position: relative;
  display: block;
  width: calc(50% - 1rem);
  margin: 0 1rem 4rem;
  aspect-ratio: 1;
}

.my-avatar-item:nth-child(2n+1):nth-last-child(-n+2),
.my-avatar-item:nth-child(2n+1):nth-last-child(-n+2) ~ .my-avatar-item {
  margin-bottom: 0;
}

.my-avatar-item:nth-child(2n+1) {
  margin-left: 0;
}

.my-avatar-item:nth-child(2n+2) {
  margin-right: 0;
}

.my-avatar-item:last-child {
  margin-right: auto;
}

.my-avatar-item:before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 36%;
  aspect-ratio: 2;
  background-image: var(--my-avatar-item-badge-url);
  background-position: top center;
  background-size: 100%;
  background-repeat: no-repeat;
  z-index: 1;
}

.my-avatar-item:after {
  content: attr(data-title);
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 36%;
  aspect-ratio: 4;
  left: 50%;
  top: 4.4%;
  transform: translateX(-50%);
  font-size: 1.2rem;
  font-weight: bold;
  color: var(--font-color-black);
  text-transform: uppercase;
  z-index: 2;
}

.my-avatar-item-picture,
.my-avatar-item-picture img {
  display: block;
  width: 100%;
  margin-bottom: 0;
}

.my-avatar-item-button-container {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 0;
  overflow: hidden;
  transition: all 0.297s;
  background-color: var(--background-color-3-op-65);
}

.my-avatar-item:hover .my-avatar-item-button-container {
  height: 100%;
  visibility: visible;
}

.my-avatar-item-upload-btn {
  padding: 0.6rem 3.6rem 0.4rem;
  border: 0.2rem solid var(--font-color-white);
  border-radius: 2rem;
  background: var(--background-color-3-op-75);
  font-size: 2rem;
  font-weight: bold;
  color: var(--font-color-white);
}

.my-avatar-item-upload-btn:hover {
  background: var(--background-color-3-op-95);
}

.my-avatar-show-hidden-btn {
  position: relative;
  width: 100%;
  height: 100%;
  padding: 2rem;
  background: var(--background-color-3-op-75);
  text-wrap: wrap;
  overflow-wrap: break-word;
  hyphens: manual;
  font-size: 2rem;
  --my-avatar-show-hidden-btn-color: var(--font-color-medium);
  color: var(--my-avatar-show-hidden-btn-color);
  text-transform: uppercase;
}

.my-avatar-show-hidden-btn:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(100% - 2.4rem);
  height: calc(100% - 2.4rem);
  transform: translateX(-50%) translateY(-50%);
  border: 2px solid var(--my-avatar-show-hidden-btn-color);
}

.my-avatar-show-hidden-btn:hover {
  --my-avatar-show-hidden-btn-color: var(--font-color-light);
}

.my-lootbox-list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-around;
}

.my-lootbox-item {
  position: relative;
  display: block;
  width: 100%;
  margin: 0 0 4rem;
  aspect-ratio: 1;
  background-color: var(--background-color-3-op-65);
}

.my-lootbox-item.coming-soon {
  margin-bottom: 0;
}

.my-lootbox-item:not(.open):not(.coming-soon):before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 36%;
  aspect-ratio: 2;
  background-image: url('../icons/badges/locked.png');
  background-position: top center;
  background-size: 100%;
  background-repeat: no-repeat;
  z-index: 1;
}

.my-lootbox-item > picture,
.my-lootbox-item > picture > img {
  display: block;
  width: 100%;
  margin: 0;
}

.my-lootbox-item-rewards-container {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  height: 0;
  overflow: hidden;
  transition: all 0.297s;
  background-color: var(--background-color-3-op-65);
}

.my-lootbox-item:hover .my-lootbox-item-rewards-container {
  height: 100%;
  visibility: visible;
}

.my-lootbox-item-rewards-headline {
  margin-top: 8rem;
  margin-bottom: 3.2rem;
  font-size: 3rem;
  font-weight: bold;
  line-height: 1;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background-color: var(--start-background-color);
  background: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  background-size: 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.my-lootbox-item-more-link {
  padding: 0.6rem 3.6rem 0.4rem;
  border: 0.2rem solid var(--font-color-white);
  border-radius: 2rem;
  background: var(--background-color-3-op-75);
  font-size: 2rem;
  font-weight: bold;
  color: var(--font-color-white);
}

.my-lootbox-item-more-link:hover {
  background: var(--background-color-3-op-95);
}

.my-lootbox-item-rewards {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: 0;
  padding: 0;
  list-style: none;
}

.my-lootbox-item-reward {
  position: relative;
  margin-bottom: 2rem;
  padding-left: 3.4rem;
  font-size: 1.6rem;
  line-height: 2rem;
  color: var(--font-color-blue);
}

.my-lootbox-item-reward:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 3.6rem;
  height: 2rem;
  background-image: url('../icons/check_icon_blue.svg');
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 1.6rem;
}

.my-lootbox-item-reward:last-child {
  margin-bottom: 0;
}

.my-ach-discount-codes-section-description,
.my-ach-events-section-description {
  margin-bottom: 6.4rem;
  font-size: 2rem;
  font-weight: bold;
}

.my-ach-discount-codes {
  display: flex;
  flex-direction: column;
}

.my-ach-discount-code-head,
.my-ach-discount-code-item {
  position: relative;
  display: grid;
  align-items: center;
  grid-template-areas: "value button" "discount button" "date button";
  grid-template-columns: auto 14.4rem;
  width: 100%;
  margin: 0;
  padding: 0.7rem 0;
}

.my-ach-discount-code-head {
  display: none;
}

.my-ach-discount-code-item {
  border-bottom: 0.1rem solid var(--table-color);
}

.my-ach-discount-code-head div {
  font-size: 1.45rem;
  font-weight: bold;
  color: var(--font-color-white);
  line-height: 1;
}

.my-ach-discount-code-item div {
  font-size: 1.4rem;
  line-height: 1;
}

.my-ach-discount-code-item div:nth-child(1) {
  font-size: 1.45rem;
  font-weight: bold;
  color: var(--font-color-white);
  margin-bottom: 0.2rem;
}

.my-ach-discount-code-item div:nth-child(1) {
  grid-area: value;
}

.my-ach-discount-code-item div:nth-child(2) {
  grid-area: discount;
}

.my-ach-discount-code-item div:nth-child(3) {
  grid-area: date;
}

.my-ach-discount-code-item div:nth-child(3) span {
  font-weight: bold;
}

.my-ach-discount-code-item div:nth-child(4) {
  grid-area: button;
}

.my-ach-discount-code-apply-button,
.my-ach-discount-code-claimed-notification {
  display: inline-block;
  width: 14.4rem;
  height: 3.2rem;
  padding: 0;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background:
    linear-gradient(var(--background-color-2) 0 0) padding-box,
    linear-gradient(to right, var(--start-background-color), var(--end-background-color)) border-box;
  color: var(--font-color-white);
  border: 0.2rem solid transparent;
  border-radius: 1.6rem;
  font-size: 1.6rem;
  line-height: 3rem;
  text-align: center;
}

.my-ach-discount-code-claimed-notification {
  background: var(--border-color);
  color: var(--font-color-light);
}

.my-ach-page .content-header {
  margin-bottom: 2rem;
}

.my-ach-page .content-container {
  margin-bottom: 7.2rem;
}

.lootbox-notification-container {
  --parent-padding: 2.4rem;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  min-height: 30rem;
  position: relative;
  padding: 1.6rem 2.4rem 0;
}

.lootbox-notification-container:before {
  content: '';
  position: absolute;
  top: calc(-1*var(--parent-padding));
  left: calc(-1*var(--parent-padding));
  width: calc(100% + 2*var(--parent-padding));
  height: calc(100% + 2*var(--parent-padding));
  background-image: url('../images/yxp_popup_background.jpg');
  background-size: cover;
}

.lootbox-notification-congratulation {
  z-index: 1;
  margin-bottom: 2.8rem;
  font-size: 3.2rem;
  line-height: 1.5;
  color: var(--font-color-light);
  text-transform: uppercase;
  text-align: center;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.lootbox-notification-congratulation span {
  display: inline-block;
  font-size: 5.6rem;
  font-weight: bold;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background-color: var(--start-background-color);
  background: linear-gradient(45deg, var(--start-background-color), var(--end-background-color) 70%);
  background-size: 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  line-height: 1.2;
}

.lootbox-notification-text {
  z-index: 1;
  width: 100%;
  font-size: 1.8rem;
  line-height: 1.2;
  color: var(--font-color-light);
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 2.4rem;
}

.lootbox-notification-help-text {
  width: 100%;
  z-index: 1;
  padding-top: 2.2rem;
  font-size: 1.6rem;
  color: var(--font-color-blue);
  text-align: center;
}

.lootbox-notification-text span {
  display: inline;
  font-weight: bold;
}

.lootbox-notification-lootbox-picture-container {
  min-width: 25rem;
  max-width: 25rem;
  margin: 0 auto;
  z-index: 1;
}

.lootbox-notification-lootbox-picture {
  width: 100%;
}

.lootbox-notification-lootbox-picture img {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  margin: 0;
}

.lootbox-notification-lootbox-item-list {
  z-index: 1;
  max-width: 100%;
  flex: 1;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  align-content: stretch;
}

.lootbox-notification-lootbox-item {
  z-index: 1;
  position: relative;
  width: 13rem;
  height: 13rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 0.8rem;
  padding: 0.9rem;
  font-size: 1.39rem;
  text-align: center;
  text-transform: uppercase;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border: 0.1rem solid;
  border-image-slice: 1;
  border-image-source: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
  color: var(--font-color-light);
}

.lootbox-notification-lootbox-item.full-width {
  padding: 0.1rem;
}

.lootbox-notification-lootbox-item:before {
  content: '';
  z-index: -1;
  position: absolute;
  width: calc(100% - 0.2rem);
  height: calc(100% - 0.2rem);
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  background-image: url('../images/entity_background.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}

.lootbox-notification-lootbox-item > picture {
  display: block;
  width: calc(100% - 0.2rem);
  margin: 0 0.1rem;
  position: relative;
}

.lootbox-notification-lootbox-item.is_badge {
  --badge-level-title: '';
}

.lootbox-notification-lootbox-item.is_badge > picture:before {
  content: var(--badge-level-title);
  position: absolute;
  top: calc(50% + 0.8rem);
  left: 50%;
  transform: translateX(-50%) translateY(-50%) scaleY(.94);
  color: var(--font-color-black);
  font-size: 1.4rem;
  font-weight: bold;
}

.lootbox-notification-lootbox-item > picture > img {
  display: block;
  margin: 0;
  width: 100%;
}

.lootbox-notification-lootbox-item span {
  font-weight: bold;
  display: block;
}

.lootbox-notification-lootbox-item.is_coupon span {
  font-size: 2.2rem;
}

.lootbox-notification-lootbox-item.is_yxp span,
.lootbox-notification-lootbox-item.is_coin span {
  font-size: 2rem;
  font-weight: bold;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background-color: var(--start-background-color);
  background: linear-gradient(45deg, var(--start-background-color), var(--end-background-color) 70%);
  background-size: 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.lootbox-notification-lootbox-item-product-link {
  padding: 0.4rem 0.8rem;
  overflow: hidden;
  color: var(--font-color-light);
  background: var(--background-color-3-op-75);
}

@media (min-width: 600px) {
  .my-ach-user-info-container {
    width: fit-content;
    display: grid;
    grid-template-areas: "avatar username username" "avatar yxp rank" "avatar yxp-list yxp-list";
    grid-template-columns: min-content 1fr auto;
    grid-template-rows: auto 1fr;
    margin-bottom: 9rem;
  }

  .my-ach-user-image-container {
    max-width: initial;
    margin: 0 2.4rem 0 0;
    padding-top: 0.4rem;
  }

  .my-ach-user-image:before,
  .my-ach-user-image:after {
    display: flex;
  }

  .my-ach-user-image img {
    max-width: 9.2rem;
    min-width: 9.2rem;
  }

  .my-ach-user-name {
    margin: 0 2.4rem 1rem 0;
    text-align: initial;
  }

  .my-ach-user-rank,
  .my-ach-user-yxp {
    margin: 0 2.4rem 0 0;
  }

  .my-ach-user-rank {
    justify-self: initial;
  }

  .my-lootbox-item {
    width: calc(50% - 0.5rem);
    margin: 0 0.5rem 4rem;
  }

  .my-lootbox-item:nth-child(2n+1):nth-last-child(-n+2),
  .my-lootbox-item:nth-child(2n+1):nth-last-child(-n+2) ~ .my-lootbox-item {
    margin-bottom: 0;
  }

  .my-lootbox-item:nth-child(2n+1) {
    margin-left: 0;
  }

  .my-lootbox-item:nth-child(2n+2) {
    margin-right: 0;
  }

  .my-lootbox-item:last-child {
    margin-right: auto;
  }

  .my-ach-discount-code-head,
  .my-ach-discount-code-item {
    position: relative;
    display: grid;
    align-items: center;
    grid-template-areas: "value discount date button";
    grid-template-columns: 1fr 10.6rem 10.6rem 14.4rem;
    width: 100%;
    margin: 0;
    padding: 0.7rem 0;
  }

  .my-ach-discount-code-head + .my-ach-discount-code-head {
    display: none;
  }

  .my-ach-discount-code-item div:nth-child(1) {
    margin-bottom: 0;
  }

  .my-ach-discount-code-item div:nth-child(3) span {
    display: none;
  }
}

@media (min-width: 768px) {
  .product-review {
    --user-image-size-product-review: 10rem;
    --number-per-row-product-review: 2;
  }

  .product-review:nth-child(2n+1):nth-last-child(-n+2),
  .product-review:nth-child(2n+1):nth-last-child(-n+2) ~ .product-review {
    margin-bottom: 0;
  }

  .product-my-review {
    --number-per-row-product-review: 2;
  }

  .product-my-review:nth-child(2n+1):nth-last-child(-n+2),
  .product-my-review:nth-child(2n+1):nth-last-child(-n+2) ~ .product-my-review {
    margin-bottom: 0;
  }

  .product-review-popup-container .product-review-description-container {
    order: 4;
    width: calc(100% - var(--user-image-size-product-review));
    padding-right: 1.6rem;
  }

  .product-review-popup-container .product-review-user {
    order: 5;
    margin-bottom: initial;
    min-width: auto;
  }

  .yxp-progress-bar-label:before {
    content: attr(data-label);
    position: absolute;
    top: 0;
    left: 1.2rem;
  }

  .yxp-progress-bar-label.end:before {
    right: 1.2rem;
  }

  .yxp-program-lootbox-list-section .container {
    width: 100%;
  }

  .my-avatar-item {
    width: calc(33.333333% - 2.666666666rem);
    margin: 0 2rem 4rem;
  }

  .my-avatar-item:nth-child(2n+1):nth-last-child(-n+2),
  .my-avatar-item:nth-child(2n+1):nth-last-child(-n+2) ~ .my-avatar-item {
    margin-bottom: 4rem;
  }

  .my-avatar-item:nth-child(2n+1) {
    margin-left: 2rem;
  }

  .my-avatar-item:nth-child(2n+2) {
    margin-right: 2rem;
  }

  .my-avatar-item:nth-child(3n+1):nth-last-child(-n+3),
  .my-avatar-item:nth-child(3n+1):nth-last-child(-n+3) ~ .my-avatar-item {
    margin-bottom: 0;
  }

  .my-avatar-item:nth-child(3n+1) {
    margin-left: 0;
  }

  .my-avatar-item:nth-child(3n+3) {
    margin-right: 0;
  }
}

@media (min-width: 992px) {
  .yxp-program-lootbox {
    width: calc(50% - 2rem);
  }

  .membership-badge {
    --membership-badge-width: 13.6rem;
  }

  .yxp-program-lootbox-list-section .container {
    width: 100%;
  }

  .my-badge-list {
    display: grid;
    flex-direction: initial;
    flex-wrap: initial;
    justify-content: initial;
    grid-template-columns: repeat(5, 1fr);
    --my-badge-list-gap: 3rem;
    gap: var(--my-badge-list-gap);
  }

  .my-badge-item {
    width: fit-content;
    margin: 0;
  }

  .my-badge-item:nth-child(3n+1):nth-last-child(-n+3),
  .my-badge-item:nth-child(3n+1):nth-last-child(-n+3) ~ .my-badge-item {
    margin-top: 0;
  }

  .my-badge-item:after {
    font-size: 2rem;
  }

  .my-badge-item:not(:first-child):before {
    content: '';
    position: absolute;
    top: 0;
    left: calc(-0.5*var(--my-badge-list-gap));
    width: 0.1rem;
    height: 100%;
    border-right: 0.1rem dashed var(--border-color);
  }

  .my-loyalty-event {
    width: calc(50% - 2rem);
    margin-left: 2rem;
    margin-right: 2rem;
    margin-bottom: 4rem;
  }

  .my-loyalty-event:nth-child(2n+1):nth-last-child(-n+2),
  .my-loyalty-event:nth-child(2n+1):nth-last-child(-n+2) ~ .my-loyalty-event {
    margin-bottom: 0;
  }

  .my-loyalty-event:nth-child(2n+1) {
    margin-left: 0;
  }

  .my-loyalty-event:nth-child(2n+2) {
    margin-right: 0;
  }

  .my-loyalty-event:last-child {
    margin-right: auto;
  }

  .my-avatar-item:after {
    font-size: 1rem;
  }

  .lootbox-notification-lootbox-item-list {
    padding-left: 4rem;
  }
}

@media (min-width: 1200px) {
  .product-review {
    --star-size: 2.6rem;
    --number-per-row-product-review: 3;
  }

  .catalog-data-container .product-review-score {
    --star-size: 2.6rem;
  }

  .product-review:nth-child(2n+1):nth-last-child(-n+2) {
    margin-bottom: 4rem;
  }

  .product-review:nth-child(3n+1):nth-last-child(-n+3),
  .product-review:nth-child(3n+1):nth-last-child(-n+3) ~ .product-review {
    margin-bottom: 0;
  }

  .product-review-ago-text {
    font-size: 1.7rem;
  }

  .product-review-product-link {
    font-size: 2.5rem;
  }

  .product-my-review .product-review-product-link {
    font-size: 1.9rem;
  }

  .add-review-block-title {
    font-size: 2.5rem;
  }

  .yxp-program-lootbox {
    width: calc(33.333333% - 2rem);
  }

  .yxp-program-lootbox-list-section .container {
    width: 100%;
  }

  .my-badge-list {
    --my-badge-list-gap: 4rem;
  }

  .my-avatar-item:after {
    font-size: 1.6rem;
  }
}

@media (min-width: 1440px) {
  .product-my-review {
    --number-per-row-product-review: 3;
  }

  .product-my-review:nth-child(2n+1):nth-last-child(-n+2) {
    margin-bottom: 4rem;
  }

  .product-my-review:nth-child(3n+1):nth-last-child(-n+3),
  .product-my-review:nth-child(3n+1):nth-last-child(-n+3) ~ .product-my-review {
    margin-bottom: 0;
  }

  .catalog-review-container .product-review-score {
    font-size: 2rem;
  }

  .yxp-program-headline.headline-level.level-1 {
    font-size: 7.8rem;
  }

  .yxp-program-sub-headline.headline-level.level-2 {
    font-size: 3.8rem;
  }

  .yxp-program-lootbox {
    width: calc(50% - 2rem);
    grid-template-areas: "image title" "image description" "image items";
    grid-template-rows: auto auto 1fr;
    grid-template-columns: max-content auto;
  }

  .yxp-program-lootbox-image-container {
    margin-right: 4rem;
    margin-bottom: 0;
  }

  .yxp-program-lootbox-image {
    max-width: 36rem;
  }

  .yxp-program-lootbox-title {
    padding: 0;
  }

  .yxp-program-lootbox-description {
    padding: 0;
  }

  .yxp-program-lootbox-list-section .container {
    width: 138.8rem;
  }

  .my-lootbox-item {
    width: calc(33.333333% - 2.666666666rem);
    margin: 0 2rem 4rem;
  }

  .my-lootbox-item:nth-child(2n+1):nth-last-child(-n+2),
  .my-lootbox-item:nth-child(2n+1):nth-last-child(-n+2) ~ .my-lootbox-item {
    margin-bottom: 4rem;
  }

  .my-lootbox-item:nth-child(2n+1) {
    margin-left: 2rem;
  }

  .my-lootbox-item:nth-child(2n+2) {
    margin-right: 2rem;
  }

  .my-lootbox-item:nth-child(3n+1):nth-last-child(-n+3),
  .my-lootbox-item:nth-child(3n+1):nth-last-child(-n+3) ~ .my-lootbox-item {
    margin-bottom: 0;
  }

  .my-lootbox-item:nth-child(3n+1) {
    margin-left: 0;
  }

  .my-lootbox-item:nth-child(3n+3) {
    margin-right: 0;
  }

  .my-lootbox-item:last-child {
    margin-right: auto;
  }

  .my-badge-list {
    --my-badge-list-gap: 8rem;
  }

  .my-loyalty-event {
    width: calc(33.333333% - 2.666666666rem);
  }

  .my-loyalty-event:nth-child(2n+1):nth-last-child(-n+2),
  .my-loyalty-event:nth-child(2n+1):nth-last-child(-n+2) ~ .my-loyalty-event {
    margin-bottom: 4rem;
  }

  .my-loyalty-event:nth-child(3n+1):nth-last-child(-n+3),
  .my-loyalty-event:nth-child(3n+1):nth-last-child(-n+3) ~ .my-loyalty-event {
    margin-bottom: 0;
  }

  .my-loyalty-event:nth-child(2n+1) {
    margin-left: 2rem;
  }

  .my-loyalty-event:nth-child(2n+2) {
    margin-right: 2rem;
  }

  .my-loyalty-event:nth-child(3n+1) {
    margin-left: 0;
  }

  .my-loyalty-event:nth-child(3n+3) {
    margin-right: 0;
  }

  .my-loyalty-event:last-child {
    margin-right: auto;
  }

  .my-avatar-item:after {
    font-size: 1.8rem;
  }

  .my-ach-discount-codes {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
  }

  .my-ach-discount-codes.nascent {
    flex-direction: column;
  }

  .my-ach-discount-code-head,
  .my-ach-discount-code-item {
    width: calc(50% - 2rem);
    margin: 0 2rem 0;
  }

  .my-ach-discount-code-head:first-child {
    margin-left: 0;
  }

  .my-ach-discount-code-head + .my-ach-discount-code-head {
    display: grid;
    margin-right: 0;
  }

  .my-ach-discount-codes.nascent .my-ach-discount-code-item {
    margin-left: 0;
  }

  .my-ach-discount-code-item:nth-child(2n+1):nth-last-child(-n+2),
  .my-ach-discount-code-item:nth-child(2n+1):nth-last-child(-n+2) ~ .my-ach-discount-code-item {
    margin-bottom: 0;
  }

  .my-ach-discount-code-item:nth-child(2n+1) {
    margin-left: 0;
  }

  .my-ach-discount-code-item:nth-child(2n+2) {
    margin-right: 0;
  }

  .my-ach-discount-code-item:last-child {
    margin-right: auto;
  }
}

@media (min-width: 1900px) {
  .product-my-review .product-review-product-link {
    font-size: 2.5rem;
  }

  .yxp-program-lootbox-list-section .container {
    width: 174rem;
  }

  .yxp-program-lootbox-image {
    max-width: 40rem;
  }

  .my-badge-list {
    --my-badge-list-gap: 10rem;
  }

  .my-avatar-item:after {
    font-size: 2rem;
  }
}

@media (max-width: 1439px) {
  .yxp-program-description-section .page-content {
    width: 100%;
  }

  .yxp-program-description-section .page-sidebar {
    display: none;
  }
}

@media (min-width: 1440px) {
  .content-container.static-content-container.cookie-policy-container {
      width: 85%;
  }
}

.CookieDeclarationType {
  background-color: var(--background-color-3-op-65);
  border: none !important;
  padding: 1rem 2rem 0 2rem !important;
  margin-bottom: 4rem !important;
}

.CookieDeclarationTableHeader {
  padding: 1.38rem 1rem 2rem 0 !important;
  border-bottom: none !important;
  color: var(--font-color-blue);
  font-weight: bold;
}

.CookieDeclarationTableCell {
  padding: 1.38rem 1rem 1.38rem 0 !important;
  color: var(--font-color-white);
  border-bottom: solid 0.1rem #505050 !important;
}

.CookieDeclarationTableHeader:nth-child(4),
.CookieDeclarationTableCell:nth-child(4) {
  padding-left: 2rem !important;
}

.CookieDeclarationTable tbody tr:last-child td.CookieDeclarationTableCell {
  border-bottom: none !important;
}

.welcome-coupon-banner-popup-window {
  width: initial;
  max-width: 120rem;
  min-width: 120rem;
  aspect-ratio: 1.5584415;
  padding: 0;
  border: none;
}

.popup-window.welcome-coupon-banner-popup-window .popup-icon-close {
  width: 8rem;
  height: 8rem;
  background-color: var(--background-color-3-op-65);
}

.popup-window.welcome-coupon-banner-popup-window .popup-icon-close:before {
  background-image: url('../icons/close_icon_white.svg');
  background-size: 2.4rem;
}

.welcome-coupon-banner-container {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  width: 100%;
  aspect-ratio: 1.5584415;
  background-image: url('../images/welcome-coupon-banner-background.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border: 1px solid;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border-image: var(--start-background-color);
  border-image: linear-gradient(45deg, var(--start-background-color), var(--end-background-color) 70%) 1;
}

.welcome-coupon-banner-title {
  font-size: 7.8rem;
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
  margin-top: 7.8rem;
  margin-bottom: 12.4rem;
}

.welcome-coupon-banner-description {
  color: var(--font-color-white);
  font-size: 4rem;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 6rem;
}

.welcome-coupon-banner-coupon-container {
  display: flex;
  flex-direction: row;
  align-content: center;
  justify-content: space-between;
  align-items: center;
  position: relative;
  margin-bottom: 6.4rem;
  border: 1px solid;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border-image: var(--start-background-color);
  border-image: linear-gradient(13deg, var(--start-background-color), var(--end-background-color) 70%) 1;
  background-color: var(--background-color-3-op-75);
  cursor: pointer;
}

.welcome-coupon-banner-coupon-code {
  min-width: 30rem;
  padding: 0;
  line-height: 1;
  color: var(--font-color-white);
  font-size: 3.6rem;
  font-weight: bold;
  text-transform: uppercase;
  text-align: center;
}

.welcome-coupon-banner-coupon-code-copy-btn {
  position: relative;
  width: 9.5rem;
  height: 9.5rem;
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  background-color: var(--start-background-color);
  background: linear-gradient(45deg, var(--start-background-color), var(--end-background-color) 70%);
}

.welcome-coupon-banner-coupon-code-copy-btn:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background-image: url('../icons/copy_icon_white.svg');
  background-repeat: no-repeat;
  background-size: 4.2rem;
  background-position: center;
  transform: translateX(-50%) translateY(-50%);
  transition: 0.2s all;
}

.welcome-coupon-banner-coupon-code-copy-btn:hover:before {
  background-size: 4.4rem;
}

.welcome-coupon-banner-coupon-container:hover:after,
.welcome-coupon-banner-coupon-container.copied:after {
  content: attr(data-title);
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%) translateY(calc(100% + 0.8rem));
  padding: 0.4rem 1.2rem 0.3rem;
  border-radius: 0.8rem;
  font-size: 1.2rem;
  color: var(--font-color-black);
  background-color: #eef2e6;
}

.welcome-coupon-banner-coupon-container.copied:after {
  content: attr(data-copied-title);
}

@media (min-width: 1020px) and (max-width: 1960px) {
  .welcome-coupon-banner-popup-window {
    width: initial;
    max-width: 60rem;
    min-width: 60rem;
    aspect-ratio: 1.5584415;
    padding: 0;
    border: none;
  }

  .popup-window.welcome-coupon-banner-popup-window .popup-icon-close {
    width: 4rem;
    height: 4rem;
    background-color: var(--background-color-3-op-65);
  }

  .popup-window.welcome-coupon-banner-popup-window .popup-icon-close:before {
    background-image: url('../icons/close_icon_white.svg');
    background-size: 1.2rem;
  }

  .welcome-coupon-banner-container {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    position: relative;
    width: 100%;
    aspect-ratio: 1.5584415;
    background-image: url('../images/welcome-coupon-banner-background.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border: 1px solid;
    --start-background-color: var(--gradient-first-color);
    --end-background-color: var(--gradient-second-color);
    border-image: var(--start-background-color);
    border-image: linear-gradient(45deg, var(--start-background-color), var(--end-background-color) 70%) 1;
  }

  .welcome-coupon-banner-title {
    font-size: 3.9rem;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    margin-top: 3.9rem;
    margin-bottom: 6.2rem;
  }

  .welcome-coupon-banner-description {
    color: var(--font-color-white);
    font-size: 2rem;
    text-transform: uppercase;
    text-align: center;
    margin-bottom: 3rem;
  }

  .welcome-coupon-banner-coupon-container {
    display: flex;
    flex-direction: row;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    position: relative;
    margin-bottom: 3.2rem;
    border: 1px solid;
    --start-background-color: var(--gradient-first-color);
    --end-background-color: var(--gradient-second-color);
    border-image: var(--start-background-color);
    border-image: linear-gradient(13deg, var(--start-background-color), var(--end-background-color) 70%) 1;
    background-color: var(--background-color-3-op-75);
    cursor: pointer;
  }

  .welcome-coupon-banner-coupon-code {
    min-width: 15rem;
    padding: 0;
    line-height: 1;
    color: var(--font-color-white);
    font-size: 1.8rem;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
  }

  .welcome-coupon-banner-coupon-code-copy-btn {
    position: relative;
    width: 4.75rem;
    height: 4.75rem;
    --start-background-color: var(--gradient-first-color);
    --end-background-color: var(--gradient-second-color);
    background-color: var(--start-background-color);
    background: linear-gradient(45deg, var(--start-background-color), var(--end-background-color) 70%);
  }

  .welcome-coupon-banner-coupon-code-copy-btn:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url('../icons/copy_icon_white.svg');
    background-repeat: no-repeat;
    background-size: 2.1rem;
    background-position: center;
    transform: translateX(-50%) translateY(-50%);
    transition: 0.2s all;
  }

  .welcome-coupon-banner-coupon-code-copy-btn:hover:before {
    background-size: 2.2rem;
  }

  .welcome-coupon-banner-coupon-container:hover:after,
  .welcome-coupon-banner-coupon-container.copied:after {
    content: attr(data-title);
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%) translateY(calc(100% + 0.8rem));
    padding: 0.2rem 0.8rem 0.15rem;
    border-radius: 0.4rem;
    font-size: 1.1rem;
    color: var(--font-color-black);
    background-color: #eef2e6;
  }

  .welcome-coupon-banner-coupon-container.copied:after {
    content: attr(data-copied-title);
  }
}

@media (max-width: 1279px) {
  .popup-window.welcome-coupon-banner-popup-window .popup-icon-close {
    width: 4rem;
    height: 4rem;
    background-color: var(--background-color-3-op-65);
  }

  .popup-window.welcome-coupon-banner-popup-window .popup-icon-close:before {
    background-image: url('../icons/close_icon_white.svg');
    background-size: 1.6rem;
  }

  .welcome-coupon-banner-popup-window {
    width: calc(100% - 4rem);
    min-width: fit-content;
    aspect-ratio: auto;
  }

  .welcome-coupon-banner-container {
    aspect-ratio: auto;
  }
}

@media (max-width: 579px) {
  .welcome-coupon-banner-title {
    font-size: 4.8rem;
    margin-bottom: 7.8rem;
  }

  .welcome-coupon-banner-description {
    font-size: 2.4rem;
  }

  .welcome-coupon-banner-coupon-code {
    line-height: 8rem;
    font-size: 2.4rem;
  }

  .welcome-coupon-banner-coupon-code-copy-btn {
    display: none;
  }
}

.payment-waiting {
  background-image: url('../images/payment_confirmation_background.jpg');
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: cover;  
}

.payment-waiting .content-header {
  flex-direction: column;
  align-content: center;
  align-items: center;
}

.payment-waiting .headline-level.level-1 {
  font-weight: bolder;
  margin: 0;
  line-height: 1;
}

.payment-waiting .headline-subtitle.level-1 {
  font-size: 2.4rem;
  text-transform: uppercase;
  color: white;
  margin-bottom: .4rem;
}

.payment-waiting .headline-subtitle.level-2 {
  color: var(--font-color-blue);
}

@media (min-width: 768px) {
  .payment-waiting {
    background-position: 50% 0; 
  }

  .payment-waiting .headline-subtitle.level-1 {
    font-size: 3.6rem;
  }  
}

@media (min-width: 1300px) {
  .payment-waiting {
    background-size: 100%;
    aspect-ratio: 2.7198549; 
  }
}

@media (min-width: 1300px) {
  .payment-waiting {
    background-size: 100%;
    aspect-ratio: 2.7198549; 
  }
}

.product-valid-countries-container {
  visibility: visible;
  display: block;
}

@media (min-width: 1200px) {
  .product-valid-countries-container {
    visibility: hidden;
    display: none;
  }
}

.product-valid-countries-container[data-state="visible"] {
  --start-background-color: var(--gradient-first-color);
  --end-background-color: var(--gradient-second-color);
  border: 1px solid;
  border-image-slice: 1;
  border-width: 0.1rem;
  border-image-source: linear-gradient(to right, var(--start-background-color), var(--end-background-color));
}

.product-valid-countries-btn {
  width: 100%;
}

.product-valid-countries-container[data-state="visible"] .product-valid-countries-btn,
.product-valid-countries-container[data-state="visible"] .product-valid-countries-btn:hover,
.product-valid-countries-container[data-state="visible"] .product-valid-countries-btn:focus {
  border: 0.1rem solid var(--background-color-2) !important;
  background-image: none !important;
  position: relative;
}

.product-valid-countries {
  display: none;
  scrollbar-width: thin;
  scrollbar-color: linear-gradient(to bottom, var(--gradient-middle-color), var(--gradient-first-color)) #787878;  
}

.product-valid-countries::-webkit-scrollbar {
  width: 6px;
}

.product-valid-countries::-webkit-scrollbar-thumb {
  background: linear-gradient(to bottom, var(--gradient-middle-color), var(--gradient-first-color));
  border-radius: 3px;
}

.product-valid-countries::-webkit-scrollbar-track {
  background-color: #787878;
}

.product-valid-countries::-webkit-scrollbar-button {
  display: none;
}

.product-valid-countries-container[data-state="visible"] .product-valid-countries {
  display: block;
  height: 20rem;
  overflow-y: scroll;
  overflow-x: hidden;
  padding: 0 1rem;
  margin: 1rem 0.8rem;
  font-size: 1.8rem;
  position: relative;
}

.product-valid-countries-container[data-state="visible"] .product-valid-countries-btn::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0.4rem;
  background-image: url('../icons/close_icon_white.svg');
  background-repeat: no-repeat;
  background-position: center;
  width: 1.2rem;
  height: 100%;
  background-color: transparent;
}

.catalog-top-filters {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 2.4rem;
  margin-top: -4rem;
}

.catalog-top-filter-headline {
  color: var(--font-color-light);
  padding-right: 0.6rem;
}

.catalog-top-filter-content {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  flex-direction: row;
}

.catalog-top-filter-content .form-group {
  margin: 0 0.4rem;
  padding: 0;
}

.catalog-top-filter-icon {
  display: block;
  height: 4rem;
}

.catalog-top-filter-icon.checked {
  display: none;
}

input[type='checkbox']:checked + label > .catalog-top-filter-icon {
  display: none;
}

input[type='checkbox']:checked + label > .catalog-top-filter-icon.checked {
  display: block;
}

.catalog-top-filter-icon.os-pc {
  width: 7.5rem;
}

.catalog-top-filter-icon.os-xbox {
  width: 9.33rem;
}

.catalog-top-filter-icon.os-psn {
  width: 8.34rem;
}