body,
html {
background: #ffffff;
color: var(--color_black);
font-family: 'Manrope', serif !important;
font-size: var(--small_text);
font-style: normal;
font-weight: 500;
line-height: var(--main_line_height);
letter-spacing:var(--letter_spacing_main) !important;
}
h1, h2, h3, h4, h5, h6 {
font-weight: 500;
}
button,
input {
outline: 0;
appearance: none;
-webkit-appearance: none;
border-radius: 0;
font-family: 'Manrope', serif!important;
color: var(--color_black);
font-size: var(--small_text);
font-style: normal;
font-weight: 500;
line-height: var(--main_line_height);
letter-spacing:var(--letter_spacing_main);
}
:root {
--color_black: #212121;
--mobile_menu_text: #212121;
--color_accent: #000000;
--color_red: #da0000;
--color_gray: #757575;
--color_border: #e0e0e0;
--mobile_menu_bg: #FFFFFF;
--letter_spacing_main: 0.02em;
--letter_spacing_wide: 0.08em;
--main_line_height: 1.5;
--big_padding_left: 40px;
--small_text: 13px;
--big_title: 42px;
--banner_title: 36px;
--medium_title: 24px;
--border_radius: 0;
--transition: 0.3s ease;
}
.flex{
display: flex;
justify-content: space-between;
align-items: center;
}
.box-wrap{
padding: 0 var(--big_padding_left);
position: relative;
box-sizing: border-box;
max-width: 1920px;
margin:0 auto;
width: 100%;
}
.dev img{
width: 100%;
}
.dev{
display: flex;
transition-duration: 0.3s;
opacity: 0.7;
width: 66px;
}
.btm-grid{
display: flex;
align-items: center;
grid-gap: 16px;
}
.btm-bottom{
padding: 24px 0;
border-top: 1px solid rgba(255, 255, 255, 0.1);
text-align: center;
}
.btm-bottom .license{
margin-bottom: 10px;
}
.btm-bottom .dev{
margin: 0 auto;
}
.pay_list{
display: flex;
justify-content: flex-start;
grid-gap: 16px;
margin-top: 16px;
}
.pay_list img{
height: 15px;
}
.btm-grid .switcher__currencies{
/* display: none;*/
}
.switcher.btm-grid{
margin-left: 68px;
}
.switcher__link{
text-transform: none;
transition-duration: 0.3s;
}
.switcher__link.active,.switcher__link:hover{
opacity: 0.3;
cursor: pointer;
transition-duration: 0.3s;
}
.switcher__visible {
display: flex;
align-items: center;
cursor: pointer;
}
.switcher__hidden {
position: absolute;
bottom: 30px;
border: 1px solid rgba(33, 33, 33, 0.10);
width: 50px;
opacity: 0;
background: white;
visibility: hidden;
right: -3px;
padding: 8px;
}
.switcher__hidden button {
width: 100%;
box-sizing: border-box;
margin: 3px 0;
}
button {
appearance: none;
background: none;
outline: none;
margin: 0;
padding: 0;
}
.switcher__item.active .switcher__hidden {
pointer-events: all;
opacity: 1;
visibility: visible;
}
.switcher__item {
position: relative;
grid-gap: 10px;
}
.btm-logo{
display: flex;
width: 65px;
margin-bottom: 20px;
}
.btm-logo img{
transition-duration: 0.3s;
width: 100%;
}
.btm-flex{
display: flex;
align-items:stretch;
justify-content: space-between;
}
.btm-info{
font-style: normal;
}
.schedule{
margin-top: 10px;
}
.additional_menu .schedule{
margin-top: 30px;
margin-bottom: 30px;
}
.additional_menu .schedule p:last-child {
text-decoration: none;
}
.additional_menu .social_list{
grid-gap: 12px;
}
.additional_menu .social_list a{
width: 20px;
}
.additional_menu .switcher.btm-grid {
margin-left: 0;
margin-bottom: 30px;
}
.additional_menu .schedule a{
text-transform: none;
}
.additional_menu .schedule p{
line-height: var(--main_line_height);
}
.schedule p:last-child{
margin-bottom: 0;
}
.schedule p{
margin-bottom: 8px;
}
.schedule a{
text-transform: none;
}
.schedule a{
position: relative;
}
.schedule a:before{
display: none;
}
.btm-item_title{
margin-bottom: 20px;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
}
.btm-col_title{
letter-spacing: var(--letter_spacing_wide);
}
.text_transform_class{
text-transform: uppercase;
}
.footer .fn_menu_list{
gap: 10px;
display: flex;
flex-direction: column;
align-items: flex-start;
}
.fn_menu_list a,.categories_menu__link{
transition: var(--transition);
text-transform: none;
color: var(--color_gray);
}
.social_list_mob.social_list{
display: none;
}
.btm-item_sub{
/*display: flex;
flex-direction: column;
justify-content: space-between;*/
max-width: 290px;
}
.footer {
background: var(--color_black);
color: #ffffff;
}
.footer a {
color: #ffffff;
text-decoration: none;
}
.footer .fn_menu_list a {
color: rgba(255, 255, 255, 0.7);
}
.footer .social_list a {
color: #ffffff;
}
.footer img {
filter: invert(1);
}
.footer .field-input_subscribe {
background: transparent;
border: 1px solid #ffffff !important;
color: #ffffff;
}
.footer .field-input_subscribe::placeholder {
color: rgba(255, 255, 255, 0.6);
}
.btm-top{
padding: 60px 0 40px 0;
border-top: none;
}
.btm-col_title{
line-height: var(--main_line_height); /* 20.8px */
}
.social_list{
display: flex;
align-items: center;
grid-gap: 13px;
margin-top: 20px;
}
.social_list a{
display: flex;
width: 24px;
height: 24px;
color: #ffffff;
transition: opacity 0.3s ease;
}
.social_list a svg{
width: 100%;
height: 100%;
}
.social_list img{
transition-duration: 0.3s;
width: 100%;
}
.form_flex {
position: relative;
}
.field-wrap {
width: 100%;
position: relative;
}
.field-wrap.field-wrap--subscribe {
margin-bottom: 0!important;
flex-direction: column;
text-align: center;
align-items: center;
}
.field-wrap input {
box-sizing: border-box;
-webkit-appearance: none;
width: 100%;
}
.form__button--subscribe {
padding-right: 0!important;
}
.form__button--subscribe{
transition-duration: 0.3s;
}
.field-wrap .field-input_subscribe {
padding: 0 15px!important;
border: 1px solid rgba(33, 33, 33, 0.4) !important;
height: 40px;
color: var(--color_black);
}
.footer .field-wrap .field-input_subscribe {
border: 1px solid rgba(255, 255, 255, 0.4) !important;
color: #ffffff;
}
.form_flex button {
position: absolute;
right: 9px;
top: 0;
width: 7px;
display: flex;
align-items: center;
justify-content: flex-end;
padding: 0;
height: 100%;
transition: all .3s ease-in-out;
}
.form__button--subscribe{
opacity: 0.4;
}
.fn_subscribe_form{
margin: 20px 0;
}
.subscribe_error,.subscribe_success{
position: relative;
/* top: 73px; */
color: #ffffff;
background-color: transparent;
margin-left: 0;
padding: 5px 9px;
border: 1px solid #ffffff;
text-align: center;
margin-top: 5px;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
}
label.error {
position: absolute;
top: -7px;
left: 6px;
color: red;
padding: 0 5px;
background-color: #ffffff;
margin-left: 4px;
font-size: 10px;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
}
label#subscribe_email-error {
background-color: var(--color_black);
}
.height{
/* height: 70px;
margin: 0;
padding: 0;*/
}
.header{
background: #ffffff;
z-index: 102;
position: fixed;
top: var(--announcement-height);
left: 0;
right: 0;
display: flex;
flex-direction: column;
width: 100%;
height: var(--header-height);
border-bottom: 1px solid rgba(33, 33, 33, 0.08);
}
.top-bottom{
position: relative;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
height: 70px;
}
.search_icon{
height: 20px;
width: 20px;
}
.search_icon svg{
height: 100%;
width: 100%;
}
.burger_block {
width: 45px;
height: 22px;
position: relative;
transition: ease-in-out 0.35s;
}
.burger_block div {
display: block;
position: absolute;
left: 0;
width: 100%;
height: 1px;
transition: 200ms linear;
}
.line_one{
top: 6px;
border-top: 1px solid #000000;
}
.line_two{
bottom: 5px;
border-bottom: 1px solid #000000;
}
.logo{
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
height: 35px;
}
.logo img{
transition: var(--transition);
height: 100%;
}
.top-left{
display: flex;
align-items: center;
gap: 30px;
}
.top-right{
display: flex;
align-items: center;
gap: 30px;
justify-content: flex-end;
margin-right: 10px;
}
.top-top{
background: var(--color_black);
color: #ffffff;
padding: 10px;
line-height: 1.2;
letter-spacing: var(--letter_spacing_wide);
text-align: center;
text-transform: none;
}
.banner_group_image img {
width: 100%;
display: block;
object-fit: cover;
object-position: center;
height: calc(100vh - 106px);
}
.banner_group_image .banner_video {
width: 100%;
display: block;
height: auto;
-webkit-transform: translateZ(0);
transform: translateZ(0);
}
.banner_group_image {
position: relative;
}
/* Video banner - auto height */
.banner_group_image:has(.banner_video),
.banner_group_image.has-video {
height: auto !important;
}
.banner_group__item:has(.banner_video),
.banner_group__item.has-video {
height: auto !important;
}
.banner.has-video .swiper-wrapper,
.banner .swiper-wrapper:has(.banner_video) {
height: auto !important;
align-items: flex-start;
}
.banner_group__item.has-video .banner_group_image {
height: auto !important;
}
/* Force swiper-wrapper to auto height when video present */
.has-video.swiper-container .swiper-wrapper,
.has-video.swiper .swiper-wrapper {
height: auto !important;
}
/*.banner_group_image:before{*/
/* content: '';*/
/* position: absolute;*/
/* background: linear-gradient(180deg, rgba(33, 33, 33, 0.00) 71.93%, rgba(33, 33, 33, 0.78) 100%) ;*/
/* left: 0;*/
/* bottom: 0;*/
/* height: 100%;*/
/* width: 100%;*/
/*}*/
.banner_group_content{
position: absolute;
left: 50%;
transform: translateX(-50%) translateY(-50%);
width: 96%;
max-width: 1000px;
top: 50%;
z-index: 10;
text-align: center;
display: flex
;
flex-direction: column;
justify-content: center;
align-items: center;
}
.banner_group_title{
color: #ffffff;
transition-duration: 0.3s;
font-size:14px;
font-weight: 400;
letter-spacing: 4.2px ;
line-height:1;
display: block;
text-transform: uppercase;
margin-bottom: 16px;
opacity: 0.7;
}
.banner_group_description{
color: #ffffff;
font-size:var(--banner_title);
margin-bottom: 16px;
line-height: 1.4;
}
.banner_block{
position: relative;
}
.swiper-pagination-bullet{
width: 4px;
height:4px;
border-radius: 0;
border: none;
opacity: 0.25;
background: var(--color_black);
transition-duration: 0.4s;
box-sizing: border-box;
}
.swiper-pagination-bullet-active{
width: 35px;
transition-duration: 0.4s;
}
.swiper-pagination-bullet-active {
cursor: pointer;
opacity: 1;
background: var(--color_black);
}
.banner_group .swiper-pagination-bullet{
background: rgba(255,255,255,0.5);
}
.banner_group .swiper-pagination-bullet-active {
background: #ffffff;
}
.swiper-pagination{
display: flex;
align-items: center;
grid-gap: 10px;
justify-content: center;
bottom: 24px;
left: 50%;
transform: translateX(-50%);
}
.slider_prod_item .swiper-pagination-bullet-active,
.fn_products_slide .swiper-pagination-bullet-active,
.cat_carousel .swiper-pagination-bullet-active{
background-color: var(--color_black);
}
.burger{
cursor: pointer;
display: flex;
align-items: center;
}
.informer_counter{
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: -8px;
right: -13px;
min-width: 16px;
min-height: 16px;
padding: 2px;
border-radius: 100%;
background-color: #000000;
font-size: 9px;
text-align: center;
color: #fff;
}
.fn_mobile_menu {
position: fixed;
top: calc(var(--announcement-height) + var(--header-height));
left: 0;
bottom: 0;
right: 0;
z-index: 100;
visibility: hidden;
opacity: 0;
transition: visibility 0s 0.4s, opacity 0.4s ease;
}
.fn_mobile_menu::before {
content: '';
position: absolute;
inset: 0;
background: rgba(33, 33, 33, 0.3);
backdrop-filter: blur(4px);
-webkit-backdrop-filter: blur(4px);
opacity: 0;
transition: opacity 0.4s ease;
}
.fn_mobile_menu.active {
visibility: visible;
opacity: 1;
transition: visibility 0s 0s, opacity 0.4s ease;
}
.fn_mobile_menu.active::before {
opacity: 1;
}
.fn_mobile_menu a {
color: var(--mobile_menu_text);
}
.mob_menu a {
color: var(--mobile_menu_text);
}
.mob_menu {
position: relative;
z-index: 1;
background: var(--mobile_menu_bg);
color: var(--mobile_menu_text);
width: 100%;
max-width: 380px;
height: 100%;
padding: 30px var(--big_padding_left) 30px;
overflow-y: auto;
box-sizing: border-box;
display: flex;
flex-direction: column;
transform: translateX(-100%);
transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.fn_mobile_menu.active .mob_menu {
transform: translateX(0);
}
.burger.active .burger_block .line_one {
top: 50%;
transform: translateY(-50%) rotate(45deg);
transition: 0.3s cubic-bezier(0.16, 1, 0.3, 1);
width: 70%;
}
.burger.active .burger_block .line_two {
bottom: 50%;
transform: translateY(50%) rotate(-45deg);
transition: 0.3s cubic-bezier(0.16, 1, 0.3, 1);
width: 70%;
}
.mob_flex{
flex-direction: column;
align-items: flex-start;
overflow: auto;
flex: none;
max-width: 100%;
padding-top: 0;
padding-bottom: 0;
gap: 20px;
}
.mob_flex .menu_group--header,.mob_flex .menu_group__list {
flex-direction: column;
text-align: left;
align-items: flex-start;
gap: 20px;
}
.menu_group--header,.menu_group--mobile,.menu_group__list{
display: flex;
align-items: center;
grid-gap: 10px;
}
.mob_menu .menu_group__link {
/* font-size: 13px;*/
/* letter-spacing: var(--letter_spacing_main);*/
}
.mob_menu .pages_menu {
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 35px;
}
a.menu_group__link.menu_group__link_98 {
color: red;
}
.mob_menu .menu_group__link {
/* text-transform: uppercase;*/
}
.mob_menu .pages_menu a,
.mob_menu .catalog_popup_menu_script,
.mob_menu .cat_popup_close {
/* font-size: 13px;*/
/* font-weight: 500;*/
/* letter-spacing: var(--letter_spacing_main);*/
}
.mob_menu .mob_flex {
gap: 25px;
}
.mob_menu .pages_menu ul {
display: flex;
flex-direction: column;
gap: 10px;
list-style: none;
margin: 0;
padding: 0;
}
.top-informers__link{
position: relative;
display: flex;
align-items: center;
justify-content: center;
transition-duration: 0.3s;
}
.account__link {
right: -5px;
}
.top-informers__link img{
width: auto;
height: 22px;
display: block;
transition-duration: 0.3s;
}
.top-informers__link svg,
.top-informers__link .mobile_icon svg{
/* width: 20px;
height: 20px;
transition-duration: 0.3s;*/
}
.hide_search img{
width: 22px;
height: 22px;
}
.categories_menu{
display: flex;
flex-direction: column;
gap: 10px;
}
li.categories_menu__item{
line-height: var(--main_line_height);
}
.categories_menu__icon{
display: none;
}
.top-brands__item,.block__expand,.sec-heading,.block__title{
text-transform: none;
color: var(--color_black);
}
.brand_section{
text-align: center;
padding-top: 24px;
}
.banner_group{
margin-bottom: 0!important;
}
.top-brands__item{
margin-bottom: 12px;
}
.block__expand svg{
display: none;
}
.arrow_read svg{
margin-left: 0;
display: block;
}
.block__expand{
display: flex;
align-items: center;
justify-content: center;
/* font-size: 13px;*/
letter-spacing: var(--letter_spacing_wide);
text-transform: uppercase;
position: relative;
text-decoration: underline;
text-underline-offset: 4px;
}
.section{
margin-top: 60px;
}
.head_top{
margin-bottom: 24px;
}
.head_top .sec-heading{
margin-bottom: 0;
}
.sec-heading,.block__title{
margin-bottom: 24px;
font-size: var(--medium_title);
/*letter-spacing: 0;*/
}
.sec-heading{
/*text-align: center;*/
}
.flex-column-brand{
display: flex;
align-items: center;
justify-content: center;flex-direction: column;
}
.cat_item svg{
filter:invert(100%);
margin-left: 10px;
}
.cat_item{
position: relative;
height: calc(100vh - 73px);
max-height: 900px;
background-size: cover;
background-repeat: no-repeat;
background-position: 50% 40%;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
transition-duration: 0.3s;
}
.cat_name{
display: flex;
align-items: center;
justify-content: center;
text-align: center;
position: relative;
}
.cat_name_container{
display: flex;
flex-direction: column;
position: absolute;
left: 0;
width: 100%;
bottom: 20px;
justify-content: center;
align-items: center;
}
.cat_item span{
color: #ffffff;
transition-duration: 0.4s;
text-transform: none;
}
.cat_item:before{
content: '';
position: absolute;
left: 0;
bottom: -100%;
height: 100%;
width: 100%;
transition-duration: 0.3s;
background:linear-gradient(180deg, rgba(33, 33, 33, 0.00) 80.7%, rgba(33, 33, 33, 0.62) 100%);
}
.category_block_flex{
/* display: grid;*/
/* align-items: stretch;
justify-content: space-between;*/
/* grid-template-columns: 2fr 1fr;
grid-gap: 22px;*/
position: relative;
}
.category_carousel_block{
width: 66%;
padding-right: 22px;
box-sizing: border-box;
}
.sales_block{
width: 34%;
height: calc(100vh - 73px);
max-height: 900px;
background: rgba(33, 33, 33, 0.03);
box-sizing: border-box;
position: absolute;
top: 0 ;
right: 0;
}
.fn_sale_slide .swiper-pagination{
bottom: 0;
display: none;
}
.fn_sale_slide .prod-preview.fn_product{
padding-bottom: 48px;
}
.sales_carousel{
position: absolute;
left: 60px;
right: 60px;
top: 50%;
transform: translateY(-50%);
}
.sales_block .swiper-button-next:before,.sales_block .swiper-button-prev:before{
filter: invert(0);
}
.seo-block h1{
color: var(--color_black);
text-transform: none;
margin-bottom: 20px;
}
.seo-block p{
margin-bottom: 8px;
}
.seo-block.active:before{
background: transparent;
transition:300ms linear;
}
.seo-block:before{
content:'';
position: absolute;
height: 100px;
width: 100%;
left: 0;
bottom: 0;
transition:300ms linear;
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
}
.seo-block.active{
/* max-height: 100%;*/
transition:300ms linear;
}
.seo-block h1{
}
.seo-block{
color: var(--color_black);
max-height: 120px;
overflow-y: hidden;
position: relative;
transition: max-height 0.4s ease;
/* letter-spacing: 0.104px;*/
}
.flex-btns{
display: flex;
align-items: center;
justify-content: flex-end;
}
.read_more{
cursor: pointer;
}
.thumb-img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
transition: 400ms linear;
}
.prod-thumb-_name_link{
text-transform: none;
color: var(--color_black);
/*width: 85%;*/
display: block;
max-width: 250px;
}
.flex_prod{
grid-gap: 8px;
margin-top: 8px;
align-items: flex-start;
position: relative;
}
.prod-thumb-_prices{
display: flex;
grid-gap: 0 8px;
align-items: center;
justify-content: flex-end;
flex-shrink: 0;
margin-top: 2px;
}
.new_product_price{
font-size: 16px;
}
.product_sizes{
transition-duration: 0.3s;
opacity: 0;
display: flex;
align-items: center;
grid-gap: 20px;
visibility: hidden;
/*max-width: 160px;*/
flex-wrap: wrap;
}
.choose_size{
width: 100%;
text-align: center;
text-transform: none;
line-height: 1;
}
.prod_var .product_sizes{
opacity: 1;
visibility: visible;
position: relative;
left: 0;
top: 0;
max-width: none;
}
.prod-card .size.no-stock{
opacity: 0.3;
text-decoration: line-through;
}
.sticker {
background: var(--color_accent);
padding: 10px;
justify-content: center;
align-items: center;
gap: 10px;
border-radius: 0;
font-weight: 500;
letter-spacing: var(--letter_spacing_wide);
color: #ffffff;
text-transform: uppercase;
line-height: 1;
font-size: 11px;
}
.sticker.sticker--discount{
background: var(--color_red);
}
.sticker.sticker--last_positions{
background: var(--color_black);
color: #ffffff;
}
.swiper-container {
position: relative;
overflow: hidden;
}
.prod-thumb-_image{
position: relative;
width: 100%;
}
.stickers{
position: absolute;
left: 10px;
top: 10px;
display: flex;
flex-direction: column;
grid-gap: 10px;
align-items: flex-start;
transition-duration: 0.3s;
}
.fn_wishlist{
display: flex;
}
.prod-thumb-_name{
position: relative;
}
.sales_carousel .prod-thumb-_image_link{
background: #ffffff;
}
.prod-thumb-_image_link{
display: flex;
background: #0000000a;
height: 100%;
overflow: hidden;
}
.thumb-hover {
opacity: 0;
position: absolute !important;
top: 0;
visibility: hidden;
transition: 400ms linear;
}
.prod-preview img {
margin: 0 auto;
width: 100%;
max-width: 100%;
position: relative;
transition: 400ms linear;
}
.product_sizes{
position: absolute;
left: 0;
width: 100%;
max-width: 100%;
bottom: 100%;
padding: 16px 0;
border: 1px solid rgba(33, 33, 33, 0.10);
background: rgba(255, 255, 255, 0.85);
justify-content: center;
box-sizing: border-box;
margin-bottom: 8px;
}
.price,.price-old {
display: flex;
align-items: center;
white-space: nowrap;
color: var(--color_black);
}
.flex_price.price--red .price{
color:var(--color_red);
}
.price-old{
opacity: 0.6;
text-decoration: line-through;
}
.flex_price{
display: flex;
align-items: center;
justify-content: flex-start;
gap: 10px;
text-transform: none;
margin-top: 8px;
}
.color_item{
display: block;
width: 12px;
height: 12px;
border-radius: 50%;
transition-duration: 0.3s;
cursor: pointer;
position: relative;
border: 1px solid rgba(33, 33, 33, 0.08);
}
.color_item:before{
content: '';
position: absolute;
width: 100%;
height: 100%;
background: transparent;
/* border: 1px solid rgba(33, 33, 33, 0.2);*/
border-radius: 50%;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
opacity: 0;
}
.color_item.active:before{
border: 1px solid var(--color_black);
width: 12px;
height: 12px;
opacity: 0;
}
div.color_item:before{
opacity: 0;
}
.colors_flex{
grid-gap: 10px;
justify-content: flex-start;
flex-wrap: wrap;
}
.prod_colors .colors_flex{
/*flex-direction: row;
grid-gap: 10px;
margin: 0!important;*/
}
.size{
min-width: 27px;
display: block;
text-align: center;
cursor: pointer;
transition-duration: 0.3s;
position: relative;
text-transform: none;
letter-spacing: var(--letter_spacing_wide);
}
.size.active:before{
/* content: '';
position: absolute;
top: 100%;
left: 0;
width: 100%;
height: 1px;
background-color: #000000;*/
}
.prod_sizes .size{
min-width: 0;
height: 20px;
display: flex
;
align-items: center;
justify-content: center;
}
.fn_popup_sizes{
position: relative;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
}
.prod_sizes{
grid-gap: 22px;
}
.hidden ,.hidden-xs-up{
display: none ;
}
.size.no-stock {
opacity: 0.3;
text-decoration: line-through;
}
.wishlist_button{
height: 20px;
width: 20px;
display: flex;
align-items: center;
justify-content: center;
color: var(--color_black);
transition: transform 0.2s ease;
}
.wishlist_button svg {
width: 100%;
height: 100%;
transition: transform 0.2s ease;
}
.wishlist_button.selected svg path {
fill: var(--color_accent);
stroke:var(--color_accent);
}
.flex_products_top{
margin-bottom: 45px;
padding-top: 30px;
}
.catalog-heading {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 24px;
}
.catalog-title {
font-size: var(--medium_title);
margin: 0;
text-transform: none;
}
.flex_product_top{
margin-bottom: 30px;
align-items: flex-start;
}
.crumbs{
display: flex;
align-items: center;
gap: 0;
flex-wrap: wrap;
}
.crumbs__item a,.crumbs__item span,.crumbs__item h1{
text-transform: none;
}
.crumbs__item a{
color: var(--color_gray);
transition: opacity 0.3s ease;
}
.crumbs__item:not(:last-child)::after{
content: '/';
margin: 0 10px;
color: var(--color_gray);
opacity: 0.4;
font-weight: 500;
}
.flt-btn{
transition-duration: 0.3s;
cursor: pointer;
display: flex;
align-items: center;
grid-gap: 10px;
text-transform: uppercase;
text-decoration: underline;
text-underline-offset: 4px;
letter-spacing: var(--letter_spacing_wide);
}
.products_list{
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-gap: 22px;
}
ol{
padding: 0;
margin: 0;
}
.products_right{
display: flex;
align-items: center;
justify-content: flex-end;
gap: 25px;
}
.pager{
display: flex;
align-items: center;
justify-content: center;
margin-top: 44px;
gap: 6px;
flex-wrap: wrap;
}
.pager__link span{
display: flex;
align-items: center;
justify-content: center;
}
.pager__link{
min-width: 40px;
padding: 0 10px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
background: white;
transition-duration: 0.3s;
box-sizing: border-box;
letter-spacing: var(--letter_spacing_wide);
text-transform: uppercase;
}
span.pager__link{
background: rgba(33, 33, 33, 1);
transition-duration: 0.3s;
color: #ffffff;
}
.pager_prev span{
transform: rotate(180deg);
}
.fn_products_feat .flt-block{
background: white;
padding: 16px var(--big_padding_left);
width: 100%;
box-sizing: border-box;
}
.flt-block .block_popup_close{
right: 20px;
top: 20px;
}
.sorts.active,.fn_products_feat.active{
opacity: 1;
transform: translateY(0);
visibility: visible;
z-index: 10000;
pointer-events: auto;
}
.fn_products_feat.hiding {
opacity: 0;
transform: translateY(-20px);
pointer-events: none;
z-index: 10000;
/* visibility ще лишається visible, щоб не "вимикати" блок раніше часу */
}
.sort-select__link{
/*margin-top: 20px;*/
padding: 0;
transition-duration: 0.4s;
display: block;
}
.sort-select__link input{
display: none;
}
.sort-select__link span{
padding-left: 0;
cursor: pointer;
position: relative;
}
.sort-select__link span:before{
/*content: "";
display: inline-block;
width: 14px;
height: 14px;
flex-shrink: 0;
flex-grow: 0;
box-sizing: border-box;
margin-right: 6px;
position: absolute;
left: 0;
top: 8px;
transform: translateY(-50%);
border: 1px solid rgba(76, 73, 70, 0.4);
border-radius: 50%;*/
}
.sort-select__link span:after{
/* content: '';
position: absolute;
width: 6px;
height: 6px;
display: block;
line-height: 1;
left: 4px;
top: 8px;
opacity: 0;
transform: translateY(-50%);
border-width: 0px;
background: #4C4946;
border-radius: 50%;*/
}
.sort-select__link input:checked + span {
background: var(--color_black);
color: #fff;
padding: 3px 8px;
}
/*.active_up span:after,.active_down span:after{*/
/* opacity: 1;*/
/*}*/
.block_popup{
opacity: 0;
visibility: hidden;
position: absolute;
left: 0;
top: 50px;
/* bottom: 0;*/
height: auto;
right: 0;
/*background: rgba(76, 73, 70, 0.47);*/
box-shadow: 1px 0 1px 0 #00000047;
}
/* Filter side panel */
.filter-panel {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 10000;
visibility: hidden;
opacity: 0;
transition: visibility 0s 0.4s, opacity 0.4s ease;
}
.filter-panel.active {
visibility: visible;
opacity: 1;
transition: visibility 0s 0s, opacity 0.4s ease;
}
.filter-panel__overlay {
position: absolute;
inset: 0;
background: rgba(33, 33, 33, 0.2);
backdrop-filter: blur(4px);
-webkit-backdrop-filter: blur(4px);
}
.filter-panel__body {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 100%;
max-width: 390px;
background: #fff;
transform: translateX(100%);
transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
display: flex;
flex-direction: column;
}
.filter-panel.active .filter-panel__body {
transform: translateX(0);
}
.filter-panel__header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 24px 30px;
border-bottom: 1px solid rgba(33, 33, 33, 0.1);
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
}
.filter-panel__close {
background: none;
border: none;
cursor: pointer;
padding: 6px;
color: var(--color_black);
opacity: 0.4;
transition: opacity 0.2s ease;
}
.filter-panel__content {
flex: 1;
overflow-y: auto;
}
.filter-panel__content .flt-block {
padding: 0;
}
.filter-panel__content .flt-group_flex {
flex-direction: column;
align-items: flex-start;
gap: 20px;
}
.filter-panel__content .flt-_name {
margin-right: 0;
justify-content: flex-start;
}
.filter-panel__content .flt-_group {
justify-content: flex-start;
}
.sorts_block{
background: white;
padding: 20px;
position: absolute;
top: 50px;
right: 50px;
max-width: 445px;
width: 100%;
box-sizing: border-box;
}
.products_sort {
position: relative;
margin-left: 36px;
cursor: pointer;
transition-duration: 0.3s;
}
.sort-select__title{
display: flex;
align-items: center;
grid-gap: 8px;
}
.flt-_name{
margin-right: 16px;
display: flex;
align-items: center;
justify-content: center;
white-space: nowrap;
flex-shrink: 0;
gap: 10px;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
}
.flt-_link{
position: relative;
padding-left: 0;
padding-right: 0;
/* font-size: 13px;
font-style: normal;
font-weight: 400;
line-height: normal;
letter-spacing: 0.64px;
text-align: left;*/
}
.flt-label_color.flt-_link .flt-_label{
display: none;
}
.flt-label_color.flt-_link{
padding-left: 0;
}
.flt-label_color.flt-_link:before{
content: "";
display: block;
width: 14px;
height: 14px;
flex-shrink: 0;
flex-grow: 0;
box-sizing: border-box;
margin-right: 0;
position: relative;
border: 1px solid rgba(76, 73, 70, 0.4);
border-radius: 50%;
}
.flt-_link:after{
display: none;
}
.flt-_link.checked {
background: var(--color_black);
color: #fff;
padding: 0 8px;
height: 30px;
}
.flt-_group{
display: flex;
flex-wrap: wrap;
gap: 8px;
flex: 1;
min-width: 0;
flex-direction: column;
align-items: flex-start;
}
.flt-group_flex{
display: flex;
align-items: center;
gap: 8px;
border-bottom:1px solid rgba(33, 33, 33, 0.1);
padding: 20px 30px;
}
/* Price filter */
.price_filter{
display: flex;
flex-direction: column;
gap: 6px;
width: 100%;
}
.price_flt-_display{
display: flex;
align-items: center;
gap: 6px;
flex-wrap: wrap;
color: #999;
text-transform: lowercase;
}
.price_flt-_label{
color: #999;
}
.price_flt-_value{
color: #999;
}
.price_flt-_currency{
color: #999;
margin-left: 2px;
text-transform: none;
}
.price_flt-_slider{
width: 100%;
margin: 4px 0;
}
/* noUiSlider base styles */
.noUi-target{
position: relative;
}
.noUi-base,
.noUi-connects{
width: 100%;
height: 100%;
position: relative;
z-index: 1;
}
.noUi-connects{
overflow: hidden;
z-index: 0;
border-radius: 3px;
}
.noUi-connect,
.noUi-origin{
will-change: transform;
position: absolute;
z-index: 1;
top: 0;
right: 0;
transform-origin: 0 0;
transform-style: flat;
}
.noUi-connect{
height: 100%;
width: 100%;
}
.noUi-origin{
height: 10%;
width: 10%;
}
.noUi-horizontal{
height: 2px;
}
.noUi-horizontal .noUi-origin{
height: 0;
}
.noUi-handle{
backface-visibility: hidden;
position: absolute;
}
.noUi-touch-area{
height: 100%;
width: 100%;
}
.noUi-state-tap .noUi-connect,
.noUi-state-tap .noUi-origin{
transition: transform .3s;
}
.noUi-state-drag *{
cursor: inherit !important;
}
.noUi-horizontal .noUi-handle{
height: 18px;
}
.noUi-draggable{
cursor: ew-resize;
}
/* noUiSlider custom styles */
#fn_slider_price.noUi-target{
background: #e0e0e0;
border: none;
border-radius: 1px;
box-shadow: none;
height: 2px;
}
#fn_slider_price .noUi-connect{
background: var(--color_black);
border-radius: 1px;
}
#fn_slider_price .noUi-handle{
width: 14px;
height: 14px;
border-radius: 50%;
background: var(--color_black);
border: none;
box-shadow: none;
cursor: pointer;
top: -6px;
right: -7px;
}
#fn_slider_price .noUi-handle:before,
#fn_slider_price .noUi-handle:after{
display: none;
}
#fn_slider_price .noUi-handle:focus{
outline: none;
}
.flt-_item form{
display: flex;
align-items: center;
}
.reset_button{
opacity: 0;
transition: 200ms linear;
text-transform: none;
}
.show_reset{
opacity: 1;
transition: 200ms linear;
}
span.prod-thumb-_button_text svg{
height: 16px;
}
span.prod-thumb-_button_text {
display: flex;
align-items: center;
justify-content: center;
}
.flex_prod_block {
align-items: flex-start;
justify-content: center;
margin: 0 auto;
max-width: 1276px;
}
.mob_block_show{
display: none;
}
.prod_images {
width: 530px;
display: flex;
flex-direction: row-reverse;
position: relative;
/*height: calc(100vh - 133px);*/
overflow: hidden;
flex-shrink: 0;
max-height: 635px;
}
.thumbs{
height: calc(100vh - 133px);
max-height: 635px;
}
.prod_info {
display: flex;
flex-direction: column;
justify-content: space-between;
flex: 1;
margin-left: 36px;
box-sizing: border-box;
max-width: 400px;
}
.slider_prod_item img {
width: 100%;
height: 100%;
object-fit: cover;
object-position:center;
background-color: #0000000a;
}
.slider_prod_item {
width: 100%;
}
.thumbs {
width: 85px;
height: 100vh;
margin-right: 25px;
flex-shrink: 0;
}
.thumbs img {
height: 100%;
object-fit: cover;
width: 100%;
}
.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after{
display: none;
}
.thumbs .swiper-slide {
height: 119px!important;
margin: 0 0 25px 0;
cursor: pointer;
background: #A9A5A5;
}
.stickers_product-page{
z-index: 20;
}
.product_container{
position: relative;
}
.crumbs_block{
margin-bottom: 45px;
padding-top: 30px;
}
.product_page .home_page_bread{
display: none;
}
.product-page__sku{
text-transform: none;
display: flex;
align-items: center;
justify-content: flex-start;
gap: 8px;
line-height: 1;
}
.product-page__sku>span:first-child{
/*opacity: 0.4;*/
}
.product_page_color_sku{
align-items: center;
justify-content: flex-start;
gap: 12px;
}
.sku_line{
color: var(--color_black);
line-height: 1;
}
.product-sku-top {
color: var(--color_gray);
margin-bottom: 6px;
}
.block__head{
font-size: var(--medium_title);
text-transform: none;
position: relative;
box-sizing: border-box;
color: var(--color_black);
line-height: 1.3;
margin-bottom: 16px;
}
.info-boxed__price_amount {
display: flex
;
align-items: center;
justify-content: space-between;
margin: 16px 0 0 0;
}
.price--red{
color: var(--color_red);
}
.product-page__wishlist.wishlist_button{
width: 51px;
height: 51px;
background-size: 18px;
border: 1px solid rgba(33, 33, 33, 0.1);
box-sizing: border-box;
flex-shrink: 0;
}
.prod_var{
margin-top: 30px;
position: relative;
}
.flex_sku{
margin-bottom: 30px;
}
.single_color{
margin-bottom: 15px;
}
.product_page_style .color_item,.product_page_style .color_item.active{
width: 30px;
height: 30px;
border: none;
}
.product_page_style .color_item.active {
box-shadow: 0 0 0 1px var(--color_black), inset 0 0 0 4px #ffffff ;
}
.product_page_style .colors_flex{
gap: 10px;
}
.product_page_sizes{
display: flex;
align-items: center;
justify-content: flex-start;
gap: 17px;
}
.product_page_sizes .size.active{
color: #ffffff;
background: var(--color_black);
}
.product_page_sizes .size:after{
display: none;
}
.product_page_sizes .size.no-stock{
opacity: 0.3;
text-decoration: line-through;
background: none;
}
.product_page_sizes .size{
display: flex;
min-width: 45px;
flex-direction: column;
justify-content: center;
align-items: center;
border-radius: 0;
padding: 0 14px;
cursor: pointer;
transition: var(--transition);
text-transform: uppercase;
border: 1px solid rgba(33, 33, 33, 0.15);
height: 40px;
}
.color_item.active{
box-shadow: inset 0 0 0 1px #d1d1d1;
}
.fn_sizes {
opacity: 1;
color: var(--color_black);
text-decoration: underline;
text-underline-offset: 4px;
}
.product-page_size_table{
justify-content: space-between;
gap: 12px;
}
.flex-btns_prod{
align-items: flex-start;
justify-content: space-between;
gap: 0;
/* max-width: 400px;*/
}
.flex-btns_prod div:first-child{
width: 100%;
}
.product-page__button{
background: var(--color_black);
height: 48px;
color: #ffffff;
width: 100%;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
border: none;
cursor: pointer;
transition: var(--transition);
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
border-radius: var(--border_radius);
}
.fast_order_button{
margin-top: 12px;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 48px;
background: transparent;
border: 1px solid rgba(33, 33, 33, 0.15);
color: var(--color_black);
cursor: pointer;
transition: var(--transition);
letter-spacing: var(--letter_spacing_wide);
border-radius: var(--border_radius);
position: relative;
box-sizing: border-box;
text-transform: uppercase;
}
.fast_order_button span{
position: relative;
}
/* Product tabs */
.product-tabs {
width: 100%;
margin-top: 40px;
}
.product-tabs__nav {
display: flex;
gap: 0;
border-bottom: 1px solid var(--color_border);
}
.product-tabs__btn {
background: none;
border: none;
padding: 12px 24px;
cursor: pointer;
color: var(--color_gray);
position: relative;
transition: color 0.2s ease;
white-space: nowrap;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
flex: 1;
}
.product-tabs__btn::after {
content: '';
position: absolute;
bottom: -1px;
left: 0;
right: 0;
height: 2px;
background: var(--color_black);
transform: scaleX(0);
transition: transform 0.2s ease;
}
.product-tabs__btn.active {
color: var(--color_black);
}
.product-tabs__btn.active::after {
transform: scaleX(1);
}
.product-tabs__panels {
padding: 24px 0;
}
.product-tabs__panel {
display: none;
line-height: 1.9;
}
.product-tabs__panel.active {
display: block;
}
.product-tabs__panel p {
margin-bottom: 8px;
}
.product_page_class{
background-color: #ffffff;
}
.button--blick {
position: relative;
overflow: hidden;
background: var(--color_black);
color: white;
transition: background-color 0.3s ease;
}
.margin_top{
margin-top: 60px;
}
.fn_validate_cart {
display: flex;
flex-direction: row-reverse;
width: 100%;
align-items: flex-start;
justify-content: space-between;
margin-top: 40px;
gap: 40px;
}
.cart_info {
width: 38%;
flex-shrink: 0;
}
.block_cart_info {
width: 62%;
}
.form_cart{
margin-bottom: 32px;
}
.cart_page .purchase {
height: auto;
bottom: 0;
position: relative;
top: 0;
right: 0;
/*width: 48%;*/
border: none;
padding: 0;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.delivery__description {
display: none;
opacity: 0.8;
}
.checkbox.active + .delivery__description {
display: block;
}
.field-wrap input,.select2-container,.form__textarea {
opacity: 1;
border: 1px solid rgba(33, 33, 33, 0.12);
border-radius: 0;
height: 48px;
padding: 11px 15px;
align-items: center;
text-transform: none;
letter-spacing: var(--letter_spacing_main);
font-family: 'Manrope', serif!important;
color: rgba(33, 33, 33, 1);
transition: border-color 0.3s;
}
.field-wrap input:focus,.form__textarea:focus {
border-color: rgba(33, 33, 33, 0.4);
outline: none;
}
.field-wrap input::placeholder{
letter-spacing: var(--letter_spacing_main);
font-family: 'Manrope', serif!important;
color: rgba(33, 33, 33, 0.3);
}
input:-webkit-autofill{
-webkit-text-fill-color: var(--color_black) !important;
-webkit-box-shadow: 0 0 0 30px white inset !important;
}
.select2-container{
height: auto!important;
border: 0;
padding: 0;
}
.select2-container--default .select2-selection--single{
border: 0!important;
padding: 0!important;
font-style: normal;
font-weight: 500;
line-height: 24px; height: auto!important;
color: rgba(33, 33, 33, 1);
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
line-height: 1;
letter-spacing: var(--letter_spacing_main);
border: 1px solid rgba(33, 33, 33, 0.1);
border-radius: 0;
color: rgba(33, 33, 33, 1) !important;
display: flex;
height: 48px;
padding: 11px 16px;
align-items: center;
box-sizing: border-box;
white-space: pre-wrap;
}
.select2-container--default .select2-results__option[aria-selected=true] {
background-color: rgba(122, 112, 205, 0.2);
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
background-color: var(--color_accent);
color: white;
}
.select2-selection__arrow{
display: none!important;
}
.delivery__name {
position: relative;
padding-left: 25px;
cursor: pointer;
display: inline-block;
}
.checkbox__input {
display: none;
}
.delivery__name:before {
content: "";
display: inline-block;
width: 14px;
height: 14px;
flex-shrink: 0;
flex-grow: 0;
box-sizing: border-box;
margin-right: 6px;
position: absolute;
left: 1px;
top: 3px;
transform: translateY(0);
outline: 1px solid rgba(33, 33, 33, 0.4);
border-radius: 50%;
}
.delivery__name:after {
content: '';
position: absolute;
width: 6px;
height: 6px;
display: block;
line-height: 1;
left: 5px;
top: 7px;
opacity: 0;
transform: translateY(0);
background:var(--color_black);
border-radius: 50%;
}
.delivery__label input:checked + .delivery__name:after {
opacity: 1;
}
.coupon_container .cart-item-detail__item{
margin-bottom: 16px;
}
.cart_page .delivery__name {
text-transform: none;
}
.form_col {
display: flex;
justify-content: space-between;
gap: 20px;
}
.form_col .field-wrap {
width: 50%;
}
.form__title{
text-transform: uppercase;
margin-bottom: 20px;
letter-spacing: var(--letter_spacing_wide);
}
.delivery_fields__form_group {
display: none;
}
.autocomplete-suggestions {
overflow-y: auto;
background: #FFFFFF;
padding: 10px;
padding-right: 0;
box-sizing: border-box;
box-shadow: 1px 4px 11px 3px rgb(0 0 0 / 10%);
}
.autocomplete-suggestion {
margin: 5px 0;
}
.delivery__item{
margin-bottom: 16px;
cursor: pointer;
transition-duration: 0.3s;
}
.novaposhta_div .delivery__name{
margin-left: 10px;
}
.novaposhta_div .delivery__name:before,.novaposhta_div .delivery__name:after{
top: 6px;
}
.form__textarea {
width: 100%;
-webkit-appearance: none;
box-sizing: border-box;
height: 96px;
}
.term_novaposhta{
display: none!important;
}
.form__textarea::placeholder{
letter-spacing: var(--letter_spacing_main);
font-family: 'Manrope', serif!important;
color: rgba(33, 33, 33, 0.3);
}
.cart-section-heading{
text-transform: uppercase;
color: var(--color_black);
letter-spacing: var(--letter_spacing_wide);
}
.sec-heading.mob{
display: none;
}
.form_tabs{
/* margin-bottom: 24px;
gap: 8px;*/
}
.form_tab{
/* text-transform: none;
position: relative;
padding: 8px 16px;
border: 1px solid rgba(33, 33, 33, 0.12);
transition: all 0.3s;*/
}
.form_tab.active{
/*background: var(--color_black);
color: #fff;
border-color: var(--color_black);*/
}
a.form_tab{
/* color: rgba(33, 33, 33, 0.6);*/
}
a.form_tab:before{
display: none;
}
.user_link{
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
text-decoration: underline;
text-underline-offset: 4px;
}
.title_site{
font-size: var(--medium_title);
text-transform: none;
color: var(--color_black);
}
.fn_payments_block{
margin-top: 24px;
}
.cart-item-detail__item{
display: flex;
align-items: center;
font-style: normal;
text-transform: none;
justify-content: space-between;
margin-top: 8px;
}
.cart-item-detail__price{
display: flex;
align-items: center;
}
.cart-item-detail__column_value {
white-space: nowrap;
}
.cart-item-detail__item.fix {
padding-top: 20px;
margin-top: 20px;
border-top: 1px solid rgba(33, 33, 33, 0.1);
}
.cart-item-detail__name{
/*font-size: 14px;
font-weight: 500;*/
}
.cart-item-detail__name--total,.cart-item-detail__price--total{
font-size: 18px;
}
.cart-item-detail__price--total{
/*font-size: 16px;*/
}
.cart-item-detail__price--total .currency{
/* font-size: 11px;
top: -6px;*/
}
.cart-item-detail__price .currency{
/*font-size: 10px;
top: -6px;*/
}
.cart-item-_image {
min-width: 100px;
margin-right: 16px;
width: 100px;
height: 140px;
display: flex;
overflow: hidden;
align-items: center;
justify-content: center;
background-color: transparent;
}
.cart-item-_image img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.cart-item-_item {
display: flex;
flex-direction: row;
align-items: stretch;
position: relative;
padding-bottom: 20px;
margin-bottom: 20px;
border-bottom: 1px solid rgba(33, 33, 33, 0.1);
padding-top: 0;
}
.order_purchase .cart-item-_item {
margin-bottom: 0;
}
.cart-item-_remove{
position: absolute;
right: 0;
top: 3px;
width: 14px;
height: 14px;
opacity: 0.3;
transition: opacity 0.3s;
}
.cart-item-_name{
padding-right: 20px;
margin-bottom: 8px;
}
.cart-item-it>span:first-child{
opacity: 0.4;
display: block;
}
.cart-item-it{
margin-top: 6px;
text-transform: none;
color: rgba(33, 33, 33, 1);
display: flex;
align-items: center;
justify-content: flex-start;
gap: 8px;
}
.cart-item-it .color_item{
display: block;
width: 12px;
height: 12px;
}
.cart-item-it .color_item:before{
display: none;
}
.amount__input {
width: 30px;
border: none;
text-align: center;
height: 20px;
padding: 0;
line-height: 20px;
}
.fn_plus, .fn_minus {
text-align: center;
font-size: 20px;
display: block;
align-items: center;
justify-content: center;
cursor: pointer;
transition-duration: 0.4s;
line-height: 1;
width: 20px;
height: 20px;
}
.cart-item-_name_link{
transition-duration: 0.4s;
text-transform: none;
}
.amount {
display: flex;
position: relative;
align-items: center;
justify-content: center;
}
span.cart-item-it__size {
text-transform: uppercase;
}
.amount:before {
/*width: 15px;
height: 100%;
left: 17px;
background: transparent;
content: '';
position: absolute;*/
}
.cart-item-_content{
display: flex;
flex-direction: column;
justify-content: space-between;
}
.coupon__title{
opacity: 1;
cursor: pointer;
}
.coupon__title:before,.coupon__title:after{
top: 11px;
}
.coupon__title:after{
opacity: 1;
}
.coupon__title.active:after{
opacity: 0;
}
.coupon__group{
display: flex;
align-items: center;
}
.form__button--coupon,.order_boxeded .form__button,.order_boxeded .button{
background: #4C4946;
padding: 11px 10px;
color: #FFF;
/* width: 100%; */
text-align: center;
border: 0;
margin-left: 10px;
cursor: pointer;
transition-duration: 0.4s;
}
.order_payment__checkout input{
position: relative;
overflow: hidden;
background-color: var(--color_black);
color: white;
height: 48px;
width: 100%;
text-align: center;
display: flex
;
align-items: center;
justify-content: center;
border: none;
cursor: pointer;
transition-duration: 0.4s;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
transition: 0.3s ease;
}
.order_payment__checkout{
margin-top: 20px;
}
.order_boxeded .button{
width: 100%;
margin: 0;
}
.field-wrap--coupon{
margin: 0!important;
}
.coupon{
margin-bottom: 20px;
padding-bottom: 20px;
border-bottom: 1px solid rgba(33, 33, 33, 0.1) ;
margin-top: 0;
position: relative;
}
.message_error,.message_success{
position: absolute;
top: -7px;
left: 6px;
color: red;
padding: 0 5px;
background-color: #ffffff;
margin-left: 4px;
font-size: 10px;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
z-index: 1;
}
.message_success{
color: #0b982f;
}
.payment_method__item{
margin-bottom: 16px;
}
.cart_page .product-page__button{
margin: 20px 0 0 0;
}
.wrap-order{
max-width: 654px;
width: 100%;
margin: 60px auto 0 auto;
}
.cart-item-order{
display: flex;
flex-direction: column;
grid-gap: 20px;
}
.cart-item-order .cart-item-_image{
width: 85px;
min-width: 85px;
height: 119px;
margin-right: 20px;
display: flex;
}
.cart-item-order .cart-item-_name{
padding-right: 0;
margin-bottom: 0;
}
.cart-item-order .cart-item-_content{
flex-direction: row;
align-items: flex-start;
grid-gap: 30px;
width: 100%;
justify-content: space-between;
}
.order_details{
width: 100%;
}
.cart-item-order .cart-item-_amount{
min-width: 35px;
flex-shrink: 0;
}
.cart-item-order .cart-item-_price_total{
min-width: 0;
text-align: right;
flex-shrink: 0;
}
.cart-item-order .cart-item-_content>.flex{
width: 100%;
justify-content: flex-start;
align-items: flex-start;
}
.cart-item-order .cart-item-_group{
display: flex;
align-items: center;
}
.cart-item-_price_total{
white-space: nowrap;
}
.order_details td{
padding-bottom: 22px;
width: 50%;
}
.order_details td:last-child,.order_payment__title span:last-child{
opacity: 0.5;
}
.order_tr_fix td:last-child{
opacity: 1;
}
.order_tr_fix td{
padding: 14px 0 0 0;
}
.order_details td:first-child{
white-space: nowrap;
padding-right: 15px;
box-sizing: border-box;
}
.order_payment__title{
display: flex;
}
.order_payment__title span{
width: 50%;
display: inline-block;
}
.order_payment__button{
background: transparent;
border: 0;
padding: 0;
cursor: pointer;
position: relative;
transition-duration: 0.3s;
}
.order_payment__form{
margin-top: 10px;
text-align: center;
}
.delivery_class_3 .novaposhta_div .field-wrap {
margin-bottom: 0;
}
.delivery_class_3 .novaposhta_div .np_delivery_types_heading,.delivery_class_3 .novaposhta_div .np_delivery_types_content {
margin-bottom: 0;
}
/* Розтягнути блок міста та відділень на повну ширину */
.novaposhta_div .form_col {
flex-direction: column;
}
.novaposhta_div .form_col .field-wrap {
width: 100%;
}
.novaposhta_div .np_delivery_types_block {
width: 100%;
}
.delivery_class_4 .fn_house,.delivery_class_4 .fn_apartment{
margin-bottom: 0;
}
.cart-item-_item:last-child{
margin-bottom: 0;
border-bottom: none;
}
.cart-item-detail_blocks {
margin-top: 0;
padding-top: 20px;
border-top: 1px solid rgba(33, 33, 33, 0.1);
}
input.form__button--coupon {
position: absolute;
right: 0;
/* background-image: url(../images/arr.svg); */
/* background-size: 6px; */
/* background-repeat: no-repeat; */
/* background-position: center; */
background-color: var(--color_black);
font-size: 13px;
/* width: 39px; */
height: 48px;
margin: 0;
padding: 0 15px;
box-sizing: border-box;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
border: 1px solid rgba(33, 33, 33, 0.12);
}
div#fn_total_delivery_price_block{
margin-top: 8px;
}
/* Search bar */
.search-bar {
position: fixed;
top: calc(var(--announcement-height) + var(--header-height));
left: 0;
right: 0;
z-index: 99;
background: #fff;
border-bottom: 1px solid rgba(33, 33, 33, 0.08);
border-top: 1px solid rgba(33, 33, 33, 0.08);
box-shadow: 0 4px 20px rgba(33, 33, 33, 0.1);
overflow: hidden;
max-height: 0;
opacity: 0;
transition: max-height 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease;
}
.search-bar.active {
max-height: 80px;
opacity: 1;
}
.search-bar__form {
display: flex;
align-items: center;
gap: 30px;
height: 70px;
}
.search-bar__icon {
flex-shrink: 0;
width: 20px;
height: 20px;
color: var(--color_black);
opacity: 0.4;
}
.search-bar__input {
flex: 1;
border: none;
background: transparent;
height: 40px;
outline: none;
padding: 0;
letter-spacing: var(--letter_spacing_wide);
}
.search-bar__input::placeholder {
letter-spacing: var(--letter_spacing_main);
font-family: 'Manrope', serif!important;
color: rgba(33, 33, 33, 0.3);
}
.search-bar__close svg{
width: 20px;
height: 20px;
opacity: 0.4;
}
.search-bar__submit svg{
width: 22px;
height: 22px;
opacity: 0.4;
}
button.search-bar__submit{
display: flex;
align-items: center;
justify-content: center;
}
.search-bar__close {
flex-shrink: 0;
background: none;
border: none;
cursor: pointer;
transition: opacity 0.2s ease;
width: 20px;
height: 20px;
display: flex;
justify-content: center;
align-items: center;
}
.search-bar__form .autocomplete-suggestions {
display: none !important;
}
.block__description h1,.block__description h2{
text-transform: none;
margin-top: 40px;
margin-bottom: 15px;
}
.block__description p{
margin-bottom: 8px;
}
.brands_list{
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 20px;
}
.brand_item {
flex-direction: column;
text-align: center;
}
.brand_logo img{
width: 100%;
}
.block__description ul{
margin-bottom: 8px;
}
.block__description li{
position: relative;
padding-left: 30px;
}
.block__description li::before{
content: "";
position: absolute;
width: 15px;
height: 1px;
top: 8px;
background-color: var(--color_black);
left: 0;
}
.page_h1{
font-size: 18px;
margin-bottom: 30px;
}
/* Text page */
.page-header {
padding-top: 30px;
margin-bottom: 45px;
}
.page-content {
max-width: 780px;
padding-bottom: 20px;
}
.page-content__title {
font-size: var(--medium_title);
text-transform: none;
margin-bottom: 32px;
line-height: 1.3;
}
.page-content__body {
line-height: 1.8;
}
.page-content__body p {
margin-bottom: 16px;
}
.page-content__body h2 {
font-size: 18px;
font-weight: 500;
margin-top: 40px;
margin-bottom: 16px;
text-transform: none;
}
.page-content__body h3 {
font-size: 16px;
font-weight: 500;
margin-top: 32px;
margin-bottom: 12px;
text-transform: none;
}
.page-content__body ul,
.page-content__body ol {
margin-bottom: 16px;
padding-left: 0;
}
.page-content__body li {
position: relative;
padding-left: 24px;
margin-bottom: 8px;
}
.page-content__body li::before {
content: '';
position: absolute;
left: 0;
top: 10px;
width: 12px;
height: 1px;
background: var(--color_black);
}
.page-content__body img {
max-width: 100%;
height: auto;
margin: 24px 0;
}
.page-content__body a {
color: var(--color_black);
text-decoration: underline;
text-underline-offset: 4px;
transition: opacity 0.2s ease;
}
.wrap-user{
max-width: 550px;
background: rgba(33, 33, 33, 0.03);
box-sizing: border-box;
padding: 50px;
margin:0 auto;
}
.all{
text-transform: none;
position: relative;
cursor: pointer;
}
.all:before{
content: '';
position: absolute;
left: 0;
width: 0;
height: 1px;
background: var(--color_black);
bottom: 0;
transition-duration: 0.3s;
}
.flex_login_links{
margin-top: 20px;
}
.order_line{
margin: 20px auto;
width: 100%;
height: 1px;
opacity: 0.5;
background: rgba(33, 33, 33, 0.2);
}
.order_info-content{
padding: 40px;
box-sizing: border-box;
background: rgba(33, 33, 33, 0.03);
}
.tabs__link, .tabs__link_a {
display: flex;
align-items: center;
justify-content: space-between;
/*font-size: 16px;*/
font-style: normal;
text-transform: none;
cursor: pointer;
}
.tabs__link{
max-height: none!important;
}
.tab_list .tabs__link {
position: relative;
}
.aside-a{
width: 230px;
min-width: 230px;
display: flex;
flex-direction: column;
align-items: flex-start;
grid-gap: 30px;
}
.aside-a a,.button__logout{
cursor: pointer;
transition-duration: 0.3s;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
}
.aside-a a.selected,.aside-a a:hover,.button__logout:hover{
text-decoration: underline;
text-underline-offset: 4px;
}
.change_pass {
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
text-decoration: underline;
text-underline-offset: 4px;
}
.flex_sidebar .block__description{
padding-left: 30px;
}
.user_personal_seperator{
max-width: 600px;
}
.bottom_margin{
margin-bottom: 20px;
}
/* Cart popup panel */
.cart-popup {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 10000;
visibility: hidden;
opacity: 0;
transition: visibility 0s 0.4s, opacity 0.4s ease;
}
.cart-popup.active {
visibility: visible;
opacity: 1;
transition: visibility 0s 0s, opacity 0.4s ease;
}
.cart-popup__overlay {
position: absolute;
inset: 0;
background: rgba(33, 33, 33, 0.2);
backdrop-filter: blur(4px);
-webkit-backdrop-filter: blur(4px);
}
.cart-popup__body {
position: absolute;
top: 0;
right: 0;
bottom: 0;
width: 100%;
max-width: 460px;
background: #fff;
transform: translateX(100%);
transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
display: flex;
flex-direction: column;
}
.cart-popup.active .cart-popup__body {
transform: translateX(0);
}
.cart-popup__header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 24px 30px;
border-bottom: 1px solid rgba(33, 33, 33, 0.1);
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
}
.close_popup_button {
cursor: pointer;
opacity: 1;
width: 20px;
height: 20px;
background-image: url(../images/close.svg);
background-size: 14px;
background-position: center;
background-repeat: no-repeat;
}
.cart-popup__content {
flex: 1;
overflow-y: auto;
display: flex;
flex-direction: column;
}
.cart-popup__items {
flex: 1;
overflow-y: auto;
padding: 20px 30px;
}
.cart-popup__items .cart-item-_item:last-child {
border-bottom: none;
margin-bottom: 0;
}
.cart-popup__items .cart-item-_image {
min-width: 100px;
max-width: 100px;
margin-right: 16px;
}
.cart-popup__footer {
padding: 24px 30px;
border-top: 1px solid rgba(33, 33, 33, 0.1);
}
.cart-popup__total {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 16px;
}
.cart-popup__total-price {
font-weight: 600;
}
.cart-popup__footer .product-page__button {
margin-bottom: 0;
}
.cart-popup__continue {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 48px;
margin-top: 10px;
background: none;
border: 1px solid rgba(33, 33, 33, 0.25);
font-size: 13px;
font-weight: 500;
letter-spacing: var(--letter_spacing_wide);
text-transform: uppercase;
cursor: pointer;
transition: border-color 0.2s;
}
.cart-popup__continue:hover {
border-color: rgba(33, 33, 33, 0.6);
}
.cart-popup__empty {
padding: 40px 30px;
text-align: center;
font-size: 14px;
opacity: 0.5;
}
.prod_colors {
margin-right: 3px;
}
.popup_cart-item-remove svg{
width: 100%;
height: auto;
}
.popup_cart-item-remove {
width: 14px;
display: flex;
align-items: center;
justify-content: center;
}
.product_container .no_image.images_item{
background-color: #0000000a;
height: calc(100vh - 200px);
}
.text_transform_class.btm-item.mob{
display: none;
}
.flt-_name_arrow.fa-chevron-down{
width: 16px;
height: 16px;
display: flex;
align-items: center;
justify-content: center;
transition: transform 0.2s ease;
}
.flt-_name_arrow.fa-chevron-down::before {
content: '';
width: 6px;
height: 6px;
border-right: 1.2px solid currentColor;
border-bottom: 1.2px solid currentColor;
transform: rotate(45deg);
margin-top: -2px;
}
.flt-_name.active .flt-_name_arrow.fa-chevron-down{
transform: rotate(-90deg) ;
}
.flt-_name{
cursor: pointer;
}
.flt-btn.catalog_tab svg{
transition: 200ms linear;
}
.flt-btn.catalog_tab.active svg{
transform: rotate(90deg);
transition: 200ms linear;
}
.table_sizes td{
padding:15px;
border: 1px solid rgba(20, 20, 2, 0.1);
text-align: center;
text-transform: none;
}
.popup_style_new{
opacity: 0;
visibility: hidden;
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 1000000;
background: rgba(76, 73, 70, 0.47)!important;
}
.popup_style_new.active{
opacity: 1;
visibility: visible;
}
.popup_style_new .panel{
background: #Ffffff;
padding: 60px;
width: 85%;
position: fixed;
top: 50%;
transform: translateY(-50%);
left: 0;
right: 0;
margin: 0 auto;
z-index: 1;
box-shadow: 1px 1px 15px 0 rgba(0,0,0,0.1);
box-sizing: border-box;
}
.popup_style_new .popup_close{
position: absolute;
cursor: pointer;
opacity: 1;
width: 20px;
height: 20px;
top: 30px !important;
right: 30px !important;
background-image: url(../images/close.svg);
background-size: 14px;
background-position: center;
background-repeat: no-repeat;
}
.table_sizes{
width: 100% !important;
height: auto!important;
border-collapse: separate;
border-spacing: 10px;
background-color: transparent;
}
.table_sizes th{
letter-spacing: var(--letter_spacing_wide);
padding: 15px 0;
border: 1px solid var(--color_accent);
background: var(--color_accent);
color: #fff;
vertical-align: middle;
}
.table_scroll {
overflow-x: auto;
}
.not_found{
min-height: calc(100vh - 317px);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin: 30px auto;
}
.not_found_block{
max-width: 550px;
width: 100%;
margin: 0 auto;
padding: 50px;
box-sizing: border-box;
background: #0000000a;
}
.not_found .sec-heading{
font-size: var(--big_title);
line-height: 1;
}
.aside-dropdown{
display: none;
position: relative;
margin-bottom: 20px; width: 100%;
box-sizing: border-box;
}
.aside-choose{
border: 1px solid rgba(33, 33, 33, 0.26);
padding: 15px;
position: relative;
width: 100%;
box-sizing: border-box;
cursor: pointer;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
}
.aside-choose:before{
content: '';
position: absolute;
right: 10px;
top: 15px;
background-image: url("../images/ar-sub.svg");
width: 20px;
height: 20px;
background-size: 8px;
background-repeat: no-repeat;
background-position: center;
transition-duration: 0.3s;
transform: rotate(90deg);
}
.aside-choose.active:before{
transform: rotate(270deg);
transition-duration: 0.3s;
}
.aside-menu{
display: none;
position: absolute;
top: 100%;
left: 0;
background-color: #fff;
border: 1px solid rgba(33, 33, 33, 0.26);
padding: 15px;
z-index: 10;
cursor: pointer; width: 100%;
box-sizing: border-box;
margin-top: 5px;
}
.aside-menu a:last-child{
margin-bottom: 0;
}
.aside-menu a{
display: block;
margin-bottom: 10px;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
}
.cart-item-detail {
padding-top: 12px;
margin-top: 20px;
border-top: 1px solid rgba(33, 33, 33, 0.26);
}
.products_list.fix {
grid-template-columns: 1fr 1fr 1fr;
}
.table td{
padding: 15px;
border-top: 1px solid rgba(33, 33, 33, 0.26);
vertical-align: middle;
box-sizing: border-box;
}
.table thead td {
text-transform: uppercase;
border-top: none;
letter-spacing: var(--letter_spacing_wide);
background-color: var(--color_accent);
color: #ffffff;
}
.fn_user_orders_switch {
margin: auto;
display: block;
width: 20px;
height: 20px;
background-image: url("../images/ar-sub.svg");
background-repeat: no-repeat;
background-size: 11px;
background-position: center;
transition: 300ms linear;
}
tr.fn_user_orders_active .fn_user_orders_switch{
transform: rotate(90deg);
transition: 300ms linear;
}
.user_orders_hidden {
display: none;
}
.user_orders_hidden.fn_user_orders_show {
display: table-row;
}
.tabs__content .table{
width: 100%;
}
.purchases.purchases--user .cart-item-_item{
border: none;
}
.purchases.purchases--user .cart-item-_item {
border: none;
padding: 0;
margin: 0;
}
.user_orders_hidden.fn_user_orders_show td {
border: none;
padding: 15px 0;
}
.hide_in_desktop{
display: none;
}
.short_order_info{
display:grid;
grid-template-columns: 1fr 1fr;
grid-gap: 8px;
text-transform: none;
}
.purchases.purchases--user {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 20px;
}
.order_info div:first-child{
opacity: 0.5;
}
.order_info{
display:flex;
align-items: center;
justify-content: flex-start;
gap: 14px;
}
.order_purchase{
background: #0000000a;
padding: 20px;
}
.order_info_comment{
grid-column: span 2;
}
.order_info_product div:first-child{
opacity: 0.4;
}
.order_info_product{
text-transform: none;
display:flex;
align-items: center;
justify-content: flex-start;
gap: 12px;
}
.order_info_block{
display: flex;
flex-direction: column;
gap: 6px;
margin-top: 12px;
}
.flex_order_info{
display: flex;
align-items: flex-start;
justify-content: space-between;
text-transform: none;
margin-bottom: 9px;
}
.delivery_info{
text-align: right;
max-width: 70%;
}
.order_pay_delivery_info{
margin-top: 20px;
}
.flex_order_button{
margin-top: 30px;
display: flex;
align-items: center;
justify-content: center;
text-transform: none;
}
.cart-item-price_in_mob{
display: none;
}
.cart-item-amount_in_mob{
display: none;
}
.brand_item{
text-transform: none;
padding: 20px;
justify-content: center;
}
.post-_preview:before{
content: '';
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 2;
background-image: linear-gradient(rgba(33, 33, 33, 0) 0%, rgba(33, 33, 33, 0.62) 100%);
}
.post-_preview{
position: relative;
}
.post-_info {
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding: 20px;
z-index: 2;
}
.post-_title{
margin: 0;
transition-duration: 0.3s;
display: block;
color: #ffffff;
}
.color_name{
/* margin-left: 10px;*/
}
.products_per_page {
display: flex;
align-items: center;
justify-content: center;
text-transform: none;
gap: 16px;
margin-top: 40px;
}
.products_per_page__label{
opacity: 0.5;
display: block;
}
.products_per_page__buttons {
display: flex;
gap: 12px;
align-items: center;
justify-content: center;
}
a.products_per_page__button{
display: flex;
align-items: center;
justify-content: center;
min-width: 32px;
height: 32px;
padding: 5px;
transition: all 0.2s ease;
text-transform: uppercase;
}
a.products_per_page__button.active{
background: var(--color_black);
color: #fff;
}
.product_page .color_item.active{
margin-left: 3px;
}
.fn_switch.coupon__title.delivery__name.hidden{
display: none;
}
.field-error {
position: absolute;
top: -9px;
left: 0;
color: red;
padding: 0 5px;
background-color: #ffffff;
margin-left: 4px;
display: none;
}
.field-error.active {
display: block;
}
#fn_fast_order{
max-width: 550px;
width: 100%;
padding: 40px 20px;
}
#fast_order_product_name{
margin-bottom: 22px;
text-align: center;
}
.pre_order_button{
text-transform: none;
line-height: 0.9;
text-align: right;
}
.prod-thumb-_buttons{
display: flex;
align-items: center;
justify-content: center;
}
.preorder_label{
color: #ffffff;
text-transform: none;
background-color: var(--color_black);
padding: 5px 10px;
box-sizing: border-box;
}
.flex_preorder{
display: flex;
margin-bottom: 10px;
}
.general_error {
position: relative;
top: 0;
text-transform: none;
text-align: center;
padding: 10px;
border: 1px solid red;
background-color: #ff000012;
margin: 20px auto;
}
.hover-fx,.menu_group__link ,.categories_menu__link {
transition: opacity 0.3s ease;
position: relative;
}
.left_padding{
padding-left: 0;
}
@keyframes pulseWave {
0% {
transform: scale(0.8);
opacity: 0.6;
}
100% {
transform: scale(1.8);
opacity: 0;
}
}
.top-brands__link{
display: block;
}
a.menu_group__link.menu_group__link_98:after,a.menu_group__link.menu_group__link_98:before{
background-color: var(--color_red);
}
.hover-fx:after,.hover-fx:before,
.menu_group__link:after,.menu_group__link:before,
.categories_menu__link:after,.categories_menu__link:before,
.cat_item .cat_name:after,.cat_item .cat_name:before {
display: none;
}
.size:after {
display: none;
}
label.size {
padding: 4px 6px;
box-sizing: border-box;
}
label.size.active {
background: var(--color_black);
color: #fff;
}
.wishlist_button,.prod-thumb-_button_text{
transition-duration: 0.8s;
}
.cat_item .cat_name:before,.cat_item .cat_name:after{
background-color: #ffffff;
}
.arrow_read.rotated{
transform: rotate(-90deg);
transition: 500ms linear;
}
.arrow_read{
display: flex;
align-items: center;
justify-content: center;
width: 20px;
height: 20px;
transition: 500ms linear;
}
.fast_order_flex{
display: flex;
align-items: center;
justify-content: center;
}
.aside-a a.selected:before{
transform: scaleX(1);
transform-origin: left;
}
.aside-a a.selected:after{
transform: scaleX(1);
transform-origin: right;
}
.table_users_orders td{
text-transform: none;
}
.slider_prod_item img.sticker__image{
background-color: transparent;
}
.all_categories_image img{
max-width: 100%;
height: auto;
max-height: 100%;
}
.all_categories_image {
width: 100%;
height: 180px;
display: flex;
align-items: center;
justify-content: center;
}
.all_categories_name{
text-align: center;
text-transform: none;
margin-top: -10px;
}
.category_item {
display: block;
}
.no_image_cat img{
max-width: 50px;
}
.cat_carousel .swiper-pagination{
bottom: 0;
}
.cat_carousel {
padding-bottom: 33px;
}
.store_image img{
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.store_image{
width: 100%;
display: flex;
height: 500px;
align-items: center;
justify-content: center;
overflow: hidden;
}
.store_name{
margin-top: 16px;
margin-bottom: 16px;
text-align: left;
text-transform: none;
}
.store_item{
padding-bottom: 10px;
}
.flex_map,.flex_store{
display: grid;
grid-template-columns: 1fr;
gap: 24px;
}
.flex_map .store_image{
height: 400px;
filter:grayscale(100%);
}
.page_contact_description{
padding-top: 40px;
}
.more_colors_toggle{
cursor: pointer;
transition: 200ms linear;
}
.other_colors {
position: absolute;
background-color: #ffffff;
right: 0;
padding: 5px 0;
left: 0;
justify-content: space-between;
align-items: center;
}
.colors_flex_new{
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
}
.hide_colors {
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
text-transform: none;
white-space: nowrap;
margin-left: 15px;
}
.hide_colors svg{
width: 10px;
height: 10px;
margin-right: 5px;
}
.fn_sale_slide .prod-thumb-_name_link{
min-height: auto;
}
body.menu-open {
width: 100%;
overflow: hidden; /* можна і без цього, але нехай буде */
}
.store_slide picture img{
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.store_slide picture,.store_slide video{
width: 100%;
display: block;
height: 500px;
}
.store_carousel .swiper-pagination {
bottom: 0;
}
.store_carousel {
padding-bottom: 30px;
}
.main {
min-height:calc(100vh - 472px);
}
/* ========================================
NEW PRODUCT CARD STYLES
======================================== */
/* Product image container */
.prod-thumb-_image {
position: relative;
aspect-ratio: 3/4;
height: auto;
}
/* Wishlist icon overlay on photo */
.prod-wishlist-overlay {
position: absolute;
top: 12px;
right: 12px;
z-index: 5;
}
.prod-wishlist-overlay .wishlist_button {
width: 32px;
height: 32px;
display: flex;
align-items: center;
justify-content: center;
background: rgba(255, 255, 255, 0.5);
border-radius: 50%;
}
.prod-wishlist-overlay .wishlist_button svg {
width: 16px;
height: 13px;
}
/* Colors overlay on photo (shown on hover) */
.prod-colors-overlay {
position: absolute;
bottom: 12px;
left: 12px;
right: 12px;
display: flex;
align-items: center;
gap: 8px;
opacity: 0;
visibility: hidden;
transition: var(--transition);
z-index: 5;
}
/* Sizes overlay on photo (shown on hover) */
.prod-sizes-overlay {
position: absolute;
bottom: -10px;
left: 0;
right: 0;
display: flex;
align-items: center;
justify-content: flex-start;
gap: 16px;
flex-wrap: wrap;
padding: 10px 0;
background: #ffffff;
border: none;
visibility: hidden;
transform: translateY(100%);
transition: all 0.5s ease;
z-index: 4;
}
.prod-preview.fn_product .prod-info {
z-index: 5;
margin-top: 12px;
position: relative;
background-color: white;
}
.prod-sizes-overlay .size {
text-transform: uppercase;
cursor: pointer;
transition: var(--transition);
}
.prod-sizes-overlay .size.no-stock {
opacity: 0.3;
text-decoration: line-through;
}
/* Product info below photo */
.prod-info {
margin-top: 12px;
}
.prod-info-row {
margin-bottom: 4px;
}
.prod-info-row:last-child {
margin-bottom: 0;
}
/* Name + Price row */
.prod-info-main {
display: flex;
justify-content: space-between;
align-items: flex-start;
gap: 12px;
}
.prod-info-main .prod-thumb-_name_link {
flex: 1;
text-transform: none;
color: var(--color_black);
max-width: none;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.prod-price-block {
display: flex;
align-items: center;
gap: 8px;
flex-shrink: 0;
}
.prod-price-block .price {
white-space: nowrap;
}
.prod-price-block .price-old {
opacity: 0.5;
text-decoration: line-through;
white-space: nowrap;
}
.prod-price-block .price--red {
color: var(--color_accent);
}
/* Color name row */
.prod-color-name {
color: var(--color_gray);
text-transform: capitalize;
}
/* Colors count / circles row */
.prod-colors-row {
position: relative;
min-height: 24px;
margin-top: 10px;
}
.prod-colors-count {
color: var(--color_gray);
transition: var(--transition);
opacity: 0.55;
font-style: italic;
}
.prod-colors-circles {
display: flex;
align-items: center;
gap: 10px;
opacity: 0;
visibility: hidden;
position: absolute;
top: 0;
left: 1px;
transition: var(--transition);
margin-left: 2px;
}
.prod-colors-circles .color_item {
width: 24px;
height: 24px;
border: none;
}
.prod-colors-circles .color_item.active {
border: none;
box-shadow: 0 0 0 1px var(--color_black), inset 0 0 0 4px #ffffff;
}
/* Sizes list inside overlay */
.prod-sizes-list {
display: flex;
align-items: center;
justify-content: flex-start;
gap: 10px;
flex-wrap: wrap;
flex: 1;
}
/* Cart button in sizes overlay */
.prod-add-cart {
width: 24px;
height: 24px;
display: flex;
align-items: center;
justify-content: center;
background: transparent;
border: none;
cursor: pointer;
transition: var(--transition);
flex-shrink: 0;
/*margin-left: 12px;*/
}
.order_pay_delivery_info {
margin-top: 0;
padding-top: 20px;
border-top: 1px solid rgba(33, 33, 33, 0.1);
}
.prod-add-cart img {
width: 18px;
height: 18px;
}
/* Remove old styles conflicting with new layout */
.prod-preview .flex_prod,
.prod-preview .prod-thumb-_prices,
.prod-preview .prod-thumb-_buttons,
.prod-preview .prod_colors,
.prod-preview .product_sizes {
display: none !important;
}
/* ========================================
AUTH PAGES (Login / Register)
======================================== */
.auth-page {
max-width: 400px;
margin: 0 auto;
padding: 60px 0 80px;
}
.auth-page__header {
margin-bottom: 32px;
}
.auth-page__title,.section_title {
font-size: var(--medium_title);
font-weight: 500;
line-height: 1.3;
}
.section_title{
margin-bottom: 20px;
text-align: center;
}
.auth-page__form {
width: 100%;
}
.auth-page__error {
color: var(--color_accent);
margin-bottom: 20px;
}
.auth-page__input {
width: 100%;
height: 48px;
padding:0 15px;
border: 1px solid var(--color_border);
background: transparent;
color: var(--color_black);
outline: none;
transition: border-color 0.2s ease;
box-sizing: border-box;
}
.auth-page__input::placeholder {
letter-spacing: var(--letter_spacing_main);
font-family: 'Manrope', serif!important;
color: rgba(33, 33, 33, 0.3);
}
.auth-page__input:focus {
border-color: var(--color_black);
}
.auth-page__captcha {
margin-bottom: 16px;
}
.auth-page__submit {
background: var(--color_black);
height: 48px;
color: #ffffff;
width: 100%;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
border: none;
cursor: pointer;
transition: var(--transition);
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
border-radius: var(--border_radius);
}
.auth-page__form form{
display: flex;
flex-direction: column;
gap: 20px;
}
.auth-page__field {
position: relative;
}
.auth-page__links {
margin-top: 20px;
display: flex;
gap: 12px;
justify-content: space-between;
}
.auth-page__links a {
color: var(--color_black);
text-decoration: underline;
text-underline-offset: 4px;
transition: color 0.2s ease;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
}
.auth-page__hint {
color: var(--color_black);
margin-bottom: 20px;
line-height: 1.5;
}
.auth-page__success {
line-height: 1.6;
}
.top_admin_bookmark,a.openTools{
display: none;
}
.catalog_popup_menu_script{
text-transform: uppercase;
display: flex;
gap: 20px;
align-items: center;
justify-content: flex-start;
cursor: pointer;
letter-spacing: var(--letter_spacing_wide);
text-decoration: underline;
text-underline-offset: 4px;
}
.categories_menu_popup {
background: #ffffff;
position: absolute;
display: block;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 1;
padding: 30px var(--big_padding_left);
transform: translateX(-100%);
transition: 200ms linear;
padding-left: 100px;
box-sizing: border-box;
}
.categories_menu_popup.active_categories {
transition: 200ms linear;
transform: translateX(0);
}
.cat_popup_close svg{
transform: rotate(180deg);
}
.cat_popup_close {
position: absolute;
left: var(--big_padding_left);
top: 30px;
display: flex;
flex-direction: row-reverse;
gap: 10px;
align-items: center;
justify-content: flex-start;
text-transform: uppercase;
cursor: pointer;
letter-spacing: var(--letter_spacing_wide);
text-decoration: underline;
text-underline-offset: 4px;
}
.level_1.categories_nav__menu {
overflow-y: auto;
position: absolute;
left:var(--big_padding_left);
top: 85px ;
bottom: 30px;
right: 0;
}
.mob_menu a{
/*text-transform: uppercase;*/
}
.prod_pagination {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
margin-top: 40px;
}
.pages_menu_contact .social_list a{
filter: invert(1);
}
.footer .schedule a{
color: rgba(255, 255, 255, 0.7);
}
.sizes_flex_filter .flt-_group{
flex-direction: row;
}
.sizes_flex_filter .flt-_link{
text-transform: uppercase;
border: 1px solid rgba(33, 33, 33, 0.2);
padding: 0 8px;
height: 30px;
min-width: 50px;
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
}
.cart_title_block{
margin-bottom: 20px;
padding-bottom: 20px;
border-bottom: 1px solid rgba(33, 33, 33, 0.1);
}
.menu_account_block{
display: flex;
align-items: center;
justify-content: flex-start;
text-transform: uppercase;
gap: 8px;
}
.menu_account_block.account__link {
right: 0;
text-decoration: underline;
text-underline-offset: 4px;
}
.mob_menu .schedule:first-child{
margin-top: 0;
}
.cart-item-it-size{
text-transform: uppercase;
}
.flex_order_button .all,.not_found_block .all{
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
text-decoration: underline;
text-underline-offset: 4px;
}
span.order_payment__name {
text-align: right;
}
.not_found_block .sec-heading{
text-align: left;
font-size: 56px;
}
.social_contact.social_list a{
filter: invert(1);
}
.brand_image{
aspect-ratio: 1 / 1;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.flex-column-brand{
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 20px;
}
.brand_url{
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
text-decoration: underline;
text-underline-offset: 4px;
color: #ffffff;
transition: 200ms linear;
cursor: pointer;
}
.brand_name{
color: #fff;
font-size: var(--medium_title);
text-align: center;
margin-bottom: 20px;
}
.brand_block_flex{
display: flex;
justify-content: center;
}
.flex_page_text{
display: flex;
align-items: center;
justify-content: space-between;
gap: 50px;
max-width: 100%;
}
.image_page_text img{
max-width: 100%;
}
.image_page_text{
width:50%;
flex-shrink: 0;
}
.announcement{
position: fixed;
top: 0;
left: 0;
right: 0;
width: 100%;
height: var(--announcement-height);
background-color: var(--color_black);
display: flex;
align-items: center;
color: #ffffff;
z-index: 100;
}
.announcement__divider {
margin-left: 10px;
margin-right: 10px;
width: 1px;
background-color: #ffffff;
height: 10px;
display: block;
}
.announcement_flex{
display: flex;
align-items: center;
justify-content: flex-start;
}
.announcement {
overflow: hidden;
background: #000;
color: #fff;
white-space: nowrap;
}
.announcement__track {
display: flex;
width: max-content;
animation: marquee 85s linear infinite;
}
.announcement__content {
display: flex;
align-items: center;
padding-right: 80px;
}
.announcement__divider {
width: 4px;
height: 4px;
background: #fff;
margin: 0 12px;
}
@keyframes marquee {
from {
transform: translateX(0);
}
to {
transform: translateX(-50%);
}
}
:root {
--announcement-height:36px;
--header-height:70px;
}
.height_new{
height: calc(var(--announcement-height) + var(--header-height));
}
:root{
--announcement-height: 36px;
--header-height: 70px;
}
/* резерв під шапку + плашку (щоб контент не підлазив під fixed) */
.height_new{
height: calc(var(--announcement-height) + var(--header-height));
}
/* шапка завжди “стартує” нижче плашки */
.header{
top: var(--announcement-height);
transition: transform .35s cubic-bezier(0.16, 1, 0.3, 1);
will-change: transform;
}
/* сама плашка їде вверх */
.announcement{
transform: translateY(0);
transition: transform .35s cubic-bezier(0.16, 1, 0.3, 1);
will-change: transform;
}
.search-bar {
/* твої існуючі властивості лишаємо */
position: fixed;
top: calc(var(--announcement-height) + var(--header-height));
left: 0;
right: 0;
/* ДОДАЄМО transform у transition */
transition:
max-height 0.35s cubic-bezier(0.16, 1, 0.3, 1),
opacity 0.25s ease,
transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
will-change: transform, max-height, opacity;
}
/* коли плашка ховається */
html.is-announcement-hidden .search-bar{
transform: translateY(calc(-1 * var(--announcement-height)));
}
html.is-announcement-hidden .announcement{
transform: translateY(-100%);
}
html.is-announcement-hidden .header{
transform: translateY(calc(-1 * var(--announcement-height)));
}
.client_flex strong{
font-weight: 500 ;
}
.client_flex{
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
font-weight: 400;
color: #ffffff;
margin-bottom: 36px;
}
.client_line{
width: 1px;
height: 16px;
background: #FFF;
margin:0 10px;
}
.client_star svg{
width: 85px;
height: 12px;
}
.client_star{
margin-right: 10px;
width: 85px;
}
.opacity{
opacity: 0.7;
}
.banner_button{
border: 1px solid #fff;
color: #ffffff;
text-transform: uppercase;
letter-spacing: var(--letter_spacing_wide);
height: 53px;
display: flex;
align-items: center;
justify-content: center;
padding:0 27px;
transition: 200ms linear;
}
.banner_group_image:after{
content: " ";
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
background-color: hsl(0deg 0% 0% / 20%);
}
.banner_block .swiper-pagination{
display: none!important;
}
.review_item{
width: 100%;
padding: 22px;
background: #F9F9F9;
display: flex;
flex-direction: column;
align-items: flex-start;
box-sizing: border-box;
}
.reviews_name{
margin-bottom: 5px;
line-height: 19.5px;
}
.top_reviews_flex{
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 16px;
width: 100%;
}
.name_flex{
display: flex;
align-items: center;
justify-content: flex-start;
gap: 21px;
}
.reviews_image{
width: 78px;
height: 78px;
border-radius: 78px;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
.instagram_reviews svg{
width: 12px;
height: 12px;
}
.instagram_reviews{
display: flex;
align-items: center;
gap: 6px;
text-transform: uppercase;
margin-bottom: 8px;
}
.data_reviews{
text-align: right;
color: #757575;
opacity: 0.55;
}
.reviews_star{
display: flex;
align-items: center;
justify-content: flex-start;
gap: 3px;
}
.fn_reviews_slide {
padding-bottom: 48px;
}
.video_mob {
height: 100%;
overflow: hidden;
}