@charset "UTF-8";
/* ================================= */
/* ================================= */
/* Welcome to Compass.
* In this file you should write your main styles. (or centralize your imports)
* Import this file using the following HTML or equivalent:
* */
/* Welcome to Compass.
* In this file you should write your main styles. (or centralize your imports)
* Import this file using the following HTML or equivalent:
* */
/* line 5, ../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
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, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font: inherit;
font-size: 100%;
vertical-align: baseline;
}
/* line 22, ../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
html {
line-height: 1;
}
/* line 24, ../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
ol, ul {
list-style: none;
}
/* line 26, ../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
table {
border-collapse: collapse;
border-spacing: 0;
}
/* line 28, ../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
caption, th, td {
text-align: left;
font-weight: normal;
vertical-align: middle;
}
/* line 30, ../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
q, blockquote {
quotes: none;
}
/* line 103, ../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
q:before, q:after, blockquote:before, blockquote:after {
content: "";
content: none;
}
/* line 32, ../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
a img {
border: none;
}
/* line 116, ../../../../../../var/lib/gems/2.5.0/gems/compass-core-1.0.3/stylesheets/compass/reset/_utilities.scss */
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
display: block;
}
/* Welcome to Compass. Use this file to define print styles.
* Import this file using the following HTML or equivalent:
* */
@page {
size: A4;
margin: 20mm 10mm 25mm 10mm;
position: relative !important;
border-top: 0.1pt solid #000;
}
@media print {
header,
footer,
#contact,
.print {
display: none !important;
}
.addToCart {
display: none !important;
}
.tabs {
display: none !important;
}
.tabs-content {
border: none !important;
padding: 0px !important;
}
.tabCont {
display: block !important;
height: fit-content !important;
page-break-inside: avoid;
}
.tabCont h2 {
border-bottom: 0.2pt solid #585858;
}
.tabCont h3 {
font-size: 16pt !important;
}
.tabCont h4 {
font-size: 14pt !important;
}
.tabCont h5 {
font-size: 12.5pt !important;
}
.container {
margin: 0 !important;
padding: 0 !important;
}
.container p {
font-size: 10pt !important;
}
}
/* Welcome to Compass. Use this file to write IE specific override styles.
* Import this file using the following HTML or equivalent:
* */
/* Header - search icon */
.icon_search {
width: 32px;
height: 32px;
display: inline-block;
vertical-align: top;
position: relative;
}
.icon_search .el1 {
display: block;
position: absolute;
width: 20px;
height: 20px;
top: 4.5px;
left: 4.5px;
bottom: 4.5px;
right: 4.5px;
border-radius: 100%;
border: 1.5px solid #e20015;
}
.icon_search .el2 {
position: absolute;
width: 12px;
height: 1.5px;
border-radius: 2px;
background: #e20015;
display: block;
top: 15px;
left: 26px;
transform: rotate(45deg);
transform-origin: -10px 1.25px;
}
.icon_search .el1,
.icon_search .el2 {
animation-duration: 0.6s;
animation-iteration-count: 1;
animation-timing-function: ease-in-out;
animation-direction: reverse;
}
.icon_search.animeIn .el1 {
animation-name: menu_search_el1;
}
.icon_search.animeIn .el2 {
animation-name: menu_search_el2;
}
@keyframes menu_search_el1 {
0% {
transform: scale(1);
}
50% {
transform: scale(0.8);
}
100% {
transform: scale(1);
}
}
@keyframes menu_search_el2 {
0% {
transform: rotate(45deg);
width: 12px;
}
50% {
width: 5px;
}
100% {
transform: rotate(404deg);
width: 12px;
}
}
.icon_close {
width: 32px;
height: 32px;
display: inline-block;
vertical-align: top;
position: relative;
}
.icon_close .el1,
.icon_close .el2 {
position: absolute;
width: 32px;
top: 16px;
height: 1.5px;
border-radius: 4px;
background: #e20015;
display: block;
animation-duration: 0.2s;
animation-iteration-count: 1;
animation-timing-function: ease-in-out;
}
.icon_close .el1 {
transform: rotate(45deg);
}
.icon_close .el2 {
transform: rotate(-45deg);
}
.icon_close.animeIn .el1 {
animation-name: menu_search_close_el1;
}
.icon_close.animeIn .el2 {
animation-name: menu_search_close_el2;
}
.icon_close.animeOpen .el1 {
animation-name: menu_search_close_open_el1;
}
.icon_close.animeOpen .el2 {
animation-name: menu_search_close_open_el2;
}
@keyframes menu_search_close_el1 {
0% {
transform: rotate(45deg);
opacity: 1;
}
50% {
transform: rotate(0deg);
opacity: 0.8;
}
100% {
transform: rotate(0deg) translateX(30px);
opacity: 0;
}
}
@keyframes menu_search_close_el2 {
0% {
transform: rotate(-45deg);
opacity: 1;
}
50% {
transform: rotate(0deg);
opacity: 0.8;
}
100% {
transform: rotate(0deg) translateX(30px);
opacity: 0;
}
}
@keyframes menu_search_close_open_el1 {
0% {
transform: rotate(0deg) translateX(-30px);
opacity: 0;
}
100% {
transform: rotate(45deg) translateX(0px);
opacity: 1;
}
}
@keyframes menu_search_close_open_el2 {
0% {
transform: rotate(0deg) translateX(-30px);
opacity: 0;
}
100% {
transform: rotate(-45deg) translateX(0px);
opacity: 1;
}
}
.icon_burger {
width: 32px;
height: 32px;
display: inline-block;
vertical-align: top;
position: relative;
margin-top: 6px;
cursor: pointer;
}
.icon_burger .el1,
.icon_burger .el2,
.icon_burger .el3 {
position: absolute;
width: 32px;
height: 1.5px;
border-radius: 5px;
background: #e20015;
display: block;
animation-duration: 0.4s;
animation-iteration-count: 1;
animation-timing-function: ease-in-out;
animation-fill-mode: forwards;
transform-origin: 50% 50%;
}
.icon_burger .el1 {
top: 0px;
}
.icon_burger .el2 {
top: 10px;
}
.icon_burger .el3 {
top: 20px;
}
.icon_burger.open .el1 {
transform: rotate(45deg);
opacity: 1;
top: 10px;
}
.icon_burger.open .el2 {
opacity: 0;
}
.icon_burger.open .el3 {
transform: rotate(-45deg);
opacity: 1;
top: 10px;
}
.icon_burger.opening .el1 {
animation-name: burgerAnime_el1;
}
.icon_burger.opening .el2 {
animation-name: burgerAnime_el2;
}
.icon_burger.opening .el3 {
animation-name: burgerAnime_el3;
}
.icon_burger.closing .el1 {
animation-name: burgerAnime_el1;
animation-direction: alternate-reverse;
}
.icon_burger.closing .el2 {
animation-name: burgerAnime_el2;
animation-direction: alternate-reverse;
}
.icon_burger.closing .el3 {
animation-name: burgerAnime_el3;
animation-direction: alternate-reverse;
}
@keyframes burgerAnime_el1 {
0% {
transform: rotate(0deg);
opacity: 1;
top: 0px;
}
50% {
transform: rotate(0deg);
opacity: 1;
top: 10px;
}
100% {
transform: rotate(45deg);
opacity: 1;
top: 10px;
}
}
@keyframes burgerAnime_el2 {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes burgerAnime_el3 {
0% {
transform: rotate(0deg);
opacity: 1;
top: 20px;
}
50% {
transform: rotate(0deg);
opacity: 1;
top: 10px;
}
100% {
transform: rotate(-45deg);
opacity: 1;
top: 10px;
}
}
/* Start mixins */
/* Start mixins */
@media screen and (max-width: 1200px) {
#mainHeader .mainMenu {
padding-left: 12px !important;
padding-right: 0px !important;
}
#mainHeader .mainMenu .subMenu {
padding-left: 12px !important;
left: -12px !important;
}
header .logoCont {
width: 220px !important;
}
header .menuCont {
width: calc(100% - 360px) !important;
}
body[header-type=stickyDown] .logoCont,
body[header-type=stickyUp] .logoCont {
width: 160px !important;
}
body[header-type=stickyDown] .menuCont,
body[header-type=stickyUp] .menuCont {
width: calc(100% - 330px) !important;
}
.pageContent.single-product .container,
.single-page .container,
.order-page .container,
.cart-page .container {
padding: 0 30px !important;
}
.single-product .product-intro-grid {
grid-template-columns: 1fr 1fr !important;
grid-column-gap: 30px !important;
}
.single-product .product-desc .tabs {
width: 100% !important;
}
.single-product .product-desc .print {
width: 125px !important;
position: absolute;
top: 55px;
right: 10px;
}
.single-product .breadcrumps {
margin-bottom: 13px !important;
}
/* Errors pages */
.pageContent.error .error {
font-size: calc(18.2rem + 26 * ((100vw - 320px) / 780)) !important;
line-height: calc(17.68rem + 26 * ((100vw - 320px) / 780)) !important;
}
}
@media screen and (max-width: 960px) {
header .mainMenu li {
margin-right: 10px !important;
}
body.home .featured-products .grid {
grid-template-columns: 1fr 1fr;
}
footer .footer .footer-grid {
grid-template-columns: 1fr 1fr 1fr !important;
grid-gap: 25px !important;
}
footer .footer .info ul {
-webkit-column-count: 1 !important;
-moz-column-count: 1 !important;
column-count: 1 !important;
-webkit-column-gap: 0 !important;
-moz-column-gap: 0 !important;
column-gap: 0 !important;
}
.pageContent.single-product .container,
.single-page .container,
.order-page .container,
.cart-page .container {
padding: 0 30px !important;
}
.single-product .product-desc .tabs .tabs-wrapper {
grid-column-gap: 8px !important;
grid-template-rows: 32px !important;
grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)) !important;
}
.cart-page .products-list .cart-product .productCount {
width: 30px !important;
}
#MaxiEcuFX .selectForm {
grid-template-columns: 1fr 1fr !important;
}
#MaxiEcuFX .results {
column-gap: 15px !important;
}
}
@media screen and (max-width: 890px) {
.products-page .container {
grid-template-columns: auto !important;
}
.products-page .container .sidebar {
display: none !important;
}
.products-page .container .products {
grid-column-start: 1 !important;
grid-column-end: 3 !important;
}
.products-page .container .filter-bar {
grid-column-start: 1 !important;
grid-column-end: 3 !important;
}
.featured-products .grid {
width: 100%;
display: grid;
grid-template-columns: 1fr 1fr !important;
}
.featured-products .grid .products-list {
margin-bottom: 0px;
}
.featured-image .grid {
grid-template-columns: 1fr 2fr !important;
grid-gap: 20px !important;
}
.order-page .container {
grid-template-columns: 1fr !important;
grid-template-rows: auto auto !important;
}
.single-page .methode.online .img {
width: 200px !important;
min-width: 200px !important;
}
.single-page .methode.online .cont {
width: calc(100% - 250px) !important;
}
.single-page .methode .img {
width: 100% !important;
min-width: 200px !important;
}
.single-page .methode .cont {
width: 100% !important;
}
}
@media screen and (max-width: 720px) {
.pageContent.single-product .container,
.single-page .container,
.order-page .container,
.cart-page .container {
padding: 0 10px !important;
}
.tabs-content,
.page-content {
padding: 30px 20px !important;
}
.cart-page .cart-header {
display: none !important;
}
.cart-page .products-list .cart-product .cart-product-container {
grid-template-rows: auto auto;
grid-template-columns: 50px 2fr 1fr 1fr 30px;
}
.cart-page .products-list .cart-product .image {
grid-column-start: 1 !important;
grid-column-end: 2 !important;
grid-row-start: 1 !important;
grid-row-end: 3 !important;
}
.cart-page .products-list .cart-product .name {
grid-column-start: 2 !important;
grid-column-end: 3 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.cart-page .products-list .cart-product .price {
grid-column-start: 2 !important;
grid-column-end: 3 !important;
grid-row-start: 2 !important;
grid-row-end: 3 !important;
text-align: left !important;
}
.cart-page .products-list .cart-product .count {
grid-column-start: 3 !important;
grid-column-end: 4 !important;
grid-row-start: 1 !important;
grid-row-end: 3 !important;
}
.cart-page .products-list .cart-product .count > div {
display: block !important;
margin: 0 auto;
}
.cart-page .products-list .cart-product .count .productCount {
width: 35px !important;
}
.cart-page .products-list .cart-product .count .less,
.cart-page .products-list .cart-product .count .more {
width: 30px !important;
}
.cart-page .products-list .cart-product .count .less {
transform: translateY(61px);
}
.cart-page .products-list .cart-product .count .more {
transform: translateY(-61px);
}
.cart-page .products-list .cart-product .total {
grid-column-start: 4 !important;
grid-column-end: 5 !important;
grid-row-start: 1 !important;
grid-row-end: 3 !important;
}
.cart-page .products-list .cart-product .removeFromCart {
grid-column-start: 5 !important;
grid-column-end: 6 !important;
grid-row-start: 1 !important;
grid-row-end: 3 !important;
}
.cart-page .products-list .cart-product .removeFromCart .removeCartIco {
left: 0px !important;
width: 30px !important;
}
}
@media screen and (max-width: 560px) {
body.home .featured-products .grid {
grid-gap: 5px !important;
}
body.mobileMenu header #preHeader {
top: 0px !important;
overflow: visible !important;
z-index: 910;
}
body.mobileMenu header #preHeader .contact {
display: none !important;
}
body.mobileMenu header #preHeader .menu {
width: 100% !important;
}
body.mobileMenu header #preHeader .menu .languages {
float: left !important;
}
body.mobileMenu header #preHeader .menu .currency {
float: right !important;
}
body.mobileMenu header #preHeader .menu .currency .subMenu {
margin: 0 auto;
z-index: 910 !important;
}
body.mobileMenu header #preHeader .menu .help {
display: none !important;
}
body.mobileMenu header #mainHeader {
top: 36px !important;
}
header {
margin-bottom: 0 !important;
padding-bottom: 160px !important;
}
header #preHeader {
position: fixed !important;
top: -36px !important;
overflow: hidden !important;
transition: 0.2s all !important;
}
header #mainHeader {
position: fixed !important;
top: 0px !important;
transition: 0.2s all !important;
}
header #mainHeader .logoCont {
width: 160px !important;
left: calc(50% - 80px) !important;
position: absolute !important;
max-height: 80px !important;
}
header #mainHeader .logoCont a {
margin: 0 auto !important;
margin-top: 20px !important;
max-width: calc(100% - 10px);
}
header #mainHeader .logoCont a img {
max-height: none !important;
max-width: none !important;
width: 140px;
}
body[header-type=stickyDown] header #mainHeader .logoCont a, body[header-type=stickyUp] header #mainHeader .logoCont a {
margin-top: 10px !important;
}
body[header-type=stickyDown] header #mainHeader .logoCont a img, body[header-type=stickyUp] header #mainHeader .logoCont a img {
height: auto !important;
width: 110px;
}
header #mainHeader .menuCont {
position: absolute !important;
width: 60px !important;
height: 50px !important;
top: 0px !important;
right: 10px !important;
transition: 0s all;
z-index: 600 !important;
}
header #mainHeader .menuCont .searchCont {
display: none;
}
header #mainHeader .menuCont .burgerIcon {
right: 15px !important;
margin-top: 6px !important;
}
header #mainHeader .menuCont.open {
height: calc(100vh - 80px) !important;
width: calc(100% - 20px) !important;
background-image: url("../img/logo_shop.png");
background-repeat: no-repeat;
background-position: right 10px bottom 10px;
background-size: 80px;
}
header #mainHeader .menuCont.open .mainMenu {
margin-top: 0px !important;
}
header #mainHeader .menuCont.open .searchCont {
display: block;
height: 50px !important;
}
header #mainHeader .menuCont.open .searchCont input {
margin-top: 22px !important;
margin-left: 15px !important;
width: calc(100% - 40px) !important;
}
header #mainHeader .menuCont.open .searchCont .menuSearchBtn {
margin-top: 5px;
}
header #mainHeader .menuCont.open .menu-container {
overflow-y: scroll;
overflow-x: hidden;
height: calc(100% - 20px);
width: 100%;
top: 20px;
position: relative;
}
header #mainHeader .menuCont.open .menu-container::-webkit-scrollbar {
width: 4px;
right: 28px !important;
position: absolute !important;
}
header #mainHeader .menuCont.open .menu-container::-webkit-scrollbar-track {
background: #e3e3e3;
}
header #mainHeader .menuCont.open .menu-container::-webkit-scrollbar-thumb {
background: #e20015;
}
header #mainHeader .menuCont.open .menu-container::-webkit-scrollbar-thumb:hover {
background: #af0010;
}
header #mainHeader .menuCont .icon:hover:after {
content: none !important;
}
header #mainHeader .menuCont ul li a {
font-size: calc(1.19rem + 1.7 * ((100vw - 320px) / 780));
line-height: calc(1.7rem + 1.7 * ((100vw - 320px) / 780));
color: #717171;
}
header #mainHeader .menuCont .mainMenu {
padding: 25px !important;
padding-top: 10px !important;
}
header #mainHeader .menuCont .mainMenu li {
margin-bottom: 13px !important;
}
header #mainHeader .menuCont .mainMenu li a:after {
display: none !important;
}
header #mainHeader .menuCont .mainMenu li a:before {
content: url(../img/menu_arrow.png);
display: inline-block;
vertical-align: middle;
line-height: 6px;
font-size: 1px;
margin-right: 10px !important;
margin: 5px;
height: 6px;
transition: 0.2s all ease-in-out;
}
header #mainHeader .menuCont .extraMenu {
display: block !important;
background: #f9fafb;
padding: 25px;
}
header #mainHeader .menuCont .extraMenu .title {
font-family: "Oswald", "Arial";
font-weight: 300;
font-size: calc(1.33rem + 1.9 * ((100vw - 320px) / 780));
line-height: calc(1.9rem + 1.9 * ((100vw - 320px) / 780));
color: #e20015;
text-transform: uppercase;
margin-bottom: 13px;
}
header #mainHeader .menuCont .extraMenu ul {
padding-left: 15px;
}
header #mainHeader .menuCont .extraMenu ul li {
margin-bottom: 14px;
}
header #mainHeader .menuCont .extraMenu ul li a {
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
font-weight: normal;
color: #5d5d5d;
}
header #mainHeader .menuCont .extraMenu .clientZone {
margin-top: 32px;
}
header #mainHeader .menuCont .extraMenu .clientZone a {
width: calc(100% - 50px) !important;
text-align: center;
display: block;
padding: 10px 25px;
font-family: "Oswald", "Arial";
text-transform: uppercase;
width: fit-content;
display: block;
background: #e20015;
color: #fff;
margin-bottom: 13px;
font-size: calc(1.4rem + 2 * ((100vw - 320px) / 780));
line-height: calc(2rem + 2 * ((100vw - 320px) / 780));
}
header #mainHeader .menuCont .extraMenu .clientZone a:hover {
background: #c90013;
box-shadow: 0px 2px 0 0px #96000e;
}
header #mainHeader .menuCont .extraMenu .clientZone a:active {
background: #ff162c;
box-shadow: 0px 2px 0 0px #af0010;
}
header #mainHeader .cartCont {
position: fixed;
bottom: 0px;
left: 0;
right: 0;
height: 38px !important;
width: 100% !important;
z-index: 500 !important;
padding-top: 2px;
text-align: center !important;
}
header #mainHeader .cartCont:hover {
height: 60px;
padding-top: 0px !important;
}
header #mainHeader .cartCont .cartIcon {
display: inline-block !important;
float: unset !important;
margin: 0px !important;
height: 20px !important;
width: 20px !important;
margin-top: 6px !important;
margin-left: 5px !important;
background-size: contain !important;
vertical-align: bottom;
margin-right: 10px !important;
}
header #mainHeader .cartCont .cartTitle {
display: inline-block;
float: unset !important;
width: auto !important;
text-align: left;
margin-top: 4px;
vertical-align: bottom;
margin-right: 10px !important;
}
header #mainHeader .cartCont .cartTitle.empty {
line-height: 16px !important;
}
header #mainHeader .cartCont .cartAmount {
display: inline-block;
float: unset !important;
width: auto !important;
text-align: left;
vertical-align: bottom;
}
.pageContent.single-product .container,
.single-page .container,
.cart-page .container {
padding: 0 5px !important;
}
.products-list {
grid-gap: 5px !important;
}
.products-list[list-style=grid] {
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
}
.products-list .single-product {
padding: 5px !important;
}
.single-product .product-intro-grid {
grid-template-columns: 1fr 1fr !important;
grid-column-gap: 10px !important;
padding: 0 10px !important;
margin-bottom: 10px;
}
.single-product .product-intro-grid .image {
grid-column-start: 1 !important;
grid-column-end: 3 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
min-height: 170px !important;
}
.single-product .product-intro-grid .name {
grid-column-start: 1 !important;
grid-column-end: 3 !important;
grid-row-start: 2 !important;
grid-row-end: 3 !important;
}
.single-product .product-intro-grid .desc {
grid-column-start: 1 !important;
grid-column-end: 3 !important;
grid-row-start: 3 !important;
grid-row-end: 4 !important;
}
.single-product .product-intro-grid .price {
grid-column-start: 2 !important;
grid-column-end: 3 !important;
grid-row-start: 3 !important;
grid-row-end: 4 !important;
justify-self: self-end;
}
.single-product .product-intro-grid .availablity {
grid-column-start: 1 !important;
grid-column-end: 2 !important;
grid-row-start: 3 !important;
grid-row-end: 4 !important;
align-self: flex-end;
}
.single-product .product-intro-grid .addToCart {
grid-column-start: 1 !important;
grid-column-end: 3 !important;
grid-row-start: 4 !important;
grid-row-end: 5 !important;
}
.single-product .product-intro-grid .addToCart .btn {
max-width: 100% !important;
}
.single-product .product-desc .tabs {
display: none !important;
}
.single-product .product-desc .print {
top: 5px;
}
.single-product .product-desc .tabCont {
height: auto !important;
margin-bottom: 24px;
}
.single-product .product-desc .tabCont > h2 {
display: block !important;
}
.single-product .product-desc .tabCont h2:first-child {
width: 100%;
border-bottom: 2px solid #4b4b4b;
font-family: "Oswald", "Arial";
font-weight: 500;
text-transform: uppercase;
}
.single-product .product-desc .tabCont .insider {
height: 250px !important;
overflow: hidden !important;
position: relative;
margin-bottom: 10px;
transition: 0.2s all !important;
}
.single-product .product-desc .tabCont .insider:after {
content: " ";
width: 100%;
height: 35px;
position: absolute;
bottom: 0;
left: 0;
right: 0;
background: url("../img/desc_mask.png");
background-repeat: repeat-x;
z-index: 1;
}
.single-product .product-desc .tabCont.expand .show_more {
display: none !important;
}
.single-product .product-desc .show_more {
display: block !important;
width: 60%;
border: 1px solid #e4e4e4;
background: whitesmoke;
color: #8b8b8b;
text-align: center;
margin: 0 auto;
padding: 5px 0;
font-size: calc(0.77rem + 1.1 * ((100vw - 320px) / 780));
line-height: calc(1.1rem + 1.1 * ((100vw - 320px) / 780));
font-weight: normal !important;
}
.single-product .product-desc .show_more:before, .single-product .product-desc .show_more:after {
content: "»";
display: inline-block;
transform: rotate(90deg);
font-size: calc(0.91rem + 1.3 * ((100vw - 320px) / 780));
line-height: calc(1.3rem + 1.3 * ((100vw - 320px) / 780));
}
.single-product .product-desc .show_more:before {
margin-right: 10px;
}
.single-product .product-desc .show_more:after {
margin-left: 10px;
}
.cart-page .cartFooter {
grid-template-columns: 1fr !important;
grid-template-rows: auto auto;
grid-row-gap: 20px;
}
.cart-page .cartFooter .summary {
grid-column-start: 1 !important;
grid-column-end: 2 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.cart-page .cartFooter .buttons {
grid-column-start: 1 !important;
grid-column-end: 2 !important;
grid-row-start: 2 !important;
grid-row-end: 3 !important;
text-align: center;
}
#hero .content {
padding-left: 5px !important;
z-index: 10;
}
#hero .content .desc {
margin-top: 30px !important;
}
#hero .content .desc a {
margin-top: 50px !important;
}
#hero .img {
z-index: 9;
align-self: self-end !important;
}
#hero .img img {
max-width: auto !important;
display: block;
min-width: 258px !important;
width: 100%;
margin-left: -15% !important;
margin-bottom: -10vh;
z-index: 10 !important;
}
#hero .clip-background {
top: 10vh !important;
bottom: -10vh !important;
}
.featured-image .grid {
grid-template-columns: 1fr !important;
grid-gap: 20px !important;
}
.featured-image .img img {
margin-left: 0 !important;
margin: 0 auto !important;
}
#MaxiEcuFX .results {
columns: 1 !important;
column-gap: 0px !important;
}
footer .footer .footer-grid {
grid-template-columns: 1fr 1fr 1fr !important;
grid-gap: 15px !important;
}
footer .subFooter {
padding-bottom: 32px !important;
}
/* Errors pages */
.pageContent.error .frst_line {
font-size: calc(1.4rem + 2 * ((100vw - 320px) / 780)) !important;
line-height: calc(2rem + 2 * ((100vw - 320px) / 780)) !important;
}
.pageContent.error .sec_line {
font-size: calc(2.8rem + 4 * ((100vw - 320px) / 780)) !important;
line-height: calc(4rem + 4 * ((100vw - 320px) / 780)) !important;
}
.pageContent.error .error {
font-size: calc(14rem + 20 * ((100vw - 320px) / 780)) !important;
line-height: calc(13.6rem + 20 * ((100vw - 320px) / 780)) !important;
}
.single-page .methode.online .img {
width: 200px !important;
min-width: 100px !important;
}
.single-page .methode.online .cont {
width: 100% !important;
}
.single-page .methode .img {
width: 100% !important;
min-width: 200px !important;
}
.single-page .methode .cont {
width: 100% !important;
}
.forms-wrapper .form-section .formFields .validateError {
top: 8px !important;
right: 15px !important;
left: auto !important;
}
.sort-by label {
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
margin-right: 3px !important;
}
.sort-by .sortme {
font-size: calc(0.91rem + 1.3 * ((100vw - 320px) / 780));
line-height: calc(1.3rem + 1.3 * ((100vw - 320px) / 780));
padding: 0 4px !important;
margin-right: 2px !important;
}
}
@media screen and (max-width: 480px) {
.container {
padding: 0 3px !important;
}
.tabs-content,
.page-content {
padding: 20px 10px !important;
}
.products-list {
grid-gap: 5px !important;
}
.products-list[list-style=grid] {
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
}
section#contact .content {
width: calc(100% - 10px) !important;
}
#pageHeader {
padding-left: 20px;
}
footer .footer .footer-grid {
grid-template-columns: 1fr 1fr !important;
grid-template-rows: auto;
padding: 5px !important;
}
footer .footer .footer-grid .client-zone {
grid-column-start: 1;
grid-column-end: 3;
grid-template-rows: 1;
grid-row-end: 2;
}
/* Errors pages */
.pageContent.error .error {
font-size: calc(8.4rem + 12 * ((100vw - 320px) / 780)) !important;
line-height: calc(8.16rem + 12 * ((100vw - 320px) / 780)) !important;
}
}
@media screen and (max-width: 420px) {
.products-list[list-style=grid] {
grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
}
.products-list[list-style=grid] .addToCart {
padding-left: 40px !important;
width: calc(100% - 40px) !important;
}
.products-list[list-style=grid] .addCartIco {
left: 0px !important;
}
.products-list[list-style=big] .addToCart {
font-size: 0px !important;
}
.products-list[list-style=big] .addCartIco {
left: calc(50% - 22px) !important;
}
.featured-image .content .desc {
max-width: 600px;
width: 100% !important;
}
.featured-image .content .desc a {
margin-right: 3px !important;
}
.featured-image .content .desc a .btn {
padding: 10px 13px !important;
}
.forms-wrapper .form-section {
padding: 15px !important;
max-width: calc(100% - 30px) !important;
}
.forms-wrapper .form-section .content {
padding: 0 !important;
margin-top: 20px;
}
.forms-wrapper .form-section .input input {
min-width: calc(100% - 30px) !important;
}
.sort-by {
margin-right: 3px !important;
}
.sort-by label {
display: none !important;
}
.list-style {
padding-left: 5px !important;
}
.list-style .style {
margin-right: 6px !important;
}
}
@font-face {
font-family: "Font Awesome 5 Pro";
font-style: normal;
font-weight: 300;
src: url("../images/fa-light-300.eot");
src: url("../images/fa-light-300.eot?#iefix") format("embedded-opentype"), url("../images/fa-light-300.woff2") format("woff2"), url("../images/fa-light-300.woff") format("woff"), url("../images/fa-light-300.ttf") format("truetype"), url("../images/fa-light-300.svg#fontawesome") format("svg");
}
@font-face {
font-family: "Font Awesome 5 Pro";
font-style: normal;
font-weight: 400;
src: url("../images/fa-regular-400.eot");
src: url("../images/fa-regular-400.eot?#iefix") format("embedded-opentype"), url("../images/fa-regular-400.woff2") format("woff2"), url("../images/fa-regular-400.woff") format("woff"), url("../images/fa-regular-400.ttf") format("truetype"), url("../images/fa-regular-400.svg#fontawesome") format("svg");
}
.fal, .pageContent.single-product .product-intro-grid .image .gallery .gallerySwitch:after, #hero #slider .navigate.goPrev:after, #hero #slider .navigate.goNext:after {
font-family: "Font Awesome 5 Pro" !important;
font-weight: 300;
font-style: normal !important;
}
.fa {
font-family: "Font Awesome 5 Pro" !important;
font-weight: 400;
font-style: normal !important;
}
/* Color Definitions */
/* Color END */
/* Sizes definitions */
/* Sizes END */
/* Fonts definitions */
h1 {
font-size: calc(1.4rem + 2 * ((100vw - 320px) / 780));
line-height: calc(2rem + 2 * ((100vw - 320px) / 780));
}
h2 {
font-size: calc(1.26rem + 1.8 * ((100vw - 320px) / 780));
line-height: calc(1.8rem + 1.8 * ((100vw - 320px) / 780));
}
h3 {
font-size: calc(1.12rem + 1.6 * ((100vw - 320px) / 780));
line-height: calc(1.6rem + 1.6 * ((100vw - 320px) / 780));
}
h4 {
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.4rem + 1.4 * ((100vw - 320px) / 780));
}
h5 {
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
}
h6 {
font-size: calc(0.77rem + 1.1 * ((100vw - 320px) / 780));
line-height: calc(1.1rem + 1.1 * ((100vw - 320px) / 780));
}
/* Fonts END */
/* Basic definitions */
a,
a:hover {
text-decoration: none;
color: inherit;
}
b {
font-weight: bold;
}
input:focus,
textarea:focus {
outline: none;
}
body {
background: #ffffff url("../img/background_main.jpg") no-repeat;
background-size: 100%;
background-position: top center;
position: relative;
transition: 0.1s all ease-out;
font-family: "Open Sans", "Trebuchet MS";
font-weight: 300;
}
body.clean {
background: url("../img/background_clean.jpg") no-repeat;
}
.container {
max-width: 1300px;
margin: 0 auto;
padding: 0 10px;
display: block;
}
.checkbox {
position: relative;
margin-top: 3px;
margin-bottom: 15px;
}
.checkbox input {
opacity: 0;
height: 0;
width: 0;
}
.checkbox input:checked ~ .checkmark {
background: #fcfcfc;
}
.checkbox input:checked ~ .checkmark:after {
content: " ";
width: 13px;
height: 11px;
position: absolute;
top: -2px;
left: 2px;
background: url("../img/checkbox_tick.png") no-repeat;
display: block;
}
.checkbox .checkmark {
position: absolute;
top: 2px;
left: 10px;
width: 12px;
height: 12px;
display: block;
background: #fff;
border: 1px solid #d7d7d7;
}
.checkbox .paragraph {
margin-left: -10px;
font-size: calc(0.77rem + 1.1 * ((100vw - 320px) / 780));
line-height: calc(1.1rem + 1.1 * ((100vw - 320px) / 780));
font-weight: normal;
color: #b1b1b1;
}
.checkbox label {
position: relative;
cursor: pointer;
padding-left: 40px;
display: inline-block;
width: calc(100% - 55px);
}
.checkbox label:hover .paragraph {
color: #656565;
}
.checkbox label a:hover {
color: #e20015 !important;
}
.decor {
position: absolute;
z-index: -1;
}
.decor.left {
top: 25%;
left: 0px;
}
.decor.right {
top: 55%;
right: 0px;
}
.center-img {
margin: 0 auto;
}
/* ScrollBar styling */
/* width */
::-webkit-scrollbar {
width: 15px;
position: absolute !important;
}
/* Track */
::-webkit-scrollbar-track {
background: #f1f1f1;
}
/* Handle */
::-webkit-scrollbar-thumb {
background: #888;
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background: #555;
}
/* 2.0 Header */
body[header-type=stickyUp] #mainHeader {
top: 36px !important;
}
body[header-type=stickyDown] header,
body[header-type=stickyUp] header {
z-index: 999;
}
body[header-type=stickyDown] #preHeader,
body[header-type=stickyUp] #preHeader {
position: fixed;
top: 0px;
z-index: 1100;
}
body[header-type=stickyDown] #mainHeader,
body[header-type=stickyUp] #mainHeader {
position: fixed;
top: 36px;
}
body[header-type=stickyDown] #mainHeader .logoCont,
body[header-type=stickyUp] #mainHeader .logoCont {
height: 50px;
width: 190px;
}
body[header-type=stickyDown] #mainHeader .logoCont a, body[header-type=stickyDown] #mainHeader .logoCont img,
body[header-type=stickyUp] #mainHeader .logoCont a,
body[header-type=stickyUp] #mainHeader .logoCont img {
height: 35px;
}
body[header-type=stickyDown] #mainHeader .logoCont a,
body[header-type=stickyUp] #mainHeader .logoCont a {
margin: 7.5px auto;
}
body[header-type=stickyDown] #mainHeader .menuCont,
body[header-type=stickyUp] #mainHeader .menuCont {
height: 50px;
width: calc(100% - 360px);
}
body[header-type=stickyDown] #mainHeader .menuCont .mainMenu,
body[header-type=stickyUp] #mainHeader .menuCont .mainMenu {
padding: 12px 35px;
}
body[header-type=stickyDown] #mainHeader .menuCont .menuSearchBtn,
body[header-type=stickyDown] #mainHeader .menuCont .menuSearchCloseBtn,
body[header-type=stickyDown] #mainHeader .menuCont .burgerIcon,
body[header-type=stickyUp] #mainHeader .menuCont .menuSearchBtn,
body[header-type=stickyUp] #mainHeader .menuCont .menuSearchCloseBtn,
body[header-type=stickyUp] #mainHeader .menuCont .burgerIcon {
margin-top: 6px !important;
display: block;
z-index: 900 !important;
}
body[header-type=stickyDown] #mainHeader .menuCont .searchCont,
body[header-type=stickyUp] #mainHeader .menuCont .searchCont {
height: 50px !important;
}
body[header-type=stickyDown] #mainHeader .menuCont .searchCont input,
body[header-type=stickyUp] #mainHeader .menuCont .searchCont input {
margin-top: 15.5px;
width: calc(100% - 180px);
}
body[header-type=stickyDown] #mainHeader .cartCont,
body[header-type=stickyUp] #mainHeader .cartCont {
height: 50px;
width: 160px;
}
body[header-type=stickyDown] #mainHeader .cartCont .cartIcon,
body[header-type=stickyUp] #mainHeader .cartCont .cartIcon {
width: 33px;
float: left;
margin-top: -2px;
}
body[header-type=stickyDown] #mainHeader .cartCont .cartTitle,
body[header-type=stickyUp] #mainHeader .cartCont .cartTitle {
float: left;
width: calc(100% - 37px);
text-align: left;
margin-top: 4px;
}
body[header-type=stickyDown] #mainHeader .cartCont .cartTitle.empty,
body[header-type=stickyUp] #mainHeader .cartCont .cartTitle.empty {
line-height: 38px;
}
body[header-type=stickyDown] #mainHeader .cartCont .cartAmount,
body[header-type=stickyUp] #mainHeader .cartCont .cartAmount {
float: left;
width: calc(100% - 50px);
text-align: left;
}
body[header-type=stickyUp] header {
margin-bottom: 140px;
}
body[header-type=stickyUp] #mainHeader {
position: fixed;
top: 0px;
z-index: 999;
}
header,
.logoCont,
.logoCont a,
.logoCont img,
.menuCont,
.menuCont .mainMenu,
.cartCont .cartIcon,
.cartCont .cartTitle,
.cartCont .cartAmount,
.cartCont {
transition: 0.3s all ease-in-out !important;
}
header {
width: 100%;
position: relative;
max-height: 170px;
margin-bottom: 50px;
padding-bottom: 140px;
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1rem + 1 * ((100vw - 320px) / 780));
/* 1.1 Pre Header */
/* 2.2 Main Header */
}
header #preHeader {
height: 36px;
background: #4b4b4b;
display: block;
width: 100%;
}
header #preHeader * {
color: #cacaca;
}
header #preHeader .container {
position: relative;
}
header #preHeader a:hover {
color: #e4e4e4;
}
header #preHeader .contact {
float: left;
margin: 0 10px;
}
header #preHeader .menu {
float: right;
margin-right: 1.5px;
width: auto;
display: table;
font-size: 0px;
}
header #preHeader .menu > div {
display: inline-block;
vertical-align: top;
position: relative;
border-right: 1.5px solid #3c3c3c;
padding: 0 15px;
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1rem + 1 * ((100vw - 320px) / 780));
line-height: 36px !important;
height: 36px !important;
}
header #preHeader .menu select {
background: none !important;
border: none !important;
height: 36px !important;
padding-left: 15px;
}
header #preHeader .menu select:focus {
border: none !important;
outline: none !important;
}
header #preHeader .menu select option {
padding: 8px 5px 8px 10px;
height: 32px !important;
border-bottom: 1.5px solid #3c3c3c;
line-height: 16px !important;
background: #555555;
outline: none !important;
}
header #preHeader .menu .language {
display: none !important;
}
header #preHeader .menu .languages.openSub .subMenu {
left: 0px !important;
}
header #preHeader .menu .languages .subMenu {
left: 0px !important;
}
header #preHeader .menu .languages .subMenu li {
padding: 8px 5px 8px 10px;
}
header #preHeader .menu .haveSub.openSub {
background: #555555;
}
header #preHeader .menu .haveSub.openSub .subMenu {
display: block;
transform: translateY(0);
z-index: 999;
}
header #preHeader .menu .subMenu {
position: absolute;
overflow: hidden;
height: auto;
transform: translateY(-150%);
top: 36px;
background: #555555;
width: auto;
display: table;
min-width: 120px;
right: 0px;
z-index: -1;
cursor: pointer;
}
header #preHeader .menu .subMenu ul li {
border-bottom: 1.5px solid #3c3c3c;
line-height: 16px;
}
header #preHeader .menu .subMenu ul li:first-letter {
text-transform: uppercase;
}
header #preHeader .menu .subMenu ul li:hover {
background: #656565;
}
header #preHeader .menu .subMenu ul li:active {
background: #434343;
}
header #preHeader .menu .subMenu ul li a {
padding: 8px 5px 8px 10px;
display: block;
}
header #preHeader .menu .haveSub .btn span:after {
content: url("../img/svg/pre_header_arrow.svg");
display: inline-block;
margin-left: 5px;
vertical-align: middle;
height: 10px;
line-height: 3px;
}
header #preHeader .menu .help .subMenu {
min-width: 180px;
}
header #preHeader .frstLine {
line-height: 36px !important;
}
header #preHeader form {
display: none;
}
header #preHeader .btn {
cursor: pointer;
}
header #preHeader .btn:hover > span {
color: #e4e4e4;
}
header #mainHeader {
display: block;
width: 100%;
position: absolute;
top: 36px;
z-index: 900;
}
header #mainHeader .container {
max-width: calc(1300px + 20px);
width: calc(100% - 16px);
}
header #mainHeader .container > div {
display: inline-block;
vertical-align: top;
background: #fff;
}
header #mainHeader .shadowMaker {
position: absolute;
z-index: -1;
width: 100%;
top: 0;
left: 0;
right: 0;
}
header #mainHeader .shadowMaker .container > div,
header #mainHeader .shadowMaker .wing {
box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.13);
}
header #mainHeader .logoCont {
height: 120px;
width: 340px;
margin-bottom: 20px;
text-align: center;
}
header #mainHeader .logoCont a {
margin: 27px auto;
display: block;
}
header #mainHeader .logoCont a img {
max-height: 100%;
max-width: calc(100% - 16px);
}
header #mainHeader .menuCont {
height: 100px;
width: calc(100% - 480px);
position: relative;
}
header #mainHeader .menuCont .extraMenu {
display: none;
}
header #mainHeader .menuCont .mainMenu {
width: calc(100% - 40px);
padding: 35px 20px;
padding-right: 5px;
}
header #mainHeader .menuCont .mainMenu li {
display: inline-block;
position: relative;
list-style: none;
font-family: "Oswald", "Arial";
font-weight: 300;
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.68rem + 1.4 * ((100vw - 320px) / 780));
letter-spacing: 0px;
color: #7e7e7e;
transition: 0.2s all;
}
html[lang=ru] header #mainHeader .menuCont .mainMenu li {
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.44rem + 1.2 * ((100vw - 320px) / 780));
}
header #mainHeader .menuCont .mainMenu li:not(:last-of-type) {
margin-right: 5px;
}
header #mainHeader .menuCont .mainMenu li a:after {
content: url("../img/menu_arrow.png");
display: inline-block;
vertical-align: middle;
line-height: 6px;
font-size: 1px;
margin: 5px;
height: 6px;
transition: 0.2s all ease-in-out;
}
header #mainHeader .menuCont .mainMenu li:hover {
color: #e20015;
}
header #mainHeader .menuCont .mainMenu li:hover > a:after {
transform: rotate(-90deg);
}
header #mainHeader .menuCont .mainMenu .subMenu {
display: none;
position: absolute;
top: 30px;
left: -35px;
min-width: 120px;
width: auto;
background: #ffffff;
padding: 10px 16px;
padding-left: 35px;
padding-top: 0px;
}
header #mainHeader .menuCont .mainMenu .subMenu li {
padding-bottom: 4px;
padding-left: 7px;
border-left: 1px solid #cacaca;
}
header #mainHeader .menuCont .burgerIcon {
position: absolute;
top: 0px;
margin-top: 30px;
right: 10px;
opacity: 0;
transition: 0.3s all;
}
header #mainHeader .menuCont .burgerIcon:after {
content: " ";
width: 0px;
height: 2.5px;
background: #e20015;
display: block;
position: absolute;
bottom: -10px;
left: 50%;
transform: translateX(-50%);
transition: 0.2s all;
}
header #mainHeader .menuCont .burgerIcon:hover:after {
width: 100%;
}
header #mainHeader .menuCont[menu-style=web-burger], header #mainHeader .menuCont[menu-style=mob-burger] {
overflow: hidden;
}
header #mainHeader .menuCont[menu-style=web-burger] .mainMenu, header #mainHeader .menuCont[menu-style=mob-burger] .mainMenu {
margin-top: 100px;
width: calc(100% - 20px);
display: block;
padding-top: 0px;
padding-bottom: 10px;
}
header #mainHeader .menuCont[menu-style=web-burger] .mainMenu li, header #mainHeader .menuCont[menu-style=mob-burger] .mainMenu li {
display: table;
margin-bottom: 6px;
}
header #mainHeader .menuCont[menu-style=web-burger] .mainMenu li .subMenu, header #mainHeader .menuCont[menu-style=mob-burger] .mainMenu li .subMenu {
display: block !important;
position: relative !important;
top: 7px !important;
left: 5px !important;
}
header #mainHeader .menuCont[menu-style=web-burger] .mainMenu li .subMenu li, header #mainHeader .menuCont[menu-style=mob-burger] .mainMenu li .subMenu li {
padding: 0 !important;
margin: 0 !important;
border: none !important;
}
header #mainHeader .menuCont[menu-style=web-burger] .burgerIcon, header #mainHeader .menuCont[menu-style=mob-burger] .burgerIcon {
right: 20px;
opacity: 1;
}
header #mainHeader .menuCont[menu-style=web-burger] .searchCont, header #mainHeader .menuCont[menu-style=mob-burger] .searchCont {
right: 50px;
}
header #mainHeader .menuCont[menu-style=web-burger] .searchCont .menuSearchCloseBtn, header #mainHeader .menuCont[menu-style=mob-burger] .searchCont .menuSearchCloseBtn {
display: none !important;
}
header #mainHeader .menuCont[menu-style=web-burger] .searchCont .menuSearchBtn, header #mainHeader .menuCont[menu-style=mob-burger] .searchCont .menuSearchBtn {
right: 20px !important;
}
header #mainHeader .menuCont[menu-style=web-burger] .searchCont input, header #mainHeader .menuCont[menu-style=mob-burger] .searchCont input {
margin-left: 10px;
width: calc(100% - 45px);
}
header #mainHeader .menuCont .searchCont {
position: absolute;
right: 0;
top: 0;
height: 100px;
left: calc(100% - 80px);
background: #fff;
transition: 0.6s all;
}
header #mainHeader .menuCont .searchCont.open {
left: 0px;
}
header #mainHeader .menuCont .searchCont.open .menuSearchBtn {
right: 80px;
}
header #mainHeader .menuCont .searchCont.open .menuSearchCloseBtn {
right: 20px;
opacity: 1;
}
header #mainHeader .menuCont .searchCont.open input {
padding-left: 10px;
}
header #mainHeader .menuCont .searchCont input,
header #mainHeader .menuCont .searchCont button {
background: none;
border: none;
outline: none;
}
header #mainHeader .menuCont .searchCont input {
border-bottom: 1.5px solid #e20015;
margin-top: 48.5px;
margin-left: 30px;
font-size: calc(0.875rem + 1.25 * ((100vw - 320px) / 780));
line-height: calc(1.25rem + 1.25 * ((100vw - 320px) / 780));
font-weight: 300;
height: 20px;
width: calc(100% - 110px);
}
header #mainHeader .menuCont .searchCont .icon {
position: relative;
}
header #mainHeader .menuCont .searchCont .icon:after {
content: " ";
width: 0px;
height: 2.5px;
background: #e20015;
display: block;
position: absolute;
bottom: -10px;
left: 50%;
transform: translateX(-50%);
transition: 0.2s all;
}
header #mainHeader .menuCont .searchCont .icon:hover:after {
width: 100%;
}
header #mainHeader .menuCont .searchCont .searchLine {
position: relative;
width: 100%;
height: 100%;
}
header #mainHeader .menuCont .searchCont .menuSearchBtn {
cursor: pointer;
position: absolute;
right: 20px;
top: 0px;
margin-top: 30px;
transition: 0.3s all;
}
header #mainHeader .menuCont .searchCont .menuSearchCloseBtn {
cursor: pointer;
position: absolute;
width: 32px;
right: 20px;
top: 0px;
margin-top: 30px;
transition: 0.3s all;
opacity: 0;
}
header #mainHeader .cartCont {
height: 120px;
width: 130px;
text-align: center;
transition: 0.2s all;
}
header #mainHeader .cartCont:hover {
box-shadow: 0 0 50px rgba(0, 0, 0, 0.1);
padding-top: 20px;
}
header #mainHeader .cartCont .cartIcon {
width: 33px;
height: 50px;
background: url("../img/cart.png");
background-repeat: no-repeat;
background-size: 30px 33px;
background-position: center center;
display: block;
margin: 0 auto;
margin-top: 10px;
position: relative;
}
header #mainHeader .cartCont .cartIcon.empty .cartIconCount {
display: none;
}
header #mainHeader .cartCont .cartIcon .cartIconCount {
width: 18px;
height: 18px;
display: block;
position: absolute;
font-size: calc(0.665rem + 0.95 * ((100vw - 320px) / 780));
line-height: calc(0.95rem + 0.95 * ((100vw - 320px) / 780));
font-family: "Oswald", "Arial";
line-height: 18px;
top: 8px;
right: 5px;
background: #e20015;
color: #fff;
}
header #mainHeader .cartCont .cartTitle {
color: #4b4b4b;
font-size: calc(0.805rem + 1.15 * ((100vw - 320px) / 780));
line-height: calc(1.15rem + 1.15 * ((100vw - 320px) / 780));
font-family: "Oswald", "Arial";
font-weight: 300;
}
header #mainHeader .cartCont .cartAmount {
color: #e20015;
font-size: calc(0.805rem + 1.15 * ((100vw - 320px) / 780));
line-height: calc(1.15rem + 1.15 * ((100vw - 320px) / 780));
font-family: "Oswald", "Arial";
font-weight: 300;
}
/* 3.0 Page Content */
.pageContent .btn,
#pageHeader .btn {
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.4rem + 1.4 * ((100vw - 320px) / 780));
padding: 10px 25px;
font-family: "Oswald", "Arial";
text-transform: uppercase;
width: fit-content;
display: block;
background: #e20015;
color: #fff;
margin-bottom: 13px;
}
.pageContent .btn:hover,
#pageHeader .btn:hover {
background: #c90013;
box-shadow: 0px 2px 0 0px #96000e;
}
.pageContent .btn:active,
#pageHeader .btn:active {
background: #ff162c;
box-shadow: 0px 2px 0 0px #af0010;
}
.pageContent .btn.big,
#pageHeader .btn.big {
font-size: calc(1.4rem + 2 * ((100vw - 320px) / 780));
line-height: calc(2rem + 2 * ((100vw - 320px) / 780));
}
.pageContent h1,
.pageContent h2,
.pageContent h3,
.pageContent h4,
.pageContent h5,
.pageContent h6,
#pageHeader h1,
#pageHeader h2,
#pageHeader h3,
#pageHeader h4,
#pageHeader h5,
#pageHeader h6 {
margin-bottom: 13px;
font-family: "Oswald", "Arial";
font-weight: 300;
text-transform: uppercase;
color: #4b4b4b;
}
.pageContent h1,
#pageHeader h1 {
font-size: calc(2.24rem + 3.2 * ((100vw - 320px) / 780));
line-height: calc(2.08rem + 3.2 * ((100vw - 320px) / 780));
color: #8b8b8b;
}
.pageContent h1 .red,
#pageHeader h1 .red {
font-size: calc(2.8rem + 4 * ((100vw - 320px) / 780));
line-height: calc(2.68rem + 4 * ((100vw - 320px) / 780));
font-weight: 500 !important;
color: #e20015;
}
.pageContent p,
#pageHeader p {
margin-bottom: 13px;
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.44rem + 1.2 * ((100vw - 320px) / 780));
}
.pageContent .box,
#pageHeader .box {
background: #fff;
border: 1px solid #e7e9ed;
}
/* 4.0 HERO Start */
#hero {
position: relative;
}
#hero .clip-background {
width: 40%;
display: block;
background: url("../img/shape.png");
background-repeat: no-repeat;
background-size: contain;
background-position: right center;
position: absolute;
top: 7vh;
bottom: -11vh;
left: auto;
right: 0;
z-index: -1;
transition: 0.32s all ease-in-out;
}
#hero .centerRel {
display: inline-block;
width: 1px;
min-height: calc(100vh - 200px);
vertical-align: middle;
}
#hero .sliderInner {
max-width: calc(1300px + 20px);
margin: 0 auto;
display: grid;
grid-column-gap: 0px;
grid-template-columns: 1.8fr 1.2fr;
}
#hero .content {
padding-left: 10%;
}
#hero .img {
width: 100%;
height: 500px;
align-self: center;
}
#hero .img img {
max-width: 100%;
max-height: 100%;
}
#hero #slider {
width: 100%;
height: 75vh;
max-height: 500px;
position: relative;
overflow: hidden;
}
#hero #slider .container {
height: 100%;
width: 100%;
max-width: 720px;
margin: 0 auto;
position: relative;
}
#hero #slider .slide {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
transition: 0.46s transform ease-in-out, 0.36s opacity ease-in-out;
}
#hero #slider .slide.main {
z-index: 100;
}
#hero #slider .slide.prev {
transform: translateX(-70vw);
opacity: 0;
}
#hero #slider .slide.next {
transform: translateX(70vw);
opacity: 0;
}
@keyframes prev {
0% {
opacity: 1;
transform: translateX(0vw);
}
35% {
opacity: 0;
}
100% {
transform: translateX(-100vw);
}
}
@keyframes next {
0% {
opacity: 1;
transform: translateX(0vw);
}
35% {
opacity: 0;
}
100% {
transform: translateX(100vw);
}
}
#hero #slider .navigate {
position: absolute;
top: 50%;
transform: translateY(-50%);
font-size: 32px;
cursor: pointer;
transition: 0.12s all ease-in-out;
line-height: 25px;
text-align: center;
opacity: 0.6;
z-index: 150;
}
#hero #slider .navigate:hover {
opacity: 1;
}
#hero #slider .navigate.goNext {
right: 10px;
}
#hero #slider .navigate.goNext:after {
content: "\f054";
font-size: 32px;
}
#hero #slider .navigate.goPrev {
left: 10px;
}
#hero #slider .navigate.goPrev:after {
content: "\f053";
font-size: 32px;
}
#hero #slider .timeBarBox {
width: 120px;
height: 3px;
background: #fafafa;
position: relative;
}
#hero #slider .timeBarBox #timeBar {
position: absolute;
bottom: 0;
left: 0;
right: 0;
width: 0;
background: #e5e5e5;
height: 3px;
}
.langMe {
opacity: 0;
transition: 0.1s all ease-in-out;
}
.langMe.translated {
opacity: 1;
}
.content {
align-self: center;
}
.content h1 {
margin-bottom: 35px;
max-width: 300px;
}
.content h1 b {
color: #e20015;
}
.content .desc {
max-width: 450px;
font-size: calc(0.91rem + 1.3 * ((100vw - 320px) / 780));
line-height: calc(1.3rem + 1.3 * ((100vw - 320px) / 780));
color: #5a5a5a;
}
.content .desc p {
margin-bottom: 25px;
}
.content .btn {
padding: 10px 25px;
font-family: "Oswald", "Arial";
text-transform: uppercase;
width: fit-content;
display: block;
background: #717171;
color: #fff;
margin-bottom: 13px;
}
.content .btn:hover {
background: #656565;
box-shadow: 0px 2px 0 0px #4b4b4b;
}
.content .btn:active {
background: #8b8b8b;
box-shadow: 0px 2px 0 0px #585858;
}
.featured-products .grid {
width: 100%;
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-gap: 10px;
}
.featured-products .grid .txt {
align-self: center;
padding-left: 20px;
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(1.4rem + 2 * ((100vw - 320px) / 780));
line-height: calc(2rem + 2 * ((100vw - 320px) / 780));
text-transform: uppercase;
color: #7e7e7e;
}
.featured-products .grid .txt .big {
font-size: calc(1.82rem + 2.6 * ((100vw - 320px) / 780));
line-height: calc(2.6rem + 2.6 * ((100vw - 320px) / 780));
margin-bottom: -10px;
color: #4b4b4b;
display: block;
}
.featured-image {
margin: 80px 0;
padding: 0 10px;
}
.featured-image .grid {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 30px;
align-self: center;
}
.featured-image .img {
min-width: 100%;
}
.featured-image .img img {
margin-left: -60px;
max-width: 90%;
}
.featured-image .content h2 {
font-size: calc(1.68rem + 2.4 * ((100vw - 320px) / 780));
line-height: calc(2.4rem + 2.4 * ((100vw - 320px) / 780));
color: #717171;
}
.featured-image .content h2 .red {
font-size: calc(1.96rem + 2.8 * ((100vw - 320px) / 780));
line-height: calc(2.8rem + 2.8 * ((100vw - 320px) / 780));
color: #e20015;
font-weight: bold;
}
.featured-image .content .desc {
max-width: 600px;
width: calc(100% - 60px);
}
.featured-image .content a {
display: inline-block;
vertical-align: middle;
margin-right: 10px;
}
.featured-image .content a .btn.buy-new {
padding: 10px 25px;
font-family: "Oswald", "Arial";
text-transform: uppercase;
width: fit-content;
display: block;
background: #96a4bb;
color: #fff;
margin-bottom: 13px;
}
.featured-image .content a .btn.buy-new:hover {
background: #8797b1;
box-shadow: 0px 2px 0 0px #687c9d;
}
.featured-image .content a .btn.buy-new:active {
background: #b5bfcf;
box-shadow: 0px 2px 0 0px #7789a7;
}
.featured-image .content .small {
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1rem + 1 * ((100vw - 320px) / 780));
color: #8b8b8b;
}
/* 5.0 Products */
.products-page .container {
display: grid;
grid-template-columns: 340px auto;
grid-template-rows: 64px auto;
grid-gap: 10px;
}
.products-page .container .sidebar {
grid-column-start: 1;
grid-column-end: 1;
grid-row-start: 1;
grid-row-end: 2;
}
.products-page .container .sidebar .sidebar-widget {
padding: 20px;
padding-top: 30px;
padding-bottom: 30px;
}
.products-page .container .sidebar .sidebar-widget h4 {
font-size: calc(1.19rem + 1.7 * ((100vw - 320px) / 780));
line-height: calc(1.7rem + 1.7 * ((100vw - 320px) / 780));
color: #e20015;
text-transform: initial;
margin-bottom: 26px;
}
.products-page .container .sidebar .sidebar-widget ul {
padding-left: 10px;
}
.products-page .container .sidebar .sidebar-widget ul li {
font-size: calc(0.805rem + 1.15 * ((100vw - 320px) / 780));
line-height: calc(1.15rem + 1.15 * ((100vw - 320px) / 780));
font-family: "Open Sans", "Trebuchet MS";
font-weight: 500;
margin-bottom: 8px;
color: #7e7e7e;
}
.products-page .container .sidebar .sidebar-widget ul li a:hover {
color: #252525;
}
.products-page .container .sidebar .sidebar-widget ul li a:active {
color: #e20015;
}
.products-page .container .filter-bar {
grid-column-start: 2;
grid-column-end: 2;
grid-row-start: 1;
grid-row-end: 1;
}
.products-page .container .filter-bar .list-style {
padding-top: 18.5px;
padding-left: 18.5px;
display: inline-block;
vertical-align: middle;
width: 120px;
}
.products-page .container .filter-bar .list-style > div {
width: 27px;
height: 27px;
opacity: 0.3;
background-repeat: no-repeat;
background-size: cover;
display: inline-block;
vertical-align: middle;
margin-right: 10px;
cursor: pointer;
}
.products-page .container .filter-bar .list-style > div:last-of-type {
margin-right: 0px !important;
}
.products-page .container .filter-bar .list-style > div.selected {
opacity: 1;
}
.products-page .container .filter-bar .list-style > div[list=grid] {
background: url("../img/icons/grid-list.png");
}
.products-page .container .filter-bar .list-style > div[list=small] {
background: url("../img/icons/small-list.png");
}
.products-page .container .filter-bar .list-style > div[list=big] {
background: url("../img/icons/big-list.png");
}
.products-page .container .filter-bar .sort-by {
padding-top: 18.5px;
display: inline-block;
vertical-align: middle;
float: right;
margin-right: 10px;
}
.products-page .container .filter-bar .sort-by > div {
height: 27px;
opacity: 0.7;
background-repeat: no-repeat;
background-size: cover;
display: inline-block;
vertical-align: middle;
margin-right: 3px;
cursor: pointer;
border: 1px solid #f0f0f0;
background: #f8f8f8;
line-height: 27px;
padding: 0 12px;
font-family: oswald;
vertical-align: middle;
color: #4b4b4b;
}
.products-page .container .filter-bar .sort-by > div:hover {
background: #e9e9e9;
}
.products-page .container .filter-bar .sort-by label {
font-family: oswald;
display: inline-block;
vertical-align: middle;
color: #4b4b4b;
margin-right: 7px;
}
.products-page .container .products {
grid-column-start: 2;
grid-column-end: 2;
grid-row-start: 2;
grid-row-end: 2;
}
.empty-shop {
background-repeat: no-repeat;
-webkit-background-size: contain;
background-size: contain;
background-position: center left;
min-height: 40vh;
}
.empty-shop .empty-shop-container {
min-height: 40vh !important;
position: relative;
display: flex;
justify-self: auto;
float: right;
padding: 20px;
}
.empty-shop .error {
max-width: 550px;
width: calc(100% - 40px);
align-self: center;
margin-top: -80px;
}
.empty-shop .error .big {
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(2.38rem + 3.4 * ((100vw - 320px) / 780));
line-height: calc(2.72rem + 3.4 * ((100vw - 320px) / 780));
text-transform: uppercase;
color: #4b4b4b;
display: block;
}
.empty-shop .error .rest {
font-family: "Oswald", "Arial";
font-weight: 300;
font-size: calc(1.4rem + 2 * ((100vw - 320px) / 780));
line-height: calc(1.6rem + 2 * ((100vw - 320px) / 780));
color: #8b8b8b;
display: block;
}
.products-list {
display: grid;
grid-gap: 10px;
margin-bottom: 70px;
}
.products-list #cartAdd {
display: none;
}
.products-list[list-style=grid] {
grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}
.products-list[list-style=grid] .single-product-container {
grid-template-columns: 1fr 1fr 1fr;
grid-template-rows: auto auto auto;
grid-gap: 20px;
}
.products-list[list-style=grid] .single-product-container .image {
grid-column-start: 1;
grid-column-end: 4;
grid-row-start: 1;
grid-row-end: 1;
height: 340px;
}
.products-list[list-style=grid] .single-product-container .name {
grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 2;
grid-row-end: 2;
}
.products-list[list-style=grid] .single-product-container .price {
grid-column-start: 3;
grid-column-end: 4;
grid-row-start: 2;
grid-row-end: 2;
text-align: right;
}
.products-list[list-style=grid] .single-product-container .addToCart {
grid-column-start: 1;
grid-column-end: 4;
grid-row-start: 3;
grid-row-end: 3;
}
.products-list[list-style=big] {
grid-template-columns: 1fr;
grid-auto-rows: 180px;
grid-gap: 0px;
margin-top: 1px;
}
.products-list[list-style=big] .box {
margin-top: -1px;
}
.products-list[list-style=big] .single-product-container {
grid-template-columns: 180px 1fr;
grid-template-rows: auto auto auto;
grid-row-gap: 10px;
}
.products-list[list-style=big] .single-product-container .image {
grid-column-start: 1;
grid-column-end: 2;
grid-row-start: 1;
grid-row-end: 4;
}
.products-list[list-style=big] .single-product-container .name {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 1;
grid-row-end: 2;
}
.products-list[list-style=big] .single-product-container .price {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 2;
grid-row-end: 3;
}
.products-list[list-style=big] .single-product-container .addToCart {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 3;
grid-row-end: 4;
height: 20px;
align-self: end;
text-align: left;
padding-left: 65px;
width: calc(100% - 65px);
}
.products-list[list-style=small] {
grid-template-columns: 1fr;
grid-auto-rows: 100px;
grid-gap: 0px;
margin-top: 1px;
}
.products-list[list-style=small] .box {
margin-top: -1px;
}
.products-list[list-style=small] .single-product-container {
grid-template-columns: 60px 2fr 1fr 40px;
grid-template-rows: 1fr;
grid-row-gap: 10px;
}
.products-list[list-style=small] .single-product-container .image {
grid-column-start: 1;
grid-column-end: 2;
grid-row-start: 1;
grid-row-end: 2;
}
.products-list[list-style=small] .single-product-container .name {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 1;
grid-row-end: 2;
align-self: center;
}
.products-list[list-style=small] .single-product-container .price {
grid-column-start: 3;
grid-column-end: 4;
grid-row-start: 1;
grid-row-end: 2;
text-align: right;
align-self: center;
padding-right: 1vw;
}
.products-list[list-style=small] .single-product-container .addToCart {
grid-column-start: 4;
grid-column-end: 5;
grid-row-start: 1;
grid-row-end: 2;
align-self: center;
text-align: center;
font-size: 0px;
}
.products-list[list-style=small] .single-product-container .addToCart .addCartIco {
height: 25px;
width: 37px;
background: url("../img/add_to_cart.png") no-repeat;
background-size: contain;
background-position: center center;
display: block;
position: relative;
top: 13px;
left: 0px;
}
.products-list .single-product {
transition: 0.2s all ease-in-out;
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
padding: 10px;
position: relative;
overflow: hidden;
}
.products-list .single-product:hover {
box-shadow: 1px 1px 25px rgba(0, 0, 0, 0.1);
z-index: 10;
}
.products-list .single-product.highlight {
border: 3px solid #ff969f;
padding: 8px;
}
.products-list .single-product.highlight:after {
content: " ";
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
border: 3px solid #ff969f;
opacity: 0.6;
filter: blur(10px);
display: block;
z-index: -1 !important;
}
.products-list .single-product .single-product-container {
display: grid;
grid-gap: 5px;
height: 100%;
}
.products-list .single-product .image .img {
max-width: 100%;
max-height: 100%;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-position: center center;
background-size: contain;
}
.products-list .single-product .name {
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(0.875rem + 1.25 * ((100vw - 320px) / 780));
line-height: calc(1.125rem + 1.25 * ((100vw - 320px) / 780));
color: #4b4b4b;
}
.products-list .single-product .name .sub {
display: block;
font-family: "Open Sans", "Trebuchet MS";
font-weight: 500;
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1rem + 1 * ((100vw - 320px) / 780));
color: #e20015;
}
.products-list .single-product .price {
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(0.875rem + 1.25 * ((100vw - 320px) / 780));
line-height: calc(1.25rem + 1.25 * ((100vw - 320px) / 780));
color: #e20015;
}
.products-list .single-product .price .inclTax {
white-space: nowrap;
}
.products-list .single-product .price .exclTax {
display: block;
font-family: "Open Sans", "Trebuchet MS";
font-weight: 500;
font-size: calc(0.665rem + 0.95 * ((100vw - 320px) / 780));
line-height: calc(0.57rem + 0.95 * ((100vw - 320px) / 780));
color: #a4a4a4;
}
.products-list .single-product[stock=null]:hover {
box-shadow: none !important;
}
.products-list .single-product[stock=null] .addToCart,
.products-list .single-product[stock=null] .addToCart:hover {
background: #fdfdfd;
color: #f0f0f0;
border-color: #f0f0f0;
cursor: default;
}
.products-list .single-product[stock=null] .addToCart .addCartIco,
.products-list .single-product[stock=null] .addToCart:hover .addCartIco {
filter: brightness(100%);
}
.products-list .single-product .addToCart {
position: relative;
width: 100%;
border: 1px solid #e4e4e4;
background: whitesmoke;
color: #8b8b8b;
display: block;
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
cursor: pointer;
text-align: center;
padding: 10px 0px;
transition: 0.2s all, 0s font-size, padding, width;
}
html[lang=ru] .products-list .single-product .addToCart {
padding-left: 25px;
width: calc(100% - 25px);
}
.products-list .single-product .addToCart .addCartIco {
width: 44px;
height: 25px;
background: url("../img/add_to_cart.png") no-repeat;
background-size: contain;
background-position: center center;
display: block;
position: absolute;
left: 15px;
top: 8px;
}
.products-list .single-product .addToCart:hover {
border: 1px solid #c90013;
background: #e20015;
color: #fff;
}
.products-list .single-product .addToCart:hover .addCartIco {
filter: brightness(200%);
}
.products-list .single-product .addToCart.block, .products-list .single-product .addToCart.block:hover {
background: #fdfdfd;
color: #f0f0f0;
border-color: #f0f0f0;
cursor: initial !important;
}
.products-list .single-product .addToCart.block a, .products-list .single-product .addToCart.block:hover a {
cursor: default !important;
}
.products-list .single-product .addToCart.block .addCartIco, .products-list .single-product .addToCart.block:hover .addCartIco {
display: none !important;
}
/* Single Page Header - Breadcrumps */
#pageHeader {
margin-bottom: 50px;
}
#pageHeader .container {
padding-left: 15%;
}
.breadcrumps {
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1rem + 1 * ((100vw - 320px) / 780));
color: #656565;
}
.breadcrumps ul li {
display: inline-block;
list-style: none;
}
.breadcrumps ul li:after {
content: " »";
color: #e20015;
}
.breadcrumps ul li:last-child::after {
content: none;
}
.pageContent {
margin-bottom: 50px;
}
.pageContent.home-page section {
margin-bottom: 120px;
}
.pageContent .infoPage {
padding: 40px 20px;
}
/* Single Product Page */
.pageContent.single-product .breadcrumps {
margin-bottom: 50px;
}
.pageContent.single-product .product-intro-grid {
display: grid;
grid-template-columns: 1.5fr 1fr;
grid-gap: 15px;
grid-column-gap: 60px;
}
.pageContent.single-product .product-intro-grid.custom-key .image {
min-height: 40vh !important;
}
.pageContent.single-product .product-intro-grid .image {
grid-column-start: 1;
grid-column-end: 2;
grid-row-start: 1;
grid-row-end: 5;
position: relative;
min-height: 70vh;
margin-bottom: 32px;
}
.pageContent.single-product .product-intro-grid .image img {
position: absolute;
max-width: 100%;
max-height: 100%;
display: block;
margin: 0 auto;
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */
-khtml-user-select: none; /* Konqueror HTML */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently
supported by Chrome and Opera */
}
.pageContent.single-product .product-intro-grid .image .gallery .gallerySwitch {
width: 50%;
position: absolute;
top: 0px;
bottom: 0px;
background: rgba(0, 0, 0, 0);
transition: 0.3s all ease-out;
cursor: pointer;
outline: none !important;
z-index: 170 !important;
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */
-khtml-user-select: none; /* Konqueror HTML */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently
supported by Chrome and Opera */
-webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
-webkit-tap-highlight-color: transparent !important;
}
.pageContent.single-product .product-intro-grid .image .gallery .gallerySwitch:after {
position: absolute;
top: 50%;
font-size: 26px;
}
.pageContent.single-product .product-intro-grid .image .gallery .gallerySwitch.prev {
left: 0px;
}
.pageContent.single-product .product-intro-grid .image .gallery .gallerySwitch.prev:after {
content: "\f053";
left: 20px;
}
.pageContent.single-product .product-intro-grid .image .gallery .gallerySwitch.next {
right: 0px;
}
.pageContent.single-product .product-intro-grid .image .gallery .gallerySwitch.next:after {
content: "\f054";
right: 20px;
}
.pageContent.single-product .product-intro-grid .image .gallery .photos img {
transition: 0.35s transform ease-out, 0.2s opacity ease-out;
}
.pageContent.single-product .product-intro-grid .image .gallery .photos img.prev {
transform: translateX(-20%);
opacity: 0;
z-index: -1;
}
.pageContent.single-product .product-intro-grid .image .gallery .photos img.next {
transform: translateX(20%);
opacity: 0;
z-index: -1;
}
.pageContent.single-product .product-intro-grid .image .gallery .photos img.actual {
transform: transalteX(0);
opacity: 1;
}
.pageContent.single-product .product-intro-grid .image .makeItBig {
position: absolute;
top: 10px;
right: 10px;
z-index: 175 !important;
width: 30px;
height: 30px;
display: block;
opacity: 0.6;
transition: 0.2s all;
cursor: pointer;
}
.pageContent.single-product .product-intro-grid .image .makeItBig:hover {
opacity: 1 !important;
}
.pageContent.single-product .product-intro-grid .image .makeItBig img {
width: 100%;
height: 100%;
}
.pageContent.single-product .product-intro-grid .image .makeItBig.closeIt {
display: none;
}
.pageContent.single-product .product-intro-grid .image .makeItBig.openIt {
display: block;
}
.pageContent.single-product .product-intro-grid .image.showBig {
position: fixed;
top: 0px;
bottom: 0px;
left: 50%;
margin-bottom: 0px;
width: 100%;
transform: translateX(-50%);
right: 0px;
z-index: 999;
text-align: center;
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
background: #fff;
}
.pageContent.single-product .product-intro-grid .image.showBig .closeIt {
display: block;
}
.pageContent.single-product .product-intro-grid .image.showBig .openIt {
display: none;
}
.pageContent.single-product .product-intro-grid .image.showBig .gallery {
margin: 0 auto;
position: relative;
height: calc(100% - 50px);
padding: 25px;
}
.pageContent.single-product .product-intro-grid .image.showBig .photos {
width: auto;
margin: 0 auto;
position: relative;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
width: 100%;
height: 100%;
}
.pageContent.single-product .product-intro-grid .image.showBig .photos img.actual {
left: 50% !important;
top: 50% !important;
transform: translate(-50%, -50%) !important;
}
.pageContent.single-product .product-intro-grid .image.showBig .photos img.prev {
left: 50% !important;
top: 50% !important;
transform: translate(-100%, -50%) !important;
opacity: 0;
z-index: -1;
}
.pageContent.single-product .product-intro-grid .image.showBig .photos img.next {
left: 50% !important;
top: 50% !important;
transform: translate(50%, -50%) !important;
opacity: 0;
z-index: -1;
}
.pageContent.single-product .product-intro-grid .name {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 1;
grid-row-end: 2;
}
.pageContent.single-product .product-intro-grid .name h1 {
color: #4b4b4b !important;
text-transform: initial;
}
.pageContent.single-product .product-intro-grid .name .sub {
font-family: "Open Sans", "Trebuchet MS";
font-weight: 500;
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
color: #8b8b8b;
}
.pageContent.single-product .product-intro-grid .desc {
grid-row-start: 2;
grid-row-end: 5;
}
.pageContent.single-product .product-intro-grid .desc h3 {
font-size: calc(1.4rem + 2 * ((100vw - 320px) / 780));
line-height: calc(2rem + 2 * ((100vw - 320px) / 780));
text-shadow: 1px 0 0 #e20015;
margin-bottom: 18px;
color: #e20015;
}
.pageContent.single-product .product-intro-grid .desc h4 {
font-size: calc(1.12rem + 1.6 * ((100vw - 320px) / 780));
line-height: calc(1.6rem + 1.6 * ((100vw - 320px) / 780));
color: #96a4bb;
margin-bottom: 30px;
}
.pageContent.single-product .product-intro-grid .desc p {
font-family: "Open Sans", "Trebuchet MS";
font-weight: 500;
font-size: calc(0.805rem + 1.15 * ((100vw - 320px) / 780));
line-height: calc(1.38rem + 1.15 * ((100vw - 320px) / 780));
margin-bottom: 20px;
color: #7e7e7e;
}
.pageContent.single-product .product-intro-grid .desc .btn {
width: 90%;
min-width: 200px;
display: block;
text-align: center;
}
.pageContent.single-product .product-intro-grid .price {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 2;
grid-row-end: 3;
}
.pageContent.single-product .product-intro-grid .price .shiping {
display: block;
width: auto;
padding: 4px 6px;
padding-top: 3px;
color: #fff;
background: #96a4bb;
text-transform: uppercase;
margin-bottom: 0px;
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
}
.pageContent.single-product .product-intro-grid .price .shiping.free {
display: table;
}
.pageContent.single-product .product-intro-grid .price .inclTax {
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(1.75rem + 2.5 * ((100vw - 320px) / 780));
line-height: calc(2.5rem + 2.5 * ((100vw - 320px) / 780));
color: #e20015;
white-space: nowrap;
}
.pageContent.single-product .product-intro-grid .price .exclTax {
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
font-family: "Open Sans", "Trebuchet MS";
font-weight: 500;
color: #8b8b8b;
}
.pageContent.single-product .product-intro-grid .availablity {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 3;
grid-row-end: 4;
}
.pageContent.single-product .product-intro-grid .availablity .label {
font-size: calc(0.77rem + 1.1 * ((100vw - 320px) / 780));
line-height: calc(1.1rem + 1.1 * ((100vw - 320px) / 780));
font-weight: regular;
color: #4b4b4b;
}
.pageContent.single-product .product-intro-grid .availablity .status {
font-size: calc(0.91rem + 1.3 * ((100vw - 320px) / 780));
line-height: calc(1.3rem + 1.3 * ((100vw - 320px) / 780));
font-weight: 500;
color: #cbcbcb;
}
.pageContent.single-product .product-intro-grid .availablity .status[status=available] {
color: #a0b50d;
}
.pageContent.single-product .product-intro-grid .availablity .status[status=unavailable] {
color: #e20015;
}
.pageContent.single-product .product-intro-grid[stock=null] .addToCart .btn,
.pageContent.single-product .product-intro-grid[stock=null] .addToCart .btn:hover {
background: #fdfdfd;
color: #f0f0f0;
border-color: #f0f0f0;
cursor: default;
box-shadow: none;
}
.pageContent.single-product .product-intro-grid[stock=null] .addToCart .btn .addCartIco,
.pageContent.single-product .product-intro-grid[stock=null] .addToCart .btn:hover .addCartIco {
filter: brightness(100%);
}
.pageContent.single-product .product-intro-grid .addToCart {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 4;
grid-row-end: 5;
display: none;
}
.pageContent.single-product .product-intro-grid .addToCart form label[for=id_quantity],
.pageContent.single-product .product-intro-grid .addToCart form #id_quantity {
display: none;
}
.pageContent.single-product .product-intro-grid .addToCart form label {
font-size: calc(0.77rem + 1.1 * ((100vw - 320px) / 780));
line-height: calc(1.1rem + 1.1 * ((100vw - 320px) / 780));
font-weight: regular;
color: #4b4b4b;
}
.pageContent.single-product .product-intro-grid .addToCart form #id_licences,
.pageContent.single-product .product-intro-grid .addToCart form #id_variants {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 5px;
margin-bottom: 20px;
}
.pageContent.single-product .product-intro-grid .addToCart form #id_licences li,
.pageContent.single-product .product-intro-grid .addToCart form #id_variants li {
cursor: pointer;
display: block;
transition: 0.1s all ease-out;
background: #fff;
border: 1px solid #f0f0f0;
}
.pageContent.single-product .product-intro-grid .addToCart form #id_licences li span:not(.price),
.pageContent.single-product .product-intro-grid .addToCart form #id_variants li span:not(.price) {
color: #4b4b4b;
}
.pageContent.single-product .product-intro-grid .addToCart form #id_licences li span,
.pageContent.single-product .product-intro-grid .addToCart form #id_variants li span {
font-weight: 400 !important;
}
.pageContent.single-product .product-intro-grid .addToCart form #id_licences li span.price,
.pageContent.single-product .product-intro-grid .addToCart form #id_variants li span.price {
color: #cacaca;
}
.pageContent.single-product .product-intro-grid .addToCart form #id_licences li.selected,
.pageContent.single-product .product-intro-grid .addToCart form #id_variants li.selected {
background: #a5b1c5 !important;
color: #fff !important;
}
.pageContent.single-product .product-intro-grid .addToCart form #id_licences li.selected label, .pageContent.single-product .product-intro-grid .addToCart form #id_licences li.selected span,
.pageContent.single-product .product-intro-grid .addToCart form #id_variants li.selected label,
.pageContent.single-product .product-intro-grid .addToCart form #id_variants li.selected span {
color: #fff;
font-weight: 700 !important;
}
.pageContent.single-product .product-intro-grid .addToCart form #id_licences li.selected span.price,
.pageContent.single-product .product-intro-grid .addToCart form #id_variants li.selected span.price {
color: rgba(255, 255, 255, 0.8);
font-weight: 400 !important;
}
.pageContent.single-product .product-intro-grid .addToCart form #id_licences li:hover,
.pageContent.single-product .product-intro-grid .addToCart form #id_variants li:hover {
background: #f3f4f7;
}
.pageContent.single-product .product-intro-grid .addToCart form #id_licences label,
.pageContent.single-product .product-intro-grid .addToCart form #id_variants label {
width: calc(100% - 12px);
cursor: pointer;
height: calc(100% - 8px);
display: block;
line-height: 16px;
padding: 4px 6px;
font-weight: 500;
}
.pageContent.single-product .product-intro-grid .addToCart form #id_licences label input,
.pageContent.single-product .product-intro-grid .addToCart form #id_variants label input {
display: none;
}
.pageContent.single-product .product-intro-grid .addToCart form #id_licences label span,
.pageContent.single-product .product-intro-grid .addToCart form #id_variants label span {
color: #96a4bb;
white-space: nowrap;
}
.pageContent.single-product .product-intro-grid .addToCart .btn {
position: relative;
width: 100%;
max-width: 320px;
border: 1px solid #e4e4e4;
background: whitesmoke;
color: #8b8b8b;
display: block;
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
cursor: pointer;
text-align: center;
padding: 10px 0px;
transition: 0.2s all;
}
.pageContent.single-product .product-intro-grid .addToCart .btn.blockCart {
cursor: initial !important;
background: #fdfdfd !important;
}
.pageContent.single-product .product-intro-grid .addToCart .btn.blockCart:hover {
border: 1px solid #e4e4e4;
color: #8b8b8b;
box-shadow: none !important;
}
.pageContent.single-product .product-intro-grid .addToCart .btn .addCartIco {
width: 44px;
height: 25px;
background: url("../img/add_to_cart.png") no-repeat;
background-size: contain;
background-position: center center;
display: block;
position: absolute;
left: 15px;
top: 8px;
}
.pageContent.single-product .product-intro-grid .addToCart .btn:hover {
border: 1px solid #c90013;
background: #e20015;
color: #fff;
}
.pageContent.single-product .product-intro-grid .addToCart .btn:hover .addCartIco {
filter: brightness(200%);
}
.pageContent.single-product .product-desc {
position: relative;
}
.pageContent.single-product .product-desc .tabs {
width: 80%;
display: inline-block;
vertical-align: bottom;
}
.pageContent.single-product .product-desc .tabs .tabs-wrapper {
display: grid;
width: 100%;
align-items: stretch;
grid-column-gap: 17px;
grid-template-rows: 42px;
grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
}
.pageContent.single-product .product-desc .tabs .tabs-wrapper .tab {
font-family: "Oswald", "Arial";
font-weight: 300;
font-size: calc(0.91rem + 1.3 * ((100vw - 320px) / 780));
line-height: calc(1.3rem + 1.3 * ((100vw - 320px) / 780));
color: #717171;
text-transform: uppercase;
background: #e4e4e4 url("../img/tab_shadow.png");
background-repeat: repeat-x;
background-position: bottom;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
line-height: 42px;
transition: 0.2s all;
cursor: pointer;
}
.pageContent.single-product .product-desc .tabs .tabs-wrapper .tab .langMe {
opacity: 1 !important;
}
.pageContent.single-product .product-desc .tabs .tabs-wrapper .tab:hover {
background-color: whitesmoke;
background-position: 0 60px;
}
.pageContent.single-product .product-desc .tabs .tabs-wrapper .tab.active {
background-color: #fff;
background-image: none;
border: 1px solid #e7e9ed;
border-bottom: none;
padding: 6px 0;
margin-top: -11px;
margin-bottom: -1px;
color: #e20015;
}
.pageContent.single-product .product-desc .print {
width: 19%;
text-align: right;
display: inline-block;
vertical-align: bottom;
margin-bottom: 5px;
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1 * ((100vw - 320px) / 780));
color: #96a4bb;
opacity: 0.7;
cursor: pointer;
transition: 0.2s all;
}
.pageContent.single-product .product-desc .print .icon_print {
content: url("../img/icons/printer.png");
transform: scale(0.8);
display: inline-block;
vertical-align: top;
margin-right: 3px;
}
.pageContent.single-product .product-desc .print:hover {
opacity: 1;
}
.pageContent.single-product .product-desc .tabs-content {
padding: 60px 50px;
margin-bottom: 50px;
}
.pageContent.single-product .product-desc .tabs-content .tabCont {
transition: 0.3s all;
overflow: hidden;
height: 0px;
}
.pageContent.single-product .product-desc .tabs-content .tabCont > h2 {
display: none;
}
.pageContent.single-product .product-desc .tabs-content .tabCont.active {
height: auto;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .show_more {
display: none;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .files .file {
margin-bottom: 13px;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .files .file .ficon {
display: inline-block;
width: 45px;
height: 45px;
vertical-align: middle;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .files .file .ficon .fileIcon {
display: block;
background: url("../img/download.svg") no-repeat;
background-size: contain;
width: 100%;
height: 100%;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .files .file .rSide {
display: inline-block;
width: calc(100% - 80px);
vertical-align: middle;
padding-left: 10px;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .files .file .rSide a {
width: auto !important;
display: inline-block;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .files .file .rSide .fTitle {
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.4rem + 1.4 * ((100vw - 320px) / 780));
font-weight: 600;
color: #e20015;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .files .file .rSide p {
margin-bottom: 0;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .files .file .rSide .btn {
padding: 10px 25px;
font-family: "Oswald", "Arial";
text-transform: uppercase;
width: fit-content;
display: block;
background: #cacaca;
color: #fff;
margin-bottom: 13px;
padding: 3px 6px;
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
}
.pageContent.single-product .product-desc .tabs-content .tabCont .files .file .rSide .btn:hover {
background: #bdbdbd;
box-shadow: 0px 2px 0 0px #a4a4a4;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .files .file .rSide .btn:active {
background: #e4e4e4;
box-shadow: 0px 2px 0 0px #b1b1b1;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph {
display: grid;
grid-template-rows: 1fr;
grid-column-gap: 20px;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph .imgBox img {
width: auto !important;
height: auto;
max-width: 100%;
display: block;
margin: 0 auto;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.half {
grid-template-columns: 1fr 1fr;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.half.right .imgBox {
grid-column-start: 2 !important;
grid-column-end: 3 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.half.right .parCont {
grid-column-start: 1 !important;
grid-column-end: 2 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.half.left .imgBox {
grid-column-start: 1 !important;
grid-column-end: 2 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.half.left .parCont {
grid-column-start: 2 !important;
grid-column-end: 3 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.oneThird {
grid-template-columns: 1fr 1fr 1fr;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.oneThird.right .imgBox {
grid-column-start: 3 !important;
grid-column-end: 4 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.oneThird.right .parCont {
grid-column-start: 1 !important;
grid-column-end: 3 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.oneThird.left .imgBox {
grid-column-start: 1 !important;
grid-column-end: 2 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.oneThird.left .parCont {
grid-column-start: 2 !important;
grid-column-end: 4 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.oneQuarter {
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.oneQuarter.right .imgBox {
grid-column-start: 4 !important;
grid-column-end: 5 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.oneQuarter.right .parCont {
grid-column-start: 1 !important;
grid-column-end: 4 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.oneQuarter.left .imgBox {
grid-column-start: 1 !important;
grid-column-end: 2 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph.oneQuarter.left .parCont {
grid-column-start: 2 !important;
grid-column-end: 5 !important;
grid-row-start: 1 !important;
grid-row-end: 2 !important;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph .imgBox {
display: inline-block;
vertical-align: middle;
width: 100%;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph .imgBox img {
width: 100%;
}
html[lang=pl] .pageContent.single-product .product-desc .tabs-content .tabCont .paragraph .imgBox .imgEN {
display: none;
}
html:not([lang=pl]) .pageContent.single-product .product-desc .tabs-content .tabCont .paragraph .imgBox .imgPL {
display: none;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph .parCont {
display: inline-block;
vertical-align: middle;
width: 100%;
}
.pageContent.single-product .product-desc .tabs-content .tabCont .paragraph .parCont h3 {
text-transform: uppercase;
}
.pageContent.single-product .product-desc .table.cc-row {
display: grid;
grid-template-columns: 1fr 2fr;
grid-gap: 0px;
margin-bottom: 23px;
}
.pageContent.single-product .product-desc .table.cc-row > div {
height: 32px;
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.8rem + 1.2 * ((100vw - 320px) / 780));
}
.pageContent.single-product .product-desc .table.cc-row > div:nth-of-type(4n-2) {
background: #f9fafb;
}
.pageContent.single-product .product-desc .table.cc-row > div:nth-of-type(4n-3) {
background: #f9fafb;
}
.pageContent.single-product .product-desc .table.cc-row .tableLabel {
grid-column-start: 1;
grid-column-end: 2;
padding-left: 45px;
font-weight: normal;
height: 100%;
}
.pageContent.single-product .product-desc .table.cc-row .tableCont {
grid-column-start: 2;
grid-column-end: 3;
height: 100%;
}
.pageContent.single-product .product-desc #MaxiEcuFX .selectForm {
margin-top: 30px;
border: 1px solid #f0f0f0;
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.pageContent.single-product .product-desc #MaxiEcuFX .selectForm .table {
border-right: 1px solid #f0f0f0;
padding: 10px;
}
.pageContent.single-product .product-desc #MaxiEcuFX .selectForm .table .search {
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.4rem + 1.4 * ((100vw - 320px) / 780));
color: #4b4b4b;
border-bottom: 2px solid #4b4b4b;
padding-bottom: 3px;
margin-bottom: 7px;
font-weight: bold;
position: relative;
}
.pageContent.single-product .product-desc #MaxiEcuFX .selectForm .table .list {
max-height: 400px;
height: 400px;
}
.pageContent.single-product .product-desc #MaxiEcuFX .searchFx {
position: absolute;
top: 0px;
right: 0px;
bottom: 0px;
left: calc(100% - 30px);
overflow: hidden;
transition: 0.2s all ease-in-out;
}
.pageContent.single-product .product-desc #MaxiEcuFX .searchFx .icon_search {
width: auto;
height: auto;
-webkit-transform: scale(0.6);
-moz-transform: scale(0.6);
-ms-transform: scale(0.6);
-o-transform: scale(0.6);
transform: scale(0.6);
cursor: pointer;
}
.pageContent.single-product .product-desc #MaxiEcuFX .searchFx .searchClose {
position: absolute;
top: -10px;
right: 40px;
color: #cacaca;
transition: 0.2s all ease-in-out;
cursor: pointer;
}
.pageContent.single-product .product-desc #MaxiEcuFX .searchFx input {
border: none;
display: none;
width: 0px;
border-bottom: 1px solid #cacaca;
transition: 0.6s all ease-in-out;
}
.pageContent.single-product .product-desc #MaxiEcuFX .rowTitle.lookingFor,
.pageContent.single-product .product-desc #MaxiEcuFX .search.lookingFor {
margin-bottom: 36px !important;
}
.pageContent.single-product .product-desc #MaxiEcuFX .rowTitle.lookingFor .searchFx,
.pageContent.single-product .product-desc #MaxiEcuFX .search.lookingFor .searchFx {
top: 30px;
left: 15px;
bottom: -36px;
}
.pageContent.single-product .product-desc #MaxiEcuFX .rowTitle.lookingFor .searchFx .searchClose,
.pageContent.single-product .product-desc #MaxiEcuFX .search.lookingFor .searchFx .searchClose {
top: 0px;
}
.pageContent.single-product .product-desc #MaxiEcuFX .rowTitle.lookingFor .searchFx input,
.pageContent.single-product .product-desc #MaxiEcuFX .search.lookingFor .searchFx input {
width: calc(100% - 55px);
display: inline-block;
height: 18px;
padding-left: 25px;
}
.pageContent.single-product .product-desc #MaxiEcuFX .list {
overflow-y: scroll;
padding-right: 5px;
margin: 0 5px;
/* width */
/* Track */
/* Handle */
/* Handle on hover */
}
.pageContent.single-product .product-desc #MaxiEcuFX .list .option {
line-height: 20px;
padding: 3px 10px;
cursor: pointer;
position: relative;
}
.pageContent.single-product .product-desc #MaxiEcuFX .list .option:hover {
background: #e8e8e8;
}
.pageContent.single-product .product-desc #MaxiEcuFX .list .option.selected {
background: #f3f3f3;
}
.pageContent.single-product .product-desc #MaxiEcuFX .list .option.selected:after {
content: "☑";
position: absolute;
right: 10px;
color: limegreen;
}
.pageContent.single-product .product-desc #MaxiEcuFX .list::-webkit-scrollbar {
width: 6px;
position: absolute !important;
}
.pageContent.single-product .product-desc #MaxiEcuFX .list::-webkit-scrollbar-track {
background: #f0f0f0;
}
.pageContent.single-product .product-desc #MaxiEcuFX .list::-webkit-scrollbar-thumb {
background: #4b4b4b;
}
.pageContent.single-product .product-desc #MaxiEcuFX .list::-webkit-scrollbar-thumb:hover {
background: #4b4b4b;
}
.pageContent.single-product .product-desc #MaxiEcuFX #selCo .option {
cursor: pointer;
padding: 5px 15px;
padding-left: 30px;
position: relative;
}
.pageContent.single-product .product-desc #MaxiEcuFX #selCo .option:hover {
background: none;
}
.pageContent.single-product .product-desc #MaxiEcuFX #selCo .option.selected {
background: none;
}
.pageContent.single-product .product-desc #MaxiEcuFX #selCo .option:before {
content: " ";
position: absolute;
top: 7px;
left: 0px;
width: 16px;
height: 16px;
border: 1px solid #cacaca;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
}
.pageContent.single-product .product-desc #MaxiEcuFX #selCo .option:hover:after {
content: " ";
position: absolute;
top: 10px;
left: 3px;
width: 12px;
height: 12px;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
box-shadow: 0px 0px 12px rgba(77, 77, 77, 0.36);
}
.pageContent.single-product .product-desc #MaxiEcuFX #selCo .option.selected:after {
content: "✓";
position: absolute;
top: 10px;
left: 3px;
color: #e20015;
font-size: 20px;
line-height: 8px;
}
.pageContent.single-product .product-desc #MaxiEcuFX .controller {
padding: 10px 15px;
margin-bottom: 30px;
margin-top: 45px;
}
.pageContent.single-product .product-desc #MaxiEcuFX .controller .name {
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.4rem + 1.4 * ((100vw - 320px) / 780));
font-weight: bold;
color: #4b4b4b;
}
.pageContent.single-product .product-desc #MaxiEcuFX .results {
columns: 2;
column-gap: 45px;
}
.pageContent.single-product .product-desc #MaxiEcuFX .results .row {
-webkit-column-break-inside: avoid;
page-break-inside: avoid;
break-inside: avoid;
margin-bottom: 30px;
height: auto !important;
}
.pageContent.single-product .product-desc #MaxiEcuFX .results .row .rowTitle {
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.4rem + 1.4 * ((100vw - 320px) / 780));
font-weight: bold;
color: #4b4b4b;
border-bottom: 2px solid #4b4b4b;
margin-bottom: 10px;
position: relative;
}
.pageContent.single-product .product-desc #MaxiEcuFX .results .row .list {
overflow-y: scroll;
max-height: 320px;
}
.pageContent.single-product .product-desc #MaxiEcuFX .results .row .list .listGroupName {
color: #e20015;
font-weight: normal;
margin-bottom: 6px;
margin-top: 6px;
}
.pageContent.single-product .product-desc #MaxiEcuFX .results .row .list .listItem {
padding-left: 10px;
margin-left: 10px;
margin-bottom: 0px !important;
padding-bottom: 8px;
}
.pageContent.single-product .product-desc #MaxiEcuFX .results .row .list .fx {
line-height: 20px;
margin-bottom: 8px;
}
.pageContent.single-product .product-desc #MaxiEcuFX .system {
border-right: none;
}
html[lang=en] .tabCont .file[lang=PL] {
display: none !important;
}
html[lang=pl] .tabCont .file[lang=EN] {
display: none !important;
}
/* Single Page content */
.post-content #headings1,
.post-content #headings2,
.post-content #headings3,
.post-content #headings4,
.post-content #headings5,
.post-content #headings6 {
text-transform: initial;
font-family: "Open Sans", "Trebuchet MS";
font-weight: 600;
color: #585858;
}
.post-content p {
font-family: "Open Sans", "Trebuchet MS";
font-weight: 500;
font-size: calc(0.805rem + 1.15 * ((100vw - 320px) / 780));
line-height: calc(1.38rem + 1.15 * ((100vw - 320px) / 780));
margin-bottom: 32px;
color: #7e7e7e;
}
.pageContent.docs p, .pageContent.docs li {
font-family: "Open Sans", "Trebuchet MS";
font-weight: 500;
font-size: calc(0.77rem + 1.1 * ((100vw - 320px) / 780));
line-height: calc(1.1rem + 1.1 * ((100vw - 320px) / 780));
color: #323232;
}
.pageContent.docs p {
margin-bottom: 5px;
margin-left: 14px;
}
.pageContent.docs h4 {
margin-top: 23px;
}
.pageContent.docs a {
color: #e20015;
}
.pageContent.docs a:hover {
color: #96000e;
}
.pageContent.docs h3 {
margin-top: 30px;
}
.pageContent.docs pre {
font-family: "Open Sans", "Trebuchet MS";
font-weight: 500;
font-size: calc(0.77rem + 1.1 * (100vw - 320px) / 780);
line-height: calc(1.1rem + 1.1 * (100vw - 320px) / 780);
color: #323232;
margin-top: 32px;
font-weight: 700;
}
.pageContent.docs ul,
.pageContent.docs ol {
display: block;
list-style-type: initial;
margin-bottom: 13px;
margin-left: 24px !important;
margin-top: 12px;
margin-right: 0;
padding-left: 20px;
font-size: calc(0.91rem + 1.3 * ((100vw - 320px) / 780));
line-height: calc(1.43rem + 1.3 * ((100vw - 320px) / 780));
}
.pageContent.docs ul li,
.pageContent.docs ol li {
list-style-type: decimal;
text-align: justify;
margin-bottom: 16px;
color: #323232;
position: relative;
}
.pageContent.docs ul ol,
.pageContent.docs ul ul,
.pageContent.docs ol ol,
.pageContent.docs ol ul {
margin-top: 0px;
margin-bottom: 0px;
}
.pageContent.docs ul ol li,
.pageContent.docs ul ul li,
.pageContent.docs ol ol li,
.pageContent.docs ol ul li {
list-style-type: upper-alpha;
margin-bottom: 7px !important;
}
.pageContent.docs #term > ol > li:before {
font-size: calc(1.4rem + 2 * ((100vw - 320px) / 780));
line-height: calc(2rem + 2 * ((100vw - 320px) / 780));
top: 0px;
width: 50px;
left: -55px;
font-weight: normal;
content: "§" counters(section, ".") ".";
}
.pageContent.docs #term ol {
counter-reset: section;
list-style-type: none;
}
.pageContent.docs #term li {
list-style-type: none;
position: relative;
}
.pageContent.docs #term li:before {
counter-increment: section;
content: counters(section, ".") ".";
position: absolute;
left: -35px;
width: 30px;
top: 0px;
text-align: right;
font-weight: bold;
}
.pageContent.docs .rightMe {
float: right;
}
.pageContent.single-product .container,
.single-page .container,
.cart-page .container {
padding: 0 10%;
}
.page-content {
padding: 60px 50px;
}
.single-page .methode {
max-width: 1100px;
margin: 0 auto;
margin-top: 80px;
margin-bottom: 30px;
}
.single-page .methode .img {
display: inline-block;
width: 320px;
min-width: 300px;
vertical-align: middle;
padding-right: 40px;
}
.single-page .methode .img img {
max-width: 100%;
}
.single-page .methode .cont {
display: inline-block;
width: calc(100% - 370px);
vertical-align: middle;
}
.single-page .methode h3 {
margin-bottom: 30px;
}
.single-page .methode p {
font-size: calc(1.12rem + 1.6 * ((100vw - 320px) / 780));
line-height: calc(1.6rem + 1.6 * ((100vw - 320px) / 780));
font-weight: light !important;
color: #717171;
margin-bottom: 16px;
}
.single-page .methode .small {
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1rem + 1 * ((100vw - 320px) / 780));
font-weight: light;
color: #7e7e7e;
}
.single-page .methode .bankNo {
margin-bottom: 20px;
padding: 15px 0;
padding-left: 20px;
margin-left: 20px;
border-left: 2px solid #e20015;
}
.single-page .methode .bankNo p {
margin-bottom: 5px;
font-size: calc(0.945rem + 1.35 * ((100vw - 320px) / 780));
line-height: calc(1.35rem + 1.35 * ((100vw - 320px) / 780));
color: #e20015;
}
/* 5.0 Cart Page */
.cart-page {
margin-bottom: 100px;
}
.cart-page .products {
margin-bottom: 15px;
}
.cart-page .products-list {
display: grid;
grid-gap: 10px;
grid-template-columns: 1fr;
grid-auto-rows: 30px repeat(100px);
grid-gap: 0px;
margin-top: 1px;
}
.cart-page .products-list .box {
margin-top: -1px;
}
.cart-page .products-list .cart-product-container {
grid-template-columns: 120px 2.5fr 1fr 1fr 1fr 60px;
grid-row-gap: 10px;
display: grid;
grid-gap: 5px;
height: 100%;
}
.cart-page .products-list .cart-product-container .image {
grid-column-start: 1;
grid-column-end: 2;
grid-row-start: 1;
grid-row-end: 2;
}
.cart-page .products-list .cart-product-container .name {
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 1;
grid-row-end: 2;
align-self: center;
}
.cart-page .products-list .cart-product-container .licences li {
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1rem + 1 * ((100vw - 320px) / 780));
font-family: "Open Sans", "Trebuchet MS";
font-weight: 500;
color: #cacaca;
display: inline-block;
}
.cart-page .products-list .cart-product-container .licences li:after {
content: ", ";
}
.cart-page .products-list .cart-product-container .licences li:last-child:after {
content: none;
}
.cart-page .products-list .cart-product-container .priceSingle {
grid-column-start: 3;
grid-column-end: 4;
grid-row-start: 1;
grid-row-end: 2;
text-align: center;
align-self: center;
}
.cart-page .products-list .cart-product-container .count {
grid-column-start: 4;
grid-column-end: 5;
grid-row-start: 1;
grid-row-end: 2;
text-align: center;
align-self: center;
}
.cart-page .products-list .cart-product-container .total {
grid-column-start: 5;
grid-column-end: 6;
grid-row-start: 1;
grid-row-end: 2;
text-align: center;
align-self: center;
}
.cart-page .products-list .cart-product-container .removeFromCart {
grid-column-start: 6;
grid-column-end: 7;
grid-row-start: 1;
grid-row-end: 2;
align-self: center;
text-align: center;
font-size: 0px;
}
.cart-page .products-list .cart-product-container .removeFromCart .removeCartIco {
height: 25px;
background: url("../img/remove_from_cart.png") no-repeat;
background-size: contain;
background-position: center center;
display: block;
position: relative;
top: 13px;
left: 8px;
}
.cart-page .cart-header {
padding: 0 10px;
}
.cart-page .cart-header .cart-product-container {
grid-template-rows: 20px;
}
.cart-page .cart-header .cart-product-container > div {
font-family: "Open Sans", "Trebuchet MS";
font-weight: 600;
align-self: initial !important;
color: #4b4b4b;
margin-bottom: 2px;
}
.cart-page .cart-header .cart-product-container > div .label {
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1rem + 1 * ((100vw - 320px) / 780));
}
.cart-page .cart-header .cart-product-container .image,
.cart-page .cart-header .cart-product-container .removeFromCart {
justify-self: center;
}
.cart-page .cart-product {
transition: 0.2s all ease-in-out;
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
padding: 10px;
}
.cart-page .cart-product .cart-product-container {
grid-template-rows: 1fr;
}
.cart-page .cart-product:hover {
box-shadow: 1px 1px 25px rgba(0, 0, 0, 0.1);
z-index: 10;
}
.cart-page .cart-product .image .img {
max-width: 100%;
max-height: 100%;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-position: center center;
background-size: contain;
}
.cart-page .cart-product .name {
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(1.05rem + 1.5 * ((100vw - 320px) / 780));
line-height: calc(1.5rem + 1.5 * ((100vw - 320px) / 780));
color: #4b4b4b;
}
.cart-page .cart-product .name .sub {
display: block;
font-family: "Open Sans", "Trebuchet MS";
font-weight: 500;
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1rem + 1 * ((100vw - 320px) / 780));
color: #e20015;
}
.cart-page .cart-product .price {
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.4rem + 1.4 * ((100vw - 320px) / 780));
color: #4b4b4b;
}
.cart-page .cart-product .price .exclTax {
display: block;
font-family: "Open Sans", "Trebuchet MS";
font-weight: 500;
font-size: calc(0.665rem + 0.95 * ((100vw - 320px) / 780));
line-height: calc(0.95rem + 0.95 * ((100vw - 320px) / 780));
color: #a4a4a4;
}
.cart-page .cart-product .count {
font-size: 0px;
}
.cart-page .cart-product .count .less,
.cart-page .cart-product .count .more {
width: 20px;
height: 20px;
border: 1px solid #e4e4e4;
background: whitesmoke;
color: #8b8b8b;
display: inline-block;
vertical-align: middle;
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
cursor: pointer;
text-align: center;
transition: 0.2s all;
}
.cart-page .cart-product .count .less:hover,
.cart-page .cart-product .count .more:hover {
border: 1px solid #c90013;
background: #e20015;
color: #fff;
}
.cart-page .cart-product .count .productCount {
display: inline-block;
vertical-align: middle;
width: 70px;
height: 38px;
background: #fff;
border: 1px solid #cacaca;
z-index: 10;
}
.cart-page .cart-product .count .productCount input {
width: 100%;
height: 100%;
padding: 0px;
margin: 0px;
background: none;
border: none;
text-align: center;
font-size: calc(0.91rem + 1.3 * ((100vw - 320px) / 780));
line-height: calc(1.3rem + 1.3 * ((100vw - 320px) / 780));
font-family: "Oswald", "Arial";
font-weight: 500;
color: #656565;
}
.cart-page .cart-product .count .quantForm {
display: none !important;
}
.cart-page .cart-product .removeFromCart {
position: relative;
width: 100%;
border: 1px solid #e4e4e4;
background: whitesmoke;
color: #8b8b8b;
display: block;
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
cursor: pointer;
text-align: center;
padding: 10px 0px;
transition: 0.2s all;
}
.cart-page .cart-product .removeFromCart .removeCartIco {
width: 44px;
height: 25px;
background: url("../img/remove_from_cart.png") no-repeat;
background-size: contain;
background-position: center center;
display: block;
position: absolute;
left: 15px;
top: 8px;
}
.cart-page .cart-product .removeFromCart:hover {
border: 1px solid #c90013;
background: #e20015;
color: #fff;
}
.cart-page .cart-product .removeFromCart:hover .removeCartIco {
filter: brightness(200%);
}
.cart-page .cartFooter {
display: grid;
grid-template-columns: auto 320px;
}
.cart-page .cartFooter .buttons .btn {
display: inline-block !important;
vertical-align: top !important;
padding: 5px 8px;
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
cursor: pointer;
}
.cart-page .cartFooter .buttons .btn.clearCart {
padding: 10px 25px;
font-family: "Oswald", "Arial";
text-transform: uppercase;
width: fit-content;
display: block;
background: #ebebeb;
color: #4b4b4b;
margin-bottom: 13px;
}
.cart-page .cartFooter .buttons .btn.clearCart:hover {
background: #dedede;
box-shadow: 0px 2px 0 0px #c5c5c5;
}
.cart-page .cartFooter .buttons .btn.clearCart:active {
background: white;
box-shadow: 0px 2px 0 0px #d2d2d2;
}
.cart-page .cartFooter .buttons .btn.goShop {
padding: 10px 25px;
font-family: "Oswald", "Arial";
text-transform: uppercase;
width: fit-content;
display: block;
background: #cacaca;
color: #fff;
margin-bottom: 13px;
}
.cart-page .cartFooter .buttons .btn.goShop:hover {
background: #bdbdbd;
box-shadow: 0px 2px 0 0px #a4a4a4;
}
.cart-page .cartFooter .buttons .btn.goShop:active {
background: #e4e4e4;
box-shadow: 0px 2px 0 0px #b1b1b1;
}
.cart-page .post-content {
padding: 10vh 0;
}
.cart-page .post-content h2 {
font-family: "Oswald", "Arial";
font-weight: 300;
font-size: calc(1.96rem + 2.8 * ((100vw - 320px) / 780));
line-height: calc(2.8rem + 2.8 * ((100vw - 320px) / 780));
color: #8b8b8b;
text-align: center;
}
.cart-page .post-content .btn {
padding: 10px 25px;
font-family: "Oswald", "Arial";
text-transform: uppercase;
width: fit-content;
display: block;
background: #cacaca;
color: #fff;
margin-bottom: 13px;
margin: 0 auto;
}
.cart-page .post-content .btn:hover {
background: #bdbdbd;
box-shadow: 0px 2px 0 0px #a4a4a4;
}
.cart-page .post-content .btn:active {
background: #e4e4e4;
box-shadow: 0px 2px 0 0px #b1b1b1;
}
.cartFooter .submit .btn {
max-width: calc(100% - 50px);
}
.summary .coupon {
border: 1px solid #eeeeee;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.02);
padding: 10px 15px;
margin-top: -20px;
margin-bottom: 20px;
}
.summary .coupon .title {
font-size: calc(1.12rem + 1.6 * ((100vw - 320px) / 780));
line-height: calc(1.6rem + 1.6 * ((100vw - 320px) / 780));
font-family: oswald;
color: #96a4bb;
text-transform: uppercase;
margin-bottom: 8px;
}
.summary .coupon label {
color: #4b4b4b;
font-weight: 400;
display: inline-block;
vertical-align: middle;
margin-right: 10px;
display: none;
}
.summary .coupon input[type=text] {
width: calc(100% - 10px);
color: #717171;
padding: 6px 4px;
border: 1px solid #e4e4e4;
display: inline-block;
vertical-align: middle;
text-transform: uppercase;
font-size: calc(0.91rem + 1.3 * ((100vw - 320px) / 780));
line-height: calc(1.3rem + 1.3 * ((100vw - 320px) / 780));
letter-spacing: 1px;
text-align: center;
background: none;
}
.summary .coupon input[type=submit] {
padding: 10px 25px;
font-family: "Oswald", "Arial";
text-transform: uppercase;
width: fit-content;
display: block;
background: #cacaca;
color: #fff;
margin-bottom: 13px;
border: none;
margin-top: 7px;
margin-bottom: 2px;
padding: 3px 8px;
width: 100%;
}
.summary .coupon input[type=submit]:hover {
background: #bdbdbd;
box-shadow: 0px 2px 0 0px #a4a4a4;
}
.summary .coupon input[type=submit]:active {
background: #e4e4e4;
box-shadow: 0px 2px 0 0px #b1b1b1;
}
.summary .coupon p {
margin-bottom: 3px;
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1rem + 1 * ((100vw - 320px) / 780));
color: #cacaca;
}
.summary .coupon .error {
border: 1px solid #e20015;
background: #fff1f3;
color: #e20015;
margin-bottom: 6px;
text-align: center;
padding: 4px 0;
}
.summary .summary-content {
padding-right: 3px;
padding-top: 10px;
display: grid;
grid-template-columns: 2fr 1fr;
grid-template-rows: auto;
grid-column-gap: 5px;
grid-row-gap: 10px;
transition: 0.1s all ease-out;
}
.summary .label,
.summary .value {
font-weight: 500;
color: #717171;
}
.summary .value {
text-align: right;
}
.summary .value.totalIncl {
color: #e20015;
font-size: calc(0.91rem + 1.3 * ((100vw - 320px) / 780));
line-height: calc(1.3rem + 1.3 * ((100vw - 320px) / 780));
font-weight: 600;
}
.summary .discoVal {
color: #cacaca;
}
.summary .disco {
border-top: 1px solid #e2e2e2;
padding-top: 10px;
}
.summary .submit {
margin-top: 5px;
grid-column-start: 1;
grid-column-end: 3;
}
.summary .submit .btn {
text-align: center;
margin-bottom: 0;
border: none !important;
width: 100%;
}
.summary .submit[inactive] .btn {
cursor: default !important;
background: #f0f0f0 !important;
box-shadow: none !important;
}
.summary .goBack {
margin-top: 0px;
grid-column-start: 1;
grid-column-end: 3;
font-size: calc(0.77rem + 1.1 * ((100vw - 320px) / 780));
line-height: calc(1.1rem + 1.1 * ((100vw - 320px) / 780));
text-align: right;
color: #bebebe;
}
.summary .goBack:hover {
color: #7e7e7e;
}
.order-page .container {
padding: 0 10%;
display: grid;
grid-template-columns: auto 320px;
grid-gap: 20px;
}
.forms-wrapper {
display: grid;
grid-template-columns: 420px 60px 1fr;
grid-template-areas: "banner separator section" ". . acceptance";
margin-bottom: 50px;
}
@media (max-width: 1000px) {
.forms-wrapper {
grid-template-columns: 1fr;
grid-template-areas: "banner" "separator" "section" "acceptance";
}
}
.forms-wrapper .form-section-wrapper {
grid-area: section;
}
.forms-wrapper .form-section-wrapper .form-section {
padding: 15px 25px;
margin-bottom: 15px;
background: #f0f0f0;
}
.forms-wrapper .form-section-wrapper .form-section .title {
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.4rem + 1.4 * ((100vw - 320px) / 780));
font-weight: 600;
color: #717171;
}
.forms-wrapper .form-section-wrapper .form-section:not(.active) .content {
overflow: hidden;
}
.forms-wrapper .form-section-wrapper .form-section .content {
height: 0px;
}
.forms-wrapper .form-section-wrapper .form-section.active {
background: #fff;
}
.forms-wrapper .form-section-wrapper .form-section.active .content {
height: auto;
padding: 20px;
}
.forms-wrapper .form-section-wrapper .form-section.active .title {
border-bottom: 2px solid #717171;
padding-bottom: 5px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields {
display: grid;
grid-template-columns: 1fr 2fr;
grid-gap: 10px;
position: relative;
}
.forms-wrapper .form-section-wrapper .form-section .formFields.col1 {
grid-template-columns: 1fr;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .optional {
font-size: 10px;
border: 1px solid #e4e4e4;
color: #e4e4e4;
padding: 0px 4px;
padding-bottom: 1px;
padding-right: 6px;
margin-left: 4px;
margin-bottom: 5px;
display: inline-block;
border-radius: 7px;
vertical-align: middle;
line-height: 12px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields label,
.forms-wrapper .form-section-wrapper .form-section .formFields .label {
line-height: 34px;
font-weight: normal;
color: #989898;
grid-column-start: 1;
grid-column-end: 2;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .input {
position: relative;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .info {
margin-top: 12px;
margin-bottom: 12px;
font-size: 11pt;
line-height: 12pt;
padding: 8px 12px;
border: 1px solid #eaeaea;
background: #f6f6f6;
color: #a3a3a3;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .info a {
color: #e20015;
}
.forms-wrapper .form-section-wrapper .form-section .formFields input {
width: 50%;
min-width: 200px;
height: 34px;
padding: 0 10px;
line-height: 34px;
border: 1px solid #cacaca;
grid-column-start: 2;
grid-column-end: 3;
position: relative;
}
.forms-wrapper .form-section-wrapper .form-section .formFields input[type=submit] {
display: none !important;
}
.forms-wrapper .form-section-wrapper .form-section .formFields input:not([required]) {
border-color: #f0f0f0;
}
.forms-wrapper .form-section-wrapper .form-section .formFields input[type=radio] {
width: auto;
min-width: 16px;
height: 16px;
display: none;
}
.forms-wrapper .form-section-wrapper .form-section .formFields input[type=radio] ~ .radioStyle {
width: 16px;
height: 16px;
border: 1px solid #cacaca;
border-radius: 100%;
display: inline-block;
position: relative;
}
.forms-wrapper .form-section-wrapper .form-section .formFields input[type=radio]:checked ~ .radioStyle:after {
content: "✓";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 2px;
width: 12px;
height: 12px;
color: #e20015;
font-size: 20px;
line-height: 8px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields input[type=radio].active .checkpoint:after {
content: "✓";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 2px;
width: 12px;
height: 12px;
color: #e20015;
font-size: 20px;
line-height: 8px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields label:hover .radioStyle:before {
content: " ";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 2px;
width: 12px;
height: 12px;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
box-shadow: 0px 0px 12px rgba(77, 77, 77, 0.36);
}
.forms-wrapper .form-section-wrapper .form-section .formFields .spacer,
.forms-wrapper .form-section-wrapper .form-section .formFields .fullRow,
.forms-wrapper .form-section-wrapper .form-section .formFields .full {
grid-column-start: 1;
grid-column-end: 3;
position: relative;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .spacer .paragraph,
.forms-wrapper .form-section-wrapper .form-section .formFields .fullRow .paragraph,
.forms-wrapper .form-section-wrapper .form-section .formFields .full .paragraph {
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1rem + 1 * ((100vw - 320px) / 780));
color: #cacaca;
margin-bottom: 4px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .fullRow {
padding-top: 20px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .spacer {
height: 20px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields#extraAdress {
display: none;
}
.forms-wrapper .form-section-wrapper .form-section .formFields#extraAdress.active {
display: grid;
}
.forms-wrapper .form-section-wrapper .form-section .formFields#extraAdress .button {
grid-column-start: 2;
grid-column-end: 3;
}
.forms-wrapper .form-section-wrapper .form-section .formFields#extraAdress .button .btn {
width: 50%;
min-width: 200px;
border: 1px solid #e20015;
color: #e20015;
text-transform: uppercase;
background: #f7f7f7;
cursor: pointer;
padding: 4px 10px;
font-weight: 300 !important;
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(1.12rem + 1.6 * ((100vw - 320px) / 780));
line-height: calc(1.6rem + 1.6 * ((100vw - 320px) / 780));
transition: 0.2s all ease-out;
text-align: center;
}
.forms-wrapper .form-section-wrapper .form-section .formFields#extraAdress .button .btn:hover {
font-weight: 500 !important;
background: #e20015;
color: #fff;
}
.forms-wrapper .form-section-wrapper .form-section .formFields#extraAdress .button .btn:active {
background: #96000e;
border-color: #96000e;
box-shadow: none;
}
.forms-wrapper .form-section-wrapper .form-section .formFields #invoice .paragraph {
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.4rem + 1.4 * ((100vw - 320px) / 780));
color: #4b4b4b !important;
display: inline-block;
vertical-align: middle !important;
margin-left: 5px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields #invoice .checkmark {
display: inline-block;
vertical-align: middle !important;
margin-top: 10px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields #invoice #id_invoice {
display: none;
}
.forms-wrapper .form-section-wrapper .form-section .formFields textarea {
width: 100%;
max-width: 100%;
min-width: 100%;
min-height: 180px;
grid-column-start: 1;
grid-column-end: 3;
}
.forms-wrapper .form-section-wrapper .form-section .formFields #id_country,
.forms-wrapper .form-section-wrapper .form-section .formFields #id_inv_country {
display: none;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown {
position: relative;
z-index: 500;
width: 50%;
min-width: 200px;
padding: 0 10px;
min-height: 34px;
line-height: 34px;
border: 1px solid #cacaca;
grid-column-start: 2;
grid-column-end: 3;
position: relative;
cursor: pointer;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown:after {
content: url("../img/menu_arrow.png");
display: inline-block;
margin-left: 5px;
vertical-align: middle;
position: absolute;
top: 15px;
right: 10px;
height: 10px;
line-height: 3px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown input[name=countryFilter] {
display: none;
border: none;
position: absolute;
top: 0px;
left: 0px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown .dropList {
display: none;
position: absolute;
top: 36px;
left: 0px;
margin-top: -2px;
margin-left: -1px;
max-height: 300px;
overflow-y: scroll;
z-index: 500;
border: 1px solid #cacaca;
background: #fff;
min-width: 220px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown .dropListItem {
padding: 5px 0;
cursor: pointer;
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(0.96rem + 1.2 * ((100vw - 320px) / 780));
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown .dropListItem:not(.selected):hover {
background: #f0f0f0;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown .dropListItem.selected {
line-height: 26px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown .dropListItem img {
width: 16px;
margin: 0 6px;
display: inline-block;
vertical-align: middle;
box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown .dropListItem span {
display: inline-block;
vertical-align: middle;
width: calc(100% - 28px);
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown.active .dropList {
display: block;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown.active input[name=countryFilter] {
display: block;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown.disable {
cursor: initial !important;
border: 1px solid #f3f3f3;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown.disable * {
cursor: initial !important;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .dropDown.disable:after {
content: none;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .validateError {
position: absolute;
top: 0px;
left: 62%;
font-size: 12px;
font-weight: 500;
border-radius: 6px;
color: #fff;
background: #ffa2a2;
display: initial;
width: auto;
padding: 4px 8px;
box-shadow: 0px 1px 7px rgba(255, 0, 0, 0.11), 0px 0px 0 0px #e20015;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .validateError:after {
content: " ";
box-shadow: 0px 0px 0px 0px #ababab;
border-radius: 5px;
width: 100%;
display: block;
position: absolute;
height: 100%;
top: 0px;
left: 0px;
bottom: 0px;
animation: valErr 1s ease-out;
}
@keyframes valErr {
0% {
box-shadow: 0px 0px 0px 2px #e20015;
}
100% {
box-shadow: 0px 0px 0px 0px #fff;
}
}
.forms-wrapper .form-section-wrapper .form-section .formFields .fullRow .validateError {
left: 0px;
right: 0px;
top: -10px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .fullRow.importantMessage {
border: 1px solid #e20015;
padding: 10px 15px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields .fullRow.importantMessage h3 {
color: #e20015;
margin-bottom: 0px;
font-weight: 300 !important;
text-align: center;
}
.forms-wrapper .form-section-wrapper .form-section .formFields #ppdata {
display: none;
}
.forms-wrapper .form-section-wrapper .form-section .formFields #ppdata input {
height: 0px;
width: 0px;
border: none;
color: #fff;
}
.forms-wrapper .form-section-wrapper .form-section .formFields #deliveryOpt {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
.forms-wrapper .form-section-wrapper .form-section .formFields #deliveryOpt #id_delivery {
display: none;
}
.forms-wrapper .form-section-wrapper .form-section .formFields #deliveryOpt .deliveryOption {
position: relative;
padding-left: 40px;
cursor: pointer;
margin-bottom: 13px;
display: none;
}
.forms-wrapper .form-section-wrapper .form-section .formFields #deliveryOpt .deliveryOption.allowed {
display: inline-block;
}
.forms-wrapper .form-section-wrapper .form-section .formFields #deliveryOpt .deliveryOption .label {
font-family: "Oswald", "Arial";
font-weight: 500;
font-weight: 300;
text-transform: uppercase;
line-height: 16px;
}
.forms-wrapper .form-section-wrapper .form-section .formFields #deliveryOpt .deliveryOption .price {
font-size: calc(0.77rem + 1.1 * ((100vw - 320px) / 780));
line-height: calc(1.1rem + 1.1 * ((100vw - 320px) / 780));
font-weight: normal;
color: #e20015;
}
.forms-wrapper .form-section-wrapper .form-section .formFields #deliveryOpt .deliveryOption .checkpoint {
width: 16px;
height: 16px;
border: 1px solid #cacaca;
border-radius: 100%;
display: block;
position: absolute;
left: 5px;
top: 50%;
transform: translateY(-50%);
}
.forms-wrapper .form-section-wrapper .form-section .formFields #deliveryOpt .deliveryOption:hover .checkpoint:after {
content: " ";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 2px;
width: 12px;
height: 12px;
-webkit-border-radius: 100%;
-moz-border-radius: 100%;
border-radius: 100%;
box-shadow: 0px 0px 12px rgba(77, 77, 77, 0.36);
}
.forms-wrapper .form-section-wrapper .form-section .formFields #deliveryOpt .deliveryOption.active .checkpoint:after {
content: "✓";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 2px;
width: 12px;
height: 12px;
color: #e20015;
font-size: 20px;
line-height: 8px;
}
.forms-wrapper .form-section-wrapper .form-section.hide {
display: none;
}
.forms-wrapper .form-section-wrapper .form-acceptance {
padding-left: 20px;
grid-area: acceptance;
}
.forms-wrapper .form-section-wrapper .summary .btn {
max-width: 260px;
float: right;
width: calc(100% - 60px);
}
.forms-wrapper .return-banner {
grid-area: banner;
}
.forms-wrapper .form-separator {
grid-area: separator;
margin: 40px 10px 0px 10px;
text-align: center;
font-weight: bold;
}
@media (max-width: 1000px) {
.forms-wrapper .form-separator {
margin: 30px 0px 30px 0px;
}
}
ul#id_payment {
display: none !important;
}
#stylizePayment > li {
width: calc(33% - 10px);
max-width: 220px;
height: 200px;
border: 1px solid #cacaca;
display: inline-block;
vertical-align: top;
position: relative;
cursor: pointer;
box-shadow: 0 0px 0 rgba(0, 0, 0, 0);
transition: 0.2s all;
}
#stylizePayment > li:not(:last-of-type) {
margin-right: 12px;
}
#stylizePayment > li:hover {
box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);
background: #fafafa;
}
#stylizePayment > li.selected {
box-shadow: 0 4px 2px rgba(0, 0, 0, 0.05), 0 0 0 3px inset #e20015;
}
#stylizePayment > li .logo {
margin: 0 auto;
display: block;
margin-top: 20px;
text-align: center;
height: 70px;
}
#stylizePayment > li .logo img {
max-width: calc(100% - 20px);
}
#stylizePayment > li#bank .logo {
height: auto !important;
}
#stylizePayment > li .desc {
font-size: calc(0.77rem + 1.1 * ((100vw - 320px) / 780));
line-height: calc(1.1rem + 1.1 * ((100vw - 320px) / 780));
padding: 0 10px;
}
#stylizePayment > li .desc ul li {
padding-left: 8px;
position: relative;
}
#stylizePayment > li .desc ul li:before {
content: " ";
position: absolute;
width: 4px;
height: 4px;
border-radius: 100%;
display: block;
background: #cacaca;
left: 0px;
top: 50%;
transform: translateY(-50%);
}
#stylizePayment > li .desc span {
display: block;
margin-top: -4px;
text-transform: uppercase;
font-size: calc(0.63rem + 0.9 * ((100vw - 320px) / 780));
line-height: calc(0.9rem + 0.9 * ((100vw - 320px) / 780));
color: #e20015;
}
#stylizePayment > li .icons {
position: absolute;
bottom: 10px;
text-align: center;
left: 0px;
right: 0px;
}
#payProgress {
padding: 5% 0;
}
#payProgress .content {
text-align: center;
}
#payProgress .spinner {
margin-bottom: 30px;
}
#payProgress .spinner img {
width: 150px;
animation: rotate 2s infinite linear;
}
#payProgress .payForm {
display: none;
input: disabled;
}
#payProgress .goPay {
color: #96a4bb;
cursor: pointer;
font-weight: 500;
}
#payProgress .goPay:hover {
color: #343f51;
}
@keyframes rotate {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(359deg);
}
}
/* Contact section */
section#contact {
position: relative;
width: 100%;
height: 450px;
margin-top: 70px;
}
section#contact .map {
width: 100%;
height: 450px;
overflow: hidden;
position: absolute;
z-index: -1;
}
section#contact .map::after {
content: " ";
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
display: block;
background: url("../img/map_mask.png");
background-repeat: no-repeat;
background-position: center bottom;
background-size: cover;
}
section#contact .map iframe {
width: 200vw;
height: 450px;
margin-left: -70vw;
}
section#contact .container {
z-index: 20;
}
section#contact .content {
max-width: 600px;
width: 80%;
float: right;
}
section#contact .content .title {
font-size: calc(1.26rem + 1.8 * ((100vw - 320px) / 780));
line-height: calc(1.26rem + 1.8 * ((100vw - 320px) / 780));
font-family: "Oswald", "Arial";
font-weight: 500;
color: #717171;
text-transform: uppercase;
margin-bottom: 26px;
padding-left: 20px;
}
section#contact .content .title::first-line {
font-size: calc(2.1rem + 3 * ((100vw - 320px) / 780)) !important;
line-height: calc(1.95rem + 3 * ((100vw - 320px) / 780)) !important;
color: #323232;
}
section#contact .content .contact-card {
background: #fff;
box-shadow: 2px 2px 25px rgba(0, 0, 0, 0.1);
padding: 35px 30px;
width: 80%;
max-width: 400px;
position: relative;
}
section#contact .content .contact-card .logo {
margin-bottom: 23px;
}
section#contact .content .contact-card .addres {
color: #cacaca;
font-size: calc(0.91rem + 1.3 * ((100vw - 320px) / 780));
line-height: calc(1.3rem + 1.3 * ((100vw - 320px) / 780));
margin-bottom: 22px;
}
section#contact .content .contact-card .addres .txt {
display: inline-block;
vertical-align: middle;
}
section#contact .content .contact-card .icon {
width: 40px;
height: 24px;
display: inline-block;
vertical-align: middle;
background-position: center center;
background-size: contain;
background-repeat: no-repeat;
margin-right: 8px;
}
section#contact .content .contact-card .link {
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.4rem + 1.4 * ((100vw - 320px) / 780));
color: #cacaca;
margin-bottom: 12px;
}
section#contact .content .contact-card .link.addres .icon {
background-image: url("../img/icons/addres.png");
width: 40px;
height: 40px;
display: inline-block;
vertical-align: middle;
}
section#contact .content .contact-card .link.phone .icon {
background-image: url("../img/icons/phone.png");
}
section#contact .content .contact-card .link.mail .icon {
background-image: url("../img/icons/mail.png");
}
section#contact .content .contact-card .link a:hover {
color: #4b4b4b;
}
section#contact .content .contact-card .link a:hover span.icon {
filter: brightness(50%);
}
section#contact .content .contact-card .fb-link {
position: absolute;
top: 35px;
right: 15px;
}
section#contact .content .contact-card .fb-link .icon.fb {
background-image: url("../img/icons/fb.png");
filter: grayscale(100);
opacity: 0.2;
transition: 0.1s all;
}
section#contact .content .contact-card .fb-link .icon.fb:hover {
filter: grayscale(0);
opacity: 1;
}
/* Errors pages */
.pageContent.error {
height: calc(100vh - 300px);
position: relative;
margin-bottom: 0 !important;
}
.pageContent.error .wrapper {
max-width: 800px;
width: 80%;
display: block;
}
.pageContent.error .unavailable-message-container {
display: flex;
flex-direction: column;
align-items: flex-end;
transform: translateY(120px);
}
.pageContent.error .frst_line {
font-family: "Oswald", "Arial";
font-weight: 300;
font-size: calc(2.1rem + 3 * ((100vw - 320px) / 780));
line-height: calc(1.95rem + 3 * ((100vw - 320px) / 780));
margin-right: 10%;
color: #a4a4a4;
text-transform: uppercase;
text-align: center;
display: block;
}
.pageContent.error .sec_line {
font-family: "Oswald", "Arial";
font-weight: 600;
font-size: calc(4.2rem + 6 * ((100vw - 320px) / 780));
line-height: calc(3.9rem + 6 * ((100vw - 320px) / 780));
margin-left: 10%;
text-transform: uppercase;
color: #d4dae3;
text-align: center;
display: block;
}
.pageContent.error .error {
font-family: "Open Sans", "Trebuchet MS";
font-weight: 300;
font-size: calc(25.2rem + 36 * ((100vw - 320px) / 780));
line-height: calc(24.48rem + 36 * ((100vw - 320px) / 780));
color: #f3f4f7;
position: absolute;
bottom: 0px;
right: 0px;
display: block;
z-index: -1 !important;
}
/* Footer */
footer .footer {
width: 100%;
background: #f9fafb url("../img/footer_shadow.png");
background-repeat: repeat-x;
background-position: center top;
padding: 25px 0;
}
footer .footer .title {
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.4rem + 1.4 * ((100vw - 320px) / 780));
text-transform: uppercase;
color: #4b4b4b;
border-bottom: 1.5px solid #4b4b4b;
padding: 2px 5px;
margin-bottom: 10px;
}
footer .footer .foot-content ul {
padding-left: 5px;
}
footer .footer .foot-content ul li {
margin-bottom: 6px;
font-size: calc(0.77rem + 1.1 * ((100vw - 320px) / 780));
line-height: calc(1.1rem + 1.1 * ((100vw - 320px) / 780));
font-weight: normal;
color: #a4a4a4;
}
footer .footer .foot-content ul li a:hover {
color: #4b4b4b;
}
footer .footer .footer-grid {
display: grid;
grid-template-columns: 2fr 1fr 1fr;
grid-gap: 50px;
}
footer .footer .info ul {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
-webkit-column-gap: 20px;
-moz-column-gap: 20px;
column-gap: 20px;
}
footer .footer .client-zone {
text-align: center;
}
footer .footer .client-zone a {
margin: 0 auto;
margin-bottom: 13px;
}
footer .footer .client-zone .desc {
text-align: left;
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1rem + 1 * ((100vw - 320px) / 780));
color: #989898;
font-weight: normal;
margin-top: 5px;
}
footer .footer .btn {
padding: 10px 25px;
font-family: "Oswald", "Arial";
text-transform: uppercase;
width: fit-content;
display: block;
background: #989898;
color: #fff;
margin-bottom: 13px;
font-size: calc(1.12rem + 1.6 * ((100vw - 320px) / 780));
line-height: calc(1.6rem + 1.6 * ((100vw - 320px) / 780));
padding: 15px 25px;
width: calc(100% - 50px);
margin: 0 auto;
}
footer .footer .btn:hover {
background: #8b8b8b;
box-shadow: 0px 2px 0 0px #717171;
}
footer .footer .btn:active {
background: #b1b1b1;
box-shadow: 0px 2px 0 0px #7e7e7e;
}
footer .subFooter {
background: #eeefef;
text-align: center;
height: 32px;
font-size: calc(0.7rem + 1 * ((100vw - 320px) / 780));
line-height: calc(1rem + 1 * ((100vw - 320px) / 780));
font-family: "Open Sans", "Trebuchet MS";
font-weight: 500;
line-height: 32px !important;
color: #8b8b8b;
}
#map {
width: 100%;
height: 600px;
background: #f0f0f0;
}
.shop-notyfications {
position: fixed;
z-index: 999999;
bottom: 0;
left: 0;
}
#simplecookienotification_v01 {
z-index: 99999;
position: relative;
bottom: 20px;
left: 10px;
background: #ffffff;
padding: 10px 15px;
width: 300px;
text-align: center;
line-height: 27px;
box-shadow: 2px 2px 50px rgba(0, 0, 0, 0.05);
border-top: 6px solid #cacaca;
}
#simplecookienotification_v01 #simplecookienotification_v01_powiadomienie {
text-transform: uppercase;
color: #cacaca;
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.4rem + 1.4 * ((100vw - 320px) / 780));
}
#simplecookienotification_v01 #policyCookies {
color: #cacaca;
display: block;
}
#simplecookienotification_v01 span {
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
}
#simplecookienotification_v01 a {
display: inline-block !important;
}
#simplecookienotification_v01 #okbutton {
margin-top: 10px;
background: #cacaca;
color: #fff;
text-transform: uppercase;
padding: 3px 7px;
font-weight: bold;
font-family: "Oswald", "Arial";
font-weight: 500;
display: block !important;
transition: 0.1s all;
}
#simplecookienotification_v01 #okbutton:hover {
background: #b1b1b1;
}
#ua_notification_v01 {
position: relative;
bottom: 0px;
left: 0px;
right: 0px;
min-height: 40px;
padding: 10px 0;
background: #292929;
z-index: 99999;
color: #fff;
box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.4);
}
#ua_notification_v01 > .container {
z-index: 10;
height: 100%;
position: relative;
display: block;
max-width: 1300px;
}
#ua_notification_v01 > .container .infocircle {
width: 50px;
margin-right: 10px;
min-height: 50px;
height: 100%;
display: inline-block;
vertical-align: middle;
background: url("../img/info_circle.png") no-repeat center center;
background-size: contain;
}
#ua_notification_v01 > .container .content {
display: inline-block;
vertical-align: middle;
vertical-align: middle;
font-size: 12pt;
width: calc(100% - 85px);
}
#ua_notification_v01 > .container .content > span {
display: block;
font-family: "Oswald", "Arial";
}
#ua_notification_v01 > .container .content .maintxt {
font-size: calc(1.12rem + 1.6 * ((100vw - 320px) / 780));
line-height: calc(1.28rem + 1.6 * ((100vw - 320px) / 780));
}
#ua_notification_v01 > .container .content .sign {
font-size: calc(0.98rem + 1.4 * ((100vw - 320px) / 780));
line-height: calc(1.4rem + 1.4 * ((100vw - 320px) / 780));
color: #d4eef8;
font-weight: light;
font-style: italic;
}
#ua_notification_v01 > .container .content a {
background: #434343;
color: #fff;
text-align: center;
text-transform: uppercase;
font-weight: bold;
margin: 2px 4px;
padding: 0 10px;
font-family: "Oswald", "Arial";
font-weight: 500;
font-size: 12pt;
transition: 0.1s all;
line-height: 18px;
white-space: nowrap;
}
#ua_notification_v01 > .container .content a:hover {
background: #828282;
}
#ua_notification_v01 .gfx {
position: relative;
display: inline-block;
vertical-align: middle;
width: 60px;
margin-right: 20px;
}
#ua_notification_v01 .gfx img {
max-width: 100%;
}
.wip_info {
position: fixed;
left: 0px;
right: 0px;
top: 50%;
transform: translateY(-50%);
width: 100%;
max-width: 1200px;
background: #f9f9f9;
display: block;
border: 4px solid #e20015;
z-index: 999;
text-align: center;
color: #e20015;
padding: 80px 0;
font-weight: bold;
margin: 0 auto;
}
.wip_info button {
margin-top: 13px;
background: #e20015;
border: none;
color: #fff;
font-size: 20px;
}
.service_info {
position: fixed;
right: 20px;
bottom: 20px;
width: 420px;
max-width: calc(100% - 70px);
background: #f9f9f9;
display: block;
border: 4px solid #e20015;
z-index: 999;
text-align: center;
color: #4b4b4b;
padding: 30px 10px;
font-weight: bold;
margin: 0 auto;
}
.service_info h2 {
font-weight: bold;
color: #e20015;
text-transform: uppercase;
}
.service_info h3 {
margin-bottom: 13px;
}
.service_info p {
font-size: calc(0.77rem + 1.1 * ((100vw - 320px) / 780));
line-height: calc(1.21rem + 1.1 * ((100vw - 320px) / 780));
font-weight: 300;
text-align: left;
margin-bottom: 13px;
}
.service_info button {
margin-top: 13px;
background: #e20015;
border: none;
color: #fff;
padding: 3px 7px;
cursor: pointer;
text-transform: uppercase;
font-size: calc(0.84rem + 1.2 * ((100vw - 320px) / 780));
line-height: calc(1.2rem + 1.2 * ((100vw - 320px) / 780));
}
.rs-panel, .rs-panel-group {
margin-bottom: 17px;
background: #fff;
}
.rs-panel h5, .rs-panel-group h5 {
margin-bottom: 12px !important;
}
.rs-form .rs-input,
.rs-form .rs-input-group,
.rs-form .rs-picker-input {
background-color: #FBFBFB;
}
.rs-form .rs-input:not(.auto-width),
.rs-form .rs-input-group:not(.auto-width),
.rs-form .rs-picker-input:not(.auto-width) {
width: 100% !important;
}
.rs-form .rs-input .rs-input-group-addon,
.rs-form .rs-input-group .rs-input-group-addon,
.rs-form .rs-picker-input .rs-input-group-addon {
background: #eeeeee;
}
.rs-form .rs-input .rs-picker-toggle,
.rs-form .rs-input-group .rs-picker-toggle,
.rs-form .rs-picker-input .rs-picker-toggle {
background-color: #FBFBFB !important;
}
.rs-form .rs-input:focus, .rs-form .rs-input:hover, .rs-form .rs-input.rs-picker-focused,
.rs-form .rs-input-group:focus,
.rs-form .rs-input-group:hover,
.rs-form .rs-input-group.rs-picker-focused,
.rs-form .rs-picker-input:focus,
.rs-form .rs-picker-input:hover,
.rs-form .rs-picker-input.rs-picker-focused {
border-color: #e20015 !important;
}
.rs-form .rs-control-label {
margin-bottom: 0;
}
.rs-form .rs-form-control-wrapper {
margin-bottom: 6px;
}
.rs-form .rs-form-control-wrapper.read-only {
filter: brightness(1.07);
}
.rs-form .form-control-wrapper {
margin-bottom: 13px;
max-width: 420px;
}
.centerLogoCont {
display: flex !important;
justify-content: center;
align-items: center;
}
.centerLogoCont .universalLogoCont {
display: flex;
justify-content: center;
align-items: center;
}
.centerLogoCont .universalLogoCont .logo {
transform: scale(1.5);
}
@keyframes mx-shine {
0% {
left: -80%;
}
100% {
left: 130%;
}
}
@keyframes mx-pulse {
0%, 100% {
opacity: 1;
}
50% {
opacity: 0.65;
}
}
@keyframes mx-glow {
0%, 100% {
box-shadow: 0 -3px 20px rgba(0, 0, 0, 0.45);
}
50% {
box-shadow: 0 -3px 28px rgba(204, 0, 0, 0.45), 0 -3px 8px rgba(204, 0, 0, 0.3);
}
}
#mx-bar {
position: sticky;
bottom: 0;
z-index: 50;
padding: 20px;
background: #cc0000;
border-top: 3px solid #cc0000;
display: flex;
align-items: center;
gap: 0;
font-family: "Segoe UI", Arial, sans-serif;
font-size: 13px;
color: #ddd;
transition: transform 0.3s ease;
animation: mx-glow 3s ease-in-out infinite;
}
@media (max-width: 560px) {
#mx-bar {
bottom: 40px;
}
}
#mx-bar.mx-hidden {
transform: translateY(110%);
}
#mx-bar .mx-stripe {
background: #cc0000;
align-self: stretch;
display: flex;
align-items: center;
justify-content: center;
padding: 0 12px;
font-size: 40px;
flex-shrink: 0;
animation: mx-pulse 3s ease-in-out infinite;
}
@media (max-width: 680px) {
#mx-bar .mx-stripe {
padding: 12px 16px;
font-size: 28px;
}
}
#mx-bar .mx-body {
flex: 1;
padding: 13px 20px;
min-width: 0;
}
@media (max-width: 680px) {
#mx-bar .mx-body {
padding: 10px 14px;
flex: 1;
}
}
#mx-bar .mx-title {
font-size: 16px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.08em;
color: #fff;
margin-bottom: 4px;
}
@media (max-width: 680px) {
#mx-bar .mx-title {
font-size: 14px;
}
}
#mx-bar .mx-desc {
font-size: 14px;
color: #f8e7e7;
line-height: 1.5;
font-weight: 400;
}
#mx-bar .mx-desc strong {
color: #ffffff;
font-weight: 600;
}
@media (max-width: 680px) {
#mx-bar .mx-desc {
font-size: 12px;
}
}
#mx-bar .mx-badge {
display: inline-block;
background: #cc0000;
color: #fff;
font-size: 11px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.05em;
padding: 2px 8px;
border-radius: 2px;
margin-left: 5px;
vertical-align: middle;
white-space: nowrap;
}
#mx-bar .mx-actions {
display: flex;
align-items: center;
gap: 0;
flex-shrink: 0;
align-self: stretch;
}
@media (max-width: 680px) {
#mx-bar .mx-actions {
align-self: auto;
border-top: 1px solid rgba(255, 255, 255, 0.1);
}
}
#mx-bar .mx-sep {
width: 1px;
background: rgba(255, 255, 255, 0.1);
align-self: stretch;
}
@media (max-width: 680px) {
#mx-bar .mx-sep {
display: none;
}
}
#mx-bar .mx-btn {
display: inline-flex;
align-items: center;
gap: 7px;
background: #a01f24;
color: #fff !important;
font-family: inherit;
font-size: 13px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.1em;
text-decoration: none !important;
padding: 0 28px;
align-self: stretch;
border: none;
cursor: pointer;
white-space: nowrap;
border-left: 1px solid rgba(255, 255, 255, 0.08);
position: relative;
overflow: hidden;
transition: background 0.18s;
}
#mx-bar .mx-btn::after {
content: "";
position: absolute;
top: 0;
left: -80%;
width: 70%;
height: 100%;
background: linear-gradient(100deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.28) 65%, rgba(255, 255, 255, 0) 85%, rgba(255, 255, 255, 0) 100%);
animation: mx-shine 3s ease-in-out infinite;
pointer-events: none;
}
#mx-bar .mx-btn:hover {
background: #73070b;
}
#mx-bar .mx-btn .mx-arrow {
font-style: normal;
font-size: 15px;
transition: transform 0.18s;
}
#mx-bar .mx-btn:hover .mx-arrow {
transform: translateX(4px);
}
@media (max-width: 680px) {
#mx-bar .mx-btn {
flex: 1;
justify-content: center;
padding: 13px 16px;
font-size: 11px;
}
}
#mx-bar .mx-close {
background: transparent;
border: none;
border-left: 1px solid rgba(255, 255, 255, 0.08);
color: #f8e7e7;
font-size: 16px;
width: 48px;
align-self: stretch;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
transition: color 0.15s, background 0.15s;
}
#mx-bar .mx-close:hover {
color: #fff;
background: rgba(255, 255, 255, 0.07);
}
@media (max-width: 680px) {
#mx-bar .mx-close {
width: 52px;
border-left: 1px solid rgba(255, 255, 255, 0.1);
}
}
@media (max-width: 680px) {
#mx-bar {
flex-direction: column;
align-items: stretch;
}
}