/* ----------------------------------------------------------------
:: Fonts
-----------------------------------------------------------------*/
@font-face {
font-family: "Open Sans";
font-style: normal;
font-weight: 400;
src: url("../fonts/opensans/OpenSans-Regular.eot");
src: local(""), url("../fonts/opensans/OpenSans-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/opensans/OpenSans-Regular.woff2") format("woff2"), url("../fonts/opensans/OpenSans-Regular.woff") format("woff"), url("../fonts/opensans/OpenSans-Regular.ttf") format("truetype"), url("../fonts/opensans/OpenSans-Regular.svg#Open Sans") format("svg");
font-display: swap;
}
@font-face {
font-family: "Open Sans";
font-style: italic;
font-weight: 400;
src: url("../fonts/opensans/OpenSans-Italic.eot");
src: local(""), url("../fonts/opensans/OpenSans-Italic.eot?#iefix") format("embedded-opentype"), url("../fonts/opensans/OpenSans-Italic.woff2") format("woff2"), url("../fonts/opensans/OpenSans-Italic.woff") format("woff"), url("../fonts/opensans/OpenSans-Italic.ttf") format("truetype"), url("../fonts/opensans/OpenSans-Italic.svg#Open Sans") format("svg");
font-display: swap;
}
@font-face {
font-family: "Open Sans";
font-style: normal;
font-weight: 700;
src: url("../fonts/opensans/OpenSans-Bold.eot");
src: local(""), url("../fonts/opensans/OpenSans-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/opensans/OpenSans-Bold.woff2") format("woff2"), url("../fonts/opensans/OpenSans-Bold.woff") format("woff"), url("../fonts/opensans/OpenSans-Bold.ttf") format("truetype"), url("../fonts/opensans/OpenSans-Bold.svg#Open Sans") format("svg");
font-display: swap;
}
@font-face {
font-family: "Open Sans";
font-style: italic;
font-weight: 700;
src: url("../fonts/opensans/OpenSans-BoldItalic.eot");
src: local(""), url("../fonts/opensans/OpenSans-BoldItalic.eot?#iefix") format("embedded-opentype"), url("../fonts/opensans/OpenSans-BoldItalic.woff2") format("woff2"), url("../fonts/opensans/OpenSans-BoldItalic.woff") format("woff"), url("../fonts/opensans/OpenSans-BoldItalic.ttf") format("truetype"), url("../fonts/opensans/OpenSans-BoldItalic.svg#Open Sans") format("svg");
font-display: swap;
}
* {
margin: 0;
padding: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
*:focus {
outline: none !important;
}
html {
width: 100%;
height: 100%;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
body {
width: 100%;
font-family: "Open Sans", Arial !important;
font-size: 0.9rem;
line-height: 1.4;
font-weight: 400;
color: #101010;
padding: 135px 0 0;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, button {
border: 0;
vertical-align: baseline;
}
a {
color: #101010;
text-decoration: none !important;
}
a:hover {
text-decoration: none !important;
color: #D02229;
}
h1, h2, h3, h4, h5, h6 {
font-weight: 700;
}
.h1 {
font-size: 1.1em;
}
.h2 {
font-size: 1.2em;
}
.h3 {
font-size: 1.3em;
}
.h4 {
font-size: 1.4em;
}
.h5 {
font-size: 1.5em;
}
h1 {
font-size: 2.55em;
}
h2 {
font-size: 1.7em;
}
h3 {
font-size: 1.45em;
}
h4 {
font-size: 1.3em;
}
h5 {
font-size: 1.15em;
}
p {
margin: 0;
}
ul {
margin: 0;
padding: 0;
}
ul li {
list-style: none;
}
ol {
margin: 0 0 0 15px;
padding: 0;
}
strong {
font-weight: 700;
}
address {
margin: 0;
font-style: normal;
}
a[href^="tel:"] {
white-space: nowrap;
}
sup {
position: relative;
top: -5px;
font-size: 0.7em;
}
input,
textarea,
select {
font-family: "Open Sans", Arial;
}
.bold {
font-weight: 700;
}
.no-scroll {
overflow-x: hidden;
overflow-y: hidden;
}
.text-center {
text-align: center;
}
.text-right {
text-align: right;
}
.over-hidden {
overflow: hidden;
}
.visible {
visibility: visible !important;
}
.d-block {
display: block !important;
}
.d-none {
display: none !important;
}
.pos-rel {
position: relative;
}
.pos-abs {
position: absolute;
}
.bg-dark {
background: #2A2A2A;
}
.bg-c1 {
background: #D02229;
}
.c-c1 {
color: #D02229;
}
.c-white {
color: #fff;
}
.pointer {
cursor: pointer;
}
.fs11 {
font-size: 1.1em !important;
}
.fs12 {
font-size: 1.2em !important;
}
.fs13 {
font-size: 1.3em !important;
}
.fs14 {
font-size: 1.4em !important;
}
.fs15 {
font-size: 1.5em !important;
}
.fs16 {
font-size: 1.6em !important;
}
.fs17 {
font-size: 1.7em !important;
}
.br5 {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
}
.underline {
text-decoration: underline !important;
}
.with-offer-stripe {
padding-top: 185px;
}
.with-cookie-notice {
padding-bottom: 60px;
}
.overlay {
-webkit-transition: all ease-in-out 0.2s;
-moz-transition: all ease-in-out 0.2s;
-ms-transition: all ease-in-out 0.2s;
-o-transition: all ease-in-out 0.2s;
transition: all ease-in-out 0.2s;
-webkit-box-shadow: -5px 4px 30px 0px rgba(0, 0, 0, 0.05);
-moz-box-shadow: -5px 4px 30px 0px rgba(0, 0, 0, 0.05);
box-shadow: -5px 4px 30px 0px rgba(0, 0, 0, 0.05);
position: fixed;
opacity: 0;
top: -145%;
left: 0;
width: 100%;
height: 100%;
z-index: 2000;
background: #fff;
overflow-x: hidden;
overflow-y: scroll;
}
.overlay.open {
opacity: 1;
top: 0;
}
.shadowed {
-webkit-box-shadow: -10px 20px 0px -1px rgba(0, 0, 0, 0.1);
-moz-box-shadow: -10px 20px 0px -1px rgba(0, 0, 0, 0.1);
box-shadow: -10px 20px 0px -1px rgba(0, 0, 0, 0.1);
min-height: 400px;
border: solid 2px #afed31;
padding: 20px;
}
.section-title {
display: flex;
align-items: center;
font-weight: 700;
font-size: 1.7em;
margin: 0 0 20px;
gap: 20px;
}
.section-title .all {
display: inline-block;
width: 20px;
height: 20px;
opacity: 0.4;
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
.section-title .all:hover {
opacity: 1;
}
.title-with-arrows {
margin: 0 0 20px;
}
.title-with-arrows .section-title {
margin: 0;
}
.goto-backend {
display: block;
width: 20px;
height: 20px;
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
.goto-backend svg {
width: 30px;
}
.btn,
.btn-light,
.btn-fill {
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
text-align: center;
cursor: pointer;
font-size: 0.9em;
padding: 10px 15px;
}
.btn {
background: #fff;
color: #D02229;
border: 1px solid #D02229;
}
.btn:hover {
color: #fff;
border: 1px solid #D02229;
background: #D02229;
}
.btn-light {
color: #C8C8C8;
border: 1px solid #C8C8C8;
}
.btn-light:hover {
color: #fff;
border: 1px solid #2A2A2A;
background: #2A2A2A;
}
.btn-fill {
color: #fff !important;
border: 1px solid #D02229 !important;
background: #D02229 !important;
}
.btn-fill:hover {
border: 1px solid #2A2A2A !important;
background: #2A2A2A !important;
}
.btn:disabled,
.btn.disabled,
fieldset:disabled .btn {
pointer-events: none;
opacity: 0.65;
}
@media screen and (max-width: 950px) {
body {
padding-top: 75px;
padding-bottom: 70px;
}
}
@media screen and (max-width: 800px) {
.page-title {
font-size: 2em;
}
}
@media screen and (max-width: 575px) {
.section-title {
font-size: 1.3em;
}
.page-title {
font-size: 1.5em;
}
}
@media screen and (max-width: 480px) {
.section-title {
font-size: 1.1em;
gap: 10px;
}
body {
padding-bottom: 50px;
}
}
/* Display flex */
.d-flex {
display: flex;
}
.flex-ac {
display: flex;
align-items: center;
}
.flex-cb {
display: flex;
align-items: center;
justify-content: space-between;
}
.flex-sb {
display: flex;
justify-content: space-between;
}
.flex-sa {
display: flex;
justify-content: space-around;
}
.flex-sac {
display: flex;
align-items: center;
justify-content: space-around;
}
.flex-c {
display: flex;
align-items: center;
justify-content: center;
}
.flex-col {
display: flex;
flex-direction: column;
}
.flex-col-sb {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.flex-wrap {
flex-wrap: wrap;
}
.g5 {
gap: 5px;
}
.g10 {
gap: 10px;
}
.g15 {
gap: 15px;
}
.g20 {
gap: 20px;
}
.g25 {
gap: 25px;
}
.g30 {
gap: 30px;
}
.g35 {
gap: 35px;
}
.g40 {
gap: 40px;
}
.g45 {
gap: 45px;
}
.g50 {
gap: 50px;
}
/* Swiper */
.swiper-pagination-bullet-active {
background: #D02229 !important;
}
.swiper-prev,
.swiper-next {
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
display: flex;
align-items: center;
justify-content: center;
width: 35px;
height: 35px;
cursor: pointer;
border: 1px solid #ececec;
background: url('data:image/svg+xml;utf8,') no-repeat center/50%;
}
.swiper-prev {
transform: rotateY(180deg);
}
.swiper-prev.swiper-button-disabled,
.swiper-next.swiper-button-disabled {
opacity: 0.4;
cursor: default;
}
.swiper-prev:not(.swiper-button-disabled):hover,
.swiper-next:not(.swiper-button-disabled):hover {
border: 1px solid #D02229;
background: #D02229 url('data:image/svg+xml;utf8,') no-repeat center/70%;
}
@media screen and (max-width: 480px) {
.swiper-arrows {
gap: 10px;
}
}
/* ----------------------------------------------------------------
:: Page structure
-----------------------------------------------------------------*/
.container {
width: 1440px;
max-width: 100%;
margin: 0 auto;
padding-left: 20px;
padding-right: 20px;
}
/* ----------------------------------------------------------------
:: Breadcrumbs
-----------------------------------------------------------------*/
.breadcrumbs {
margin: 10px 0 30px;
font-size: 0.9em;
opacity: 0.7;
}
.breadcrumbs:hover {
opacity: 1;
}
.breadcrumbs:hover a {
text-decoration: underline !important;
}
@media screen and (max-width: 768px) {
.breadcrumbs {
margin: 0 0 20px;
font-size: 0.8em;
}
}
/* ----------------------------------------------------------------
:: Socials
-----------------------------------------------------------------*/
.social-link {
display: inline-flex;
align-items: center;
border: none;
color: black;
margin-right: 20px;
}
.social-link .social-icon {
margin-right: 5px;
}
/* ----------------------------------------------------------------
:: Header
-----------------------------------------------------------------*/
header {
-webkit-transition: top 0.2s ease;
-moz-transition: top 0.2s ease;
-ms-transition: top 0.2s ease;
-o-transition: top 0.2s ease;
transition: top 0.2s ease;
width: 100%;
position: fixed;
top: 0;
left: 0;
background: #fff;
z-index: 102;
}
.page-collapse header,
.mobile-menu-opened header {
-webkit-box-shadow: 0 -9px 25px 2px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0 -9px 25px 2px rgba(0, 0, 0, 0.3);
box-shadow: 0 -9px 25px 2px rgba(0, 0, 0, 0.3);
}
/* Header: header notice */
header .offer-stripe a:hover {
color: #fff;
}
header .offer-stripe a:before {
content: "";
display: block;
position: relative;
min-width: 32px;
height: 32px;
background: url('data:image/svg+xml;utf8,') no-repeat center/contain;
}
header .offer-stripe .container {
min-height: 50px;
line-height: 1.1;
}
header .offer-stripe .icon-close {
min-width: 26px;
height: 26px;
background: url('data:image/svg+xml;utf8,') no-repeat center/contain;
}
/* Header: slogan, contacts, nav menu */
header nav {
font-size: 0.9em;
border-left: 1px solid #f6f6f6;
padding-left: 20px;
}
header nav .mark {
color: #D02229;
padding: 0 0 0 25px;
position: relative;
}
header nav .mark:before {
content: "";
display: block;
width: 25px;
height: 25px;
position: absolute;
left: 0;
top: -6px;
background: url('data:image/svg+xml;utf8,') no-repeat center/contain;
}
/* Header: logo, catalog, icons */
header .panel {
border-bottom: 1px solid #F6F6F6;
}
header .panel > div {
-webkit-transition: all ease-in-out 0.1s;
-moz-transition: all ease-in-out 0.1s;
-ms-transition: all ease-in-out 0.1s;
-o-transition: all ease-in-out 0.1s;
transition: all ease-in-out 0.1s;
height: 50px;
}
header .logo {
width: 185px;
}
.main-nav .container {
height: 75px;
}
.main-nav .phone {
display: none;
}
.main-nav .slogan {
display: none;
min-width: 130px;
font-size: 0.9em;
}
.page-collapse .main-nav .container {
height: 50px;
}
.page-collapse .panel > div {
height: 0;
overflow: hidden;
}
/* Header: search */
.search-form {
width: 100%;
background: #F6F6F6;
}
.search-form input {
background: transparent;
border: 0;
font-size: 1.15em;
padding: 9px 15px;
width: 100%;
}
.search-form ::placeholder {
font-weight: 700;
color: #9D9D9D;
}
.search-form .clear-search {
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
display: none;
position: absolute;
top: 15px;
right: 45px;
width: 20px;
height: 20px;
z-index: 11;
cursor: pointer;
opacity: 0.5;
background: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjUxMiIgdmlld0JveD0iMCAwIDI0IDI0IiB3aWR0aD0iNTEyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0ibTUuMDAwNzMgMTcuNTg2NGMtLjM5MDUuMzkwNi0uMzkwNDQgMS4wMjM3LjAwMDEyIDEuNDE0MnMxLjAyMzcyLjM5MDUgMS40MTQyMS0uMDAwMWw1LjU4NTI0LTUuNTg2MiA1LjU4NTcgNS41ODU3Yy4zOTA1LjM5MDUgMS4wMjM3LjM5MDUgMS40MTQyIDBzLjM5MDUtMS4wMjM3IDAtMS40MTQybC01LjU4NTgtNS41ODU4IDUuNTg1NC01LjU4NjM4Yy4zOTA0LS4zOTA1Ni4zOTA0LTEuMDIzNzItLjAwMDItMS40MTQyMS0uMzkwNS0uMzkwNS0xLjAyMzctLjM5MDQ0LTEuNDE0Mi4wMDAxMmwtNS41ODUzIDUuNTg2MjctNS41ODU3Mi01LjU4NTc5Yy0uMzkwNTItLjM5MDUyLTEuMDIzNjktLjM5MDUyLTEuNDE0MjEgMC0uMzkwNTMuMzkwNTMtLjM5MDUzIDEuMDIzNjkgMCAxLjQxNDIybDUuNTg1OTMgNS41ODU4N3oiIGZpbGw9InJnYigwLDAsMCkiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPg==") no-repeat center/contain;
}
.search-form .clear-search:hover {
opacity: 1;
}
.search-form .active:not(.searching) .clear-search {
display: block;
}
.search-form button {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
display: block;
width: 40px;
height: 40px;
background: #2A2A2A url('data:image/svg+xml;utf8,') no-repeat center/40%;
cursor: pointer;
margin: 5px;
}
.search-form.searching button {
background: #ddd var(--spinner) no-repeat center/80%;
}
.search-container {
position: relative;
}
.ajax-search-result {
-webkit-box-shadow: 0 14px 20px 0 rgba(189, 189, 189, 0.25);
-moz-box-shadow: 0 14px 20px 0 rgba(189, 189, 189, 0.25);
box-shadow: 0 14px 20px 0 rgba(189, 189, 189, 0.25);
display: none;
position: absolute;
width: 100%;
max-height: 450px;
top: 49px;
background: #fff;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
z-index: 12;
padding: 10px 15px;
overflow-y: auto;
font-size: 0.9em;
}
.ajax-search-result > div > a {
border-top: 1px solid #F6F6F6;
padding: 5px 0 0;
}
.ajax-search-result > div > a span {
background: #ffb;
}
.ajax-search-result > div > a:first-child {
border-top: 0;
}
.page-collapse .search-form .clear-search {
top: 11px;
}
.page-collapse header .search-form button {
height: 30px;
}
/* Header: widgets */
.header-widget {
position: relative;
top: -6px;
align-items: flex-end;
}
.header-widget > div > a {
gap: 3px;
}
.header-widget > div > a span {
font-weight: 700;
font-size: 0.7em;
line-height: 1;
}
.header-widget a,
.header-widget .compare-widget span,
.header-widget .favorites-widget span {
color: #D02229;
}
.header-widget > div a {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.header-widget a:after {
content: "";
display: block;
width: 21px;
height: 21px;
}
.header-widget .cart-widget a {
position: relative;
flex-direction: row;
}
.header-widget .cart-widget span {
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
position: absolute;
top: -11px;
right: -3px;
color: #fff;
background: #D02229;
width: 18px;
height: 18px;
}
.compare-widget a:after {
background: url('data:image/svg+xml;utf8,') no-repeat center/contain;
}
.favorites-widget a:after {
background: url('data:image/svg+xml;utf8,') no-repeat center/contain;
}
.cart-widget a:after {
background: url('data:image/svg+xml;utf8,') no-repeat center/contain;
}
/* Header: catalog */
.show-catalog {
padding: 13px 32px;
background: #D02229;
color: #fff;
}
.show-catalog:before {
content: "";
min-width: 17px;
height: 17px;
background: url('data:image/svg+xml;utf8,') no-repeat center/contain;
}
.page-collapse .show-catalog {
padding-top: 10px;
padding-bottom: 10px;
}
@media screen and (max-width: 1100px) {
header .show-catalog {
padding-left: 20px;
padding-right: 20px;
}
header nav {
gap: 10px;
}
header a[href^="mailto:"] {
display: inline-block;
width: 20px;
height: 20px;
overflow: hidden;
color: transparent;
}
header a[href^="mailto:"]:hover {
color: transparent !important;
}
header a[href^="mailto:"]:before {
content: "";
display: block;
width: 100%;
height: 100%;
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
}
@media screen and (max-width: 950px) {
.header-widget,
header .panel,
.show-catalog {
display: none;
}
.main-nav .container {
height: 65px;
gap: 15px;
}
.main-nav .slogan {
display: block;
line-height: 1.1em;
}
.main-nav .phone {
display: inline-block;
min-width: 30px;
height: 30px;
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
header .logo {
width: 155px;
}
.search-form input {
font-size: 1em;
padding: 5px 10px;
}
.search-form button {
height: 30px;
}
.search-form .clear-search {
top: 10px;
}
.offer-stripe .container {
font-size: 0.9em;
min-height: 40px;
}
.with-offer-stripe {
padding-top: 115px;
}
}
@media screen and (max-width: 667px) {
.main-nav .container {
height: 55px;
justify-content: flex-start;
position: relative;
}
.main-nav .search-form {
display: none;
}
.main-nav .phone {
right: 20px;
position: absolute;
}
.main-nav .slogan {
min-width: auto;
padding: 0 35px 0 0;
font-size: 0.9em;
}
header .logo {
width: 100%;
}
}
@media screen and (max-width: 575px) {
.page-collapse .main-nav .container {
height: 55px;
}
}
@media screen and (max-width: 430px) {
.main-nav .slogan {
display: none;
}
}
/* ----------------------------------------------------------------
:: Categories and subcategories
-----------------------------------------------------------------*/
main.sub-categories {
margin-bottom: 50px;
}
.sub-categories {
display: flex;
flex-wrap: wrap;
font-weight: 700;
margin-right: -7.5px;
margin-left: -7.5px;
}
.sub-categories > * {
flex: 0 0 auto;
width: 25%;
padding-right: 7.5px;
padding-left: 7.5px;
margin-top: 15px;
}
.sub-categories > * > * {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
padding: 15px;
height: 80px;
border: 3px solid #F6F6F6;
display: flex;
align-items: center;
gap: 10px;
}
.sub-categories > * > *:hover {
border-color: #c8c8c8;
}
.sub-categories .parent {
font-size: 0.9em;
opacity: 0.6;
font-weight: 400;
}
.sub-categories img {
width: 50px;
min-width: 50px;
}
.sub-categories .active {
border-color: #000;
}
@media screen and (max-width: 1250px) {
.sub-categories > * {
width: 33.3333%;
}
}
@media screen and (max-width: 950px) {
.sub-categories > * {
width: 50%;
}
}
@media screen and (max-width: 768px) {
.sub-categories > * > * {
padding: 10px;
}
.sub-categories {
font-size: 0.9em;
}
}
@media screen and (max-width: 575px) {
.sub-categories > * {
width: 100%;
}
}
/* ----------------------------------------------------------------
:: Product block
-----------------------------------------------------------------*/
.price {
font-weight: 700;
font-size: 1.4em;
}
.old-price {
position: relative;
font-size: 0.9em;
color: #9C9C9C;
}
.old-price:after {
content: "";
position: absolute;
width: 100%;
height: 1px;
top: 50%;
left: 0;
background: #D02229;
}
.product-price {
display: flex;
align-items: center;
justify-content: center;
gap: 15px;
}
.add-to-cart,
.add-to-favorites,
.remove-from-favorites,
.one-click-buy,
.request-info {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
height: 58px;
cursor: pointer;
}
.add-to-cart,
.one-click-buy,
.request-info {
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
text-align: center;
background: #fff;
font-size: 1.1em;
letter-spacing: 1px;
width: 100%;
white-space: nowrap;
}
.add-to-cart:hover,
.one-click-buy:hover,
.request-info:hover {
color: #fff;
}
.one-click-buy,
.request-info {
border: 1px solid #101010;
color: #101010;
}
.one-click-buy:hover,
.request-info:hover {
background: #101010;
}
.add-to-cart {
border: 1px solid #D02229;
color: #D02229;
}
.add-to-cart:hover {
background: #D02229;
}
.icon-cart-red,
.icon-cart-white {
gap: 15px;
}
.icon-cart-red:before,
.icon-cart-white:before {
content: "";
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
display: block;
width: 20px;
height: 20px;
}
.icon-cart-red:before {
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
.icon-cart-red:hover:before {
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
.icon-cart-white:before {
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
.add-to-favorites,
.remove-from-favorites {
display: flex;
align-items: center;
justify-content: center;
min-width: 58px;
background: #F6F6F6;
}
.add-to-favorites:before,
.remove-from-favorites:before {
content: "";
display: block;
width: 24px;
height: 24px;
}
.add-to-favorites:before {
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
.remove-from-favorites:before {
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
.article {
color: #808080;
font-size: 0.8em;
margin: 0 0 8px;
}
.out {
color: #6F6F6F;
}
.product {
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
-ms-border-radius: 10px;
-o-border-radius: 10px;
border-radius: 10px;
position: relative;
}
.product .img {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 250px;
margin: 0 0 50px;
background: url("/static/loading.svg") no-repeat center/35px;
}
.product .img.no-img {
background: url("/static/no-img.svg") no-repeat center/100px;
}
.product img {
height: 100%;
max-width: 90%;
object-fit: contain;
}
.product .product-price {
margin: 0 0 15px;
}
.product .pn {
margin-bottom: 14px;
font-size: 1.1em;
min-height: 48px;
}
.product .pb {
display: flex;
justify-content: space-between;
gap: 15px;
}
.product .out {
font-size: 0.9em;
}
.product .pba {
position: absolute;
top: 20px;
z-index: 1;
}
.product .pba > div {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
padding: 5px 10px;
background: rgba(0, 0, 0, 0.7);
color: #fff;
font-size: 0.9em;
}
.product .qnt {
font-size: 1.1em;
font-weight: 700;
}
.product .badge {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
background: #FFEC3E;
font-size: 0.7em;
padding: 5px 10px;
white-space: nowrap;
}
.product .goto-backend {
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
.product:hover {
color: #000 !important;
}
@media screen and (max-width: 575px) {
.product .add-to-cart {
font-size: 0.9em;
letter-spacing: 0;
padding: 0 24px;
}
.product .pb > * {
height: 38px;
}
.product .pn {
font-size: 1em;
}
.product .img {
height: 150px;
}
.product .product-price {
font-size: 0.9em;
}
.product .product-price .old-price {
font-size: 0.85em;
}
}
/* ----------------------------------------------------------------
:: Hamburger button
-----------------------------------------------------------------*/
.hamburger {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
display: none;
cursor: pointer;
transition-property: opacity, filter;
transition-duration: 0.15s;
transition-timing-function: linear;
text-transform: none;
background-color: transparent;
border: 0;
margin: 0;
overflow: visible;
z-index: 1003;
background-color: #D02229;
min-width: 40px;
height: 40px;
}
.hamburger-inner,
.hamburger-inner:before,
.hamburger-inner:after {
width: 22px;
height: 2px;
background-color: #fff;
position: absolute;
transition-property: transform;
transition-duration: 0.15s;
transition-timing-function: ease;
}
.hamburger-inner {
-webkit-transition: background-color 0s 0.13s linear;
-moz-transition: background-color 0s 0.13s linear;
-ms-transition: background-color 0s 0.13s linear;
-o-transition: background-color 0s 0.13s linear;
transition: background-color 0s 0.13s linear;
top: 11px;
}
.hamburger-inner:before,
.hamburger-inner:after {
content: "";
display: block;
}
.hamburger-inner:before {
top: 8px;
transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.hamburger-inner:after {
top: 16px;
transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
.hamburger-box {
display: flex;
justify-content: center;
position: relative;
}
.hamburger.active .hamburger-inner,
.hamburger.active .hamburger-inner:before,
.hamburger.active .hamburger-inner:after {
background-color: #fff;
}
.hamburger.active .hamburger-inner {
transition-delay: 0.22s;
background-color: transparent !important;
top: 10px;
}
.hamburger.active .hamburger-inner:before {
top: 0;
transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
transform: translate3d(0, 10px, 0) rotate(45deg);
}
.hamburger.active .hamburger-inner:after {
top: 0;
transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
transform: translate3d(0, 10px, 0) rotate(-45deg);
}
@media screen and (max-width: 950px) {
.hamburger {
display: inline-block;
}
}
/* ----------------------------------------------------------------
:: Socilas
-----------------------------------------------------------------*/
.vk,
.youtube,
.telegram,
.whatsapp,
.email-icon {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
display: flex;
align-items: center;
min-width: 48px;
min-height: 48px;
padding: 15px;
gap: 10px;
background: #FCFCFC;
font-weight: 700;
}
.vk:hover,
.youtube:hover,
.telegram:hover,
.whatsapp:hover,
.email-icon:hover {
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
color: #fff;
background-color: #2A2A2A;
}
.vk:before,
.youtube:before,
.telegram:before,
.whatsapp:before,
.email-icon:before {
content: "";
display: block;
min-width: 27px;
height: 27px;
background: no-repeat;
background-size: contain;
background-position: center;
}
.vk:before {
background-image: url('data:image/svg+xml;utf8,');
}
.vk:hover:before {
background-image: url('data:image/svg+xml;utf8,');
}
.youtube:before {
background-image: url('data:image/svg+xml;utf8,');
}
.youtube:hover:before {
background-image: url('data:image/svg+xml;utf8,');
}
.telegram:before {
background-image: url('data:image/svg+xml;utf8,');
}
.telegram:hover:before {
background-image: url('data:image/svg+xml;utf8,');
}
.whatsapp:before {
background-image: url('data:image/svg+xml;utf8,');
}
.whatsapp:hover:before {
background-image: url('data:image/svg+xml;utf8,');
}
.email-icon:before {
background-image: url('data:image/svg+xml;utf8,');
}
.email-icon:hover:before {
background-image: url('data:image/svg+xml;utf8,');
}
.socials {
display: flex;
gap: 10px;
}
/* ----------------------------------------------------------------
:: Cookie notice
-----------------------------------------------------------------*/
.cookie-notice {
display: flex;
align-items: center;
justify-content: center;
position: fixed;
bottom: 0;
left: 0;
right: 0;
color: #fff;
padding: 15px 5px;
font-size: 0.8em;
gap: 10px;
background: #D02229;
background: linear-gradient(0deg, rgb(208, 34, 41) 0%, rgb(174, 7, 12) 100%);
z-index: 98;
font-weight: 700;
}
.cookie-confirm {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
background: #fff;
color: #000;
cursor: pointer;
padding: 5px 15px;
}
@media screen and (max-width: 950px) {
.cookie-notice {
bottom: 60px;
}
}
/* ----------------------------------------------------------------
:: Footer
-----------------------------------------------------------------*/
footer {
padding: 100px 0 30px;
color: #9C9C9C;
}
footer .copyright {
width: 100%;
font-weight: 400;
font-size: 0.9em;
}
footer address {
color: #101010;
}
.footer-menu {
width: 45%;
}
.footer-contacts {
width: 25%;
}
.footer-contacts .logo {
max-width: 100%;
width: 285px;
height: auto;
margin: 0 0 25px;
}
.footer-contacts a[href^="tel:"],
.footer-contacts a[href^="mailto:"] {
display: flex;
gap: 10px;
align-items: center;
font-weight: 700;
font-size: 1.4em;
}
.footer-contacts a[href^="tel:"]:before,
.footer-contacts a[href^="mailto:"]:before {
content: "";
display: block;
min-width: 25px;
height: 25px;
}
.footer-contacts a[href^="tel:"]:before {
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
.footer-contacts a[href^="mailto:"] {
margin: 10px 0;
}
.footer-contacts a[href^="mailto:"]:before {
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
.footer-contacts .logos {
margin: 20px 0 0;
}
.footer-contacts .logos img {
max-width: 100%;
width: 100%;
}
.footer-menu .menu {
width: 50%;
}
.footer-menu .with-line:before {
content: "";
display: block;
margin: 0 0 15px;
width: 100px;
max-width: 100%;
height: 1px;
background: #D2D2D2;
}
.footer-address .socials {
margin: 0 0 15px;
}
.footer-address p {
margin: 10px 0;
}
.footer-address a {
white-space: nowrap;
}
@media screen and (max-width: 1100px) {
.footer-menu {
font-size: 1em;
}
.footer-menu .menu {
gap: 10px;
}
.footer-contacts a[href^="tel:"],
.footer-contacts a[href^="mailto:"] {
font-size: 1.2em;
}
}
@media screen and (max-width: 950px) {
footer .container {
flex-wrap: wrap;
}
.footer-contacts,
.footer-menu {
width: 47%;
}
.footer-address {
width: 100%;
margin: 30px 0 0;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
}
.footer-address > div {
width: 47%;
}
.footer-address .messengers {
align-items: flex-start;
}
.footer-menu {
flex-direction: column;
justify-content: flex-start;
}
.footer-menu .menu {
width: 100%;
flex-direction: row;
flex-wrap: wrap;
}
.footer-menu .menu:nth-child(2) {
margin: 20px 0 0;
padding: 20px 0 0;
border-top: 1px solid #E4E4E4;
}
.footer-menu .menu > div {
width: 48%;
}
.footer-menu .with-line:before {
content: none;
}
}
@media screen and (max-width: 768px) {
.footer-contacts,
.footer-menu {
width: 100%;
}
.footer-contacts {
flex-direction: row;
flex-wrap: wrap;
margin: 0 0 30px;
gap: 5px;
}
.footer-contacts > * {
width: 47%;
}
.footer-contacts > *:first-child {
width: 100%;
order: 1;
}
.footer-contacts .logos {
display: none;
}
.footer-contacts .offer {
display: none;
}
.footer-contacts .phone {
order: 2;
}
.footer-contacts .email {
order: 3;
margin: 0 !important;
}
.footer-contacts p {
order: 4;
}
}
@media screen and (max-width: 575px) {
.footer-contacts {
gap: 5px;
}
.footer-contacts a[href^="tel:"],
.footer-contacts a[href^="mailto:"] {
font-size: 1em;
}
.footer-contacts p {
font-size: 0.9em;
}
.footer-address {
flex-direction: column;
}
.footer-address > div {
width: 100%;
}
.footer-address .socials {
justify-content: center;
}
.footer-address .messengers > a {
width: 100%;
justify-content: center;
}
}
@media screen and (max-width: 420px) {
.footer-contacts > * {
width: 100%;
}
.footer-contacts .logo {
margin: 0 0 10px;
}
.footer-contacts p {
order: 3;
margin: 0 0 15px;
}
.footer-contacts .email {
order: 4;
}
.footer-contacts a[href^="tel:"],
.footer-contacts a[href^="mailto:"] {
font-size: 1.4em;
}
.footer-menu .menu > div {
font-size: 0.85em;
line-height: 1.1em;
font-weight: 400;
}
}
/* ----------------------------------------------------------------
:: Overlay windows
-----------------------------------------------------------------*/
.close-win {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
display: block;
min-width: 40px;
height: 40px;
cursor: pointer;
background: url('data:image/svg+xml;utf8,') no-repeat center/30px;
}
.close-win:hover {
background: #2A2A2A url('data:image/svg+xml;utf8,') no-repeat center/22px;
}
/* ----------------------------------------------------------------
:: Catalog window
-----------------------------------------------------------------*/
#catalog-window {
padding: 20px 0;
}
#catalog-window .container {
display: none;
}
#catalog-window .catalog {
display: flex;
flex-wrap: wrap;
}
#catalog-window .catalog > div {
width: 30%;
display: flex;
gap: 20px;
}
#catalog-window .catalog img {
width: 60px;
height: 60px;
}
#catalog-window .catalog .parent {
margin: 0 0 20px;
font-size: 1.2em;
}
#catalog-window .catalog .parent img {
display: none;
}
#catalog-window .catalog .show-all {
display: flex;
align-items: center;
gap: 10px;
margin: 10px 0 0;
cursor: pointer;
}
#catalog-window .catalog .show-all:hover {
color: #D02229;
}
#catalog-window .catalog .show-all:after {
content: "";
min-width: 10px;
height: 10px;
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
#catalog-window .childs {
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
opacity: 0;
position: absolute;
width: 100%;
height: 100%;
top: 100px;
right: -140%;
background: #fff;
padding: 0 20px;
}
#catalog-window .childs.open {
opacity: 1;
right: 0;
}
#catalog-window .catalog .parent,
#catalog-window .child a {
display: block;
line-height: 1.2;
font-weight: 700;
}
#catalog-window .child {
position: absolute;
left: 20px;
padding: 0 20px 20px 0;
}
#catalog-window .child > div > div {
display: flex;
align-items: center;
width: 31%;
gap: 15px;
}
#catalog-window .child a {
display: flex;
align-items: center;
gap: 10px;
font-size: 1.1em;
}
#catalog-window .back {
opacity: 0;
}
#catalog-window .back span {
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
display: flex;
align-items: center;
cursor: pointer;
gap: 20px;
text-decoration: underline;
opacity: 0.5;
margin: 30px 0 0;
}
#catalog-window .back span:hover {
opacity: 1;
}
#catalog-window .back span:before {
content: "";
display: block;
width: 6px;
height: 10px;
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
#catalog-window .back.active {
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
opacity: 1;
}
#catalog-window .title {
font-size: 2em;
font-weight: 700;
}
#catalog-window .catalog .title {
width: 100%;
}
#catalog-window .childs .title {
margin: 0 0 20px;
}
#catalog-window .search-form {
-webkit-border-radius: 0;
-moz-border-radius: 0;
-ms-border-radius: 0;
-o-border-radius: 0;
border-radius: 0;
background: none;
}
#catalog-window .search-form input {
border-bottom: 3px solid #F6F6F6;
}
@media screen and (max-width: 950px) {
#catalog-window .title {
font-size: 2em;
}
#catalog-window .catalog .parent,
#catalog-window .child a {
font-size: 1.2em;
}
#catalog-window .catalog > div,
#catalog-window .child > div > div {
width: 46%;
gap: 10px;
}
#catalog-window .catalog img {
width: 50px;
height: 50px;
}
#catalog-window .catalog .parent {
margin: 0 0 10px;
}
}
@media screen and (max-width: 768px) {
#catalog-window .child div {
gap: 15px;
}
#catalog-window .child div a {
font-weight: 400;
font-size: 1em;
}
#catalog-window .catalog > div {
width: 47%;
}
}
@media screen and (max-width: 880px) and (min-width: 576px) {
#catalog-window .catalog .parent,
#catalog-window .child a {
display: flex;
align-items: center;
gap: 5px;
}
#catalog-window .catalog .parent img {
display: block;
width: 40px;
height: 40px;
}
#catalog-window .catalog > div > a {
display: none;
}
}
@media screen and (max-width: 575px) {
#catalog-window .title {
font-size: 1.5em;
}
#catalog-window .catalog > div,
#catalog-window .child > div > div {
width: 100%;
}
#catalog-window .search-form {
display: none;
}
}
/* ----------------------------------------------------------------
:: Search window
-----------------------------------------------------------------*/
#search-window {
padding: 20px 0;
}
#search-window .ajax-search-result {
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
background: none;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
max-height: none;
position: static;
padding: 20px 0;
}
/* ----------------------------------------------------------------
:: Confirm window
-----------------------------------------------------------------*/
.jconfirm-jo .jconfirm-bg {
background: rgba(42, 39, 38, 0.8);
}
.jconfirm-jo .jconfirm-closeIcon {
width: 30px !important;
height: 30px !important;
top: 20px !important;
right: 20px !important;
}
.jconfirm-jo .jconfirm-closeIcon:hover {
opacity: 1;
}
.jconfirm-jo .jconfirm-closeIcon .close-icon {
width: 100%;
height: 100%;
display: inline-block;
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
cursor: pointer;
}
.jconfirm-jo .jconfirm-box {
-webkit-border-radius: 5px !important;
-moz-border-radius: 5px !important;
-ms-border-radius: 5px !important;
-o-border-radius: 5px !important;
border-radius: 5px !important;
padding: 20px !important;
}
.jconfirm-jo .jconfirm-box.loading {
height: auto !important;
}
.jconfirm-jo .jconfirm-box.loading:after {
border-bottom-color: #d02229 !important;
}
.jconfirm-jo .jconfirm-box.loading:before {
background: rgba(255, 255, 255, 0.7) !important;
}
.jconfirm-jo .jconfirm-box .jconfirm-title-c {
padding-bottom: 30px !important;
}
.jconfirm-jo .jconfirm-box .jconfirm-title {
font-weight: 600;
}
.jconfirm-jo .jconfirm-box .jconfirm-title div {
display: flex;
align-items: center;
gap: 15px;
}
.jconfirm-jo .jconfirm-box .jconfirm-title div:before {
content: "";
display: block;
min-width: 25px;
height: 25px;
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.jconfirm-jo .jconfirm-box .jconfirm-title .title-found-cheaper:before {
background-image: url('data:image/svg+xml;utf8,');
}
.jconfirm-jo .jconfirm-box .jconfirm-title .title-leasing:before {
background-image: url('data:image/svg+xml;utf8,');
}
.jconfirm-jo .jconfirm-box .jconfirm-title .title-request-info:before {
background-image: url('data:image/svg+xml;utf8,');
}
.jconfirm-jo .jconfirm-box .jconfirm-title .title-one-click-buy:before {
background-image: url('data:image/svg+xml;utf8,');
}
.jconfirm-jo .jconfirm-box .jconfirm-title .title-cart:before {
background-image: url('data:image/svg+xml;utf8,');
}
.jconfirm-jo .jconfirm-box .jconfirm-buttons {
display: flex;
justify-content: center;
width: 100%;
gap: 20px;
padding: 15px 0 0 !important;
}
.jconfirm-jo .jconfirm-box .jconfirm-buttons > button {
margin: 0;
}
.jconfirm-jo .jconfirm-box .jconfirm-buttons .win-close {
display: none;
background: #F6F6F6 !important;
color: #000 !important;
}
.jconfirm-jo .jconfirm-box .jconfirm-buttons .win-close:hover {
background: #000 !important;
color: #fff !important;
}
.jconfirm-jo .jconfirm-box .jconfirm-buttons .btn-order {
display: flex;
align-items: center;
gap: 10px;
}
.jconfirm-jo .text p {
margin: 0 0 10px;
}
.jconfirm-jo .form-control {
margin: 0 0 7px;
}
/* ----------------------------------------------------------------
:: Cart popup window
-----------------------------------------------------------------*/
.just-added {
text-align: center;
}
.cart-prices {
display: flex;
flex-direction: column;
margin: 0 20px 0 0;
justify-content: flex-end;
align-items: flex-end;
}
.cart-prices .price {
font-size: 1em;
}
.cart-popup table {
width: 100%;
border-collapse: collapse;
}
.cart-popup table tr {
position: relative;
vertical-align: middle;
}
.cart-popup table tr:after {
content: "";
position: absolute;
left: 0;
bottom: 0;
display: block;
width: 100%;
height: 1px;
background: #E5E5E5;
}
.cart-popup table tfoot tr:after {
content: none;
}
.cart-popup table th {
padding: 10px 0;
background: #F5F4EF;
}
.cart-popup table th .icon {
font-size: 18px;
}
.cart-popup table th.text-right {
padding-right: 20px;
}
.cart-popup table td {
padding: 20px 0;
}
.cart-popup .coli img {
display: block;
width: 100px;
max-width: 100px !important;
}
.cart-popup .coln {
width: 100%;
padding-left: 20px;
padding-right: 20px;
}
.cart-popup .coln span {
color: #A9A9A5;
}
.cart-popup .coln .remove-from-cart {
display: none;
}
.cart-popup .colp,
.cart-popup .cols {
font-size: 1.2em;
white-space: nowrap;
min-width: 150px;
width: 150px;
}
.cart-popup .q-control {
display: flex;
justify-content: center;
gap: 2px;
width: 160px;
margin: 0 auto;
padding: 0 30px;
}
.cart-popup .colr {
width: 25px;
}
.cart-popup .remove-from-cart {
display: inline-block;
width: 25px;
height: 25px;
background: url('data:image/svg+xml;utf8,') no-repeat center/65%;
margin: 2px 10px 0 0;
}
.cart-popup .remove-from-cart:hover {
background-image: url('data:image/svg+xml;utf8,');
}
.cart-popup .cart-totals-row {
text-align: right;
}
.cart-popup .discount-percent {
font-size: 10px !important;
display: inline-block !important;
background-color: #d02229;
color: white !important;
padding: 2px;
margin-left: 5px;
border-radius: 3px;
}
.cart-popup .discount-annotation {
color: #1EBA05;
}
.cart-popup .article {
margin-top: 10px;
}
.cart-popup .old-price {
font-size: 0.7em;
}
.cart-popup .cols .cart-prices {
position: relative;
top: -4px;
}
.cart-overlay {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(255, 255, 255, 0.8);
align-items: center;
justify-content: center;
}
.q-control * {
vertical-align: top;
display: inline-block;
}
.q-control input {
border: none;
width: 56px;
height: 30px;
border-bottom: solid 1px #C4C4C4;
font-size: 1.1em;
text-align: center;
}
.q-control .incr,
.q-control .decr {
min-width: 30px;
height: 30px;
cursor: pointer;
display: inline-block;
background-repeat: no-repeat;
background-size: 100%;
background-position: center;
}
.q-control .incr {
background-image: url("/static/assets/btn_plus.svg");
}
.q-control .decr {
background-image: url("/static/assets/btn_minus.svg");
}
.q-control .incr:hover,
.q-control .decr:hover {
opacity: 0.6;
}
.cart-popup.is-popup table td {
padding-top: 10px;
padding-bottom: 10px;
}
.cart-popup.is-popup .discount-annotation {
font-size: 0.9em;
}
.cart-popup.is-popup .article {
margin: 5px 0;
}
@media screen and (max-width: 950px) {
.cart-popup table {
border-top: 1px solid #E5E5E5;
}
.cart-popup table thead {
display: none;
}
.cart-popup table tr {
display: flex;
flex-wrap: wrap;
}
.cart-popup table td {
border: 0 !important;
}
.cart-popup .cart-prices {
min-height: 38px;
align-items: flex-start;
}
.cart-popup .coln {
padding-right: 50px;
position: relative;
width: calc(100% - 100px);
}
.cart-popup .coln .remove-from-cart {
display: block;
position: absolute;
right: 0;
top: 15px;
}
.cart-popup .coln,
.cart-popup .coli {
padding-bottom: 0;
}
.cart-popup .colp,
.cart-popup .cols,
.cart-popup .colq {
padding-top: 0;
}
.cart-popup .colp {
width: 190px;
}
.cart-popup .colp .cart-prices {
padding-left: 120px;
}
.cart-popup .colr {
display: none;
}
.cart-popup .cols {
width: auto;
min-width: auto;
}
.cart-popup .cols .cart-prices {
top: 0;
}
.cart-popup .q-control {
position: relative;
top: 8px;
}
.cart-popup .cart-prices {
margin: 0;
}
.cart-popup .discount-annotation {
padding: 0 0 10px;
}
}
@media screen and (max-width: 575px) {
.cart-popup .coli img {
width: 70px;
}
.cart-popup .colp {
width: 160px;
min-width: 160px;
}
.cart-popup .colp .cart-prices {
padding-left: 90px;
}
.cart-popup .coln {
width: calc(100% - 70px);
}
.cart-popup .coln .remove-from-cart {
margin-right: 0;
}
.cart-popup .cart-prices {
font-size: 0.8em;
}
}
@media screen and (max-width: 480px) {
.cart-popup table .price {
font-size: 1em;
}
.cart-popup .coli {
display: none;
}
.cart-popup .coln {
padding-left: 0;
width: 100%;
}
.cart-popup .colp .cart-prices {
padding-left: 0;
}
.cart-popup .colp,
.cart-popup .cols {
width: 25%;
min-width: auto;
}
.cart-popup .colq {
width: 50%;
}
.cart-popup .q-control {
padding-left: 0;
padding-right: 10px;
}
}
@media screen and (max-width: 420px) {
.jconfirm-buttons .continue-shopping {
display: none !important;
}
}
/* ----------------------------------------------------------------
:: Mobile panel
-----------------------------------------------------------------*/
.mobile-panel {
-webkit-box-shadow: -5px -1px 20px 0 rgba(0, 0, 0, 0.1490196078);
-moz-box-shadow: -5px -1px 20px 0 rgba(0, 0, 0, 0.1490196078);
box-shadow: -5px -1px 20px 0 rgba(0, 0, 0, 0.1490196078);
position: fixed;
bottom: 0;
width: 100%;
display: none;
background: #fff;
z-index: 102;
font-size: 0.9em;
}
.mobile-panel > * {
flex-basis: 100%;
}
.mobile-panel > div > div {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
height: 60px;
cursor: pointer;
gap: 3px;
}
.mobile-panel > div > div:hover a {
color: #D02229;
}
.mobile-panel > div > div:before {
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
content: "";
display: block;
width: 20px;
height: 20px;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
opacity: 0.5;
}
.mobile-panel > div > div:hover:before {
opacity: 1;
}
.mobile-panel .catalog > div:before {
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
.mobile-panel .search > div:before {
background: url('data:image/svg+xml;utf8,') no-repeat center/100%;
}
.mobile-panel .favorites > div:before {
background: url('data:image/svg+xml;utf8,') no-repeat center/contain;
}
.mobile-panel .compare > div:before {
background: url('data:image/svg+xml;utf8,') no-repeat center/contain;
}
.mobile-panel .cart > div:before {
background: url('data:image/svg+xml;utf8,') no-repeat center/contain;
opacity: 1;
}
.mobile-panel .cart {
font-weight: 700;
color: #D02229;
}
.mobile-panel span {
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 8px;
left: 53%;
width: 20px;
height: 20px;
font-size: 0.9em;
font-weight: 700;
color: #D02229;
}
.mobile-panel .cart span {
background: #D02229;
color: #fff;
}
@media screen and (max-width: 950px) {
.mobile-panel {
display: flex;
}
}
@media screen and (max-width: 575px) {
.mobile-panel {
font-size: 0.8em;
}
.mobile-panel > div > div:before {
width: 15px;
height: 15px;
}
.mobile-panel span {
left: 55%;
}
}
/* ----------------------------------------------------------------
:: Mobile Menu
-----------------------------------------------------------------*/
.mobile-menu-mask {
display: none;
width: 100%;
height: 100%;
position: fixed;
z-index: 100;
top: 0;
left: 0;
overflow: hidden;
outline: 0;
background: rgba(255, 255, 255, 0.8);
}
body.mobile-menu-opened .mobile-menu-mask {
display: block;
}
.mobile-menu {
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
-webkit-box-shadow: -5px 4px 30px 0px rgba(0, 0, 0, 0.8);
-moz-box-shadow: -5px 4px 30px 0px rgba(0, 0, 0, 0.8);
box-shadow: -5px 4px 30px 0px rgba(0, 0, 0, 0.8);
display: flex;
flex-direction: column;
justify-content: space-between;
position: fixed;
top: 0;
width: 360px;
height: 100%;
left: -145%;
z-index: 101;
background: #2A2A2A;
overflow-x: hidden;
overflow-y: scroll;
padding: 0 20px 80px;
color: #fff;
}
.mobile-menu a,
.mobile-menu a:hover {
color: #fff;
}
.mobile-menu > div:nth-child(1) {
padding: 90px 0 0;
}
.mobile-menu .menu {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.mobile-menu .menu a {
width: 48%;
color: #fff;
}
.mobile-menu .menu:nth-child(2) {
margin: 15px 0 0;
padding: 15px 0 0;
border-top: 1px solid #575757;
}
.mobile-menu .socials a {
background: #000;
}
.mobile-menu .vk:before {
background-image: url('data:image/svg+xml;utf8,');
}
.mobile-menu .youtube:before {
background-image: url('data:image/svg+xml;utf8,');
}
.mobile-menu .telegram:before {
background-image: url('data:image/svg+xml;utf8,');
}
.mobile-menu .whatsapp:before {
background-image: url('data:image/svg+xml;utf8,');
}
.mobile-menu .email-icon:before {
background-image: url('data:image/svg+xml;utf8,');
}
body.mobile-menu-opened .mobile-menu {
left: 0;
}
.with-offer-stripe .mobile-menu > div:nth-child(1) {
padding: 130px 0 0;
}
.logged-in.admin-bar .mobile-menu > div:nth-child(1) {
padding-top: 120px;
}
.page-collapse .logged-in.admin-bar .mobile-menu > div:nth-child(1) {
padding-top: 145px;
}
@media screen and (min-width: 951px) {
.mobile-menu,
.mobile-menu-mask {
display: none !important;
}
}
@media screen and (max-width: 575px) {
.mobile-menu {
min-width: 100%;
max-width: 100%;
}
.mobile-menu > div:nth-child(1) {
padding: 80px 0 0;
}
}
@media screen and (max-width: 480px) {
.mobile-menu .socials a {
min-width: 40px;
min-height: 40px;
padding: 10px;
}
.mobile-menu .socials a:before {
min-width: 25px;
height: 25px;
}
.page-collapse.with-offer-stripe .mobile-menu > div:nth-child(1) {
padding-top: 110px;
}
}
/* ----------------------------------------------------------------
:: Form elements
-----------------------------------------------------------------*/
.form input[type=text],
.form input[type=tel],
.form input[type=email],
.form textarea,
.form option,
.form select {
outline: none;
border: none;
padding: 10px;
width: 100%;
font-family: "Open Sans", Arial !important;
font-weight: 400;
font-size: 1em;
background: transparent;
color: #212529;
}
.form input,
.form textarea {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-ms-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
border: 1px solid #ced4da !important;
}
.form input:focus,
.form textarea:focus {
border-color: #7f8081 !important;
}
.form input.error,
.form textarea.error {
border: 1px solid #ff000a !important;
}
.form input:disabled,
.form textarea:disabled,
.form input[readonly],
.form textarea[readonly] {
background-color: #e9ecef;
}
.form .confirm {
-webkit-transition: all ease-in-out 0.3s;
-moz-transition: all ease-in-out 0.3s;
-ms-transition: all ease-in-out 0.3s;
-o-transition: all ease-in-out 0.3s;
transition: all ease-in-out 0.3s;
padding: 10px 0 0;
opacity: 0.5;
font-size: 0.9em;
align-items: flex-start;
}
.form .confirm input {
position: relative;
top: 2px;
}
.form .confirm a {
text-decoration: underline !important;
}
.form .confirm:hover {
opacity: 1;
}
.form .confirm.error {
color: #ff000a;
opacity: 1;
}
.form .confirm.error a {
color: #ff000a;
}
/*===============================================*/
/* ----------------------------------------------------------------
:: Catalog
-----------------------------------------------------------------*/
.showcase_list {
position: absolute;
top: 0px;
left: 11px;
display: flex;
align-items: center;
z-index: 1;
padding-left: 10px;
}
.showcase_list .showcase_list__img {
font-size: 25px;
}
.tooltip {
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
-ms-border-radius: 7px;
-o-border-radius: 7px;
border-radius: 7px;
-webkit-box-shadow: 0 0 11px -3px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0 0 11px -3px rgba(0, 0, 0, 0.3);
box-shadow: 0 0 11px -3px rgba(0, 0, 0, 0.3);
font-size: 16px;
background: rgba(255, 255, 255, 0.7);
color: black;
border: 1px solid #AFAFAF;
padding: 8px;
}
.tooltip {
top: -5px !important;
}
.tooltip-inner {
white-space: pre-wrap;
}
.circle-active {
color: #40b44f;
font-size: 19px;
}
.circle-inactive {
color: #d02229;
font-size: 19px;
}
.fade {
transition: opacity 0.3s linear !important;
}
.tools {
margin-bottom: 10px;
}
.loader.loader-sm {
height: 20px;
}
#id_mainmenu .dropdown-container {
visibility: hidden;
background: transparent;
width: 730px;
position: absolute;
top: 40px;
left: 0;
z-index: 100;
border: solid 2px #d02229;
width: 100%;
height: 400px;
}
#id_mainmenu.show .dropdown-container {
visibility: visible;
}
.form_error {
margin: 15px 0 5px;
}
/*styles for categories filter*/
.filter .level {
text-decoration: none;
font-size: 14px;
display: block;
color: black;
border: none;
margin-bottom: 8px;
}
.filter .level:hover {
color: rgba(7, 107, 243, 0.6);
}
.filter .level .name {
display: inline-block;
margin-right: 5px;
}
.filter .level.showall {
margin-bottom: 10px;
}
.filter .level1 {
padding-left: 10px;
}
.filter .level2 {
padding-left: 20px;
}
.filter .level .num-products {
color: gray;
font-weight: normal;
font-size: 12px;
display: inline-block;
margin-left: 5px;
}
.filter .level.selected {
font-weight: bold;
}
.filter .level.show-all {
margin-bottom: 10px;
}
img.flag {
height: 15px;
margin-left: 10px;
}
/*# sourceMappingURL=style.css.map */