/**
 * Theme Name: techservis
 * Author: pnv
 * Version: 1.0
 * 
 * @package techservis
 */

/* Main */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

:root {
	--arrow: url('./assets/svg/arrow.svg'), center, 100%, no-repeat;
	--black: #333333;
	--yellow: #FEC12D;
	--blue: #274CE1;
	--opacity-hover: 0.85;
	--box-shadow: 0 4px 10px 1px rgba(0, 0, 0, 0.07);
	--box-shadow-hover: 0 4px 10px 1px rgba(0, 0, 0, 0.15);
}

@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity: 1;}
}

@keyframes fadeOut {
    from {opacity: 1;}
    to {opacity: 0;}
}

body {
	color: var(--black);
}

* {
	font-family: "Montserrat", sans-serif;
	font-size: 16px;
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}

body {

}

section {
	margin-bottom: 100px;
}

.title {
	font-weight: 700;
}

h1 {
	font-size: 36px;
}

.title,
h2 {
	font-size: 36px;
}

h3 {
	font-size: 24px;
}

h4 {
	font-size: 20px;
}

h5 {
	font-size: 18px;
}

h6 {
	font-size: 16px;
}

.title,
h1,
h2,
h3,
h4,
h5,
h6 {
	text-transform: uppercase;
	line-height: 120%;
}

.title > span,
h1 > span,
h2 > span,
h3 > span,
h4 > span,
h5 > span,
h6 > span {
	font-size: inherit;
	color: var(--yellow);
}

section h1,
section h2,
section h3 {
	margin-bottom: 20px;
}


a {
	color: var(--black);
	text-decoration: none;
	cursor: pointer;
}

a:hover {
	color: var(--yellow);
}

button {
	cursor: pointer;
}

a,
button {
	transition: all .3s;
}

img {
	display: block;
	width: 100%;
	height: auto;
}

table {
	width: 100%;
}

.wrapper {
	max-width: 1220px;
	width: 100%;
	padding: 0 20px;
	margin: 0 auto;
}

.title-with-link {
	display: flex;
	align-items: center;
	gap: 15px;
	margin-bottom: 20px;
}

.title-with-link * {
	margin: 0;
}

.title-with-link a {
	color: var(--blue);
	border-color: var(--blue);
}

.title-with-link a:hover {
	color: #fff;
	border-color: var(--blue);
	background: var(--blue);
}

main .slider-controls {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	margin-top: 30px;
}

main .slider-controls * {
	position: relative!important;
	margin: 0!important;
	top: unset!important;
	bottom: unset!important;
	right: unset!important;
	left: unset!important;
}

main .slider-controls .swiper-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: fit-content;
}

main .slider-controls .swiper-pagination .swiper-pagination-bullet {
	background: var(--yellow);
	border-radius: 5px;	
	width: 150px;
	height: 3px;
}

main .slider-controls .swiper-button-prev,
main .slider-controls .swiper-button-next {
	width: 24px;
	height: 24px;
} 

main .slider-controls .swiper-button-prev svg,
main .slider-controls .swiper-button-next svg {
	display: none;
}

main .slider-controls .swiper-button-prev::before,
main .slider-controls .swiper-button-next::before {
	content: '';
	display: block;
	background-image: url(./assets/svg/rounded-arrow.svg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	width: 24px;
	height: 24px;
}

main .slider-controls .swiper-button-next::before {
	rotate: 180deg;
}

#upButton {
	display: block;
	position: fixed;
	background: var(--arrow);
	background-color: var(--yellow);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px;
	border-radius: 5px;
	width: 34px;
	height: 34px;
	left: 20px;
	bottom: 20px;
	rotate: 180deg;
	transition: none;
	z-index: 50;
}

.button {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	font-size: 14px;
	color: #fff;
	background: var(--yellow);
	border: 1px solid var(--yellow);
	border-radius: 5px;
	padding: 7px 15px;
}

.button:hover {
	opacity: var(--opacity-hover);
}

.button-alt {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	font-size: 14px;
	color: var(--black);
	background: transparent;
	border: 1px solid var(--yellow);
	border-radius: 5px;
	padding: 7px 15px;
}

.button-alt:hover {
	color: #fff;
	background: var(--yellow);
}

/* Content */

.content,
.content *:not(h1, h2, h3, h4, h5, h6) {
	line-height: 160%;
}

.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content h6 {
	margin-bottom: 20px;
}

.content img {
	cursor: pointer;
	margin-bottom: 20px;
}

.content p:not(:last-child),
.content b:not(:last-child),
.content strong:not(:last-child),
.content table,
.content blockquote {
	margin-bottom: 20px;
}

.content ul,
.content ol {
	margin: 0 0 20px 20px;
}

.content a {
	color: var(--blue);
	text-decoration: none;
	cursor: pointer;		
}

.content a:hover {
	text-decoration: underline;
}

.content blockquote {
	background: #f6f6f6;
	border-radius: 10px;
	padding: 20px 30px;
}

table {
	border-collapse: collapse;
	width: 100%;
}

table thead {
	background: rgba(254, 193, 45, 0.5);
}

table th,
table td {
	font-size: 14px;
	text-align: center;
	padding: 10px;
}

table thead th:not(:last-child) {
	border-right: 1px solid rgba(0, 0, 0, 0.1);
}

table tbody td:not(:last-child) {
	border-right: 1px solid rgba(0, 0, 0, 0.1);
}

table tbody tr:nth-child(odd) {
	background: #f6f6f6;
}

table tbody tr:nth-child(even) {
	background: rgba(28, 81, 249, 0.03);
}

select {
	display: flex;
	align-items: center;
	color: var(--black);
	line-height: 160%;
	outline: none;
	border: 0;
	cursor: pointer;
}

select:hover {
	background: none;
}

select::picker-icon {
	content: '';
	filter: brightness(0);
	display: block;
	background: var(--arrow);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	width: 12px;
	height: 8px;
	transition: 0.3s rotate;
}

select:open::picker-icon {
	rotate: 90deg;
}

select option {
	display: flex;
	font-size: 13px;
	border: 1px solid #dddddd;
	background: #eeeeee;
	padding: 5px 10px;
	transition: 0.3s;
}

select option:nth-of-type(odd) {
	background: white;
}

select option:first-of-type {
	border-radius: 5px 5px 0 0;
}

select option:last-of-type {
	border-radius: 0 0 5px 5px;
}

select option:not(option:last-of-type) {
	border-bottom: none;
}

option::checkmark {
	content: '';
}

option:checked {
	font-weight: 700;
}
  
select,
::picker(select) {
	appearance: base-select;
}

::picker(select) {
	border: 0;
	border-radius: 5px;
}

/* Content Heading */

.content-heading {
	margin-bottom: 20px;
}

.breadcrumbs,
.breadcrumbs * {
	font-size: 13px;
	color: #bdbdbd;
}

/* Gallery */

.gallery {
	display: grid;
	gap: 20px;
}

.gallery img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 10px;
	margin: 0
}

.wp-block-gallery {
	display: grid;
	gap: 20px;
}

.wp-block-gallery > figure {
	width: 100%;
}

.wp-block-gallery figure {
	margin: 0;
}

.wp-block-gallery img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 10px;
	margin: 0
}

.wp-block-image {
	margin-bottom: 20px;
}

/* Gallery / Columns */

.gallery {
	display: grid;
	gap: 20px;
}

.gallery img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 10px;
	margin: 0
}

.columns-default {
	grid-template-columns: repeat(3, 1fr);
}

.columns-1,
.gallery-columns-1 {
	grid-template-columns: repeat(1, 1fr);
}

.columns-2,
.gallery-columns-2 {
	grid-template-columns: repeat(2, 1fr);
}

.columns-3,
.gallery-columns-3 {
	grid-template-columns: repeat(3, 1fr);
}

.columns-4,
.gallery-columns-4 {
	grid-template-columns: repeat(4, 1fr);
}

.columns-5,
.gallery-columns-5 {
	grid-template-columns: repeat(5, 1fr);
}

.columns-6,
.gallery-columns-6 {
	grid-template-columns: repeat(6, 1fr);
}

.columns-7,
.gallery-columns-7 {
	grid-template-columns: repeat(7, 1fr);
}

.columns-8,
.gallery-columns-8 {
	grid-template-columns: repeat(8, 1fr);
}

.columns-9,
.gallery-columns-9 {
	grid-template-columns: repeat(9, 1fr);
}

/* Header */

header .header-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 40px;
	margin: 20px 0;
}

header .header-top .header-top-left {
	display: flex;
	align-items: center;
	gap: 50px;
}

header .header-top .header-top-left .header-logo img {
	width: 190px;
}

header .header-top .header-top-left .header-registry img {
	width: 120px;
}

header .header-top .header-top-right {
	display: flex;
	align-items: center;
	gap: 15px;
}

header .header-top .header-top-right .header-socials {
	display: flex;
	align-items: center;
	gap: 5px;
}

header .header-top .header-top-right .header-socials img {
	width: 24px;
	height: 24px;
}

header .header-top .header-top-right .callback {
	height: 35px;
}

header .header-top .header-top-right .callback::before {
	content: '';
	display: block;
	background-image: url(./assets/svg/send.svg);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	width: 20px;
	height: 20px;
	transition: all .3s;
}

header .header-top .header-top-right .callback:hover::before {
	filter: brightness(0) invert(1);
}

header .header-top .header-top-right .header-phone {
	display: flex;
	align-items: center;
	gap: 5px;
	background: #f5f5f5;
	border-radius: 5px;
	position: relative;
	height: 35px;
	padding: 7px 15px;
}

header .header-top .header-top-right .header-phone:hover > a::after {
	rotate: 90deg;
}

header .header-top .header-top-right .header-phone img {
	position: relative;
	width: 20px;
	height: 20px;
	z-index: 2;
}

header .header-top .header-top-right .header-phone > a {
	display: flex;
	align-items: center;
	gap: 5px;
}

header .header-top .header-top-right .header-phone > a::after {
	content: '';
	display: block;
	filter: brightness(0);
	background: var(--arrow);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	width: 8px;
	height: 5px;
	transition: all .3s;
}

header .header-top .header-top-right .header-phone a {
	font-size: 14px;
	animation: fadeIn .3s forwards;
	position: relative;
	z-index: 2;
}

header .header-top .header-top-right .header-phone:hover .toggle-phones {
	animation: fadeIn .3s forwards;
	display: flex;
}

header .header-top .header-top-right .header-phone .toggle-phones {
	animation: fadeOut .3s forwards;
	display: none;
	align-items: center;
	gap: 5px;
	background: #f5f5f5;
	border-radius: 5px;
	position: absolute;
	width: 100%;
	padding: 7px 15px;
	padding-top: 20px;
	top: 20px;
	left: 0;
	z-index: 1;
}

header .header-top .header-top-right .header-phone .toggle-phones a {
	display: flex;
	align-items: center;
	gap: 5px;
}

header .header-top .header-top-right .header-phone .toggle-phones a::before {
	content: '';
	display: block;
	width: 20px;
	height: 20px;
}

header .header-bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 50px;
	position: relative;
	margin-bottom: 20px;
}

header .header-bottom .header-bottom-left {
	display: flex;
	align-items: center;
	gap: 50px;
	width: 100%;
}

header .header-bottom .header-bottom-left .header-catalog button {
	display: flex;
	align-items: center;
	gap: 5px;
	background: none;
	border: 0;
}

header .header-bottom .header-bottom-left .header-catalog button:hover {
	color: var(--yellow);
}

header .header-bottom .header-bottom-left .header-catalog button::before {
	content: '';
	display: block;
	background-image: url(./assets/svg/burger.svg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	width: 14px;
	height: 10px;
}

header .header-bottom .header-bottom-left .header-menu ul {
	display: flex;
	align-items: center;
	gap: 50px;
	justify-content: space-between;
	list-style: none;
}

header .header-bottom .header-bottom-right .header-search form {
	display: flex;
	align-items: center;
	width: 290px;
}

header .header-bottom .header-bottom-right .header-search form input {
	font-size: 14px;
	border: 1px solid #ebebeb;
	border-radius: 5px;
	width: 100%;
	height: 35px;
	padding-left: 10px;
	outline: var(--yellow);
}

header .header-bottom .header-bottom-right .header-search form input::placeholder {
	font-size: 14px;
	color: #bdbdbd;
}

header .header-bottom .header-bottom-right .header-search form button {
	background: none;
	border: 0;
	position: absolute;
	right: 5px;
}

header .header-bottom .header-bottom-right .header-search form button img {
	width: 24px;
	height: 24px;
}

#search-result {
	display: none;
	flex-direction: column;
	gap: 10px;
	background: #fff;
	box-shadow: var(--box-shadow);
	border-radius: 5px;
	position: absolute;
	width: 100%;
	margin-top: 20px;
	padding: 10px 20px;
	top: 30px;
	left: 0;
	z-index: 99;
}

#search-result.active {
	display: flex;
}

#search-result .search-item a {
	display: flex;
	align-items: center;
	gap: 5px;
}

#search-result .search-item a img {
	width: 64px;
	height: 64px;
	object-fit: contain;
}

#search-result .search-item a .product-title {
	font-size: 16px;
	padding: 0;
}

#search-result .search-item a .product-price {
	margin-left: auto;
}

/* Footer */

footer {
	background: #414141;
	position: relative;
}

footer * {
	color: #fff;
	font-style: normal;
}

footer .footer-top > div {
	display: flex;
	align-items: center;
	justify-content: space-between;
	position: relative;
	gap: 120px;
	padding: 35px 20px;
}

footer .footer-top::after {
	content: '';
	background: var(--yellow);
	position: absolute;
	width: 100%;
	height: 1px;
}

footer .footer-top .footer-top-left .footer-logo img {
	width: 190px;
}

footer .footer-top .footer-top-right {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 100px;
	width: 100%;
}

footer .footer-top .footer-top-right * {
	font-size: 14px;
}

footer .footer-top .footer-top-right .footer-info {
	display: flex;
	align-items: center;
	gap: 40px;
}

footer .footer-top .footer-top-right .footer-info img {
	width: 24px;
	height: 24px;
}

footer .footer-top .footer-top-right .footer-info .footer-address {
	display: flex;
	align-items: flex-start;
	gap: 5px;
}

footer .footer-top .footer-top-right .footer-info .footer-schedule {
	display: flex;
	align-items: flex-start;
	gap: 5px;
}

footer .footer-top .footer-top-right .footer-contacts {
	display: flex;
	align-items: center;
	gap: 40px;
}

footer .footer-top .footer-top-right .footer-contacts img {
	filter: brightness(0) invert(1);
	width: 24px;
	height: 24px;
}

footer .footer-top .footer-top-right .footer-contacts .footer-email a {
	display: flex;
	align-items: flex-start;
	gap: 5px;
}

footer .footer-top .footer-top-right .footer-contacts .footer-phone {
	display: flex;
	align-items: center;
	gap: 5px;
	position: relative;
}

footer .footer-top .footer-top-right .footer-contacts .footer-phone:hover > a::after {
	rotate: 90deg;
}

footer .footer-top .footer-top-right .footer-contacts .footer-phone img {
	position: relative;
	z-index: 2;
}

footer .footer-top .footer-top-right .footer-contacts .footer-phone > a {
	display: flex;
	align-items: center;
	gap: 5px;
}

footer .footer-top .footer-top-right .footer-contacts .footer-phone > a::after {
	content: '';
	display: block;
	filter: brightness(0) invert(1);
	background: var(--arrow);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	width: 8px;
	height: 5px;
	transition: all .3s;
}

footer .footer-top .footer-top-right .footer-contacts .footer-phone a {
	animation: fadeIn .3s forwards;
	position: relative;
	z-index: 2;
}

footer .footer-top .footer-top-right .footer-contacts .footer-phone:hover .toggle-phones {
	animation: fadeIn .3s forwards;
	display: flex;
}

footer .footer-top .footer-top-right .footer-contacts .footer-phone .toggle-phones {
	animation: fadeOut .3s forwards;
	display: none;
	align-items: center;
	gap: 5px;
	position: absolute;
	width: 100%;
	padding-top: 10px;
	top: 20px;
	left: 0;
	z-index: 1;
}

footer .footer-top .footer-top-right .footer-contacts .footer-phone .toggle-phones a {
	display: flex;
	align-items: center;
	gap: 5px;
}

footer .footer-top .footer-top-right .footer-contacts .footer-phone .toggle-phones a::before {
	content: '';
	display: block;
	width: 24px;
	height: 24px;
}

footer .footer-middle {
	margin-top: 45px;
}

footer .footer-middle .footer-menu ul {
	list-style: none;
}

footer .footer-middle .footer-menu > div > ul {
	display: flex;
	gap: 60px;
}

footer .footer-middle .footer-menu > div > ul > li {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

footer .footer-middle .footer-menu > div > ul > li > a {
	font-weight: 700;
}

footer .footer-middle .footer-menu > div > ul > li > ul {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

footer .footer-middle .footer-menu > div > ul > li > ul a {
	font-size: 14px;
}

footer .footer-bottom {
	margin-top: 60px;
	padding-bottom: 15px;
}

footer .footer-bottom > div {
	display: flex;
	align-items: center;
	gap: 250px;
}

footer .footer-bottom > div * {
	font-size: 13px;
	color: #9B9B9B;
}

footer .footer-bottom .footer-policy {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

footer .footer-bottom .footer-policy a {
	text-decoration: underline;
}

/* 404 */

.error404 {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

.error404 h1 {
	font-size: 150px;
	line-height: normal;
	padding-bottom: 20px;
	border-bottom: 1px solid;
}

.error404 span {
	font-size: 24px;
}

/* Banner */

.banner {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	background-attachment: fixed;
	position: relative;
	min-height: 60vh;
	padding: 70px 0;
	margin-bottom: 20px;
	z-index: 1;
}

.banner *:not(span) {
	color: #fff;
}

.banner::after {
	content: '';
	display: block;
	background: rgba(0, 0, 0, 0.5);
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 2;
}

.banner .banner-wrapper {
	display: flex;
	flex-direction: column;
	gap: 25px;
	position: relative;
	width: 70%;
	z-index: 3;
}

.banner .banner-wrapper .banner-top {
	display: flex;
	flex-direction: column;
}

.banner .banner-wrapper .banner-top h1 {
	font-size: 42px;
	margin: 0;
}

.banner .banner-wrapper .banner-top .sub-title {
	font-size: 26px;
	font-weight: 400;
	white-space: nowrap;
}

.banner .banner-bottom {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-top: 30px;
}

.banner .banner-bottom button {
	color: var(--black);
}

.banner .banner-bottom button::before {
	content: '';
	display: block;
	background-image: url(./assets/svg/send.svg);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	width: 20px;
	height: 20px;
	transition: all .3s;
}

.banner .banner-bottom a::before {
	content: '';
	display: block;
	background-image: url(./assets/svg/burger.svg);
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	width: 14px;
	height: 10px;
	transition: all .3s;
}

.banner .banner-bottom a:hover::before {
	filter: brightness(0) invert(1);
}

/* Categories */

.categories {

}

.categories .categories-wrapper {
	display: grid;
	gap: 20px;
}

.categories .categories-wrapper .category > a {
	display: flex;
	align-items: center;
	gap: 10px;
	background: #f5f5f5;
	border-radius: 10px;
	position: relative;
	padding: 15px 30px;
}

.categories .categories-wrapper .category:hover > a {
	background: var(--yellow);
}

.categories .categories-wrapper .category:hover > a span {
	color: var(--black);
}

.categories .categories-wrapper .category > a img {
	position: relative;
	object-fit: cover;
	width: 110px;
	height: 125px;
	z-index: 2;
}

.categories .categories-wrapper .category > a span {
	font-size: 20px;
	color: var(--black);
	font-weight: 700;
	position: relative;
	z-index: 2;
}

.categories .categories-wrapper .category > a::after {
	content: '';
	display: block;
	background-image: url(./assets/svg/lines.svg);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	transition: all .3s;
	z-index: 1;
}

/* About */

.about {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	background-attachment: fixed;
	position: relative;
	padding: 70px 0;
	z-index: 1;
}

.about *:not(span) {
	color: #fff;
}

.about::after {
	content: '';
	display: block;
	background: rgba(0, 0, 0, 0.5);
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 1;
}

.about > div {
	position: relative;
	z-index: 2;
}

.about .about-wrapper {
	display: grid;
	grid-template-columns: auto 500px;
	gap: 40px;
	margin-bottom: 40px;
}

.about .about-wrapper .about-video img {
	cursor: pointer;
}

.about .about-wrapper .about-content {

}

.about .about-wrapper .about-video video {
	width: 100%;
	height: 100%;
}

.about .about-controlls {
	display: flex;
	align-items: center;
	gap: 20px;
}

.about .about-controlls button {
	color: var(--black);
}

.about .about-controlls button::before {
	content: '';
	display: block;
	background-image: url(./assets/svg/send.svg);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	width: 20px;
	height: 20px;
	transition: all .3s;
}

.about .about-controlls a::before {
	content: '';
	display: block;
	background-image: url(./assets/svg/burger.svg);
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
	width: 14px;
	height: 10px;
	transition: all .3s;
}

.about .about-controlls a:hover::before {
	filter: brightness(0) invert(1);
}

/* Advantges */

.advantges .advantages-wrapper {
	display: grid;
	gap: 40px 20px;
}

.advantges .advantages-wrapper .advantage-item {
	display: flex;
	align-items: center;
	gap: 10px;
}

.advantges .advantages-wrapper .advantage-item img {
	object-fit: contain;
	width: 180px;
	min-width: 180px;
	height: 130px;
}

.advantges .advantages-wrapper .advantage-item > div {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.advantges .advantages-wrapper .advantage-item > div span {
	font-weight: 700;
}

.usability .usability-wrapper {
	display: grid;
	gap: 20px;
}

.usability .usability-wrapper .usability-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 15px;
	background: #fff;
	border-radius: 10px;
	box-shadow: var(--box-shadow);
	padding: 20px 15px;
}

.usability .usability-wrapper .usability-item img {
	object-fit: contain;
	width: 135px;
	height: 160px;
}

.usability .usability-wrapper .usability-item span {
	text-align: center;
	line-height: 160%;
}

/* Cookie */

.cookie-confirmation {
	display: none;
	position: fixed;
	background: #eeeeeede;
	border-top: 1px solid #eeeeeede;
	width: 100%;
	padding: 15px 0;
	left: 0;
	bottom: 0;
	z-index: 99;
}

.cookie-confirmation > div {
	display: flex;
	align-items: center;
	gap: 20px;
}

.cookie-confirmation > div > p,
.cookie-confirmation > div > p a {
	font-size: 13px;
	color: #333;
}

.cookie-confirmation > div > p a {
	color: var(--yellow);
}

.cookie-confirmation > div > button {
	color: #fff;
	background: var(--yellow);
	border: 1px solid var(--yellow);
	border-radius: 10px;
	padding: 5px 10px;
	cursor: pointer;
	transition: all .3s;
}

.cookie-confirmation > div > button:hover {
	opacity: var(--opacity-hover);
}

/* Archive */

.archive .archive-wrapper {
	display: grid;
	gap: 20px;
}

.archive .archive-wrapper .post {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 5px;
	background: #fff;
	position: relative;
	border-radius: 10px;
	box-shadow: var(--box-shadow);
	transition: all .3s;
	overflow: hidden;
	z-index: 1;
}

.archive .archive-wrapper .post:hover {
	box-shadow: var(--box-shadow-hover);
}

.archive .archive-wrapper .post .post-top {
	width: 100%;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

.archive .archive-wrapper .post .post-top img {
	aspect-ratio: 1 / 1;
	object-fit: cover;
	height: 250px;
	cursor: pointer;
}

.archive .archive-wrapper .post .post-top > div {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #F6F6F6;
	padding: 20px;
}

/* Callback */

.callback-static .title {
	color: var(--yellow);
}

.callback-static .wrapper {
	position: relative;
}

.callback-static form {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 40px;
	position: relative;
	box-shadow: 0 0 14px 5px rgba(0, 0, 0, 0.07);
	border-radius: 20px;
	padding: 35px 20px 60px;
}

.callback-static form > div h2,
.callback-static form > div p {
	text-align: center;
}

.callback-static form > div h2 {
	text-transform: uppercase;
	text-align: center;
	color: var(--yellow);
}

.callback-static form .callback-inputs-wrapper {
	display: flex;
	align-items: center;
	gap: 20px;
}

.callback-static form .callback-inputs-wrapper input {
	border: 1px solid #d9d9d9;
	border-radius: 20px;
	width: auto;
	padding: 10px 12px;
}

.callback-static form .callback-inputs-wrapper input::placeholder {
	font-size: 14px;
	color: #e6e6e6;
}

.callback-static form .callback-inputs-wrapper button {
	width: 230px;
}

.callback-static form .callback-inputs-wrapper button::before {
	content: '';
	display: block;
	filter: brightness(0) invert(1);
	background-image: url(./assets/svg/send.svg);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	width: 20px;
	height: 20px;
	transition: all .3s;
}

.callback-static form .callback-policy-wrapper label {
	display: flex;
	align-items: center;
	gap: 5px;
	margin-top: 5px;
	margin-left: 3px;
}

.callback-static form .callback-policy-wrapper label a {
	text-decoration: underline;
}

.callback-static form .callback-policy-wrapper label input {
	border: 1px solid #d9d9d9;
}

.callback-static form .callback-policy-wrapper * {
	font-size: 13px;
	color: #e6e6e6;
}

.callback-static .decorations > img {
	display: block;
	position: absolute;
	width: auto;
}

.callback-static .decorations > img:first-child {
	height: 100px;
	top: 0;
	left: 20px;
}

.callback-static .decorations > img:nth-child(2) {
	height: 75px;
	right: 20px;
	bottom: 0;
}

.callback-static .decorations >img:last-child {
	top: 0;
	right: 20px;
}

/* Archive product */

section.archive-product {
	margin-bottom: 50px;
}

section.archive-product .categories .category {
	padding: 15px;
}

section.archive-product .archive-product-wrapper {
	display: flex;
	gap: 20px;
}

section.archive-product .archive-product-wrapper .archive-product-content .woocommerce-ordering {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	width: 100%;
	border: 1px solid #EBEBEB;
	border-radius: 5px;
	padding: 5px 10px;
	margin-bottom: 10px;
	width: fit-content;
	margin-left: auto;
}

.archive-product .products {
	display: grid;
	gap: 20px;
}

.related .products {
	display: grid;
	gap: 20px;
}

/* Single product */

.single-product .product {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	margin-top: 20px;
}

.single-product .product .single-product-left .single-product-gallery .woocommerce-product-gallery__image img {
	object-fit: contain;
	width: 380px;
	height: 300px;
	margin: auto;
}

.single-product .product .single-product-left .single-product-gallery .flex-control-nav {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 20px;
	list-style: none;
	margin-top: 20px;
}

.single-product .product .single-product-left .single-product-gallery .flex-control-nav img {
	border-radius: 10px;
	width: 48px;
	height: 48px;
	cursor: pointer;
	transition: all .3s;
}

.single-product .product .single-product-left .single-product-gallery .flex-control-nav img.flex-active,
.single-product .product .single-product-left .single-product-gallery .flex-control-nav img:hover {
	opacity: var(--opacity-hover);
}

.single-product .product .single-product-right {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.single-product .product .single-product-right .single-product-right-top .single-product-price {
	display: flex;
	align-items: center;
	gap: 10px;
}

.single-product .product .single-product-right .single-product-right-top .single-product-price .price,
.single-product .product .single-product-right .single-product-right-top .single-product-price .price * {
	font-size: 28px;
	font-weight: 700;
	color: var(--yellow);
}

.single-product .product .single-product-right .single-product-right-top .single-product-price > span {
	font-size: 28px;
	font-weight: 700;
}

.single-product .product .single-product-right .single-product-right-top .single-product-price > span > span {
	font-size: 28px;
	font-weight: 700;
	color: var(--yellow);
}

.single-product .product .single-product-right .single-product-right-middle {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.single-product .product .single-product-right .single-product-right-middle .single-product-attributes {
	display: flex;
	align-items: center;
	gap: 10px;
}

.single-product .product .single-product-right .single-product-right-middle .single-product-attributes .product-attribute {
	display: flex;
	align-items: center;
	gap: 5px;
}

.single-product .product .single-product-right .single-product-right-middle .single-product-attributes .product-attribute * {
	font-size: 14px;	
}

.single-product .product .single-product-right .single-product-right-middle .single-product-attributes .product-attribute::before {
	content: '';
	display: block;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	width: 24px;
	height: 24px;
}

.single-product .product .single-product-right .single-product-right-middle .single-product-attributes .product-attribute.pa_upakovka::before {
	background-image: url(./assets/svg/package.svg);
}

.single-product .product .single-product-right .single-product-right-middle .single-product-attributes .product-attribute.pa_razmer::before {
	background-image: url(./assets/svg/size.svg);
}

.single-product .product .single-product-right .single-product-right-middle .single-product-attributes .product-attribute.pa_ves::before {
	background-image: url(./assets/svg/weight.svg);
}

/* Pagination */

.woocommerce-pagination .page-numbers {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	list-style: none;
	margin-top: 5px;
}

.woocommerce-pagination .page-numbers li a,
.woocommerce-pagination .page-numbers li span {
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 5px;
	width: 24px;
	height: 24px;
}

.woocommerce-pagination .page-numbers li:hover a,
.woocommerce-pagination .page-numbers li:hover span,
.woocommerce-pagination .page-numbers li span.current {
	color: #fff;
	background: var(--blue);
}

/* Categories */

.categories {
	display: grid;
	gap: 20px;
	margin-bottom: 20px;
}

.categories .category {
	background: #F5F5F5;
	border-radius: 10px;
}

.categories .category a {
	display: flex;
	align-items: center;
	gap: 10px;
}

.categories .category .category-image img {
	object-fit: contain;
	width: 50px;
	height: 50px;
}

.categories .category .category-name {
	font-size: 20px;
	font-weight: 700;
}

/* Products */

.products .product {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 20px;
	list-style: none;
	background: #fff;
	border-radius: 10px;
	box-shadow: var(--box-shadow);
	padding: 15px;
	transition: all .3s;
}

.products .product:hover {
	box-shadow: var(--box-shadow-hover);
}

.products .product .product-top {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}

.products .product .product-top .product-image img {
	width: 200px;
	height: 200px;
	object-fit: contain;
}

.products .product .product-top .product-title a {
	display: block;
	text-align: center;
	line-height: 160%;
}

.products .product .product-middle .product-attributes {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}

.products .product .product-middle .product-attributes .product-attribute {
	display: flex;
	align-items: center;
	gap: 5px;
}

.products .product .product-middle .product-attributes .product-attribute * {
	font-size: 14px;
}

.products .product .product-middle .product-attributes .product-attribute::before {
	content: '';
	display: block;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	width: 24px;
	height: 24px;
}

.products .product .product-middle .product-attributes .product-attribute.pa_upakovka::before {
	background-image: url(./assets/svg/package.svg);
}

.products .product .product-middle .product-attributes .product-attribute.pa_razmer::before {
	background-image: url(./assets/svg/size.svg);
}

.products .product .product-middle .product-attributes .product-attribute.pa_ves::before {
	background-image: url(./assets/svg/weight.svg);
}

.products .product .product-bottom .product-controls a {
	border-color: var(--black);
}

.products .product .product-bottom .product-controls a:hover {
	color: var(--black);
	border-color: var(--yellow);
}

.products .product .product-bottom .product-controls a::before {
	content: '';
	display: block;
	background-image: url(./assets/svg/link.svg);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	width: 24px;
	height: 24px;
}

/* Filters */

.filters {
	width: 280px;
}

.filters .showFilters {
	display: none;
}

.filters .filters-wrapper {
	display: flex;
	flex-direction: column;
	font-size: 0;
	background: #FBFBFB;
	border-radius: 10px;
	margin-bottom: 20px;
	padding: 20px 15px;
}

.filters .filters-wrapper li {
	list-style: none;
}

.filters .filters-wrapper li:not(:last-child) {
	padding-bottom: 20px;
	border-bottom: 1px solid #EBEBEB;
}

.filters .filters-wrapper li h3 {
	font-size: 16px;
	font-weight: normal;
	text-transform: unset;
	margin: 15px 0!important;
}

.filters .filters-wrapper li fieldset {
	border: 0;
	margin: 0;
}

.filters .filters-wrapper li fieldset label {
	display: flex;
	align-items: center;
	gap: 5px;
}

.filters .filters-wrapper li fieldset label input {
	width: 16px;
	height: 16px;
}

.filters .filters-wrapper li .wc-block-product-filter-chips__item {
	background: #fff;
	border: 1px solid var(--blue);
	border-radius: 5px;
	padding: 5px 12px;
}

.filters .filters-wrapper li .wc-block-product-filter-chips__item:hover {
	opacity: var(--opacity-hover);
}

.filters .filters-wrapper li .wc-block-product-filter-chips__item.active {
	color: #fff;
	background: var(--blue);
}

.filters .filters-wrapper li .wc-block-product-filter-chips__item:disabled {
	opacity: var(--opacity-hover);
}

.filters .filters-wrapper li .slider_amount {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
}

.filters .filters-wrapper li .slider_amount input {
	border: 1px solid #E1E1E1;
	border-radius: 5px;
	padding: 5px 10px;
}

.filters .filters-wrapper li .slider_amount input:first-child {
	grid-column: 1;
}

.filters .filters-wrapper li .slider_amount input:last-child {
	grid-column: 3;
}

.filters .filters-wrapper li .slider_amount .ui-slider {
	grid-row: 2;
	grid-column: span 3;
	background: #E1E1E1;
	margin-top: 10px;
	height: 4px;
}

.filters .filters-wrapper li .slider_amount .ui-slider .ui-slider-range {
	background: var(--yellow);
	border-color: var(--yellow);
}

.filters .filters-wrapper li .slider_amount .ui-slider .ui-slider-handle {
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--yellow);
	border: 0;
	border-radius: 100%;
	width: 16px;
	height: 16px;
	top: -7px;
}

.filters .filters-wrapper li .slider_amount .ui-slider .ui-slider-handle::after {
	content: '';
	display: block;
	background: #fff;
	border-radius: 100%;
	position: absolute;
	width: 6px;
	height: 6px;
}

.filters .resetFilters {
	width: 100%;
}

/* Products slider */

.products-slider .wrapper {
	max-width: 1240px;
}

.products-slider .productsSlider {
	position: relative;
	overflow: hidden;
	padding: 10px;
}

/* Contacts */

.contacts {
	position: relative;
	margin: 0;
}

.contacts .wrapper {
	display: flex;
	align-items: center;
	padding-top: 60px;
	padding-bottom: 60px;
}

.contacts .wrapper .contacts-wrapper {
	display: flex;
	flex-direction: column;
	gap: 10px;
	background: #fff;
	border-radius: 10px;
	box-shadow: var(--box-shadow);
	position: relative;
	padding: 35px 30px;
	z-index: 1;
}

.contacts .wrapper .contacts-wrapper h1 {
	margin: 0;
}

.contacts .wrapper .contacts-wrapper .contacts-row {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}

.contacts .wrapper .contacts-wrapper .contacts-rows {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.contacts .wrapper .contacts-wrapper .contacts-row .contacts-row-left {
	display: flex;
	align-items: flex-end;
}

.contacts .wrapper .contacts-wrapper .contacts-row .contacts-row-left p {
	white-space: nowrap;
}

.contacts .wrapper .contacts-wrapper .contacts-row .contacts-row-left address {
	font-style: normal;
}

.contacts .wrapper .contacts-wrapper .contacts-row .contacts-row-left span {
	display: block;
	border-bottom: 1px dashed #b1b1b1;
	width: 100%;
	height: 20px;
}

.contacts .wrapper .socials-wrapper {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 20px;
}

.contacts .wrapper .socials-wrapper > div {
	display: flex;
	align-items: center;
	gap: 5px;
}

.contacts .wrapper .socials-wrapper button::before {
	content: '';
	display: block;
	background-image: url(./assets/svg/send.svg);
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	width: 20px;
	height: 20px;
	transition: all .3s;
}

.contacts .wrapper .socials-wrapper button:hover::before {
	filter: brightness(0) invert(1);
}

.contacts iframe {
	height: 100%;
	width: 100%;
	border: 0;
	position: absolute!important;
	top: 0;
	left: 0;
	z-index: 0;
}

@media (min-width: 1024px) {

	header #desktopMenuButton.active {
		color: var(--yellow);
	}

	header #desktopMenuButton.active::before {

	}

	header #desktopMenu.active {
		display: block;
	}
	
	header #desktopMenu {
		display: none;
		background: #fff;
		box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 0.12);
		position: absolute;
		overflow: auto;
		width: 100%;
		max-height: 650px;
		padding: 17px 22px;
		left: 0;
		z-index: 9;
	}
	
	header #desktopMenu > div ul {
		list-style: none;
	}

	header #desktopMenu > div > div > ul {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: 30px 20px;
	}

	header #desktopMenu > div > div > ul > li > a {
		font-weight: 600;
	}

	header #desktopMenu > div > div > ul > li > ul > li {
		margin-top: 5px;
	}

	header #desktopMenu > div > div > ul > li > ul > li > a {
		font-size: 13px;
	}

	header #mobileMenuButton {
		display: none;
	}

	header #mobileMenu {
		display: none;
	}
}

@media (max-width: 1180px) {

	.columns-4,
	.gallery-columns-4,
	.columns-5,
	.gallery-columns-5,
	.columns-6,
	.gallery-columns-6,
	.columns-7,
	.gallery-columns-7,
	.columns-8,
	.gallery-columns-8,
	.columns-9,
	.gallery-columns-9 {
		grid-template-columns: repeat(3, 1fr);
	}

	header .header-bottom .header-bottom-left .header-menu ul {
		gap: 20px;
	}

	header .header-bottom .header-bottom-left .header-menu ul  * {
		font-size: 14px;
	}

	.banner {
		background-attachment: unset;
	}

	.about {
		background-attachment: unset;
	}

	footer .footer-top > div {
		gap: 20px;
	}

	footer .footer-top .footer-top-right .footer-info {
		gap: 20px;
	}

	footer .footer-top .footer-top-right {
		gap: 20px;
	}

	footer .footer-bottom > div {
		gap: 20px;
	}
}

@media (max-width: 1024px) {

	.contacts {
		height: unset;;
	}

	.contacts .wrapper {
		padding-top: 0;
		padding-bottom: 20px;
	}

	.contacts .wrapper .contacts-wrapper {
		background: unset;
		box-shadow: unset;
		padding: unset;
		width: 100%;
		margin-bottom: 20px;
	}

	.contacts iframe {
		position: relative!important;
		height: 300px;
	}

	.contacts .wrapper .contacts-wrapper .contacts-row {
		grid-template-columns: 1fr;
	}

	.contacts .wrapper .contacts-wrapper .contacts-row .contacts-row-left p {
		font-weight: 700;
	}

	.contacts .wrapper .contacts-wrapper .contacts-row span {
		display: none!important;
	}

	.columns-3,
	.gallery-columns-3,
	.columns-4,
	.gallery-columns-4,
	.columns-5,
	.gallery-columns-5,
	.columns-6,
	.gallery-columns-6,
	.columns-7,
	.gallery-columns-7,
	.columns-8,
	.gallery-columns-8,
	.columns-9,
	.gallery-columns-9 {
		grid-template-columns: repeat(2, 1fr);
	}

	header .header-menu {
		display: none;
	}

	header .header-top .header-top-left {
		gap: 20px;
	}

	header .header-top {
		gap: 20px;
	}

	header .header-registry {
		display: none;
	}

	header .header-top .header-top-right .callback {
		display: none;
	}

	header #desktopMenu {
		display: none;
	}

	header #desktopMenuButton {
		display: none;
	}

	header #mobileMenuButton {
		display: flex;
	}

	.banner .banner-wrapper {
		width: 100%;
	}

	.banner .banner-wrapper .banner-top h1 {
		font-size: 24px;
	}

	.banner .banner-wrapper .banner-top .sub-title {
		font-size: 18px;
	}

	.banner .banner-wrapper .content,
	.banner .banner-wrapper .content * {
		font-size: 14px;
	}

	.about .about-wrapper {
		display: flex;
		flex-direction: column;
	}

	.advantges .advantages-wrapper {
		grid-template-columns: 1fr;
	}

	.callback-static form .callback-inputs-wrapper {
		flex-direction: column;
		width: 100%;
	}

	.callback-static form .callback-inputs-wrapper input {
		width: 100%;
	}

	.callback-static form .callback-inputs-wrapper button {
		width: 100%;
	}

	.callback-static .decorations {
		display: none;
	}

	.callback-static form > div {
		width: 100%;
	}

	.callback-static form .callback-inputs-wrapper input:not[type=checkbox],
	.callback-static form .callback-inputs-wrapper button {
		width: 100%!important;
	}

	footer .footer-top .footer-top-right {
		width: auto;
	}

	footer .footer-top .footer-top-right .footer-info {
		display: none;
	}

	footer .footer-middle .footer-menu > div > ul {
		flex-wrap: wrap;
	}

	footer .footer-top .footer-top-right .footer-contacts .footer-phone {
		width: 200px;
		flex-wrap: wrap;	
	}

	footer .footer-top .footer-top-right .footer-contacts .footer-phone a {
		/* width: 100%; */
	}

	footer .footer-top .footer-top-right .footer-contacts .footer-phone a::after {
		content: unset;
	}

	footer .footer-top .footer-top-right .footer-contacts .footer-phone .toggle-phones {
		animation: unset;
		display: block;
		position: relative;
		top: unset;
		padding: 0;
	}
	/* Header mobile menu */

	header #mobileMenu {
		display: flex;
		flex-direction: column;
		gap: 20px;
		background: #fff;
		position: fixed;
		transform: translateX(-300%);
		transition: all .5s;
		visibility: hidden;
		opacity: 0;
		overflow-y: auto;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		z-index: 20;
	}
	
	header #mobileMenu.active {
		transform: translateX(0);
		visibility: visible;
		opacity: 1;
	}

	header #mobileMenu > .mobile-menu-wrapper {
		padding: 0;
	}

	header #mobileMenu .mobile-menu-content > div > ul {
		display: flex;
		flex-direction: column;
		gap: 0;
		background: #fff;
	}

	header #mobileMenu .mobile-menu-content > div > ul > li:not(:last-child) {
		margin: 0;
	}

	header #mobileMenu .mobile-menu-title {
		display: flex;
		align-items: center;
		justify-content: space-between;
		border-bottom: 1px solid #eee;
		padding: 20px;
	}

	header #mobileMenu .mobile-menu-title > span {
		font-size: 24px;
		font-weight: 700;
	}
	
	header #mobileMenu .mobile-menu-title img {
		width: 24px;
		height: 24px;
	}

	header #mobileMenu ul {
		list-style: none;
	}

	header #mobileMenu .showCatalog {
		display: block;
		background: none;
		border: 0;
		text-align: left;
		width: fit-content;
		position: relative;
		padding: 20px;
		width: 100%;
	}

	header #mobileMenu .showCatalog.active {
		font-weight: 700;
	}

	header #mobileMenu .showCatalog::after {
		content: '';
		filter: brightness(0);
		display: block;
		position: absolute;
		background: var(--arrow);
		background-size: cover;
		width: 12px;
		height: 6px;
		rotate: 90deg;
		transition: all .3s;
		top: 28px;
		right: 20px;
	}

	header #mobileMenu .showCatalog.active::after {
		rotate: 0deg;
	}

	header #mobileMenu .mobile-menu-content > div:nth-child(2) {
		display: none;
	}

	header #mobileMenu .mobile-menu-content > div > ul > li {
		border-bottom: 1px solid #eee;
	}

	header #mobileMenu .mobile-menu-content > div > ul li.menu-item-has-children {
		position: relative;
	}

	header #mobileMenu .mobile-menu-content > div > ul li.menu-item-has-children::after {
		content: '';
		filter: brightness(0);
		display: block;
		position: absolute;
		background: var(--arrow);
		background-size: cover;
		width: 12px;
		height: 6px;
		rotate: 90deg;
		transition: all .3s;
		top: 28px;
		right: 20px;
	}

	header #mobileMenu .mobile-menu-content > div > ul li.menu-item-has-children.active::after {
		rotate: 0deg;
	}

	header #mobileMenu .mobile-menu-content > div > ul li.menu-item-has-children.active > a {
		font-weight: 700;
	}

	header #mobileMenu .mobile-menu-content > div > ul > li .sub-menu {
		display: none;
	}

	header #mobileMenu .mobile-menu-content > div > ul > li > a {
		display: block;
		width: fit-content;
		padding: 20px;
	}
	header #mobileMenu .mobile-menu-content > div > ul > li > ul a {
		display: block;
		width: fit-content;
		padding: 0 20px 20px;
	}

	header #mobileMenu .mobile-menu-content > div > ul > li > ul > li > a {
		padding: 20px;
	}

	header #mobileMenu .mobile-menu-contacts {
		display: flex;
		flex-direction: column;
		gap: 15px;
		padding: 20px;
	}

	header #mobileMenu .mobile-menu-contacts img {
		width: 24px;
		height: 24px;
	}

	header #mobileMenu .mobile-menu-contacts > div address {
		font-style: normal;
	}

	header #mobileMenu .mobile-menu-contacts > div,
	header #mobileMenu .mobile-menu-contacts > a {
		display: flex;
		align-items: center;
		gap: 10px;
	}

	header #mobileMenu .mobile-menu-contacts > div.mobile-phone {
		align-items: unset;
	}

	header #mobileMenu .mobile-menu-contacts > div.mobile-phone div {
		display: flex;
		flex-direction: column;
	}

	section.archive-product .archive-product-wrapper {
		flex-direction: column;
	}

	.filters {
		width: 100%;
	}


	.single-product .product .single-product-right h1 {
		font-size: 24px;
	}

	.single-product .product .single-product-right .single-product-right-top .single-product-price > span {
		font-size: 16px;
	}

	.single-product .product .single-product-right .single-product-right-top .single-product-price > span > span {
		font-size: 16px;
	}
}

@media (max-width: 768px) {

	.single-product .product {
		grid-template-columns: 1fr;
	}

	.single-product .product .single-product-right .single-product-right-middle .single-product-attributes {
		flex-direction: column;
		align-items: unset;
	}

	.columns-2,
	.gallery-columns-2,
	.columns-3,
	.gallery-columns-3,
	.columns-4,
	.gallery-columns-4,
	.columns-5,
	.gallery-columns-5,
	.columns-6,
	.gallery-columns-6,
	.columns-7,
	.gallery-columns-7,
	.columns-8,
	.gallery-columns-8,
	.columns-9,
	.gallery-columns-9 {
		grid-template-columns: repeat(1, 1fr);
	}

	* {
		font-size: 14px;
	}

	section {
		margin-bottom: 50px;
	}

	h1 {
		font-size: 32px;
	}

	.title,
	h2 {
		font-size: 28px;
	}

	h3 {
		font-size: 24px;
	}

	h4 {
		font-size: 20px;
	}

	h5 {
		font-size: 16px;
	}

	h6 {
		font-size: 16px;
	}

	.about .about-controlls {
		flex-direction: column;
	}

	.footer-logo {
		margin-top: 15px;
	}

	footer .footer-top .footer-top-right .footer-contacts {
		margin-bottom: 15px;
	}

	.wrapper {
		padding: 0 10px!important;
	}

	header .header-top .header-top-left .header-logo img {
		width: 100px;
	}

	header .header-top .header-top-right .header-phone {
		display: none;
	}

	header .header-bottom .header-bottom-right .header-search form {
		width: 100%;
	}

	header .header-bottom .header-bottom-left {
		width: auto;
	}

	.banner .banner-wrapper .banner-top h1 {
		font-size: 16px;
	}

	.banner .banner-wrapper .banner-top .sub-title {
		font-size: 14px;
		white-space: unset;	
	}

	.categories .categories-wrapper .category > a span {
		font-size: 16px;
	}

	.banner .banner-bottom {
		flex-direction: column;
	}

	.categories .categories-wrapper {
		grid-template-columns: 1fr;
	}

	.title-with-link a {
		display: none;
	}

	.advantges .advantages-wrapper .advantage-item {
		flex-direction: column;
	}

	.usability .usability-wrapper {
		grid-template-columns: 1fr;
	}

	footer .footer-top > div {
		flex-direction: column;
		align-items: unset;
		gap: 20px;
	}

	footer .footer-middle .footer-menu > div > ul {
		flex-direction: column;
		align-items: unset;
		gap: 20px;
	}

	.callback-static form .callback-inputs-wrapper {
		margin-bottom: 20px;
	}

	footer .footer-top .footer-top-right .footer-contacts {
		flex-direction: column;
		align-items: unset;
		gap: 10px;
	}

	footer .footer-bottom > div {
		flex-direction: column;
	}
}