*,
::after,
::before {
box-sizing: border-box;
}
ul,
ol {
padding: 0;
list-style-position: inside;
}
ul[class],
ol[class] {
list-style: none;
}
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
li,
figure,
figcaption,
blockquote,
dl,
dd {
margin: 0;
}
input:focus-visible {
outline: none;
}
html {
height: 100%;
scroll-behavior: smooth;
font-size: calc(16 * var(--width-multiplier));
font-weight: 400;
line-height: 120%;
font-family: "Commissioner", sans-serif;
color: #fff;
}
body {
position: relative;
min-height: 100vh;
scroll-behavior: smooth;
text-rendering: optimizeSpeed;
line-height: 120%;
background: var(--color-dark);
color: var(--color-white);
}
body.menu-active {
overflow: hidden;
}
a:not([class]) {
text-decoration-skip-ink: auto;
}
a:not([class]) {
-webkit-text-decoration-skip: ink;
text-decoration-skip-ink: auto;
}
p,
h1,
h2,
h3,
h4,
h5,
h6 {
font: inherit;
}
a {
text-decoration: none;
color: inherit;
}
img {
max-width: 100%;
display: block;
}
article > * + * {
margin-top: 1em;
}
button,
input,
select,
textarea {
font: inherit;
}
input,
select {
width: 100%;
padding: 0;
border: 0;
background-color: transparent;
font: inherit;
}
input::-moz-placeholder,
select::-moz-placeholder {
color: rgba(33, 32, 43, 0.4);
}
input::placeholder,
select::placeholder {
color: rgba(33, 32, 43, 0.4);
}
input:focus,
select:focus {
outline: none;
}
a {
outline: none;
}
::-webkit-scrollbar {
width: 0;
height: 0;
}
::-webkit-scrollbar-track {
background: var(--color-primary);
}
::-webkit-scrollbar-thumb {
background: linear-gradient(
112.92deg,
rgba(255, 255, 255, 0.36) 10.45%,
rgba(255, 255, 255, 0.09) 88.73%
);
}
* {
-ms-overflow-style: none;
scrollbar-width: none;
}
@media (prefers-reduced-motion: reduce) {
* {
animation-duration: 0s !important;
animation-iteration-count: 1 !important;
transition-duration: 0s !important;
scroll-behavior: auto !important;
}
}:root {
--color-primary: #fdb714;
--color-dark: #121212;
--color-white: #ffffff;
--color-gray: #d9d9d9;
--color-light-gray: #f5f5f5;
--clr-dark-gray: #515151;
--color-primary-light: #eef9ff;
--color-dark-muted: rgba(0, 0, 0, 0.5);
--color-light-yellow: #f5eee5;
--color-dark-red: #490e00;
--color-red: #e52823;
--width-base: 1440;
--width-current: 100vw;
--width-multiplier: calc(var(--width-current) / var(--width-base));
}
@media (max-width: 768px) {
:root {
--width-base: 375;
--width-current: 100vmin;
}
}
.title {
color: #ffffff;
font-size: calc(64 * var(--width-multiplier));
font-weight: 900;
line-height: 1.2;
letter-spacing: -2%;
}
@media (max-width: 768px) {
.title {
font-size: calc(32 * var(--width-multiplier));
}
}
span.yellow {
color: #fdb714;
}
span.red {
color: #e52823;
}
.title48 {
color: #ffffff;
font-size: calc(48 * var(--width-multiplier));
font-weight: 900;
line-height: 1.2;
}
@media (max-width: 768px) {
.title48 {
font-size: calc(24 * var(--width-multiplier));
}
}
.title30 {
color: #ffffff;
font-size: calc(30 * var(--width-multiplier));
font-weight: 700;
line-height: 1.2;
}
@media (max-width: 768px) {
.title30 {
font-size: calc(20 * var(--width-multiplier));
}
}
.desc {
color: #ffffff;
font-size: calc(20 * var(--width-multiplier));
font-weight: 300;
line-height: 1.2;
}
@media (max-width: 768px) {
.desc {
font-size: calc(16 * var(--width-multiplier));
}
}
.button {
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
padding: calc(16 * var(--width-multiplier)) calc(32 * var(--width-multiplier));
border-radius: calc(36 * var(--width-multiplier));
background: #fdb714;
color: #ffffff;
font-size: calc(20 * var(--width-multiplier));
font-weight: 600;
line-height: 1;
width: -moz-fit-content;
width: fit-content;
min-width: calc(276 * var(--width-multiplier));
border: calc(1 * var(--width-multiplier)) solid #fdb714;
transition: all 0.3s ease;
}
@media (max-width: 768px) {
.button {
min-width: -moz-fit-content;
min-width: fit-content;
font-size: calc(16 * var(--width-multiplier));
padding: calc(9 * var(--width-multiplier))
calc(30 * var(--width-multiplier));
}
}
@media (hover: hover) and (pointer: fine) {
.button:hover {
background: #ffffff;
color: #fdb714;
}
.button:active {
transform: scale(0.96);
}
}
@media (hover: none) {
.button:active {
transform: scale(0.96);
}
}
.button_outline {
background: #eef9ff;
color: #fdb714;
}
@media (hover: hover) and (pointer: fine) {
.button_outline:hover {
background: #fdb714;
color: #ffffff;
}
.button_outline:active {
transform: scale(0.96);
}
}
.button_dark {
background: #121212;
color: #ffffff;
border-color: #121212;
}
@media (hover: hover) and (pointer: fine) {
.button_dark:hover {
background: #121212;
color: #ffffff;
}
.button_dark:active {
transform: scale(0.96);
}
}
.swiper-btn-arrow {
cursor: pointer;
width: calc(60 * var(--width-multiplier));
height: calc(60 * var(--width-multiplier));
border-radius: 50%;
border: calc(1 * var(--width-multiplier)) solid #ffffff;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
display: flex;
justify-content: center;
align-items: center;
transition: all 0.3s ease;
}
.swiper-btn-arrow_dark {
background: #121212;
}
.swiper-btn-arrow_dark.swiper-button-disabled {
background: rgba(43, 44, 44, 0.5);
}
.swiper-btn-arrow_blue {
background: #fdb714;
border-color: #fdb714;
}
.swiper-btn-arrow_blue path {
fill: #ffffff !important;
}
.swiper-btn-arrow_blue.swiper-button-disabled {
background: #ffffff;
border-color: #ffffff;
}
.swiper-btn-arrow_blue.swiper-button-disabled path {
fill: #121212 !important;
}
.swiper-btn-arrow_white {
background: #ffffff;
border: none;
}
.swiper-btn-arrow_white.swiper-button-disabled {
background: rgba(255, 255, 255, 0.5);
}
.swiper-btn-arrow_white.swiper-button-disabled path {
fill: #ffffff;
}
@media (max-width: 768px) {
.swiper-btn-arrow {
width: calc(25 * var(--width-multiplier));
height: calc(25 * var(--width-multiplier));
}
}
@media (max-width: 768px) {
.swiper-btn-arrow svg {
width: calc(15 * var(--width-multiplier));
height: calc(15 * var(--width-multiplier));
}
}
.swiper-btn-arrow path {
transition: all 0.3s ease;
}
@media (hover: hover) and (pointer: fine) {
.swiper-btn-arrow:hover {
border-color: #fdb714;
box-shadow: 0px 0px 20px 0px rgba(28, 158, 202, 0.7);
}
.swiper-btn-arrow:hover path {
fill: #fdb714;
}
.swiper-btn-arrow:active {
scale: 0.9;
}
}
@media (hover: none) {
.swiper-btn-arrow:active {
scale: 0.96;
}
}
.container {
width: 100%;
max-width: calc(1352 * var(--width-multiplier));
padding-inline: calc(16 * var(--width-multiplier));
margin-inline: auto;
}
@media (max-width: 768px) {
.container {
padding-inline: calc(10 * var(--width-multiplier));
}
}
section {
padding: calc(75 * var(--width-multiplier)) 0;
}
@media (max-width: 768px) {
section {
padding: calc(30 * var(--width-multiplier)) 0;
}
}
section.first-section {
padding-top: calc(150 * var(--width-multiplier));
}
@media (max-width: 768px) {
section.first-section {
padding-top: calc(60 * var(--width-multiplier));
}
}
section.last-section {
padding-bottom: calc(150 * var(--width-multiplier));
}
@media (max-width: 768px) {
section.last-section {
padding-bottom: calc(60 * var(--width-multiplier));
}
}
.header {
position: fixed;
top: 0;
left: 50%;
transform: translateX(-50%);
width: 100%;
z-index: 1001;
transition: all 0.8s ease;
}
.header__box {
position: relative;
display: flex;
justify-content: center;
align-items: center;
padding: calc(60 * var(--width-multiplier)) 0;
z-index: 1001;
transition: all 0.3s ease;
}
@media (max-width: 768px) {
.header__box {
padding: calc(14 * var(--width-multiplier)) 0
calc(4 * var(--width-multiplier));
}
}
.header__logo {
display: flex;
align-items: center;
gap: calc(20 * var(--width-multiplier));
}
.header.scrolled .header__box {
padding: calc(20 * var(--width-multiplier)) 0;
}
.header.scroll-down {
top: calc(-150 * var(--width-multiplier));
}
@keyframes float1 {
0%,
100% {
transform: translateY(0);
}
50% {
transform: translateY(-10px);
}
}
@keyframes float2 {
0%,
100% {
transform: scale(1) translateY(0);
}
50% {
transform: scale(1) translateY(-15px);
}
}
@keyframes float3 {
0%,
100% {
transform: translateY(0);
}
50% {
transform: translateY(-20px);
}
}
@keyframes float4 {
0%,
100% {
transform: scale(1) translateY(0);
}
50% {
transform: scale(1) translateY(-25px);
}
}
.float1 {
animation: float1 3s ease-in-out infinite;
}
.float2 {
animation: float2 4s ease-in-out infinite;
animation-delay: 0.5s;
}
.float3 {
animation: float3 5s ease-in-out infinite;
animation-delay: 1s;
}
.float4 {
animation: float4 6s ease-in-out infinite;
animation-delay: 1.5s;
}
.spin360 {
animation: spin 15s linear infinite;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
.link {
position: relative;
width: -moz-fit-content;
width: fit-content;
transition: color 0.3s ease;
font-size: calc(22 * var(--width-multiplier));
line-height: 1.2;
font-weight: 700;
text-decoration: underline;
}
@media (max-width: 768px) {
.link {
font-size: calc(18 * var(--width-multiplier));
}
}
.link::before {
content: "";
position: absolute;
height: calc(1 * var(--width-multiplier));
width: 0;
left: 50%;
transform: translateX(-50%);
bottom: 0;
background: #fdb714;
transition: width 0.3s ease;
}
@media (hover: hover) and (pointer: fine) {
.link:hover {
color: #fdb714;
}
.link:active::before {
width: 100%;
}
}
@media (hover: none) {
.link:active {
color: #fdb714;
}
.link:active::before {
width: 100%;
}
}
.link_icon {
cursor: pointer;
display: flex;
}
.link_icon svg {
transition: all 0.3s ease;
}
@media (hover: hover) and (pointer: fine) {
.link_icon:hover svg {
scale: 1.2;
}
.link_icon:active svg {
scale: 1;
}
}
@media (hover: none) {
.link_icon:active svg {
scale: 0.96;
}
}
.modal {
position: fixed;
top: 0;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
align-items: center;
justify-content: center;
z-index: 1100;
background: rgba(0, 0, 0, 0.3);
display: none;
overflow-y: auto;
overflow-x: hidden;
cursor: url("data:image/svg+xml,%3Csvg width='19' height='19' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.514.535l-6.42 6.42L2.677.536a1.517 1.517 0 00-2.14 0 1.517 1.517 0 000 2.14l6.42 6.419-6.42 6.419a1.517 1.517 0 000 2.14 1.517 1.517 0 002.14 0l6.419-6.42 6.419 6.42a1.517 1.517 0 002.14 0 1.517 1.517 0 000-2.14l-6.42-6.42 6.42-6.418a1.517 1.517 0 000-2.14 1.516 1.516 0 00-2.14 0z' fill='%23FFF' fill-rule='nonzero'/%3E%3C/svg%3E"),
auto;
visibility: hidden;
}
@media (max-width: 768px) {
.modal {
padding: 16px;
}
}
.modal.is_active {
display: flex;
visibility: visible;
}
.modal.is_active .modal-inner {
animation: scaleModal 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}
.modal.is_active .modal-inner__bg {
animation: scaleModal 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards,
float2 3s ease-in-out 0.8s infinite;
animation-delay: 0.3s;
}
.modal.is_active .modal-inner__bg_bottom {
animation: scaleModal 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards,
float1 3s ease-in-out 0.8s infinite;
}
.modal__close {
position: absolute;
right: calc(40 * var(--width-multiplier));
top: calc(40 * var(--width-multiplier));
cursor: pointer;
width: calc(34 * var(--width-multiplier));
height: calc(34 * var(--width-multiplier));
display: flex;
align-items: center;
justify-content: center;
z-index: 10;
transition: scale 0.3s ease;
}
@media (max-width: 768px) {
.modal__close {
right: calc(4 * var(--width-multiplier));
top: calc(4 * var(--width-multiplier));
}
}
@media (max-width: 768px) {
.modal__close svg {
width: calc(12 * var(--width-multiplier));
height: calc(12 * var(--width-multiplier));
}
}
.modal__close:hover {
scale: 1.1;
}
.modal__close:active {
scale: 0.9;
}
.modal__title {
font-size: calc(38 * var(--width-multiplier));
font-weight: 700;
line-height: 100%;
text-align: center;
}
.modal-inner {
position: relative;
display: flex;
background: #fff;
border-radius: calc(8 * var(--width-multiplier));
max-width: calc(480 * var(--width-multiplier));
width: 100%;
margin: auto;
cursor: auto;
overflow: hidden;
will-change: scale, opacity, transform;
}
@media (max-width: 768px) {
.modal-inner {
border: calc(16 * var(--width-multiplier));
}
}
.modal-inner__box {
width: 100%;
padding: calc(42 * var(--width-multiplier));
display: flex;
flex-direction: column;
gap: calc(25 * var(--width-multiplier));
}
@media (max-width: 768px) {
.modal-inner__box {
padding: calc(20 * var(--width-multiplier));
gap: calc(20 * var(--width-multiplier));
}
}
.modal-form {
display: flex;
flex-direction: column;
gap: calc(8 * var(--width-multiplier));
}
@media (max-width: 768px) {
.modal-form {
gap: calc(10 * var(--width-multiplier));
}
}
.modal-form__submit {
margin-top: calc(26 * var(--width-multiplier));
min-width: 100%;
margin-top: calc(12 * var(--width-multiplier));
}
.modal-input {
padding: calc(15 * var(--width-multiplier)) 0;
color: #121212;
font-size: calc(16 * var(--width-multiplier));
font-weight: 400;
line-height: 1;
border-bottom: calc(1 * var(--width-multiplier)) solid rgba(0, 0, 0, 0.1);
}
.whylike-modal .modal-inner {
max-width: calc(1200 * var(--width-multiplier));
background: #f5eee5;
border-radius: calc(20 * var(--width-multiplier));
}
@media (max-width: 768px) {
.whylike-modal .modal-inner {
border-radius: calc(12 * var(--width-multiplier));
}
}
.whylike-modal .modal-inner__box {
padding: calc(70 * var(--width-multiplier));
}
@media (max-width: 768px) {
.whylike-modal .modal-inner__box {
padding: calc(20 * var(--width-multiplier));
}
}
.whylike-modal .modal__body {
max-width: calc(1040 * var(--width-multiplier));
margin-inline: auto;
display: flex;
flex-direction: column;
gap: calc(40 * var(--width-multiplier));
}
@media (max-width: 768px) {
.whylike-modal .modal__body {
gap: calc(20 * var(--width-multiplier));
}
}
.whylike-modal__title {
text-align: center;
line-height: 1;
}
.whylike-modal__desc {
color: #121212;
font-weight: 400;
font-size: 24px;
line-height: 1.2;
}
@media (max-width: 768px) {
.whylike-modal__desc {
font-size: calc(16 * var(--width-multiplier));
}
}
@keyframes scaleModal {
0% {
opacity: 0;
transform: scale(0.9);
}
100% {
opacity: 1;
transform: scale(1);
}
}
.tabs {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
gap: calc(20 * var(--width-multiplier));
border: none;
}
@media (max-width: 768px) {
.tabs {
gap: calc(8 * var(--width-multiplier));
}
}
.tabs a[role="tab"] {
border-radius: calc(50 * var(--width-multiplier));
border: calc(1 * var(--width-multiplier)) solid #ffffff;
color: #ffffff;
font-size: calc(20 * var(--width-multiplier));
font-weight: 400;
line-height: 1;
padding: calc(14 * var(--width-multiplier)) calc(50 * var(--width-multiplier));
transition: all 0.3s ease;
}
@media (max-width: 768px) {
.tabs a[role="tab"] {
font-size: calc(14 * var(--width-multiplier));
padding: calc(9 * var(--width-multiplier))
calc(12 * var(--width-multiplier));
}
}
.tabs a[role="tab"][aria-selected="true"] {
background: #fdb714;
color: #ffffff;
border: calc(1 * var(--width-multiplier)) solid #fdb714;
}
.hero {
position: relative;
z-index: 0;
min-height: 100vh;
}
.hero__bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
z-index: -2;
}
.hero__box {
display: flex;
flex-direction: column;
gap: calc(20 * var(--width-multiplier));
min-height: calc(100vh - calc(225 * var(--width-multiplier)));
}
.hero__links {
display: flex;
flex-wrap: wrap;
gap: calc(15 * var(--width-multiplier));
align-items: end;
flex-direction: column;
}
.hero__btn {
margin-top: auto;
}
.progsec__heading {
display: flex;
justify-content: space-between;
align-items: center;
align-items: end;
margin-bottom: calc(40 * var(--width-multiplier));
}
@media (max-width: 768px) {
.progsec__heading {
margin-bottom: calc(20 * var(--width-multiplier));
gap: calc(10 * var(--width-multiplier));
}
}
.progsec__title {
max-width: calc(730 * var(--width-multiplier));
}
@media (max-width: 768px) {
.progsec__title {
max-width: 100%;
}
}
.progsec__icon {
display: flex;
}
.progsec__icon svg {
width: 100%;
height: 100%;
}
@media (max-width: 768px) {
.progsec__icon {
width: calc(60 * var(--width-multiplier));
height: calc(60 * var(--width-multiplier));
}
}
.progsecbar {
display: flex;
justify-content: center;
align-items: center;
background: #fdb714;
padding: calc(20 * var(--width-multiplier)) calc(25 * var(--width-multiplier));
border-radius: calc(100 * var(--width-multiplier));
}
@media (max-width: 768px) {
.progsecbar {
padding: calc(10 * var(--width-multiplier))
calc(15 * var(--width-multiplier));
border-radius: calc(60 * var(--width-multiplier));
}
}
.progsecbar__box {
height: calc(70 * var(--width-multiplier));
width: 100%;
border-radius: calc(100 * var(--width-multiplier));
border: calc(2 * var(--width-multiplier)) solid #e52823;
overflow: hidden;
}
@media (max-width: 768px) {
.progsecbar__box {
border-radius: calc(60 * var(--width-multiplier));
height: calc(50 * var(--width-multiplier));
}
}
.progsecbar__line {
display: flex;
height: 100%;
background: #e52823;
transition: all 0.3s ease;
}
.whado__title {
text-align: center;
margin-bottom: calc(40 * var(--width-multiplier));
}
@media (max-width: 768px) {
.whado__title {
margin-bottom: calc(20 * var(--width-multiplier));
}
}
.whado__subtitle {
text-align: center;
}
.whado__box {
display: flex;
flex-direction: column;
gap: calc(100 * var(--width-multiplier));
align-items: center;
justify-content: center;
position: relative;
padding-bottom: calc(160 * var(--width-multiplier));
margin-bottom: calc(20 * var(--width-multiplier));
}
@media (max-width: 768px) {
.whado__box {
gap: calc(20 * var(--width-multiplier));
padding-bottom: 0;
}
}
.whado__box::before {
content: "";
height: 100%;
width: calc(1 * var(--width-multiplier));
background: #fdb714;
display: flex;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
@media (max-width: 768px) {
.whado__box::before {
display: none;
}
}
.whado__box::after {
content: "";
width: calc(33 * var(--width-multiplier));
height: 100%;
background-repeat: no-repeat;
background-size: contain;
background-image: url("data:image/svg+xml,%3Csvg width='33' height='162' viewBox='0 0 33 162' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.7455 0C17.0216 1.04686e-07 17.2455 0.223858 17.2455 0.5V160.28L32.1439 145.149C32.3376 144.953 32.6542 144.95 32.851 145.144C33.0477 145.337 33.0496 145.654 32.8558 145.851L17.1019 161.851C17.0089 161.945 16.882 161.999 16.7494 162C16.6169 162.001 16.4893 161.949 16.3949 161.856L0.148804 145.856C-0.0478031 145.663 -0.050527 145.346 0.142944 145.149C0.336617 144.953 0.653207 144.95 0.849976 145.144L16.2455 160.305V0.5C16.2455 0.224037 16.4696 0.000290846 16.7455 0Z' fill='%23FDB714'/%3E%3C/svg%3E%0A");
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
background-position: bottom;
z-index: -1;
}
@media (max-width: 768px) {
.whado__box::after {
display: none;
}
}
.whado-item {
position: relative;
}
@media (max-width: 768px) {
.whado-item {
display: flex;
flex-direction: column-reverse;
align-items: center;
gap: calc(5 * var(--width-multiplier));
}
}
.whado-item::before {
content: "";
width: calc(117 * var(--width-multiplier));
height: calc(1 * var(--width-multiplier));
background: #fdb714;
display: flex;
position: absolute;
right: 100%;
top: 50%;
transform: translateY(-50%);
}
@media (max-width: 768px) {
.whado-item::before {
display: none;
}
}
.whado-item__content {
position: absolute;
right: calc(100 * var(--width-multiplier));
top: 0;
display: flex;
flex-direction: column;
display: flex;
justify-content: center;
align-items: center;
gap: calc(12 * var(--width-multiplier));
text-align: center;
width: calc(308 * var(--width-multiplier));
}
@media (max-width: 768px) {
.whado-item__content {
position: relative;
right: unset;
top: unset;
gap: calc(6 * var(--width-multiplier));
width: 100%;
}
}
.whado-item__title {
font-weight: 700;
font-size: calc(30 * var(--width-multiplier));
line-height: 1.2;
color: #fdb714;
}
@media (max-width: 768px) {
.whado-item__title {
font-size: calc(20 * var(--width-multiplier));
}
}
.whado-item__desc {
font-weight: 300;
font-size: calc(20 * var(--width-multiplier));
line-height: 1.2;
color: #ffffff;
}
@media (max-width: 768px) {
.whado-item__desc {
font-size: calc(16 * var(--width-multiplier));
}
}
.whado-item__desc span {
color: #fdb714;
font-weight: 700;
}
.whado-item__circle {
width: calc(56 * var(--width-multiplier));
height: calc(56 * var(--width-multiplier));
border-radius: 50%;
border: calc(1 * var(--width-multiplier)) solid #fdb714;
background: #121212;
display: flex;
justify-content: center;
align-items: center;
}
@media (max-width: 768px) {
.whado-item__circle {
width: calc(20 * var(--width-multiplier));
height: calc(20 * var(--width-multiplier));
}
}
.whado-item__circle-inner {
width: calc(21 * var(--width-multiplier));
height: calc(21 * var(--width-multiplier));
border-radius: 50%;
background: #fdb714;
display: flex;
}
@media (max-width: 768px) {
.whado-item__circle-inner {
width: calc(10 * var(--width-multiplier));
height: calc(10 * var(--width-multiplier));
}
}
.whado-item:nth-of-type(even)::before {
right: unset;
left: 100%;
}
.whado-item:nth-of-type(even) .whado-item__content {
right: unset;
left: calc(100 * var(--width-multiplier));
}
@media (max-width: 768px) {
.whado-item:nth-of-type(even) .whado-item__content {
left: unset;
}
}
.whylike__title {
text-align: center;
margin-bottom: calc(40 * var(--width-multiplier));
}
.whylike__box {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: calc(20 * var(--width-multiplier));
}
@media (max-width: 768px) {
.whylike__box {
grid-template-columns: repeat(2, 1fr);
gap: calc(8 * var(--width-multiplier));
}
}
.whylike-card {
display: flex;
flex-direction: column;
align-items: center;
gap: calc(20 * var(--width-multiplier));
cursor: pointer;
text-align: center;
}
@media (max-width: 768px) {
.whylike-card {
gap: calc(8 * var(--width-multiplier));
}
}
.whylike-card__img {
height: calc(318 * var(--width-multiplier));
width: 100%;
border-radius: calc(20 * var(--width-multiplier));
background: #f5eee5;
display: flex;
justify-content: center;
align-items: center;
padding: calc(60 * var(--width-multiplier));
transition: all 0.3s ease;
}
@media (max-width: 768px) {
.whylike-card__img {
height: calc(160 * var(--width-multiplier));
border-radius: calc(16 * var(--width-multiplier));
padding: calc(40 * var(--width-multiplier));
}
}
.whylike-card__img img {
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
}
@media (hover: hover) and (pointer: fine) {
.whylike-card:hover .whylike-card__img {
background: #121212;
}
.whylike-card:active .whylike-card__img {
scale: 0.96;
}
}
@media (hover: none) {
.whylike-card:active .whylike-card__img {
scale: 0.96;
background: #fdb714;
}
}
.rules__title {
max-width: calc(1200 * var(--width-multiplier));
margin-bottom: calc(30 * var(--width-multiplier));
}
@media (max-width: 768px) {
.rules__title {
margin-bottom: calc(10 * var(--width-multiplier));
}
}
.rules__subtitle {
margin-bottom: calc(40 * var(--width-multiplier));
}
@media (max-width: 768px) {
.rules__subtitle {
margin-bottom: calc(20 * var(--width-multiplier));
}
}
.rules__box {
display: grid;
grid-template-columns: calc(900 * var(--width-multiplier)) 1fr;
gap: calc(20 * var(--width-multiplier));
align-items: center;
}
@media (max-width: 768px) {
.rules__box {
display: flex;
flex-direction: column-reverse;
gap: calc(5 * var(--width-multiplier));
}
}
.rules__left {
background: #ffffff;
padding: calc(40 * var(--width-multiplier));
border-radius: calc(20 * var(--width-multiplier));
border: calc(1 * var(--width-multiplier)) solid #fdb714;
color: #121212;
}
@media (max-width: 768px) {
.rules__left {
padding: calc(15 * var(--width-multiplier));
border-radius: calc(12 * var(--width-multiplier));
}
}
.rules__left span {
font-weight: 700;
}
.rules__img {
height: 100%;
width: 100%;
}
.rules__img img {
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
}
.rules__title-btm {
margin-top: calc(80 * var(--width-multiplier));
}
@media (max-width: 768px) {
.rules__title-btm {
margin-top: calc(20 * var(--width-multiplier));
}
}
.easyway__title {
margin-bottom: calc(40 * var(--width-multiplier));
}
@media (max-width: 768px) {
.easyway__title {
margin-bottom: calc(20 * var(--width-multiplier));
}
}
.easyway__box {
display: grid;
grid-template-columns: calc(710 * var(--width-multiplier)) 1fr;
gap: calc(20 * var(--width-multiplier));
}
@media (max-width: 768px) {
.easyway__box {
grid-template-columns: 100%;
gap: calc(12 * var(--width-multiplier));
}
}
.easyway__left {
height: 100%;
width: 100%;
border-radius: calc(20 * var(--width-multiplier));
border: calc(1 * var(--width-multiplier)) solid #fdb714;
overflow: hidden;
}
@media (max-width: 768px) {
.easyway__left {
border-radius: calc(12 * var(--width-multiplier));
}
}
.easyway__left img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.easyway__right {
display: flex;
flex-direction: column;
gap: calc(20 * var(--width-multiplier));
}
@media (max-width: 768px) {
.easyway__right {
gap: calc(8 * var(--width-multiplier));
}
}
.easyway__desc {
padding-bottom: calc(20 * var(--width-multiplier));
border-bottom: calc(1 * var(--width-multiplier)) solid #fdb714;
}
@media (max-width: 768px) {
.easyway__desc {
padding-bottom: calc(12 * var(--width-multiplier));
}
}
.easyway__links {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: calc(8 * var(--width-multiplier));
justify-content: space-between;
}
.howbonus__title {
margin-bottom: calc(40 * var(--width-multiplier));
}
@media (max-width: 768px) {
.howbonus__title {
margin-bottom: calc(20 * var(--width-multiplier));
}
}
.howbonus__box {
display: flex;
flex-direction: column;
gap: calc(15 * var(--width-multiplier));
margin-bottom: calc(40 * var(--width-multiplier));
}
@media (max-width: 768px) {
.howbonus__box {
margin-bottom: calc(20 * var(--width-multiplier));
gap: calc(12 * var(--width-multiplier));
}
}
.howbonus__btm {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
@media (max-width: 768px) {
.howbonus__btm {
gap: calc(8 * var(--width-multiplier));
}
}
.howbonus-item {
position: relative;
padding: calc(22 * var(--width-multiplier)) calc(25 * var(--width-multiplier));
border-radius: calc(20 * var(--width-multiplier));
background: #1b4932;
display: flex;
align-items: center;
justify-content: space-between;
min-height: calc(115 * var(--width-multiplier));
overflow: hidden;
}
@media (max-width: 768px) {
.howbonus-item {
min-height: calc(90 * var(--width-multiplier));
padding: calc(18 * var(--width-multiplier))
calc(20 * var(--width-multiplier));
border-radius: calc(16 * var(--width-multiplier));
padding-bottom: calc(70 * var(--width-multiplier));
}
}
.howbonus-item__title {
font-weight: 700;
font-size: calc(30 * var(--width-multiplier));
line-height: 1.2;
color: #ffffff;
max-width: calc(975 * var(--width-multiplier));
}
@media (max-width: 768px) {
.howbonus-item__title {
font-size: calc(22 * var(--width-multiplier));
}
}
.howbonus-item__num {
color: #fdb714;
font-weight: 900;
font-size: calc(96 * var(--width-multiplier));
line-height: 1;
position: absolute;
right: calc(30 * var(--width-multiplier));
top: 55%;
transform: translateY(-50%);
}
@media (max-width: 768px) {
.howbonus-item__num {
top: unset;
right: calc(10 * var(--width-multiplier));
bottom: calc(-30 * var(--width-multiplier));
transform: none;
}
}
.howbonus-item__num::before {
content: "";
position: absolute;
width: 100%;
height: calc(28 * var(--width-multiplier));
background: #1b4932;
bottom: 0;
left: 0;
}
@media (max-width: 768px) {
.howbonus-item__num::before {
display: none;
}
}
.locations__title {
margin-bottom: calc(20 * var(--width-multiplier));
}
@media (max-width: 768px) {
.locations__title {
margin-bottom: calc(10 * var(--width-multiplier));
}
}
.locations__box {
padding: calc(40 * var(--width-multiplier));
border-radius: calc(20 * var(--width-multiplier));
background: #1b4932;
}
@media (max-width: 768px) {
.locations__box {
padding: calc(20 * var(--width-multiplier));
border-radius: calc(16 * var(--width-multiplier));
}
}
.locations__tabs {
margin-bottom: calc(40 * var(--width-multiplier));
}
.locations__tabs li {
display: flex;
}
@media (max-width: 768px) {
.locations__tabs {
margin-bottom: calc(16 * var(--width-multiplier));
}
}
.locations__map {
border-radius: calc(20 * var(--width-multiplier));
overflow: hidden;
height: calc(540 * var(--width-multiplier));
margin-bottom: calc(20 * var(--width-multiplier));
}
@media (max-width: 768px) {
.locations__map {
height: calc(350 * var(--width-multiplier));
margin-bottom: calc(10 * var(--width-multiplier));
}
}
.locations__map iframe {
width: 100%;
height: 100%;
}
.locations__cards {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: calc(20 * var(--width-multiplier));
max-width: calc(1200 * var(--width-multiplier));
margin-inline: auto;
}
@media (max-width: 768px) {
.locations__cards {
grid-template-columns: repeat(2, 1fr);
gap: calc(8 * var(--width-multiplier));
}
}
.locations-card {
padding: calc(20 * var(--width-multiplier));
border-radius: calc(20 * var(--width-multiplier));
border: calc(1 * var(--width-multiplier)) solid #fdb714;
display: flex;
flex-direction: column;
gap: calc(20 * var(--width-multiplier));
}
@media (max-width: 768px) {
.locations-card {
gap: calc(8 * var(--width-multiplier));
border-radius: calc(12 * var(--width-multiplier));
padding: calc(12 * var(--width-multiplier));
}
}
.locations-card__title {
font-weight: 700;
font-size: calc(30 * var(--width-multiplier));
line-height: 1.2;
color: #fdb714;
}
@media (max-width: 768px) {
.locations-card__title {
font-size: calc(20 * var(--width-multiplier));
}
}
.locations-card__desc {
color: #ffffff;
font-weight: 400;
font-size: calc(20 * var(--width-multiplier));
line-height: 1.2;
}
@media (max-width: 768px) {
.locations-card__desc {
font-size: calc(16 * var(--width-multiplier));
}
}
.download__box {
padding: calc(60 * var(--width-multiplier));
border-radius: calc(20 * var(--width-multiplier));
background: #490e00;
}
@media (max-width: 768px) {
.download__box {
padding: calc(20 * var(--width-multiplier));
border-radius: calc(16 * var(--width-multiplier));
}
}
.download__title {
text-align: center;
margin-bottom: calc(40 * var(--width-multiplier));
}
@media (max-width: 768px) {
.download__title {
margin-bottom: calc(20 * var(--width-multiplier));
}
}
@media (max-width: 768px) {
.download__title br {
display: none;
}
}
.download__inner-box {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: calc(40 * var(--width-multiplier));
}
@media (max-width: 768px) {
.download__inner-box {
gap: calc(12 * var(--width-multiplier));
}
}
.download-card {
padding: calc(34 * var(--width-multiplier));
border-radius: calc(40 * var(--width-multiplier));
background: #ffffff;
width: calc(218 * var(--width-multiplier));
height: calc(218 * var(--width-multiplier));
margin-left: auto;
}
@media (max-width: 768px) {
.download-card {
width: 100%;
height: 100%;
padding: calc(20 * var(--width-multiplier));
border-radius: calc(30 * var(--width-multiplier));
}
}
.download-card:first-child {
margin-top: auto;
}
.download-card img {
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
transition: all 0.3s ease;
}
.download-card_2row {
grid-column: 2/3;
grid-row: 1/3;
height: calc(552 * var(--width-multiplier));
width: calc(270 * var(--width-multiplier));
}
@media (max-width: 768px) {
.download-card_2row {
width: 100%;
height: 100%;
}
}
@media (hover: hover) and (pointer: fine) {
.download-card:hover img {
scale: 1.1;
}
}
@media (hover: none) {
.download-card:active img {
scale: 0.96;
}
}
.kairat__title {
margin-bottom: calc(40 * var(--width-multiplier));
}
@media (max-width: 768px) {
.kairat__title {
margin-bottom: calc(20 * var(--width-multiplier));
}
}
.kairat__box {
width: 100%;
border-radius: calc(20 * var(--width-multiplier));
border: calc(1 * var(--width-multiplier)) solid #fdb714;
overflow: hidden;
height: calc(600 * var(--width-multiplier));
}
@media (max-width: 768px) {
.kairat__box {
border-radius: calc(16 * var(--width-multiplier));
height: calc(300 * var(--width-multiplier));
}
}
.kairat__box img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: top;
object-position: top;
}
.faq__title {
text-align: center;
margin-bottom: calc(40 * var(--width-multiplier));
}
@media (max-width: 768px) {
.faq__title {
margin-bottom: calc(20 * var(--width-multiplier));
}
}
.faq__box {
max-width: calc(750 * var(--width-multiplier));
margin-inline: auto;
display: flex;
flex-direction: column;
gap: calc(20 * var(--width-multiplier));
}
@media (max-width: 768px) {
.faq__box {
max-width: 100%;
gap: calc(8 * var(--width-multiplier));
}
}
.faq-item {
cursor: pointer;
border-radius: calc(20 * var(--width-multiplier));
background: #121212;
padding: calc(30 * var(--width-multiplier));
height: -moz-fit-content;
height: fit-content;
border: calc(1 * var(--width-multiplier)) solid #fdb714;
transition: all 0.3s ease;
}
@media (max-width: 768px) {
.faq-item {
border-radius: calc(16 * var(--width-multiplier));
padding: calc(20 * var(--width-multiplier));
}
}
.faq-item__head {
display: grid;
align-items: center;
grid-template-columns: 1fr calc(40 * var(--width-multiplier));
gap: calc(30 * var(--width-multiplier));
}
@media (max-width: 768px) {
.faq-item__head {
grid-template-columns: 1fr calc(30 * var(--width-multiplier));
gap: calc(15 * var(--width-multiplier));
}
}
.faq-item__title {
color: #fdb714;
font-size: calc(20 * var(--width-multiplier));
font-weight: 700;
line-height: 1.2;
transition: all 0.3s ease;
}
@media (max-width: 768px) {
.faq-item__title {
font-size: calc(18 * var(--width-multiplier));
}
}
.faq-item__icon {
width: calc(40 * var(--width-multiplier));
height: calc(40 * var(--width-multiplier));
transition: rotate 0.3s ease;
}
@media (max-width: 768px) {
.faq-item__icon {
width: calc(30 * var(--width-multiplier));
height: calc(30 * var(--width-multiplier));
}
}
.faq-item__icon svg {
width: 100%;
height: 100%;
}
.faq-item__icon path {
transition: all 0.3s ease;
}
.faq-item__body {
overflow: hidden;
max-height: 0;
transition: max-height 0.3s ease-out;
}
.faq-item__desc {
margin-top: calc(10 * var(--width-multiplier));
margin-right: calc(70 * var(--width-multiplier));
color: #121212;
}
@media (max-width: 768px) {
.faq-item__desc {
margin-right: calc(40 * var(--width-multiplier));
}
}
.faq-item.active {
background: #fdb714;
}
.faq-item.active .faq-item__icon {
rotate: 45deg;
}
.faq-item.active .faq-item__title {
color: #121212;
}
.faq-item.active .faq-item__icon path {
fill: #121212;
} .lang-menu {
display: flex;
align-items: center;
gap: calc(5 * var(--width-multiplier));
margin-left: auto;
}
.header__logo {
margin-left: auto;
transform: translateX(50%);
}
@media(max-width:768px) {
.hero {
min-height: fit-content;
}
.hero__bg {
position: relative;
top: unset;
left: unset;
object-fit: contain;
}
}.trp-floating-switcher {
display: flex;
flex-direction: column-reverse;
position: fixed;
z-index: 99999;
overflow: hidden;
padding: var(--switcher-padding, 10px);
border: var(--border, none);
border-radius: var(--border-radius, 8px);
background: var(--bg, #fff);
width: var(--switcher-width, auto);
top: var(--top, unset);
right: var(--right, unset);
bottom: var(--bottom, unset);
left: var(--left, unset);
box-shadow: 0 10px 20px 0 #0000000D;
}
.trp-floating-switcher .trp-switcher-dropdown-list {
flex-direction: column-reverse;
}
.trp-switcher-position-top.trp-floating-switcher {
flex-direction: column;
}
.trp-floating-switcher.trp-switcher-position-top:not(.trp-ls-inline) .trp-language-switcher-inner,
.trp-floating-switcher.trp-switcher-position-top .trp-switcher-dropdown-list {
flex-direction: column;
} div.trp-ls-inline .trp-language-switcher-inner {
flex-direction: row;
}
.trp-ls-inline.trp-opposite-language .trp-language-item {
width: 100%;
} #trp-floater-powered-by {
color: var(--text, #b3b3b3);
font-size: 12px;
text-align: center;
padding: 0 5px;
}
#trp-floater-powered-by a {
color: var(--text, #b3b3b3);
}
.trp-switcher-position-bottom #trp-floater-powered-by {
border-top: 1px solid var(--text, #747474);
padding-top: 5px;
margin-top: 5px;
}
.trp-switcher-position-top #trp-floater-powered-by {
border-bottom: 1px solid var(--text, #747474);
padding-bottom: 5px;
margin-bottom: 5px;
} .trp-shortcode-switcher__wrapper {
position: relative;
border: none;
}
.trp-shortcode-switcher {
position: static;
display: inline-block;
overflow: hidden;
padding: 10px 0;
border: var(--border, none);
border-radius: var(--border-radius, 5px);
background: var(--bg, #fff);
width: auto;
box-shadow: none;
} .trp-shortcode-anchor {
visibility: hidden;
}
.trp-shortcode-switcher.trp-open-on-click {
cursor: pointer;
}
.trp-shortcode-overlay {
position: absolute;
left: 0;
top: 0;
z-index: 9999;
} .trp-current-language-item__wrapper:not(.trp-hide-arrow) {
display: flex;
align-items: center;
padding-right: 10px;
justify-content: space-between;
} .trp-language-switcher-inner {
display: flex;
}
.trp-floating-switcher .trp-language-switcher-inner {
flex-direction: column-reverse;
}
.trp-shortcode-switcher .trp-language-switcher-inner {
flex-direction: column;
}
.trp-switcher-dropdown-list {
display: flex;
overflow-y: hidden; transition: max-height 0.2s ease-in-out;
max-height: 0;
transition-duration: var(--transition-duration);
}
.trp-shortcode-switcher .trp-switcher-dropdown-list {
flex-direction: column;
} .trp-ls-dropdown.is-open .trp-switcher-dropdown-list,
.trp-ls-dropdown[aria-expanded="true"] .trp-switcher-dropdown-list,
.trp-shortcode-switcher.trp-open-on-hover.is-open .trp-switcher-dropdown-list,
.trp-shortcode-switcher[aria-expanded="true"] .trp-switcher-dropdown-list {
overflow-y: auto;
max-height: min(350px, 70vh);
-webkit-overflow-scrolling: touch;
scrollbar-width: thin;
scrollbar-color: var(--text) transparent;
}
.trp-ls-dropdown.is-transitioning .trp-switcher-dropdown-list,
.trp-shortcode-switcher.is-transitioning .trp-switcher-dropdown-list {
overflow-y: hidden !important;
}
.trp-shortcode-arrow {
pointer-events: none;
}
.trp-shortcode-switcher.is-open .trp-shortcode-arrow {
transform: rotate(180deg);
}
.trp-shortcode-overlay:focus { outline: none; }
.trp-shortcode-overlay:focus-visible {
outline: 2px solid var(--text);
outline-offset: 2px;
} .trp-shortcode-overlay .trp-language-item:focus { outline: none; }
.trp-shortcode-overlay .trp-language-item:focus-visible {
outline: 2px solid var(--text);
outline-offset: 2px;
} .trp-language-item {
display: flex;
align-items: center;
gap: 8px;
padding: 7px 16px;
text-decoration: none;
min-height: 19px;
box-sizing: content-box;
}
.trp-language-item:hover {
background: var(--bg-hover, #f3f3f3);
}
.trp-language-item:hover .trp-language-item-name {
color: var(--text-hover, #000);
}
.trp-language-item__current {
pointer-events: none;
cursor: default;
}
.trp-language-item-name {
display: inline-block;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: var(--text, #000);
font-size: var(--font-size, 14px);
line-height: 1.2;
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
font-weight: 400;
}
.trp-flag-image {
border-radius: var(--flag-radius, 0) !important;
aspect-ratio: var(--aspect-ratio, 4/3) !important;
width: var(--flag-size, 18px) !important;
display: inline-block !important;
height: auto !important;
}
.trp-menu-ls-label .trp-flag-image {
margin: -2px 3px;
}
.trp-custom-flag {
object-fit: cover;
} .trp-switcher-dropdown-list::-webkit-scrollbar { width: 6px; }
.trp-switcher-dropdown-list::-webkit-scrollbar-track { background: transparent; }
.trp-switcher-dropdown-list::-webkit-scrollbar-thumb {
background-color: var(--text);
border-radius: 4px;
}
.trp-switcher-dropdown-list::-webkit-scrollbar-thumb:hover {
background-color: var(--text-hover);
} .trp-flag-rounded {
border-radius: 9999px !important;
aspect-ratio: 1 / 1 !important;
}
.trp-ls-name {
padding-left: 5px;
}
@media (prefers-reduced-motion: reduce) {
.trp-switcher-dropdown-list {
transition: none !important; }
} .trp_ald_ls_container img.trp-flag-image{
padding-top: 0 !important;
}
.trp_ald_ls_container .trp-language-switcher{
position: relative;
display: inline-block;
padding: 0;
border: 0;
box-sizing: border-box;
}
.trp_ald_ls_container .trp-language-switcher > div {
box-sizing: border-box;
padding-right: 20px;
padding-bottom: 3px;
padding-left: 13px;
border: 1px solid #c1c1c1;
border-radius: 3px;
background-color: #fff;
}
.trp_ald_ls_container .trp-language-switcher > div > a {
display: block;
padding: 2px;
border-radius: 3px;
color: rgb(7, 105, 173);
}
.trp_ald_ls_container .trp-language-switcher > div > a:hover {
background: #f1f1f1;
}
.trp_ald_ls_container .trp-language-switcher > div > a.trp-ls-shortcode-disabled-language {
cursor: default;
}
.trp_ald_ls_container .trp-language-switcher > div > a.trp-ls-shortcode-disabled-language:hover {
background: none;
}
.trp_ald_ls_container .trp-language-switcher > div > a > img{
display: inline;
margin: 0 3px;
width: 18px;
height: 12px;
border-radius: 0;
}
.trp_ald_ls_container .trp-language-switcher .trp-ls-shortcode-current-language{
display: inline-block;
}
.trp_ald_ls_container .trp-language-switcher:focus .trp-ls-shortcode-current-language,
.trp_ald_ls_container .trp-language-switcher:hover .trp-ls-shortcode-current-language{
visibility: hidden;
}
.trp_ald_ls_container .trp-language-switcher .trp-ls-shortcode-language{
display: inline-block;
height: 1px;
overflow: hidden;
visibility: hidden;
z-index: 1;
max-height: 250px;
overflow-y: auto;
left: 0;
top: 0;
min-height: auto;
}
.trp_ald_ls_container .trp-language-switcher:focus .trp-ls-shortcode-language,
.trp_ald_ls_container .trp-language-switcher:hover .trp-ls-shortcode-language{
visibility: visible;
max-height: 250px;
height: auto;
overflow-y: auto;
position: absolute;
left: 0;
top: 0;
display: inline-block !important;
min-height: auto;
}
#trp_ald_x_button{
z-index: 0 !important;
}