/*
Theme Name: Dinotte
Theme URI: https://dinotte.md/
Author: 2Bros Agency
Author URI: https://2bros.agency
Description:
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: dinotte
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready
*/
/* ============================================== */
/* ================ general styles ============== */
/* ============================================== */
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400..700;1,400..700&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
:root {
/* Fonts */
--primary-font: "Montserrat", sans-serif;
--secondary-font: "Lora", serif;
/* Colors */
--black-color: #010101;
--white-color: #fff;
--gray-color: #E4E2DF;
--purple-color: #000000;
--main-color: #010101;
--hover-color: #D9D9D9;
--bg-color: #F6F6F6;
/* Transition */
--basic-transition: all 0.3s ease;
/* Transition */
--transform-Y50: translateY(-50%);
--transform-X50: translateX(-50%);
--transform-50-50: translate(-50%, -50%);
/* Border */
--border-basic: 1.5px solid;
/* Border Radius */
--border-r-5: 5px;
--border-r-10: 10px;
--border-r-12: 12px;
--border-r-15: 15px;
--border-r-20: 20px;
--border-r-25: 25px;
--border-r-30: 30px;
--border-r-50: 50px;
--border-r-100: 100px;
/* Dimension */
--width-100: 100%;
--height-100: 100%;
/* Gap */
--gap-10-clamp: 5px 10px;
--gap-15-clamp: 5px 15px;
--gap-20-clamp: 15px 20px;
--gap-25-clamp: 15px 25px;
--gap-30-clamp: 15px 30px;
--gap-50-clamp: 15px 50px;
--gap-70-clamp: 15px 70px;
--gap-90-clamp: 15px 90px;
--gap-100-clamp: 15px 100px;
--gap-120-clamp: 15px 120px;
--gap-180-clamp: 15px 180px;
--gap-200-clamp: 15px 200px;
/* Font Size */
--font-h1-clamp: 32px 72px;
--font-h2-clamp: 26px 40px;
--font-h3-clamp: 18px 32px;
--font-h4-clamp: 16px 20px;
--font-h5-clamp: 14px 18px;
--font-p-clamp: 14px 16px;
--font-nav-clamp: 12px 14px;
--font-marque-clamp: 18px 24px;
--font-footer-link-clamp: 20px 28px;
/* Space / Margin / Padding */
--s-15-clamp: 15px 15px;
--s-20-clamp: 15px 20px;
--s-25-clamp: 15px 25px;
--s-30-clamp: 15px 30px;
--s-35-clamp: 15px 35px;
--s-40-clamp: 15px 40px;
--s-50-clamp: 15px 50px;
--s-70-clamp: 35px 70px;
--s-120-clamp: 15px 120px;
}
html {
-webkit-text-size-adjust: 100%;
}
body {
font-family: var(--primary-font);
color: var(--main-color);
font-size: var(--font-p-clamp);
font-weight: 400;
margin: 0;
padding: 0;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
}
main {
display: block;
}
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0;
padding: 0;
font-weight: normal;
line-height: normal;
}
h1,
h2,
h3{
font-family: var(--primary-font);
}
figure,
img {
padding: 0;
margin: 0;
}
img {
vertical-align: middle;
border-style: none;
}
a:hover {
text-decoration: none;
}
a {
color: var(--main-color);
transition: all 0.2s ease-in;
}
p {
padding: 0;
margin: 0;
line-height: 2;
}
button,
input,
select,
textarea {
font-family: var(--primary-font);
}
.btn:focus,
.btn:active,
a:focus,
a:active,
input:focus,
input:active,
textarea:focus,
textarea:active,
select:focus,
select:active,
button:focus,
button:active,
span:focus,
span:active {
outline: 0;
box-shadow: none;
}
*,
::after,
::before {
box-sizing: border-box;
}
/* Helper Styles */
.site-container {
max-width: 1440px;
width: 100%;
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
.site-row {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;
}
.site-align-center{
align-items: center;
justify-content: center;
}
.site-col-12 {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.site-col-11 {
-ms-flex: 0 0 91.666667%;
flex: 0 0 91.666667%;
max-width: 91.666667%;
}
.site-col-10 {
-ms-flex: 0 0 83.333333%;
flex: 0 0 83.333333%;
max-width: 83.333333%;
}
.site-col-9 {
-ms-flex: 0 0 75%;
flex: 0 0 75%;
max-width: 75%;
}
.site-col-8 {
-ms-flex: 0 0 66.666667%;
flex: 0 0 66.666667%;
max-width: 66.666667%;
}
.site-col-7 {
-ms-flex: 0 0 58.333333%;
flex: 0 0 58.333333%;
max-width: 58.333333%;
}
.site-col-6 {
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.site-col-5 {
-ms-flex: 0 0 41.666667%;
flex: 0 0 41.666667%;
max-width: 41.666667%;
}
.site-col-4 {
-ms-flex: 0 0 33.333333%;
flex: 0 0 33.333333%;
max-width: 33.333333%;
}
.site-col-3 {
-ms-flex: 0 0 25%;
flex: 0 0 25%;
max-width: 25%;
}
.site-col-2 {
-ms-flex: 0 0 16.666667%;
flex: 0 0 16.666667%;
max-width: 16.666667%;
}
.site-col-1 {
-ms-flex: 0 0 8.333333%;
flex: 0 0 8.333333%;
max-width: 8.333333%;
}
.site-col-1,
.site-col-2,
.site-col-3,
.site-col-4,
.site-col-5,
.site-col-6,
.site-col-7,
.site-col-8,
.site-col-9,
.site-col-10,
.site-col-11,
.site-col-12 {
position: relative;
width: 100%;
padding-right: 15px;
padding-left: 15px;
}
.site-col-offset-4 {
margin-left: 33.333333%;
}
.site-col-offset-3 {
margin-left: 25%;
}
.site-col-offset-2 {
margin-left: 16.666667%;
}
.site-col-offset-1 {
margin-left: 8.333333%;
}
.img-fluid {
max-width: 100%;
height: auto;
}
/* Site Headings */
.text-center {
justify-content: center;
text-align: center;
}
.text-right {
text-align: right;
justify-content: flex-end;
}
.text-left {
text-align: left;
justify-content: flex-start;
}
.site-heading-white {
color: var(--white-color);
}
.site-heading p {
margin-top: 20px;
font-weight: 400;
margin-bottom: 16px;
}
.site-heading p:last-of-type {
margin-bottom: 0;
}
.site-heading h2 {
font-size: var(--font-h2-clamp);
font-weight: 500;
}
.site-heading h3 {
font-size: var(--font-h3-clamp);
}
.site-heading h4 {
font-size: 26px;
font-weight: 300;
text-transform: uppercase
}
.site-heading h5 {
font-size: 16px;
font-weight: 500;
margin-bottom: 15px;
color: var(--main-color);
text-transform: uppercase;
}
.site-heading h2 strong{
font-weight: 400;
color: var(--main-color);
}
.site-heading div {
display: inline-flex;
background-color: var(--red-color);
border-radius: 5px;
}
/* Site Buttons */
.custom-button{
display: flex;
}
.site-button {
position: relative;
display: inline-block;
}
.btn,
.site-button a{
cursor: pointer;
height: 50px;
display: flex;
padding: 0 25px;
align-items: center;
text-decoration: none;
justify-content: center;
border-radius: var(--border-r-5);
transition: var(--basic-transition);
background-color: var(--main-color);
}
.btn span,
.site-button a span{
font-size: 13px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
color: var(--white-color);
}
.btn:hover,
.site-button a:hover{
background-color: #333333;
}
/* Sections Spacing */
.site-row-p20x {
padding-top: 20px;
padding-bottom: 20px;
}
.site-row-pt20x {
padding-top: 20px;
}
.site-row-pb20x {
padding-bottom: 20px;
}
.site-row-p25x {
padding-top: var(--s-25-clamp);
padding-bottom: var(--s-25-clamp);
}
.site-row-pt25x {
padding-top: var(--s-25-clamp);
}
.site-row-pb25x {
padding-bottom: var(--s-25-clamp);
}
.site-row-p30x {
padding-top: var(--s-30-clamp);
padding-bottom: var(--s-30-clamp);
}
.site-row-pt30x {
padding-top: var(--s-30-clamp);
}
.site-row-pb30x {
padding-bottom: var(--s-30-clamp);
}
.site-row-p35x {
padding-top: 35px;
padding-bottom: 35px;
}
.site-row-pt35x {
padding-top: 35px;
}
.site-row-pb35x {
padding-bottom: 35px;
}
.site-row-p45x {
padding-top: 45px;
padding-bottom: 45px;
}
.site-row-pt45x {
padding-top: 45px;
}
.site-row-pb45x {
padding-bottom: 45px;
}
.site-row-p50x {
padding-top: var(--s-50-clamp);
padding-bottom: var(--s-50-clamp);
}
.site-row-pt50x {
padding-top: var(--s-50-clamp);
}
.site-row-pb50x {
padding-bottom: var(--s-50-clamp);
}
.site-row-p40x {
padding-top: 40px;
padding-bottom: 40px;
}
.site-row-pt40x {
padding-top: 40px;
}
.site-row-pb40x {
padding-bottom: 40px;
}
.site-row-p70x {
padding-top: var(--s-70-clamp);
padding-bottom: var(--s-70-clamp);
}
.site-row-pt70x {
padding-top: var(--s-70-clamp);
}
.site-row-pb70x {
padding-bottom: var(--s-70-clamp);
}
.site-row-p100x {
padding-top: 100px;
padding-bottom: 100px;
}
.site-row-pt100x {
padding-top: 100px;
}
.site-row-pb100x {
padding-bottom: 100px;
}
.site-row-p150x {
padding-top: 150px;
padding-bottom: 150px;
}
.site-row-pt150x {
padding-top: 150px;
}
.site-row-pb150x {
padding-bottom: 150px;
}
.site-row-p140x {
padding-top: 140px;
padding-bottom: 140px;
}
.site-row-pt140x {
padding-top: 140px;
}
.site-row-pb140x {
padding-bottom: 140px;
}
.site-row-p180x {
padding-top: 180px;
padding-bottom: 180px;
}
.site-row-pt180x {
padding-top: 180px;
}
.site-row-pb180x {
padding-bottom: 180px;
}
.site-row-p200x {
padding-top: 200px;
padding-bottom: 200px;
}
.site-row-pt200x {
padding-top: 200px;
}
.site-row-pb200x {
padding-bottom: 200px;
}
/* Separator */
.block-separator{
width: 100%;
height: 1px;
display: inline-block;
background-color: #dedede;
}
/* VC Styles */
.wpb_button,
.wpb_content_element,
ul.wpb_thumbnails-fluid>li {
margin-bottom: 0 !important;
}
.vc_col-has-fill>.vc_column-inner,
.vc_row-has-fill+.vc_row-full-width+.vc_row>.vc_column_container>.vc_column-inner,
.vc_row-has-fill+.vc_row>.vc_column_container>.vc_column-inner,
.vc_row-has-fill>.vc_column_container>.vc_column-inner {
padding-top: 0 !important;
}
.vc_section.vc_section-has-fill,
.vc_section.vc_section-has-fill+.vc_row-full-width+.vc_section,
.vc_section.vc_section-has-fill+.vc_section {
padding-top: 0 !important;
}
.wpb_text_column h1,
.wpb_text_column h2,
.wpb_text_column h3,
.wpb_text_column h4,
.wpb_text_column h5,
.wpb_text_column h6 {
font-weight: 600;
margin-bottom: 15px;
}
.wpb_text_column h4{
font-size: 32px;
}
.wpb_text_column p {
margin-bottom: 15px;
}
.wpb_text_column p strong {
color: var(--main-color);
font-weight: 600 !important;
}
.wpb_text_column iframe {
width: 100% !important;
height: 500px !important;
}
.wpb_text_column ul,
.wpb_text_column ol {
padding: 0 0 0 15px;
margin: 0 0 10px 0;
}
.wpb_text_column ul li,
.wpb_text_column ol li {
margin-bottom: 5px;
line-height: 2;
}
.wpb_text_column p a,
.wpb_text_column li a {
color: #313132;
text-decoration: underline;
}
.wpb_text_column .wp-video {
width: 100% !important;
}
/* 404 Page Styles */
.no-result-page {
text-align: center;
padding-top: 70px;
padding-bottom: 70px;
background-color: #F9F9F9;
}
.no-result-page h1 {
font-size: var(--font-h2-clamp);
margin: 0 0 25px 0;
}
.no-result-page p {
margin-bottom: 25px;
}
.no-result-page .site-button-dark {
margin-top: 35px;
justify-content: center;
}
.no-result-page img{
height: 50px;
margin-bottom: 20px;
}
/* CF7 Styles */
.wpcf7-spinner {
display: none;
}
.wpcf7-response-output {
display: none;
}
.wpcf7 .sent .wpcf7-response-output {
font-size: 14px;
display: block;
position: absolute;
left: 0;
right: 0;
text-align: center;
padding: 10px 0 0 0;
}
.wpcf7-not-valid-tip {
font-size: 14px;
position: absolute;
left: auto;
right: 0;
}
.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output .wpcf7 form .wpcf7-response-output {
padding: 0;
margin: 0;
border: none;
}
/* Shop Messages */
.woocommerce-info {
border: none;
padding: 0;
margin: 0;
background-color: transparent;
}
.woocommerce-error::before,
.woocommerce-info::before,
.woocommerce-message::before {
content: none;
}
/* ============================================== */
/* ================ header styles =============== */
/* ============================================== */
/* Top Navigation */
.top-bar{
padding: 15px 0;
background-color: var(--white-color);
border-bottom: 1px solid rgba(1, 1, 1, 0.10);
}
.top-bar-holder{
display: flex;
align-items: center;
justify-content: space-between;
}
.top-bar-nav ul{
display: flex;
margin: 0;
padding: 0;
list-style: none;
align-items: center;
}
.top-bar-nav ul li{
margin-right: 5px;
}
.top-bar-nav ul li:last-of-type{
margin-right: 0;
}
.top-bar-nav ul li a svg{
width: 15px;
height: 15px;
}
.top-bar-nav ul li a svg path{
fill: #5869DA;
}
.top-bar-nav ul li a{
color: #5869DA;
display: flex;
align-items: center;
justify-content: center;
gap: 5px;
font-size: 14px;
font-weight: 500;
text-decoration: none;
}
.top-bar-call a{
color: #5869DA;
gap: 10px;
font-size: 14px;
font-weight: 500;
display: flex;
align-items: center;
text-decoration: none;
justify-content: center;
}
.top-bar-call a svg path{
fill: #5869DA;
}
.top-bar-call a svg{
width: 14px;
height: 14px;
animation: pulseScale 1.5s ease-in-out infinite;
transform-origin: center;
}
@keyframes pulseScale {
0%, 100% {
transform: scale(1);
opacity: 1;
}
50% {
transform: scale(1.15);
opacity: 0.85;
}
}
/* Main Navigation */
.main-header{
position: relative;
}
.main-nav{
padding: 15px 0;
background-color: var(--white-color);
}
.nav-holder{
display: flex;
align-items: center;
}
.nav-logo{
display: flex;
justify-content: flex-start;
}
.nav-logo a{
display: block;
}
.nav-logo img{
width: auto;
height: 35px;
}
.nav-menu {
display: flex;
align-items: center;
}
.nav-menu ul {
display: flex;
align-items: center;
margin: 0;
padding: 0;
list-style: none;
}
.nav-menu ul li {
position: relative;
display: flex;
padding: 0;
margin-left: 15px;
align-items: center;
}
.nav-menu ul li.red-nav a:hover{
color: #ff0200;
}
.nav-menu ul li a {
position: relative;
font-size: var(--font-nav-clamp);
padding: 0;
font-weight: 500;
text-decoration: none;
color: var(--font-color);
}
.nav-menu ul li a:hover{
color: #5869DA;
}
.nav-call a{
font-size: 16px;
font-weight: 500;
display: flex;
align-items: center;
}
.nav-call a::before{
display: inline-block;
content: '';
width: 20px;
height: 20px;
margin-right: 10px;
background-repeat: no-repeat;
background-image: url('assets/images/phone_icon.svg');
}
.nav-call,
.nav-tools{
display: flex;
align-items: center;
}
.nav-search{
padding-right: 15px;
border-right: var(--border-basic) var(--black-color);
}
.nav-search a{
display: flex;
}
.nav-search svg{
width: auto;
height: 18px;
}
.nav-tools{
gap: 15px;
margin-left: auto;
justify-content: flex-end;
}
.nav-lang a{
font-size: 14px;
font-weight: 500;
padding: 5px 10px;
display: flex;
border-radius: 10px;
align-items: center;
justify-content: center;
text-transform: uppercase;
border: 1px solid var(--border-color);
}
.nav-cart{
display: block;
position: relative;
}
.nav-cart a{
cursor: pointer;
display: flex;
align-items: center;
gap: 10px;
}
.nav-cart span{
display: flex;
font-size: 15px;
font-weight: 500;
}
.nav-cart a svg {
width: 20px;
height: 20px;
}
/* MegaMenu */
/*
.nav-menu ul .nav-categories {
padding: 10px 15px;
border-radius: 8px;
background: #111;
transition: var(--basic-transition);
}
.nav-menu ul .nav-categories a {
cursor: pointer;
color: #fff;
font-weight: 500;
display: flex;
align-items: center;
justify-content: center;
text-decoration: none;
}
.nav-menu ul .nav-categories a svg {
width: auto;
height: 20px;
margin-right: 10px;
margin-left: 0;
}
*/
.nav-menu ul .nav-categories a svg{
display: none;
}
.nav-menu ul .nav-categories:hover {
transition: var(--basic-transition);
}
.nav-menu ul .nav-categories a::before {
content: none;
}
.menu-dropdown {
position: absolute;
top: auto;
width: 100%;
height: auto;
z-index: 8;
visibility: hidden;
opacity: 0;
transition: all 0.3s ease;
}
.menu-dropdown .dropdown-inner {
position: relative;
display: flex;
padding: 0;
border-radius: 0;
background-color: transparent;
}
.menu-dropdown .dropdown-inner ul.menu-category {
padding: 20px;
border-right: 1px solid #D9D9D9;
margin: 0;
width: 25%;
list-style: none;
background-color: #ffffff;
-webkit-box-shadow: 0 2px 10px rgba(54, 54, 54, 0.15);
box-shadow: 0 2px 10px rgba(54, 54, 54, 0.15);
}
.menu-dropdown .dropdown-inner ul.menu-category li.menu-item{
margin-bottom: 15px;
}
.menu-dropdown .dropdown-inner ul.menu-category li.menu-item:last-of-type{
margin: 0;
}
.menu-dropdown .dropdown-inner ul.menu-category li.menu-item>a:first-of-type,
.menu-dropdown .dropdown-inner ul.menu-category li.menu-item.menu-item-has-children>a:first-of-type {
color: var(--font-color);
font-size: var(--font-nav-clamp);
font-weight: 500;
position: relative;
display: block;
width: 100%;
padding-right: 10px;
text-decoration: none;
}
.menu-dropdown .dropdown-inner ul.menu-category li > a:first-of-type img{
width: 30px;
height: auto;
margin-right: 10px;
}
.menu-dropdown .dropdown-inner ul.menu-category li.menu-item.menu-item-has-children>a:first-of-type:before {
position: absolute;
content: '';
top: 50%;
right: 0;
width: 6px;
height: 11px;
transform: translateY(-50%);
background-image: url('data:image/svg+xml,');
background-repeat: no-repeat;
}
.menu-dropdown .dropdown-inner ul.menu-category li.menu-item.menu-item-has-children:hover ul.submenu{
visibility: visible;
opacity: 1;
}
.menu-dropdown .dropdown-inner ul.submenu{
visibility: hidden;
opacity: 0;
position: absolute;
width: 25%;
height: 100%;
top: 0;
left: 25%;
margin: 0;
padding: 20px;
list-style: none;
transition-delay: 100ms;
transition: all 0.3s ease;
background-color: #ffffff;
}
.menu-dropdown .dropdown-inner ul.submenu h4{
font-size: 18px;
font-weight: 500;
margin-bottom: 15px;
color: #000;
}
.menu-dropdown .dropdown-inner ul.submenu h4 a{
color: var(--main-color);
text-decoration: none;
}
.menu-dropdown .dropdown-inner ul.submenu li{
margin-bottom: 10px;
}
.menu-dropdown .dropdown-inner ul.submenu li:last-of-type{
margin: 0;
}
.menu-dropdown .dropdown-inner ul.submenu li a{
color: var(--font-color);
font-size: var(--font-nav-clamp);
font-weight: 500;
text-decoration: none;
}
.menu-dropdown .dropdown-inner ul.submenu li a:hover{
color: #000;
}
/* Main Navigation Dropdown */
.nav-menu ul li.menu-item-has-children>a {
padding-right: 15px;
}
.nav-menu ul li.menu-item-has-children>a::after {
position: absolute;
top: 50%;
right: 0;
left: auto;
content: '';
width: 11px;
height: 6px;
transform: var(--transform-Y50);
display: inline-block;
background-size: contain;
background-repeat: no-repeat;
background-color: transparent;
background-position: center center;
background-image: url('data:image/svg+xml,');
}
.nav-menu ul li.menu-item-has-children .sub-menu {
display: block;
padding: 15px 20px;
margin: 0;
position: absolute;
top: 40px;
left: 0;
width: 270px;
z-index: 9;
border-radius: var(--border-r-10);
background-color: var(--white-color);
-webkit-transition: all .4s ease-in-out;
-moz-transition: all .4s ease-in-out;
-ms-transition: all .4s ease-in-out;
-o-transition: all .4s ease-in-out;
transition: all .4s ease-in-out;
visibility: hidden;
opacity: 0;
-webkit-box-shadow: 0 0 20px 0 rgb(0 0 0 / 6%);
box-shadow: 0 0 20px 0 rgb(0 0 0 / 6%);
}
.nav-menu ul li.menu-item-has-children .sub-menu li {
padding: 0;
display: block;
margin: 0 0 10px 0;
}
.nav-menu ul li.menu-item-has-children .sub-menu li:last-of-type {
margin-bottom: 0;
}
.nav-menu ul li.menu-item-has-children .sub-menu li a {
margin: 0;
padding: 0;
background-color: transparent
}
.nav-menu ul li.menu-item-has-children .sub-menu li a::before{
content: none;
}
.nav-menu ul li.menu-item-has-children .sub-menu li a:hover{
color: var(--main-color);
opacity: .5;
}
.nav-menu ul li.menu-item-has-children:hover .sub-menu {
opacity: 1;
visibility: visible;
}
/* Search */
.search-header{
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9;
display: none;
background-color: var(--white-color);
}
.search-header-holder{
height: 100%;
display: flex;
align-items: center;
justify-content: center;
background-color: #ffffff;
border-bottom: 1px solid #E1E1E1;
}
.search-form{
width: 60%;
margin: 0 auto;
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.search-close{
cursor: pointer;
position: absolute;
right: 0;
width: 50px;
height: 100%;
z-index: 9;
display: flex;
align-items: center;
justify-content: center;
}
.search-close::before,
.search-close::after{
position: absolute;
content: ' ';
height: 20px;
width: 1.5px;
background-color: #1C1C1F;
}
.search-close::before{
transform: rotate(45deg);
}
.search-close::after{
transform: rotate(-45deg);
}
.search-header form{
width: 100%;
}
.search-header form input:focus{
border-color: var(--hover-color);
}
.search-header form input{
height: 45px;
border-radius: 0;
line-height: 45px;
color: #252A2F;
font-size: 15px;
font-weight: 500;
width: 100%;
border: none;
box-shadow: none;
outline: 0;
padding: 0 15px;
border-radius: 10px;
background-color: #F9F9F9;
border: 1px solid #E1E1E1;
}
.search-content{
padding-bottom: 70px;
}
.search-content ul.products{
grid-template-columns: repeat(4, 1fr) !important;
}
body.search-results{
background-color: #F9F9F9;
}
/* Mini Cart */
.cart-close{
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
width: 30px;
height: 30px;
text-align: center;
border-radius: 50px;
background-color: #111111;
}
.cart-close::before,
.cart-close::after{
position: absolute;
content: ' ';
height: 13px;
width: 1.5px;
background-color: #ffffff;
}
.cart-close::before{
transform: rotate(45deg);
}
.cart-close::after{
transform: rotate(-45deg);
}
.mini-cart{
position: fixed;
right: 0;
top: 0;
bottom: 0;
width: 100%;
max-width: 500px;
background-color: #ffffff;
z-index: 11;
transform: none;
transform: translate3d(100%,0,0);
transition: transform .4s cubic-bezier(.19,1,.22,1);
}
.mini-cart-active .mini-cart{
transform: none;
}
body.cart-open{
overflow: hidden;
}
.cart-open .site-overlay{
opacity: 1;
visibility: visible;
}
.mini-cart-inner{
display: flex;
flex-direction: column;
position: relative;
height: 100%;
padding: 20px 20px 0 20px;
overflow-y: scroll;
}
.mini-cart-header{
display: flex;
position: relative;
align-items: center;
justify-content: space-between;
}
.mini-cart-title h3{
font-size: 24px;
font-weight: 500;
}
.mini-cart-content{
display: flex;
height: 100%;
}
.mini-cart-content .widget_shopping_cart_content{
position: relative;
display: flex;
height: 100%;
width: 100%;
flex-direction: column;
}
.empty.widget_shopping_cart_content{
align-items: center;
justify-content: center;
}
.mini-cart-content .woocommerce-mini-cart__empty-message:before{
position: absolute;
top: 40%;
left: 0;
right: 0;
width: 100%;
margin: 0 auto;
transform: translateY(-50%);
content: ' ';
height: 60px;
width: 60px;
background-size: contain;
background-repeat: no-repeat;
background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 21 20'%3E%3Cpath d='M18.78 9h-3.6C14.45 9 14 8.63 14 8s.42-1 1.16-1h4.7a1 1 0 0 1 1.08 1.34c-.55 3-1.09 6-1.64 9a3 3 0 0 1-3.15 2.62h-10c-2.13 0-3.17-.89-3.54-3-.514-2.887-1.034-5.77-1.56-8.65a1 1 0 0 1 1.12-1.35h8.1c.4-1.22.81-2.43 1.21-3.64.18-.53.35-1.07.54-1.61a1 1 0 1 1 1.89.64c-.63 1.94-1.28 3.88-1.93 5.82a1 1 0 0 1-1.13.78H3.21c.28 1.54.55 3 .82 4.54.2 1.1.4 2.2.59 3.29.17.91.45 1.16 1.38 1.16h10.05c.84 0 1.15-.24 1.3-1.07.48-2.57.95-5.15 1.43-7.87Z' fill='%23E1E1E1'%3E%3C/path%3E%3C/svg%3E");
}
.mini-cart-content p{
font-size: 16px;
font-weight: 400;
color: var(--neutral-grey-60);
}
.mini-cart-content .ic-mini-cart-count-price .ic-custom-render-total{
margin-top: 10px;
color: #999999;
font-size: 14px;
font-weight: 600;
}
.mini-cart-content ul{
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 25px 0 25px 0 !important;
margin: 0 0 auto 0 !important;
list-style: none;
}
.mini-cart-content ul li{
position: relative;
display: flex;
padding: 0 0 15px 0 !important;
justify-content: space-between;
width: 100%;
margin-bottom: 15px !important;
border-bottom: 1px solid #dedede;
}
.mini-cart-content ul>li a:last-of-type{
color: #1C1C1F;
font-size: 15px;
font-weight: 600;
display: block;
margin-bottom: 0;
text-decoration: none;
}
.mini-cart-content ul li:last-of-type{
margin-bottom: 0 !important;
border-bottom: none;
padding: 0 !important;
}
.mini-cart-content ul li a.remove:hover{
color: #7D8493 !important;
background-color: transparent !important;
}
.mini-cart-content ul li a.remove svg{
width: 15px;
height: 15px;
}
.mini-cart-content ul li img{
padding: 0;
margin: 0 10px 0 0 !important;
float: left !important;
object-fit: contain !important;
height: auto !important;
width: 70px !important;
border-radius: 12px;
background-color: #F9F9F9;
object-position: center center !important;
}
.mini-cart-content .mini-cart-details-holder{
display: flex;
margin: 0 auto 0 0;
flex-direction: column;
}
.mini-cart-content .mini-cart-details-holder p{
font-size: 15px !important;
font-weight: 500;
margin: 0 0 5px 0;
line-height: normal;
}
.mini-cart-content .mini-cart-qty-holder{
display: flex;
align-items: center;
gap: 10px;
}
.mini-cart-content .quantity{
display: flex;
align-items: center;
justify-content: center;
padding: 0 7px;
width: 100%;
height: 30px;
border-radius: 100px;
border: 1px solid #E4E7EA;
}
.mini-cart-content .quantity input{
font-size: 14px;
font-weight: 500;
margin: 0;
padding: 0;
height: 30px;
width: 20px !important;
border: none;
text-align: center;
background-color: transparent;
}
.mini-cart-content .quantity input[type=number]::-webkit-inner-spin-button,
.mini-cart-content .quantity input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
.mini-cart-content .quantity input::-webkit-outer-spin-button,
.mini-cart-content .quantity input::-webkit-inner-spin-button {
-webkit-appearance: none !important;
margin: 0 !important;
}
.mini-cart-content .quantity input[type=number] {
-moz-appearance: textfield !important;
}
.mini-cart-content .quantity span.minus,
.mini-cart-content .quantity span.plus{
cursor: pointer;
display: flex;
width: 12px;
height: 12px;
align-items: center;
justify-content: center;
}
.mini-cart-content .quantity svg{
width: 12px;
height: auto;
}
.mini-cart-content .quantity .quantity-input{
width: 27px;
display: flex;
align-items: center;
justify-content: center;
}
.mini-cart-content .quantity .quantity .qty-suff{
color: #939393;
font-size: 14px;
font-weight: 500;
}
.mini-cart-content ul.cart_list li dl,
.mini-cart-content ul.product_list_widget li dl{
padding: 5px 15px 0 0;
margin: 0;
border: none;
}
.mini-cart-content ul.cart_list li dl dt:first-of-type{
padding-top: 0;
}
.mini-cart-content ul.cart_list li dl dt{
padding: 0 5px 0 0 !important;
}
.mini-cart-content ul.cart_list li dl dt,
.mini-cart-content ul.product_list_widget li dl dt{
display: flex;
font-size: 13px !important;
font-weight: 500;
color: var(--main-color);
float: left;
padding: 0;
margin: 0;
}
.mini-cart-content ul.cart_list li dl dd,
.mini-cart-content ul.product_list_widget li dl dd{
display: block;
color: #999999;
font-size: 13px !important;
float: none;
padding: 0;
margin: 0;
}
.mini-cart-content .total{
color: var(--body-color);
display: flex;
float: left;
width: 100%;
font-size: 18px;
font-weight: 700;
padding: 15px 0 15px 0;
margin: 0;
align-items: center;
border-top: 1px solid #E1E1E1;
}
.mini-cart-content .total .amount{
font-size: 18px;
font-weight: 500;
}
.mini-cart-content .total strong{
font-size: 18px;
font-weight: 500;
margin-right: auto;
}
.mini-cart-content .buttons{
display: block;
float: left;
width: 100%;
padding-bottom: 25px;
}
.mini-cart-content .buttons a.button{
display: flex;
align-items: center;
justify-content: center;
color: #ffffff;
font-size: 13px;
font-weight: 600;
height: 50px;
padding: 0;
margin: 0;
border-radius: 5px;
text-decoration: none;
letter-spacing: 0.5px;
text-transform: uppercase;
background-color: var(--main-color);
}
.mini-cart-content .buttons a:hover,
.mini-cart-content .buttons a:focus{
background-color: #333333;
}
.mini-cart-content .blockOverlay{
opacity: 0 !important;
}
.mini-cart-content .blockUI.blockOverlay::before{
content: none !important;
}
/* Mobile Navigation */
.nav-tools-mobile {
display: none;
}
.menu-open-mobile {
cursor: pointer;
color: var(--white-color);
display: flex;
flex-direction: column;
}
.menu-open-mobile span {
width: 25px;
height: 1px;
background-color: var(--main-color);
}
.menu-open-mobile span:nth-child(2) {
margin-top: 5px;
}
.menu-open-mobile span:nth-child(3) {
margin-top: 5px;
}
.site-overlay {
cursor: pointer;
display: block;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9;
opacity: 0;
visibility: hidden;
transition: all 0.2s linear;
background: rgba(0, 0, 0, 0.6);
}
.mobile-menu {
position: fixed;
right: 0;
left: auto;
top: 0;
margin: 0;
bottom: 0;
width: 330px;
z-index: 11;
overflow: auto;
transform: none;
border-radius: 0;
background-color: #ffffff;
transform: translate3d(100%, 0, 0);
transition: transform 0.4s cubic-bezier(0.19, 1, 0.22, 1);
}
.mobile-menu-header {
padding: 25px 0 0 0;
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
}
.mobile-menu-inner {
padding: 0 15px;
}
.mobile-menu-logo img{
width: auto;
height: 40px;
}
.mobile-menu-logo {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.mobile-menu-active .mobile-menu {
transform: none;
right: 0;
}
body.mobile-menu-open {
overflow: hidden;
}
.mobile-menu-open .site-overlay {
opacity: 1;
visibility: visible;
}
.menu-close {
display: block;
width: 18px;
height: 18px;
text-align: center;
margin-left: auto;
}
.menu-close::before,
.menu-close::after {
position: absolute;
content: ' ';
height: 18px;
width: 1px;
background-color: var(--black-color);
}
.menu-close::before {
transform: rotate(45deg);
}
.menu-close::after {
transform: rotate(-45deg);
}
.mobile-menu-close {
position: absolute;
top: 15px;
right: 0;
}
.mobile-menu-close-inner {
cursor: pointer;
display: flex;
color: #313132;
align-items: center;
}
.mobile-menu-content {
padding: 20px 0;
margin: 20px 0;
border-top: 1px solid #dedede;
border-bottom: 1px solid #dedede;
}
.mobile-menu-content ul {
padding: 0;
margin: 0;
list-style: none;
}
.mobile-menu-content ul li {
position: relative;
margin-bottom: 12px;
}
.mobile-menu-content ul li:last-of-type {
margin-bottom: 0;
}
.mobile-menu-content ul li a {
position: relative;
font-size: var(--font-16px-clamp);
font-weight: 500;
text-decoration: none;
}
.mobile-menu-content .sub-menu {
display: none;
margin-top: 10px;
padding-left: 0;
}
.mobile-menu-content .sub-menu li a {
opacity: 0.5;
}
.mobile-menu-content .sub-menu .sub-menu {
display: block;
}
.mobile-menu-content li.sub-menu-parent::after {
content: none !important;
}
.mobile-menu-content li.sub-menu-parent .sub-menu {
padding-left: 0;
}
.mobile-menu-content li.sub-menu-separator {
margin: 0 0 10px 0;
padding: 0 0 10px 0;
}
.mobile-menu-content li.sub-menu-parent>a {
opacity: 1 !important;
}
.mobile-menu-content ul .is-active.menu-item-has-children>a::after {
top: 7px;
transform: rotate(-180deg);
}
.mobile-menu-footer ul{
display: flex;
align-items: center;
justify-content: center;
padding: 0;
margin: 0;
gap: 10px;
list-style: none;
}
.mobile-menu-footer ul li svg{
width: 30px;
height: 30px;
}
.mobile-menu-footer .nav-tel{
margin-top: 10px;
}
.mobile-menu-footer .nav-tel a{
justify-content: center;
}
.mobile-menu-content-categories{
padding: 0 0 20px 0;
margin: 0 0 20px 0;
border-bottom: 1px solid #dedede;
}
.mobile-menu-content-categories ul.menu-category li > a:first-of-type img{
width: 25px;
height: 25px;
margin-right: 10px;
}
.mobile-menu-content-categories ul{
margin: 0;
padding: 0;
list-style: none;
}
.mobile-menu-content-categories li{
position: relative;
margin-bottom: 12px;
padding-bottom: 12px;
border-bottom: 1px solid #ECECEC;
}
.mobile-menu-content-categories li:last-of-type{
margin-bottom: 0;
padding-bottom: 0;
border-bottom: none;
}
.mobile-menu-content-categories li a{
display: block;
font-size: 16px;
font-weight: 400;
}
.mobile-menu-content-categories li a::after{
position: absolute;
content: '';
top: 8px;
right: 0;
width: 8px;
height: 11px;
transform: translateY(-50%);
background-image: url('data:image/svg+xml,');
background-repeat: no-repeat;
}
.mobile-menu-content-categories li ul.submenu{
display: none;
}
/* Single Page Header Default */
.page-header-default{
padding-top: 35px;
padding-bottom: 35px;
background-color: #F9F9F9;
}
.page-breadcrumbs span.breadcrumbs-separator {
padding: 0 5px;
}
.page-breadcrumbs a,
.page-breadcrumbs span {
color: rgba(0, 0, 0, 0.4);
padding: 0;
margin: 0;
font-size: 13px;
font-weight: 500;
text-decoration: none;
}
.page-breadcrumbs span.breadcrumbs-current {
color: #232843;
}
.page-header-default h1 {
font-size: var(--font-h2-clamp);
color: var(--main-color);
font-weight: 500;
margin-bottom: 0;
margin-top: 10px;
}
.page-header-default p{
font-size: 18px;
font-weight: 400;
color: rgba(255, 255, 255, 0.39);
}
/* ============================================== */
/* =============== elements styles ============== */
/* ============================================== */
/* info block (multiple page) */
:root{
--info-block-image-h-clamp: 300px 550px;
}
.info-block {
position: relative;
}
.info-block-left .site-row {
flex-direction: row-reverse;
}
.info-block-content{
text-align: center;
}
.info-block-content .info-block-subtitle {
margin-bottom: 15px;
}
.info-block-content .info-block-subtitle h5 {
font-size: 14px;
font-weight: 600;
text-transform: uppercase;
}
.info-block-content h2 {
font-size: var(--font-h2-clamp);
margin: 0 0 var(--s-40-clamp) 0;
}
.info-block-content .site-button a{
margin-top: var(--s-40-clamp);
}
.info-block-content p{
color: rgba(1, 1, 1, 0.60);
}
.info-block-content p:last-of-type {
margin-bottom: 0;
}
.info-block-content ul{
gap: 10px;
display: flex;
flex-direction: column;
padding: 0;
list-style: none;
margin: var(--s-25-clamp) 0 0 0;
}
.info-block-content ul li{
gap: 10px;
font-size: 16px;
align-items: center;
display: inline-flex;
justify-content: center;
}
.info-block-content ul li::after,
.info-block-content ul li::before{
content: '';
display: block;
width: 10px;
height: 10px;
background: url('data:image/svg+xml,') no-repeat center center / contain;
}
.info-block-image {
position: relative;
height: var(--info-block-image-h-clamp);
}
.info-block-image img {
width: var(--width-100);
height: var(--height-100);
object-fit: contain;
object-position: center center;
}
/* Review Block */
.reviews-block{
position: relative;
}
.reviews-block__heading h2{
font-size: var(--font-h2-clamp);
text-align: center;
}
.reviews-block__wrapper{
margin-top: var(--s-40-clamp);
}
.reviews-block__wrapper .swiper-slide{
height: auto;
}
.reviews-block__item{
display: flex;
flex-direction: column;
text-align: center;
height: 100%;
padding: var(--s-25-clamp);
border-radius: var(--border-r-5);
background-color: var(--white-color);
}
.reviews-block__item-stars{
margin-top: 5px;
}
.reviews-block__item-stars svg{
height: 15px;
width: auto;
}
.reviews-block__item-stars.star1 .one-star,
.reviews-block__item-stars.star2 .one-star,
.reviews-block__item-stars.star2 .two-star,
.reviews-block__item-stars.star3 .one-star,
.reviews-block__item-stars.star3 .two-star,
.reviews-block__item-stars.star3 .three-star,
.reviews-block__item-stars.star4 .one-star,
.reviews-block__item-stars.star4 .two-star,
.reviews-block__item-stars.star4 .three-star,
.reviews-block__item-stars.star4 .four-star,
.reviews-block__item-stars.star5 .one-star,
.reviews-block__item-stars.star5 .two-star,
.reviews-block__item-stars.star5 .three-star,
.reviews-block__item-stars.star5 .four-star,
.reviews-block__item-stars.star5 .five-star {
opacity: 1;
}
.reviews-block__item-stars svg path{
opacity: .4;
}
.reviews-block__item-heading h4{
font-size: var(--font-18px-clamp);
font-weight: 700;
}
.reviews-block__item-description{
margin-bottom: var(--s-15-clamp);
}
.reviews-block__item-client{
margin-top: auto;
padding-top: 15px;
border-top: var(--border-basic) #EDECEB;
}
.reviews-block__item-client h3{
font-size: var(--font-h4-clamp);
font-weight: 500;
}
.reviews-block__item-image{
margin-bottom: var(--s-30-clamp);
display: flex;
align-items: center;
justify-content: center;
}
.reviews-block__item-image figure{
width: 100px;
height: 100px;
}
.reviews-block__item-image figure img{
width: var(--width-100);
height: var(--height-100);
object-fit: contain;
object-position: center center;
border-radius: var(--border-r-100);
}
.reviews-block__navigation{
gap: 5px;
display: flex;
position: relative;
align-items: center;
margin: 35px auto 0;
justify-content: center;
}
.reviews-block .swiper-button-prev,
.reviews-block .swiper-button-next {
z-index: 1;
position: inherit;
width: 35px;
height: 35px;
margin: 0;
transition: var(--basic-transition);
border-radius: var(--border-r-50);
background-color: var(--white-color)
}
.reviews-block .swiper-button-prev:after {
content: '';
width: 5px;
left: 0;
height: 10px;
background: url('assets/images/swiper-prev-arrow.svg');
}
.reviews-block .swiper-button-next:after{
content: '';
width: 5px;
right: 0;
height: 10px;
background: url('assets/images/swiper-next-arrow.svg');
}
.reviews-block .swiper-pagination {
position: inherit;
height: 35px;
display: flex;
padding: 0 15px;
align-items: center;
transition: var(--basic-transition);
border-radius: var(--border-r-50);
background-color: var(--white-color);
}
.reviews-block .swiper-pagination-bullet {
opacity: 0.5;
background: var(--main-color);
border-radius: var(--border-r-50);
}
.reviews-block .swiper-pagination-bullet-active {
opacity: 1;
}
/* Home Hero */
.site-hero{
margin: 0;
position: relative;
}
.site-hero__background-image figure::before{
content: '';
position: absolute;
inset: 0;
width: var(--width-100);
height: var(--height-100);
background: rgba(0, 0, 0, 0.15);
}
.site-hero__background-image figure{
position: relative;
height: calc(100dvh - 123.19px);
}
.site-hero__background-image figure img{
width: var(--width-100);
height: var(--height-100);
object-fit: cover;
object-position: center center;
}
.site-hero__content{
position: absolute;
top: 50%;
left: 50%;
right: 0;
width: var(--width-100);
text-align: center;
transform: var(--transform-50-50);
}
.site-hero__caption{
color: var(--white-color);
}
.hero-title{
margin-bottom: 25px;
}
.hero-title h1{
font-size: var(--font-h1-clamp);
font-weight: 500;
}
.hero-desc p{
font-size: 18px;
font-weight: 500;
}
.site-hero__btn{
display: flex;
margin-top: 35px;
justify-content: center;
}
/* page bottom cta */
.page-bottom-cta {
position: relative;
}
.page-bottom-cta::after{
position: absolute;
content: '';
inset: 0;
width: var(--width-100);
height: var(--height-100);
border-radius: var(--border-r-25);
background-color: rgba(35, 40, 67, 0.48);
}
.page-bottom-cta::before{
position: absolute;
content: '';
inset: auto auto 0;
width: var(--width-100);
height: 50%;
border-radius: var(--border-r-25);
background: linear-gradient(180deg, rgba(197, 206, 243, 0) 0%, #daeaf2 100%);
}
.page-bottom-cta-image {
height: 500px;
background-size: cover;
background-repeat: no-repeat;
border-radius: var(--border-r-25);
background-position: center center;
}
.page-bottom-cta-caption {
text-align: center;
position: absolute;
top: 50%;
left: 50%;
width: 100%;
z-index: 8;
-ms-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.page-bottom-cta-content {
max-width: 80%;
margin: 0 auto;
color: var(--white-color);
}
.page-bottom-cta-content h2 {
font-size: var(--font-h2-clamp);
margin-bottom: 25px;
}
.page-bottom-cta-button{
margin-top: 25px;
}
/* Icon Boxes */
#despre-noi-section .icons-block{
margin: 0;
}
.icons-block{
margin-top: 50px;
}
.icons-block .icons-block-heading h2{
font-size: var(--font-h2);
font-weight: 400;
}
.icons-block .icons-block-list{
gap: 30px;
display: grid;
grid-template-columns: repeat(2, 1fr);
}
.icon-block-item{
padding: 25px;
background-color: var(--white-color);
border-radius: var(--border-r-10);
}
.icon-block-item .icon-block-image figure{
width: 36px;
height: 36px;
}
.icon-block-item .icon-block-image figure img{
width: var(--width-100);
height: var(--height-100);
object-fit: contain;
object-position: center center;
}
.icon-block-item .icon-block-content h3{
font-size: var(--font-h3-clamp);
font-weight: 400;
margin: 25px 0;
color: var(--black-color);
}
.icon-block-item .icon-block-content p{
color: #61656E;
}
.icons-block.icons-block-second-style .icons-block-list{
grid-template-columns: repeat(3, 1fr);
}
.icons-block.icons-block-second-style .icons-block-list .icon-block-item{
display: flex;
align-items: center;
gap: 25px;
background-color: var(--white-color);
}
.icons-block.icons-block-second-style .icons-block-list .icon-block-item .icon-block-content h3{
font-size: var(--font-h4);
margin-top: 0;
margin-bottom: 15px;
}
/* Gallery */
:root{
--gallery-image-h-clamp: 150px 450px;
--gallery-image-h-button-clamp: 35px 50px;
}
.gallery{
position: relative;
}
.gallery-heading{
gap: 15px;
display: flex;
text-align: center;
align-items: center;
margin-bottom: var(--s-50-clamp);
flex-direction: column;
justify-content: center;
}
.gallery-heading h5{
font-size: 15px;
font-weight: 600;
text-transform: uppercase;
color: var(--main-color);
}
.gallery-heading h2{
font-size: var(--font-h2-clamp);
}
.gallery-holder{
gap: 15px;
display: grid;
}
.gallery-holder.gallery-holder-1-column{
grid-template-columns: repeat(1, 1fr);
}
.gallery-holder.gallery-holder-2-column{
grid-template-columns: repeat(2, 1fr);
}
.gallery-holder.gallery-holder-3-column{
grid-template-columns: repeat(3, 1fr);
}
.gallery-holder.gallery-holder-4-column{
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}
.gallery-holder.gallery-holder-5-column{
grid-template-columns: repeat(5, 1fr);
}
.gallery-holder.gallery-holder-6-column{
grid-template-columns: repeat(6, 1fr);
}
.gallery-holder.gallery-holder-7-column{
grid-template-columns: repeat(7, 1fr);
}
.gallery-holder.gallery-holder-8-column{
grid-template-columns: repeat(8, 1fr);
}
.gallery-holder.gallery-holder-9-column{
grid-template-columns: repeat(9, 1fr);
}
.gallery-holder.gallery-holder-10-column{
grid-template-columns: repeat(10, 1fr);
}
.gallery-holder.gallery-holder-11-column{
grid-template-columns: repeat(11, 1fr);
}
.gallery-holder.gallery-holder-12-column{
grid-template-columns: repeat(12, 1fr);
}
.gallery .gallery-button{
display: flex;
align-items: center;
justify-content: center;
}
.gallery-item a{
pointer-events: none;
}
.gallery .gallery-item-video,
.gallery .gallery-item figure{
height: var(--gallery-image-h-clamp);
}
.gallery .gallery-item-video video,
.gallery .gallery-item figure img{
width: var(--width-100);
height: var(--height-100);
object-fit: cover;
object-position: center center;
border-radius: var(--border-r-5);
}
.video-holder{
height: auto;
border-radius: 25px;
}
.video-holder video{
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
border-radius: 25px;
object-position: center center;
}
/* About Block */
:root{
--about-block-image-h-clamp: 350px 550px;
}
.about-block__holder-image{
height: var(--about-block-image-h-clamp);
}
.about-block__holder-image img{
width: var(--width-100);
height: var(--height-100);
object-fit: cover;
object-position: center center;
border-radius: var(--border-r-5);
}
.about-block__holder{
display: grid;
align-items: center;
gap: var(--gap-120-clamp);
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}
.about-block__holder-wrapper{
display: flex;
flex-direction: column;
justify-content: center;
gap: var(--gap-25-clamp);
}
.about-block__wrapper-item{
display: flex;
flex-direction: column;
}
.about-block__wrapper-item-heading{
margin-bottom: 15px;
}
.about-block__wrapper-item-heading h4{
font-size: var(--font-h4-clamp);
}
.about-block__wrapper-item-desc{
padding-bottom: var(--s-25-clamp);
border-bottom: var(--border-basic) rgba(0, 0, 0, 0.05);
}
.about-block__holder-wrapper .about-block__wrapper-item:last-of-type .about-block__wrapper-item-desc{
padding: 0;
border: 0;
}
.about-block__wrapper-item-desc p{
line-height: normal;
color: rgba(1, 1, 1, 0.60);
}
/* Features Block */
:root{
--features-block-image-h-clamp: 350px 600px;
}
.features-block{
display: grid;
align-items: center;
gap: var(--gap-30-clamp);
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
}
.features-block__image{
height: var(--features-block-image-h-clamp);
}
.features-block__image img{
width: var(--width-100);
height: var(--height-100);
object-fit: cover;
object-position: center center;
}
.features-block__holder{
display: flex;
flex-direction: column;
}
.features-block__holder-subheading{
margin-bottom: 10px;
}
.features-block__holder-subheading h5{
font-size: 14px;
color: #999999;
font-weight: 500;
text-transform: uppercase;
}
.features-block__holder-heading h2{
font-size: var(--font-h2-clamp);
font-weight: 500;
}
.features-block__holder-wrapper{
display: grid;
margin-top: 40px;
gap: var(--gap-30-clamp);
grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}
.features-block__wrapper-item{
display: flex;
flex-direction: column;
}
.features-block__wrapper-item-icon{
width: 30px;
height: 30px;
margin-bottom: var(--s-15-clamp);
}
.features-block__wrapper-item-icon img{
width: var(--width-100);
height: var(--height-100);
object-fit: cover;
object-position: center center;
}
.features-block__wrapper-item-heading{
margin-bottom: 10px;
}
.features-block__wrapper-item-heading h4{
font-weight: 500;
font-size: var(--font-h4-clamp);
}
.features-block__wrapper-item-desc p{
font-size: 16px;
color: rgba(1, 1, 1, 0.60);
}
/* ============================================== */
/* ================ Woo styles =============== */
/* ============================================== */
/* Shop Pagination */
.woocommerce nav.woocommerce-pagination ul{
display: flex;
border: none;
margin: 70px 0 0 0;
align-items: center;
justify-content: center;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{
display: flex;
padding: 0;
align-items: center;
justify-content: center;
color: var(--black-color);
font-size: 14px;
font-weight: 500;
margin: 0 10px;
width: 30px;
height: 30px;
text-align: center;
text-decoration: none;
border-radius: var(--border-r-50);
background-color: var(--white-color);
}
.woocommerce nav.woocommerce-pagination ul li{
border: none;
}
.woocommerce nav.woocommerce-pagination ul li a:focus,
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current{
color: var(--white-color);
background-color: var(--main-color);
}
.woocommerce nav.woocommerce-pagination ul li a.prev{
text-indent: -99999px;
background-size: 8px 14px;
background-repeat: no-repeat;
background-position: center center;
background-image: url('data:image/svg+xml,');
}
.woocommerce nav.woocommerce-pagination ul li a.prev:hover{
background-image: url('data:image/svg+xml,');
}
.woocommerce nav.woocommerce-pagination ul li a.next{
text-indent: -99999px;
background-size: 8px 14px;
background-repeat: no-repeat;
background-position: center center;
background-image: url('data:image/svg+xml,');
}
.woocommerce nav.woocommerce-pagination ul li a.next:hover{
background-image: url('data:image/svg+xml,');
}
/* Ordering */
.shop-content .shop-sidebar-mobile-filter{
display: none;
}
.shop-content .shop-sidebar-mobile-filter span{
font-size: 14px;
font-weight: 500;
}
.woocommerce .woocommerce-ordering{
display: flex;
align-items: center;
position: relative;
padding: 0 15px 0 15px;
margin: 0;
height: 40px;
border: 1px solid #dedede;
background-color: #ffffff;
color: var(--black-color);
border-radius: 12px;
}
.woocommerce .woocommerce-ordering select {
vertical-align: inherit;
font-size: 14px;
font-weight: 500;
}
.woocommerce-ordering select {
color: #222831;
cursor: pointer;
font-size: 15px;
font-weight: 400;
border: none;
height: 20px;
box-shadow: none;
text-align: left;
padding: 0 20px 0 0;
-webkit-appearance: none;
-moz-appearance: none;
-o-appearance: none;
appearance: none;
outline: none;
background-color: transparent;
}
.woocommerce-ordering svg {
position: absolute;
pointer-events: none;
top: 16px;
right: 10px;
width: auto;
height: 6px;
}
.products-sorting-inner {
display: flex;
align-items: center;
justify-content: space-between;
}
.products-sorting-inner .woocommerce-result-count{
margin: 0;
font-size: 14px;
font-weight: 500;
}
.products-sorting{
padding: 30px 0;
}
/* Single Product */
.single-product .upsells{
display: none !important;
}
.single-product main.shop-content{
padding-top: 35px;
background-color: #F9F9F9;
}
.site-single-product-info{
padding-top: 35px;
padding-bottom: 70px;
}
.woocommerce div.product h1.product_title{
font-size: var(--font-h3-clamp);
font-weight: 500;
margin-bottom: 15px;
}
.woocommerce div.product div.images {
width: 100%;
float: none;
margin: 0;
}
.woocommerce div.product div.summary{
margin: 0 0 0 5%;
position: relative;
width: 100%;
-ms-flex: 0 0 45%;
flex: 0 0 45%;
max-width: 45%;
padding-left: 15px;
padding-right: 15px;
}
.woocommerce div.product div.summary .product-price {
display: flex;
margin-bottom: 5px;
align-items: flex-start;
justify-content: space-between
}
.woocommerce div.product div.summary .product-price bdi{
font-size: 20px;
color: #999999 !important;
}
.woocommerce div.product div.summary .product-stock {
display: flex;
color: #4c596a;
font-size: 16px;
font-weight: 500;
align-items: center;
padding: 7px 15px;
border-radius: 100px;
background-color: #eef9fb
}
.woocommerce div.product div.summary .product-brand a{
display: flex;
color: #999999;
text-transform: uppercase;
text-decoration: none;
margin-bottom: 10px;
}
.product .product-price .price bdi {
font-size: 16px;
font-weight: 500;
color: rgba(0, 0, 0, 0.5) !important;
}
.woocommerce-product-details__short-description b,
.woocommerce-product-details__short-description strong{
font-weight: 500;
}
.woocommerce-product-details__short-description p {
margin-bottom: 10px !important;
color: rgba(0, 0, 0, 0.8) !important;
}
.woocommerce-product-details__short-description p strong,
.woocommerce-product-details__short-description li strong,
.woocommerce-product-details__short-description p b,
.woocommerce-product-details__short-description li b{
font-weight: 500;
color: var(--black-color);
}
.woocommerce-product-details__short-description p a {
display: inline-block;
color: var(--black-color);
}
.woocommerce-product-details__short-description ul,
.woocommerce-product-details__short-description ol{
padding: 0 0 0 20px;
margin: 0;
}
.woocommerce-product-details__short-description ul li,
.woocommerce-product-details__short-description ol li{
line-height: 1.6;
}
.woocommerce div.product div.summary .no-price-box{
margin-top: 20px;
}
.woocommerce div.product div.summary .no-price-box p{
font-weight: 500;
margin-bottom: 10px;
}
.woocommerce div.product div.summary .no-price-box .site-button{
width: 100%;
}
.woocommerce div.product form.cart .variations tbody{
display: flex;
gap: 15px;
position: relative;
}
.woocommerce div.product form.cart .variations tbody tr{
display: flex;
width: 100%;
align-items: flex-start;
flex-direction: column;
}
.woocommerce div.product form.cart .variations tbody td{
width: 100%;
}
.woocommerce div.product form.cart .variations tbody tr label{
color: #999999;
font-size: 14px;
font-weight: 500;
}
.woocommerce div.product form.cart .variations tbody tr select{
cursor: pointer;
width: 100%;
padding: 0 10px;
height: 40px;
font-weight: 500;
border-radius: 5px;
background-color: #ffffff;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background-repeat: no-repeat;
background-position: 94% center;
background-size: 11px 19px;
border: 1px solid #dedede;
background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 8'%3E%3Cpath d='m11.91 0 1.06 1.06-5.777 5.78a.996.996 0 0 1-1.413 0L0 1.06 1.06 0l5.425 5.425L11.91 0Z' fill='%23010101'/%3E%3C/svg%3E");
}
.woocommerce div.product .join-products-switcher{
margin-top: 15px;
margin-bottom: 15px;
}
.woocommerce div.product .join-products-switcher label{
color: #999999;
font-size: 14px;
font-weight: 500;
line-height: 2;
display: flex;
margin-bottom: 3px;
}
.woocommerce div.product .join-products-switcher select{
cursor: pointer;
width: 100%;
padding: 0 10px;
height: 40px;
font-weight: 500;
border-radius: 5px;
background-color: #ffffff;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
background-repeat: no-repeat;
background-position: 98% center;
background-size: 11px 19px;
border: 1px solid #dedede;
background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 8'%3E%3Cpath d='m11.91 0 1.06 1.06-5.777 5.78a.996.996 0 0 1-1.413 0L0 1.06 1.06 0l5.425 5.425L11.91 0Z' fill='%23010101'/%3E%3C/svg%3E");
}
.woocommerce div.product form.cart .variations tbody .reset_variations{
display: none !important;
}
.woocommerce-variation-availability p{
color: #4dd587 !important;
font-weight: 500;
}
.woocommerce-variation-availability{
margin-bottom: 10px;
}
.woocommerce-variation-price{
margin-bottom: 20px;
}
.woocommerce div.product p.price ins,
.woocommerce div.product span.price ins{
text-decoration: none;
}
.woocommerce div.product p.price del,
.woocommerce div.product span.price del{
opacity: 1;
color: #f33a4b;
}
.woocommerce-variation-price span{
font-size: 20px;
font-weight: 500;
color: #999999;
}
/* Product Single Galerry */
.woocommerce div.product div.images .woocommerce-product-gallery__image{
height: 100%;
border-radius: var(--border-r-30);
}
.woocommerce div.product div.images .woocommerce-product-gallery__image img{
width: 100% !important;
height: auto !important;
object-fit: contain;
margin: 0 auto !important;
padding: 0 !important;
border-radius: 12px;
object-position: center center;
}
.woocommerce div.product div.images {
margin: 0;
position: relative;
width: 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.pswp--zoom-allowed .pswp__button--zoom,
.pswp--supports-fs .pswp__button--fs,
.pswp__caption{
display: none !important;
}
.woocommerce div.product div.images .flex-direction-nav {
display: none;
margin: 0;
padding: 0;
list-style: none;
}
.woocommerce div.product div.images .flex-nav-prev,
.woocommerce div.product div.images .flex-nav-next {
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 50%;
z-index: 1;
transform: translateY(-50%);
}
.woocommerce div.product div.images .flex-nav-prev {
left: 15px;
}
.woocommerce div.product div.images .flex-nav-next {
right: 15px;
}
.woocommerce div.product div.images .flex-nav-prev a,
.woocommerce div.product div.images .flex-nav-next a {
display: flex;
align-items: center;
justify-content: center;
text-indent: -99999px;
font-size: 0;
margin: 0;
padding: 0;
width: 40px;
height: 40px;
border-radius: 50px;
background-color: var(--black-color);
}
.woocommerce div.product div.images .flex-nav-next a.flex-next::before {
content: '';
width: 7px;
height: 14px;
margin-right: -2px;
display: inline-block;
background-repeat: no-repeat;
background-position: center center;
background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 15'%3E%3Cpath d='M.602 14.531 7.572 7.5.602.469' stroke='%23fff' stroke-width='1.25'/%3E%3C/svg%3E");
}
.woocommerce div.product div.images .flex-nav-prev a.flex-prev::before {
content: '';
width: 7px;
height: 14px;
margin-left: -2px;
display: inline-block;
background-repeat: no-repeat;
background-position: center center;
background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 15'%3E%3Cpath d='M8.398 14.531 1.428 7.5 8.398.469' stroke='%23fff' stroke-width='1.25'/%3E%3C/svg%3E");
}
.woocommerce div.product div.images .flex-control-nav {
display: flex;
align-items: center;
justify-content: start;
padding: 0;
list-style: none;
margin: 20px 0 0 0;
}
.woocommerce div.product div.images .flex-control-nav li {
width: 65px;
height: 65px;
margin-right: 10px;
border-radius: 12px;
border: 1px solid #dedede;
background-color: #ffffff;
}
.woocommerce div.product div.images .flex-control-nav li img {
object-fit: contain;
margin: 0 auto;
border-radius: 10px;
}
.woocommerce div.product div.images .flex-control-nav li a {
display: block;
font-size: 0;
width: 8px;
height: 8px;
opacity: 0.5;
text-indent: -99999px;
border-radius: 50px;
background-color: #252a2f;
}
.woocommerce div.product div.images .flex-control-nav li a.flex-active {
opacity: 1;
}
/* Product card */
.product .product-item-image{
margin-bottom: 10px;
}
.product .product-item-image figure{
height: 300px;
background-color: #ffffff;
border-radius: 12px;
}
.product .product-item-image figure span{
position: relative;
}
.product .product-item-image img{
width: 100% !important;
height: 100% !important;
object-fit: contain;
margin: 0 auto!important;
padding: 0 20px !important;
object-position: center center;
border-radius: 12px;
background-color: #ffffff;
}
.product .product-item-image img.secondary{
position: absolute;
top: 0;
left: 0;
opacity: 0;
transition: opacity 0.4s ease;
z-index: 1;
}
.product-item-image:hover img.secondary{
opacity: 1;
}
.woocommerce ul.products li.product .woocommerce-placeholder{
border: none;
}
.product .product-item-details{
display: flex;
margin-top: 10px;
align-items: center;
gap: var(--gap-30-clamp);
justify-content: space-between;
}
.product .product-item-details .product-item-header-holder{
gap: 5px;
display: flex;
flex-direction: column;
}
.product .product-item-image figure .onsale {
display: flex;
align-items: center;
position: absolute;
font-size: 12px;
font-weight: 600;
margin: 0 !important;
line-height: normal !important;
top: 10px !important;
min-height: auto !important;
min-width: auto !important;
left: 10px !important;
right: auto !important;
color: var(--white-color);
height: 25px;
padding: 0 10px;
border-radius: 5px;
background-color: var(--black-color);
}
.woocommerce ul.products li.product .woocommerce-loop-category__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h3 {
font-size: var(--font-h5-clamp);
font-weight: 500;
padding: 0;
margin: 0;
}
.product-item-header{
position: absolute;
z-index: 1;
top: 10px;
right: 10px;
}
.product-item-badge span{
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 12px;
font-weight: 600;
height: 25px;
padding: 0 10px;
color: var(--white-color);
border-radius: var(--border-r-5);
background-color: var(--black-color);
}
.product-item-category{
margin-bottom: 5px;
text-align: left;
}
.product-item-category a{
opacity: .6;
font-size: 12px;
font-weight: 600;
text-transform: uppercase;
}
.woocommerce ul.products li.product .product-item-attribute{
gap: 10px;
display: flex;
align-items: center;
margin-bottom: 25px;
justify-content: flex-start;
}
.woocommerce ul.products li.product .product-item-attribute span{
height: 30px;
display: flex;
padding: 0 15px;
font-size: 12px;
font-weight: 500;
align-items: center;
justify-content: center;
background-color: #F6FBFF;
border-radius: var(--border-r-50);
}
.product .product-item-details .woocommerce-loop-product__title h3 a {
font-size: 20px;
}
.woocommerce ul.products li.product .product-item-details .price {
display: flex;
margin: 0;
}
.woocommerce ul.products li.product .product-item-details .price bdi {
color: #999999;
font-size: 15px;
font-weight: 500;
}
.woocommerce ul.products li.product .price ins{
text-decoration: none;
margin-left: 5px;
}
/* Quantity */
.quantity{
display: flex;
align-items: center;
justify-content: center;
border-radius: var(--border-r-50);
border: var(--border-basic) #2260AA10;
}
.quantity input{
margin: 0;
padding: 0;
border: none;
text-align: center;
}
.quantity span.minus,
.quantity span.plus{
cursor: pointer;
display: flex;
width: 20px;
height: 20px;
align-items: center;
justify-content: center;
}
.quantity svg{
width: 10px;
height: auto;
}
.quantity svg path{
fill: var(--main-color);
}
.quantity .quantity-input{
width: 25px;
display: flex;
align-items: center;
justify-content: center;
}
/* Shop Sidebar */
.site-sidebar{
padding: 20px;
border-radius: var(--border-r-10);
border: var(--border-basic) #2260AA10;
background-color: var(--white-color);
}
.site-sidebar .wcpf-field-title{
color: var(--main-color);
font-size: var(--font-16px-clamp);
font-weight: 500;
padding: 0;
margin: 0;
text-transform: none;
}
.site-sidebar .wcpf-field-checkbox-list .wcpf-content{
padding: 0;
margin: 20px 0 0 0;
}
.site-sidebar .wcpf-checkbox-list .wcpf-checkbox-item{
margin-bottom: 15px;
}
.site-sidebar .wcpf-checkbox-list .wcpf-checkbox-item.checked span.wcpf-title{
color: var(--blue-color);
}
.site-sidebar .wcpf-checkbox-list .wcpf-checkbox-item:last-of-type{
margin-bottom: 0;
}
.site-sidebar .wcpf-filter-inner .wcpf-field-item{
margin: 0 0 20px 0;
padding: 0 0 20px 0;
border-bottom: 1px solid #dedede;
}
.site-sidebar .wcpf-filter-inner .wcpf-field-item:last-of-type{
margin: 0;
padding: 0;
border-bottom: none;
}
.site-sidebar .wcpf-filter-inner .wcpf-field-button{
display: inline-block;
width: 100%;
}
.site-sidebar .wcpf-filter-inner .wcpf-field-button .wcpf-button{
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
color: var(--white-color);
font-size: 13px;
font-weight: 600;
height: 45px;
padding: 0 30px;
width: var(--width-100);
border-radius: 5px;
text-decoration: none;
border: none;
letter-spacing: 0.5px;
text-transform: uppercase;
background-color: var(--main-color);
}
.site-sidebar .wcpf-filter-inner .wcpf-field-button .wcpf-button:hover{
background-color: #333333;
}
.site-sidebar .wcpf-item-inner .wcpf-item-label{
position: relative;
display: flex !important;
}
.site-sidebar .wcpf-item-inner .wcpf-item-label .wcpf-title-container{
padding: 0;
margin: 0;
line-height: normal;
color: #999999;
font-size: 15px;
font-weight: 500;
}
.site-sidebar .wcpf-field-checkbox-list .wcpf-checkbox-list .wcpf-checkbox-item.checked > .wcpf-checkbox-item-inner > .wcpf-checkbox-label .wcpf-input-container{
opacity: 1;
border: none;
background-color: #000000;
}
.site-sidebar .wcpf-field-checkbox-list .wcpf-checkbox-list .wcpf-checkbox-item.checked > .wcpf-checkbox-item-inner > .wcpf-checkbox-label .wcpf-input-container::after{
content: '';
position: absolute;
right: auto;
left: 5px;
top: 8px;
width: 6px;
z-index: 2;
height: 10px;
border: solid #FFF;
border-width: 0 2px 2px 0;
margin: 0;
-webkit-box-sizing: inherit;
box-sizing: inherit;
transform: rotate(45deg) translate(-50%, -50%);
}
.site-sidebar .wcpf-item-inner .wcpf-item-label .wcpf-input-container{
width: 18px;
height: 18px;
margin: 0 10px 0 0;
padding: 0;
-webkit-transform: none;
-ms-transform: none;
transform: none;
border-radius: 4px;
border: 1px solid #00000020;
background-color: var(--white-color);
}
.wcpf-field-checkbox-list .wcpf-checkbox-list .wcpf-checkbox-children-container{
margin-top: 20px;
}
.wcpf-front-element.wcpf-hierarchical-collapsed .wcpf-item-hierarchical-collapsed .box-item-toggle{
top: 50%;
}
.site-sidebar .wcpf-field-price-slider .ui-slider .ui-slider-handle{
border: none;
box-shadow: 0 6px 13px 0 rgba(0, 0, 0, 0.12), 0 0px 4px 0 rgba(0, 0, 0, 0.12);
}
.site-sidebar .wcpf-field-price-slider .wcpf-price-slider{
padding: 0;
margin: 0;
}
.site-sidebar .wcpf-field-price-slider .wcpf-price-slider.wcpf-heading-label{
margin-bottom: 25px;
}
.site-sidebar .wcpf-field-price-slider .ui-slider .ui-slider-handle{
top: -7px;
}
.site-sidebar .wcpf-field-price-slider .wcpf-price-slider .ui-widget-content{
background-color: rgba(60, 60, 67, 0.18);
height: 4px;
}
.site-sidebar .wcpf-field-price-slider .ui-slider-horizontal .ui-slider-range{
top: 50%;
height: 4px;
transform: var(--transform-Y50);
background-color: var(--main-color);
}
.site-sidebar .wcpf-field-price-slider.wcpf-display-min-max-inputs .wcpf-min-input,
.site-sidebar .wcpf-field-price-slider.wcpf-display-min-max-inputs .wcpf-max-input{
font-size: 16px;
font-weight: 400;
color: var(--black-color);
height: 35px;
padding: 0 20px;
border-radius: var(--border-r-50);
transition: var(--basic-transition);
border: 1px solid #dedede;
}
.site-sidebar .wcpf-field-price-slider.wcpf-display-min-max-inputs .wcpf-min-input:focus,
.site-sidebar .wcpf-field-price-slider.wcpf-display-min-max-inputs .wcpf-max-input:focus{
color: var(--main-color);
border-color: var(--main-color);
}
.site-sidebar .wcpf-field-item.wcpf-box-style.wcpf-box-hide .wcpf-heading-label .box-toggle,
.site-sidebar .wcpf-field-item.wcpf-box-style .wcpf-heading-label .box-toggle{
width: 25px;
height: 25px;
transition: var(--basic-transition);
}
.site-sidebar .wcpf-field-item.wcpf-box-style.wcpf-box-hide .wcpf-heading-label .box-toggle:before{
display: block;
content: '';
width: 25px;
height: 25px;
background-image: url('data:image/svg+xml,');
background-repeat: no-repeat;
transition: var(--basic-transition);
}
.site-sidebar .wcpf-field-item.wcpf-box-style .wcpf-heading-label .box-toggle:before{
display: block;
content: '';
width: 25px;
height: 25px;
background-image: url('data:image/svg+xml,');
background-repeat: no-repeat;
transition: var(--basic-transition);
}
.woocommerce div.product div.left-summary-side{
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
position: relative;
width: 100%;
padding-right: 15px;
padding-left: 15px;
}
.woocommerce div.product div.left-summary-side span.onsale{
display: none;
}
/* Shop Category*/
.woocommerce ul.products li.product-category.product .woocommerce-loop-category__title{
text-align: center;
}
.woocommerce ul.products li.product-category.product .category-button{
display: flex;
margin-top: 25px;
position: relative;
align-items: center;
justify-content: center;
}
.woocommerce ul.products li.product-category.product .category-button:hover span{
background-color: var(--hover-color);
}
.woocommerce ul.products li.product-category.product .category-button span{
font-size: 16px;
font-weight: 600;
color: var(--white-color);
cursor: pointer;
height: 55px;
display: flex;
padding: 0 30px;
align-items: center;
text-decoration: none;
justify-content: center;
border-radius: var(--border-r-10);
transition: var(--basic-transition);
background-color: var(--main-color);
}
/* Shop */
.archive main.shop-content{
background-color: #f9f9f9;
}
.shop-header-default{
padding-top: 35px;
}
.shop-header-default h1{
font-weight: 500;
margin-bottom: 10px;
font-size: var(--font-h2-clamp);
}
.shop-content-holder{
padding-bottom: 70px;
}
.shop-content-holder-categories{
padding-top: 70px;
}
.shop-content-holder-categories li.product-category img{
margin: 0 0 25px 0 !important;
width: var(--width-100) !important;
height: 250px !important;
object-fit: contain;
object-position: center center;
}
.shop-content-holder-categories .woocommerce-loop-category__title{
font-size: var(--font-h3-clamp) !important;
font-weight: 400 !important;
}
.shop-content-holder-categories ul.products{
grid-template-columns: repeat(4, 1fr) !important;
}
.woocommerce ul.products li.product-category .count, .woocommerce-page ul.products li.product-category .count {
display: none;
}
.woocommerce .products ul::after,
.woocommerce .products ul::before,
.woocommerce ul.products::after,
.woocommerce ul.products::before {
content: none;
}
.woocommerce ul.products,
.woocommerce-page ul.products {
display: grid;
gap: var(--gap-30-clamp);
grid-template-columns: repeat(3, 1fr);
}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
display: flex;
flex-direction: column;
position: relative;
float: none !important;
width: 100% !important;
margin: 0 !important;
}
.woocommerce .products ul,
.woocommerce ul.products {
margin: 0;
padding: 0;
}
.woocommerce div.product form.cart div.quantity {
display: flex;
align-items: center;
justify-content: center;
position: relative;
float: none;
padding: 0;
margin: 0;
width: 20%;
height: 50px;
border-radius: 5px;
border: 1px solid #dedede;
background-color: #ffffff;
}
.woocommerce div.product form.cart div.quantity input {
pointer-events: none;
font-size: 15px;
font-weight: 500;
margin: 0;
padding: 0;
height: 50px;
width: 25px;
border: none;
text-align: center;
background-color: transparent
}
.woocommerce div.product form.cart div.quantity input[type=number]::-webkit-inner-spin-button,
.woocommerce div.product form.cart div.quantity input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0
}
.woocommerce div.product form.cart div.quantity input::-webkit-outer-spin-button,
.woocommerce div.product form.cart div.quantity input::-webkit-inner-spin-button {
-webkit-appearance: none !important;
margin: 0 !important
}
.woocommerce div.product form.cart div.quantity input[type=number] {
-moz-appearance: textfield !important
}
.woocommerce div.product form.cart div.quantity span.minus,
.woocommerce div.product form.cart div.quantity span.plus {
padding: 0 5px;
cursor: pointer;
display: flex;
width: 25px;
height: 100%;
align-items: center;
justify-content: center
}
.woocommerce div.product form.cart div.quantity svg {
width: 13px;
height: 13px
}
.woocommerce div.product form.cart div.quantity .quantity-input {
width: 35px;
padding: 0;
display: flex;
align-items: center;
justify-content: center
}
.woocommerce div.product form.cart div.quantity .qty-suff {
color: #939393;
font-size: 14px;
font-weight: 500
}
.woocommerce div.product form.cart .button {
display: flex;
align-items: center;
justify-content: center;
font-size: 13px;
font-weight: 600;
width: 100%;
height: 50px;
border: none;
padding: 0;
letter-spacing: 0;
margin: 0 0 0 15px;
border-radius: 5px;
text-decoration: none;
color: #fff !important;
text-transform: uppercase;
letter-spacing: 0.5px;
background-color: var(--black-color);
-webkit-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out
}
.woocommerce div.product form.cart .button:hover{
background-color: #333333;
}
.woocommerce div.product form.cart .button.disabled:hover{
background-color: var(--black-color);
}
.woocommerce div.product form.cart {
display: flex;
margin-bottom: 0;
}
.woocommerce div.product form.variations_form{
flex-direction: column;
}
.woocommerce div.product form .woocommerce-variation-add-to-cart{
display: flex;
}
/* Related products */
.related.products{
padding: 70px 0 70px 0;
background: #F9F9F9;
border-top: 1px solid #dedede;
}
.related.products h2 {
font-size: var(--font-h2-clamp);
font-weight: 400;
margin-bottom: 35px;
text-align: center;
}
.related ul.products{
grid-template-columns: repeat(4, 1fr);
}
/* Checkout & Billing Page */
.woocommerce-privacy-policy-text {
padding-bottom: 15px;
}
.woocommerce-terms-and-conditions-wrapper {
margin: 15px 0;
}
.woocommerce-checkout .blockUI.blockOverlay {
opacity: 1 !important;
background: rgba(255, 255, 255, 0.5) !important;
}
.woocommerce-checkout .woocommerce-checkout-payment .blockUI.blockOverlay {
display: none !important;
}
.woocommerce-NoticeGroup-checkout {
display: none !important;
}
.woocommerce-checkout .page-content {
padding-top: 70px;
padding-bottom: 70px;
}
.woocommerce-checkout .woocommerce-error {
color: #e6130f;
padding: 0;
margin: 0;
border: none;
background-color: transparent;
}
.woocommerce-checkout .woocommerce-error strong {
font-weight: 400;
}
.woocommerce-checkout .woocommerce-error::before,
.woocommerce-checkout .woocommerce-error::after {
content: none;
}
.woocommerce-checkout .bottom-header,
.woocommerce-account .bottom-header {
border-bottom: 1px solid #c4c4c4;
}
#add_payment_method #payment div.payment_box,
.woocommerce-cart #payment div.payment_box,
.woocommerce-checkout #payment div.payment_box {
font-size: 16px;
color: #1c1c1f;
margin: 0;
border-radius: 0;
padding: 0;
background-color: transparent;
}
#add_payment_method #payment div.payment_box::before,
.woocommerce-cart #payment div.payment_box::before,
.woocommerce-checkout #payment div.payment_box::before {
content: none !important;
}
.woocommerce-checkout #payment div.payment_box p {
display: none;
}
.woocommerce .woocommerce-checkout h3 {
font-size: 22px;
font-weight: 500;
margin: 0 0 20px 0;
padding: 0;
}
.woocommerce .woocommerce-checkout .form-row {
margin: 0;
padding: 0 0 35px 0;
display: block;
flex-wrap: nowrap;
}
.woocommerce .woocommerce-checkout label {
display: inline-block;
font-size: 16px;
font-weight: 500;
margin-bottom: 10px;
line-height: normal !important;
}
.woocommerce .woocommerce-checkout label span.required {
color: #000000;
font-size: 12px;
}
.woocommerce .woocommerce-checkout input.input-text {
height: 45px;
line-height: 45px;
color: #0f0f0f;
font-size: 14px;
font-weight: 500;
padding: 0 15px;
width: 100%;
border-radius: 5px;
border: none;
background-color: #F9F9F9;
}
.woocommerce .woocommerce-checkout textarea {
height: 120px !important;
color: #0f0f0f;
font-size: 16px;
font-weight: 400;
padding: 15px !important;
width: 100%;
resize: none;
border-radius: 5px !important;
border: none !important;
background-color: #f9f9f9 !important;
}
.woocommerce-checkout form.woocommerce-checkout .product-name .variation{
margin-top: 5px;
}
.woocommerce-checkout form.woocommerce-checkout .product-name .variation dt{
display: flex;
font-size: 13px !important;
font-weight: 600;
color: var(--main-color);
float: none;
padding: 5px 0 0 0;
margin: 0;
}
.woocommerce-checkout form.woocommerce-checkout .product-name .variation dt:first-of-type{
padding-top: 0;
}
.woocommerce-checkout form.woocommerce-checkout .product-name .variation dd,
.woocommerce-checkout form.woocommerce-checkout .product-name .variation dd p{
color: #999999;
font-size: 13px !important;
font-weight: 500;
}
.select2-container {
width: 100% !important;
}
.select2-container--default .select2-selection--single {
position: relative;
height: 45px;
line-height: 45px;
color: #0f0f0f;
font-size: 16px;
font-weight: 400;
padding: 0 15px;
width: 100%;
border-radius: 10px;
border: none;
background-color: #f9f9f9;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
padding: 0;
margin: 0;
color: #0f0f0f;
line-height: 45px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
border-color: #0f0f0f transparent transparent transparent;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
right: 19px;
width: auto;
height: 45px;
}
.select2-dropdown {
border: none;
border-radius: 0;
background-color: #f9f9f9;
}
.select2-container--default .select2-search--dropdown .select2-search__field {
padding: 5px 15px;
border: none;
border-radius: 0;
background-color: #f9f9f9;
}
.select2-search--dropdown {
padding: 0 15px;
}
.select2-results__option {
font-size: 16px;
font-weight: 400;
padding: 5px 10px;
margin: 0 5px;
border-radius: 8px;
}
.woocommerce form .form-row .required {
color: var(--blue-color);
font-size: 12px;
}
.woocommerce form .form-row.woocommerce-validated .select2-container,
.woocommerce form .form-row.woocommerce-validated input.input-text,
.woocommerce form .form-row.woocommerce-validated select {
border-color: #000000;
}
.woocommerce-password-strength.bad,
.woocommerce-password-strength.short {
color: var(--white-color);
font-size: 16px;
font-weight: 500;
border-radius: 8px;
margin-top: 5px;
background-color: #e6130f;
border-color: #e6130f;
}
.woocommerce-password-strength.good {
color: #1c1c1f;
font-size: 16px;
font-weight: 500;
border-radius: 8px;
margin-top: 5px;
background-color: #fede01;
border-color: #fede01;
}
.woocommerce-password-strength.strong {
color: var(--white-color);
font-size: 16px;
font-weight: 500;
border-radius: 8px;
margin-top: 5px;
background-color: #1ada43;
border-color: #1ada43;
}
.woocommerce form .show-password-input,
.woocommerce-page form .show-password-input {
top: 10px;
right: 15px;
}
.select2-container--default .select2-results__option[aria-selected='true'],
.select2-container--default .select2-results__option[data-selected='true'] {
color: var(--white-color);
background-color: #000000;
}
#add_payment_method #payment,
.woocommerce-cart #payment,
.woocommerce-checkout #payment {
margin: 0;
border: none;
padding: 20px;
border-radius: 5px;
border: none;
background: #f9f9f9;
}
#add_payment_method #payment ul.payment_methods li img,
.woocommerce-cart #payment ul.payment_methods li img,
.woocommerce-checkout #payment ul.payment_methods li img {
height: 20px;
margin: 0 0 0 10px;
}
.woocommerce-checkout #payment ul.payment_methods li {
line-height: normal;
font-size: 18px;
margin-bottom: 15px;
}
.woocommerce-checkout #payment ul.payment_methods li:last-of-type {
margin-bottom: 0;
}
.woocommerce-checkout #payment ul.payment_methods li label {
cursor: pointer;
margin-bottom: 0;
}
#add_payment_method #payment ul.payment_methods,
.woocommerce-cart #payment ul.payment_methods,
.woocommerce-checkout #payment ul.payment_methods {
padding: 0;
margin: 0;
border: none;
}
.woocommerce-checkout #payment ul.payment_methods li input {
cursor: pointer;
margin-right: 5px !important;
}
.woocommerce table.shop_table {
padding: 0;
border: none;
margin: 0 0 30px 0;
border-radius: 10px;
}
.woocommerce table.shop_table strong {
font-weight: 400;
}
.woocommerce table.shop_table tbody {
display: block;
margin-bottom: 0;
padding-bottom: 15px;
border-bottom: 1px solid #e1e1e1;
}
.woocommerce table.shop_table thead {
display: none;
}
.woocommerce table.shop_table thead th {
padding: 15px 25px;
font-size: 16px;
font-weight: 500;
text-transform: uppercase;
}
.woocommerce table.shop_table tbody tr.cart_item{
display: flex;
width: 100%;
margin-bottom: 15px;
padding-bottom: 15px;
border-bottom: 1px solid #dedede;
}
.woocommerce table.shop_table tbody tr.cart_item:last-of-type{
padding-bottom: 0;
border-bottom: 0;
margin-bottom: 0;
}
.woocommerce table.shop_table tfoot th,
.woocommerce table.shop_table tfoot td,
.woocommerce table.shop_table tfoot label {
font-size: 16px !important;
font-weight: 500 !important;
font-style: var(--primary-font);
}
.woocommerce table.shop_table tfoot tr {
display: flex;
width: 100%;
align-items: center;
margin-bottom: 0;
justify-content: space-between;
}
.woocommerce ul#shipping_method .amount{
color: var(--gray-color);
font-weight: 600 !important;
}
.woocommerce table.shop_table tfoot .shipping-details{
color: var(--gray-color);
font-weight: 500;
margin-bottom: 20px;
}
.woocommerce table.shop_table tbody .product-name {
display: flex;
padding: 0 0 0 10px;
color: var(--black-color);
font-size: 15px;
font-weight: 500;
flex-direction: column;
}
.woocommerce table.shop_table tbody .product-name p {
font-size: 16px;
font-weight: 500;
color: var(--neutral-grey-60);
}
.woocommerce table.shop_table tbody .product-name strong {
color: var(--black-color);
font-size: 15px;
font-weight: 500;
}
.woocommerce table.shop_table tbody .product-total {
text-align: right;
margin-left: auto;
}
.woocommerce table.shop_table tbody .product-total span {
font-size: 15px;
font-weight: 500;
color: #999999;
}
.woocommerce table.shop_table td a,
.woocommerce table.shop_table tbody th a {
color: var(--black-color);
padding: 0;
margin: 0;
text-decoration: underline;
background-color: transparent;
}
.woocommerce table.shop_table tbody .product-name {
padding-right: 0 !important;
}
.woocommerce table.shop_table td.product-thumbnail .woocommerce table.shop_table tfoot tr.cart-subtotal {
display: none;
}
.woocommerce table.shop_table tfoot tr.order-total {
position: relative;
margin-top: 20px;
}
.woocommerce table.shop_table tfoot tr.order-total td {
position: absolute;
top: 0;
right: 0;
}
.woocommerce table.shop_table tfoot .cart-discount td {
display: flex;
}
.woocommerce table.shop_table td.product-thumbnail{
border-radius: 12px;
text-align: center;
border: none;
background-color: #F9F9F9;
}
.woocommerce table.shop_table td.product-thumbnail img {
padding: 0 !important;
margin: 0 !important;
object-fit: contain !important;
height: 80px !important;
width: 80px !important;
max-width: 80%;
border-radius: 15px;
object-position: center center !important;
}
.order-number,
.order-date,
.order-status {
color: var(--white-color);
background-color: #000000;
}
.woocommerce-orders-table tbody td.woocommerce-orders-table__cell-order-actions,
.woocommerce-orders-table thead th.woocommerce-orders-table__header-order-actions {
display: none;
}
.woocommerce table.shop_table td,
.woocommerce table.shop_table tbody th {
font-size: 16px;
font-weight: 400;
border-top: none;
padding: 0;
line-height: normal;
}
.woocommerce table.shop_table tfoot td strong {
font-weight: 500 !important;
}
.woocommerce table.shop_table tfoot th {
display: block;
font-weight: 500 !important;
margin-right: -2px !important;
}
.woocommerce table.shop_table tfoot td {
font-weight: 500 !important;
}
.woocommerce table.shop_table tfoot td,
.woocommerce table.shop_table tfoot th {
font-size: 16px;
padding: 0;
margin: 0;
border: none;
line-height: normal;
}
.woocommerce-checkout form.woocommerce-checkout .woocommerce-checkout-review-order .woocommerce-message {
color: #1ada43;
}
.woocommerce-checkout form.woocommerce-checkout .woocommerce-checkout-review-order .woocommerce-error {
margin-bottom: 10px;
}
.woocommerce-form-coupon-toggle {
display: none!important;
height: 0!important
}
.woocommerce form.checkout_coupon {
display: block!important;
padding: 15px;
margin: 0 0 25px 0;
border: none;
border-radius: 5px;
background-color: #F9F9F9;
}
.woocommerce form.checkout_coupon .form-row {
float: left;
width: auto;
margin: 0;
padding: 0
}
.woocommerce form.checkout_coupon .form-row:last-of-type {
margin: 0 0 0 20px;
width: auto
}
.woocommerce form.checkout_coupon p {
font-size: 14px;
font-weight: 500;
color: #525252;
padding: 0;
margin: 0 0 15px 0;
line-height: 1.6
}
.woocommerce form.checkout_coupon input {
height: 40px !important;
line-height: 40px !important;
color: #4c596a;
font-size: 16px;
font-weight: 500;
padding: 0 15px;
width: 100%;
border-radius: 5px;
border: none;
background-color: #ffffff !important;
}
.woocommerce form.checkout_coupon button.button {
color: var(--white-color);
font-size: 12px;
font-weight: 600;
display: inline-block;
height: 40px;
padding: 0 20px;
line-height: 40px;
border-radius: 5px;
text-decoration: none;
border: none;
width: 100%;
margin-bottom: 0;
letter-spacing: 0;
text-transform: uppercase;
background-color: var(--main-color);
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out
}
.woocommerce form.checkout_coupon button.button:hover {
background-color: #333333;
}
.woocommerce-form-coupon-toggle .woocommerce-info {
color: #000;
font-size: 18px;
border: none;
padding: 0;
display: block;
margin-bottom: 0;
border-radius: 0;
background-color: #fff0
}
.woocommerce-form-coupon-toggle .woocommerce-info a {
font-size: 18px;
color: #fec812;
text-decoration: none
}
.woocommerce-form-coupon-toggle .woocommerce-info::before,.woocommerce-form-coupon-toggle .woocommerce-info::after {
content: none
}
.woocommerce-checkout form.woocommerce-checkout {
padding: 0;
gap: 30px;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
}
.woocommerce-checkout form.woocommerce-checkout #customer_details {
width: 60%;
}
.woocommerce-checkout form.woocommerce-checkout #order_review {
width: 40%;
}
.woocommerce-checkout form.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout form.woocommerce-checkout .col2-set .col-2 {
padding: 0 !important;
float: none !important;
width: 100% !important;
-ms-flex: 0 0 100% !important;
flex: 0 0 100% !important;
max-width: 100% !important;
}
.select2-container--default .select2-selection--single .select2-selection__clear,
.select2-search--dropdown {
display: none !important;
}
.woocommerce-checkout form.woocommerce-checkout #checkout-radio .woocommerce-input-wrapper {
padding: 25px;
display: block;
border-radius: 8px;
background-color: #f7f8fa;
}
.woocommerce-checkout form.woocommerce-checkout #checkout-radio .woocommerce-input-wrapper input {
float: left;
}
.woocommerce-checkout form.woocommerce-checkout #checkout-radio .woocommerce-input-wrapper label {
cursor: pointer;
padding: 0;
margin: 0;
}
.woocommerce-checkout form.woocommerce-checkout input[type='radio'] {
background-color: transparent !important;
border: 1px solid #c4c4c4 !important;
border-radius: 50% !important;
cursor: pointer !important;
display: inline-block !important;
height: 15px !important;
margin-right: 5px !important;
margin-top: 0 !important;
margin-bottom: -4px !important;
margin-left: 0 !important;
position: relative !important;
width: 15px !important;
}
.woocommerce-checkout form.woocommerce-checkout input[type='radio']:after {
background-color: transparent;
border-radius: 25px;
content: '';
display: block;
height: 10px;
left: 3px;
position: relative;
top: 3px;
width: 10px;
}
.woocommerce-checkout form.woocommerce-checkout input[type='radio']:checked:after {
background-color: var(--blue-color) !important;
}
.woocommerce-checkout form.woocommerce-checkout input[type='file']:focus,
.woocommerce-checkout form.woocommerce-checkout input[type='radio']:focus,
.woocommerce-checkout form.woocommerce-checkout input[type='checkbox']:focus {
outline: 0;
outline-style: none;
outline-width: 0;
}
.woocommerce-checkout form.woocommerce-checkout .col2-set .woocommerce-billing-fields #billing_tip_comanda_field input {
position: absolute !important;
width: 0px !important;
height: 0px !important;
opacity: 1;
visibility: hidden;
}
.woocommerce-checkout form.woocommerce-checkout .col2-set .woocommerce-billing-fields #billing_tip_comanda_field label.radio {
cursor: pointer;
display: inline-block !important;
font-size: 14px;
font-weight: 500;
letter-spacing: 0 !important;
color: var(--main-color);
padding: 12px 20px;
margin: 0 10px 0 0 !important;
border-radius: 12px;
background-color: transparent;
border: 1.5px solid var(--main-color);
}
.woocommerce-checkout form.woocommerce-checkout .col2-set .woocommerce-billing-fields #billing_tip_comanda_field input[type='radio']:checked+label {
color: var(--white-color);
background-color: var(--main-color);
}
.woocommerce-checkout #payment div.form-row {
padding: 0;
margin: 0;
}
.woocommerce-checkout #payment div.form-row p {
color: #999999;
font-size: 14px;
font-weight: 500;
padding: 0;
margin: 0;
line-height: 1.6;
}
.woocommerce-checkout #payment div.form-row p label{
font-size: 14px;
font-weight: 500;
}
.woocommerce-checkout #payment div.form-row p a {
color: var(--black-color);
text-decoration: underline;
}
.woocommerce #payment #place_order,
.woocommerce-page #payment #place_order {
color: var(--white-color) !important;
font-size: 14px;
font-weight: 500;
display: inline-block;
height: 50px;
padding: 0;
line-height: 50px;
border-radius: 5px;
text-decoration: none;
border: none;
width: 100%;
margin-bottom: 0;
letter-spacing: 0;
text-transform: none;
text-transform: uppercase;
background-color: var(--black-color);
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
}
.woocommerce-invalid #terms {
outline: none;
outline-offset: 0;
}
.woocommerce form .form-row.woocommerce-invalid label {
color: #e6130f;
}
.woocommerce form .form-row.woocommerce-invalid .select2-container,
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select {
border-color: #e6130f;
}
.woocommerce-billing-fields__field-wrapper {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;
}
#billing_country_field {
display: none;
}
.woocommerce-billing-fields__field-wrapper p.form-row {
padding-left: 15px !important;
padding-right: 15px !important;
float: none !important;
width: 100% !important;
-ms-flex: 0 0 50% !important;
flex: 0 0 50% !important;
max-width: 50% !important;
}
.woocommerce-checkout .woocommerce-NoticeGroup {
position: relative;
width: 100%;
padding-right: 15px;
padding-left: 15px;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
ul.paynet-awailable-options.active {
display: none !important;
}
.toggle-paynet-options {
display: none !important;
}
/* Request quote */
.page-id-214 main{
margin: 70px 0;
}
.page-id-214 .woocommerce-notices-wrapper{
display: flex;
justify-content: space-between;
}
.page-id-214 .woocommerce-notices-wrapper form{
order: 1;
width: 35%;
}
.page-id-214 .woocommerce-notices-wrapper div{
width: 60%;
}
.woocommerce .woocommerce-notices-wrapper div form.wtwraq-request-quote-form{
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.woocommerce .woocommerce-notices-wrapper div form.wtwraq-request-quote-form p.form-row label{
font-size: 16px;
font-weight: 500;
margin-bottom: 10px;
color: var(--black-color);
}
.woocommerce .woocommerce-notices-wrapper div form.wtwraq-request-quote-form p.form-row label span.wtwraq-mandatory{
color: var(--blue-color);
}
.woocommerce .woocommerce-notices-wrapper div form.wtwraq-request-quote-form p.form-row span.woocommerce-input-wrapper input{
height: 45px;
line-height: 45px !important;
color: #0f0f0f;
font-size: 16px;
font-weight: 400;
padding: 0 15px;
width: 100%;
border-radius: 10px;
border: none;
background-color: #F1F2F4;
}
.woocommerce .woocommerce-notices-wrapper div form.wtwraq-request-quote-form p.form-row span.woocommerce-input-wrapper textarea{
height: 120px !important;
color: #0f0f0f;
font-size: 16px;
font-weight: 400;
padding: 15px;
width: 100%;
resize: none;
border-radius: 10px;
border: none;
background-color: #F1F2F4;
}
.woocommerce .woocommerce-notices-wrapper div form.wtwraq-request-quote-form p.form-row:nth-of-type(1),
.woocommerce .woocommerce-notices-wrapper div form.wtwraq-request-quote-form p.form-row:nth-of-type(2){
width: 50%;
width: calc(50% - 10px);
}
.woocommerce .woocommerce-notices-wrapper div form.wtwraq-request-quote-form p.form-row:nth-of-type(3),
.woocommerce .woocommerce-notices-wrapper div form.wtwraq-request-quote-form p.form-row:nth-of-type(4){
width: 100%;
}
.woocommerce .woocommerce-notices-wrapper div form.wtwraq-request-quote-form input[type=submit]{
font-size: 14px;
font-weight: 500;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 20px;
width: auto;
height: 50px;
border-radius: 50px;
text-decoration: none;
text-transform: uppercase;
color: var(--white-color);
background-color: var(--blue-color);
}
.woocommerce .woocommerce-notices-wrapper form table.wtwraq-request-quote-product-list tbody tr:last-of-type{
display: none;
}
.woocommerce .woocommerce-notices-wrapper form table.wtwraq-request-quote-product-list tbody tr{
display: flex;
align-items: center;
margin-bottom: 15px;
}
.woocommerce .woocommerce-notices-wrapper form table.wtwraq-request-quote-product-list tbody tr td.product-remove{
order: 1;
padding: 0 0 0 10px;
}
.woocommerce .woocommerce-notices-wrapper form table.wtwraq-request-quote-product-list tbody tr td.product-remove a{
text-decoration: none;
color: var(--blue-color) !important;
}
.woocommerce .woocommerce-notices-wrapper form table.wtwraq-request-quote-product-list tbody tr td.product-remove a:hover{
color: var(--hover-color) !important;
background-color: var(--blue-color);
}
.woocommerce .woocommerce-notices-wrapper form table.wtwraq-request-quote-product-list tbody tr td.product-name {
display: block;
padding: 0 0 0 10px;
color: var(--black-color);
}
.woocommerce .woocommerce-notices-wrapper form table.wtwraq-request-quote-product-list tbody tr td.product-name a{
text-decoration: none;
}
.woocommerce .woocommerce-notices-wrapper form table.wtwraq-request-quote-product-list tbody tr td.product-quantity{
min-width: auto;
margin: 0 0 0 auto;
}
/* Order Received */
.woocommerce-order-details h2.woocommerce-order-details__title,
.woocommerce-customer-details h2.woocommerce-column__title {
font-size: 22px;
font-weight: 500;
margin: 0 0 20px 0;
padding: 0;
}
.woocommerce table.shop_table td.woocommerce-table__product-name a {
pointer-events: none;
color: #1c1c1f;
text-decoration: none;
}
.woocommerce-order-received .woocommerce-thankyou-order-received {
font-size: 16px;
font-weight: 400;
color: #000000;
}
.woocommerce-order-received .woocommerce-order-details .shop_table {
padding: 25px;
border-radius: 5px;
margin-bottom: 15px;
background-color: #f9f9f9;
}
.woocommerce-order-received .woocommerce-order-details .shop_table:last-of-type {
margin-bottom: 0;
}
.woocommerce-order-received table.shop_table tbody {
border-bottom: 0;
margin-bottom: 0;
}
.woocommerce-order-received table.shop_table tbody .product-name {
padding: 0;
}
.woocommerce-order-received table.shop_table tbody tr.order_item .wc-item-meta {
display: none;
}
.woocommerce-order-received table.shop_table tbody tr.order_item td,
.woocommerce-order-received table.shop_table tbody tr.order_item th,
.woocommerce-order-received table.shop_table tbody tr.order_item strong {
font-size: 16px !important;
font-weight: 500 !important;
}
.woocommerce-order-received table.shop_table tfoot th,
.woocommerce-order-received table.shop_table tfoot td {
font-weight: 400 !important;
}
.woocommerce-order-received .woocommerce-order-details .woocommerce-table tbody tr {
display: flex;
padding-bottom: 10px;
align-items: center;
justify-content: space-between;
}
.woocommerce-order-received .woocommerce-order-details .woocommerce-table tbody tr:last-of-type {
margin-bottom: 0;
}
.woocommerce ul.order_details {
margin: 25px 0 25px 0;
padding: 0;
}
.woocommerce ul.order_details li {
color: var(--blue-color);
font-size: 16px;
font-weight: 500;
text-transform: none;
border: none;
padding: 20px;
border-radius: 5px;
background-color: #f9f9f9;
}
.woocommerce ul.order_details li:last-of-type {
margin-right: 0;
}
.woocommerce ul.order_details li strong {
font-size: 16px;
font-weight: 400;
color: #000000;
margin-top: 10px;
}
.woocommerce-order-received address {
font-size: 16px;
line-height: 1.7 ;
padding: 25px !important;
margin: 0 !important;
border: none !important;
border-radius: 5px !important;
background-color: #f9f9f9 !important;
}
.woocommerce .woocommerce-customer-details .woocommerce-customer-details--phone::before,
.woocommerce .woocommerce-customer-details .woocommerce-customer-details--email::before {
content: none;
}
.woocommerce .woocommerce-customer-details .woocommerce-customer-details--email,
.woocommerce .woocommerce-customer-details .woocommerce-customer-details--phone {
padding-left: 0;
}
.woocommerce-order-received .woocommerce-order {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-left: -15px;
margin-right: -15px;
}
.woocommerce-order-received .woocommerce-order p,
.woocommerce-order-received .woocommerce-order .woocommerce-notice,
.woocommerce-order-received .woocommerce-order .woocommerce-order-overview {
font-size: 16px;
font-weight: 400;
position: relative;
width: 100%;
padding-left: 15px;
padding-right: 15px;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.woocommerce-order-received .woocommerce-order .woocommerce-order-details,
.woocommerce-order-received .woocommerce-order .woocommerce-customer-details {
position: relative;
width: 100%;
margin: 0;
padding-left: 15px;
padding-right: 15px;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.woocommerce-order-received .woocommerce table.shop_table tbody {
padding: 0;
}
.woocommerce-checkout form.woocommerce-checkout .shop_table .product-total{
width: 15%;
text-align: right;
}
.woocommerce-checkout form.woocommerce-checkout .product-thumbnail{
width: 15%;
height: 85px;
border: none;
}
.woocommerce-checkout form.woocommerce-checkout .product-name{
width: 70%;
}
.woocommerce td.product-name dl.variation {
margin: 0;
padding-left: 0;
border-left: none;
}
.woocommerce td.product-name dl.variation dt {
color: var(--gray-color);
font-weight: 500;
padding: 0 0 5px;
margin: 0 4px 0 0;
clear: left;
}
.woocommerce td.product-name dl.variation dd {
margin: 0;
padding: 0;
float: left;
}
.woocommerce table.shop_table tbody .product-name p {
font-size: 16px !important;
font-weight: 500;
margin: 0 0 5px 0;
line-height: normal;
}
/* Loader UI */
.blockUI.blockOverlay{
opacity: 1 !important;
background: rgba(0,0,0,.5) !important;
}
.blockUI.blockOverlay::before{
border: 5px solid #ffffff !important;
border-radius: 50% !important;
border-top: 5px solid #000000 !important;
width: 50px !important;
height: 50px !important;
background-image: none !important;
-webkit-animation: spin 2s linear infinite !important;
animation: spin 2s linear infinite !important;
background-color: transparent !important;
}
/* ============================================== */
/* ================ footer styles =============== */
/* ============================================== */
.main-footer {
position: relative;
background-color: var(--main-color);
}
.footer-logo{
margin-bottom: var(--s-20-clamp);
}
.footer-logo img{
height: 55px;
width: auto;
}
.footer-top {
padding-top: 50px;
padding-bottom: 50px;
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.footer-text h4,
.footer-navigation h4 {
font-size: 20px;
color: #ffffff;
font-weight: 500;
margin-bottom: 20px;
}
.footer-navigation ul {
margin: 0;
padding: 0;
list-style: none;
}
.footer-navigation ul li {
margin-bottom: 15px;
}
.footer-navigation ul li:last-of-type {
margin-bottom: 0;
}
.footer-navigation ul li a{
color: rgba(255, 255, 255, 0.6);
font-size: 15px;
font-weight: 400;
text-decoration: none;
}
.footer-navigation ul li a:hover{
color: var(--white-color);
}
.footer-text p{
font-size: 14px;
color: #ffffff;
}
.footer-text .site-button a span{
color: var(--black-color);
}
.footer-text .site-button a{
height: 45px;
padding: 0 20px;
margin-top: 10px;
background-color: var(--white-color);
}
.footer-bottom {
padding: 20px 0;
}
.footer-links {
gap: 15px;
display: flex;
align-items: center;
justify-content: flex-end;
}
.footer-links a {
font-size: 14px;
color: #ffffff90;
text-decoration: none;
}
.footer-links a:hover {
color: var(--white-color);
}
.footer-social-block{
margin-top: var(--s-20-clamp);
}
.footer-social-block ul {
display: flex;
gap: 10px;
padding: 0;
margin: 0;
list-style: none;
justify-content: flex-start;
}
.footer-social-block ul li {
display: flex;
align-items: center;
justify-content: center;
}
.footer-social-block ul li a{
display: flex;
align-items: center;
justify-content: center;
height: 35px;
width: 35px;
border-radius: var(--border-r-50);
border: var(--border-basic) rgba(255, 255, 255, 0.50);
}
.footer-social-block ul li svg {
height: 15px;
width: 15px;
}
.footer-contact-block{
gap: 10px;
display: flex;
flex-direction: column;
}
.footer-contact-block a{
font-size: 15px;
color: #ffffff90;
text-decoration: none;
}
.footer-contact-block a:hover{
color: var(--white-color);
}
.footer-contact-block p{
color: var(--white-color);
}
.footer-copyright p{
font-size: 14px;
color: #ffffff90;
}
.footer-privacy {
gap: var(--gap-30-clamp);
display: flex;
align-items: center;
justify-content: end;
}
.footer-links {
gap: var(--gap-30-clamp);
display: flex;
align-items: center;
}
.footer-span span {
border: 1px solid rgba(153, 153, 153, 0.3);
}
.footer-links a {
font-size: 14px;
font-weight: 400;
color: #ffffff90;
text-decoration: none;
}
.footer-links a:hover {
color: var(--white-color);
}
.footer-icons {
display: flex;
align-items: center;
gap: 10px;
}
.footer-icon-holder {
display: block;
height: 20px;
}
.footer-icon-holder svg {
width: auto;
height: 20px;
}
/* ============================================== */
/* ================ dinotte styles =============== */
/* ============================================== */
/* New Code */
/* Marquee */
.marquee {
display: flex;
flex-direction: column;
justify-content: center;
width: var(--width-100);
overflow: hidden;
height: 150px;
background-color: var(--white-color);
}
.marquee__content {
display: flex;
animation: scrolling 40s linear infinite;
list-style: none;
margin: 0;
padding: 0;
}
.marquee:hover .marquee__content{
animation-play-state: paused;
}
@keyframes scrolling {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-100%);
}
}
.marquee__content li {
display: flex;
align-items: center;
justify-content: center;
font-size: var(--font-marque-clamp);
flex-shrink: 0;
padding: 0 15px;
font-weight: 600;
white-space: nowrap;
}
.marquee__content li figure {
display: flex;
align-items: center;
width: 20px;
height: 20px;
}
.marquee__content li figure img {
width: var(--width-100);
height: var(--height-100);
object-fit: contain;
object-position: center center;
}
/* Images Slider */
.images-slider figure{
height: 480px;
}
.images-slider figure img{
width: var(--width-100);
height: var(--height-100);
object-fit: cover;
object-position: center center;
border-radius: var(--border-r-25);
}
.images-slider .swiper-pagination {
width: 5%;
height: 25px;
display: flex;
padding: 0 15px;
align-items: center;
margin: 0 !important;
justify-content: center;
inset: auto auto 15px 50%;
background-color: #ECF0F9;
transform: var(--transform-X50);
border-radius: var(--border-r-50);
}
.images-slider .swiper-pagination-bullet {
opacity: 0.5;
background: var(--main-color);
border-radius: var(--border-r-50);
}
.images-slider .swiper-pagination-bullet-active {
opacity: 1;
}
/* Onsale Products */
.onsale-products__heading{
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: var(--s-40-clamp);
}
.onsale-products__heading h2{
font-size: var(--font-h2-clamp);
font-weight: 500;
}
.onsale-products-holder{
grid-template-columns: repeat(4, 1fr) !important;
}
/* Category block */
:root{
--category-block-image-h-clamp: 40px 80px;
--category-block-m-clamp: 5px 15px;
}
.category-block{
gap: 30px;
display: grid;
max-width: 100%;
overflow-x: auto;
margin-top: var(--s-40-clamp);
grid-template-columns: repeat(6, 1fr);
}
.category-block__item{
text-align: center;
background-color: #F9F9F9;
border-radius: var(--border-r-100);
padding: var(--s-20-clamp) var(--s-25-clamp);
}
.category-block__item a{
text-decoration: none;
}
.category-block__item-image figure{
height: var(--category-block-image-h-clamp);
}
.category-block__item-image figure img{
width: var(--width-100);
height: var(--height-100);
object-fit: contain;
object-position: center center;
}
.category-block__item-title{
margin: var(--category-block-m-clamp) 0 0 0;
}
.category-block__item-title h3{
font-weight: 500;
font-family: var(--primary-font);
font-size: var(--font-h5-clamp);
}
/* Partners Block */
.partners-block__heading h2{
font-size: 16px;
font-weight: 700;
text-align: center;
text-transform: uppercase;
}
.partners-block__wrapper{
display: grid;
margin-top: 50px;
gap: var(--gap-120-clamp);
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.partners-block__item figure{
height: 70px;
width: auto;
}
.partners-block__item figure img{
width: var(--width-100);
height: var(--height-100);
object-fit: contain;
object-position: center center;
}
/* Single product */
.single-product-form .site-button{
width: var(--width-100);
}
.single-product-form .site-button.woocommerce-variation-add-to-cart-disabled a.btn{
opacity: .3;
cursor: not-allowed;
pointer-events: none;
}
/* Product Atribute Block */
.product-attributes{
gap: 15px;
display: flex;
margin-bottom: 25px;
flex-direction: column;
}
.product-attributes__item{
gap: 10px;
display: flex;
flex-direction: column;
}
.product-attributes__item label{
font-size: var(--font-15px-clamp);
font-weight: 500;
}
.product-attributes__item select{
position: relative;
padding: 12px 15px;
color: rgba(35, 40, 67, 0.8);
border-radius: var(--border-r-10);
border: var(--border-basic) #23284310;
appearance: none;
background-image: url('data:image/svg+xml,');
background-color: #ffffff;
background-repeat: no-repeat;
background-position: right 15px top 50%;
background-size: 14px 8px;
}
.product-button .site-button{
width: var(--width-100);
}
/* Product Icon block */
.product-box-info{
gap: 10px;
display: grid;
padding: 20px 15px;
align-items: start;
margin: 0 0 25px 0;
border-radius: var(--border-r-5);
background-color: #ffffff;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}
.product-box-info__item{
gap: 10px;
display: flex;
align-items: flex-start;
flex-direction: column;
justify-content: center;
}
.product-box-info__item svg{
width: 40px;
height: 40px;
}
.product-box-info__item p{
font-size: var(--font-13px-clamp);
font-weight: 500;
text-align: center;
color: rgba(35, 40, 67, 0.8);
}
/* Product Accordion Block */
.product-accordion-block{
margin: 35px 0 0 0;
}
.product-accordion-block__item:hover{
cursor: pointer;
}
.product-accordion-block__item .product-accordion-block__item-caption::after{
content: '';
position: absolute;
top: 50%;
right: 0;
width: 14px;
height: 14px;
transform: var(--transform-Y50);
transition: var(--basic-transition);
background: url('assets/images/accordion-plus-icon.svg');
background-repeat: no-repeat;
}
.product-accordion-block__item.active .product-accordion-block__item-caption::after{
background: url('assets/images/accordion-minus-icon.svg');
}
.product-accordion-block__item-caption{
position: relative;
padding: 20px 0;
border-top: 1px solid rgba(35, 40, 67, 0.2);
}
.product-accordion-block .product-accordion-block__item:last-child{
border-bottom: 1px solid rgba(35, 40, 67, 0.2);
}
.product-accordion-block__item-caption h4{
font-size: 14px;
font-weight: 500;
}
.product-accordion-block__item-content h4{
margin-bottom: 15px;
}
.product-accordion-block__item-content{
margin-bottom: 25px;
}
.product-accordion-block__item-content p a,
.product-accordion-block__item-content li a{
opacity: .6;
display: inline-flex;
align-items: center;
padding-right: 20px;
text-decoration: none;
background-repeat: no-repeat;
background-position: center right;
background-size: 12px 12px;
border-bottom: 1px solid rgba(0, 0, 0, 0.6);
background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M369.777 512H85.333c-22.795 0-44.224-8.877-60.34-24.995C8.876 470.888 0 449.458 0 426.666V142.222C0 119.428 8.877 98 24.994 81.883c16.116-16.117 37.545-24.994 60.34-24.994H199.11c15.711 0 28.445 12.735 28.445 28.445s-12.734 28.444-28.445 28.444H85.333c-7.598 0-14.74 2.959-20.112 8.331-5.372 5.372-8.332 12.515-8.332 20.113v284.444c0 7.598 2.96 14.741 8.332 20.114 5.371 5.371 12.514 8.331 20.112 8.331h284.443c7.598 0 14.74-2.959 20.113-8.333 5.372-5.371 8.331-12.515 8.331-20.113V312.889c0-15.711 12.735-28.444 28.445-28.444s28.446 12.734 28.446 28.444v113.777c0 22.794-8.877 44.222-24.995 60.34C413.998 503.123 392.569 512 369.777 512ZM199.111 341.332c-7.28 0-14.559-2.776-20.113-8.33-11.108-11.108-11.108-29.12 0-40.227L414.883 56.889H312.889c-15.711 0-28.444-12.734-28.444-28.444C284.445 12.735 297.178 0 312.889 0h170.666a28.36 28.36 0 0 1 19.87 8.092l.002.002.056.056.017.016.043.043.029.03.032.031.061.062.062.061.031.032.029.029a.667.667 0 0 1 .059.06l.056.057.002.002a28.366 28.366 0 0 1 8.092 19.87V199.11c0 15.711-12.735 28.445-28.446 28.445-15.71 0-28.443-12.734-28.443-28.445V97.116L219.219 333.003c-5.549 5.554-12.828 8.329-20.108 8.329Z' fill='%23000'/%3E%3C/svg%3E");
}
.product-accordion-block__item-content p a:hover,
.product-accordion-block__item-content li a:hover{
opacity: 1;
}
.product-accordion-block__item-content p{
font-size: 15px;
font-weight: 400;
margin-top: 15px;
}
.product-accordion-block__item-content p:first-of-type{
margin: 0;
}
.product-accordion-block__item-content strong,
.product-accordion-block__item-content b{
font-weight: 500;
}
.product-accordion-block__item-content hr{
padding: 0;
margin: 15px 0;
border: none;
width: 100%;
height: 1px;
background-color: rgba(35, 40, 67, 0.2);
}
.product-accordion-block__item-content h3{
margin-bottom: 10px;
}
.product-accordion-block__item-content ul{
margin: 15px 0 0 0;
padding: 0;
list-style: none;
}
.product-accordion-block__item-content ul li{
font-size: 15px;
font-weight: 400;
padding: 0 0 0 25px;
margin-bottom: 15px;
line-height: 1.6;
background-position: left 3px;
background-size: 14px 20px;
background-repeat: no-repeat;
background-image: url('data:image/svg+xml,');
}
.product-accordion-block__item-content p b,
.product-accordion-block__item-content p strong,
.product-accordion-block__item-content ul li strong,
.product-accordion-block__item-content ul li b{
font-weight: 500;
}
.product-accordion-block__item-content table thead tr td{
font-weight: 500;
}
.product-accordion-block__item-content table thead tr td,
.product-accordion-block__item-content table tbody tr td{
font-size: 14px;
padding: 0 10px 10px 10px;
width: auto;
}
.product-accordion-block__item-content table tbody tr td{
}
.product-properties{
gap: 10px;
display: grid;
align-items: start;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}
.product-accordion-block__item-icon{
gap: 10px;
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
}
.product-accordion-block__item-icon svg{
width: 40px;
height: 40px;
}
.product-accordion-block__item-icon p{
font-size: 12px;
font-weight: 400;
text-align: center;
color: rgba(35, 40, 67, 0.8);
}
/* Product Archive Page */
.product-button a{
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
background-color: transparent;
border-radius: var(--border-r-50);
border: var(--border-basic) rgba(1, 1, 1, 0.50);
}
.product-button a:hover{
background-color: var(--black-color);
border-color: var(--black-color);
}
.product-button a svg{
width: 13px;
height: 13px;
}
.product-button a:hover svg path{
fill: var(--white-color);
}
/* Product Form Popup */
.product-block-modal-active .product-block-modal-holder {
display: block;
}
.product-block-modal-holder {
display: none;
z-index: 9;
position: fixed;
top: 50%;
left: 50%;
width: auto;
-ms-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.product-block-content {
max-width: 600px;
margin: 0 auto;
position: relative;
}
body.product-block-modal-open {
overflow: hidden;
}
.product-block-modal-open .site-overlay {
opacity: 1;
visibility: visible;
}
.product-block-close {
top: -30px;
right: -30px;
z-index: 99;
position: absolute;
}
.product-close {
cursor: pointer;
display: block;
width: 25px;
height: 25px;
text-align: center;
margin-left: auto;
}
.product-close::before,
.product-close::after {
position: absolute;
content: ' ';
height: 25px;
width: 2px;
background-color: var(--white-color);
}
.product-close::before {
transform: rotate(45deg);
}
.product-close::after {
transform: rotate(-45deg);
}
.product-block-form {
color: var(--black-color);
padding: 40px;
text-align: center;
border-radius: var(--border-r-10);
background-color: #ffffff;
}
.product-block-form h3{
font-size: var(--font-h4-clamp);
font-weight: 600;
margin-bottom: 15px;
}
.product-block-content p:last-of-type {
margin-bottom: 0;
}
.product-block-form p{
font-size: var(--font-16px-clamp);
font-weight: 400;
margin-bottom: 15px;
color: rgba(35, 40, 67, 0.8);
}
/* Product Contact Form */
.site-request-form .site-row{
justify-content: center;
}
.product-contact-form br {
display: none;
}
.product-contact-form .wpcf7-spinner {
display: none;
}
.product-contact-form .wpcf7-response-output {
display: none;
}
.product-contact-form .wpcf7 .sent .wpcf7-response-output {
color: #46b450;
font-size: 16px;
font-weight: 400;
display: block;
position: absolute;
left: 15px;
right: 0;
text-align: center;
padding: 10px 0 0 0 !important;
}
.product-contact-form .wpcf7-not-valid-tip {
font-size: 14px;
position: static;
text-align: left;
}
.product-contact-form .wpcf7 form.sent .wpcf7-response-output,
.product-contact-form .wpcf7 form.invalid .wpcf7-response-output,
.product-contact-form .wpcf7 form.unaccepted .wpcf7-response-output,
.product-contact-form .wpcf7 form.payment-required .wpcf7-response-output .product-contact-form .wpcf7 form .wpcf7-response-output {
padding: 0;
margin: 0;
border: none;
}
.product-block-form-header{
margin-bottom: 30px;
}
.product-contact-form-input {
margin-bottom: 10px;
}
.product-contact-form-input:last-of-type {
margin-bottom: 0;
}
.product-contact-form label span {
color: var(--red-color);
font-size: 12px;
}
.product-contact-form input {
font-size: 14px;
height: 45px;
line-height: 45px;
font-weight: 400;
padding: 0 15px;
margin-bottom: 15px;
width: 100%;
border: var(--border-basic) rgba(35, 40, 67, 0.1);
border-radius: var(--border-r-10);
background-color: transparent;
}
.product-contact-form .site-request-form-button{
position: relative;
}
.product-contact-form .site-request-form-button p input.wpcf7-submit{
z-index: 8;
padding: 0;
margin: 0;
height: 50px;
line-height: 50px;
font-size: var(--font-16px-clamp);
font-weight: 500;
width: 100%;
border: none;
cursor: pointer;
color: var(--white-color);
border: none;
transition: var(--basic-transition);
background-color: var(--main-color);
}
.product-contact-form .site-request-form-button:hover p input.wpcf7-submit{
background-color: var(--hover-color);
}
.site-request-form-radio {
display: flex;
margin-bottom: 15px;
justify-content: center;
}
.site-request-form-radio p{
width: var(--width-100);
}
.site-request-form-radio p .wpcf7-radio{
gap: 20px;
display: flex;
align-items: center;
}
.wpcf7-list-item {
position: relative;
display: inline-flex;
align-items: center;
width: 50%;
margin: 0;
height: 40px;
justify-content: center;
border: var(--border-basic) #2260AA10;
padding: 0 25px;
font-size: 14px;
border-radius: var(--border-r-10);
transition: var(--basic-transition);
}
.wpcf7-list-item input[type="radio"] {
position: absolute;
opacity: 0;
padding: 0;
margin: 0;
cursor: pointer;
}
.wpcf7-list-item input[type="radio"]:checked + .wpcf7-list-item-label {
color: rgba(35, 40, 67, 0.8);
}
.wpcf7-list-item.checked {
background-color: rgba(115, 95, 244, 0.05);
border: var(--border-basic) var(--purple-color);
}
/* Promo */
.promo-content{
background-color: #f9f9f9;
padding-bottom: 70px;
}
.promo-content .page-content{
padding-top: var(--s-30-clamp);
}
ul.promo-categories {
display: flex;
flex-direction: column;
gap: 15px;
margin: 0;
list-style: none;
padding: 20px;
border-radius: var(--border-r-10);
border: var(--border-basic) #2260AA10;
background-color: var(--white-color)
}
ul.promo-categories li a{
text-decoration: none;
color: #999999;
font-size: 15px;
font-weight: 500;
}
.wcpf-field-item.hidden{
display: none;
}
/* Configurator Style */
/* General Style */
.main-configurator{
height: 100%;
display: flex;
padding-top: 212.5px;
padding-bottom: 100px;
align-items: center;
justify-content: center;
background-color: #F7F9FD;
}
.step{
text-align: center;
display: none;
}
.step.active {
display: block;
}
.step h1{
z-index: 9;
position: relative;
font-size: var(--font-h1-clamp);
}
.step-block-header h2{
font-size: var(--font-h2-clamp);
margin-bottom: 50px;
}
.step-1 p{
z-index: 9;
position: relative;
margin-top: 25px;
margin-bottom: 35px;
}
.step-1 .step-block-footer{
justify-content: center;
}
.step-2 .step-block-footer{
justify-content: flex-end;
}
.step-block-body{
margin-bottom: 50px;
}
.step-6 .step-radio-style{
display: grid;
grid-template-columns: repeat(4, 1fr);
}
.step-6 .step-radio-style .radio-button{
width: 100%;
}
.step-radio-style-holder ul.products{
grid-template-columns: repeat(4, 1fr);
}
/* Progress Bar Settings */
.progress-bar-container {
gap: 5px;
display: flex;
justify-content: space-between;
width: var(--width-100);
max-width: 500px;
margin: 0 auto 50px;
}
.progress-segment {
flex: 1;
height: 4px;
background-color: #e0e6ed;
border-radius: var(--border-r-50);
transition: var(--basic-transition);
}
.progress-segment.active {
background-color: var(--main-color);
}
.progress-text {
text-align: center;
font-size: 16px;
margin-top: 10px;
}
/* Step 1 Cloud */
.step-1{
position: relative;
}
.step-1::after {
content: '';
position: absolute;
width: 265px;
height: 200px;
inset: 0 auto auto 0;
background: url('assets/images/first-cloud.png') no-repeat center center / contain;
animation: slideFromLeft 3s ease-out forwards;
}
.step-1::before {
content: '';
position: absolute;
width: 265px;
height: 200px;
inset: auto 0 0 auto;
background: url('assets/images/second-cloud.png') no-repeat center center / contain;
animation: slideFromRight 3s ease-out forwards;
}
@keyframes slideFromLeft {
from {
transform: translateX(-200%);
opacity: 0;
}
to {
transform: translateX(0);
opacity: 1;
}
}
@keyframes slideFromRight {
from {
transform: translateX(200%);
opacity: 0;
}
to {
transform: translateX(0);
opacity: 1;
}
}
/* General Button Settings */
.step-block-footer{
display: flex;
align-items: center;
justify-content: space-between;
}
.site-button-border button{
cursor: pointer;
height: 50px;
display: flex;
padding: 0 30px;
border: 0;
align-items: center;
text-decoration: none;
justify-content: center;
border-radius: var(--border-r-10);
transition: var(--basic-transition);
}
.site-button-border button span{
font-size: var(--font-16px-clamp);
font-weight: 500;
}
.site-button-border button:disabled {
opacity: 0.5;
cursor: initial;
}
/* Prev Button Settings */
.site-button-border.prev-btn button{
background-color: var(--hover-color);
}
.site-button-border.prev-btn button span{
color: #ffffff;
}
/* Next Button Settings */
.site-button-border.next-btn button{
background-color: var(--main-color);
}
.site-button-border.next-btn button span{
color: var(--white-color);
}
.site-button-border.next-btn button:not(:disabled):hover{
background-color: var(--hover-color);
}
/* Item Settings */
:root{
--item-w-clamp: 200px 300px;
--item-font-p-clamp: 12px 16px;
--item-image-clamp: 100px 150px;
--item-padding-clamp: 15px 20px;
}
.step-radio-style{
display: flex;
gap: var(--gap-20-clamp);
justify-content: center;
}
.radio-button{
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: var(--item-w-clamp);
padding: var(--item-padding-clamp);
cursor: pointer;
border-radius: var(--border-r-10);
transition: var(--basic-transition);
border: var(--border-basic) #e0e6ed;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.radio-button:hover{
border-color: var(--purple-color);
}
.radio-button.checked{
background-color: rgba(115, 95, 244, 0.05);
border-color: var(--purple-color);
}
.radio-button.checked::before{
content: '';
position: absolute;
inset: 5px 5px auto auto;
width: 20px;
height: 20px;
transition: var(--basic-transition);
background: url('data:image/svg+xml,') no-repeat center center / contain;
}
.radio-button input{
display: none;
}
.radio-button h4{
font-size: var(--font-h4-clamp);
font-weight: 600;
}
.radio-button p{
font-size: var(--item-font-p-clamp);
margin-top: var(--gap-15-clamp);
color: rgba(35, 40, 67, 0.8);
}
.radio-button figure{
width: auto;
height: var(--item-image-clamp);
margin-bottom: var(--gap-15-clamp);
}
.radio-button figure img{
width: var(--width-100);
height: var(--height-100);
object-fit: cover;
object-position: center center;
border-radius: var(--border-r-10);
}
/* ============================================== */
/* ================ responsive styles =========== */
/* ============================================== */
@media (max-width: 1440px) {
.site-container {
max-width: 1300px;
}
}
/*end*/
@media (max-width: 1300px) {
.site-container {
max-width: 1200px;
}
}
/*end*/
@media (max-width: 1200px) {
.onsale-products__heading{
margin-bottom: 25px;
}
.icons-block .icons-block-list{
margin-top: 25px;
}
.reviews-block__wrapper{
margin-top: 25px;
}
.marquee{
height: 120px;
}
.page-bottom-cta-image{
height: 450px;
}
.footer-top{
padding-top: 35px;
padding-bottom: 35px;
}
.search-content{
padding-bottom: 35px;
}
.woocommerce nav.woocommerce-pagination ul{
margin: 35px 0 0 0;
}
.icons-block-second-style .icons-block-list{
margin-top: 0;
}
.shop-content-holder{
padding-bottom: 35px;
}
.related.products{
padding: 35px 0 35px 0;
}
.site-single-product-info{
padding-bottom: 35px;
}
.woocommerce-checkout .page-content{
padding-top: 35px;
padding-bottom: 35px;
}
}
/*end*/
@media (max-width: 1100px) {
.onsale-products-holder {
grid-template-columns: repeat(3, 1fr) !important;
}
.search-content ul.products {
grid-template-columns: repeat(3, 1fr) !important;
}
.shop-content-holder .site-content ul.products{
grid-template-columns: repeat(2, 1fr);
}
.site-sidebar{
padding: 15px;
}
.related ul.products {
grid-template-columns: repeat(3, 1fr);
}
.step-radio-style-holder ul.products {
grid-template-columns: repeat(3, 1fr);
}
.nav-menu ul li{
margin-right: 15px;
}
.nav-menu ul li a{
font-size: 14px;
}
}
/*end*/
@media (max-width: 1024px) {
.step-1::before,
.step-1::after{
width: 200px;
height: 150px;
}
.woocommerce-checkout form.woocommerce-checkout{
flex-direction: column;
}
.woocommerce-checkout form.woocommerce-checkout #customer_details{
width: 100%;
}
.woocommerce-checkout form.woocommerce-checkout #order_review{
width: 100%;
}
}
/*end*/
@media (max-width: 768px) {
.nav-menu{
display: none;
}
.nav-tools,
.nav-logo{
width: 50%;
}
.nav-tools-mobile{
display: block;
}
.site-hero__background-image figure{
height: 70vh;
}
.onsale-products-holder {
grid-template-columns: repeat(2, 1fr) !important;
}
.icons-block .icons-block-list{
display: grid;
grid-template-columns: repeat(2, 1fr) !important;
}
.btn, .site-button a{
height: 45px;
padding: 0 25px;
}
.page-bottom-cta-image{
height: 350px;
}
.marquee{
height: 90px;
}
.footer-top .site-col-3,
.footer-top .site-col-2{
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.footer-top .site-col-offset-3{
margin-left: 0;
}
.footer-top .site-row{
row-gap: 30px;
}
.search-form{
width: 80%;
}
.nav-logo img{
height: 30px;
}
.product .product-item-image figure{
height: 250px;
}
.search-header form input{
height: 40px;
}
.search-content ul.products {
grid-template-columns: repeat(2, 1fr) !important;
}
/* Shop Filter Sidebar */
.products-sorting{
padding: 20px 0;
}
.shop-content-holder .site-col-9{
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.shop-content .products-sorting .woocommerce-result-count{
display: none;
}
.shop-content .products-sorting .woocommerce-ordering,
.shop-sidebar-mobile-filter{
position: relative;
width: 100%;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
}
.shop-content .products-sorting .woocommerce-ordering{
text-align: right;
}
.shop-content .shop-sidebar-mobile-filter{
display: block;
}
.shop-sidebar-filter-holder{
display: flex;
align-items: center;
justify-content: flex-start;
}
.shop-sidebar-filter-holder::before{
content: '';
width: 15px;
height: 15px;
margin-right: 5px;
display: inline-block;
background-size: contain;
background-repeat: no-repeat;
background-position: center center;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='512' height='512' x='0' y='0' viewBox='0 0 24 24' style='enable-background:new 0 0 512 512' xml:space='preserve' class=''%3E%3Cg%3E%3Cpath d='M18 13H6c-.6 0-1-.4-1-1s.4-1 1-1h12c.6 0 1 .4 1 1s-.4 1-1 1zM15 19H9c-.6 0-1-.4-1-1s.4-1 1-1h6c.6 0 1 .4 1 1s-.4 1-1 1zM21 7H3c-.6 0-1-.4-1-1s.4-1 1-1h18c.6 0 1 .4 1 1s-.4 1-1 1z' fill='%23000000' data-original='%23000000' class=''%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
}
.shop-content .site-sidebar{
position: fixed;
left: 0;
top: 0;
right: auto;
bottom: 0;
width: 100%;
max-width: 300px;
background-color: #ffffff;
z-index: 11;
overflow: auto;
transform: none;
border-radius: 0;
transform: translate3d(-100%,0,0);
transition: transform .4s cubic-bezier(.19,1,.22,1);
}
.site-sidebar-active{
transform: none !important;
}
body.shop-sidebar-filter-open{
overflow: hidden;
}
.shop-sidebar-filter-open .site-overlay{
opacity: 1;
visibility: visible;
}
.shop-sidebar-filter-close{
margin: 0;
display: block;
width: 20px;
height: 20px;
text-align: center;
margin-left: auto;
}
.shop-sidebar-filter-close::before,
.shop-sidebar-filter-close::after{
position: absolute;
content: ' ';
height: 20px;
width: 1px;
background-color: #000000;
}
.shop-sidebar-filter-close::before{
transform: rotate(45deg);
}
.shop-sidebar-filter-close::after{
transform: rotate(-45deg);
}
.woocommerce .woocommerce-ordering{
height: 35px;
}
.shop-content-holder-categories li.product-category img{
height: 130px !important;
}
.related ul.products {
grid-template-columns: repeat(2, 1fr);
}
.woocommerce div.product div.summary{
-ms-flex: 0 0 50%;
flex: 0 0 50%;
max-width: 50%;
margin: 0;
}
.woocommerce div.product div.images .woocommerce-product-gallery__image img{
height: 400px !important;
}
.product-box-info{
grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
}
.product-block-modal-holder{
width: 100%;
}
.main-configurator{
padding-top: 162.5px;
padding-bottom: 50px;
}
.step-block-header h2{
margin-bottom: 35px;
}
.progress-bar-container{
margin: 0 auto 35px;
}
.step-radio-style{
display: grid;
grid-template-columns: repeat(3, 1fr);
}
.radio-button{
width: 100%;
}
.step-block-body{
margin-bottom: 35px;
}
.step-radio-style-holder ul.products {
grid-template-columns: repeat(2, 1fr);
}
}
/*end*/
@media (max-width: 576px) {
.nav-tools .nav-tel{
display: none;
}
.search-close{
width: 35px;
}
.search-close::before, .search-close::after{
height: 17px;
}
.site-hero__background-image figure{
height: 55vh;
}
.site-hero__background-image figure img{
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.site-hero__content{
top: 55%;
text-align: center;
}
.site-hero__btn{
justify-content: center;
}
.onsale-products-holder {
grid-template-columns: repeat(1, 1fr) !important;
}
.onsale-products__heading{
flex-direction: column;
}
.onsale-products__heading h2{
margin-bottom: 20px;
}
.onsale-products__heading .site-button a{
height: 40px;
}
.btn, .site-button a{
height: 40px;
}
.product .product-item-image figure{
height: 200px;
}
.icons-block .icons-block-list {
grid-template-columns: repeat(1, 1fr) !important;
}
.info-block-holder .site-col-6{
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.info-block-holder .site-row{
flex-direction: column-reverse;
}
.info-block-image{
margin-bottom: 25px;
}
.reviews-block__item{
padding: 15px;
}
.page-bottom-cta-content{
max-width: 100%;
}
.footer-top .site-col-3,
.footer-top .site-col-2,
.footer-bottom .site-col-6{
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
text-align: center;
}
.footer-social-block ul{
margin-top: 15px;
justify-content: center;
}
.footer-top .site-row{
row-gap: 20px;
}
.page-bottom-cta-content p br{
display: none;
}
.marquee__content li{
padding: 0 10px;
}
.page-header-default{
padding-bottom: 25px;
}
.search-content ul.products {
grid-template-columns: repeat(1, 1fr) !important;
}
.shop-content-holder .site-content ul.products {
grid-template-columns: repeat(1, 1fr);
}
.site-sidebar .wcpf-field-checkbox-list .wcpf-content{
margin: 15px 0 0 0;
}
.site-sidebar .wcpf-checkbox-list .wcpf-checkbox-item{
margin-bottom: 15px;
}
.site-sidebar .wcpf-filter-inner .wcpf-field-button .wcpf-button{
height: 40px;
}
.shop-content-holder-categories ul.products {
grid-template-columns: repeat(2, 1fr) !important;
}
.related ul.products {
grid-template-columns: repeat(1, 1fr);
}
.woocommerce div.product div.left-summary-side,
.woocommerce div.product div.summary{
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.woocommerce div.product div.images .woocommerce-product-gallery__image img{
height: 300px !important;
}
.woocommerce div.product div.images .flex-control-nav li{
width: 60px;
height: 60px;
}
.woocommerce div.product div.summary{
margin-top: 25px;
}
.woocommerce div.product h1.product_title{
margin-bottom: 15px;
}
.woocommerce-product-details__short-description p{
margin-bottom: 15px !important;
}
.product-box-info {
grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
}
.product-accordion-block{
margin: 20px 0 0 0;
}
.product-accordion-block__item-caption{
padding: 15px 0;
}
.product-block-content{
max-width: 100%;
padding: 0 10px;
}
.product-block-form{
padding: 20px;
}
.product-block-close{
right: 10px;
}
.site-request-form-radio p .wpcf7-radio{
gap: 10px;
flex-direction: column;
}
.wpcf7-list-item{
width: 100%;
}
.product-accordion-block__item-content ul li{
padding: 0 0 0 25px;
background-size: 15px 15px;
background-position: 0 15%;
}
.step-radio-style-holder ul.products {
grid-template-columns: repeat(1, 1fr);
}
.step-1::before,
.step-1::after{
content: none;
}
.main-configurator{
padding-top: 150px;
}
.progress-bar-container{
max-width: 300px;
}
.step-radio-style {
display: grid;
grid-template-columns: repeat(2, 1fr);
}
.step-6 .step-radio-style {
display: grid;
grid-template-columns: repeat(2, 1fr);
}
.search-form{
width: 100%;
}
.about-block__wrapper-item{
align-items: center;
text-align: center;
}
.site-heading h3 br{
display: none;
}
.wpb_text_column p:first-of-type{
margin-top: 15px;
}
.top-bar-nav ul li a,
.top-bar-call a{
font-size: 12px;
}
.top-bar{
padding: 10px 0;
}
.main-nav{
padding: 15px 0;
}
.features-block{
grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
}
.footer-privacy{
flex-direction: column;
}
.footer-privacy .footer-span{
display: none;
}
.footer-text h4, .footer-navigation h4{
margin-bottom: 10px;
}
.shop-header-default{
padding-top: 25px;
}
.shop-content-holder-categories{
padding-top: 25px;
}
.single-product main.shop-content{
padding-top: 25px;
}
.site-single-product-info{
padding-top: 15px;
}
.page-header-default{
padding-top: 25px;
padding-bottom: 25px;
}
.woocommerce-billing-fields__field-wrapper p.form-row{
-ms-flex: 0 0 100% !important;
flex: 0 0 100% !important;
max-width: 100% !important;
padding-bottom: 25px !important;
}
.woocommerce .woocommerce-checkout .form-row{
padding-bottom: 25px !important;
}
.woocommerce .woocommerce-checkout .form-row:last-of-type{
padding-bottom: 0 !important;
}
.woocommerce table.shop_table tbody tr.cart_item{
flex-direction: column;
}
.woocommerce-checkout form.woocommerce-checkout .product-name{
width: 100%;
padding-left: 0 !important;
}
.woocommerce-checkout form.woocommerce-checkout .shop_table .product-total{
width: 100%;
text-align: left;
}
.woocommerce-checkout form.woocommerce-checkout .product-thumbnail{
width: 100px;
height: 100px;
margin-bottom: 10px;
}
}
/*end*/