Jamil-Abdullayev
b8246597d4
Custom WooCommerce theme for orgsteklo.ru including: - Product catalog with category/subcategory hierarchy - Custom checkout with delivery calculation - Price calculator - Admin settings panel - Search functionality - User account pages
8847 lines
184 KiB
CSS
8847 lines
184 KiB
CSS
:root {
|
||
--White: #FFF;
|
||
--Light-Grey: #F9F9F9;
|
||
--Light-Grey-2: #F1F1F1;
|
||
--Light-Blue: #EBF0F2;
|
||
--Light-Blue-2: #E9F5FB;
|
||
--Light-Blue-3: #A5CAD8;
|
||
--Light-Grey-3: #D2D2D2;
|
||
--Grey-1: #C4C4C4;
|
||
--Light-Blue-Grey: #868D96;
|
||
--Grey-2: #808080;
|
||
--Blue: #02ADEF;
|
||
--Dark-Blue: #057EB9;
|
||
--Blue-Grey: #5C6876;
|
||
--Dark-Blue-Grey: #404F5F;
|
||
--Blue-Black: #2C3846;
|
||
--Black: #000;
|
||
--Green: #40BA69;
|
||
--Light-red: #FEE;
|
||
--Red: #F02E13;
|
||
--Dark-red: #CE1900;
|
||
--Grey: #A7A7A7;
|
||
--Light-green: #EEF5EC;
|
||
--black-blue-10: rgba(44, 56, 70, 0.10);
|
||
}
|
||
|
||
html {
|
||
font-size: calc(100vw / 1440 * 10);
|
||
}
|
||
body {
|
||
font-family: 'Open Sans';
|
||
font-weight: 400;
|
||
transition: all .2s linear !important;
|
||
min-height: 100vh;
|
||
font-size: 1.6rem;
|
||
color: var(--Black);
|
||
background: var(--Light-Grey);
|
||
}
|
||
a, h1, h2, h3, h4, h5, p, span, button, ul, li {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: transparent;
|
||
text-decoration: none;
|
||
border: none;
|
||
transition: all .2s linear;
|
||
color: var(--Color-Background-Dark);
|
||
}
|
||
input, textarea, select {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: transparent;
|
||
border: none;
|
||
outline: none;
|
||
transition: all .2s linear;
|
||
}
|
||
.container {
|
||
max-width: 136rem;
|
||
width: 100%;
|
||
padding-left: 0;
|
||
padding-right: 0;
|
||
}
|
||
div {
|
||
transition: all .2s linear;
|
||
}
|
||
path, rect, circle {
|
||
transition: all .2s linear;
|
||
}
|
||
main {
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
|
||
/* header */
|
||
|
||
h1 {
|
||
color: var(--Black);
|
||
font-size: 4.4rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 120%;
|
||
letter-spacing: -0.088rem;
|
||
text-transform: uppercase;
|
||
}
|
||
h2 {
|
||
color: var(--Black);
|
||
text-align: center;
|
||
font-size: 3.2rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
letter-spacing: -0.064rem;
|
||
text-transform: uppercase;
|
||
}
|
||
h3 {
|
||
color: var(--Black);
|
||
font-size: 2.2rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
}
|
||
h4 {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
}
|
||
h5 {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
}
|
||
|
||
header {
|
||
display: flex;
|
||
flex-direction: column;
|
||
background: var(--White);
|
||
}
|
||
.header-top {
|
||
padding: 1.2rem 0;
|
||
}
|
||
.header-top__container {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.logo {
|
||
display: flex;
|
||
width: 18.2rem;
|
||
}
|
||
.logo img {
|
||
width: 100%;
|
||
}
|
||
.header-top__row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1.6rem;
|
||
width: 100%;
|
||
max-width: 111.2rem;
|
||
justify-content: space-between;
|
||
}
|
||
.header-top nav ul:after {
|
||
content: "";
|
||
display: table;
|
||
clear: both;
|
||
}
|
||
.header-top .topmenu {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 2rem;
|
||
}
|
||
.header-top .topmenu > li {
|
||
float: left;
|
||
position: relative;
|
||
}
|
||
.header-top .topmenu li {
|
||
list-style: none;
|
||
}
|
||
.header-top .topmenu a {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.028rem;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
}
|
||
.header-top .topmenu a svg {
|
||
width: 1.2rem;
|
||
height: auto;
|
||
transition: .3s all;
|
||
}
|
||
.woocommerce ul#shipping_method .amount {
|
||
font-weight: 500;
|
||
}
|
||
.woocommerce-account .woocommerce::after, .woocommerce-account .woocommerce::before {
|
||
display: none;
|
||
}
|
||
.woocommerce-account .woocommerce-MyAccount-content {
|
||
float: left;
|
||
width: 100%;
|
||
}
|
||
.header-top .submenu {
|
||
position: absolute;
|
||
z-index: 5;
|
||
min-width: 21.9rem;
|
||
box-shadow: 8px 8px 10px 0px rgba(0, 0, 0, 0.04);
|
||
visibility: hidden;
|
||
opacity: 0;
|
||
transform-origin: 0% 0%;
|
||
transform: rotateX(-90deg);
|
||
transition: .3s linear;
|
||
background: #FFF;
|
||
border-radius: 0.4rem;
|
||
}
|
||
.header-top .submenu li {
|
||
position: relative;
|
||
}
|
||
.header-top .submenu li:first-child a {
|
||
border-radius: 0.4rem 0.4rem 0rem 0rem;
|
||
}
|
||
.header-top .submenu li:last-child a {
|
||
border-radius: 0rem 0rem 0.4rem 0.4rem;
|
||
}
|
||
.header-top .submenu li a {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.028rem;
|
||
padding: 1.4rem 1.6rem;
|
||
background: var(--White);
|
||
}
|
||
.header-top .submenu li a.active {
|
||
background: var(--Light-Grey);
|
||
color: var(--Blue);
|
||
}
|
||
.header-top .submenu li a:hover {
|
||
color: var(--Blue);
|
||
}
|
||
.header-top .topmenu a:hover, .header-top .topmenu a.active {
|
||
color: var(--Blue);
|
||
}
|
||
.header-top .submenu .submenu {
|
||
position: absolute;
|
||
left: 100%;
|
||
top: -1px;
|
||
transition: .3s linear;
|
||
}
|
||
.header-top nav li:hover > .submenu {
|
||
transform: rotateX(0deg);
|
||
visibility: visible;
|
||
opacity: 1;
|
||
}
|
||
.header-top nav li:hover a svg {
|
||
transform: rotate(180deg);
|
||
}
|
||
.header-contacts {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 2rem;
|
||
}
|
||
.header-contacts a {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.header-contacts a svg {
|
||
width: 1.2rem;
|
||
height: auto;
|
||
}
|
||
.header-contacts a:hover {
|
||
color: var(--Blue);
|
||
}
|
||
.header-contacts a:hover svg path {
|
||
stroke: var(--Blue);
|
||
}
|
||
.header-bottom {
|
||
background: var(--Dark-Blue-Grey);
|
||
}
|
||
.header-bottom__container {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.header-bottom__row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 2rem;
|
||
width: 100%;
|
||
max-width: 113.1rem;
|
||
}
|
||
.header-catalog__button {
|
||
display: flex;
|
||
width: 25.9rem;
|
||
min-width: 25.9rem;
|
||
height: 6.4rem;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
background: var(--Blue);
|
||
padding: 1.2rem 1.6rem;
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 110%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.header-catalog__button-icon {
|
||
width: 2.4rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.5rem;
|
||
padding: 0.4rem;
|
||
}
|
||
.header-catalog__button-icon .bar {
|
||
width: 100%;
|
||
height: 0.1rem;
|
||
background: var(--White);
|
||
}
|
||
.header-search {
|
||
width: 100%;
|
||
position: relative;
|
||
}
|
||
.header-search input {
|
||
width: 100%;
|
||
border-radius: 0.6rem;
|
||
background: var(--Blue-Grey);
|
||
color: var(--White);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
padding: 0.4rem 10.4rem 0.4rem 2rem;
|
||
height: 4.8rem;
|
||
}
|
||
.header-search input::placeholder {
|
||
color: var(--White);
|
||
}
|
||
.header-search__submit {
|
||
position: absolute;
|
||
z-index: 2;
|
||
right: 0.4rem;
|
||
display: flex;
|
||
padding: 1.3rem 2rem;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
top: 0.4rem;
|
||
color: var(--White);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.header-search__submit svg {
|
||
width: 1.4rem;
|
||
height: auto;
|
||
}
|
||
.header-search__submit:hover {
|
||
background: var(--Dark-Blue);
|
||
}
|
||
.header-bottom__buttons {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 2.4rem;
|
||
}
|
||
.header-cart {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
color: var(--White);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 110%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.header-cart__icon {
|
||
position: relative;
|
||
}
|
||
.header-cart__icon svg {
|
||
width: 3.2rem;
|
||
height: auto;
|
||
}
|
||
.header-cart__icon span {
|
||
position: absolute;
|
||
z-index: 2;
|
||
top: 0;
|
||
right: 0;
|
||
padding: 0.5rem 0.4rem 0.4rem 0.4rem;
|
||
border-radius: 10rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
text-align: center;
|
||
font-size: 1rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 0.7rem;
|
||
letter-spacing: -0.04rem;
|
||
}
|
||
.header-cart:hover {
|
||
color: var(--Light-Blue-3);
|
||
}
|
||
.header-cart:hover .header-cart__icon svg path {
|
||
stroke: var(--Light-Blue-3);
|
||
}
|
||
.header-login {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
color: var(--White);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 110%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.header-login svg {
|
||
width: 3.2rem;
|
||
height: auto;
|
||
}
|
||
.header-top__mob {
|
||
display: none;
|
||
}
|
||
.header-login:hover {
|
||
color: var(--Light-Blue-3);
|
||
}
|
||
.header-login:hover svg path {
|
||
stroke: var(--Light-Blue-3);
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
html {
|
||
font-size: calc(100vw / 360 * 10);
|
||
}
|
||
.container {
|
||
max-width: 34rem;
|
||
}
|
||
h1 {
|
||
font-size: 2.4rem;
|
||
letter-spacing: -0.048rem;
|
||
}
|
||
h2 {
|
||
font-size: 2.4rem;
|
||
letter-spacing: -0.048rem;
|
||
}
|
||
h3 {
|
||
font-size: 2rem;
|
||
}
|
||
h4 {
|
||
font-size: 1.6rem;
|
||
}
|
||
h5 {
|
||
font-size: 1.2rem;
|
||
}
|
||
header {
|
||
background: transparent;
|
||
}
|
||
.header-top__row {
|
||
display: none;
|
||
}
|
||
.header-top__mob {
|
||
display: flex;
|
||
gap: 0.4rem;
|
||
}
|
||
.header-top__mob a, .header-top__mob button {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
position: relative;
|
||
border-radius: 0.4rem;
|
||
background: var(--White);
|
||
width: 3.2rem;
|
||
height: 3.2rem;
|
||
}
|
||
.header-top__mob a svg, .header-top__mob button svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.header-top__mob a span, .header-top__mob button span {
|
||
padding: 0.2rem 0.4rem;
|
||
border-radius: 10rem;
|
||
background: var(--Blue);
|
||
position: absolute;
|
||
right: 0.2rem;
|
||
top: 0.2rem;
|
||
color: var(--White);
|
||
text-align: center;
|
||
font-size: 0.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.header-top {
|
||
padding: 1rem 0;
|
||
}
|
||
.logo {
|
||
width: 10.4rem;
|
||
}
|
||
.header-bottom {
|
||
background: transparent;
|
||
}
|
||
.header-catalog__button p {
|
||
display: none;
|
||
}
|
||
.header-catalog__button {
|
||
width: 4rem;
|
||
min-width: 4rem;
|
||
height: 4rem;
|
||
padding: 1.3rem 1.2rem;
|
||
border-radius: 0.4rem;
|
||
}
|
||
.header-catalog__button-icon {
|
||
width: 1.6rem;
|
||
gap: 0.5rem;
|
||
padding: 0;
|
||
}
|
||
.header-bottom__buttons {
|
||
display: none;
|
||
}
|
||
.header-bottom__row {
|
||
gap: 1rem;
|
||
}
|
||
.header-search__submit p {
|
||
display: none;
|
||
}
|
||
.header-search input {
|
||
background: var(--White);
|
||
border-radius: 0.4rem;
|
||
padding: 0.4rem 3.6rem 0.4rem 1.6rem;
|
||
height: 4rem;
|
||
}
|
||
.header-search input::placeholder {
|
||
color: var(--Grey-2);
|
||
}
|
||
.header-search__submit {
|
||
padding: 0.9rem;
|
||
}
|
||
}
|
||
|
||
/* banner */
|
||
|
||
.banner {
|
||
margin-bottom: 14.4rem;
|
||
margin-top: 1.6rem;
|
||
}
|
||
.banner-container {
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
}
|
||
.banner-main {
|
||
width: 100%;
|
||
max-width: 108.5rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.banner-slider {
|
||
display: flex;
|
||
position: relative;
|
||
align-items: center;
|
||
}
|
||
.banner-swiper {
|
||
width: 100%;
|
||
height: 42.4rem;
|
||
}
|
||
.banner-swiper .swiper-slide {
|
||
height: auto;
|
||
}
|
||
.banner-slide {
|
||
position: relative;
|
||
height: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 2.4rem;
|
||
padding: 2rem 12rem;
|
||
justify-content: center;
|
||
}
|
||
.banner-slide::before {
|
||
content: '';
|
||
border-radius: 0.6rem;
|
||
background: linear-gradient(0deg, rgba(0, 0, 0, 0.50) 0%, rgba(0, 0, 0, 0.50) 100%);
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
z-index: 2;
|
||
}
|
||
.banner-slide__img {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
border-radius: 0.6rem;
|
||
object-fit: cover;
|
||
}
|
||
.banner-slide h4 {
|
||
position: relative;
|
||
z-index: 3;
|
||
color: #FFC502;
|
||
}
|
||
.banner-slide h2 {
|
||
position: relative;
|
||
z-index: 3;
|
||
color: var(--White);
|
||
max-width: 49.6rem;
|
||
margin-bottom: 1.6rem;
|
||
text-align: left;
|
||
}
|
||
.banner-slide__link {
|
||
position: relative;
|
||
z-index: 3;
|
||
display: flex;
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
justify-content: center;
|
||
align-items: flex-end;
|
||
gap: 0.6rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.banner-slide__link svg {
|
||
width: 1.8rem;
|
||
height: auto;
|
||
}
|
||
.banner-prev {
|
||
display: flex;
|
||
position: absolute;
|
||
left: 0;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
z-index: 9;
|
||
border-radius: 0 0.4rem 0.4rem 0;
|
||
background: rgba(255, 255, 255, 0.20);
|
||
}
|
||
.banner-next {
|
||
display: flex;
|
||
position: absolute;
|
||
right: 0;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
z-index: 9;
|
||
border-radius: 0.4rem 0rem 0rem 0.4rem;
|
||
background: rgba(255, 255, 255, 0.20);
|
||
}
|
||
.banner-prev svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.banner-next svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.banner-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(4, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.banner-item {
|
||
display: flex;
|
||
padding: 2.4rem;
|
||
align-items: center;
|
||
gap: 1.6rem;
|
||
border-radius: 0.6rem;
|
||
background: var(--White);
|
||
}
|
||
.banner-item img {
|
||
width: 3.2rem;
|
||
min-width: 3.2rem;
|
||
}
|
||
.banner-item p {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.banner {
|
||
margin-bottom: 9.6rem;
|
||
margin-top: 1rem;
|
||
}
|
||
.banner-main {
|
||
gap: 1rem;
|
||
}
|
||
.banner-slide {
|
||
padding: 2rem 1.6rem;
|
||
}
|
||
.banner-prev {
|
||
display: none;
|
||
}
|
||
.banner-next {
|
||
display: none;
|
||
}
|
||
.banner-grid {
|
||
display: flex;
|
||
gap: 1rem;
|
||
min-width: 100vw;
|
||
overflow-x: auto;
|
||
margin-left: -1rem;
|
||
padding: 0 1rem 1rem 1rem;
|
||
}
|
||
.banner-item {
|
||
padding: 1.6rem;
|
||
gap: 1rem;
|
||
width: 22.3rem;
|
||
min-width: 22.3rem;
|
||
}
|
||
.banner-item img {
|
||
width: 2.4rem;
|
||
min-width: 2.4rem;
|
||
}
|
||
.banner-item p {
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
}
|
||
|
||
/* categories */
|
||
|
||
.categories {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.categories-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.categories-main {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.categories-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(3, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.categories-item {
|
||
background: var(--White);
|
||
border-radius: 0.6rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
.categories-item__img {
|
||
display: flex;
|
||
height: 24rem;
|
||
}
|
||
.categories-item__img img {
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: cover;
|
||
}
|
||
.categories-item__main {
|
||
padding: 3.2rem 2.4rem;
|
||
}
|
||
.categories-item__title {
|
||
color: var(--Black);
|
||
font-size: 2.2rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
}
|
||
.categories-item__title svg {
|
||
width: 2.4rem;
|
||
height: auto;
|
||
transition: .3s all;
|
||
opacity: 0;
|
||
}
|
||
.categories-item.hidden {
|
||
display: none;
|
||
}
|
||
.categories-more {
|
||
display: flex;
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
margin: 0 auto;
|
||
}
|
||
.categories-more svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.categories-item:hover .categories-item__title {
|
||
color: var(--Blue);
|
||
}
|
||
.categories-item:hover svg {
|
||
opacity: 1;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.categories {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.categories-container {
|
||
gap: 4rem;
|
||
}
|
||
.categories-main {
|
||
gap: 4rem;
|
||
}
|
||
.categories-grid {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
gap: 1rem;
|
||
}
|
||
.categories-item {
|
||
border-radius: 0.4rem;
|
||
}
|
||
.categories-item__img {
|
||
height: 14.4rem;
|
||
}
|
||
.categories-item__main {
|
||
padding: 2.4rem 1.6rem;
|
||
}
|
||
.categories-item__title {
|
||
font-size: 1.6rem;
|
||
}
|
||
.categories-more {
|
||
padding: 1.3rem 2rem;
|
||
gap: 0.6rem;
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.categories-more svg {
|
||
width: 1.4rem;
|
||
}
|
||
}
|
||
|
||
/* products */
|
||
|
||
.products {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.products-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.products-slider {
|
||
display: flex;
|
||
align-items: center;
|
||
position: relative;
|
||
}
|
||
.products-swiper {
|
||
width: 100%;
|
||
}
|
||
.products-swiper .swiper-slide {
|
||
height: auto;
|
||
}
|
||
.products-swiper .swiper-slide .product_item {
|
||
height: 100%;
|
||
}
|
||
.product_item {
|
||
display: flex;
|
||
flex-direction: column;
|
||
background: var(--White);
|
||
border-radius: 0.6rem;
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
.product_item-img {
|
||
position: relative;
|
||
height: 28rem;
|
||
min-height: 28rem;
|
||
}
|
||
.product_item-img__link {
|
||
display: flex;
|
||
height: 100%;
|
||
}
|
||
.product_item-img__link img {
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: cover;
|
||
}
|
||
.product_item-labels {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.6rem;
|
||
position: absolute;
|
||
z-index: 2;
|
||
left: 1.2rem;
|
||
top: 1.2rem;
|
||
}
|
||
.product_item-popular {
|
||
padding: 0.8rem 1.2rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Green);
|
||
color: var(--White);
|
||
text-align: center;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
/* Метка скидки для списка товаров - красная */
|
||
.product_item-discount {
|
||
padding: 0.8rem 1.2rem;
|
||
border-radius: 0.4rem;
|
||
background: #EF4444;
|
||
color: var(--White);
|
||
text-align: center;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.product_item-sale {
|
||
padding: 0.8rem 1.2rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Red);
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.2rem;
|
||
}
|
||
.product_item-sale svg {
|
||
width: 1.2rem;
|
||
height: auto;
|
||
}
|
||
.product_item-sale p {
|
||
color: var(--White);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.product_item-main {
|
||
height: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
padding: 2.4rem;
|
||
gap: 1.6rem;
|
||
}
|
||
.product_item-title {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
/* Минимальная высота: 3 строки, но показываем весь текст */
|
||
min-height: 7.02rem;
|
||
}
|
||
.product_item-chars {
|
||
display: flex;
|
||
flex-direction: column;
|
||
padding-left: 2.5rem;
|
||
/* Фиксируем высоту: 2 строки характеристик */
|
||
min-height: 7.92rem;
|
||
}
|
||
.product_item-chars li {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.product_item-meta {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.8rem;
|
||
/* Прижимаем цены + кнопку к низу карточки (работает и без характеристик) */
|
||
margin-top: auto;
|
||
}
|
||
.product_item-prices {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
}
|
||
.product_item-price {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
}
|
||
.product_item-oldprice {
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: normal;
|
||
text-decoration-line: line-through;
|
||
}
|
||
.product_item-price_weight {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
}
|
||
.product_item-price_weight-new {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.product_item-price_weight-old {
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
text-decoration-line: line-through;
|
||
}
|
||
.product_item-link {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
text-align: center;
|
||
}
|
||
.products-prev {
|
||
position: absolute;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0 0.4rem 0.4rem 0;
|
||
background: var(--Dark-Blue-Grey);
|
||
z-index: 9;
|
||
left: 0;
|
||
}
|
||
.products-prev svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.products-next {
|
||
position: absolute;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0.4rem 0 0 0.4rem;
|
||
background: var(--Dark-Blue-Grey);
|
||
z-index: 9;
|
||
right: 0;
|
||
}
|
||
.products-next svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.products-mob {
|
||
display: none;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.products-mob {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 1rem;
|
||
}
|
||
.products {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.products-container {
|
||
gap: 4rem;
|
||
}
|
||
.products-slider {
|
||
display: none;
|
||
}
|
||
.product_item-img {
|
||
height: 16rem;
|
||
min-height: 16rem;
|
||
}
|
||
.product_item-labels {
|
||
left: 0.8rem;
|
||
top: 0.8rem;
|
||
}
|
||
.product_item-popular {
|
||
padding: 0.6rem 0.8rem;
|
||
font-size: 0.8rem;
|
||
letter-spacing: -0.016rem;
|
||
}
|
||
.product_item-discount {
|
||
padding: 0.6rem 0.8rem;
|
||
font-size: 0.8rem;
|
||
letter-spacing: -0.016rem;
|
||
}
|
||
.product_item-sale {
|
||
padding: 0.6rem 0.8rem;
|
||
}
|
||
.product_item-sale svg {
|
||
width: 0.8rem;
|
||
}
|
||
.product_item-sale p {
|
||
font-size: 0.8rem;
|
||
letter-spacing: -0.016rem;
|
||
}
|
||
.product_item-main {
|
||
padding: 1.6rem;
|
||
gap: 0.8rem;
|
||
}
|
||
.product_item-title {
|
||
font-size: 1.1rem;
|
||
}
|
||
.product_item-chars {
|
||
padding-left: 2rem;
|
||
}
|
||
.product_item-chars li {
|
||
font-size: 0.8rem;
|
||
letter-spacing: -0.016rem;
|
||
}
|
||
.product_item-meta {
|
||
gap: 0.6rem;
|
||
margin: 0.8rem 0 1.2rem 0;
|
||
}
|
||
.product_item-prices {
|
||
gap: 0.4rem;
|
||
}
|
||
.product_item-price {
|
||
font-size: 1rem;
|
||
}
|
||
.product_item-oldprice {
|
||
font-size: 0.8rem;
|
||
}
|
||
.product_item-price_weight {
|
||
gap: 0.4rem;
|
||
}
|
||
.product_item-price_weight-new {
|
||
font-size: 1rem;
|
||
letter-spacing: -0.02rem;
|
||
}
|
||
.product_item-price_weight-old {
|
||
font-size: 0.8rem;
|
||
}
|
||
.product_item-link {
|
||
padding: 1.2rem 1.7rem;
|
||
font-size: 1rem;
|
||
letter-spacing: -0.02rem;
|
||
}
|
||
}
|
||
|
||
/* about */
|
||
|
||
.about {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.about-container {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.about-container > img {
|
||
width: 100%;
|
||
border-radius: 0.6rem;
|
||
object-fit: cover;
|
||
}
|
||
.about-main {
|
||
display: flex;
|
||
flex-direction: column;
|
||
padding: 4rem;
|
||
align-items: flex-start;
|
||
border-radius: 0.6rem;
|
||
justify-content: center;
|
||
background: var(--White);
|
||
gap: 1.6rem;
|
||
}
|
||
.about-main h2 {
|
||
margin-bottom: 1.6rem;
|
||
}
|
||
.about-subtitle {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
}
|
||
.about-description {
|
||
margin-bottom: 1.6rem;
|
||
color: var(--Grey-2);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.link-more {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 0.6rem;
|
||
color: var(--Blue);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.link-more svg {
|
||
width: 2rem;
|
||
height: auto;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.about {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.about-container {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
gap: 1rem;
|
||
}
|
||
.about-container > img {
|
||
height: 34rem;
|
||
order: 2;
|
||
}
|
||
.about-main {
|
||
padding: 4rem 1.6rem;
|
||
}
|
||
.about-main h2 {
|
||
margin-bottom: 0.8rem;
|
||
}
|
||
.about-subtitle {
|
||
font-size: 1.4rem;
|
||
}
|
||
.about-description {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.link-more {
|
||
gap: 0.4rem;
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.link-more svg {
|
||
width: 1.6rem;
|
||
}
|
||
}
|
||
|
||
/* header */
|
||
|
||
.why {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.why-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.why-main {
|
||
display: grid;
|
||
grid-template-columns: repeat(3, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.why-item {
|
||
padding: 2.4rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1.6rem;
|
||
border-radius: 0.6rem;
|
||
background: var(--Dark-Blue-Grey);
|
||
}
|
||
.why-item h3 {
|
||
color: var(--White);
|
||
font-size: 2.2rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
}
|
||
.why-item p {
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.why {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.why-container {
|
||
gap: 4rem;
|
||
}
|
||
.why-main {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
gap: 1rem;
|
||
}
|
||
.why-item {
|
||
padding: 1.6rem;
|
||
gap: 1.2rem;
|
||
}
|
||
.why-item h3 {
|
||
font-size: 2rem;
|
||
}
|
||
.why-item p {
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
}
|
||
|
||
/* info */
|
||
|
||
.info {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.info-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.info-main {
|
||
display: grid;
|
||
grid-template-columns: repeat(3, 1fr);
|
||
gap: 2rem;
|
||
}
|
||
.info-item {
|
||
border-radius: 0.6rem;
|
||
background: var(--White);
|
||
display: flex;
|
||
padding: 2.4rem;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1.6rem;
|
||
}
|
||
.info-item img {
|
||
height: 4.8rem;
|
||
margin-bottom: 2.4rem;
|
||
}
|
||
.info-item h3 {
|
||
color: var(--Black);
|
||
font-size: 2.2rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
}
|
||
.info-item p {
|
||
margin-bottom: 4.8rem;
|
||
color: var(--Grey-2);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.info {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.info-container {
|
||
gap: 4rem;
|
||
}
|
||
.info-main {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
gap: 1rem;
|
||
}
|
||
.info-item {
|
||
padding: 3.2rem 1.6rem;
|
||
}
|
||
.info-item img {
|
||
margin-bottom: 0.4rem;
|
||
}
|
||
.info-item h3 {
|
||
font-size: 1.6rem;
|
||
}
|
||
.info-item p {
|
||
margin-bottom: 1.6rem;
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
}
|
||
|
||
/* consult */
|
||
|
||
.consult {
|
||
margin-bottom: 6.4rem;
|
||
}
|
||
.consult h2 {
|
||
text-align: left;
|
||
}
|
||
.consult-main {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 1.6rem;
|
||
padding: 6.4rem;
|
||
border-radius: 0.8rem;
|
||
background: var(--Light-Blue);
|
||
}
|
||
.consult-name {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 2.4rem;
|
||
}
|
||
.consult-name p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.consult-form {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.6rem;
|
||
}
|
||
.consult-form input[type="text"], .consult-form input[type="tel"], .consult-form input[type="email"] {
|
||
padding: 1.9rem 0.4rem 1.9rem 2rem;
|
||
border-radius: 0.6rem;
|
||
background: var(--White);
|
||
color: var(--Blue);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
width: 100%;
|
||
border: 1px solid transparent;
|
||
}
|
||
.consult-form input[type="text"]::placeholder, .consult-form input[type="tel"]::placeholder, .consult-form input[type="email"]::placeholder {
|
||
color: var(--Grey-2);
|
||
}
|
||
.consult-form__row {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 0.6rem;
|
||
}
|
||
.consult-checkbox {
|
||
margin: 1rem 0;
|
||
display: flex;
|
||
align-items: center;
|
||
position: relative;
|
||
}
|
||
.consult-checkbox label {
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 140%;
|
||
letter-spacing: -0.024rem;
|
||
cursor: pointer;
|
||
padding-left: 2.2rem;
|
||
}
|
||
.consult-checkbox label a {
|
||
text-decoration: underline;
|
||
color: var(--Grey-2);
|
||
}
|
||
.consult-checkbox input[type=checkbox]:before {
|
||
content: "";
|
||
display: inline-block;
|
||
width: 1.6rem;
|
||
height: 1.6rem;
|
||
border-radius: 0.2rem;
|
||
border: 0.1rem solid var(--Blue);
|
||
position: absolute;
|
||
margin-top: -0.8rem;
|
||
background-color: var(--White);
|
||
cursor: pointer;
|
||
}
|
||
.consult-checkbox input[type=checkbox]:checked:before {
|
||
background:transparent;
|
||
background-image: url('/wp-content/uploads/2025/05/chek.svg');
|
||
background-repeat: no-repeat;
|
||
background-position: center;
|
||
position: absolute;
|
||
background-size: cover;
|
||
}
|
||
.consult-checkbox input[type="checkbox"] {
|
||
-webkit-appearance: none;
|
||
-moz-appearance: none;
|
||
appearance: none;
|
||
background: none;
|
||
}
|
||
.consult-checkbox input[type="checkbox"] {
|
||
-webkit-appearance: none;
|
||
-moz-appearance: none;
|
||
appearance: none;
|
||
background-image: none;
|
||
}
|
||
.consult-checkbox input[type="checkbox"]:checked {
|
||
background-image: none;
|
||
}
|
||
.consult-submit {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
margin-right: auto;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.consult {
|
||
margin-bottom: 4.8rem;
|
||
}
|
||
.consult-main {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
gap: 2.4rem;
|
||
padding: 4rem 2.4rem;
|
||
}
|
||
.consult-name {
|
||
gap: 1.6rem;
|
||
}
|
||
.consult-name p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
max-width: 21rem;
|
||
}
|
||
.consult-form input[type="text"], .consult-form input[type="tel"], .consult-form input[type="email"] {
|
||
padding: 1.6rem 1.8rem;
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.consult-form__row {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
}
|
||
.consult-submit {
|
||
width: 100%;
|
||
}
|
||
}
|
||
|
||
/* footer */
|
||
|
||
footer {
|
||
background: var(--Blue-Black);
|
||
padding: 6.4rem 0 4rem 0;
|
||
}
|
||
.footer-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4.8rem;
|
||
}
|
||
.footer-main {
|
||
display: grid;
|
||
grid-template-columns: repeat(5, 1fr);
|
||
gap: 1.6rem;
|
||
align-items: flex-start;
|
||
}
|
||
.footer-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 3.2rem;
|
||
align-items: flex-start;
|
||
}
|
||
.footer-logo {
|
||
display: flex;
|
||
width: 18.2rem;
|
||
}
|
||
.footer-logo img {
|
||
width: 100%;
|
||
}
|
||
.footer-address {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 0.6rem;
|
||
}
|
||
.footer-address svg {
|
||
width: 1.6rem;
|
||
min-width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.footer-address p, .footer-address a {
|
||
color: var(--Light-Blue-Grey);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.028rem;
|
||
max-width: 16.2rem;
|
||
}
|
||
.footer-menu {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2rem;
|
||
align-items: flex-start;
|
||
}
|
||
.footer-menu__title {
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.footer-menu ul {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
align-items: flex-start;
|
||
}
|
||
.footer-menu ul li {
|
||
display: flex;
|
||
list-style: none;
|
||
}
|
||
.footer-menu ul li a {
|
||
color: var(--Light-Blue-Grey);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.footer-contacts {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 3.2rem;
|
||
align-items: flex-start;
|
||
}
|
||
.footer-contacts__col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2.4rem;
|
||
align-items: flex-start;
|
||
}
|
||
.footer-contacts__item {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.8rem;
|
||
}
|
||
.footer-contacts__item a {
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.footer-contacts__item p {
|
||
color: var(--Blue-Grey);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.footer-contacts__payment {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
align-items: flex-start;
|
||
}
|
||
.footer-contacts__payment p {
|
||
color: var(--Light-Blue-Grey);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%; /* 1.44rem */
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.footer-contacts__payment-row {
|
||
display: flex;
|
||
max-width: 12.2rem;
|
||
align-items: center;
|
||
align-content: center;
|
||
gap: 1.6rem 0.8rem;
|
||
flex-wrap: wrap;
|
||
}
|
||
.footer-contacts__payment-row img {
|
||
max-width: 100%;
|
||
}
|
||
.footer-contacts__payment-row img:nth-child(1) {
|
||
width: 5.6rem;
|
||
}
|
||
.footer-contacts__payment-row img:nth-child(2) {
|
||
width: 4.8rem;
|
||
}
|
||
.footer-contacts__payment-row img:nth-child(3) {
|
||
width: 4rem;
|
||
}
|
||
.footer-button {
|
||
display: flex;
|
||
}
|
||
.footer-callback {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.footer-copyright {
|
||
display: flex;
|
||
align-items: center;
|
||
padding-top: 1.7rem;
|
||
gap: 1.6rem;
|
||
border-top: 1px solid var(--Dark-Blue-Grey);
|
||
}
|
||
.footer-copyright > p {
|
||
width: 100%;
|
||
max-width: 53.4rem;
|
||
color: var(--Blue-Grey);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.footer-copyright > a {
|
||
width: 100%;
|
||
max-width: 25.9rem;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
color: var(--White);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.footer-copyright > a img {
|
||
width: 5.6rem;
|
||
}
|
||
.footer-copyright__row {
|
||
width: 100%;
|
||
max-width: 52rem;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1.6rem;
|
||
}
|
||
.footer-copyright__row a {
|
||
color: var(--Blue-Grey);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
width: 100%;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
footer {
|
||
padding: 4rem 0;
|
||
}
|
||
.footer-container {
|
||
gap: 4rem;
|
||
}
|
||
.footer-main {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 4rem 1rem;
|
||
}
|
||
.footer-col {
|
||
width: 100%;
|
||
gap: 1.6rem;
|
||
}
|
||
.footer-logo {
|
||
width: 14.3rem;
|
||
}
|
||
.footer-address {
|
||
align-items: center;
|
||
}
|
||
.footer-address svg {
|
||
width: 1.6rem;
|
||
min-width: 1.6rem;
|
||
}
|
||
.footer-address p, .footer-address a {
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
max-width: none;
|
||
}
|
||
.footer-menu {
|
||
gap: 1.6rem;
|
||
width: 100%;
|
||
max-width: calc(50% - 1rem);
|
||
}
|
||
.footer-menu__title {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.footer-menu ul {
|
||
gap: 1.2rem;
|
||
}
|
||
.footer-menu ul li a {
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.footer-contacts {
|
||
width: 100%;
|
||
}
|
||
.footer-contacts__payment-row {
|
||
max-width: none;
|
||
gap: 0.8rem;
|
||
}
|
||
.footer-copyright {
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
}
|
||
.footer-copyright > p {
|
||
width: auto;
|
||
max-width: none;
|
||
}
|
||
.footer-copyright > a {
|
||
width: auto;
|
||
max-width: none;
|
||
justify-content: flex-start;
|
||
}
|
||
.footer-copyright__row {
|
||
width: auto;
|
||
max-width: none;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
}
|
||
.footer-copyright__row a {
|
||
width: auto;
|
||
}
|
||
}
|
||
|
||
/* breadcumbs */
|
||
|
||
.breadcumbs {
|
||
margin-top: 4.8rem;
|
||
margin-bottom: 6.4rem;
|
||
}
|
||
.breadcumbs ul {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
}
|
||
.breadcumbs ul li {
|
||
display: flex;
|
||
list-style: none;
|
||
}
|
||
.breadcumbs ul li a {
|
||
color: var(--Blue);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 120%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.breadcumbs ul li p {
|
||
color: var(--Grey-1);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 120%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.breadcumbs ul li p.breadcumbs-separator {
|
||
color: var(--Blue);
|
||
}
|
||
.categories_page h2 {
|
||
text-align: left;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.breadcumbs {
|
||
margin-top: 3.2rem;
|
||
margin-bottom: 4.8rem;
|
||
}
|
||
.breadcumbs ul li a {
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.breadcumbs ul li p {
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
}
|
||
|
||
/* catalog_page */
|
||
|
||
.catalog_page {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.catalog_page-container {
|
||
display: flex;
|
||
gap: 1.6rem;
|
||
align-items: flex-start;
|
||
}
|
||
.catalog_page-menu {
|
||
width: 100%;
|
||
max-width: 32.8rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.catalog_page-menu__col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
.catalog_page-menu__item {
|
||
display: flex;
|
||
flex-direction: column;
|
||
border-bottom: 1px solid var(--Light-Grey);
|
||
background: var(--White);
|
||
}
|
||
.catalog_page-menu__item-button {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
padding: 1.2rem;
|
||
}
|
||
.catalog_page-menu__item-button__img {
|
||
width: 3.6rem;
|
||
min-width: 3.6rem;
|
||
}
|
||
.catalog_page-menu__item-button__img img {
|
||
width: 100%;
|
||
}
|
||
.catalog_page-menu__item-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
justify-content: space-between;
|
||
width: 100%;
|
||
}
|
||
.catalog_page-menu__item-row a {
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.catalog_page-menu__item-button__icon {
|
||
display: flex;
|
||
}
|
||
.catalog_page-menu__item-button__icon svg {
|
||
width: 1.2rem;
|
||
height: auto;
|
||
transition: .3s all;
|
||
}
|
||
.catalog_page-menu__item-content {
|
||
position: relative;
|
||
max-height: 0;
|
||
overflow: hidden;
|
||
padding: 0 1.2rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.8rem;
|
||
transition: .3s all;
|
||
}
|
||
.catalog_page-menu__item-content-item {
|
||
padding-left: 4.8rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
.catalog_page-menu__item-content-item-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
justify-content: space-between;
|
||
}
|
||
.catalog_page-menu__item-content-item-row a {
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.catalog_page-menu__item-content-item-icon {
|
||
display: flex;
|
||
}
|
||
.catalog_page-menu__item-content-item-icon svg {
|
||
width: 1.2rem;
|
||
height: auto;
|
||
transition: .3s all;
|
||
}
|
||
.catalog_page-menu__item-content-item-content {
|
||
position: relative;
|
||
max-height: 0;
|
||
overflow: hidden;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1.2rem;
|
||
padding-left: 0.8rem;
|
||
}
|
||
.catalog_page-menu__item-content-item-content a {
|
||
color: var(--Light-Blue-Grey);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.catalog_page-menu__item.active .catalog_page-menu__item-content {
|
||
overflow: visible;
|
||
max-height: 100% !important;
|
||
margin-bottom: 2rem;
|
||
}
|
||
.catalog_page-menu__item-content-item.active .catalog_page-menu__item-content-item-content {
|
||
margin-top: 1.2rem;
|
||
}
|
||
.catalog_page-menu__item.active .catalog_page-menu__item-button__icon svg {
|
||
transform: rotate(180deg);
|
||
}
|
||
.catalog_page-menu__item.active .catalog_page-menu__item-button__icon svg path {
|
||
fill: var(--Blue);
|
||
}
|
||
.catalog_page-menu__item.active .catalog_page-menu__item-row a {
|
||
color: var(--Blue);
|
||
}
|
||
.catalog_page-menu__item-content-item.active .catalog_page-menu__item-content-item-icon svg {
|
||
transform: rotate(180deg);
|
||
}
|
||
.catalog_page-menu__item-content-item.active .catalog_page-menu__item-content-item-icon svg path {
|
||
fill: var(--Blue);
|
||
}
|
||
.catalog_page-menu__item-content-item.active .catalog_page-menu__item-content-item-row a {
|
||
color: var(--Blue);
|
||
}
|
||
.catalog_page-menu__item-content-item-content a.active {
|
||
color: var(--Blue);
|
||
}
|
||
.catalog_page-menu__item-content-item.active .catalog_page-menu__item-content-item-content {
|
||
overflow: visible;
|
||
max-height: 100% !important;
|
||
}
|
||
.catalog_page-main {
|
||
width: 100%;
|
||
max-width: 101.6rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.catalog_page-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.catalog_page-item {
|
||
display: flex;
|
||
border-radius: 0.6rem;
|
||
background: var(--White);
|
||
position: relative;
|
||
overflow: hidden;
|
||
}
|
||
.catalog_page-item__img {
|
||
width: 100%;
|
||
max-width: 44.3rem;
|
||
display: flex;
|
||
}
|
||
.catalog_page-item__img img {
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: cover;
|
||
}
|
||
.catalog_page-item__main {
|
||
display: flex;
|
||
padding: 4rem;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1.6rem;
|
||
width: 100%;
|
||
max-width: 57.3rem;
|
||
justify-content: center;
|
||
}
|
||
.catalog_page-item__title {
|
||
font-size: 2.2rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
}
|
||
.catalog_page-item__main p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.catalog_page-item__main .link-more {
|
||
margin-top: 3.2rem;
|
||
}
|
||
.catalog_page-products {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 3.2rem;
|
||
}
|
||
.catalog_page-products > .woocommerce-pagination {
|
||
display: none;
|
||
}
|
||
/* Переключатель вида каталога */
|
||
/* Заголовок каталога с кнопками переключения вида */
|
||
.catalog_page-header {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
.catalog_page-header h1 {
|
||
margin: 0;
|
||
}
|
||
.catalog_page-view-toggle {
|
||
display: flex;
|
||
gap: 0.8rem;
|
||
}
|
||
.catalog_page-view-btn {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 3.6rem;
|
||
height: 3.6rem;
|
||
border: 1px solid #C4C4C4;
|
||
border-radius: 0.8rem;
|
||
background: transparent;
|
||
color: #808080;
|
||
cursor: pointer;
|
||
transition: all 0.2s;
|
||
}
|
||
.catalog_page-view-btn:hover {
|
||
border-color: var(--Blue);
|
||
color: var(--Blue);
|
||
}
|
||
.catalog_page-view-btn.active {
|
||
border-color: var(--Blue);
|
||
background: var(--Blue);
|
||
color: #fff;
|
||
}
|
||
/* Компактный вид — скрываем характеристики */
|
||
.catalog_page-products__grid.view-compact .product_item-chars {
|
||
display: none;
|
||
}
|
||
.catalog_page-products__grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(3, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.catalog_page-products__bottom {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.catalog_page-count {
|
||
margin-left: auto;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
position: relative;
|
||
}
|
||
.catalog_page-count > p {
|
||
color: var(--Grey-1);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.catalog_page-count__button {
|
||
display: flex;
|
||
padding: 0.8rem;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
border-radius: 0.4rem;
|
||
}
|
||
.catalog_page-count__button p {
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.catalog_page-count__button svg {
|
||
width: 1.2rem;
|
||
height: auto;
|
||
transition: .3s all;
|
||
}
|
||
.catalog_page-count__content {
|
||
position: absolute;
|
||
top: 100%;
|
||
margin-top: 0.4rem;
|
||
right: 0;
|
||
border-radius: 0.4rem;
|
||
border: 1px solid var(--Blue);
|
||
background: var(--White);
|
||
box-shadow: 1px 4px 16px 0px rgba(0, 0, 0, 0.10);
|
||
width: 100%;
|
||
max-width: 13.8rem;
|
||
display: none;
|
||
flex-direction: column;
|
||
gap: 0.4rem;
|
||
padding: 2rem;
|
||
}
|
||
.catalog_page-count__content-button {
|
||
display: flex;
|
||
border-radius: 0.4rem;
|
||
background: var(--Light-Blue, #EBF0F2);
|
||
padding: 1.5rem 2rem;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.catalog_page-count__content-button p {
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.catalog_page-count__content-button svg {
|
||
opacity: 0;
|
||
transition: .3s all;
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.catalog_page-count__content-button.active svg {
|
||
opacity: 1;
|
||
}
|
||
.catalog_page-count__content.active {
|
||
display: flex;
|
||
}
|
||
.catalog_page-count__button.active svg {
|
||
transform: rotate(180deg);
|
||
}
|
||
.catalog_page-pagination {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
gap: 2.4rem;
|
||
}
|
||
.catalog_page-pagination__row {
|
||
display: flex;
|
||
gap: 0.4rem;
|
||
}
|
||
.catalog_page-pagination__row .nav-links {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
}
|
||
.catalog_page-pagination__row .page-numbers {
|
||
width: 4.8rem;
|
||
height: 4.8rem;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0.4rem;
|
||
border: 1px solid var(--Light-Grey-2);
|
||
background: var(--White);
|
||
color: var(--Blue);
|
||
text-align: center;
|
||
font-size: 1.6rem;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
text-decoration: none;
|
||
}
|
||
.catalog_page-pagination__row .page-numbers.current {
|
||
color: var(--White);
|
||
background: var(--Blue);
|
||
border-color: var(--Blue);
|
||
}
|
||
.catalog_page-pagination__row .page-numbers svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.catalog_page-pagination__row .page-numbers:hover {
|
||
border-color: var(--Blue);
|
||
}
|
||
.catalog_page-pagination-item {
|
||
width: 4.8rem;
|
||
height: 4.8rem;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0.4rem;
|
||
border: 1px solid var(--Light-Grey-2);
|
||
background: var(--White);
|
||
color: var(--Blue);
|
||
text-align: center;
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.catalog_page-pagination-item svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.catalog_page-pagination-item.active {
|
||
color: var(--White);
|
||
background: var(--Blue);
|
||
border-color: var(--Blue);
|
||
}
|
||
.catalog_page-pagination > p {
|
||
color: var(--Grey-2);
|
||
text-align: center;
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.catalog_page-pagination > p span {
|
||
color: var(--Grey-1);
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.catalog_page {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.catalog_page-menu {
|
||
display: none;
|
||
}
|
||
.catalog_page-main {
|
||
gap: 4rem;
|
||
}
|
||
.catalog_page-col {
|
||
gap: 1rem;
|
||
}
|
||
.catalog_page-item {
|
||
flex-direction: column;
|
||
}
|
||
.catalog_page-item__img {
|
||
max-width: none;
|
||
height: 16rem;
|
||
}
|
||
.catalog_page-item__main {
|
||
padding: 2.4rem;
|
||
gap: 1.2rem;
|
||
max-width: none;
|
||
}
|
||
.catalog_page-item__title {
|
||
font-size: 2rem;
|
||
}
|
||
.catalog_page-item__main .link-more {
|
||
margin-top: 2.8rem;
|
||
gap: 0.6rem;
|
||
font-size: 1.6rem;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.catalog_page-item__main .link-more svg {
|
||
width: 2rem;
|
||
}
|
||
.catalog_page-products {
|
||
gap: 2.4rem;
|
||
}
|
||
.catalog_page-products__grid {
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 1rem;
|
||
}
|
||
.catalog_page-products__bottom {
|
||
gap: 2.4rem;
|
||
}
|
||
.catalog_page-count {
|
||
margin-right: auto;
|
||
}
|
||
}
|
||
|
||
/* catalog_page-search */
|
||
|
||
.catalog_page-search {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.catalog_page-search .header-search input {
|
||
height: 7.2rem;
|
||
padding: 0.4rem 12.6rem 0.4rem 2.4rem;
|
||
color: var(--Black);
|
||
background: var(--White);
|
||
font-size: 1.6rem;
|
||
letter-spacing: -0.032rem;
|
||
line-height: 120%;
|
||
}
|
||
.catalog_page-search .header-search input::placeholder {
|
||
color: var(--Grey-2);
|
||
}
|
||
.catalog_page-search .header-search__submit {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
gap: 0.8rem;
|
||
font-size: 1.6rem;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.catalog_page-search .header-search__submit svg {
|
||
width: 1.6rem;
|
||
}
|
||
.catalog_page-search-hint {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.6rem;
|
||
background: var(--Light-Blue-2);
|
||
}
|
||
.catalog_page-search-hint p {
|
||
color: var(--Dark-Blue);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.catalog_page-search-hint.error {
|
||
background: var(--Light-red);
|
||
}
|
||
.catalog_page-search-hint.error p {
|
||
color: var(--Red);
|
||
}
|
||
.catalog_page-search-count {
|
||
margin: 0.8rem 0 4.8rem 0;
|
||
color: var(--Grey-1);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.catalog_page-search {
|
||
gap: 1rem;
|
||
}
|
||
.catalog_page-search .header-search input {
|
||
padding: 0.4rem 6.8rem 0.4rem 2.4rem;
|
||
}
|
||
.catalog_page-search .header-search__submit {
|
||
padding: 2.4rem;
|
||
}
|
||
.catalog_page-search-hint {
|
||
padding: 2.4rem 1.6rem;
|
||
}
|
||
.catalog_page-search-hint p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.catalog_page-search-count {
|
||
margin: 0.6rem 0 3rem 0;
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
}
|
||
|
||
/* documentation */
|
||
|
||
.documentation {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.documentation-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.documentation-main {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.documentation-tabs {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 1.2rem;
|
||
}
|
||
.documentation-tab {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Light-Blue);
|
||
color: var(--Black);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.documentation-tab.active {
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
}
|
||
.documentation-content {
|
||
display: none;
|
||
}
|
||
.documentation-content.active {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 3.2rem;
|
||
}
|
||
.documentation-content > h2 {
|
||
text-align: left;
|
||
text-transform: none;
|
||
}
|
||
.documentation-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.documentation-items {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.documentation-item {
|
||
display: flex;
|
||
padding: 1.6rem 2.4rem;
|
||
align-items: center;
|
||
gap: 1.6rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--White);
|
||
}
|
||
.documentation-item.hidden {
|
||
display: none;
|
||
}
|
||
.documentation-item__title {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
width: 100%;
|
||
}
|
||
.documentation-item__row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
}
|
||
.documentation-item__info {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
}
|
||
.documentation-item__info p {
|
||
color: var(--Grey);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
white-space: nowrap;
|
||
}
|
||
.documentation-item__download {
|
||
display: flex;
|
||
width: 4.8rem;
|
||
min-width: 4.8rem;
|
||
height: 4.8rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0.4rem;
|
||
border: 1px solid var(--Blue);
|
||
}
|
||
.documentation-item__download svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.documentation-item:hover {
|
||
background: var(--Blue);
|
||
}
|
||
.documentation-item:hover .documentation-item__title {
|
||
color: var(--White);
|
||
}
|
||
.documentation-item:hover .documentation-item__info p {
|
||
color: var(--White);
|
||
}
|
||
.documentation-item:hover .documentation-item__download {
|
||
background: var(--White);
|
||
}
|
||
.documentation-mob {
|
||
display: none;
|
||
}
|
||
.documentation-item__mob {
|
||
display: none;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.documentation {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.documentation-container {
|
||
gap: 2.4rem;
|
||
}
|
||
.documentation-main {
|
||
gap: 4rem;
|
||
}
|
||
.documentation-tabs {
|
||
display: none;
|
||
}
|
||
.documentation-content.active {
|
||
gap: 2.4rem;
|
||
}
|
||
.documentation-col {
|
||
gap: 4rem;
|
||
}
|
||
.documentation-items {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
gap: 1rem;
|
||
}
|
||
.documentation-item {
|
||
padding: 1.6rem;
|
||
}
|
||
.documentation-item__title {
|
||
font-size: 1.2rem;
|
||
width: auto;
|
||
display: none;
|
||
}
|
||
.documentation-item__info {
|
||
display: none;
|
||
gap: 0.2rem;
|
||
}
|
||
.documentation-item__info p {
|
||
font-size: 1.2rem;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.documentation-mob {
|
||
display: flex;
|
||
flex-direction: column;
|
||
position: relative;
|
||
}
|
||
.documentation-item__mob {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.8rem;
|
||
}
|
||
.documentation-item__mob .documentation-item__title {
|
||
display: block;
|
||
}
|
||
.documentation-item__mob .documentation-item__info {
|
||
display: flex;
|
||
}
|
||
.documentation-mob__button {
|
||
display: flex;
|
||
padding: 1.9rem 2rem 2rem 2rem;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
justify-content: space-between;
|
||
border-radius: 0.4rem;
|
||
background: var(--White);
|
||
}
|
||
.documentation-mob__button p {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.documentation-mob__button svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
transition: .3s all;
|
||
}
|
||
.documentation-mob__content {
|
||
position: absolute;
|
||
top: 100%;
|
||
margin-top: 0.8rem;
|
||
z-index: 4;
|
||
display: none;
|
||
flex-direction: column;
|
||
width: 100%;
|
||
gap: 0.4rem;
|
||
border-radius: 0.4rem;
|
||
border: 1px solid var(--Blue);
|
||
background: var(--White);
|
||
box-shadow: 1px 4px 16px 0px rgba(0, 0, 0, 0.10);
|
||
padding: 2rem;
|
||
}
|
||
.documentation-mob__item {
|
||
padding: 1.5rem 2rem;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
border-radius: 0.4rem;
|
||
background: var(--Light-Blue);
|
||
}
|
||
.documentation-mob__item p {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.documentation-mob__item svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
opacity: 0;
|
||
transition: .3s all;
|
||
}
|
||
.documentation-mob__item.active svg {
|
||
opacity: 1;
|
||
}
|
||
.documentation-mob__content.active {
|
||
display: flex;
|
||
}
|
||
.documentation-mob__button.active {
|
||
background: var(--Blue);
|
||
}
|
||
.documentation-mob__button.active p {
|
||
color: var(--White);
|
||
}
|
||
.documentation-mob__button.active svg {
|
||
transform: rotate(180deg);
|
||
}
|
||
.documentation-mob__button.active svg path {
|
||
fill: var(--White);
|
||
}
|
||
}
|
||
|
||
/* contacts */
|
||
|
||
.contacts {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.contacts-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.contacts-main {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4.2rem;
|
||
}
|
||
.contacts-grid {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.contacts-row {
|
||
display: flex;
|
||
gap: 1.6rem;
|
||
}
|
||
.contacts-row2 {
|
||
display: flex;
|
||
gap: 1rem;
|
||
}
|
||
.contacts-item {
|
||
width: 100%;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
padding: 3.2rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1.6rem;
|
||
border: 1px solid transparent;
|
||
}
|
||
.contacts-item:hover {
|
||
border-color: var(--Blue);
|
||
}
|
||
.contacts-item > p {
|
||
color: var(--Grey-1);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.contacts-item__row {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 0.8rem;
|
||
}
|
||
.contacts-item__row > img {
|
||
width: 1.6rem;
|
||
min-width: 1.6rem;
|
||
margin-top: 0.4rem;
|
||
}
|
||
.contacts-item__col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.8rem;
|
||
}
|
||
.contacts-item__col > a {
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.contacts-item__col > p {
|
||
color: var(--Blue-Grey);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.contacts-time {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
}
|
||
.contacts-time p {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.contacts-time p br {
|
||
display: none;
|
||
}
|
||
.contacts-time p span {
|
||
color: var(--Blue);
|
||
}
|
||
.contacts-map {
|
||
width: 100%;
|
||
height: 54rem;
|
||
}
|
||
.contacts-map iframe {
|
||
width: 100%;
|
||
height: 100%;
|
||
border-radius: 0.8rem;
|
||
}
|
||
.contacts-row .contacts-item:nth-child(1), .contacts-row .contacts-item:nth-child(2) {
|
||
max-width: 32.8rem;
|
||
}
|
||
.contacts-item__col > a.link-more {
|
||
color: var(--Blue);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
margin-top: 0.8rem;
|
||
}
|
||
.contacts-item__col > a.link-more svg {
|
||
width: 1.6rem;
|
||
}
|
||
.contacts-address p {
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.contacts {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.contacts-container {
|
||
gap: 4rem;
|
||
}
|
||
.contacts-main {
|
||
gap: 1rem;
|
||
}
|
||
.contacts-grid {
|
||
gap: 1rem;
|
||
}
|
||
.contacts-row {
|
||
flex-direction: column;
|
||
gap: 1rem;
|
||
}
|
||
.contacts-row2 {
|
||
flex-direction: column;
|
||
}
|
||
.contacts-item {
|
||
padding: 2.4rem;
|
||
}
|
||
.contacts-item__row > img {
|
||
margin-top: 0.2rem;
|
||
}
|
||
.contacts-item__col > a {
|
||
font-size: 1.6rem;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.contacts-time p {
|
||
font-size: 1.6rem;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.contacts-time p br {
|
||
display: block;
|
||
}
|
||
.contacts-map {
|
||
height: 34rem;
|
||
}
|
||
.contacts-row .contacts-item:nth-child(1), .contacts-row .contacts-item:nth-child(2) {
|
||
max-width: none;
|
||
}
|
||
.contacts-address p {
|
||
font-size: 1.6rem;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
}
|
||
|
||
/* aboutus */
|
||
|
||
.aboutus {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.aboutus-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.aboutus-main {
|
||
display: flex;
|
||
gap: 1.6rem;
|
||
}
|
||
.aboutus-main > img {
|
||
width: 100%;
|
||
max-width: 44.3rem;
|
||
border-radius: 0.6rem;
|
||
object-fit: cover;
|
||
}
|
||
.aboutus-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 3.2rem;
|
||
width: 100%;
|
||
max-width: 90.1rem;
|
||
border-radius: 0.6rem;
|
||
background: var(--White);
|
||
padding: 6.4rem 4rem;
|
||
}
|
||
.aboutus-col > p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.aboutus-link {
|
||
display: flex;
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.aboutus-link svg {
|
||
width: 1.8rem;
|
||
height: auto;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.aboutus {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.aboutus-container {
|
||
gap: 4rem;
|
||
}
|
||
.aboutus-main {
|
||
flex-direction: column;
|
||
gap: 1rem;
|
||
}
|
||
.aboutus-main > img {
|
||
height: 34rem;
|
||
max-width: none;
|
||
}
|
||
.aboutus-col {
|
||
gap: 2rem;
|
||
padding: 3.2rem 1.6rem 1.6rem 1.6rem;
|
||
}
|
||
.aboutus-col > p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.aboutus-link {
|
||
width: 100%;
|
||
}
|
||
}
|
||
|
||
/* partners */
|
||
|
||
.partners {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.partners-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.partners-slider {
|
||
position: relative;
|
||
align-items: center;
|
||
display: flex;
|
||
}
|
||
.partners-swiper {
|
||
width: 100%;
|
||
}
|
||
.partners-swiper .swiper-wrapper {
|
||
padding-left: 4rem;
|
||
}
|
||
.partners-swiper .swiper-slide {
|
||
height: auto;
|
||
}
|
||
.partners-slide {
|
||
height: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2rem;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
padding: 3.2rem;
|
||
}
|
||
.partners-slide__title {
|
||
color: var(--Grey-1);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.partners-slide__img {
|
||
display: flex;
|
||
padding: 2.4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0.6rem;
|
||
border: 1px solid var(--Light-Grey-3);
|
||
height: 15.8rem;
|
||
}
|
||
.partners-slide__img img {
|
||
max-width: 100%;
|
||
max-height: 80%;
|
||
object-fit: contain;
|
||
}
|
||
.partners-prev {
|
||
position: absolute;
|
||
left: 4rem;
|
||
z-index: 9;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0 0.4rem 0.4rem 0;
|
||
background: var(--Blue-Black);
|
||
margin-top: -2rem;
|
||
}
|
||
.partners-next {
|
||
position: absolute;
|
||
right: 4rem;
|
||
z-index: 9;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0.4rem 0 0 0.4rem;
|
||
background: var(--Blue-Black);
|
||
margin-top: -2rem;
|
||
}
|
||
.partners-prev svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.partners-next svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.partners {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.partners-container {
|
||
gap: 4rem;
|
||
}
|
||
.partners-slider {
|
||
flex-direction: column;
|
||
gap: 2.4rem;
|
||
}
|
||
.partners-swiper .swiper-wrapper {
|
||
padding-left: 1rem;
|
||
}
|
||
.partners-slide {
|
||
gap: 1.6rem;
|
||
padding: 2.4rem 1.6rem 1.6rem 1.6rem;
|
||
}
|
||
.partners-slide__img {
|
||
height: 22rem;
|
||
}
|
||
.partners-slide__img img {
|
||
max-height: 50%;
|
||
}
|
||
.partners-navigation {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 1rem;
|
||
}
|
||
.partners-prev {
|
||
position: relative;
|
||
left: 0;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
border-radius: 0.4rem;
|
||
margin-top: 0;
|
||
}
|
||
.partners-next {
|
||
position: relative;
|
||
right: 0;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
border-radius: 0.4rem;
|
||
margin-top: 0;
|
||
}
|
||
}
|
||
|
||
/* history */
|
||
|
||
.history {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.history-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.history-container > h2 br {
|
||
display: none;
|
||
}
|
||
.history-slider {
|
||
display: flex;
|
||
align-items: center;
|
||
position: relative;
|
||
}
|
||
.history-swiper {
|
||
width: 100%;
|
||
}
|
||
.history-swiper .swiper-slide {
|
||
height: auto;
|
||
}
|
||
.history-slide {
|
||
height: 100%;
|
||
display: flex;
|
||
gap: 3.2rem;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
padding: 6.4rem 11.5rem;
|
||
}
|
||
.history-slide > img {
|
||
width: 100%;
|
||
max-width: 44.2rem;
|
||
object-fit: cover;
|
||
border-radius: 0.6rem;
|
||
min-height: 40.1rem;
|
||
}
|
||
.history-slide__col {
|
||
width: 100%;
|
||
max-width: 65.6rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
align-items: flex-start;
|
||
}
|
||
.history-slide__col h2 {
|
||
text-align: left;
|
||
color: var(--Blue);
|
||
margin-bottom: 1.6rem;
|
||
}
|
||
.history-slide__col h4 {
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
}
|
||
.history-slide__col p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.history-prev {
|
||
position: absolute;
|
||
left: 0;
|
||
z-index: 9;
|
||
display: flex;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0rem 0.4rem 0.4rem 0rem;
|
||
background: var(--Blue-Black);
|
||
}
|
||
.history-next {
|
||
position: absolute;
|
||
right: 0;
|
||
z-index: 9;
|
||
display: flex;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0.4rem 0rem 0rem 0.4rem;
|
||
background: var(--Blue-Black);
|
||
}
|
||
.history-prev svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.history-next svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.history {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.history-container {
|
||
gap: 4rem;
|
||
}
|
||
.history-slider {
|
||
flex-direction: column;
|
||
gap: 2.4rem;
|
||
}
|
||
.history-slide {
|
||
flex-direction: column-reverse;
|
||
gap: 2.4rem;
|
||
padding: 3.2rem 1.6rem 1.6rem 1.6rem;
|
||
}
|
||
.history-slide > img {
|
||
max-width: none;
|
||
height: 30.8rem;
|
||
min-height: 30.8rem;
|
||
}
|
||
.history-slide__col {
|
||
max-width: none;
|
||
}
|
||
.history-slide__col h2 {
|
||
font-size: 2rem;
|
||
margin-bottom: 0.4rem;
|
||
}
|
||
.history-slide__col h4 {
|
||
font-size: 1.6rem;
|
||
}
|
||
.history-slide__col p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.history-prev {
|
||
position: relative;
|
||
border-radius: 0.4rem;
|
||
}
|
||
.history-next {
|
||
position: relative;
|
||
border-radius: 0.4rem;
|
||
}
|
||
.history-navigation {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 1rem;
|
||
}
|
||
.history-container > h2 br {
|
||
display: block;
|
||
}
|
||
}
|
||
|
||
/* projects */
|
||
|
||
.projects {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.projects-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.projects-main {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.projects-grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(3, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.projects-item {
|
||
display: flex;
|
||
flex-direction: column;
|
||
border-radius: 0.6rem;
|
||
position: relative;
|
||
overflow: hidden;
|
||
background: var(--White);
|
||
}
|
||
.projects-item.hidden {
|
||
display: none;
|
||
}
|
||
.projects-item > img {
|
||
width: 100%;
|
||
height: 24rem;
|
||
object-fit: cover;
|
||
}
|
||
.projects-item__main {
|
||
display: flex;
|
||
padding: 2.4rem;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1.6rem;
|
||
}
|
||
.projects-item__main > p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.projects-item__row {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0.6rem;
|
||
}
|
||
.projects-item__row p {
|
||
border-radius: 0.4rem;
|
||
background: var(--Light-Grey);
|
||
padding: 0.8rem 1.2rem;
|
||
color: var(--Blue);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.projects-more {
|
||
display: flex;
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
margin: 0 auto;
|
||
}
|
||
.projects-more p {
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.projects-more svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.projects-slider {
|
||
display: none;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.projects {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.projects-container {
|
||
gap: 4rem;
|
||
}
|
||
.projects-main {
|
||
display: none;
|
||
}
|
||
.projects-slider {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2.4rem;
|
||
}
|
||
.projects-navigation {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 1rem;
|
||
}
|
||
.projects-swiper {
|
||
width: 100%;
|
||
}
|
||
.projects-swiper .swiper-slide {
|
||
height: auto;
|
||
}
|
||
.projects-prev {
|
||
display: flex;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue-Black);
|
||
}
|
||
.projects-prev svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.projects-next {
|
||
display: flex;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue-Black);
|
||
}
|
||
.projects-next svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.projects-item {
|
||
height: 100%;
|
||
}
|
||
.projects-item > img {
|
||
height: 20rem;
|
||
}
|
||
.projects-item__main {
|
||
padding: 2.4rem 1.6rem;
|
||
}
|
||
}
|
||
|
||
/* page */
|
||
|
||
.page {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.page-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.page-main {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.page-block {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.page-main p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.page-main a {
|
||
color: var(--Blue);
|
||
}
|
||
.page-main .page-text-black {
|
||
color: var(--Black);
|
||
max-width: 109rem;
|
||
font-weight: 600;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.page {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.page-container {
|
||
gap: 4rem;
|
||
}
|
||
.page-main {
|
||
gap: 2.4rem;
|
||
}
|
||
.page-main p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
}
|
||
|
||
/* page_404 */
|
||
|
||
.page_404 {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.page_404-main {
|
||
background-image: url('/wp-content/uploads/2025/05/page_404.png');
|
||
background-position: center center;
|
||
background-size: cover;
|
||
background-repeat: no-repeat;
|
||
padding: 10.7rem 0;
|
||
border-radius: 0.6rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
}
|
||
.page_404-main h2 {
|
||
color: var(--Blue-Black);
|
||
text-align: center;
|
||
font-size: 24rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 100%;
|
||
letter-spacing: -0.48rem;
|
||
text-transform: uppercase;
|
||
margin-bottom: 1.2rem;
|
||
}
|
||
.page_404-main p {
|
||
color: var(--Black);
|
||
text-align: center;
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.page_404-link {
|
||
display: flex;
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
margin-top: 2rem;
|
||
}
|
||
.page_404-link svg {
|
||
width: 1.9rem;
|
||
height: auto;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.page_404 {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.page_404-main {
|
||
background-image: url('/wp-content/uploads/2025/05/page_404-mob.png');
|
||
padding: 14.1rem 0;
|
||
}
|
||
.page_404-main h2 {
|
||
font-size: 14.4rem;
|
||
letter-spacing: -0.288rem;
|
||
}
|
||
.page_404-main h3 {
|
||
max-width: 24.7rem;
|
||
text-align: center;
|
||
font-size: 1.6rem;
|
||
}
|
||
.page_404-main p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
max-width: 15.7rem;
|
||
}
|
||
}
|
||
|
||
/* cart */
|
||
|
||
.cart {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.cart-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.cart-main {
|
||
display: flex;
|
||
gap: 1.6rem;
|
||
}
|
||
.cart-left {
|
||
width: 100%;
|
||
max-width: 90.1rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.cart-top {
|
||
display: flex;
|
||
padding: 1.6rem 2.4rem;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
}
|
||
.cart-checkbox__all {
|
||
position: relative;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
.cart-checkbox__all label {
|
||
cursor: pointer;
|
||
padding-left: 2.4rem;
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.cart-checkbox__all input[type=checkbox]:before {
|
||
content: "";
|
||
display: inline-block;
|
||
width: 1.6rem;
|
||
height: 1.6rem;
|
||
border-radius: 0.2rem;
|
||
border: 0.1rem solid var(--Blue);
|
||
position: absolute;
|
||
margin-top: -0.8rem;
|
||
background-color: var(--White);
|
||
cursor: pointer;
|
||
}
|
||
.cart-checkbox__all input[type=checkbox]:checked:before {
|
||
background:transparent;
|
||
background-image: url('/wp-content/uploads/2025/05/chek.svg');
|
||
background-repeat: no-repeat;
|
||
background-position: center;
|
||
background-size: cover;
|
||
position: absolute;
|
||
}
|
||
.cart-checkbox__all input[type="checkbox"] {
|
||
-webkit-appearance: none;
|
||
-moz-appearance: none;
|
||
appearance: none;
|
||
background: none;
|
||
}
|
||
.cart-checkbox__all input[type="checkbox"] {
|
||
-webkit-appearance: none;
|
||
-moz-appearance: none;
|
||
appearance: none;
|
||
background-image: none;
|
||
}
|
||
.cart-checkbox__all input[type="checkbox"]:checked {
|
||
background-image: none;
|
||
}
|
||
.cart-delete-all {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.2rem;
|
||
color: var(--Red);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.cart-delete-all svg {
|
||
width: 2rem;
|
||
height: auto;
|
||
}
|
||
.cart-products {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.cart-product {
|
||
display: flex;
|
||
padding: 2.4rem;
|
||
align-items: flex-start;
|
||
gap: 1.6rem;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
position: relative;
|
||
}
|
||
.cart-product__checkbox {
|
||
position: absolute;
|
||
top: 3.6rem;
|
||
z-index: 5;
|
||
left: 3.6rem;
|
||
display: flex;
|
||
width: 1.6rem;
|
||
height: 1.6rem;
|
||
}
|
||
.cart-product__checkbox input[type=checkbox]:before {
|
||
content: "";
|
||
display: inline-block;
|
||
width: 1.6rem;
|
||
height: 1.6rem;
|
||
border-radius: 0.2rem;
|
||
border: 0.1rem solid var(--Blue);
|
||
position: absolute;
|
||
background-color: var(--White);
|
||
cursor: pointer;
|
||
}
|
||
.cart-product__checkbox input[type=checkbox]:checked:before {
|
||
background:transparent;
|
||
background-image: url('/wp-content/uploads/2025/05/chek.svg');
|
||
background-repeat: no-repeat;
|
||
background-position: center;
|
||
position: absolute;
|
||
background-size: cover;
|
||
}
|
||
.cart-product__checkbox input[type="checkbox"] {
|
||
-webkit-appearance: none;
|
||
-moz-appearance: none;
|
||
appearance: none;
|
||
background: none;
|
||
}
|
||
.cart-product__checkbox input[type="checkbox"] {
|
||
-webkit-appearance: none;
|
||
-moz-appearance: none;
|
||
appearance: none;
|
||
background-image: none;
|
||
}
|
||
.cart-product__checkbox input[type="checkbox"]:checked {
|
||
background-image: none;
|
||
}
|
||
.cart-product__img {
|
||
width: 21.3rem;
|
||
min-width: 21.3rem;
|
||
height: 21.3rem;
|
||
}
|
||
.cart-product__img img {
|
||
border-radius: 0.6rem;
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: cover;
|
||
}
|
||
.cart-product__main {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 1.6rem;
|
||
width: 100%;
|
||
}
|
||
.cart-product__col {
|
||
width: 100%;
|
||
max-width: 39.5rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
}
|
||
.cart-product__sku {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
margin-bottom: 2.4rem;
|
||
}
|
||
.cart-product__sku p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.cart-product__sku p:last-child {
|
||
color: var(--Black);
|
||
font-weight: 600;
|
||
}
|
||
.cart-product__title {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
margin-bottom: 1.6rem;
|
||
}
|
||
.cart-product__params {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.4rem;
|
||
margin-bottom: 1.6rem;
|
||
}
|
||
.cart-product__params p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.3rem;
|
||
font-weight: 400;
|
||
line-height: 130%;
|
||
margin: 0;
|
||
}
|
||
.cart-product__params p strong {
|
||
color: var(--Black);
|
||
font-weight: 600;
|
||
}
|
||
.cart-product__chars {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.8rem;
|
||
margin-bottom: 2.4rem;
|
||
}
|
||
.cart-product__chars-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
}
|
||
.cart-product__chars-row p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.cart-product__chars-row p:last-child {
|
||
color: var(--Black);
|
||
font-weight: 600;
|
||
}
|
||
.cart-product__chars-row .cart-product__chars-price {
|
||
color: var(--Black);
|
||
font-weight: 600;
|
||
}
|
||
.cart-product__chars-row p.cart-product__chars-oldprice {
|
||
color: var(--Grey-2);
|
||
text-decoration: line-through;
|
||
}
|
||
.cart-product__quantity {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.8rem;
|
||
margin-bottom: 1.6rem;
|
||
}
|
||
.cart-product__quantity > p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.cart-product__quantity-row {
|
||
display: flex;
|
||
}
|
||
.cart-product__quantity-row input {
|
||
padding: 1.5rem 1.5rem 1.4rem 1.5rem;
|
||
border-top: 1px solid var(--Light-Grey-3);
|
||
border-bottom: 1px solid var(--Light-Grey-3);
|
||
background: var(--White);
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.028rem;
|
||
text-align: center;
|
||
width: 11.7rem;
|
||
height: 4.8rem;
|
||
}
|
||
.cart-product__quantity-row input input::-webkit-outer-spin-button,
|
||
.cart-product__quantity-row input input::-webkit-inner-spin-button {
|
||
-webkit-appearance: none;
|
||
margin: 0;
|
||
}
|
||
.cart-product__quantity-row input input[type=number] {
|
||
-moz-appearance: textfield;
|
||
}
|
||
.cart-product__quantity-row button {
|
||
border-radius: 0.4rem 0rem 0rem 0.4rem;
|
||
border: 1px solid var(--Light-Grey-3);
|
||
background: var(--White);
|
||
padding: 1.5rem;
|
||
height: 4.8rem;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
}
|
||
.cart-product__quantity-row button.cart-product__quantity-plus {
|
||
border-radius: 0rem 0.4rem 0.4rem 0rem;
|
||
}
|
||
.cart-product__quantity-row button svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.cart-product__delete {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.2rem;
|
||
color: var(--Grey-1);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.cart-product__delete svg {
|
||
width: 2rem;
|
||
height: auto;
|
||
}
|
||
.cart-product__info {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-end;
|
||
width: 100%;
|
||
max-width: 21.3rem;
|
||
gap: 2rem;
|
||
}
|
||
.cart-product__popular {
|
||
padding: 0.8rem 1.2rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Green);
|
||
color: var(--White);
|
||
text-align: center;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.cart-product__discount {
|
||
padding: 0.8rem 1.2rem;
|
||
border-radius: 0.4rem;
|
||
background: #EF4444;
|
||
color: var(--White);
|
||
text-align: center;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.cart-product__info-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-end;
|
||
gap: 0.8rem;
|
||
}
|
||
.cart-product__info-label {
|
||
color: var(--Grey-2);
|
||
text-align: right;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
margin-bottom: 0.4rem;
|
||
}
|
||
.cart-product__info-block {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-end;
|
||
gap: 0.8rem;
|
||
}
|
||
.cart-product__info-block > p {
|
||
color: var(--Grey-2);
|
||
text-align: right;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.cart-product__info-block > p:last-child {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-weight: 600;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.cart-product__price-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
}
|
||
.cart-product__price {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
}
|
||
.cart-product__sale {
|
||
display: flex;
|
||
padding: 0.8rem 1.2rem;
|
||
align-items: center;
|
||
gap: 0.2rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Red);
|
||
}
|
||
.cart-product__sale p {
|
||
color: var(--White);
|
||
text-align: center;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.cart-product__sale svg {
|
||
width: 1.2rem;
|
||
height: auto;
|
||
}
|
||
.cart-product__oldprice {
|
||
color: var(--Grey-2);;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
text-decoration-line: line-through;
|
||
}
|
||
.cart-right {
|
||
width: 100%;
|
||
max-width: 44.3rem;
|
||
}
|
||
.cart-total {
|
||
position: sticky;
|
||
top: 5rem;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
display: flex;
|
||
padding: 4rem;
|
||
flex-direction: column;
|
||
gap: 2.7rem;
|
||
}
|
||
.cart-total > h3 {
|
||
padding-bottom: 2.4rem;
|
||
border-bottom: 0.1rem solid #F1F1F1;
|
||
}
|
||
.cart-total__col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.cart-total__info {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.cart-total__info-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1rem;
|
||
justify-content: space-between;
|
||
}
|
||
.cart-total__info-row p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.cart-total__info-row p:last-child {
|
||
font-size: 1.8rem;
|
||
color: var(--Black);
|
||
font-weight: 600;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.cart-total__bottom {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.8rem;
|
||
}
|
||
.cart-total__price-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1.2rem;
|
||
margin-bottom: 2.4rem;
|
||
}
|
||
.cart-total__price-col > p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.cart-total__price-row {
|
||
display: flex;
|
||
align-items: baseline;
|
||
gap: 0.8rem;
|
||
}
|
||
.cart-total__price {
|
||
color: var(--Blue);
|
||
font-size: 2.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
}
|
||
.cart-total__oldprice {
|
||
color: var(--Grey-2);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: normal;
|
||
text-decoration-line: line-through;
|
||
}
|
||
.cart-total__price span {
|
||
font-size: 1.6rem;
|
||
}
|
||
.cart-total__oldprice span {
|
||
font-size: 1.2rem;
|
||
font-weight: 500;
|
||
}
|
||
.cart-submit {
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
margin-bottom: 0.8rem;
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
}
|
||
.cart-submit svg {
|
||
width: 1.9rem;
|
||
height: auto;
|
||
}
|
||
.cart-total__bottom > p {
|
||
color: var(--Grey-1);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.cart-total__bottom > p a {
|
||
color: var(--Blue);
|
||
font-weight: 500;
|
||
}
|
||
.cart-product__col .cart-product__popular {
|
||
display: none;
|
||
}
|
||
.cart-product__col .cart-product__sale {
|
||
display: none;
|
||
}
|
||
.cart-product__col .cart-product__info-col {
|
||
display: none;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.cart {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.cart-container {
|
||
gap: 4rem;
|
||
}
|
||
.cart-main {
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.cart-left {
|
||
max-width: none;
|
||
gap: 1rem;
|
||
}
|
||
.cart-top {
|
||
padding: 1.2rem 1.6rem;
|
||
}
|
||
.cart-products {
|
||
gap: 1rem;
|
||
}
|
||
.cart-product {
|
||
padding: 1.6rem;
|
||
gap: 1.6rem;
|
||
border-radius: 0.6rem;
|
||
}
|
||
.cart-product__checkbox {
|
||
top: 2.4rem;
|
||
left: 2.4rem;
|
||
}
|
||
.cart-product__img {
|
||
width: 6.4rem;
|
||
min-width: 6.4rem;
|
||
height: 6.4rem;
|
||
}
|
||
.cart-product__img img {
|
||
border-radius: 0.4rem;
|
||
}
|
||
.cart-product__main {
|
||
flex-direction: column;
|
||
}
|
||
.cart-product__col {
|
||
max-width: none;
|
||
}
|
||
.cart-product__col .cart-product__popular {
|
||
display: block;
|
||
}
|
||
.cart-product__col .cart-product__sale {
|
||
display: flex;
|
||
}
|
||
.cart-product__col .cart-product__info-col {
|
||
display: flex;
|
||
}
|
||
.cart-product__sku {
|
||
gap: 0.2rem;
|
||
margin-bottom: 1.6rem;
|
||
}
|
||
.cart-product__sku p {
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.cart-product__title {
|
||
font-size: 1.4rem;
|
||
}
|
||
.cart-product__quantity {
|
||
margin-bottom: 2.4rem;
|
||
}
|
||
.cart-product__quantity-row input {
|
||
width: 12.8rem;
|
||
}
|
||
.cart-product__info {
|
||
display: none;
|
||
}
|
||
.cart-product__popular {
|
||
padding: 0.6rem 0.8rem;
|
||
font-size: 0.8rem;
|
||
letter-spacing: -0.016rem;
|
||
margin-bottom: 1.2rem;
|
||
}
|
||
.cart-product__info-col {
|
||
align-items: flex-start;
|
||
margin-bottom: 2.4rem;
|
||
}
|
||
.cart-product__info-block {
|
||
align-items: flex-start;
|
||
gap: 0.6rem;
|
||
}
|
||
.cart-product__info-block > p {
|
||
text-align: left;
|
||
}
|
||
.cart-product__sale {
|
||
margin-bottom: 1.2rem;
|
||
padding: 0.6rem 0.8rem;
|
||
}
|
||
.cart-product__sale p {
|
||
font-size: 0.8rem;
|
||
letter-spacing: -0.016rem;
|
||
}
|
||
.cart-product__sale svg {
|
||
width: 0.8rem;
|
||
}
|
||
.cart-right {
|
||
max-width: 100%;
|
||
}
|
||
.cart-total {
|
||
position: relative;
|
||
top: 0;
|
||
padding: 2.4rem 1.6rem;
|
||
gap: 1.6rem;
|
||
}
|
||
.cart-total > h3 {
|
||
padding-bottom: 1.6rem;
|
||
}
|
||
.cart-total__info {
|
||
gap: 1.2rem;
|
||
}
|
||
.cart-total__info-row p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.cart-total__info-row p:last-child {
|
||
font-size: 1.6rem;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.cart-total__price-col > p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.cart-submit {
|
||
padding: 2.2rem 0;
|
||
}
|
||
.cart-submit svg {
|
||
width: 1.8rem;
|
||
}
|
||
.cart-total__bottom > p {
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
}
|
||
|
||
/* cart_more */
|
||
|
||
.cart_more {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.cart_more-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.cart_more-name {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.cart_more-link {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
color: var(--Blue);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.cart_more-link svg {
|
||
width: 2rem;
|
||
height: auto;
|
||
}
|
||
.cart_more-mob {
|
||
display: none;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.cart_more {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.cart_more-name {
|
||
justify-content: center;
|
||
}
|
||
.cart_more-container {
|
||
gap: 4rem;
|
||
}
|
||
.cart_more-link {
|
||
display: none;
|
||
}
|
||
.cart_more-mob {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.cart_more-mob__link {
|
||
padding: 2.1rem 0;
|
||
border-radius: 0.4rem;
|
||
border: 1px solid var(--Blue);
|
||
color: var(--Blue);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
text-align: center;
|
||
}
|
||
}
|
||
|
||
/* cart-empty */
|
||
|
||
.cart-empty {
|
||
padding: 10.4rem 4rem;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 1.6rem;
|
||
}
|
||
.cart-empty h3 {
|
||
text-align: center;
|
||
}
|
||
.cart-empty p {
|
||
color: var(--Grey-2);
|
||
text-align: center;
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.028rem;
|
||
max-width: 50.8rem;
|
||
}
|
||
.cart-empty p a {
|
||
color: var(--Blue);
|
||
font-weight: 500;
|
||
}
|
||
.cart-empty__link {
|
||
margin-top: 1.6rem;
|
||
display: flex;
|
||
width: 24rem;
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
justify-content: center;
|
||
align-items: flex-end;
|
||
gap: 0.6rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.cart-empty__link svg {
|
||
width: 1.8rem;
|
||
height: auto;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.cart-empty {
|
||
padding: 9.6rem 1.6rem;
|
||
}
|
||
.cart-empty h3 {
|
||
max-width: 20rem;
|
||
}
|
||
.cart-empty p {
|
||
max-width: 29rem;
|
||
}
|
||
.cart-empty__link {
|
||
margin-top: 2.4rem;
|
||
width: 24.6rem;
|
||
}
|
||
}
|
||
|
||
/* login */
|
||
|
||
.login {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.login-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.login-name {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
gap: 2.4rem;
|
||
}
|
||
.login-name h1 {
|
||
text-align: center;
|
||
}
|
||
.login-name p {
|
||
color: var(--Grey-2);
|
||
text-align: center;
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.028rem;
|
||
max-width: 40.3rem;
|
||
}
|
||
.login-main {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.login-form {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
width: 100%;
|
||
max-width: 67.2rem;
|
||
margin: 0 auto;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
padding: 4rem;
|
||
}
|
||
.login-form__inputs {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2rem;
|
||
}
|
||
.login-form__input {
|
||
display: flex;
|
||
align-items: center;
|
||
position: relative;
|
||
}
|
||
.login-form__input input {
|
||
color: var(--Blue);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
border-radius: 0.6rem;
|
||
background: var(--Light-Grey);
|
||
padding: 1.9rem 0.4rem 1.9rem 2rem;
|
||
width: 100%;
|
||
border: 1px solid transparent;
|
||
}
|
||
.login-form__input input::placeholder {
|
||
color: var(--Grey-2);
|
||
}
|
||
.login-password__button {
|
||
position: absolute;
|
||
right: 2rem;
|
||
z-index: 5;
|
||
display: flex;
|
||
}
|
||
.login-password__button img {
|
||
width: 1.6rem;
|
||
}
|
||
.login-form__row {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.login-form__remember {
|
||
position: relative;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
.login-form__remember label {
|
||
cursor: pointer;
|
||
padding-left: 2.5rem;
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 140%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.login-form__remember label a {
|
||
text-decoration: underline;
|
||
}
|
||
.login-form__remember input[type=checkbox]:before {
|
||
content: "";
|
||
display: inline-block;
|
||
width: 1.6rem;
|
||
height: 1.6rem;
|
||
border-radius: 0.2rem;
|
||
border: 0.1rem solid var(--Blue);
|
||
position: absolute;
|
||
background-color: var(--White);
|
||
cursor: pointer;
|
||
margin-top: -0.8rem;
|
||
}
|
||
.login-form__remember input[type=checkbox]:checked:before {
|
||
background:transparent;
|
||
background-image: url('/wp-content/uploads/2025/05/chek.svg');
|
||
background-repeat: no-repeat;
|
||
background-position: center;
|
||
position: absolute;
|
||
background-size: cover;
|
||
}
|
||
.login-form__remember input[type="checkbox"] {
|
||
-webkit-appearance: none;
|
||
-moz-appearance: none;
|
||
appearance: none;
|
||
background: none;
|
||
}
|
||
.login-form__remember input[type="checkbox"] {
|
||
-webkit-appearance: none;
|
||
-moz-appearance: none;
|
||
appearance: none;
|
||
background-image: none;
|
||
}
|
||
.login-form__remember input[type="checkbox"]:checked {
|
||
background-image: none;
|
||
}
|
||
.login-form__link {
|
||
color: var(--Grey-1);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 120%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.login-form__actions {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2rem;
|
||
}
|
||
.login-form__submit {
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
text-align: center;
|
||
}
|
||
.login-form__actions-row {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.6rem;
|
||
}
|
||
.login-form__actions-row p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 140%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.login-form__actions-row a {
|
||
color: var(--Blue);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
}
|
||
.login-form__actions-row a svg {
|
||
width: 1.7rem;
|
||
height: auto;
|
||
}
|
||
|
||
.login-error {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
width: 100%;
|
||
max-width: 67.2rem;
|
||
border-radius: 0.6rem;
|
||
background: var(--Light-red);
|
||
display: none;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin: 0 auto;
|
||
}
|
||
.login-error p {
|
||
color: var(--Red);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
text-align: center;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.login {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.login-name {
|
||
gap: 1.6rem;
|
||
}
|
||
.login-name p {
|
||
max-width: 25.5rem;
|
||
}
|
||
.login-main {
|
||
gap: 1rem;
|
||
}
|
||
.login-form {
|
||
max-width: none;
|
||
border-radius: 0.6rem;
|
||
padding: 3.2rem 1.6rem;
|
||
}
|
||
.login-form__inputs {
|
||
gap: 1rem;
|
||
}
|
||
.login-form__row {
|
||
margin-top: 1rem;
|
||
}
|
||
.login-form__remember {
|
||
position: relative;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
.login-form__remember label {
|
||
padding-left: 2.2rem;
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.login-form__remember input[type=checkbox]:before {
|
||
margin-top: -1rem;
|
||
}
|
||
.login-form__link {
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.login-form__actions-row {
|
||
flex-direction: column;
|
||
gap: 0.4rem;
|
||
}
|
||
.login-form__actions-row a svg {
|
||
width: 1.6rem;
|
||
}
|
||
|
||
.login-error {
|
||
padding: 2.3rem 1.6rem 2.4rem 1.6rem;
|
||
max-width: none;
|
||
}
|
||
.login-error p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
}
|
||
|
||
/* password recovery */
|
||
|
||
.password-recovery .login-name p {
|
||
max-width: 60.9rem;
|
||
}
|
||
.login-form__inputs > p {
|
||
color: var(--Grey-1);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.036rem;
|
||
margin-top: -1.2rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.password-recovery .login-name p {
|
||
max-width: 29.8rem;
|
||
}
|
||
.password-recovery .login-name h1 {
|
||
max-width: 23.3rem;
|
||
}
|
||
.login-form__inputs > p {
|
||
margin-top: -0.2rem;
|
||
}
|
||
}
|
||
|
||
/* password recovery complete */
|
||
|
||
.password-recovery-complete .login-main {
|
||
width: 100%;
|
||
max-width: 59.2rem;
|
||
margin: 0 auto;
|
||
gap: 1.6rem;
|
||
}
|
||
.password-recovery-complete__block {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.6rem;
|
||
background: var(--Light-green);
|
||
}
|
||
.password-recovery-complete__block p {
|
||
color: var(--Green);
|
||
text-align: center;
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.password-recovery-complete .login-main {
|
||
max-width: none;
|
||
gap: 1rem;
|
||
}
|
||
.password-recovery-complete__block {
|
||
padding: 2.2rem 1.6rem;
|
||
}
|
||
.registration-complete .login-name p {
|
||
max-width: none;
|
||
}
|
||
}
|
||
|
||
/* registration */
|
||
|
||
.registration .login-name p {
|
||
max-width: 68.8rem;
|
||
}
|
||
.registration-main {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.registration-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2rem;
|
||
padding: 4rem;
|
||
width: 100%;
|
||
max-width: 67.2rem;
|
||
margin: 0 auto;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
}
|
||
.registration-tabs {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.registration-tab {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
padding: 2.3rem 0.4rem 2.4rem 4.4rem;
|
||
border-radius: 0.6rem;
|
||
background: var(--Light-Grey);
|
||
border: 1px solid transparent;
|
||
position: relative;
|
||
text-align: left;
|
||
}
|
||
.registration-tab::before {
|
||
content: '';
|
||
position: absolute;
|
||
left: 2rem;
|
||
top: 2.4rem;
|
||
width: 1.6rem;
|
||
height: 1.6rem;
|
||
background-image: url('/wp-content/uploads/2025/05/radio.svg');
|
||
background-position: center center;
|
||
background-size: cover;
|
||
background-repeat: no-repeat;
|
||
transition: .3s all;
|
||
}
|
||
.registration-tab.active {
|
||
border-color: var(--Blue);
|
||
color: var(--Blue);
|
||
}
|
||
.registration-tab.active::before {
|
||
background-image: url('/wp-content/uploads/2025/05/radio-checked.svg');
|
||
}
|
||
.registration-content {
|
||
display: none;
|
||
}
|
||
.registration-content.active {
|
||
display: block;
|
||
}
|
||
.registration-form {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.registration .login-name p {
|
||
max-width: 30.5rem;
|
||
}
|
||
.registration-main {
|
||
gap: 1rem;
|
||
}
|
||
.registration-col {
|
||
gap: 1rem;
|
||
padding: 3.2rem 1.6rem;
|
||
max-width: none;
|
||
border-radius: 0.6rem;
|
||
}
|
||
.registration-tabs {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
gap: 1rem;
|
||
}
|
||
.registration .login-error p {
|
||
max-width: 22.7rem;
|
||
}
|
||
}
|
||
|
||
/* popup */
|
||
|
||
.popup {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
z-index: 9999;
|
||
width: 100%;
|
||
height: 100%;
|
||
display: none;
|
||
}
|
||
.popup-fon {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
background: var(--black-blue-10);
|
||
}
|
||
.popup-main {
|
||
margin: auto;
|
||
width: 100%;
|
||
max-width: 55.7rem;
|
||
padding: 4rem;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
position: relative;
|
||
z-index: 2;
|
||
}
|
||
.popup-close {
|
||
position: absolute;
|
||
top: 4rem;
|
||
right: 4rem;
|
||
}
|
||
.popup-close svg {
|
||
width: 2.4rem;
|
||
height: auto;
|
||
}
|
||
.popup-registration__col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2.4rem;
|
||
}
|
||
.popup-registration__name {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.7rem;
|
||
}
|
||
.popup-registration__name p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.popup-registration__name p br {
|
||
display: none;
|
||
}
|
||
.popup-registration__name p b {
|
||
font-weight: 600;
|
||
}
|
||
.popup-registration__form {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.popup-registration__inputs {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.8rem;
|
||
}
|
||
.popup-registration__inputs > p {
|
||
color: var(--Grey-1);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.popup-registration__input {
|
||
display: flex;
|
||
position: relative;
|
||
}
|
||
.popup-registration__input input {
|
||
padding: 1.9rem 0.4rem 1.9rem 2rem;
|
||
border-radius: 0.6rem;
|
||
background: var(--Light-Grey);
|
||
width: 100%;
|
||
color: var(--Blue);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
border: 1px solid transparent;
|
||
}
|
||
.popup-registration__input input::placeholder {
|
||
color: var(--Grey-2);
|
||
}
|
||
.popup-registration__actions {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2rem;
|
||
}
|
||
.popup-registration__submit {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
text-align: center;
|
||
}
|
||
.popup-registration__actions p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 140%;
|
||
letter-spacing: -0.024rem;
|
||
text-align: center;
|
||
}
|
||
.popup-registration__code-button {
|
||
margin: 0 auto;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
color: var(--Blue);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.popup-registration__code-button svg {
|
||
width: 1.7rem;
|
||
height: auto;
|
||
}
|
||
.popup-registration2 .popup-registration__input input {
|
||
color: var(--Blue);
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.popup-main {
|
||
max-width: 34rem;
|
||
padding: 6.4rem 1.6rem;
|
||
}
|
||
.popup-close {
|
||
top: 1.6rem;
|
||
right: 1.6rem;
|
||
}
|
||
.popup-registration__col {
|
||
gap: 3.2rem;
|
||
}
|
||
.popup-registration__name {
|
||
align-items: center;
|
||
gap: 1.6rem;
|
||
}
|
||
.popup-registration__name h4 {
|
||
text-align: center;
|
||
}
|
||
.popup-registration__name p {
|
||
text-align: center;
|
||
}
|
||
.popup-registration__name p br {
|
||
display: block;
|
||
}
|
||
.popup-registration__code-button svg {
|
||
width: 1.6rem;
|
||
}
|
||
}
|
||
|
||
/* payment */
|
||
|
||
.payment {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.payment-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.payment-main {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.payment-block {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.payment-block p, .payment-block li {
|
||
color: var(--Grey-2);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.payment-block ul {
|
||
display: flex;
|
||
flex-direction: column;
|
||
padding-left: 2.5rem;
|
||
}
|
||
.payment-requisites {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2.4rem;
|
||
margin-top: 2.4rem;
|
||
}
|
||
.payment-requisites__col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.payment-requisites__row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
}
|
||
.payment-requisites__row p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.payment-requisites__row p:last-child {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.payment {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.payment-container {
|
||
gap: 4rem;
|
||
}
|
||
.payment-main {
|
||
gap: 2.4rem;
|
||
}
|
||
.payment-block h3 {
|
||
font-size: 1.6rem;
|
||
}
|
||
.payment-block p, .payment-block li {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.payment-requisites {
|
||
gap: 2.4rem;
|
||
margin-top: 1.6rem;
|
||
}
|
||
.payment-requisites__col {
|
||
gap: 2rem;
|
||
}
|
||
.payment-requisites__row {
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
}
|
||
.payment-requisites__row p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.payment-requisites__row p:last-child {
|
||
font-size: 1.6rem;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
}
|
||
|
||
/* delivery */
|
||
|
||
.delivery .payment-block {
|
||
max-width: 101.3rem;
|
||
}
|
||
.delivery-map {
|
||
width: 100%;
|
||
max-width: 101.6rem;
|
||
height: 40rem;
|
||
}
|
||
.delivery-map iframe {
|
||
width: 100%;
|
||
height: 100%;
|
||
border-radius: 0.8rem;
|
||
}
|
||
.delivery .delivery-block {
|
||
max-width: 88.9rem;
|
||
}
|
||
.delivery-col {
|
||
margin-top: 2.4rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.2rem;
|
||
}
|
||
.delivery-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
}
|
||
.delivery-row p {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
}
|
||
.delivery-row span {
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
display: flex;
|
||
width: 3.2rem;
|
||
height: 3.2rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
color: var(--White);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 110%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.delivery .payment-block {
|
||
max-width: none;
|
||
}
|
||
.delivery-map {
|
||
max-width: none;
|
||
height: 34rem;
|
||
}
|
||
.delivery .delivery-block {
|
||
max-width: none;
|
||
}
|
||
.delivery-col {
|
||
margin-top: 0.8rem;
|
||
gap: 0.8rem;
|
||
}
|
||
.delivery-row p {
|
||
font-size: 1.6rem;
|
||
}
|
||
}
|
||
|
||
/* product_page */
|
||
|
||
.product_page {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.product_page-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 9.6rem;
|
||
}
|
||
.product_page-main {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 3.2rem;
|
||
}
|
||
.product_page-images {
|
||
width: 100%;
|
||
max-width: 65.6rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
position: relative;
|
||
gap: 1.2rem;
|
||
}
|
||
.product_page-labels {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.6rem;
|
||
top: 2.4rem;
|
||
left: 2.4rem;
|
||
position: absolute;
|
||
z-index: 9;
|
||
}
|
||
.product_page-popular {
|
||
padding: 0.8rem 1.2rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Green);
|
||
color: var(--White);
|
||
text-align: center;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
/* Метка скидки - красная */
|
||
.product_page-discount {
|
||
padding: 0.8rem 1.2rem;
|
||
border-radius: 0.4rem;
|
||
background: #EF4444;
|
||
color: var(--White);
|
||
text-align: center;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.product_page-sale {
|
||
display: flex;
|
||
padding: 0.8rem 1.2rem;
|
||
align-items: center;
|
||
gap: 0.2rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Red);
|
||
}
|
||
.product_page-sale p {
|
||
color: var(--White);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.product_page-sale svg {
|
||
width: 1.2rem;
|
||
height: auto;
|
||
}
|
||
.product_page-slider {
|
||
position: relative;
|
||
display: flex;
|
||
align-items: center;
|
||
max-width: 700px;
|
||
}
|
||
.product_page-swiper {
|
||
width: 100%;
|
||
}
|
||
.product_page-swiper .swiper-slide {
|
||
height: auto;
|
||
}
|
||
.product_page-slide {
|
||
width: 100%;
|
||
height: 300px;
|
||
}
|
||
.product_page-slide img {
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: contain;
|
||
border-radius: 0.6rem;
|
||
}
|
||
.product_page-prev {
|
||
display: flex;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0.4rem 0rem 0rem 0.4rem;
|
||
background: var(--Dark-Blue-Grey);
|
||
position: absolute;
|
||
left: 0;
|
||
z-index: 9;
|
||
}
|
||
.product_page-next {
|
||
display: flex;
|
||
width: 4rem;
|
||
height: 4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0.4rem 0rem 0rem 0.4rem;
|
||
background: var(--Dark-Blue-Grey);
|
||
position: absolute;
|
||
right: 0;
|
||
z-index: 9;
|
||
}
|
||
.product_page-prev svg, .product_page-next svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.product_page-pagination {
|
||
display: none;
|
||
}
|
||
.product_page_thumbs {
|
||
width: 100%;
|
||
}
|
||
.product_page_thumbs .swiper-slide {
|
||
cursor: pointer;
|
||
height: 9.9rem;
|
||
}
|
||
.product_page_thumbs .swiper-slide img {
|
||
width: 100%;
|
||
border-radius: 0.4rem;
|
||
height: 100%;
|
||
object-fit: cover;
|
||
}
|
||
.product_page-col {
|
||
width: 100%;
|
||
max-width: 60.8rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
}
|
||
.product_page-col > .price {
|
||
display: none;
|
||
}
|
||
.product_page-col > .simple-weight {
|
||
display: none;
|
||
}
|
||
.product_page-col > .stock {
|
||
display: none;
|
||
}
|
||
.product_page-col > .product_title {
|
||
display: none;
|
||
}
|
||
.product_page-col > .product_meta {
|
||
display: none;
|
||
}
|
||
.product_page-col > h2 {
|
||
text-align: left;
|
||
margin-bottom: 2rem;
|
||
}
|
||
.product_page-aviable {
|
||
display: flex;
|
||
padding: 0.8rem 1.2rem;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Light-green);
|
||
margin-bottom: 3.2rem;
|
||
}
|
||
.product_page-aviable p {
|
||
color: var(--Green);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.product_page-aviable::before {
|
||
content: '';
|
||
width: 0.7rem;
|
||
height: 0.7rem;
|
||
background: var(--Green);
|
||
border-radius: 100%;
|
||
}
|
||
.product_page-sku {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
margin-bottom: 4rem;
|
||
}
|
||
.product_page-sku p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.product_page-sku p:nth-child(2) {
|
||
color: var(--Black);
|
||
}
|
||
.product_page-form {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
width: 100%;
|
||
}
|
||
.product_page-calc {
|
||
display: flex;
|
||
flex-direction: column;
|
||
margin-bottom: 3.2rem;
|
||
width: 100%;
|
||
}
|
||
.product_page-calc__row {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 3.2rem;
|
||
margin-bottom: 2rem;
|
||
}
|
||
.product_page-calc__col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.product_page-calc__select {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.8rem;
|
||
}
|
||
.reset_variations {
|
||
display: none;
|
||
}
|
||
.variations {
|
||
width: 100%;
|
||
}
|
||
.product_page-calc__select p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.product_page-calc__select select {
|
||
cursor: pointer;
|
||
padding: 1.5rem 1.6rem;
|
||
border-radius: 0.6rem;
|
||
border: 1px solid var(--Light-Grey-3);
|
||
background: var(--White);
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
width: 100%;
|
||
background-image: url('/wp-content/uploads/2025/05/select.svg');
|
||
background-position: center right 1.6rem;
|
||
background-repeat: no-repeat;
|
||
background-size: 1.2rem;
|
||
}
|
||
.product_page-calc__select select {
|
||
-webkit-appearance: none;
|
||
-moz-appearance: none;
|
||
}
|
||
.product_page-calc__select select::-ms-expand {
|
||
display: none;
|
||
}
|
||
.product_page-calc__select option {
|
||
cursor: pointer;
|
||
color: var(--Black);
|
||
}
|
||
.product_page-calc__select input {
|
||
padding: 1.5rem 1.6rem;
|
||
border-radius: 0.6rem;
|
||
border: 1px solid var(--Light-Grey-3);
|
||
background: var(--White);
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
width: 100%;
|
||
}
|
||
.product_page-calc__prices {
|
||
display: flex;
|
||
padding-top: 2.5rem;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.8rem;
|
||
}
|
||
.product_page-calc__prices-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
}
|
||
.product_page-calc__prices-row > p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.product_page-calc__prices-row > p:nth-child(2) {
|
||
color: var(--Black);
|
||
}
|
||
.product_page-calc__prices-old {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
}
|
||
.product_page-calc__price {
|
||
color: var(--Black);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.product_page-calc__oldprice {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
text-decoration-line: line-through;
|
||
}
|
||
.product_page-calc__description {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1.2rem;
|
||
}
|
||
.product_page-calc__description p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.product_page-calc__one {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.8rem;
|
||
margin-bottom: 0.9rem;
|
||
}
|
||
.product_page-calc__one > p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.product_page-calc__one-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
}
|
||
.product_page-calc__one-price {
|
||
color: var(--Blue);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.product_page-calc__one-oldprice {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
text-decoration-line: line-through;
|
||
}
|
||
.product_page-calc__one2 p:nth-child(2) {
|
||
color: var(--Black);
|
||
font-weight: 600;
|
||
}
|
||
.woocommerce-variation {
|
||
margin-bottom: 0.3rem;
|
||
}
|
||
.product_page .cart-product__quantity {
|
||
margin-bottom: 4rem;
|
||
}
|
||
.product_page .cart-product__quantity-row input {
|
||
width: 19.2rem;
|
||
}
|
||
.product_page-weight-price {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 2.4rem;
|
||
margin-bottom: 4rem;
|
||
}
|
||
.product_page-weight {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.6rem;
|
||
}
|
||
.product_page-weight p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.product_page-weight p:nth-child(2) {
|
||
color: var(--Black);
|
||
font-size: 2.2rem;
|
||
line-height: 120%;
|
||
letter-spacing: -0.044rem;
|
||
}
|
||
.product_page-prices {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.6rem;
|
||
}
|
||
.product_page-prices > p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.product_page-prices__row {
|
||
display: flex;
|
||
align-items: baseline;
|
||
gap: 0.8rem;
|
||
}
|
||
.product_page-price {
|
||
color: var(--Blue);
|
||
font-size: 2.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
}
|
||
.product_page-oldprice {
|
||
color: var(--Grey-2);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: normal;
|
||
text-decoration-line: line-through;
|
||
}
|
||
.product_page-price span {
|
||
font-size: 1.6rem;
|
||
}
|
||
.product_page-oldprice span {
|
||
font-size: 1.2rem;
|
||
}
|
||
.product_page-submit {
|
||
width: 28.8rem;
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.product_page-info {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.product_page-tabs {
|
||
display: flex;
|
||
gap: 1.2rem;
|
||
}
|
||
.product_page-tab {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Light-Blue);
|
||
color: var(--Black);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.product_page-tab.active {
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
}
|
||
.product_page-content {
|
||
display: none;
|
||
}
|
||
.product_page-content.active {
|
||
display: block;
|
||
}
|
||
.product_page-description {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 3.2rem;
|
||
}
|
||
.product_page-description h2 {
|
||
text-align: left;
|
||
}
|
||
.product_page-description ul {
|
||
display: flex;
|
||
flex-direction: column;
|
||
padding-left: 2.5rem;
|
||
}
|
||
.product_page-description li, .product_page-description p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.product_page-description a {
|
||
color: var(--Blue);
|
||
}
|
||
.product_page-description-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1rem;
|
||
}
|
||
.product_page-docs {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 3.2rem;
|
||
}
|
||
.product_page-docs > h2 {
|
||
text-align: left;
|
||
}
|
||
.product_page-docs__grid {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.product_page-labels .product_page-aviable {
|
||
display: none;
|
||
}
|
||
.product_page-tabs__mob {
|
||
display: none;
|
||
}
|
||
.product_page-form2 .product_page-calc__one {
|
||
flex-direction: row;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
}
|
||
.product_page-form2 .product_page-calc {
|
||
margin-bottom: 2rem;
|
||
}
|
||
.product_page-form2 .product_page-calc__row {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.product_page {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.product_page-container {
|
||
gap: 4rem;
|
||
}
|
||
.product_page-main {
|
||
flex-direction: column;
|
||
gap: 2rem;
|
||
}
|
||
.product_page-images {
|
||
max-width: none;
|
||
}
|
||
.product_page-labels {
|
||
top: 1.2rem;
|
||
left: 1.2rem;
|
||
}
|
||
.product_page-labels .product_page-aviable {
|
||
display: flex;
|
||
}
|
||
.product_page-popular {
|
||
padding: 0.6rem 0.8rem;
|
||
font-size: 0.8rem;
|
||
letter-spacing: -0.016rem;
|
||
}
|
||
.product_page-discount {
|
||
padding: 0.6rem 0.8rem;
|
||
font-size: 0.8rem;
|
||
letter-spacing: -0.016rem;
|
||
}
|
||
.product_page-sale {
|
||
padding: 0.6rem 0.8rem;
|
||
}
|
||
.product_page-sale p {
|
||
font-size: 0.8rem;
|
||
letter-spacing: -0.016rem;
|
||
}
|
||
.product_page-sale svg {
|
||
width: 0.8rem;
|
||
}
|
||
.product_page-slide {
|
||
height: 34rem;
|
||
}
|
||
.product_page-prev {
|
||
display: none;
|
||
}
|
||
.product_page-next {
|
||
display: none;
|
||
}
|
||
.product_page-pagination {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
bottom: 1.2rem !important;
|
||
position: absolute;
|
||
z-index: 9;
|
||
gap: 0.4rem;
|
||
}
|
||
.product_page-pagination .swiper-pagination-bullet {
|
||
width: 1.2rem;
|
||
margin: 0 !important;
|
||
opacity: 1;
|
||
background: var(--Light-Grey-3);
|
||
height: 0.1rem;
|
||
}
|
||
.product_page-pagination .swiper-pagination-bullet-active {
|
||
background: var(--Blue);
|
||
}
|
||
.product_page_thumbs {
|
||
display: none;
|
||
}
|
||
.product_page-col {
|
||
max-width: none;
|
||
}
|
||
.product_page-col > h2 {
|
||
margin-bottom: 1.6rem;
|
||
}
|
||
.product_page-aviable {
|
||
padding: 0.6rem 0.8rem;
|
||
gap: 0.4rem;
|
||
margin-bottom: 0;
|
||
display: none;
|
||
}
|
||
.product_page-aviable p {
|
||
font-size: 0.8rem;
|
||
letter-spacing: -0.016rem;
|
||
}
|
||
.product_page-aviable::before {
|
||
width: 0.5rem;
|
||
height: 0.5rem;
|
||
}
|
||
.product_page-sku {
|
||
margin-bottom: 3.2rem;
|
||
}
|
||
.product_page-calc__row {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
gap: 2.4rem;
|
||
margin-bottom: 2.4rem;
|
||
}
|
||
.product_page-calc__prices {
|
||
padding-top: 0;
|
||
}
|
||
.product_page-calc__prices-row {
|
||
justify-content: space-between;
|
||
width: 100%;
|
||
}
|
||
.product_page .cart-product__quantity {
|
||
margin-bottom: 3.2rem;
|
||
}
|
||
.product_page .cart-product__quantity-row input {
|
||
width: 24.4rem;
|
||
}
|
||
.product_page-weight-price {
|
||
margin-bottom: 3.2rem;
|
||
}
|
||
.product_page-submit {
|
||
width: 100%;
|
||
}
|
||
.product_page-info {
|
||
gap: 2.4rem;
|
||
}
|
||
.product_page-tabs {
|
||
display: none;
|
||
}
|
||
.product_page-tabs__mob {
|
||
display: flex;
|
||
position: relative;
|
||
}
|
||
.product_page-tabs__mob-button {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
padding: 1.9rem 2rem 2rem 2rem;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--White);
|
||
width: 100%;
|
||
}
|
||
.product_page-tabs__mob-button p {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.product_page-tabs__mob-button svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
transition: .3s all;
|
||
}
|
||
.product_page-tabs__mob-button.active {
|
||
background: var(--Blue);
|
||
}
|
||
.product_page-tabs__mob-button.active p {
|
||
color: var(--White);
|
||
}
|
||
.product_page-tabs__mob-button.active svg {
|
||
transform: rotate(180deg);
|
||
}
|
||
.product_page-tabs__mob-button.active svg path {
|
||
fill: var(--White);
|
||
}
|
||
.product_page-tabs__mob-content {
|
||
display: none;
|
||
}
|
||
.product_page-tabs__mob-content.active {
|
||
display: flex;
|
||
flex-direction: column;
|
||
position: absolute;
|
||
top: 100%;
|
||
left: 0;
|
||
z-index: 9;
|
||
margin-top: 0.8rem;
|
||
border-radius: 0.4rem;
|
||
border: 1px solid var(--Blue);
|
||
background: var(--White);
|
||
box-shadow: 1px 4px 16px 0px rgba(0, 0, 0, 0.10);
|
||
width: 100%;
|
||
padding: 2rem;
|
||
gap: 0.4rem;
|
||
}
|
||
.product_page-tabs__mob-tab {
|
||
border-radius: 0.4rem;
|
||
background: var(--Light-Blue);
|
||
padding: 1.5rem 2rem;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.product_page-tabs__mob-tab p {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.product_page-tabs__mob-tab svg {
|
||
opacity: 0;
|
||
transition: .3s all;
|
||
}
|
||
.product_page-tabs__mob-tab.active svg {
|
||
opacity: 1;
|
||
}
|
||
.product_page-description h2 {
|
||
font-size: 1.6rem;
|
||
}
|
||
.product_page-description {
|
||
gap: 2rem;
|
||
}
|
||
.product_page-description li, .product_page-description p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.product_page-description-col {
|
||
gap: 2rem;
|
||
}
|
||
.product_page-docs {
|
||
gap: 2.4rem;
|
||
}
|
||
.product_page-docs > h2 {
|
||
text-align: center;
|
||
font-size: 1.6rem;
|
||
}
|
||
.product_page-docs__grid {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
gap: 1rem;
|
||
}
|
||
.product_page-form2 .product_page-calc__one {
|
||
width: 100%;
|
||
justify-content: space-between;
|
||
}
|
||
}
|
||
|
||
/* popup-cart */
|
||
|
||
.popup-cart__col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.popup-cart__name {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2.4rem;
|
||
}
|
||
.popup-cart__name p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.popup-cart__buttons {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.popup-cart__cancel {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
border: 1px solid var(--Blue);
|
||
color: var(--Blue);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
text-align: center;
|
||
}
|
||
.popup-cart__delete {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
text-align: center;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.popup-cart__col {
|
||
gap: 3.2rem;
|
||
}
|
||
.popup-cart__name {
|
||
gap: 1.6rem;
|
||
}
|
||
.popup-cart__name h4 {
|
||
text-align: center;
|
||
}
|
||
.popup-cart__name p {
|
||
text-align: center;
|
||
}
|
||
.popup-cart__buttons {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
gap: 1rem;
|
||
}
|
||
.popup-cart__name p br {
|
||
display: none;
|
||
}
|
||
}
|
||
|
||
/* checkout */
|
||
|
||
.checkout {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.checkout-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.checkout-main {
|
||
display: flex;
|
||
gap: 1.6rem;
|
||
}
|
||
.checkout-left {
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
width: 100%;
|
||
max-width: 90.1rem;
|
||
padding: 4rem;
|
||
}
|
||
.checkout-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2.4rem;
|
||
position: relative;
|
||
}
|
||
.checkout-col::before {
|
||
content: '';
|
||
position: absolute;
|
||
top: 4.8rem;
|
||
left: 2.4rem;
|
||
width: 0.1rem;
|
||
background: var(--Light-Grey-2);
|
||
height: calc(100% + 1.6rem);
|
||
}
|
||
.checkout-col:last-child::before {
|
||
display: none;
|
||
}
|
||
.checkout-name {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 2rem;
|
||
}
|
||
.checkout-name span {
|
||
display: flex;
|
||
width: 4.8rem;
|
||
height: 4.8rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 2.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 110%;
|
||
letter-spacing: -0.044rem;
|
||
}
|
||
.checkout-block {
|
||
padding-left: 6.8rem;
|
||
}
|
||
.checkout-data {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.checkout-data__tabs {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.checkout-data__tab {
|
||
display: flex;
|
||
padding: 1.9rem 0.4rem 2rem 2rem;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
border-radius: 0.6rem;
|
||
border: 1px solid transparent;
|
||
background: var(--Light-Grey);
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.checkout-data__tab::before {
|
||
content: '';
|
||
width: 1.6rem;
|
||
height: 1.6rem;
|
||
transition: .3s all;
|
||
background-image: url('/wp-content/uploads/2025/05/radio.svg');
|
||
background-position: center center;
|
||
background-repeat: no-repeat;
|
||
background-size: cover;
|
||
}
|
||
.checkout-data__tab.active {
|
||
color: var(--Blue);
|
||
border-color: var(--Blue);
|
||
}
|
||
.checkout-data__tab.active::before {
|
||
background-image: url('/wp-content/uploads/2025/05/radio-checked.svg');
|
||
}
|
||
.checkout-data__content {
|
||
display: none;
|
||
}
|
||
.checkout-data__content.active {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.checkout-data__input {
|
||
display: flex;
|
||
}
|
||
.checkout-data__input input {
|
||
color: var(--Blue);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
width: 100%;
|
||
padding: 1.9rem 0.4rem 1.9rem 2rem;
|
||
border-radius: 0.6rem;
|
||
background: var(--Light-Grey);
|
||
border: 1px solid transparent;
|
||
}
|
||
.checkout-data__input input::placeholder {
|
||
color: var(--Grey-2);
|
||
}
|
||
.checkout-delivery {
|
||
display: grid;
|
||
grid-template-columns: repeat(3, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.checkout-delivery__item {
|
||
position: relative;
|
||
display: flex;
|
||
width: 100%;
|
||
}
|
||
#add_payment_method #payment, .woocommerce-cart #payment, .woocommerce-checkout #payment {
|
||
background: transparent;
|
||
border-radius: 0;
|
||
}
|
||
#add_payment_method #payment div.form-row, .woocommerce-cart #payment div.form-row, .woocommerce-checkout #payment div.form-row {
|
||
padding: 0;
|
||
margin: 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
.woocommerce form .form-row label {
|
||
line-height: 140%;
|
||
}
|
||
.woocommerce form .form-row::after, .woocommerce form .form-row::before, .woocommerce-page form .form-row::after, .woocommerce-page form .form-row::before {
|
||
display: none;
|
||
}
|
||
#add_payment_method #payment ul.payment_methods, .woocommerce-cart #payment ul.payment_methods, .woocommerce-checkout #payment ul.payment_methods {
|
||
text-align: left;
|
||
padding: 0;
|
||
border-bottom: none;
|
||
margin: 0;
|
||
list-style: none outside;
|
||
display: none;
|
||
}
|
||
.checkout-delivery__item input {
|
||
position: absolute;
|
||
visibility: hidden;
|
||
}
|
||
.woocommerce ul#shipping_method {
|
||
margin: 0 !important;
|
||
}
|
||
.woocommerce ul#shipping_method li {
|
||
margin: 0;
|
||
display: flex;
|
||
}
|
||
.checkout-delivery__item label {
|
||
display: flex !important;
|
||
padding: 2.4rem 2.4rem 2.4rem 4.8rem;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.8rem;
|
||
border-radius: 0.8rem;
|
||
background: var(--Light-Grey);
|
||
border: 1px solid transparent;
|
||
cursor: pointer;
|
||
transition: .3s all;
|
||
height: 100%;
|
||
position: relative;
|
||
width: 100%;
|
||
}
|
||
.checkout-delivery__item label p {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.checkout-delivery__item label p:nth-child(2) {
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-weight: 500;
|
||
line-height: 140%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.checkout-delivery__item label::before {
|
||
content: '';
|
||
width: 1.6rem;
|
||
height: 1.6rem;
|
||
transition: .3s all;
|
||
background-image: url('/wp-content/uploads/2025/05/radio.svg');
|
||
background-position: center center;
|
||
background-repeat: no-repeat;
|
||
background-size: cover;
|
||
position: absolute;
|
||
top: 2.5rem;
|
||
left: 2.4rem;
|
||
}
|
||
.checkout-delivery__item input:checked+label {
|
||
border-color: var(--Blue);
|
||
}
|
||
.checkout-delivery__item input:checked+label::before {
|
||
background-image: url('/wp-content/uploads/2025/05/radio-checked.svg');
|
||
}
|
||
.checkout-comment {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 3.2rem;
|
||
}
|
||
.checkout-comment__col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2rem;
|
||
}
|
||
.checkout-comment__col textarea {
|
||
color: var(--Blue);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
width: 100%;
|
||
height: 9.6rem;
|
||
min-height: 9.6rem;
|
||
border-radius: 0.6rem;
|
||
background: var(--Light-Grey);
|
||
padding: 1.9rem 0.4rem 1.9rem 2rem;
|
||
border: 1px solid transparent;
|
||
}
|
||
.checkout-comment__col textarea::placeholder {
|
||
color: var(--Grey-2);
|
||
}
|
||
.checkout-comment__col p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.1rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 150%;
|
||
letter-spacing: -0.022rem;
|
||
}
|
||
.checkout-comment__file {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 2rem;
|
||
}
|
||
.checkout-comment__file > p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.1rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 150%;
|
||
letter-spacing: -0.022rem;
|
||
}
|
||
.checkout-comment__file-input {
|
||
position: relative;
|
||
}
|
||
.checkout-comment__file-input input {
|
||
position: absolute;
|
||
visibility: hidden;
|
||
}
|
||
.checkout-comment__file-input label {
|
||
transition: .3s all;
|
||
cursor: pointer;
|
||
display: flex;
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
}
|
||
.checkout-comment__file-input label p {
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.checkout-comment__file-input label svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.checkout-payments {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2rem;
|
||
}
|
||
.checkout-payments > p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.1rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 150%;
|
||
letter-spacing: -0.022rem;
|
||
}
|
||
.checkout-payments > p a {
|
||
color: var(--Blue);
|
||
text-decoration: underline;
|
||
}
|
||
.checkout-payment {
|
||
position: relative;
|
||
}
|
||
.checkout-payment input {
|
||
position: absolute;
|
||
visibility: hidden;
|
||
}
|
||
.checkout-payment label {
|
||
border-radius: 0.8rem;
|
||
border: 1px solid transparent;
|
||
background: var(--Light-Grey);
|
||
transition: .3s all;
|
||
position: relative;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
padding: 2.4rem;
|
||
cursor: pointer;
|
||
}
|
||
.checkout-payment label::before {
|
||
content: '';
|
||
width: 1.6rem;
|
||
height: 1.6rem;
|
||
transition: .3s all;
|
||
background-image: url('/wp-content/uploads/2025/05/radio.svg');
|
||
background-position: center center;
|
||
background-repeat: no-repeat;
|
||
background-size: cover;
|
||
}
|
||
.checkout-payment input:checked+label {
|
||
color: var(--Blue);
|
||
border-color: var(--Blue);
|
||
}
|
||
.checkout-payment input:checked+label::before {
|
||
background-image: url('/wp-content/uploads/2025/05/radio-checked.svg');
|
||
}
|
||
.checkout-right {
|
||
width: 100%;
|
||
max-width: 44.3rem;
|
||
}
|
||
.checkout-sidebar {
|
||
position: sticky;
|
||
top: 5rem;
|
||
padding: 4rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
}
|
||
.checkout-sidebar > h3 {
|
||
padding-bottom: 2.4rem;
|
||
margin-bottom: 2.4rem;
|
||
border-bottom: 0.1rem solid var(--Light-Grey-2);
|
||
}
|
||
.checkout-sidebar__col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
margin-bottom: 4rem;
|
||
}
|
||
.checkout-sidebar__row {
|
||
display: flex;
|
||
align-items: flex-end;
|
||
gap: 0.4rem;
|
||
justify-content: space-between;
|
||
}
|
||
.checkout-sidebar__row p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.checkout-sidebar__row p:nth-child(2) {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.checkout-sidebar__price-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.6rem;
|
||
margin-top: 1.6rem;
|
||
margin-bottom: 4rem;
|
||
}
|
||
.checkout-sidebar__price-title {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.checkout-sidebar__price {
|
||
color: var(--Blue);
|
||
font-size: 2.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
}
|
||
.checkout-sidebar__price span {
|
||
font-size: 1.6rem;
|
||
}
|
||
.checkout-submit {
|
||
margin-bottom: 1.6rem !important;
|
||
padding: 2.2rem 1.4rem 2.3rem 1.4rem !important;
|
||
border-radius: 0.4rem !important;
|
||
background: var(--Blue) !important;
|
||
color: var(--White) !important;
|
||
font-size: 1.6rem !important;
|
||
font-style: normal;
|
||
font-weight: 600 !important;
|
||
line-height: 120% !important;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.checkout-submit:disabled {
|
||
background: var(--Grey-1);
|
||
}
|
||
.checkout .consult-checkbox {
|
||
margin: 0;
|
||
align-items: flex-start;
|
||
}
|
||
.checkout .consult-checkbox input[type=checkbox]:before {
|
||
margin-top: 0;
|
||
}
|
||
.checkout-data__description {
|
||
color: var(--Grey-2);
|
||
font-size: 1.1rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 150%;
|
||
letter-spacing: -0.022rem;
|
||
margin-top: 0.4rem;
|
||
}
|
||
.checkout-payments__description,
|
||
.checkout-payments__online-description {
|
||
color: var(--Grey-2);
|
||
font-size: 1.1rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 150%;
|
||
letter-spacing: -0.022rem;
|
||
}
|
||
.checkout-pickup {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.checkout-pickup__block {
|
||
display: flex;
|
||
padding: 3.2rem;
|
||
align-items: flex-start;
|
||
gap: 0.8rem;
|
||
border-radius: 0.8rem;
|
||
background: var(--Light-Grey);
|
||
}
|
||
.checkout-pickup__block > svg {
|
||
width: 1.6rem;
|
||
min-width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.checkout-pickup__block-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1.2rem;
|
||
}
|
||
.checkout-pickup__block-title {
|
||
text-transform: none;
|
||
}
|
||
.checkout-pickup__block-time {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.checkout-pickup__block-description {
|
||
color: var(--Blue-Grey);
|
||
font-size: 1.1rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 150%;
|
||
letter-spacing: -0.022rem;
|
||
}
|
||
.checkout-pickup__block-link {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
color: var(--Blue);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.checkout-pickup__block-link svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.checkout-pickup__map {
|
||
height: 32rem;
|
||
}
|
||
.checkout-pickup__map iframe {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.checkout {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.checkout-container {
|
||
gap: 4rem;
|
||
}
|
||
.checkout-main {
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.checkout-left {
|
||
border-radius: 0.6rem;
|
||
gap: 4.6rem;
|
||
max-width: none;
|
||
padding: 3.2rem 1.6rem;
|
||
}
|
||
.checkout-col::before {
|
||
display: none;
|
||
}
|
||
.checkout-name {
|
||
gap: 0.8rem;
|
||
}
|
||
.checkout-name span {
|
||
width: 3.2rem;
|
||
height: 3.2rem;
|
||
font-size: 1.6rem;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.checkout-name h3 {
|
||
font-size: 1.6rem;
|
||
}
|
||
.checkout-block {
|
||
padding-left: 0;
|
||
}
|
||
.checkout-data {
|
||
gap: 1rem;
|
||
}
|
||
.checkout-data__tabs {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
gap: 1rem;
|
||
}
|
||
.checkout-data__content.active {
|
||
gap: 1rem;
|
||
}
|
||
.checkout-delivery {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
gap: 1rem;
|
||
}
|
||
.checkout-delivery__item label {
|
||
padding: 1.6rem 1.6rem 1.6rem 4rem;
|
||
border-radius: 0.6rem;
|
||
}
|
||
.checkout-delivery__item label::before {
|
||
top: 1.7rem;
|
||
left: 1.6rem;
|
||
}
|
||
.checkout-comment {
|
||
gap: 2.4rem;
|
||
}
|
||
.checkout-comment__col {
|
||
gap: 1.6rem;
|
||
}
|
||
.checkout-comment__col p {
|
||
}
|
||
.checkout-comment__file {
|
||
gap: 1.6rem;
|
||
}
|
||
.checkout-comment__file > p {
|
||
}
|
||
.checkout-comment__file-input label {
|
||
padding: 1.3rem 2rem;
|
||
gap: 0.6rem;
|
||
}
|
||
.checkout-comment__file-input label p {
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.checkout-comment__file-input label svg {
|
||
width: 1.4rem;
|
||
}
|
||
.checkout-payments {
|
||
gap: 1.6rem;
|
||
}
|
||
.checkout-payment label {
|
||
padding: 1.6rem;
|
||
}
|
||
.checkout-right {
|
||
max-width: none;
|
||
}
|
||
.checkout-sidebar {
|
||
position: relative;
|
||
top: 0;
|
||
padding: 2.4rem 1.6rem;
|
||
}
|
||
.checkout-sidebar > h3 {
|
||
padding-bottom: 1.6rem;
|
||
margin-bottom: 1.6rem;
|
||
}
|
||
.checkout-sidebar__col {
|
||
gap: 1.2rem;
|
||
}
|
||
.checkout-sidebar__row p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.checkout-sidebar__row p:nth-child(2) {
|
||
font-size: 1.6rem;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.checkout-sidebar__price-col {
|
||
gap: 1.2rem;
|
||
margin-bottom: 3.2rem;
|
||
}
|
||
.checkout-submit {
|
||
margin-bottom: 1.6rem;
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.checkout-data__description {
|
||
margin-top: 0.6rem;
|
||
}
|
||
.checkout-pickup {
|
||
gap: 1rem;
|
||
}
|
||
.checkout-pickup__block {
|
||
padding: 2rem;
|
||
}
|
||
.checkout-pickup__block-title {
|
||
margin-bottom: -0.4rem;
|
||
}
|
||
.checkout-pickup__map {
|
||
height: 24rem;
|
||
}
|
||
}
|
||
|
||
/* checkout-error */
|
||
|
||
.checkout-error {
|
||
padding: 10.4rem 2rem;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
}
|
||
.checkout-error__icon {
|
||
display: flex;
|
||
width: 6.4rem;
|
||
height: 6.4rem;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
border-radius: 100%;
|
||
background: var(--Red);
|
||
color: var(--White);
|
||
text-align: center;
|
||
font-size: 3.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 100%;
|
||
letter-spacing: -0.064rem;
|
||
margin-bottom: 4rem;
|
||
}
|
||
.checkout-error h3 {
|
||
margin-bottom: 1.6rem;
|
||
}
|
||
.checkout-error p {
|
||
color: var(--Grey-2);
|
||
text-align: center;
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.028rem;
|
||
margin-bottom: 4rem;
|
||
max-width: 43.6rem;
|
||
}
|
||
.checkout-error p a {
|
||
color: var(--Blue);
|
||
text-decoration: underline;
|
||
}
|
||
.checkout-error__link {
|
||
display: flex;
|
||
width: 24rem;
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
justify-content: center;
|
||
align-items: flex-end;
|
||
gap: 0.6rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.checkout-error__link svg {
|
||
width: 1.9rem;
|
||
height: auto;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.checkout-error {
|
||
padding: 9.6rem 1.6rem;
|
||
border-radius: 0.6rem;
|
||
}
|
||
.checkout-error p {
|
||
max-width: 28rem;
|
||
}
|
||
.checkout-error__link {
|
||
width: 24.6rem;
|
||
}
|
||
.checkout-error__link svg {
|
||
width: 1.8rem;
|
||
}
|
||
}
|
||
|
||
/* lk */
|
||
|
||
.lk {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.lk-container {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 1.6rem;
|
||
}
|
||
.lk-menu {
|
||
position: sticky;
|
||
top: 5rem;
|
||
width: 100%;
|
||
max-width: 32.8rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
.lk-menu__link {
|
||
display: flex;
|
||
padding: 2.3rem 2.4rem;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
border-bottom: 1px solid var(--Light-Grey-2);
|
||
background: var(--White);
|
||
justify-content: space-between;
|
||
}
|
||
.lk-menu__link svg {
|
||
width: 1.2rem;
|
||
height: auto;
|
||
}
|
||
.lk-menu__link.active {
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
}
|
||
.lk-menu__link.active svg path {
|
||
fill: var(--White);
|
||
}
|
||
.lk-menu__logout {
|
||
justify-content: flex-start;
|
||
}
|
||
.lk-menu__logout svg {
|
||
width: 1.6rem;
|
||
}
|
||
.lk-menu__link:hover {
|
||
color: var(--Blue);
|
||
}
|
||
.lk-menu__link:hover path {
|
||
fill: var(--Blue);
|
||
}
|
||
.lk-menu__link.active:hover {
|
||
color: var(--White);
|
||
}
|
||
.lk-menu__link.active:hover path {
|
||
fill: var(--White);
|
||
}
|
||
.lk-menu__link:first-child {
|
||
border-radius: 0.8rem 0.8rem 0rem 0rem;
|
||
}
|
||
.lk-menu__link:last-child {
|
||
border-radius: 0rem 0rem 0.8rem 0.8rem;
|
||
}
|
||
.lk-main {
|
||
width: 100%;
|
||
max-width: 101.6rem;
|
||
padding: 4rem;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
}
|
||
.profile {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.profile-main {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
max-width: 75.9rem;
|
||
}
|
||
.profile-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2.4rem;
|
||
}
|
||
.profile-inputs {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2rem;
|
||
}
|
||
.profile-input {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.8rem;
|
||
position: relative;
|
||
}
|
||
.profile-input input {
|
||
color: var(--Blue);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.028rem;
|
||
padding: 2rem;
|
||
width: 100%;
|
||
border-radius: 0.6rem;
|
||
background: var(--Light-Grey);
|
||
border: 1px solid transparent;
|
||
}
|
||
.profile-input input::placeholder {
|
||
color: var(--Grey-2);
|
||
}
|
||
.profile-input__button {
|
||
display: flex;
|
||
padding: 0.9rem 1.6rem;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
border-radius: 10rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
position: absolute;
|
||
right: 2rem;
|
||
top: 1.3rem;
|
||
}
|
||
.profile-input__button svg {
|
||
width: 1.2rem;
|
||
height: auto;
|
||
}
|
||
.profile-input > p {
|
||
color: var(--Grey-1);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 140%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.profile-password {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 1.6rem;
|
||
}
|
||
.profile-password__col {
|
||
width: 100%;
|
||
max-width: 52.6rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2rem;
|
||
}
|
||
.profile-password__button {
|
||
display: flex;
|
||
position: absolute;
|
||
right: 2rem;
|
||
top: 2rem;
|
||
}
|
||
.profile-password__button img {
|
||
width: 1.6rem;
|
||
}
|
||
.profile-password__change {
|
||
color: var(--Grey-1);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
margin-top: 1.9rem;
|
||
}
|
||
.profile-buttons {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 2rem;
|
||
}
|
||
.profile-submit {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.profile-delete {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.2rem;
|
||
color: var(--Grey-1);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.profile-delete svg {
|
||
width: 2rem;
|
||
height: auto;
|
||
}
|
||
.profile-delete:hover {
|
||
color: var(--Red);
|
||
}
|
||
.profile-delete:hover svg path {
|
||
stroke: var(--Red);
|
||
}
|
||
.lk-menu__mobile {
|
||
display: none;
|
||
}
|
||
.lk-logout__mob {
|
||
display: none;
|
||
}
|
||
.profile-hint {
|
||
display: none;
|
||
}
|
||
.profile-hint.active {
|
||
padding: 2.4rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
border-radius: 0.6rem;
|
||
border: 1px solid var(--Blue);
|
||
background: var(--White);
|
||
box-shadow: 1px 4px 16px 0px rgba(0, 0, 0, 0.10);
|
||
margin-top: 1rem;
|
||
position: absolute;
|
||
top: 100%;
|
||
left: 0;
|
||
width: 100%;
|
||
z-index: 9;
|
||
}
|
||
.profile-hint > p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.profile-hint__col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.profile-hint__item {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.6rem;
|
||
}
|
||
.profile-hint__item p:nth-child(1) {
|
||
color: var(--Black);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
text-align: left;
|
||
}
|
||
.profile-hint__item p:nth-child(2) {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
text-align: left;
|
||
}
|
||
.profile-password__col-new {
|
||
max-width: none;
|
||
}
|
||
.profile-password__new {
|
||
display: flex;
|
||
gap: 1.6rem;
|
||
}
|
||
.profile-password__new .profile-input {
|
||
width: 25.5rem;
|
||
}
|
||
.profile-password__new-submit {
|
||
padding: 1.8rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.profile-password__new-hint {
|
||
display: flex;
|
||
padding: 1.6rem;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
border-radius: 0.6rem;
|
||
background: var(--Light-Grey);
|
||
max-width: 45.7rem;
|
||
}
|
||
.profile-password__new-hint svg {
|
||
width: 1.6rem;
|
||
min-width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.profile-password__new-hint p {
|
||
color: var(--Black);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 140%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.profile-password__change:hover {
|
||
color: var(--Blue);
|
||
}
|
||
.profile-individual .profile-inputs {
|
||
max-width: 52.6rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.lk {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.lk-container {
|
||
flex-direction: column;
|
||
gap: 4.8rem;
|
||
}
|
||
.lk-menu {
|
||
display: none;
|
||
}
|
||
.lk-main {
|
||
max-width: none;
|
||
padding: 3.2rem 1.6rem;
|
||
}
|
||
.profile-main {
|
||
gap: 3.2rem;
|
||
}
|
||
.profile-inputs {
|
||
gap: 1rem;
|
||
}
|
||
.profile-input input {
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
padding: 1.6rem 1.8rem;
|
||
}
|
||
.profile-input__button {
|
||
padding: 1rem 1.8rem;
|
||
font-size: 1rem;
|
||
letter-spacing: -0.02rem;
|
||
right: 0.8rem;
|
||
top: 0.8rem;
|
||
}
|
||
.profile-input__button p {
|
||
display: none;
|
||
}
|
||
.profile-input__button-email p {
|
||
display: block;
|
||
}
|
||
.profile-password {
|
||
flex-direction: column;
|
||
gap: 2rem;
|
||
}
|
||
.profile-password__col {
|
||
max-width: none;
|
||
}
|
||
.profile-password__button {
|
||
right: 1.8rem;
|
||
top: 1.5rem;
|
||
}
|
||
.profile-password__change {
|
||
margin-top: 0;
|
||
}
|
||
.profile-submit {
|
||
width: 100%;
|
||
}
|
||
.lk-menu__mobile {
|
||
display: flex;
|
||
flex-direction: column;
|
||
width: 100%;
|
||
position: relative;
|
||
}
|
||
.lk-menu__mobile > p {
|
||
padding: 2.3rem 2rem;
|
||
border-radius: 0.8rem 0.8rem 0rem 0rem;
|
||
border-bottom: 1px solid var(--Light-Grey-2);
|
||
background: var(--White);
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.lk-menu__mobile-button {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
padding: 1.9rem 2rem 2rem 2rem;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
border-radius: 0rem 0rem 0.4rem 0.4rem;
|
||
background: var(--White);
|
||
}
|
||
.lk-menu__mobile-button p {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.lk-menu__mobile-button svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.lk-menu__mobile-button.active {
|
||
background: var(--Blue);
|
||
}
|
||
.lk-menu__mobile-button.active p {
|
||
color: var(--White);
|
||
}
|
||
.lk-menu__mobile-button.active svg {
|
||
transform: rotate(180deg);
|
||
}
|
||
.lk-menu__mobile-button.active svg path {
|
||
fill: var(--White);
|
||
}
|
||
.lk-menu__mobile-content {
|
||
display: none;
|
||
}
|
||
.lk-menu__mobile-content.active {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.4rem;
|
||
padding: 2rem;
|
||
border-radius: 0.4rem;
|
||
border: 1px solid var(--Blue);
|
||
background: var(--White);
|
||
box-shadow: 1px 4px 16px 0px rgba(0, 0, 0, 0.10);
|
||
position: absolute;
|
||
top: 100%;
|
||
width: 100%;
|
||
left: 0;
|
||
margin-top: 0.8rem;
|
||
z-index: 9;
|
||
}
|
||
.lk-menu__mobile-content__link {
|
||
padding: 1.5rem 2rem;
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Light-Blue);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.lk-menu__mobile-content__link svg {
|
||
opacity: 0;
|
||
transition: .3s all;
|
||
}
|
||
.lk-menu__mobile-content__link.active svg {
|
||
opacity: 1;
|
||
}
|
||
.lk-logout__mob {
|
||
display: flex;
|
||
padding: 2.3rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
border-bottom: 1px solid var(--Light-Grey-2);
|
||
background: var(--White);
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
color: var(--Grey-1);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
width: 100%;
|
||
}
|
||
.lk-logout__mob svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.profile-hint.active {
|
||
padding: 1.6rem;
|
||
}
|
||
.profile-hint__item p:nth-child(1) {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.profile-hint__item p:nth-child(2) {
|
||
font-size: 1.2rem;
|
||
}
|
||
.profile-password__new {
|
||
flex-direction: column;
|
||
}
|
||
.profile-password__new .profile-input {
|
||
width: 100%;
|
||
}
|
||
.profile-password__new-submit {
|
||
padding: 1.2rem 1.7rem;
|
||
font-size: 1rem;
|
||
margin-right: auto;
|
||
letter-spacing: -0.02rem;
|
||
}
|
||
.profile-password__new-hint {
|
||
padding: 1.6rem;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.8rem;
|
||
max-width: none;
|
||
}
|
||
.profile-password__new-hint p {
|
||
font-size: 1rem;
|
||
letter-spacing: -0.03rem;
|
||
max-width: 25rem;
|
||
}
|
||
.profile-individual .profile-inputs {
|
||
max-width: none;
|
||
}
|
||
}
|
||
|
||
/* popup password change */
|
||
|
||
.popup-password_change__col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
.popup-password_change__name {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2.5rem;
|
||
}
|
||
.popup-password_change__name p {
|
||
color: #7B7B7B;
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.042rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.popup-password_change__name {
|
||
align-items: center;
|
||
gap: 1.6rem;
|
||
}
|
||
.popup-password_change__name h4 {
|
||
text-align: center;
|
||
}
|
||
.popup-password_change__name p {
|
||
text-align: center;
|
||
}
|
||
}
|
||
|
||
/* popup delete acc */
|
||
|
||
.popup-delete_acc-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.popup-delete_acc-buttons {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.popup-delete_acc-yes {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
border: 1px solid var(--Blue);
|
||
color: var(--Blue);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.popup-delete_acc-no {
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.popup-delete_acc .popup-password_change__name h4 {
|
||
max-width: 20rem;
|
||
}
|
||
.popup-delete_acc .popup-password_change__name p {
|
||
max-width: 23rem;
|
||
}
|
||
.popup-delete_acc-col {
|
||
gap: 3.2rem;
|
||
}
|
||
.popup-delete_acc-buttons {
|
||
grid-template-columns: repeat(1, 1fr);
|
||
gap: 1rem;
|
||
}
|
||
}
|
||
|
||
/* orders */
|
||
|
||
.lk-orders {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
width: 100%;
|
||
max-width: 101.6rem;
|
||
}
|
||
.orders {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 3.2rem;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
padding: 4rem;
|
||
}
|
||
.orders-empty {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
padding: 4rem;
|
||
border-radius: 0.6rem;
|
||
border: 1px solid var(--Light-Grey-2);
|
||
background: var(--White);
|
||
}
|
||
.orders-empty h4 {
|
||
margin-bottom: 1.6rem;
|
||
}
|
||
.orders-empty p {
|
||
color: var(--Grey-2);
|
||
text-align: center;
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.028rem;
|
||
margin-bottom: 4rem;
|
||
}
|
||
.orders-empty a {
|
||
display: flex;
|
||
width: 24rem;
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.orders-empty a svg {
|
||
width: 1.8rem;
|
||
height: auto;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.lk-orders {
|
||
gap: 4rem;
|
||
max-width: none;
|
||
}
|
||
.orders {
|
||
padding: 3.2rem 1.6rem 1.6rem 1.6rem;
|
||
}
|
||
.orders-empty {
|
||
padding: 9.6rem 4rem;
|
||
}
|
||
}
|
||
|
||
/* orders */
|
||
|
||
.orders-main {
|
||
margin-top: 0.8rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
.orders-name {
|
||
padding-bottom: 2.4rem;
|
||
border-bottom: 1px solid var(--Light-Grey-2);
|
||
display: grid;
|
||
grid-template-columns: repeat(5, 1fr);
|
||
gap: 1.6rem;
|
||
}
|
||
.orders-name p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
line-height: 140%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.orders-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
.orders-row {
|
||
display: grid;
|
||
grid-template-columns: repeat(5, 1fr);
|
||
gap: 1.6rem;
|
||
border-bottom: 1px solid var(--Light-Grey-2);
|
||
padding: 2.4rem 0rem;
|
||
align-items: center;
|
||
}
|
||
.orders-row__number-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.6rem;
|
||
}
|
||
.orders-row__number {
|
||
color: var(--Black);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.orders-row__number-date {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.orders-row__price p {
|
||
color: var(--Black);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.orders-row__status {
|
||
display: flex;
|
||
}
|
||
.orders-row__status p {
|
||
border-radius: 0.4rem;
|
||
padding: 0.8rem 1.2rem;
|
||
text-align: center;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.orders-accept {
|
||
color: #8D53F8;
|
||
background: #F5F1FF;
|
||
}
|
||
.orders-received {
|
||
color: var(--Green);
|
||
background: var(--Light-green);
|
||
}
|
||
.orders-cancel {
|
||
color: var(--Red);
|
||
background: var(--Light-red);
|
||
}
|
||
.orders-processing {
|
||
color: #FFAC07;
|
||
background: #FFF7E8;
|
||
}
|
||
.orders-pay {
|
||
color: var(--Green);
|
||
border: 1px solid var(--Green);
|
||
}
|
||
.orders-way {
|
||
color: #1E67D3;
|
||
background: #EFF5FF;
|
||
}
|
||
.orders-row__mob {
|
||
display: none;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.orders-main {
|
||
margin-top: 0;
|
||
}
|
||
.orders-name {
|
||
display: none;
|
||
}
|
||
.orders-col {
|
||
gap: 2.4rem;
|
||
}
|
||
.orders-row {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
padding: 0 0 2.4rem 0;
|
||
}
|
||
.orders-row__number-col {
|
||
order: 2;
|
||
}
|
||
.orders-row__price {
|
||
display: none;
|
||
}
|
||
.orders-row__mob {
|
||
display: flex;
|
||
flex-direction: column;
|
||
order: 3;
|
||
gap: 0.8rem;
|
||
width: 100%;
|
||
}
|
||
.orders-row__mob-row {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.orders-row__mob-row p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.orders-row__mob-row p:nth-child(2) {
|
||
color: var(--Black);
|
||
}
|
||
}
|
||
|
||
/* order */
|
||
|
||
.order {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.order-back {
|
||
margin-right: auto;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
color: var(--Blue);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.order-back svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.order-name {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 2rem;
|
||
}
|
||
.order-main {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 4rem;
|
||
}
|
||
.order-structure {
|
||
width: 100%;
|
||
max-width: 53.1rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2.4rem;
|
||
}
|
||
.order-structure > p {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.order-products {
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
.order-product {
|
||
border-bottom: 1px solid var(--Light-Grey-2);
|
||
background: var(--White);
|
||
padding: 2.4rem 0rem;
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 1.6rem;
|
||
}
|
||
.order-product:first-child {
|
||
border-top: 1px solid var(--Light-Grey-2);
|
||
}
|
||
.order-product__img {
|
||
width: 12rem;
|
||
min-width: 12rem;
|
||
height: 12rem;
|
||
}
|
||
.order-product__img img {
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: cover;
|
||
border-radius: 0.6rem;
|
||
}
|
||
.order-product__main {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
}
|
||
.order-product__sku {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.4rem;
|
||
margin-bottom: 2.4rem;
|
||
}
|
||
.order-product__sku p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.order-product__sku p:nth-child(2) {
|
||
color: var(--Black);
|
||
}
|
||
.order-product__title {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
margin-bottom: 1.6rem;
|
||
}
|
||
.order-product__chars {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.8rem;
|
||
margin-bottom: 1.6rem;
|
||
}
|
||
.order-product__chars-row {
|
||
display: flex;
|
||
align-items: flex-end;
|
||
gap: 0.4rem;
|
||
}
|
||
.order-product__chars-row p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.order-product__chars-row p:nth-child(2) {
|
||
color: var(--Black);
|
||
}
|
||
.order-product__price {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
}
|
||
.order-data {
|
||
width: 100%;
|
||
max-width: 36.5rem;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
}
|
||
.order-data__block {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2rem;
|
||
}
|
||
.order-data__block > p {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.order-data__block-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.order-data__block-col p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.order-data__info {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2.4rem;
|
||
}
|
||
.order-data__info-col {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.order-data__info-row {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: flex-end;
|
||
gap: 0.4rem;
|
||
}
|
||
.order-data__info-row p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.order-data__info-row p:nth-child(2) {
|
||
color: var(--Black);
|
||
text-align: right;
|
||
font-size: 1.8rem;
|
||
letter-spacing: -0.036rem;
|
||
}
|
||
.order-data__prices {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.6rem;
|
||
padding-top: 2.4rem;
|
||
border-top: 1px solid #F1F1F1;
|
||
}
|
||
.order-data__prices > p {
|
||
color: var(--Grey-2);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.order-data__prices-row {
|
||
display: flex;
|
||
align-items: flex-end;
|
||
}
|
||
.order-data__price {
|
||
color: var(--Blue);
|
||
font-size: 2.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
}
|
||
.order-data__price span {
|
||
font-size: 1.6rem;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.order {
|
||
gap: 3.2rem;
|
||
}
|
||
.order-name {
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1.2rem;
|
||
}
|
||
.order-main {
|
||
flex-direction: column;
|
||
gap: 3.2rem;
|
||
}
|
||
.order-structure {
|
||
max-width: none;
|
||
gap: 1.6rem;
|
||
}
|
||
.order-structure > p {
|
||
font-size: 1.6rem;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.order-product {
|
||
gap: 1.2rem;
|
||
}
|
||
.order-product__img {
|
||
width: 6.4rem;
|
||
min-width: 6.4rem;
|
||
height: 6.4rem;
|
||
}
|
||
.order-product__img img {
|
||
border-radius: 0.4rem;
|
||
}
|
||
.order-product__sku {
|
||
gap: 0.2rem;
|
||
margin-bottom: 1.6rem;
|
||
}
|
||
.order-product__sku p {
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.order-product__chars {
|
||
margin-bottom: 2.4rem;
|
||
}
|
||
.order-data {
|
||
max-width: none;
|
||
gap: 2.4rem;
|
||
}
|
||
.order-data__block {
|
||
gap: 1.6rem;
|
||
}
|
||
.order-data__block > p {
|
||
font-size: 1.6rem;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.order-data__block-col {
|
||
gap: 1.2rem;
|
||
}
|
||
.order-data__block-col p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.order-data__info {
|
||
margin-top: 0.8rem;
|
||
}
|
||
.order-data__info-col {
|
||
gap: 1.2rem;
|
||
}
|
||
.order-data__info-row p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.order-data__info-row p:nth-child(2) {
|
||
font-size: 1.6rem;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.order-data__prices > p {
|
||
font-size: 1.4rem;
|
||
letter-spacing: -0.028rem;
|
||
}
|
||
.order-data__prices-row {
|
||
display: flex;
|
||
align-items: flex-end;
|
||
}
|
||
}
|
||
|
||
/* thanks */
|
||
|
||
.thanks {
|
||
margin-bottom: 14.4rem;
|
||
}
|
||
.thanks-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 6.4rem;
|
||
}
|
||
.thanks-main {
|
||
padding: 4rem;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2.4rem;
|
||
}
|
||
.thanks .order-structure {
|
||
max-width: 87.5rem;
|
||
}
|
||
.thanks-link {
|
||
display: flex;
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
justify-content: center;
|
||
align-items: flex-end;
|
||
gap: 0.6rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
margin-right: auto;
|
||
}
|
||
.thanks-link svg {
|
||
width: 1.8rem;
|
||
height: auto;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.thanks {
|
||
margin-bottom: 9.6rem;
|
||
}
|
||
.thanks-container {
|
||
gap: 4rem;
|
||
}
|
||
.thanks-main {
|
||
padding: 3.2rem 1.6rem;
|
||
gap: 3.2rem;
|
||
}
|
||
.thanks .order-structure {
|
||
max-width: 87.5rem;
|
||
}
|
||
.thanks-link {
|
||
width: 100%;
|
||
}
|
||
}
|
||
|
||
/* minicart */
|
||
|
||
.minicart__fon {
|
||
display: none;
|
||
background: rgba(44, 56, 70, 0.10);
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
z-index: 998;
|
||
}
|
||
.minicart {
|
||
display: none;
|
||
position: absolute;
|
||
top: 15rem;
|
||
right: 13.5rem;
|
||
width: 100%;
|
||
max-width: 64.5rem;
|
||
z-index: 999;
|
||
border-radius: 0.8rem;
|
||
background: var(--White);
|
||
flex-direction: column;
|
||
gap: 4rem;
|
||
padding: 4rem;
|
||
}
|
||
.minicart-products {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
max-height: 25rem;
|
||
overflow-y: auto;
|
||
padding-right: 1rem;
|
||
}
|
||
.minicart-product {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 1.6rem;
|
||
}
|
||
.minicart-product__img {
|
||
width: 7.2rem;
|
||
min-width: 7.2rem;
|
||
height: 7.2rem;
|
||
display: flex;
|
||
}
|
||
.minicart-product__img img {
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: cover;
|
||
border-radius: 0.4rem;
|
||
}
|
||
.minicart-product__main {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: flex-start;
|
||
width: 100%;
|
||
}
|
||
.minicart-product__title {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
text-transform: uppercase;
|
||
max-width: 33.7rem;
|
||
}
|
||
.minicart-product__title span {
|
||
color: var(--Grey-2);
|
||
}
|
||
.minicart-product__row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1.6rem;
|
||
}
|
||
.minicart-product__price {
|
||
color: var(--Black);
|
||
font-size: 1.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
flex-wrap: wrap;
|
||
}
|
||
.minicart-product__oldprice {
|
||
color: var(--Grey-2);
|
||
font-size: 1.4rem;
|
||
font-weight: 600;
|
||
text-decoration: line-through;
|
||
}
|
||
.minicart-product__delete {
|
||
display: flex;
|
||
}
|
||
.minicart-product__delete svg {
|
||
width: 2rem;
|
||
height: auto;
|
||
}
|
||
.minicart-product__delete:hover svg path {
|
||
fill: var(--Grey-2);
|
||
}
|
||
.minicart-bottom {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: flex-end;
|
||
padding-top: 1.6rem;
|
||
border-top: 0.1rem solid var(--Light-Grey-2);
|
||
}
|
||
.minicart-prices {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1.2rem;
|
||
}
|
||
.minicart-price__title {
|
||
color: var(--Grey-2);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.minicart-price {
|
||
color: var(--Blue);
|
||
font-size: 2.8rem;
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
line-height: 130%;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 10px;
|
||
flex-wrap: wrap;
|
||
}
|
||
.minicart-price__old {
|
||
color: var(--Grey-2);
|
||
font-size: 1.6rem;
|
||
font-weight: 600;
|
||
text-decoration: line-through;
|
||
}
|
||
.minicart-price span span {
|
||
font-size: 1.6rem;
|
||
}
|
||
.minicart-link {
|
||
display: flex;
|
||
padding: 2.2rem 2.4rem 2.3rem 2.4rem;
|
||
justify-content: center;
|
||
align-items: flex-end;
|
||
gap: 0.6rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.minicart-link svg {
|
||
width: 1.8rem;
|
||
height: auto;
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.minicart {
|
||
top: 10.2rem;
|
||
right: 1rem;
|
||
max-width: 34rem;
|
||
gap: 3.2rem;
|
||
padding: 2.4rem 1.6rem;
|
||
}
|
||
.minicart-product {
|
||
gap: 1.2rem;
|
||
}
|
||
.minicart-product__img {
|
||
width: 6.4rem;
|
||
min-width: 6.4rem;
|
||
height: 6.4rem;
|
||
}
|
||
.minicart-product__main {
|
||
flex-direction: column;
|
||
gap: 1.6rem;
|
||
}
|
||
.minicart-product__title {
|
||
font-size: 1.2rem;
|
||
max-width: none;
|
||
}
|
||
.minicart-product__row {
|
||
gap: 1.2rem;
|
||
}
|
||
.minicart-product__price {
|
||
font-size: 1rem;
|
||
}
|
||
.minicart-product__delete svg {
|
||
width: 1.6rem;
|
||
}
|
||
.minicart-bottom {
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1rem;
|
||
}
|
||
.minicart-prices {
|
||
gap: 0.8rem;
|
||
}
|
||
.minicart-price__title {
|
||
font-size: 1.2rem;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.minicart-price {
|
||
font-size: 1.8rem;
|
||
}
|
||
.minicart-price span {
|
||
font-size: 1.8rem;
|
||
}
|
||
.minicart-link {
|
||
width: 100%;
|
||
}
|
||
}
|
||
|
||
/* pc_menu */
|
||
|
||
.change .bar:nth-child(1) {
|
||
transform: rotate(-45deg) translate(-0.3rem, 0.4rem);
|
||
}
|
||
.change .bar:nth-child(2) {
|
||
opacity: 0;
|
||
}
|
||
.change .bar:nth-child(3) {
|
||
transform: rotate(45deg) translate(-0.4rem, -0.6rem);
|
||
}
|
||
.pc_menu__fon {
|
||
display: none;
|
||
}
|
||
.pc_menu__fon.active {
|
||
display: flex;
|
||
background: var(--black-blue-10);
|
||
position: fixed;
|
||
top: 14.4rem;
|
||
left: 0;
|
||
width: 100%;
|
||
height: calc(100vh - 14.4rem);
|
||
z-index: 998;
|
||
}
|
||
.pc_menu {
|
||
display: none;
|
||
}
|
||
.pc_menu.active {
|
||
z-index: 999;
|
||
display: flex;
|
||
position: fixed;
|
||
top: 14.4rem;
|
||
left: 4rem;
|
||
box-shadow: 8px 8px 10px 0px rgba(0, 0, 0, 0.04);
|
||
background: #FFF;
|
||
}
|
||
.pc_menu .topmenu > li {
|
||
list-style: none;
|
||
}
|
||
.pc_menu .topmenu {
|
||
display: flex;
|
||
flex-direction: column;
|
||
width: 25.9rem;
|
||
position: relative;
|
||
}
|
||
.pc_menu .topmenu > li > a {
|
||
border-bottom: 1px solid var(--Light-Grey-2);
|
||
background: var(--White);
|
||
display: flex;
|
||
padding: 1.2rem;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
justify-content: space-between;
|
||
height: 6rem;
|
||
}
|
||
.pc_menu-link svg {
|
||
transition: .3s all;
|
||
width: 1.2rem;
|
||
height: auto;
|
||
}
|
||
.pc_menu-link__row {
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
}
|
||
.pc_menu-link__row img {
|
||
width: 3.6rem;
|
||
}
|
||
.pc_menu .submenu {
|
||
position: absolute;
|
||
z-index: 5;
|
||
width: 25.9rem;
|
||
left: 100%;
|
||
visibility: hidden;
|
||
opacity: 0;
|
||
transform-origin: 0% 0%;
|
||
transform: rotateX(-90deg);
|
||
transition: .3s linear;
|
||
top: 0;
|
||
height: 100%;
|
||
border-bottom: 1px solid var(--Light-Grey);
|
||
border-left: 1px solid var(--Light-Grey);
|
||
background: var(--White);
|
||
box-shadow: 8px 8px 10px 0px rgba(0, 0, 0, 0.04);
|
||
}
|
||
.pc_menu .submenu li {
|
||
list-style: none;
|
||
}
|
||
.pc_menu .submenu li a {
|
||
border-bottom: 1px solid var(--Light-Grey);
|
||
border-left: 1px solid var(--Light-Grey);
|
||
background: var(--White);
|
||
color: var(--Black);
|
||
font-size: 1.4rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.028rem;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
height: 6rem;
|
||
padding: 1.2rem;
|
||
}
|
||
.pc_menu .submenu li a svg {
|
||
width: 1.2rem;
|
||
height: auto;
|
||
transition: .3s all;
|
||
transform: rotate(-90deg);
|
||
}
|
||
.pc_menu .submenu .submenu {
|
||
position: absolute;
|
||
left: 100%;
|
||
transition: .3s linear;
|
||
}
|
||
.pc_menu nav li:hover > .submenu {
|
||
transform: rotateX(0deg);
|
||
visibility: visible;
|
||
opacity: 1;
|
||
}
|
||
.pc_menu nav li:hover > a svg path {
|
||
fill: var(--Blue);
|
||
}
|
||
.pc_menu nav .topmenu > li:hover > a svg {
|
||
transform: rotate(-90deg);
|
||
}
|
||
.pc_menu nav .submenu li:hover > a {
|
||
color: var(--Blue);
|
||
}
|
||
body.hidden {
|
||
overflow: hidden;
|
||
}
|
||
.menu_mob {
|
||
display: none;
|
||
}
|
||
.header-catalog__button-mob {
|
||
display: none;
|
||
}
|
||
.pc_menu-home.active {
|
||
position: absolute;
|
||
top: 16rem;
|
||
}
|
||
.checkout-description {
|
||
display: none;
|
||
color: var(--Grey-2);
|
||
font-size: 1.6rem;
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
line-height: 120%;
|
||
letter-spacing: -0.032rem;
|
||
}
|
||
.checkout-description a {
|
||
text-decoration: underline;
|
||
}
|
||
body.page {
|
||
margin-bottom: 0 !important;
|
||
}
|
||
#callback-form input[type="text"], #callback-form input[type="tel"], #callback-form input[type="email"] {
|
||
background: var(--Light-Grey);
|
||
}
|
||
|
||
@media screen and (max-width: 992px) {
|
||
.header-catalog__button {
|
||
display: none;
|
||
}
|
||
.header-catalog__button-mob {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.8rem;
|
||
background: var(--Blue);
|
||
width: 4rem;
|
||
min-width: 4rem;
|
||
height: 4rem;
|
||
padding: 1.3rem 1.2rem;
|
||
border-radius: 0.4rem;
|
||
}
|
||
.menu_mob.active {
|
||
display: flex;
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
overflow: auto;
|
||
z-index: 997;
|
||
background: #FFF;
|
||
padding-bottom: 4rem;
|
||
flex-direction: column;
|
||
gap: 1rem;
|
||
padding-top: 1.6rem;
|
||
}
|
||
.menu_mob-logo {
|
||
margin-left: 1.6rem;
|
||
display: flex;
|
||
margin-right: auto;
|
||
}
|
||
.menu_mob-logo img {
|
||
width: 13rem;
|
||
}
|
||
.menu_mob-close {
|
||
position: absolute;
|
||
top: 1.6rem;
|
||
right: 1.6rem;
|
||
display: flex;
|
||
}
|
||
.menu_mob-close svg {
|
||
width: 2rem;
|
||
height: auto;
|
||
}
|
||
.menu_mob-column {
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
.menu_mob-column > nav {
|
||
margin-bottom: 3.2rem;
|
||
padding: 0 1.6rem;
|
||
}
|
||
.menu_mob-column > nav ul {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1rem;
|
||
}
|
||
.menu_mob-column > nav ul li {
|
||
list-style: none;
|
||
display: flex;
|
||
}
|
||
.menu_mob-column > nav ul li a {
|
||
color: #000;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.menu_mob-menu {
|
||
display: flex;
|
||
flex-direction: column;
|
||
margin-bottom: 2.4rem;
|
||
}
|
||
.menu_mob-menu__button {
|
||
border-bottom: 1px solid var(--Light-Grey-2);
|
||
background: var(--White);
|
||
display: flex;
|
||
padding: 0.8rem 1.6rem;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
justify-content: space-between;
|
||
}
|
||
.menu_mob-menu__button svg {
|
||
transition: .3s all;
|
||
width: 1.2rem;
|
||
height: auto;
|
||
}
|
||
.menu_mob-button-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
}
|
||
.menu_mob-button-row img {
|
||
width: 2rem;
|
||
}
|
||
.menu_mob-button-row p {
|
||
color: var(--Black);
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 130%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.menu_mob-bottom {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2.4rem;
|
||
padding: 0 1.6rem;
|
||
}
|
||
.menu_mob-contacts {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 1.2rem;
|
||
}
|
||
.menu_mob-contacts a {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.6rem;
|
||
color: #808080;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.menu_mob-contacts a svg {
|
||
width: 1.2rem;
|
||
height: auto;
|
||
}
|
||
.menu_mob-buttons {
|
||
display: flex;
|
||
gap: 1rem;
|
||
}
|
||
.menu_mob-button {
|
||
display: flex;
|
||
padding: 0.4rem 1.2rem 0.4rem 0.4rem;
|
||
align-items: center;
|
||
gap: 0.2rem;
|
||
border-radius: 0.4rem;
|
||
background: var(--Light-Grey);
|
||
color: var(--Blue-Black);
|
||
text-align: center;
|
||
font-size: 1.2rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 110%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.menu_mob-button__icon {
|
||
width: 3.2rem;
|
||
height: 3.2rem;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
position: relative;
|
||
}
|
||
.menu_mob-button__icon svg {
|
||
width: 1.6rem;
|
||
height: auto;
|
||
}
|
||
.menu_mob-button__icon span {
|
||
display: flex;
|
||
padding: 0.2rem 0.4rem;
|
||
position: absolute;
|
||
right: 0.2rem;
|
||
top: 0.2rem;
|
||
border-radius: 10rem;
|
||
background: var(--Blue);
|
||
color: var(--White);
|
||
text-align: center;
|
||
leading-trim: both;
|
||
text-edge: cap;
|
||
font-size: 0.6rem;
|
||
font-style: normal;
|
||
font-weight: 600;
|
||
line-height: 120%;
|
||
letter-spacing: -0.024rem;
|
||
}
|
||
.menu_mob-menu__content-name {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1.2rem;
|
||
padding: 0 1.6rem;
|
||
}
|
||
.menu_mob-menu__content-back {
|
||
display: flex;
|
||
}
|
||
.menu_mob-menu__content-back svg {
|
||
width: 2rem;
|
||
height: auto;
|
||
}
|
||
.menu_mob-menu__content {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 2.9rem;
|
||
}
|
||
.pc_menu.active {
|
||
display: none;
|
||
}
|
||
}
|
||
|
||
/* hovers */
|
||
|
||
.header-catalog__button:hover,
|
||
.categories-more:hover,
|
||
.product_item-link:hover,
|
||
.footer-callback:hover,
|
||
.consult-submit:hover,
|
||
.product_page-submit:hover,
|
||
.aboutus-link:hover,
|
||
.projects-more:hover,
|
||
.page_404-link:hover,
|
||
.cart-submit:hover,
|
||
.cart-empty__link:hover,
|
||
.popup-cart__delete:hover,
|
||
.checkout-comment__file-input label:hover,
|
||
.checkout-submit:hover,
|
||
.checkout-error__link:hover,
|
||
.login-form__submit:hover,
|
||
.popup-registration__submit:hover,
|
||
.profile-input__button:hover,
|
||
.profile-submit:hover,
|
||
.profile-password__new-submit:hover,
|
||
.popup-delete_acc-no:hover,
|
||
.orders-empty a:hover,
|
||
.thanks-link:hover
|
||
{
|
||
background: var(--Dark-Blue);
|
||
}
|
||
.header-catalog__button:focus,
|
||
.categories-more:focus,
|
||
.product_item-link:focus,
|
||
.footer-callback:focus,
|
||
.consult-submit:focus,
|
||
.product_page-submit:focus,
|
||
.aboutus-link:focus,
|
||
.projects-more:focus,
|
||
.page_404-link:focus,
|
||
.cart-submit:focus,
|
||
.cart-empty__link:focus,
|
||
.popup-cart__delete:focus,
|
||
.checkout-comment__file-input label:focus,
|
||
.checkout-submit:focus,
|
||
.checkout-error__link:focus,
|
||
.login-form__submit:focus,
|
||
.popup-registration__submit:focus,
|
||
.profile-input__button:focus,
|
||
.profile-submit:focus,
|
||
.profile-password__new-submit:focus,
|
||
.popup-delete_acc-no:focus,
|
||
.orders-empty a:focus,
|
||
.thanks-link:focus
|
||
{
|
||
background: var(--Dark-Blue-Grey);
|
||
}
|
||
.product_item-title:hover,
|
||
.footer-menu ul li a:hover,
|
||
.footer-menu ul li a.active,
|
||
.footer-copyright__row a:hover,
|
||
.footer-contacts__item a:hover,
|
||
.catalog_page-menu__item-content-item-row a:hover,
|
||
.catalog_page-menu__item-content-item-content a:hover,
|
||
.contacts-item__col > a:hover,
|
||
.login-form__link:hover
|
||
{
|
||
color: var(--Blue);
|
||
}
|
||
.products-prev:hover,
|
||
.products-next:hover,
|
||
.product_page-prev:hover,
|
||
.product_page-next:hover,
|
||
.partners-prev:hover,
|
||
.partners-next:hover,
|
||
.history-prev:hover,
|
||
.history-next:hover,
|
||
.catalog_page-pagination-item:hover,
|
||
.product_page-tab:hover,
|
||
.documentation-tab:hover
|
||
{
|
||
background: var(--Blue);
|
||
}
|
||
.link-more:hover,
|
||
.cart_more-link:hover,
|
||
.checkout-pickup__block-link:hover,
|
||
.login-form__actions-row a:hover,
|
||
.popup-registration__code-button:hover,
|
||
.order-back:hover
|
||
{
|
||
color: var(--Dark-Blue);
|
||
}
|
||
.link-more:hover path,
|
||
.cart_more-link:hover path,
|
||
.checkout-pickup__block-link:hover path,
|
||
.login-form__actions-row a:hover path,
|
||
.popup-registration__code-button:hover path,
|
||
.order-back:hover path
|
||
{
|
||
fill: var(--Dark-Blue);
|
||
}
|
||
.link-more:focus,
|
||
.cart_more-link:focus,
|
||
.checkout-pickup__block-link:focus,
|
||
.login-form__actions-row a:focus,
|
||
.popup-registration__code-button:focus,
|
||
.order-back:focus
|
||
{
|
||
color: var(--Dark-Blue-Grey);
|
||
}
|
||
.link-more:focus path,
|
||
.cart_more-link:focus path,
|
||
.checkout-pickup__block-link:focus path,
|
||
.login-form__actions-row a:focus path,
|
||
.popup-registration__code-button:focus path,
|
||
.order-back:focus path
|
||
{
|
||
fill: var(--Dark-Blue-Grey);
|
||
}
|
||
.breadcumbs ul li a:hover
|
||
{
|
||
color: var(--Dark-Blue);
|
||
}
|
||
.catalog_page-pagination-item:hover, .product_page-tab:hover, .documentation-tab:hover {
|
||
color: var(--White);
|
||
}
|
||
.cart-product__delete:hover {
|
||
color: var(--Red);
|
||
}
|
||
.cart-product__delete:hover path {
|
||
stroke: var(--Red);
|
||
}
|
||
.popup-cart__cancel:hover, .popup-delete_acc-yes:hover {
|
||
border-color: var(--Dark-Blue);
|
||
color: var(--Dark-Blue);
|
||
}
|
||
.popup-cart__cancel:focus, .popup-delete_acc-yes:focus {
|
||
border-color: var(--Dark-Blue-Grey);
|
||
color: var(--Dark-Blue-Grey);
|
||
}
|
||
.catalog_page-pagination-item:hover path {
|
||
stroke: var(--White);
|
||
}
|
||
.header-catalog__button.change {
|
||
background: var(--Blue-Black);
|
||
}
|
||
.consult-form input[type="text"]:hover, .consult-form input[type="tel"]:hover, .consult-form input[type="email"]:hover {
|
||
border-color: var(--Blue);
|
||
}
|
||
.consult-form input[type="text"]:focus, .consult-form input[type="tel"]:focus, .consult-form input[type="email"]:focus {
|
||
border-color: var(--Blue);
|
||
}
|
||
.checkout-data__input input:hover {
|
||
border-color: var(--Blue);
|
||
}
|
||
.checkout-data__input input:focus {
|
||
border-color: var(--Blue);
|
||
}
|
||
.checkout-comment__col textarea:hover {
|
||
border-color: var(--Blue);
|
||
}
|
||
.checkout-comment__col textarea:focus {
|
||
border-color: var(--Blue);
|
||
}
|
||
.login-form__input input:hover {
|
||
border-color: var(--Blue);
|
||
}
|
||
.login-form__input input:focus {
|
||
border-color: var(--Blue);
|
||
}
|
||
.popup-registration__input input:hover {
|
||
border-color: var(--Blue);
|
||
}
|
||
.popup-registration__input input:focus {
|
||
border-color: var(--Blue);
|
||
}
|
||
.profile-input input:hover {
|
||
border-color: var(--Blue);
|
||
}
|
||
.profile-input input:focus {
|
||
border-color: var(--Blue);
|
||
}
|
||
.checkout-submit:disabled:hover {
|
||
background: var(--Grey-1);
|
||
}
|
||
|
||
/* Mini-cart strikethrough price */
|
||
.mini-cart-old-price {
|
||
color: var(--Grey-2);
|
||
font-size: 0.85em;
|
||
margin-left: 5px;
|
||
}
|
||
.woocommerce-mini-cart-item .quantity {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
align-items: center;
|
||
gap: 3px;
|
||
} |