/home/bdqbpbxa/demo-subdomains/u-pod.goodface.com.ua/wp-content/themes/upod/assets/css/styles.css
/*--*-- Fonts --*--*/
@font-face {
font-family: "Manrope";
src: url("../fonts/Manrope-Regular.woff");
font-weight: normal;
}
@font-face {
font-family: "Manrope";
src: url("../fonts/Manrope-Medium.woff");
font-weight: 500;
}
@font-face {
font-family: "Manrope";
src: url("../fonts/Manrope-ExtraBold.woff");
font-weight: 800;
}
@font-face {
font-family: "Benzin";
src: url("../fonts/benzin-bold.woff");
font-weight: normal;
}
/*--*-- General --*--*/
html {
background: url(../img/bg.png) #0B0C0D repeat;
}
html.no-scroll {
top: 0;
left: 0;
right: 0;
bottom: 0;
position: fixed;
overflow: hidden;
}
body {
margin: 0;
padding: 0;
overflow-x: hidden;
/* Запрет зума текста на телефоне */
-webkit-text-size-adjust: 100%;
/* Сглаживание шрифтов */
-webkit-font-smoothing: antialiased;
}
body * {
margin: 0;
padding: 0;
outline: 0;
background-repeat: no-repeat;
background-position: center;
font-family: 'Manrope', sans-serif;
font-weight: normal;
font-style: normal;
color: #FFFFFF;
/* Учёт размеров элементов, включая margin, padding и border */
-webkit-box-sizing: border-box;
box-sizing: border-box;
/* Исправляет баг скроллинга на IOS */
-webkit-overflow-scrolling: touch;
/* Убирает подсветку элемента при касании на телефоне */
-webkit-tap-highlight-color: transparent;
/* Убирает базовые стили браузера */
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
/* Убирает скругления кнопок на IOS */
input {
border-radius: 0;
}
/* Удаление кнопок, которые браузер вставляет в input */
input::-ms-reveal,
input::-ms-clear {
display: none;
}
li {
list-style-type: none;
}
a {
text-decoration: none;
-webkit-transition: 0.4s;
transition: 0.4s;
}
svg,
svg path,
svg circle {
-webkit-transition: 0.4s;
transition: 0.4s;
}
img {
border: none;
/* Запрет перетаскивания изображений */
-webkit-user-drag: none;
}
.container {
width: 1440px;
margin: 0 auto;
}
.dark-bg {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 49;
background: rgba(0, 0, 0, 0.6);
pointer-events: none;
opacity: 0;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.dark-bg.active {
pointer-events: auto;
opacity: 1;
}
*.-white-block {
background-color: #ffffff;
}
*.-white-block * {
color: #0B0C0D;
}
/*--*-- Button --*--*/
.button-container {
display: flex;
align-items: center;
justify-content: flex-start;
}
.button-container .button {
margin-right: 16px
}
.button-container .button:last-child {
margin-right: 0;
}
.button {
display: flex;
align-items: center;
justify-content: center;
height: 52px;
padding: 0 40px;
font-weight: 800;
font-size: 14px;
line-height: 100%;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #0B0C0D;
white-space: nowrap;
user-select: none;
border: none;
background-color: #A9FF00;
-webkit-border-radius: 80px;
border-radius: 80px;
cursor: pointer;
-webkit-transition: color 0.4s, border 0.4s, opacity 0.4s;
transition: color 0.4s, border 0.4s, opacity 0.4s;
}
.button.-big {
height: 72px;
padding: 0 56px;
}
.button.-dark {
background-color: #0B0C0D;
color: #FFFFFF;
}
.button.-border {
background-color: transparent;
border: 2px solid #FFFFFF;
color: #FFFFFF;
}
/*--*-- Text --*--*/
.title-1 {
font-family: 'Benzin', sans-serif;
font-size: 64px;
line-height: 100%;
}
.title-2 {
font-family: 'Benzin', sans-serif;
font-size: 48px;
line-height: 100%;
}
.title-3 {
font-family: 'Benzin', sans-serif;
font-size: 28px;
line-height: 113%;
}
.title-4 {
font-family: 'Benzin', sans-serif;
font-size: 20px;
line-height: 113%;
}
.text-1 {
font-weight: 500;
font-size: 18px;
line-height: 180%;
letter-spacing: -0.3px;
}
.text-2 {
font-weight: 500;
font-size: 16px;
line-height: 150%;
}
.text-3 {
font-weight: 500;
font-size: 14px;
line-height: 113%;
}
.text-4 {
font-weight: 500;
font-size: 20px;
line-height: 130%;
}
.-grey {
color: #808080;
}
/*--*-- Input --*--*/
.input {
width: 100%;
height: 52px;
padding: 0 20px;
background-color: #ECECEC;
border: 2px solid #ECECEC;
border-radius: 12px;
font-family: 'Manrope', sans-serif;
font-style: normal;
font-weight: 800;
font-size: 14px;
line-height: 113%;
letter-spacing: -0.01em;
color: #0B0C0D;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.input::placeholder {
font-weight: 500;
color: #808080;
}
.input:focus {
border-color: #0B0C0D;
}
.input-box.error .input {
border-color: #FF3F38;
}
.input-box.error .input-text-error {
display: block;
}
.input-box.wpcf7-not-valid .input {
border-color: #FF3F38;
}
.input-box.wpcf7-not-valid .input-text-error {
display: block;
}
.input-box.valid .input {
border-color: #0CDE47;
}
.input-text-error {
display: none;
margin-top: 12px;
font-weight: 500;
font-size: 14px;
line-height: 113%;
color: #FF3F38;
}
/*--*-- Checkbox --*--*/
.checkbox input {
display: none;
}
.checkbox label {
display: flex;
align-items: center;
justify-content: flex-start;
cursor: pointer;
}
.checkbox-check {
display: flex;
align-items: center;
justify-content: center;
width: 26px;
min-width: 26px;
height: 26px;
border: 2px solid transparent;
background-color: #FFFFFF;
border-radius: 6px;
margin: 2px;
transition: 0.4s;
}
.checkbox.error .checkbox-check {
border-color: #FF3F38;
}
.checkbox-check:before {
content: '';
display: block;
position: absolute;
width: 17px;
height: 13px;
background-image: url("data:image/svg+xml,%0A%3Csvg width='17' height='13' viewBox='0 0 17 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M16.705 1.70938L5.93538 12.4121L0.292969 6.76968L1.70718 5.35547L5.93977 9.58806L15.2952 0.290771L16.705 1.70938Z' fill='%230B0C0D'/%3E%3C/svg%3E%0A");
background-repeat: no-repeat;
background-position: center center;
-webkit-background-size: contain;
background-size: contain;
opacity: 0;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.checkbox-text {
margin-left: 12px;
user-select: none;
font-weight: 500;
font-size: 14px;
line-height: 113%;
color: #808080;
}
.checkbox-text a {
font-weight: inherit;
font-size: inherit;
line-height: inherit;
color: #FFFFFF;
}
.checkbox input:checked + label .checkbox-check:before {
opacity: 1;
}
/*--*-- Dropdown --*--*/
.dropdown {
position: relative;
}
.dropdown-button {
display: flex;
align-items: center;
justify-content: flex-start;
cursor: pointer;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.dropdown-button img,
.dropdown-button svg {
margin-left: 6px;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.dropdown-list {
position: absolute;
bottom: calc(100% + 8px);
left: -16px;
opacity: 0;
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
pointer-events: none;
z-index: 5;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.dropdown-list {
background-color: #2D2D2F;
border-radius: 12px;
padding: 12px 16px;
}
.dropdown-list li {
margin-bottom: 12px;
}
.dropdown-list li:last-child {
margin-bottom: 0;
}
.dropdown-list li,
.dropdown-list a {
font-weight: 500;
font-size: 14px;
line-height: 113%;
color: #FFFFFF;
cursor: pointer;
user-select: none;
}
.dropdown-list li.active,
.dropdown-list a.active {
pointer-events: none;
opacity: 0.5;
}
.dropdown-list:after {
content: '';
display: block;
position: absolute;
top: 100%;
height: 8px;
right: 0;
left: 0;
opacity: 0;
}
.dropdown.active .dropdown-list,
.footer__language:hover .dropdown-list {
opacity: 1;
pointer-events: auto;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.dropdown.active .dropdown-button img,
.dropdown.active .dropdown-button svg,
.footer__language:hover .dropdown-button img,
.footer__language:hover .dropdown-button svg {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
/*--*-- Around line --*--*/
.line-around {
position: relative;
font-family: inherit;
font-weight: inherit;
font-size: inherit;
letter-spacing: inherit;
line-height: inherit;
color: inherit;
}
.line-around svg {
position: absolute;
width: 115%;
height: auto;
top: 50%;
left: 50%;
-webkit-transform: translate3d(-50%, -50%, 0);
transform: translate3d(-50%, -50%, 0);
pointer-events: none;
user-select: none;
}
.line-around.-bot svg {
-webkit-transform: translate3d(-50%, -38%, 0);
transform: translate3d(-50%, -38%, 0);
}
.line-around.-small svg {
width: 105%;
}
/*--*-- Header --*--*/
.header {
position: fixed;
top: 24px;
left: 0;
right: 0;
z-index: 50;
}
.header.events-none {
pointer-events: none;
}
.header-content {
display: flex;
align-items: center;
justify-content: space-between;
background-color: #0B0C0D;
-webkit-border-radius: 160px;
border-radius: 160px;
padding: 8px 8px;
border: 1px solid #2D2D2F;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.header-content.hide {
-webkit-transform: translate3d(0, -95px, 0);
transform: translate3d(0, -95px, 0);
}
.header__left-block {
display: flex;
align-items: center;
justify-content: center;
}
.main-logo {
display: flex;
align-items: center;
justify-content: flex-start;
margin-left: 12px;
height: 28px;
}
.main-logo img,
.main-logo svg {
display: block;
height: 100%;
width: auto;
}
.hamburger {
display: none;
}
.header__nav-block {
display: flex;
align-items: center;
justify-content: flex-end;
}
.header__right-block {
display: flex;
align-items: center;
justify-content: flex-end;
margin-left: 100px;
}
.social-block {
display: flex;
align-items: center;
justify-content: flex-start;
}
.social-block a {
display: flex;
align-items: center;
justify-content: center;
height: 20px;
margin-right: 20px;
}
.social-block a:last-child {
margin-right: 0;
}
.social-block a svg,
.social-block a img {
display: block;
height: 100%;
width: auto;
}
.header__right-block .button-container {
margin-left: 48px;
}
.header__nav-list {
display: flex;
align-items: center;
justify-content: center;
}
.header__nav-list > li {
margin-right: 48px;
}
.header__nav-list > li:last-child {
margin-right: 0;
}
.header__nav-link {
display: flex;
align-items: center;
justify-content: flex-start;
font-weight: 800;
font-size: 14px;
line-height: 100%;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #FFFFFF;
white-space: nowrap;
cursor: pointer;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.header__nav-link svg {
margin-left: 9px;
}
.header-dropdown-box {
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.header-dropdown__list {
position: absolute;
top: 49px;
background-color: #0B0C0D;
border-radius: 18px;
padding: 12px;
opacity: 0;
pointer-events: none;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.header-dropdown__list:after {
content: '';
display: block;
position: absolute;
bottom: 100%;
right: 10%;
left: 10%;
height: 35px;
pointer-events: none;
opacity: 0;
cursor: default;
}
.header-dropdown__list:before {
content: '';
display: block;
position: absolute;
bottom: 100%;
left: 50%;
-webkit-transform: translate3d(-50%, 0, 0);
transform: translate3d(-50%, 0, 0);
width: 56px;
height: 8px;
background-image: url("data:image/svg+xml,%0A%3Csvg width='56' height='8' viewBox='0 0 56 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 4C4 6.20914 2.20914 8 0 8H56C53.7909 8 52 6.20914 52 4C52 1.79086 53.7909 0 56 0H0C2.20914 0 4 1.79086 4 4Z' fill='%230B0C0D'/%3E%3C/svg%3E%0A");
}
.header-dropdown__list.-logo {
width: 408px;
}
.header-dropdown__list.-logo .header-dropdown__list-content {
display: flex;
align-items: stretch;
justify-content: flex-start;
flex-wrap: wrap;
}
.header-dropdown__list.-logo a {
display: flex;
align-items: center;
justify-content: center;
width: 120px;
height: 90px;
padding: 25px 18px;
margin-right: 12px;
margin-bottom: 12px;
background-color: #2D2D2F;
-webkit-border-radius: 12px;
border-radius: 12px;
}
.header-dropdown__list.-logo a img,
.header-dropdown__list.-logo a svg {
max-width: 100%;
max-height: 100%;
filter: brightness(10000%);
}
.header-dropdown__list.-logo a:nth-child(3n+3) {
margin-right: 0;
}
.header-dropdown__list.-logo a:nth-last-child(-n+3) {
margin-bottom: 0;
}
.header-dropdown__list.-logo .hover {
-webkit-transition: 0.4s;
transition: 0.4s;
}
.header-dropdown__list.-contacts {
padding: 24px 32px 24px 24px;
}
.header-dropdown__list.-contacts li {
margin-bottom: 24px;
}
.header-dropdown__list.-contacts li:last-child {
margin-bottom: 0;
}
.header-dropdown__list.-contacts .text,
.header-dropdown__list.-contacts a {
white-space: nowrap;
}
.header-dropdown__list.-contacts .text {
font-weight: 500;
font-size: 14px;
line-height: 113%;
color: #808080;
}
.header-dropdown__list.-contacts a {
display: inline-block;
margin-top: 8px;
font-weight: 500;
font-size: 18px;
line-height: 100%;
color: #FFFFFF;
}
/*--*-- Footer --*--*/
.footer {
padding: 67px 0 32px;
}
.footer__top {
display: flex;
align-items: flex-start;
justify-content: space-between;
}
.footer__top > .social-block {
display: none;
}
.footer-nav-box .title {
font-family: 'Benzin', sans-serif;
font-size: 20px;
line-height: 113%;
color: #FFFFFF;
}
.footer__nav-list {
margin-top: 12px;
}
.footer__nav-list a {
font-weight: 500;
font-size: 18px;
line-height: 180%;
letter-spacing: -0.3px;
color: #FFFFFF;
}
.footer__contacts .social-block {
margin-top: 26px;
}
.footer__contacts .social-block a {
margin-right: 16px;
}
.footer__right-box {
width: 467px;
}
.footer__form form {
margin-top: 16px;
}
.footer__input-box {
display: flex;
align-items: flex-start;
justify-content: space-between;
}
.footer__input-box .input-box {
width: 100%;
margin-right: 12px;
}
.footer__form .checkbox {
margin-top: 16px;
}
.footer__thanks .text {
margin-top: 16px;
font-weight: 500;
font-size: 16px;
line-height: 150%;
color: #808080;
opacity: 0.6;
}
.footer__bot {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 105px;
}
.footer__bot-left {
display: flex;
align-items: center;
justify-content: flex-start;
}
.footer__bot-left li {
margin-right: 67px;
}
.footer__bot-left li:last-child {
margin-right: 0;
}
.footer__bot-left a {
font-weight: 500;
font-size: 14px;
line-height: 113%;
color: #FFFFFF;
}
.footer__language .dropdown-button {
font-weight: 500;
font-size: 14px;
line-height: 113%;
color: #FFFFFF;
}
.footer__bot .footer__right-box {
display: flex;
align-items: center;
justify-content: space-between;
}
.footer__developed * {
font-weight: 500;
font-size: 14px;
line-height: 113%;
}
.footer__developed p {
display: inline-block;
color: #808080;
}
.footer__developed a {
color: #A9FF00;
}
/*--*-- Index | Main section --*--*/
.main-section {
overflow: hidden;
}
.main-section .container {
position: relative;
padding-top: 215px;
padding-bottom: 200px;
min-height: 900px;
}
.main-section .text-box {
max-width: 582px;
position: relative;
z-index: 2;
}
.main-section .text-box .text {
margin-top: 18px;
}
.main-section .text-box .button-container {
margin-top: 40px;
}
.main-section__animation-container {
position: absolute;
top: 0;
right: 0;
bottom: 0;
display: flex;
height: 100%;
}
@keyframes productAnimation {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
.main-section__animation-block {
margin-right: 5px;
}
.main-section__animation-block:last-child {
margin-right: 0;
}
.main-section__animation-list {
animation: productAnimation 30s infinite linear;
}
.main-section__animation-box {
padding-bottom: 80px;
}
.main-section__animation-box img {
display: block;
max-width: 79px;
max-height: 420px;
margin: 0 auto;
}
.main-section__animation-text {
position: relative;
margin-top: -24px;
width: 248px;
padding: 24px 16px 20px;
background: rgba(77, 77, 77, 0.1);
backdrop-filter: blur(16px);
border-radius: 18px;
text-align: center;
z-index: 2;
}
.main-section__animation-text h1,
.main-section__animation-text h2,
.main-section__animation-text h3,
.main-section__animation-text h4,
.main-section__animation-text h5,
.main-section__animation-text h6 {
font-family: 'Benzin', sans-serif;
font-size: 16px;
line-height: 100%;
}
.main-section__animation-text p strong,
.main-section__animation-text p {
font-weight: 800;
font-size: 16px;
line-height: 150%;
letter-spacing: -0.02em;
}
.main-section__animation-text p {
margin-top: 10px;
}
/*--*-- Brands section --*--*/
.brands-section {
padding-top: 180px;
padding-bottom: 250px;
}
.brands-section .title-box {
max-width: 700px;
margin: 0 auto;
text-align: center;
}
.brands-section__catalog {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
margin-right: -21px;
margin-bottom: -64px;
margin-top: 64px;
}
.brands-section__brands {
width: 466px;
margin-right: 21px;
margin-bottom: 64px;
}
.brands-section__brands:not(.for-partner) .img {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 466px;
padding: 75px;
background-color: #fff;
border-radius: 18px;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.brands-section__brands:not(.for-partner) .img .brands {
display: block;
max-width: 280px;
max-height: 310px;
object-fit: contain;
}
.brands-section__brands:not(.for-partner) .img .logo {
position: absolute;
top: 20px;
right: 20px;
display: block;
max-height: 45px;
}
.brands-section__brands .description {
margin-top: 21px;
}
.brands-section__brands .description .title {
display: flex;
align-items: flex-start;
justify-content: flex-start;
font-family: 'Benzin', sans-serif;
font-size: 28px;
line-height: 113%;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.brands-section__brands .description .title img {
width: 23px;
height: 12px;
margin-left: 6px;
}
.brands-section__brands .description .number-box {
margin-top: 6px;
}
.brands-section__brands .number-box {
display: flex;
align-items: center;
justify-content: flex-start;
}
.brands-section__brands .number-box > div {
display: flex;
align-items: center;
justify-content: flex-start;
}
.brands-section__brands .number-box > div:after {
content: '';
display: block;
margin: 0 16px;
width: 5px;
height: 5px;
-webkit-border-radius: 50%;
border-radius: 50%;
background-color: #A9FF00;
}
.brands-section__brands .number-box > div:last-child:after {
display: none;
}
.brands-section__brands .number-box p,
.brands-section__brands .number-box strong {
font-size: 16px;
line-height: 150%;
}
.brands-section__brands .number-box p {
opacity: 0.7;
font-weight: 500;
text-transform: capitalize;
}
.brands-section__brands .number-box strong {
margin-left: 4px;
font-weight: 800;
}
.for-partner {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
height: 466px;
padding: 33px;
border: 2px solid #A9FF00;
border-radius: 18px;
text-align: center;
}
.for-partner .img {
display: flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
}
.for-partner .img img {
display: block;
max-width: 100%;
max-height: 100%;
}
.for-partner .title {
margin-top: 18px;
}
.for-partner .text {
margin-top: 14px;
}
.for-partner .button {
margin-top: 34px;
}
/*--*-- Index | Benefits section --*--*/
.benefits-section {
padding: 180px 0;
}
.benefits-section .title-box {
max-width: 540px;
margin: 0 auto;
text-align: center;
}
.benefits-block {
position: relative;
display: flex;
align-items: center;
justify-content: center;
margin-top: 61px;
width: 100%;
}
.benefits-block .img {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 500px;
height: 500px;
padding: 10px 0;
z-index: 2;
}
.benefits-block .img:before {
content: '';
position: absolute;
display: block;
top: 0;
right: 0;
left: 0;
bottom: 0;
background-image: url("data:image/svg+xml,%3Csvg width='500' height='500' viewBox='0 0 500 500' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M250 500C388.071 500 500 388.071 500 250C500 111.929 388.071 0 250 0C111.929 0 0 111.929 0 250C0 388.071 111.929 500 250 500Z' fill='%23FFA100'/%3E%3Cmask id='mask0' mask-type='alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='500' height='500'%3E%3Cpath d='M250 500C388.071 500 500 388.071 500 250C500 111.929 388.071 0 250 0C111.929 0 0 111.929 0 250C0 388.071 111.929 500 250 500Z' fill='%23FCB000'/%3E%3C/mask%3E%3Cg mask='url(%23mask0)'%3E%3Cg filter='url(%23filter0_f)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M400.216 17.2961C461.495 12.2824 510.753 71.8734 554.917 125.06C600.144 179.526 646.773 239.587 649.81 317.88C652.955 398.947 616.705 472.934 570.637 530.294C524.596 587.62 464.755 639.063 400.216 628.65C339.54 618.86 311.581 536.19 268.86 481.602C227.116 428.261 157.97 392.385 157.01 317.88C156.047 243.121 221.977 201.461 264.573 148.815C306.859 96.5526 340.793 22.1579 400.216 17.2961Z' fill='%230BEC4A'/%3E%3C/g%3E%3Cg filter='url(%23filter1_f)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M436.455 -249.732C493.26 -254.264 538.921 -200.408 579.86 -152.341C621.784 -103.117 665.008 -48.8368 667.824 21.9211C670.739 95.1852 637.137 162.052 594.432 213.891C551.753 265.699 496.282 312.191 436.455 302.78C380.211 293.932 354.293 219.219 314.692 169.885C275.996 121.678 211.899 89.2549 211.01 21.9211C210.117 -45.6431 271.232 -83.2929 310.718 -130.872C349.916 -178.104 381.372 -245.339 436.455 -249.732Z' fill='%23FCE300'/%3E%3C/g%3E%3Cg filter='url(%23filter2_f)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M-61.4422 -207.727C-13.4563 -238.463 52.1794 -212.438 110.925 -189.298C171.084 -165.602 234.769 -138.056 270.559 -76.9516C307.616 -13.683 309.442 61.1293 296.165 126.967C282.895 192.767 255.837 259.896 198.622 279.753C144.833 298.42 86.7984 244.701 28.6375 219.813C-28.1945 195.494 -100.008 197.057 -132.487 138.068C-165.076 78.8764 -128.877 16.8917 -116.433 -43.6731C-104.081 -103.796 -107.974 -177.923 -61.4422 -207.727Z' fill='%23FF3F38'/%3E%3C/g%3E%3C/g%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M19.9 152.4L29.5 134H1.5C11.6 134 25 142.6 19.9 152.4Z' fill='%23FF3F38'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1.3999 366H29.3999L19.7999 347.6C24.8999 357.4 11.4999 366 1.3999 366Z' fill='%23FFA100'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M498.6 134H470.6L480.2 152.4C475.1 142.6 488.4 134 498.6 134Z' fill='%23FCE300'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M480.2 347.6L470.6 366H498.6C488.4 366 475.1 357.4 480.2 347.6Z' fill='%230BEC4A'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M19.1001 110H55.5001L62.0001 85.3C47.3001 102.3 32.3001 110 19.1001 110Z' fill='%23FF3F38'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M437.9 85.3L444.4 110H480.8C467.7 110 452.7 102.3 437.9 85.3Z' fill='%23FCE300'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M62.0001 414.7L55.5001 390H19.1001C32.3001 390 47.3001 397.7 62.0001 414.7Z' fill='%23FFA100'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M480.8 390H444.4L437.9 414.7C452.7 397.7 467.7 390 480.8 390Z' fill='%230BEC4A'/%3E%3Cdefs%3E%3Cfilter id='filter0_f' x='37' y='-103' width='733' height='853' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeGaussianBlur stdDeviation='60' result='effect1_foregroundBlur'/%3E%3C/filter%3E%3Cfilter id='filter1_f' x='91' y='-370' width='697' height='794' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeGaussianBlur stdDeviation='60' result='effect1_foregroundBlur'/%3E%3C/filter%3E%3Cfilter id='filter2_f' x='-265.745' y='-341.756' width='689.44' height='745.372' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='BackgroundImageFix' result='shape'/%3E%3CfeGaussianBlur stdDeviation='60' result='effect1_foregroundBlur'/%3E%3C/filter%3E%3C/defs%3E%3C/svg%3E%0A");
background-repeat: no-repeat;
background-position: center center;
-webkit-background-size: contain;
background-size: contain;
z-index: -1;
}
.benefits-block .img img {
display: block;
max-width: 100%;
max-height: 100%;
}
.benefits-text-box {
position: absolute;
display: flex;
align-items: center;
}
.benefits-text-box .line {
display: block;
}
.benefits-text-box .text {
position: absolute;
display: flex;
align-items: center;
text-align: left;
width: 378px;
min-height: 90px;
padding: 16px 16px 16px 32px;
border-radius: 18px;
font-family: 'Benzin', sans-serif;
font-size: 20px;
line-height: 113%;
}
#benefits-text-top-left {
left: 378px;
}
#benefits-text-top-left .text {
background-color: #FF3F38;
}
#benefits-text-top-left .line {
width: 151px;
height: 66px;
background-image: url("data:image/svg+xml,%3Csvg width='151' height='66' viewBox='0 0 151 66' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect y='21' width='151' height='24' fill='%23FF3F38'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M21 21H0V0C0 11.598 9.40202 21 21 21Z' fill='%23FF3F38'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M21 45H0V66C0 54.402 9.40202 45 21 45Z' fill='%23FF3F38'/%3E%3C/svg%3E%0A");
background-repeat: no-repeat;
background-position: center center;
-webkit-background-size: contain;
background-size: contain;
}
#benefits-text-top-right {
right: 378px;
}
#benefits-text-top-right .text {
background-color: #FCE300;
}
#benefits-text-top-right .line {
width: 151px;
height: 66px;
background-image: url("data:image/svg+xml,%3Csvg width='151' height='66' viewBox='0 0 151 66' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='151' height='24' transform='matrix(-1 0 0 1 151 21)' fill='%23FCE300'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M130 21H151V0C151 11.598 141.598 21 130 21Z' fill='%23FCE300'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M130 45H151V66C151 54.402 141.598 45 130 45Z' fill='%23FCE300'/%3E%3C/svg%3E%0A");
background-repeat: no-repeat;
background-position: center center;
-webkit-background-size: contain;
background-size: contain;
}
#benefits-text-bot-left {
left: 378px;
}
#benefits-text-bot-left .text {
background-color: #FFA200;
}
#benefits-text-bot-left .line {
width: 168px;
height: 66px;
background-image: url("data:image/svg+xml,%3Csvg width='168' height='66' viewBox='0 0 168 66' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect y='21' width='168' height='24' fill='%23FFA100'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 0V21H21C9.40202 21 0 11.598 0 0Z' fill='%23FFA100'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M21 45H0V66C0 54.402 9.40202 45 21 45Z' fill='%23FFA100'/%3E%3C/svg%3E%0A");
background-repeat: no-repeat;
background-position: center center;
-webkit-background-size: contain;
background-size: contain;
}
#benefits-text-bot-right {
right: 378px;
}
#benefits-text-bot-right .text {
background-color: #0BEC4A;
}
#benefits-text-bot-right .line {
width: 180px;
height: 66px;
background-image: url("data:image/svg+xml,%3Csvg width='180' height='66' viewBox='0 0 180 66' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='180' height='24' transform='matrix(-1 0 0 1 180 21)' fill='%230BEC4A'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M159 21H180V0C180 11.598 170.598 21 159 21Z' fill='%230BEC4A'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M159 45H180V66C180 54.402 170.598 45 159 45Z' fill='%230BEC4A'/%3E%3C/svg%3E%0A");
background-repeat: no-repeat;
background-position: center center;
-webkit-background-size: contain;
background-size: contain;
}
#benefits-text-top-left,
#benefits-text-top-right {
top: 89px;
}
#benefits-text-bot-left,
#benefits-text-bot-right {
bottom: 89px;
}
#benefits-text-top-left .text,
#benefits-text-bot-left .text {
right: calc(100% - 1px);
}
#benefits-text-top-right .text,
#benefits-text-bot-right .text {
left: calc(100% - 1px);
}
.benefits-section .button-container {
margin-top: 40px;
justify-content: center;
}
/*--*-- Index | Mission section --*--*/
.mission-section {
padding-top: 280px;
padding-bottom: 180px;
}
.mission-section .container {
position: relative;
z-index: 5;
}
.mission-section__social-block,
.mission-section .title-box {
max-width: 1092px;
margin: 0 auto;
text-align: center;
}
.mission-section .title-box .title {
margin-bottom: 32px;
}
.mission-section .title-box .title:last-child {
margin-bottom: 0;
}
.mission-section .title-box .title img {
width: 58px;
height: 36px;
}
.mission-section__social-block {
position: relative;
margin-top: 43px;
z-index: 5;
}
.mission-section__social-block > .text {
margin-bottom: 18px;
}
.mission-section__social {
display: flex;
align-items: center;
justify-content: center;
}
.mission-section__social a {
margin-right: 48px;
}
.mission-section__social a:last-child {
margin-right: 0;
}
.mission-section__social a {
display: flex;
align-items: flex-start;
justify-content: flex-start;
margin-right: 48px;
}
.mission-section__social img {
display: block;
width: 24px;
height: 24px;
margin-right: 12px;
margin-top: 4px;
}
.mission-section__img {
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
z-index: -1;
}
.mission-section__img .img {
position: absolute;
display: flex;
align-items: center;
justify-content: center;
background-color: #E7E7E7;
-webkit-border-radius: 18px;
border-radius: 18px;
overflow: hidden;
}
.mission-section__img .img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
-webkit-border-radius: 18px;
border-radius: 18px;
}
.mission-section__img.-not-fill .img img {
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
object-fit: contain;
-webkit-border-radius: 0;
border-radius: 0;
}
.mission-section__img .img:nth-child(1) {
bottom: 54px;
left: 0;
width: 210px;
height: 280px;
}
.mission-section__img.-version-2 .img:nth-child(1) {
top: 75px;
bottom: auto;
width: 164px;
height: 263px;
}
.mission-section__img.-version-3 .img:nth-child(1) {
bottom: 27px;
width: 164px;
height: 263px;
}
.mission-section__img .img:nth-child(2) {
top: -187px;
right: 248px;
width: 150px;
height: 200px;
}
.mission-section__img.-version-2 .img:nth-child(2) {
top: auto;
right: auto;
left: 367px;
bottom: -150px;
width: 100px;
height: 160px;
}
.mission-section__img.-version-3 .img:nth-child(2) {
top: auto;
right: 340px;
bottom: -150px;
width: 108px;
height: 171px;
}
.mission-section__img .img:nth-child(3) {
bottom: 224px;
right: 0;
width: 132px;
height: 176px;
}
.mission-section__img.-version-2 .img:nth-child(3) {
top: -35px;
right: 0;
height: 206px;
width: 128px;
}
.mission-section__img.-version-3 .img:nth-child(3) {
top: 0;
right: 0;
height: 160px;
width: 100px;
}
/*--*-- Index | Logo scroll block --*--*/
.scroll-block {
display: flex;
overflow: hidden;
scrollbar-width: none;
}
.logo-scroll-block {
align-items: center;
padding: 30px 0;
background-color: #A9FF00;
}
.scroll-container {
display: flex;
align-items: center;
justify-content: flex-start;
}
.scroll-box {
display: flex;
align-items: center;
justify-content: flex-start;
animation: horizontalAnimationScroll 20s infinite linear;
animation-play-state: paused;
}
.logo-scroll-box {
padding-left: 210px;
}
.logo-scroll-block img {
display: block;
max-height: 44px;
max-width: 146px;
margin-right: 210px;
}
.logo-scroll-block img:last-child {
margin-right: 0;
}
.logo-scroll-block::-webkit-scrollbar {
display: none;
}
@keyframes horizontalAnimationScroll {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
/*--*-- Modal --*--*/
.modal-wrapper {
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 99;
opacity: 0;
pointer-events: none;
overflow: hidden;
background: rgba(0, 0, 0, 0.5);
-webkit-transition: opacity 0.4s;
transition: opacity 0.4s;
-webkit-transition-delay: 0s;
transition-delay: 0s;
}
.modal-wrapper:not(.active) * {
pointer-events: none !important;
}
.modal-wrapper .title {
color: #0B0C0D;
}
.modal-wrapper.hide {
opacity: 0;
-webkit-transition: 0s;
transition: 0s;
}
.modal-wrapper.active {
opacity: 1;
pointer-events: auto;
overflow-y: scroll;
-webkit-transition-delay: 0.2s;
transition-delay: 0.2s;
}
.modal-block {
position: relative;
margin: auto;
padding-top: 80px;
padding-bottom: 50px;
display: flex;
align-items: center;
justify-content: center;
min-width: 100%;
min-height: 100%;
}
.thank-you-modal,
.modal-message,
.modal {
position: relative;
padding: 40px 56px;
background-color: #fff;
border-radius: 18px;
text-align: center;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.modal.hide {
position: absolute;
opacity: 0;
pointer-events: none;
}
.thank-you-modal,
.modal-message {
position: absolute;
opacity: 0;
pointer-events: none;
}
.thank-you-modal.active,
.modal-message.active {
position: relative;
opacity: 1;
pointer-events: auto;
}
.start-modal .modal-message,
.start-modal .modal {
width: 623px;
}
.form-modal .thank-you-modal,
.form-modal .modal {
width: 512px;
}
.start-modal .button-container {
justify-content: center;
margin-top: 32px;
}
.start-modal .text {
margin-top: 24px;
}
.modal-form {
margin-top: 16px;
}
.modal-form .input-box {
text-align: left;
margin-bottom: 8px;
}
.modal-form .input-text-error {
margin-top: 4px;
}
.modal-form .input-box:last-child {
margin-bottom: 0;
}
.modal-form .checkbox {
margin-top: 16px;
text-align: left;
}
.modal-form .checkbox-check {
border: 2px solid #0B0C0D;
}
.modal-form .checkbox-text a {
color: #0B0C0D;
}
.modal-form .button {
width: 100%;
margin-top: 24px;
}
.thank-you-modal .text {
margin-top: 6px;
opacity: 0.6;
}
.thank-you-modal .social-block {
margin-top: 24px;
justify-content: center;
}
.modal-close-icon {
position: absolute;
width: 22px;
top: -29px;
right: -29px;
opacity: 0.6;
cursor: pointer;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.modal-close-icon img,
.modal-close-icon svg {
display: block;
width: 100%;
height: auto;
}
/*--*-- Thanks window --*--*/
.thank-you-block {
position: relative;
}
.thank-you-form.hide {
position: absolute;
top: 0;
left: 0;
pointer-events: none;
opacity: 0;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.thank-you-window {
position: absolute;
top: 0;
left: 0;
opacity: 0;
pointer-events: none;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.thank-you-window.active {
position: static;
opacity: 1;
pointer-events: auto;
}
/*--*-- Map section --*--*/
.map-section {
position: relative;
padding-top: 86px;
padding-bottom: 88px;
min-height: 846px;
}
.map-section .map {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.map-section .map img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.map-settings-block {
position: relative;
z-index: 2;
width: 467px;
padding: 40px;
background: rgba(0, 0, 0, 0.6);
backdrop-filter: blur(12px);
border-radius: 36px;
}
.map-settings {
margin-top: 20px;
}
.map-setting {
margin-bottom: 8px;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.map-setting.active {
position: relative;
z-index: 5;
}
.map-setting.opacity {
opacity: 0.5;
}
.map-setting:last-child {
margin-bottom: 0;
}
.map-setting.dropdown .dropdown-button {
justify-content: space-between;
width: 100%;
padding: 16px 20px;
background-color: #fff;
border-radius: 12px;
}
.map-setting.dropdown .dropdown-button p {
font-weight: 800;
font-size: 16px;
line-height: 100%;
color: #0B0C0D;
}
.map-setting.dropdown.active .dropdown-button {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.map-setting.dropdown .dropdown-list {
bottom: auto;
height: auto;
top: 100%;
left: 0;
right: 0;
padding: 0 4px 0 20px;
background-color: #fff;
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.map-setting.dropdown .dropdown-list ul {
padding-top: 8px;
max-height: 425px;
overflow-y: auto;
}
.map-setting.dropdown .dropdown-list li {
color: #808080;
margin-bottom: 24px;
font-weight: 500;
font-size: 16px;
line-height: 150%;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.map-setting.dropdown .dropdown-list li.active {
pointer-events: none;
color: #0B0C0D;
opacity: 1;
}
.map-setting.dropdown .dropdown-list:after {
display: none;
}
.map-setting.shops-list {
position: relative;
padding-left: 6px;
padding-right: 4px;
background: #FFFFFF;
border-radius: 12px;
}
.map-setting.shops-list ul {
padding-right: 16px;
padding-top: 8px;
padding-bottom: 4px;
max-height: 364px;
overflow-y: auto;
}
.map-setting.shops-list ul.shops-list__content.no-scroll {
padding-right: 2px;
}
.map-setting.shops-list li {
width: 100%;
margin-right: 20px;
margin-bottom: 4px;
padding: 12px 14px;
border-radius: 12px;
cursor: pointer;
user-select: none;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.map-setting.shops-list .shop {
margin-bottom: 4px;
font-weight: normal;
font-size: 14px;
line-height: 100%;
color: #808080;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.map-setting.shops-list .address {
font-weight: 800;
font-size: 16px;
line-height: 150%;
color: #0B0C0D;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.map-setting.shops-list .address {
pointer-events: none;
}
.map-setting.shops-list li.active .address:hover {
color: #A9FF00;
}
.map-setting.shops-list li.active {
pointer-events: none;
background-color: #0B0C0D;
}
.map-setting.shops-list li.active .shop {
color: #FFFFFF;
opacity: 0.7;
}
.map-setting.shops-list li.active .address {
color: #FFFFFF;
pointer-events: auto;
}
.map-setting ul::-webkit-scrollbar {
width: 6px;
}
.map-setting ul::-webkit-scrollbar-track {
margin-top: 15px;
margin-bottom: 15px;
background: none;
}
.map-setting.dropdown ul::-webkit-scrollbar-track {
margin-top: 0;
margin-bottom: 15px;
}
.map-setting ul::-webkit-scrollbar-thumb {
background-color: #DADBDB;
border-radius: 20px;
}
.map-section .gm-style .gm-style-iw {
max-width: 295px !important;
padding: 0;
background: none;
box-shadow: none;
}
.map-section .gm-style .gm-style-iw-d {
width: 295px;
padding: 14px 16px;
background: #0B0C0D;
box-shadow: -14px 0px 0px #0B0C0D, -14px 9px 0px #0B0C0D, -14px -8px 0px #0B0C0D, 15px -8px 0px #0B0C0D, 15px 9px 0px #0B0C0D;
}
.gm-style-iw-d {
overflow: visible !important;
}
.gm-style-iw-d div {
overflow: visible !important;
}
.gm-style-iw-d + button {
display: none !important;
}
.map-section .gm-style .gm-style-iw-t::after {
top: -1px;
-webkit-transform: translate3d(-50%, 0, 0);
transform: translate3d(-50%, 0, 0);
width: 10px;
height: 8px;
background-color: transparent;
background-image: url("data:image/svg+xml,%0A%3Csvg width='10' height='8' viewBox='0 0 10 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 4C4 6.20914 2.20914 8 0 8H10C7.79086 8 6 6.20914 6 4C6 1.79086 7.79086 0 10 0H0C2.20914 0 4 1.79086 4 4Z' fill='%230B0C0D'/%3E%3C/svg%3E%0A");
background-position: center center;
-webkit-background-size: contain;
background-size: contain;
box-shadow: none;
}
.map-section .gm-style .gm-style-iw-t::before {
content: '';
position: absolute;
display: block;
top: 11.5px;
-webkit-transform: translate3d(-50%, 0, 0);
transform: translate3d(-50%, 0, 0);
width: 8px;
height: 8px;
-webkit-border-radius: 50%;
border-radius: 50%;
background-color: #A9FF00;
pointer-events: none;
user-select: none;
}
.map-section .gm-style .gm-style-iw-t {
bottom: 36px !important;
}
.map__name,
.map__description {
font-family: 'Manrope', sans-serif;
font-style: normal;
font-weight: 500;
font-size: 12px;
line-height: 100%;
color: #FFFFFF;
opacity: 0.7;
}
.map__description {
margin-top: 4px;
}
.map__address {
margin-top: 8px;
font-style: normal;
font-weight: 800;
font-size: 14px;
line-height: 113%;
color: #FFFFFF;
display: block;
}
.map__address:hover {
color: #A9FF00;
}
/*--*-- Error page --*--*/
.error-section {
padding: 150px 0;
min-height: 100vh;
overflow: hidden;
}
.error-content,
.error-section .container,
.error-section {
display: flex;
align-items: center;
justify-content: center;
}
.error-content {
position: relative;
flex-direction: column;
text-align: center;
z-index: 2;
}
.error-content .title {
font-family: 'Benzin', sans-serif;
font-size: 96px;
line-height: 100%;
}
.error-content .text {
margin-top: 1px;
font-family: 'Benzin', sans-serif;
font-size: 20px;
line-height: 113%;
}
.error-content .description {
max-width: 335px;
margin-top: 16px;
font-weight: 500;
font-size: 16px;
line-height: 150%;
color: #808080;
}
.error-content .button-container {
margin-top: 42px;
}
.error-cloud {
position: absolute;
object-fit: contain;
pointer-events: none;
user-select: none;
}
#error-cloud-1 {
top: -173px;
right: -192px;
width: 602px;
height: 331px;
object-fit: contain;
z-index: 3;
}
#error-cloud-2 {
top: -27px;
left: -19px;
width: 200px;
height: 165px;
z-index: -1;
}
#error-cloud-3 img {
position: absolute;
top: -213px;
right: -41px;
width: 451px;
height: 383px;
z-index: 3;
object-fit: contain;
}
/*--*-- Map page --*--*/
.map-page-title-section {
margin-top: 172px;
margin-bottom: 48px;
}
.map-page-title-section .title {
text-align: center;
}
/*--*-- Check info page --*--*/
.main-title {
padding-top: 200px;
padding-bottom: 40px;
text-align: center;
}
.main-title .title,
.main-title .text {
max-width: 900px;
margin: 0 auto;
}
.main-title .text {
margin-top: 22px;
}
.check-info-section {
padding-top: 80px;
padding-bottom: 246px;
}
.check-info-block {
display: flex;
align-items: flex-start;
justify-content: flex-start;
padding-top: 124px;
padding-bottom: 104px;
border-top: 1px solid #ECECEC;
}
.check-info-block:first-child {
padding-top: 0;
border: none;
}
.check-info-block:last-child {
padding-bottom: 0;
}
.check-block__left-box {
min-width: 400px;
width: 400px;
padding: 32px 24px 40px 40px;
background-color: #0B0C0D;
border-radius: 18px;
margin-right: 87px;
}
.check-block__left-box * {
color: #FFFFFF;
}
.check-block__left-box .subtitle {
font-weight: 800;
letter-spacing: 0.1em;
text-transform: uppercase;
}
.check-block__left-box .title {
margin-top: 24px;
}
.check-block__left-box .text p {
margin-top: 16px;
}
.check-info__list {
display: flex;
align-items: flex-start;
justify-content: flex-start;
}
.check-info__item {
display: flex;
align-items: flex-start;
justify-content: flex-start;
flex-direction: column;
width: 466px;
margin-right: 20px;
}
.check-info__item:last-child {
margin-right: 0;
}
.check-info__item .step {
padding: 6px 8px;
background-color: #0B0C0D;
border-radius: 6px;
font-weight: 800;
font-size: 14px;
line-height: 100%;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #FFFFFF;
}
.check-info__item .text p {
margin-top: 16px;
}
.check-info__item .img {
margin-top: 30px;
max-width: 100%;
}
.check-info__item .img img {
display: block;
max-width: 100%;
max-height: 336px;
}
.check-info__item .description {
width: 100%;
padding: 12px 24px;
margin-top: 24px;
background: rgba(169, 255, 0, 0.2);
border-radius: 12px;
font-weight: 500;
font-size: 15px;
line-height: 150%;
}
.check-info__item .link-list {
margin-top: 30px;
}
.check-info__item .link-list li {
margin-bottom: 10px;
}
.check-info__item .link-list li:last-child {
margin-bottom: 0;
}
.check-info__item .link-list a {
display: flex;
align-items: center;
justify-content: flex-start;
font-weight: 500;
font-size: 16px;
line-height: 150%;
}
.check-info__item .link-list a:after {
content: '';
display: block;
margin-left: 12px;
width: 12px;
height: 12px;
background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8.58586 2H3.00008V0H12.0001V9H10.0001V3.41421L1.70718 11.7071L0.292969 10.2929L8.58586 2Z' fill='%230B0C0D'/%3E%3C/svg%3E%0A");
background-repeat: no-repeat;
background-position: center center;
-webkit-background-size: contain;
background-size: contain;
-webkit-transition: 0.4s;
transition: 0.4s;
}
/*--*-- Privacy Policy page --*--*/
.policy-section {
padding-top: 128px;
padding-bottom: 180px;
}
.tabs-container {
max-width: 880px;
margin: 0 auto;
}
.tabs-block {
position: relative;
}
.tabs {
display: flex;
align-items: center;
justify-content: flex-start;
border-bottom: 1px solid rgba(11, 12, 13, 0.15);
}
.tab {
padding-bottom: 18px;
margin-right: 32px;
cursor: pointer;
user-select: none;
font-weight: 500;
font-size: 15px;
line-height: 150%;
color: #808080;
}
.tab.active {
pointer-events: none;
color: #0B0C0D;
}
.tab:last-child {
margin-right: 0;
}
.tabs-line {
position: absolute;
bottom: 0;
left: 0;
width: 236px;
height: 3px;
background-color: #A9FF00;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.items {
position: relative;
width: 100%;
margin-top: 45px;
overflow: hidden;
}
.item {
position: absolute;
top: 0;
opacity: 0;
pointer-events: none;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.item.active {
position: static;
opacity: 1;
pointer-events: auto;
}
.policy__header h1,
.policy__header h2,
.policy__header h3,
.policy__header h4,
.policy__header h5,
.policy__header h6 {
font-family: 'Benzin', sans-serif;
font-size: 28px;
line-height: 113%;
}
.policy__header p {
margin-top: 14px;
font-weight: 500;
font-size: 16px;
line-height: 150%;
}
.policy__header h1:first-child,
.policy__header h2:first-child,
.policy__header h3:first-child,
.policy__header h4:first-child,
.policy__header h5:first-child,
.policy__header h6:first-child,
.policy__header p:first-child,
.policy__editor:first-child,
.policy__editor h1:first-child,
.policy__editor h2:first-child,
.policy__editor h3:first-child,
.policy__editor h4:first-child,
.policy__editor h5:first-child,
.policy__editor h6:first-child,
.policy__editor p:first-child {
margin-top: 0;
}
.policy__editor {
margin-top: 40px;
}
.policy__editor h1,
.policy__editor h2,
.policy__editor h3,
.policy__editor h4,
.policy__editor h5,
.policy__editor h6 {
margin-top: 40px;
font-family: 'Benzin', sans-serif;
font-size: 20px;
line-height: 113%;
}
.policy__editor p {
margin-top: 16px;
}
.policy__editor ul li,
.policy__editor p {
font-weight: 500;
font-size: 16px;
line-height: 150%;
}
.policy__editor a {
font-weight: inherit;
font-size: inherit;
line-height: inherit;
letter-spacing: inherit;
color: #808080;
}
.policy__editor ul li {
position: relative;
padding-left: 30px;
}
.policy__editor ul li:before {
content: '';
position: absolute;
display: block;
top: 10px;
left: 9px;
width: 6px;
height: 6px;
background-color: #0B0C0D;
-webkit-border-radius: 50%;
border-radius: 50%;
}
.policy__editor.-certificate h1 em,
.policy__editor.-certificate h2 em,
.policy__editor.-certificate h3 em,
.policy__editor.-certificate h4 em,
.policy__editor.-certificate h5 em,
.policy__editor.-certificate h6 em {
display: block;
font-weight: 500;
font-size: 16px;
line-height: 150%;
}
.policy__editor.-certificate {
display: flex;
align-items: flex-start;
}
.policy__editor-text {
max-width: 788px;
margin-left: auto;
}
.policy__editor.-certificate .img {
display: flex;
align-items: flex-start;
justify-content: flex-start;
margin-top: 6px;
max-width: 62px;
max-height: 44px;
}
.policy__editor.-certificate .img img {
display: block;
width: auto;
height: auto;
}
.policy__editor.-certificate p strong {
display: block;
font-weight: 800;
font-size: inherit;
line-height: inherit;
letter-spacing: -0.02em;
}
/*--*-- Brand page --*--*/
.main-title-block .logo {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 50px;
}
.main-title-block .logo img {
display: block;
max-width: 250px;
max-height: 72px;
}
.main-title-block {
display: flex;
align-items: center;
justify-content: flex-start;
flex-direction: column;
}
.main-title-block .button {
margin-top: 40px;
}
.main-title-block .text {
max-width: 593px;
}
.brand-scroll-block {
padding-top: 56px;
padding-bottom: 212px;
}
.brand-scroll-block .img {
display: flex;
align-items: center;
justify-content: center;
margin-right: 20px;
width: 710px;
height: 400px;
-webkit-border-radius: 18px;
border-radius: 18px;
overflow: hidden;
background-color: #EEF0F2;
}
.brand-scroll-block .img img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
-webkit-border-radius: 18px;
border-radius: 18px;
}
.brand-scroll-block.-not-fill .img img {
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
object-fit: contain;
-webkit-border-radius: 0;
border-radius: 0;
}
.catalog-section {
padding-top: 180px;
padding-bottom: 200px;
}
.catalog-section .title-box {
margin: 0 auto;
text-align: center;
}
.catalog-section .accordion-block {
margin-top: 64px;
}
.brand-catalog .list {
display: flex;
align-items: stretch;
justify-content: flex-start;
flex-wrap: wrap;
margin-right: -20px;
}
.hide-accordion {
display: none;
}
.brand-catalog.hide-accordion .list {
margin-bottom: -64px;
}
.brand-product {
width: 345px;
margin-right: 20px;
margin-bottom: 64px;
cursor: pointer;
}
.brand-product .img {
display: flex;
align-items: flex-end;
justify-content: center;
padding: 52px 52px 88px;
width: 100%;
height: 420px;
background-color: #FFFFFF;
-webkit-border-radius: 18px;
border-radius: 18px;
-webkit-transition: transform 0.4s;
transition: transform 0.4s;
}
.brand-product .img.-fill {
align-items: center;
padding: 10px;
}
.brand-product .img img {
display: block;
max-width: 68px;
max-height: 280px;
}
.brand-product .img.-fill img {
max-width: 100%;
max-height: 100%;
}
.brand-product .name {
margin-top: 16px;
-webkit-transition: color 0.4s;
transition: color 0.4s;
}
.brand-product .description {
margin-top: 5px;
color: #808080;
}
.brand-product .description strong {
font-weight: 800;
letter-spacing: -0.01em;
font-size: inherit;
line-height: inherit;
color: #FFFFFF;
}
.brand-product .price {
margin-top: 8px;
font-weight: 800;
}
.mission-section.-brand {
padding-top: 195px;
padding-bottom: 150px;
}
.mission-section .logo {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 83px;
}
.mission-section .logo img {
max-width: 156px;
max-height: 98px;
}
.benefits-list-section {
padding-top: 120px;
padding-bottom: 180px;
}
.benefits-list {
display: flex;
align-items: stretch;
justify-content: flex-start;
flex-wrap: wrap;
margin-right: -20px;
margin-bottom: -40px;
}
.benefits-item {
display: flex;
align-items: center;
justify-content: flex-start;
flex-direction: column;
width: 466px;
margin-right: 20px;
margin-bottom: 40px;
text-align: center;
}
.benefits-item .number {
display: flex;
align-items: center;
justify-content: center;
width: 80px;
height: 80px;
-webkit-border-radius: 22px;
border-radius: 22px;
color: #FFFFFF;
}
.benefits-item .title {
margin-top: 24px;
}
.benefits-item .text {
margin-top: 8px;
color: #808080;
}
.response-section {
position: relative;
padding-top: 180px;
padding-bottom: 200px;
overflow: hidden;
}
.response-section .title-box {
max-width: 505px;
margin: 0 auto;
text-align: center;
}
.response-slider {
position: relative;
margin-top: 56px;
overflow: visible;
}
.swiper-slide {
width: 550px;
}
.slide-content {
display: flex;
justify-content: space-between;
flex-direction: column;
padding: 20px 32px;
margin: 0 10px;
height: 100%;
background-color: #5D5D61;
-webkit-border-radius: 18px;
border-radius: 18px;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.slide-content .text {
color: #0B0C0D;
}
.slide-content .user {
display: flex;
align-items: center;
justify-content: flex-start;
margin-top: 24px;
}
.slide-content .user .img {
position: relative;
width: 48px;
height: 48px;
-webkit-border-radius: 50%;
border-radius: 50%;
overflow: hidden;
opacity: 0.7;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.slide-content .user .img:after {
content: '';
position: absolute;
display: block;
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-border-radius: 50%;
border-radius: 50%;
background-color: rgba(0, 0, 0, 0.5);
-webkit-transition: 0.4s;
transition: 0.4s;
}
.slide-content .user .img img {
width: 100%;
height: 100%;
-webkit-border-radius: 50%;
border-radius: 50%;
object-fit: cover;
}
.slide-content .user .text-box {
margin-left: 12px;
}
.slide-content .user .name {
font-weight: 800;
font-size: 16px;
line-height: 150%;
color: #0B0C0D;
}
.slide-content .user .date {
margin-top: 5px;
opacity: 0.4;
font-weight: 500;
font-size: 14px;
line-height: 100%;
color: #0B0C0D;
}
.response-slider .swiper-wrapper {
align-items: stretch;
display: flex;
}
.response-slider .swiper-slide-active .slide-content {
background-color: #fff;
}
.response-slider .swiper-slide-active .user .img {
opacity: 1;
}
.response-slider .swiper-slide-active .user .img:after {
opacity: 0;
}
.response-slider .swiper-slide {
height: auto;
}
.slider__arrow {
position: absolute;
top: 0;
bottom: 0;
width: calc(50vw - 280px);
z-index: 10;
opacity: 0;
user-select: none;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.prev-response {
left: calc(-50vw + 720px);
cursor: url("../img/brand/arrow-prev.svg"), pointer;
}
.next-response {
right: calc(-50vw + 720px);
cursor: url("../img/brand/arrow-next.svg"), pointer;
}
.swiper-container-horizontal > .swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
bottom: -42px;
}
.swiper-pagination-bullet {
background-color: #808080;
opacity: 1;
-webkit-transition: 0.4s;
transition: 0.4s;
}
.swiper-pagination-bullet-active {
background-color: #fff;
}
.video-section {
padding: 180px 0;
}
.video-section .container {
display: flex;
align-items: flex-start;
justify-content: space-between;
}
.video-section .title-box {
margin-right: 20px;
}
.video-section .title-box .text {
margin-top: 22px;
}
.video-block {
display: flex;
align-items: flex-start;
justify-content: flex-start;
flex-wrap: wrap;
min-width: 953px;
width: 953px;
flex-grow: 1;
margin-right: -19px;
margin-bottom: -20px;
}
.video-box {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 298px;
height: 172px;
margin-right: 19px;
margin-bottom: 20px;
border-radius: 18px;
overflow: hidden;
cursor: pointer;
}
.video-box:before {
content: '';
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0, 0, 0, 0.3);
pointer-events: none;
}
.video-box video,
.video-box iframe,
.video-box img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 18px;
}
.play-button {
position: absolute;
display: flex;
align-items: center;
justify-content: center;
width: 48px;
height: 48px;
background-color: #A9FF00;
-webkit-border-radius: 50%;
border-radius: 50%;
}
.play-button svg {
display: block;
height: 16px;
width: auto;
margin-right: -4px;
}
.video-box:nth-child(1) {
width: 100%;
height: 536px;
}
.video-box:nth-child(1) .play-button {
width: 80px;
height: 80px;
}
.video-box:nth-child(1) .play-button svg {
height: 32px;
margin-right: -9px;
}
.video-box.active:before {
display: none;
}
.product-modal .modal {
padding-top: 32px;
text-align: left;
}
.modal-product-info * {
color: #0B0C0D;
}
.modal-product-info-block {
display: flex;
align-items: flex-start;
justify-content: space-between;
}
.modal-product-info-block > .img {
display: flex;
align-items: flex-end;
justify-content: center;
width: 300px;
height: 480px;
padding: 55px 108px;
margin-right: 25px;
}
.modal-product-info-block > .img.-fill {
align-items: center;
padding: 10px;
}
.modal-product-info-block > .img img {
display: block;
max-width: 100%;
max-height: 100%;
}
.modal-product-info {
width: 360px;
}
.modal-product-info .attention {
display: flex;
align-items: center;
justify-content: flex-start;
padding: 8px 12px;
background: rgba(169, 255, 0, 0.2);
border-radius: 12px;
}
.modal-product-info .attention:before {
content: '';
display: block;
width: 32px;
min-width: 32px;
height: 32px;
margin-right: 10px;
background-image: url("data:image/svg+xml,%3Csvg width='28' height='28' viewBox='0 0 28 28' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14 27.3332C15.7513 27.3355 17.4858 26.9916 19.1037 26.3214C20.7217 25.6512 22.1913 24.6678 23.428 23.4278C24.668 22.1911 25.6513 20.7216 26.3215 19.1036C26.9918 17.4856 27.3356 15.7511 27.3333 13.9998C27.3356 12.2486 26.9917 10.5141 26.3215 8.89613C25.6513 7.27816 24.668 5.80859 23.428 4.57185C22.1913 3.33187 20.7217 2.34851 19.1037 1.67831C17.4858 1.0081 15.7513 0.664246 14 0.666515C12.2487 0.664282 10.5143 1.00815 8.89629 1.67836C7.27832 2.34856 5.80874 3.3319 4.572 4.57185C3.33205 5.80859 2.34872 7.27816 1.67851 8.89613C1.0083 10.5141 0.664435 12.2486 0.666668 13.9998C0.664399 15.7511 1.00825 17.4856 1.67846 19.1036C2.34867 20.7216 3.33202 22.1911 4.572 23.4278C5.80874 24.6678 7.27832 25.6511 8.89629 26.3213C10.5143 26.9915 12.2487 27.3354 14 27.3332Z' fill='black'/%3E%3Cpath d='M14.766 21.4324C14.5629 21.6355 14.2873 21.7497 14 21.7497C13.7127 21.7497 13.4371 21.6355 13.234 21.4324C13.0308 21.2292 12.9167 20.9537 12.9167 20.6663C12.9167 20.379 13.0308 20.1035 13.234 19.9003C13.4371 19.6971 13.7127 19.583 14 19.583C14.2873 19.583 14.5629 19.6971 14.766 19.9003C14.9692 20.1035 15.0833 20.379 15.0833 20.6663C15.0833 20.9537 14.9692 21.2292 14.766 21.4324Z' fill='white' stroke='white' stroke-width='0.5'/%3E%3Cpath d='M13.9997 7.6665V16.1998V7.6665Z' fill='white'/%3E%3Cpath d='M13.9997 7.6665V16.1998' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
background-repeat: no-repeat;
background-position: center center;
-webkit-background-size: 27px 27px;
background-size: 27px 27px;
}
.modal-product-info .attention p {
line-height: 150%;
}
.modal-product-info .name {
margin-top: 24px;
}
.modal-product-info .price {
margin-top: 4px;
font-weight: 800;
}
.modal-product-info .description {
margin-top: 10px;
line-height: 150%;
color: #808080;
}
.tastes-list {
display: flex;
align-items: flex-start;
justify-content: flex-start;
flex-wrap: wrap;
margin-top: 16px;
margin-right: -4px;
margin-bottom: -4px;
}
.tastes-list li {
display: block;
padding: 2px 6px 4px;
margin-right: 4px;
margin-bottom: 4px;
background: #ECECEC;
border-radius: 6px;
font-weight: 500;
font-size: 12px;
line-height: 113%;
color: #808080;
}
.tastes-list .number-hide-tastes {
user-select: none;
cursor: pointer;
}
.data-list {
margin-top: 24px;
}
.data-list li {
display: flex;
align-items: flex-start;
justify-content: space-between;
margin-bottom: 8px;
}
.data-list li:last-child {
margin-bottom: 0;
}
.data-list .data-name {
max-width: 200px;
font-weight: 500;
font-size: 12px;
line-height: 113%;
}
.data-list .data {
font-weight: 800;
font-size: 12px;
line-height: 113%;
letter-spacing: -0.01em;
}
.modal-product-info .button {
margin-top: 32px;
}
#aiir-line-around-1 svg {
-webkit-transform: translate3d(-50%, -43%, 0);
transform: translate3d(-50%, -43%, 0);
}
/*--*-- Hover --*--*/
@media screen and (min-width: 1025px) {
.checkbox-text a:hover,
.header-dropdown__list.-contacts a:hover,
a:hover {
color: #A9FF00;
}
/* button */
.button:hover {
color: #808080;
}
.button.-border:hover {
border-color: #808080;
}
/* header */
.social-block a:not(.tiktok):hover path {
fill: #A9FF00;
}
.social-block a.tiktok:hover circle {
fill: #A9FF00;
}
.header-dropdown-box:hover .header-dropdown {
color: #A9FF00;
}
.header-dropdown-box:hover .header-dropdown svg {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
.header-dropdown-box:hover .header-dropdown path {
fill: #A9FF00;
}
.header-dropdown-box:hover .header-dropdown__list {
opacity: 1;
pointer-events: auto;
}
.header-dropdown-box:hover .header-dropdown__list:after {
pointer-events: auto;
}
.header-dropdown__list.-logo a:hover {
background-color: #A9FF00;
}
.header-dropdown__list.-logo a:hover img {
filter: brightness(-1000%);
}
/* brands section */
.brands-section__brands:not(.for-partner):hover .img {
-webkit-transform: scale(1.03);
transform: scale(1.03);
}
.brands-section__brands:not(.for-partner):hover .title {
color: #A9FF00;
}
/* modal */
.thank-you-modal .social-block a:not(.tiktok):hover path {
fill: #808080;
}
.thank-you-modal .social-block a.tiktok:hover circle {
fill: #808080;
}
.modal-form .checkbox-text a:hover {
color: #808080;
}
.modal-close-icon:hover {
opacity: 1;
}
/* map section */
.map-setting .dropdown-list li:hover {
color: #0B0C0D;
}
.map-setting.shops-list li:hover .address {
color: #808080;
}
/* check info page */
.check-info__item .link-list a:hover {
color: #808080;
}
.check-info__item .link-list a:hover:after {
opacity: 0;
transform: translate(5px, -5px);
}
/* policy privacy */
.tab:hover {
color: #0B0C0D;
}
.policy__editor a:hover {
color: #0B0C0D;
}
/* brand page */
.brand-product:hover .name {
color: #A9FF00;
}
.brand-product:hover .img {
-webkit-transform: scale(1.03);
transform: scale(1.03);
}
.video-box:hover .play-button path {
fill: #808080;
}
}