/* Theme Name: Nara Truffles Theme Author: Web Arts Guys Author URI: https://web-arts.bg Description: This is the main WP Theme for Nara Truffles. The theme is created and customized for Nara Truffles and meets their requirements at highest level. Version: 1.1 Requires PHP: 7.0.0 License: Private Text Domain: NaraTruffles Tags: Nara, Truffles, Customized, WebArtsGuys */ /* Nunito Sans - cyrillic */ @font-face { font-display: swap; font-family: 'Nunito Sans'; font-style: normal; font-weight: 400; src: url('./fonts/NunitoSans_10pt-Regular.ttf') format('truetype'); } /* Nunito Sans 500 - cyrillic */ @font-face { font-display: swap; font-family: 'Nunito Sans'; font-style: normal; font-weight: 500; src: url('./fonts/NunitoSans_10pt-Medium.ttf') format('truetype'); } /* Nunito Sans 700 - cyrillic */ @font-face { font-display: swap; font-family: 'Nunito Sans'; font-style: normal; font-weight: 700; src: url('./fonts/NunitoSans_10pt-Bold.ttf') format('truetype'); } /* Nunito Sans 900 - cyrillic */ @font-face { font-display: swap; font-family: 'Nunito Sans'; font-style: normal; font-weight: 900; src: url('./fonts/NunitoSans_10pt-Black.ttf') format('truetype'); } /* Nunito Sans - cyrillic */ @font-face { font-display: swap; font-family: 'Nunito Sans'; font-style: italic; font-weight: 400; src: url('./fonts/NunitoSans_10pt-Italic.ttf') format('truetype'); } /* --- Global variables --- */ :root{ --primary-color: #fff; --secondary-color: #1e1e1e; --third-color: #cc9900; /* --fourth-color: #7e5e00; */ --fourth-color: #997300; --gray-color: #f4f4f4; /* --swiper-theme-color: #2275BC; */ --swiper-theme-color: var(--third-color); --swiper-pagination-color: var(--third-color); --borderWidth: 2px; } :focus-visible { outline: none; } /* --- Reset settings --- */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } table { border-collapse: collapse; border-spacing: 0;} @keyframes rotation { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* --- General settings --- */ html, body {min-height: 100%; scroll-behavior: smooth; font-size: calc(12px + (20 - 14) * ((100vw - 300px) / (1600 - 300))); font-family: 'Nunito Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;} /* body{margin: 0; padding: 0; color: var(--secondary-color) ; background: var(--primary-color);} */ body{margin: 0; padding: 0;} html, body, p{font-weight: 400;} h1 {font-size: 1.95em; line-height: 1.25em; margin: 0.67em 0;} h2 {font-size: 1.65em; line-height: 1.25em; margin: 0.83em 0; font-weight: 700;} h3 {font-size: 1.30em; line-height: 1.25em; margin: 1.00em 0; font-weight: 700;} h4 {font-size: 1.15em; line-height: 1.25em; margin: 1.33em 0; font-weight: 700;} h5 {font-size: 0.75em; line-height: 1.25em; margin: 0.67em 0; font-weight: 700;} h6 {font-size: 0.55em; line-height: 1.25em; margin: 0.67em 0; font-weight: 700;} a{margin: 0; font: inherit; color: inherit; text-decoration: none; z-index: 3;} /* ul{padding: 0; list-style: none;} */ /* ul{padding: 0;} */ /* ::marker{font-size: 0;} */ figure {margin: 0;} figcaption{font-size: 0.85em;} body:has(#header.scrolled){padding-top: 90px;} input, select, textarea {font-family: 'Nunito Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; width: 100%; padding: 11px; border: 0; border-radius: 10px; box-sizing: border-box; resize: vertical; background: var(--gray-color);} button{font-family: 'Nunito Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;} button{background: var(--third-color); color: #fff; padding: 9px 16px 8px; transition: 0.2s all ease-in-out; border-radius: 5px; border: 0; font-size: 0.9em; text-transform: uppercase; letter-spacing: 0.6px;} /* .main{min-height: 76vh;} */ .biggest{margin: 0 auto; width: 92%; max-width: 1560px;} .narrow{margin: 0 auto; width: 92%; max-width: 1340px;} .slim{margin: 0 auto; width: 92%; max-width: 1140px;} .flexrow{display: flex; justify-content: space-between;} .gridflow{display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 15px 2%;} .section{margin: 5em auto;} .innerSection{margin: 2.5em auto;} /* .anime{opacity: 0;} */ /* .title{} */ /* .subtitle{} */ .button{position: relative; padding: 8px 16px; display: inline-block; color: var(--primary-color); background: var(--third-color); text-transform: uppercase; font-size: 0.75em; letter-spacing: 0.6px; font-weight: 700; margin-top: 15px; transition: 0.2s all; border: 2px solid var(--primary-color); border-radius: 5px; box-sizing: border-box;} /* .button:hover{background: var(--primary-color); color: var(--third-color); border: 2px solid var(--third-color);} */ .button:hover{background: var(--fourth-color);} .underlinedTitle{text-transform: uppercase; color: var(--secondary-color);} .underlinedTitle:after{content: ''; display: block; background-color: var(--third-color); width: 90%; max-width: 130px; height: 5px;} .underlinedTitle.center:after{margin: 0px auto;} .center{text-align: center;} .center .underlinedTitle, .center .underlinedTitle:after{margin: 5px auto; text-align: center;} .swiper-wrapper{padding-bottom: 35px;} /* .overlay{position: relative;} */ /* .overlay .narrow{position: relative; z-index: 2;} */ /* .overlay:before{content: ''; position: absolute; background: #000; opacity: 0.4; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;} */ .parallax{background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover;} .img-wrap img{width: 100%; height: 100%; object-fit: cover;} /* === Header === */ #header{width: 100%; margin: 0; font-size: 0.9em; position: fixed; top: 0; left: 0; right: 0; z-index: 10; padding: 10px 0; transition: 0.3s all;} #header.scrolled{border-bottom: 1px solid #dedede;} #header .headerBar{align-items: center; min-height: 70px; justify-content: center;} #header.scrolled{background: var(--primary-color); /* background: rgba(0,0,0,0.5); */} #header .logo{height: 70px; margin: 0 70px;} #header .logo img{width: auto;} #headWrapper{width: 100%; height: 100px; overflow: auto; position: relative;} #nav.primary{display: none;} #nav{display: flex; justify-content: space-between; align-items: center;} #nav .menu{display: flex; justify-content: space-between; align-items: center; list-style-type: none; margin: 0; padding: 0; flex-flow: row nowrap;} /* margin: 5px; */ /* #nav .menu .menu-item{flex-grow: 1; text-align: center; padding: 5px; transition: all 0.3s ease-out; color: #fff;} */ #nav .menu .menu-item{flex-grow: 1; text-align: center; padding: 5px; transition: all 0.3s ease-out;} #nav .menu .menu-item a{display: block; text-decoration: none; font-weight: 500; letter-spacing: 0.5px; padding: 5px 8px; text-transform: uppercase;} #nav .menu .menu-item:hover, #nav .menu .menu-item.current-menu-item{color: var(--third-color);} /* #header.scrolled #nav .menu .menu-item{color: var(--secondary-color);} */ #header:not(.scrolled) #nav .menu .menu-item{color: #fff;} #header.scrolled #nav .menu .menu-item:hover, #header.scrolled #nav .menu .menu-item.current-menu-item{color: var(--third-color);} #nav .menu-item .sub-menu{display: none; list-style-type: none; z-index: 3; padding: 5px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);} #nav .menu-item:hover .sub-menu{display: block; position: absolute; background: var(--primary-color); margin: 5px 0; max-width: 250px;} #nav .menu-item .sub-menu a{transition: all 0.3s ease-out; color: var(--secondary-color);} #nav .menu-item .sub-menu a:hover, #nav .menu-item .sub-menu .current-menu-item a{color: var(--third-color);} #nav .menu-item .sub-menu .menu-item{text-align: left;} /* --- E-Shop Navigation --- */ #nav.shop .menu .menu-item{position: relative; max-height: 32px; margin: 0 10px;} #nav.shop .menu .menu-item .countCircle{display: flex; justify-content: center; align-items: center; position: absolute; right: -12px; top: -12px; width: 12px; height: 12px; padding: 5px; background: var(--gray-color); color: var(--secondary-color); border-radius: 50%; font-weight: 500;} #nav.shop .menu .menu-item a{padding: 0;} #nav.shop .menu .menu-item .text img{height: 100%; width: auto; max-width: 32px;} /* Edit */ #nav.shop .menu .menu-item:first-child{display: none;} /* When logged in */ .logged-in #nav.shop .menu .menu-item.profile a{display: flex; align-items: center;} .logged-in #nav.shop .menu .menu-item.profile img{margin-right: 10px;} /* --- Hamburger --- */ #hamburger{display: none; background: none; outline: 0; border: 0; border-top: 5px solid var(--third-color); border-bottom: 5px solid var(--third-color); width: 46px; height: 34px; position: relative; font-size: 0px; color: #080357; transition: border 0.1s ease-out; z-index: 10; cursor: pointer; border-radius: 0;} #hamburger:before, #hamburger:after{content: ''; display: block; width: 100%; height: 5px; position: absolute; top: 50%; left: 50%; background: var(--third-color); transform: translate(-50%, -50%); transition: transform 0.3s ease; z-index: 120;} #hamburger.active:before{transform: translate(-50%, -50%) rotate(45deg); transition-delay: 0.2s; } #hamburger.active:after{transform: translate(-50%, -50%) rotate(-45deg); transition-delay: 0.2s; } #hamburger.active{border: unset;} /* --- Intro Image --- */ #intro{background: #fff;} #intro .introImage{position: relative; height: 100vh;} /* .containerGradient::before{content: ''; position: absolute; background: var(--primary-color); z-index: 1;} */ /* .containerGradient.left::before{background: rgba(170,139,75,0.9); left: 0; height: 100%; width: 80%; background: -webkit-gradient(linear, right top, left top, from(rgba(170,139,75,0.9)), to(rgba(0,0,0,0))); background: linear-gradient(90deg, rgba(170,139,75,0.9) 40%, rgba(0,0,0,0) 100%);} */ /* #intro .logo{position: absolute; top: 75%; left: 50%; transform: translate(-50%, -50%); height: 200px; z-index: 2; max-width: 100%;} */ /* #intro .logo img{width: auto; max-width: 100%; object-fit: contain;} */ #intro .logo{position: absolute; bottom: 25%; left: 50%; transform: translateX(-50%); height: 200px; z-index: 2; max-width: 100%; } /* #intro .logo img{width: auto; max-width: 100%; object-fit: contain;} */ #intro .logo img{width: 100%; height: 100%; object-fit: contain;} #smallIntro{display: flex; height: 60vh; background-position: center; background-repeat: no-repeat; background-size: cover; color: var(--primary-color);} #smallIntro .wrapper{display: flex; flex-flow: column; justify-content: flex-end; margin: 15px auto; text-shadow: 1px 1px 5px #000;} #smallIntro .wrapper .title{color: inherit;} #smallIntro .wrapper .subtitle{font-size: 1em; max-width: 580px; font-weight: inherit;} /* 780px */ /* === Breadcrumbs === */ #breadcrumbs{display: flex; flex-flow: row wrap; list-style: none; padding: 10px 0 0; font-size: 0.8em; text-transform: uppercase;} #breadcrumbs a{color: var(--primary-color); transition: 0.2s all ease-in-out;} #breadcrumbs a:hover{color: var(--third-color);} #breadcrumbs .chunk{display: inline;} #breadcrumbs .separator{padding: 0 10px; font-size: 26px; line-height: 10px; vertical-align: sub; color: var(--third-color);} .woocommerce-breadcrumb a:hover{color: var(--third-color); transition: 0.2s all ease-in-out;} /* --- Swiper --- */ .swiper-container{position: relative; overflow: hidden;} .swiper-pagination{z-index: 1;} .swiper-pagination-bullet{width: 16px; height: 16px; background: #000; margin: 0 4px;} .swiper-pagination-bullet-active{background: var(--swiper-pagination-color,var(--swiper-theme-color));} .swiper-section .swiper-button-next{right: -40px;} .swiper-section .swiper-button-prev{left: -40px;} /* .productsRow .swiper-section{flex: 0 0 100%; position: relative; margin: 10px;} */ .productsRow .swiper-section{flex: 0 0 100%; position: relative;} /* .productsRow .swiper-section{overflow: visible; position: relative; margin: -8px;} */ .productsRow .swiper-container{padding: 8px;} .productsRow .swiper-pagination{position: relative; margin-top: 30px;} /* === Pagination === */ .postPagination{margin: 70px auto 0; display: flex; flex: 0 0 100%; justify-content: center;} .postPagination .page-numbers{display: flex; justify-content: space-between; width: 4vh; height: 4vh; align-items: center; justify-content: center; font-size: 1em; font-weight: 700; transition: 0.2s all ease-in-out; background: var(--gray-color); margin: 0 2px; border-radius: 3px; color: #fff;} .postPagination .page-numbers:hover, .postPagination .page-numbers.current{background: var(--third-color); color: #fff;} /* --- Article sharer --- */ .sharer{margin: 45px auto 60px; max-width: 980px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; } .sharer .list{list-style-type: none;display: flex; justify-content: center; flex-flow: row nowrap; padding: 10px 0; } .sharer .list .item{display: inline; margin: 0 1%;} .sharer .list .item .dashicons:before{font-size: 28px; width: 28px; height: 28px;} .sharer .list .item a{color: var(--secondary-color); text-decoration: none; padding: 10px; } .sharer .list .sms{display: none;} .sharer .list .fb a:hover{color: #1877F2;} .sharer .list .tw a:hover{color: #1da1f2;} .sharer .list .li a:hover{color: #0077B5;} .sharer .list .wa a:hover{color: #25D366;} .sharer .list .ml a:hover{color: #0489c9;} .sharer .list .ig a:hover{color: #833AB4;} .sharer .list .yt a:hover{color: #ff0000;} .sharer .list .sms a:hover{color: #0084ff;} /* --- Icon list with description --- */ .iconList{list-style: none; margin: 50px auto; padding: 0; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 25px 5%;} .iconList .item{flex: 0 0 30%; display: flex; flex-flow: column; align-items: flex-start;} .iconList .item .icon{height: 35px; width: auto; margin-bottom: 15px;} .iconList .item .title{font-size: 1em; margin-right: auto;} .iconList .item .desc{font-size: 0.9em;} .iconList .item br{display: none;} /* --- Sections with image background --- */ /* .imageBackground{position: relative; min-height: 60vh;} .imageBackground .title{margin: 15px auto;} .imageBackground .containerImage{position: absolute; top: 0; left: 0; width: 55%; height: 100%; box-sizing: border-box;} // 60% .imageBackground .wrapper{position: relative; z-index: 3; width: 40%; height: 60vh; display: flex; flex-flow: column; justify-content: center;} */ /* --- Front page --- */ /* Check */ #frontPage{color: var(--secondary-color);} /* --- Product Categories Section --- */ /* grid-template-columns: 2fr 1fr 1fr; */ .productCategories .categoriesWrapper {display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 20px;} .productCategories .categoriesWrapper .category{border-radius: 10px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);} .productCategories .categoriesWrapper .category .img-wrap {display: block; height: 300px; overflow: hidden; border-radius: 5px;} .productCategories .categoriesWrapper .category .img-wrap img {transition: transform 0.3s ease-in-out; object-position: bottom;} .productCategories .categoriesWrapper .category .img-wrap img:hover {transform: scale(1.1);} .productCategories .categoriesWrapper .category .title {text-transform: uppercase; transition: color 0.3s ease-in-out; font-size: 1.2em;} .productCategories .categoriesWrapper .category:hover .title {color: var(--third-color);} /* .productCategories.woo .categoriesWrapper {grid-template-columns: 1fr 1fr 1fr; padding: 2.5em 0 0; margin: 0 auto;} */ .productCategories.woo .categoriesWrapper {grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); margin: 0 auto;} /* --- Featured Products --- */ #frontPage .productsRow {display: flex; justify-content: flex-start; flex-flow: row wrap; position: relative;} #frontPage .productsRow .title.lined{flex: 0 0 100%;} #frontPage .productsRow .button.all{margin: 0 auto;} /* #frontPage .productsRow .button.all{margin: 50px auto 0 auto;} */ /* #frontPage .swiper-section{flex: 0 0 100%; position: relative; margin: 0 auto;} */ .productSlider{display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));} /* #productSlider{width: 95%; margin: 0 auto;} */ /* --- Counter Section --- */ #counter .box{display: flex; flex-flow: column; justify-content: center; align-items: center;} #counter .box .digit{font-size: 3vmax; font-weight: 900; color: var(--third-color); } #counter .box .text b{display: block; text-transform: uppercase; font-size: 1.3em;} /* --- About us Section --- */ #frontPage .about{display: flex; align-items: center; width: 92%; max-width: 1560px; position: relative;} #frontPage .about .img-wrap{flex: 0 0 50%; z-index: 1; height: 540px;} #frontPage .about .img-wrap img{border-radius: 25px;} #frontPage .about .text-wrap{max-width: 60%; padding: 50px; padding-left: 15%; border-radius: 40px; position: absolute; left: 40%; background: var(--gray-color);} /* #dfc58e */ #frontPage .about .text-wrap .button{border-color: transparent;} /* --- Testimonials Section --- */ /* #frontPage .testimonials{background-position: center; background-repeat: no-repeat; background-size: cover; padding: 4em 0; margin-bottom: 0;} #frontPage .testimonials:before{opacity: 0.5;} #frontPage .testimonials .title{color: #fff; position: relative; z-index: 3; margin: 10px auto;} #frontPage .testimonialsSlider{margin: 15px auto 10px; color: #fff;} #frontPage .testimonialsSlider .item{display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; min-height: 260px;} #frontPage .testimonialsSlider .item .text{ width: 70%; margin: 10px 0 35px; text-align: center; font-size: 24px;} #frontPage .testimonialsSlider .item .text blockquote{margin: 0;} #frontPage .testimonialsSlider .item .text .signature{margin-top: 25px; font-size: 16px;} #frontPage .testimonialsSlider .swiper-button-next, #frontPage .testimonialsSlider .swiper-button-prev {color: #fff; top: 40%;} #frontPage .testimonialsSlider .swiper-pagination-bullet-active {background: #fff;} */ /* --- Subscribe Section --- */ /* #frontPage .subscribe{margin: 5em auto 3em;} #frontPage .subscribe .desc{max-width: 70%; margin: 1em auto;} #frontPage .subscribe input{font-size: 0.75em;} #frontPage .subscribe .tnp-email{outline: none;} #frontPage .subscribe .tnp-submit{background: var(--secondary-color); margin: 0 auto; padding: 8px 16px;} #frontPage .subscribe .tnp-submit:hover{background: var(--primary-color);} */ /* --- Post Aricles --- */ .section.news .button{display: block; width: fit-content; margin: 30px auto;} /* .gridflow.singles{margin: 2em auto;} */ .gridflow.singles .article{align-items: flex-start; text-align: left;} .gridflow.singles .article .imageContainer{height: 300px; width: 100%; position: relative; overflow: hidden;} .gridflow.singles .article .textContainer{display: flex; flex-flow: column; flex-grow: 1; margin: 15px 0;} .gridflow.singles .article .title{margin: 0 0 auto 0; font-size: 1.2em; transition: 0.3s color;} .gridflow.singles .article:hover .title{color: var(--third-color);} .gridflow.singles .article .date{font-size: 0.8em; margin: 5px 0;} .gridflow.singles .article .underlinedButton{display: block; width: fit-content; margin-top: auto;} #single li{line-height: 1.5em;} #single .content a{color: var(--third-color); transition: 0.2s all ease-in-out;} #single .content a:hover{color: var(--fourth-color);} .gallery{display: grid; grid-template-columns: repeat(auto-fit, minmax(315px, 1fr)); gap: 15px 2%;} .gallery img{width: 100%; max-height: 310px; object-fit: cover;} /* === Archive: Post & Home Page Articles === */ .gridflow.post{grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 15px 0%;} .gridflow.post .article{overflow: visible; } .gridflow .article{position: relative; display: flex; flex-flow: column; align-items: center; overflow: hidden; transition: 0.3s all; padding: 30px;} .gridflow .article:hover{background: var(--gray-color);} .gridflow .article .image{width: 100%; height: 100%; object-fit: cover; transition: 0.3s all;} .gridflow .article:hover .image{transform: scale(1.1);} /* === Page : Global === */ body:not(.woocommerce-page) #page .page a{color: var(--third-color); transition: 0.2s color ease-in-out;} body:not(.woocommerce-page) #page .page a:hover{color: var(--fourth-color);} /* Test styles breaking */ .woocommerce ul.products::before, .woocommerce ul.products::after { content: none !important; display: none !important; } /* === About us Page === */ #advantages .box{flex: 0 0 22%; display: flex; flex-flow: column; align-items: center;} #advantages .box .icon{max-width: 96px; height: auto; object-fit: contain;} #advantages .box .title{text-transform: uppercase; margin-bottom: 0.6em; min-height: 60px;} #advantages .box .text{font-size: 0.9em; text-align: left;} /* === Contacts Page === */ #contactPage .contactInfo {display: flex; flex-flow: row wrap; justify-content: space-between;} #contactPage .contactInfo .article{display: flex; flex-flow: column; align-items: center; line-height: 1.5em;} #contactPage .contactInfo .article .dashicons{width: auto; height: 50px; font-size: 3em; color: var(--secondary-color);} #contactPage .contactInfo .article .title{text-transform: uppercase;} #contactPage .contactInfo .article .text{transition: color 0.3s;} #contactPage .contactInfo .article:hover .text{color: var(--third-color);} #contactPage .mapForm{display: flex; justify-content: space-between; gap: 2%;} #contactPage .mapForm .item.left{flex: 0 0 60%;} #contactPage .mapForm .item.right{flex: 1 0 auto;} #contactPage .mapForm .item.left iframe{width: 100%; height: 100%;} #contactPage .mapForm .item .title{margin: 0.5em 0;} #contactForm {display: flex; flex-flow: column; justify-content: space-between; position: relative;} #contactForm .input{margin: 10px 0; padding: 1em 0 0.9em 1.2em; font: inherit; font-size: 0.8em; outline: 0; border: 0;} #contactForm .message{resize: vertical;} #contactForm .submit{display: flex; align-items: center; justify-content: center; margin: 10px 0 0; padding: 1em 0 0.9em 1.2em; cursor: pointer; font-weight: 500; width: 100%;} #contactForm:hover .submit:hover{background: var(--fourth-color); color: #fff;} #contactForm .response{flex: 0 0 100%; margin-bottom: 15px; font-size: 0.7em;} #contactForm .response.error{border-left: 5px solid #f00; padding: 7px 16px; background: var(--gray-color); color: #1e1e1e;} #contactForm .response.success{border-left: 5px solid #0f0; padding: 7px 16px; background: var(--gray-color); color: #1e1e1e;} .loaderWrapper{position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.6); display: flex; align-items: center; justify-content: center;} .loaderWrapper .loader{ width: 48px; height: 48px; border: 5px solid #cc9900; border-bottom-color: #dedede; border-radius: 50%; display: inline-block;box-sizing: border-box; animation: rotation 1s linear infinite;} /* --- 404 Page --- */ #errorPage{display: flex; flex-flow: column; text-align: center; min-height: unset; padding: 5em;} #errorPage .digits{display: flex; flex-wrap: nowrap; justify-content: center; align-items: center;} #errorPage .digits .errorText{font-size: 19vw; line-height: 0; margin: 0 3%; text-align: justify;} #errorPage .digits .null{height: 13vw; object-fit: contain;} #errorPage .textBox a{color: var(--third-color);} /* Footer */ #footer{padding: 40px 0; background: var(--secondary-color); color: var(--primary-color);} #footer a{transition: 0.3s color; color: inherit;} #footer a:hover{color: var(--third-color);} #footer .rowF{display: flex; flex-flow: row wrap; justify-content: space-between; align-items: flex-end;} #footer .rowF:after{content: ''; display: block; width: 100%; height: 1px; background: #fff; margin: 20px 0;} #footer .logo{display: flex; flex-flow: column;} #footer .img-wrap{width: 150px;} #footer .img-wrap img{object-fit: contain;} #footer .fNav{flex: 1 0 100%;} #footer .fNav ul{display: flex; justify-content: flex-end; margin: 0; padding: 0;} #footer .fNav ul li{display: flex; gap: 10px; align-items: center; border-right: 1px solid #fff; padding-right: 1vw; margin-right: 1vw;} #footer .fNav ul li:last-child{border: none; padding: 0; margin: 0;} #footer .fNav li a{line-height: 1em; font-size: 16px;} #footer .fInfo{display: flex; justify-content: space-between; letter-spacing: 0.5px;} #footer .fInfo .cpr{display: flex; align-items: center; margin: 0 0 15px; flex-grow: 1;} #footer .fInfo .cprText{margin: 0 1vw 0 0; line-height: 1em; font-size: initial;} #footer .fInfo .sepr{font-size: initial; border-left: 1px solid #fff; padding: 2px 1vw 0; line-height: 1em;} #footer .credit{font-size: initial; margin: 0;} #footer .credit a{color: var(--third-color);} #footer .credit a:hover{color: var(--fourth-color);} #performance{font-size: 12px;} /* General styling for WooCommerce */ /* Buttons */ .woocommerce button.button, .woocommerce a.button, .woocommerce input.button{color: var(--primary-color); background: var(--third-color); transition: 0.2s all; border-radius: 5px; font-size: 0.8em; padding: 11px 1em;} .woocommerce button.button:hover, .woocommerce a.button:hover, .woocommerce input.button:hover {background: var(--fourth-color); color: #fff;} .woocommerce .product button.alt.disabled{background: var(--fourth-color);} /* .woocommerce-page .woocommerce button.button.alt, */ .woocommerce button.button.alt, .woocommerce-page .woocommerce a.button.alt, .woocommerce #review_form #respond #submit{background: var(--third-color); color: #fff;} .woocommerce-page .woocommerce button.button.alt:hover, .woocommerce-page .woocommerce a.button.alt:hover, .woocommerce #review_form #respond #submit:hover{background: var(--fourth-color);} .woocommerce #review_form #respond #submit{font-size: 0.9em; padding: 8px 16px;} /* Inputs, Fields etc. */ .woocommerce input, .woocommerce select, .woocommerce textarea{width: auto; border-radius: 5px; font-size: 0.85em;} /* --- Box Item Product Container --- */ .boxItem{display: flex; flex-flow: column; position: relative; box-sizing: border-box; padding: 25px; border-radius: 10px; flex-grow: 1;} .boxItem{border: 1px solid #e9e9e9;} /* .boxItem:hover{transform: scale(1.008) translateY(-5px); background: var(--gray-color);} */ .boxItem:hover{transform: scale(1.008) translateY(-5px); box-shadow: 0 2px 14px #0000001a;} .boxItem .imageLink{align-self: center; max-height: 430px; height: 100%;} .boxItem .imageLink .tag.onsale{display: none;} .boxItem img{height: 100%; width: 100%; object-fit: contain; border-radius: 5px;} .boxItem .text{min-height: 150px;} .boxItem .prCategory{margin: 10px 0; font-weight: 400; font-size: 0.9em; color: #757575; display: block;} .boxItem .prCategory a:hover, .boxItem .prTitle:hover{color: var(--third-color);} .boxItem .prTitle, .boxItem .woocommerce-loop-product__title{font-size: 1.1em; font-weight: 500; margin: 0 0 20px;} .boxItem .price .amount{transition: 0.2s color ease-in-out;} .boxItem .price:hover .amount{color: var(--fourth-color);} .boxItem .ctaLine{display: flex; justify-content: flex-start; gap: 10px; margin-top: 20px; width: 100%;} .boxItem .ctaLine .button{flex: 0 0 auto; margin: 0 !important; padding: 13px 15px 11px; background: var(--third-color); display: flex; align-items: center; transition: all .5s; text-align: center; border: none; border-radius: 3px;} .boxItem .ctaLine .button:hover{background: var(--fourth-color);} .boxItem .ctaLine .button:first-child{flex-grow: 1;} .boxItem .ctaLine .button .hiddenText{opacity: 0; width: 0; transition: all .2s ease-in-out .2s; display: inline-block; white-space: nowrap; vertical-align: top; overflow: hidden; transition: all .5s; color: #fff; flex-grow: 1; text-align: center; font-size: 1.1em; font-weight: 700; line-height: 1.2em;} .boxItem .ctaLine .button:first-child .hiddenText{opacity: 1; width: auto;} .boxItem .ctaLine .button:hover .icon{filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(237deg) brightness(191%) contrast(102%)} .boxItem .ctaLine .button .icon{height: 16px; width: 16px; object-fit: contain; border-radius: 0; filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(237deg) brightness(191%) contrast(102%);} /* Other */ .tagWrapper{display: flex; flex-flow: row wrap; position: absolute; gap: 10px; z-index: 4;} .tag{display: block; width: fit-content; padding: 5px 10px; background: #dadada; color: var(--secondary-color); font-size: 0.8em; text-transform: uppercase; font-weight: 500; border-radius: 5px; white-space: nowrap;} .tag.onsale{background: #cc3300; color: #fff;} .tag.presen, .tag.fresh, .tag.frischer{background: #444; color: #fff;} /* .tag.outStock{background: #444; color: #fff;} */ /* .tag.presen{background: #99cc00;} */ .price{font-weight: 700; margin-top: auto; color: var(--third-color); font-size: 1.3em;} .price del{margin-right: 5px; font-size: 0.8em; color: #757575;} .price ins{text-decoration: none;} #msg{position: absolute; display: none; padding: 10px 25px; background: white; border: 1px solid #d1d1d1; border-radius: 4px; font-size: 1em; width: 50%; text-align: center; z-index: 999; box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;} /* Скриване на Адрес за доставка - Address for delivery - None in Checkout */ /* Редактирай Edit Update */ .woocommerce-column--shipping-address{display: none;} /* Bulgarisation: Add logo to shipping methods */ .woocommerce ul#shipping_method li{display: flex; flex-flow: row wrap; align-items: center;} .woocommerce ul#shipping_method li input{margin-top: 0;} #shipping_method .woo-bg--econt-delivery, #shipping_method .woo-bg--speedy-delivery {flex: 1 0 100%;} /* --- WooCommerce Pagination --- */ .woocommerce-pagination{margin: 5em auto; display: flex;} .woocommerce-pagination .page-numbers{display: flex; justify-content: space-between;} .woocommerce-pagination .page-numbers .page-numbers{border-radius: 5px; font-size: 1em; font-weight: 700; transition: 0.2s all ease-in-out; background: #DEDEDE; margin: 0 2px;} .woocommerce-pagination .page-numbers .page-numbers:hover{background: var(--third-color); color: #fff;} .woocommerce-pagination .page-numbers.current{background: var(--third-color); color: #fff;} /* --- WooCommerce Notice --- */ /* .singleProduct .button.wc-forward{background: 0 !important; padding: 0;} .singleProduct .button.wc-forward:hover{color: var(--third-color);} .button.wc-forward{box-shadow: none} .woocommerce button.button:hover{background: var(--third-color); color: #fff;} .woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover{color: #fff;} */ /* #notice{padding: 20px; box-shadow: 0 0 3px 1px #000; position: fixed; top: 10%; left: -400px; width: 290px; transition: left 0.2s ease-in; background: var(--third-color); font-weight: 500; color: #fff; z-index: 1000;} #notice.visible{left: 0; transition: left 0.5s ease-out;} */ .woocommerce-breadcrumb .orderedItem{display: inline;} .woocommerce-info{border-color: var(--third-color);} .woocommerce-info::before{color: var(--third-color);} /* --- Archive Product Content --- */ .woocommerce-products-header .page-title, .product_title{color: var(--secondary-color);} .woocommerce-products-header .page-title:after, .product_title:after{content: ''; display: block; background-color: var(--third-color); width: 90%; max-width: 130px; height: 5px;} .showFilters{display: none; margin: 30px 0; cursor: pointer;} .productContent{display: flex; flex-flow: row wrap; justify-content: space-between; align-items: flex-start; margin: 0 auto;} /* padding: 5em 0; */ /* .woocommerce-shop .productCategories{margin: 0 auto; padding: 7.5em 0 5em;} */ /* .woocommerce-shop .productCategories .underlinedTitle{display: none;} */ /* --- Filtering --- */ /* .sidebarFilters{width: 20%; position: sticky; top: 0; left: 0;} */ .sidebarFilters{flex: 0 0 20%; margin-bottom: 5em;} .sidebarFilters ul{padding: 0 0 0 1em; list-style: none;} .sidebarFilters .title{font-size: 1.7em; margin: 1.00em 0; font-weight: bold;} .sidebarFilters .filterTitles, .sidebarFilters h4{font-weight: 500; font-size: 1.2em;} .sidebarFilters .category a:before{content: ''; position: relative; width: 16px; height: 16px; border: 1px solid black; border-radius: 5px; display: inline-block; margin-right: 10px;} .sidebarFilters .prodFilters .topic{font-size: 1.1em; margin: 0.67em 0; font-weight: bold;} .sidebarFilters .prodFilters .slideContainer .holder input{padding: 0; width: 100%;} .sidebarFilters .prodFilters .slideContainer .holder .legend.min{float: left;} .sidebarFilters .prodFilters .slideContainer .holder .legend.max{float: right;} .sidebarFilters .prodFilters .slideContainer .line{margin: 0; clear: both; padding: 15px 0; text-align: center;} .sidebarFilters .prodFilters .metaBrand .category .container{font-weight: 700;} .sidebarFilters .prodFilters .metaBrand .subcategories .container{font-weight: inherit;} .woocommerce .sidebarFilters .button{display: block; text-align: center; font-size: 0.9em;} #priceLimit{font-weight: 500;} /* --- Custom Checkbox --- */ .container{display: block; position: relative; padding-left: 30px; margin-bottom: 12px; cursor: pointer; font-size: 1em; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;} /* Hide the browser's default checkbox */ .container input{position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0;} /* Create a custom checkbox */ .checkmark{position: absolute; top: 0; left: 0; height: 16px; width: 16px; border: 1px solid var(--third-color); border-radius: 5px;} /* On mouse-over, add a grey background color */ .container:hover input ~ .checkmark{background-color: #efefef;} /* Create the checkmark/indicator (hidden when not checked) */ .checkmark:after{content: ''; position: absolute; display: none;} /* Show the checkmark when checked */ .container input:checked ~ .checkmark:after{display: block;} /* Style the checkmark/indicator */ .container .checkmark:after{left: 5px; top: 1px; width: 4px; height: 8px; border: solid var(--third-color); border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);} .sidebarFilters .wc-block-components-price-slider__range-input-progress{--range-color: var(--third-color);} .sidebarFilters .wc-block-components-price-slider__amount{border-radius: 5px !important; border-color: #444444;} /* --- Products Container --- */ /* .productsContainer{display: flex; flex-flow: row wrap; justify-content: space-between; width: 79%; align-items: center;} */ .productsContainer{display: flex; flex-flow: row wrap; justify-content: space-between; flex: 0 0 75%; align-items: center;} .productsContainer .woocommerce-no-products-found{flex: 0 0 100%;} .productsContainer .woocommerce-notices-wrapper{flex: 0 0 100%;} .productsContainer .woocommerce-message{display: flex; align-items: center; flex-flow: row-reverse; margin: 2em 0;} .productsContainer .woocommerce-message::before{top: 50%; transform: translateY(-50%);} .productsContainer .button{margin: 0 0 0 auto;} .productsContainer .woocommerce-ordering{flex: 0 0 30%;} /*25*/ .productsContainer .woocommerce-ordering select{width: 100%;} .productsContainer .boxItem .ctaLine{margin-top: auto;} .productsContainer ul.products{flex: 0 0 100%; display: grid; grid-gap: 25px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));} .productsContainer ul.products[class*=columns-] li.product, .productsContainer-page ul.products[class*=columns-] li.product{margin: initial; width: 100%;} .productsContainer ul.products:before{content: none;} .productsContainer ul.products li.product{margin: initial; flex: 0 0 20%; padding: 15px; width: 100%;} .productsContainer ul.products li.product .onsale{top: 15px; left: 15px; margin: 0;} .productsContainer ul.products li.product a img{margin: 0; height: 460px; object-fit: contain;} /* margin-top: auto; delted from BOTTOM */ .productsContainer ul.products li.product .price{font-weight: 700; color: var(--third-color); font-size: 1.3em;} .productsContainer ul.products li.product .price del{margin-right: 5px; font-size: 0.8em; color: #757575;} .productsContainer ul.products li.product .price ins{text-decoration: none;} .productsContainer ul.products li.product .button.buy{display: flex;} .productsContainer .products .boxItem:after{content: none;} .productsContainer .products .woocommerce-loop-product__link{position: relative; width: 100%;} /* .productsContainer .products .sale .woocommerce-LoopProduct-link{position: absolute; top: 0; left: 0; height: 55%;} */ .productsContainer .products .woocommerce-loop-product__link .button.buy{display: inline;} .productsContainer nav.woocommerce-pagination ul{margin: 0; border: 0;} .productsContainer nav.woocommerce-pagination ul li{border-right: 0;} .productsContainer .woocommerce-pagination .page-numbers.current{background: var(--third-color); color: #fff;} .categories{padding: 10px 0;} .subcategories{padding-left: 10px;} .transition{transition: 0.2s all ease-in-out;} /* --- Single Product --- */ /* .singleProduct{padding: 5em 0;} */ .singleProduct .woocommerce-breadcrumb{margin-bottom: 50px; display: flex; flex-flow: row wrap; font-size: inherit; color: inherit;} .singleProduct .products{width: 100%;} .singleProduct .products .productsContainer{width: 100%;} .singleProduct .products .boxItem .price{flex: 0 0 100%;} .singleProduct .product{display: flex; flex-flow: row wrap; justify-content: space-between; position: relative;} .singleProduct .product .tag{top: 5px; left: 5px;} .singleProduct .product .woocommerce-product-gallery{flex: 0 0 45%;} .singleProduct .product .woocommerce-product-gallery__wrapper{display: flex; flex-flow: row wrap; justify-content: flex-start; gap: 15px 4%;} .singleProduct .product .woocommerce-product-gallery__wrapper a{height: 100%; width: 100%;} .singleProduct .product .woocommerce-product-gallery__image{flex: 0 0 22%; padding: 2px;} .singleProduct .product .woocommerce-product-gallery__image:first-child{height: 530px; flex: 0 0 100%;} /* .woocommerce .singleProduct .product .woocommerce-product-gallery__image img{width: 100%; height: 100%; object-fit: cover; border-radius: 5px; box-shadow: rgb(0 0 0 / 16%) 0px 1px 4px;} */ .woocommerce .singleProduct .product .woocommerce-product-gallery__image img{width: 100%; height: 100%; object-fit: contain; border-radius: 5px;} .singleProduct .product .summary{flex: 0 0 50%;} /* .singleProduct .product .summary{flex: 0 0 50%; position: sticky; top: 0px; height: 100%;} */ .singleProduct .product .summary p{margin: 0;} .singleProduct .product .summary .stock{text-transform: capitalize; font-weight: 700;} .singleProduct .product .summary .out-of-stock{color: #cc3300;} .singleProduct .product .summary .in-stock{color: green; margin: 10px 0;} .singleProduct .product .summary .product_title{font-size: 2em; color: #000;} .singleProduct .product .summary .woocommerce-product-details__short-description{margin: 1em 0;} .singleProduct .product .summary .woocommerce-product-details__short-description a, .woocommerce .singleProduct .product .woocommerce-tabs .panel a:not(.button){color: var(--third-color); transition: 0.2s all ease-in-out;} .singleProduct .product .summary .woocommerce-product-details__short-description a:hover, .woocommerce .singleProduct .product .woocommerce-tabs .panel a:not(.button):hover{color: var(--fourth-color);} .singleProduct .product .summary .price{font-size: 1.8em; margin: 50px 0; color: var(--third-color);} .singleProduct .product .summary .variations tr{vertical-align: baseline;} .singleProduct .product .summary select, .singleProduct .product .summary input{border: 1px solid #757575;} .singleProduct .product .summary .variations .label{vertical-align: middle; text-align: left; text-transform: uppercase; padding: 10px 0;} .singleProduct .product .summary .variations .value{padding: 10px 0 10px 30px;} /* .singleProduct .product .summary .variations .reset_variations, .singleProduct .product .summary .cart .single_add_to_cart_button{background: var(--third-color); color: #fff; padding: 9px 16px 8px; transition: 0.2s all; border-radius: 5px; border: 0; font-size: 0.9em; text-transform: uppercase; letter-spacing: 0.6px;} */ .singleProduct .product .summary .variations .reset_variations:hover{background: var(--fourth-color);} .singleProduct .product .summary .cart, .singleProduct .product .summary .woocommerce-variation-add-to-cart{display: flex; flex-flow: row wrap;} .singleProduct .product .summary .phone-order-button{background: #49B568; margin-bottom: 30px;} .singleProduct .product .summary .cart .single_add_to_cart_button{margin-left: 15px; box-shadow: rgb(149 157 165 / 40%) 0px 8px 24px;} .singleProduct .product .summary .cart .single_add_to_cart_button.button:hover{background: var(--fourth-color); color: var(--primary-color); box-shadow: none;} .singleProduct .product .summary .single_variation_wrap{flex: 0 0 100%;} .singleProduct .product .summary .quantity input{width: 7vh; font-weight: 700; font-size: 1em;} .singleProduct .product .summary .woocommerce-variation-availability{margin: 10px 0;} /* .singleProduct .product .summary .button.fav{display: flex; align-items: center; width: fit-content; font-weight: 700; margin: 30px 0;} .singleProduct .product .summary .button.fav .icon{margin-right: 15px;} .singleProduct .product .summary .button.fav:hover .icon{filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(196deg) brightness(104%) contrast(101%);} */ .singleProduct .product .summary .product_meta > span{display: block; margin-top: 5px;} .singleProduct .product .summary .product_meta span > span, .singleProduct .product .summary .product_meta span > a{color: #757575; transition: 0.2s all ease-in-out;} .singleProduct .product .summary .product_meta span > a:hover{color: var(--third-color);} .singleProduct .product .woocommerce-tabs{width: 100%;} .woocommerce .singleProduct .product .woocommerce-tabs .tabs{display: flex; flex-flow: row wrap; gap: 30px; margin: 0; padding: 0;} .woocommerce .singleProduct .product .woocommerce-tabs .tabs > li{color: #757575; border: none; background: unset; margin: 0; padding: 0;} .woocommerce div.product .woocommerce-tabs ul.tabs li::after, .woocommerce div.product .woocommerce-tabs ul.tabs li::before{content: none;} .woocommerce .singleProduct .product .woocommerce-tabs .tabs li.active{z-index: 1; background: unset; color: var(--fourth-color);} .singleProduct .product .woocommerce-tabs .tabs li .title{text-transform: initial; font-weight: 500;} .singleProduct .product .woocommerce-tabs .tabs li.active .title{position: relative; width: fit-content;} /* .singleProduct .product .woocommerce-tabs .tabs li.active .title:after{content: ''; display: block; position: absolute; width: 100%; height: 1px; background: #444444;} */ .singleProduct .product .woocommerce-product-attributes{width: 100%; margin: 2em 0;} .singleProduct .product .woocommerce-product-attributes p{margin: 1em 0;} .singleProduct .product .woocommerce-product-attributes tr{border: 1px solid #bebebe; border-radius: 5px;} .singleProduct .product .woocommerce-product-attributes th{background: #dedede; text-transform: uppercase; text-align: left; padding-left: 20px; max-width: 50%; width: 100%;} .singleProduct .product .woocommerce-product-attributes-item:nth-child(even) th{background: var(--gray-color);} .singleProduct .product .woocommerce-product-attributes td{background: var(--gray-color); padding: 1em 0 1em 35px;} .singleProduct .product .woocommerce-product-attributes td p{margin: 0;} .woocommerce .singleProduct .product .woocommerce-tabs .panel{margin: 0 auto; width: 92%; max-width: 1140px;} /* Reviews comment list */ .singleProduct .product .woocommerce-Reviews .title.lined{line-height: 1em;} .singleProduct .product .woocommerce-Reviews .commentlist{padding: 0;} .singleProduct .product .woocommerce-Reviews .comment-respond .submit{background: #DEDEDE; border-radius: 5px; padding: 10px 20px 9px; font-weight: 700; font-size: 1em; text-transform: uppercase; margin: 0 auto; transition: 0.2s all ease-in-out;} .singleProduct .product .woocommerce-Reviews .comment-respond .submit:hover{background: var(--third-color); color: #fff;} .singleProduct .product .woocommerce-Reviews .commentlist .comment_container{position: relative; display: flex; align-items: flex-start; gap: 15px; margin: 30px 0;} .singleProduct .product .woocommerce-Reviews .commentlist .children .comment_container{margin: 0;} .singleProduct .product .woocommerce-Reviews .commentlist .comment_container img{width: 100%; max-width: 50px;} .singleProduct .product .woocommerce-Reviews .commentlist .comment_container .comment-text{border: 1px solid #DEDEDE; border-radius: 5px; padding: 0.5em 1em 0;} .singleProduct .product .woocommerce-Reviews .commentlist .comment_container p{margin: 10px 0;} .singleProduct .product .woocommerce-Reviews .commentlist ul{padding-inline-start: 15px;} /* .singleProduct .product .woocommerce-Reviews .commentlist .children .comment_container{ margin: -15px 0 30px;} */ /* Reviews comment form */ .singleProduct .product .woocommerce-Reviews #review_form #reply-title{display: block; color: var(--secondary-color); font-size: 1.30em; line-height: 1.25em; margin: 1em 0; font-weight: 700; text-transform: uppercase;} .singleProduct .product .woocommerce-Reviews #review_form #reply-title:after{content: ''; display: block; background-color: var(--third-color); width: 90%; max-width: 130px; height: 5px;} .singleProduct .product .woocommerce-Reviews #review_form #respond p{margin: 0;} .singleProduct .product .woocommerce-Reviews #commentform .comment-notes{font-size: 0.9em;} .singleProduct .product .woocommerce-Reviews #commentform label {font-weight: 700;} .singleProduct .product .woocommerce-Reviews #review_form #respond #commentform > div, .singleProduct .product .woocommerce-Reviews #review_form #respond #commentform > p {margin: 25px 0;} .singleProduct .product .woocommerce-Reviews #review_form{margin: 0 auto; width: 92%; max-width: 920px;} .singleProduct .product .woocommerce-Reviews .comment-form-cookies-consent{display: flex;} .singleProduct .product .woocommerce-Reviews .comment-form-cookies-consent input{width: fit-content; margin-right: 10px;} .singleProduct .product .woocommerce-Reviews .form-submit{width: fit-content; margin: 0 auto;} .singleProduct input[type=number]::-webkit-inner-spin-button, .singleProduct input[type=number]::-webkit-outer-spin-button{opacity: 1;} .pswp__bg{opacity: 0.7 !important;} /* Lightbox black overlay opacity*/ .singleProduct .related ul:after{content: none;} /* --- My account --- */ .woocommerce-page #header.scrolled #nav .menu .menu-item:first-child img{max-height: 32px;} .profilePage ul{list-style: none; padding: 0;} .profilePage .woocommerce{display: flex; flex-flow: row wrap; justify-content: space-between; gap: 2%;} .profilePage .woocommerce h2, .profilePage .woocommerce .login, .profilePage .woocommerce .woocommerce-ResetPassword, .profilePage .woocommerce .woocommerce-notices-wrapper{flex: 0 0 100%;} .profilePage .woocommerce .woocommerce-MyAccount-navigation{flex: 0 0 20%; position: relative;} .profilePage .woocommerce .woocommerce-MyAccount-navigation:after{content: ''; position: absolute; left: 100%; top: 0; display: block; width: 1px; height: 100%; background: #bbb;} .profilePage .woocommerce .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link{margin: 10px 0;} .profilePage .woocommerce .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link:hover a{color: var(--third-color);} .profilePage .woocommerce .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link a{font-weight: 500; text-transform: uppercase; transition: 0.2s all ease-in-out;} .profilePage .woocommerce .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link.is-active a{position: relative; color: var(--third-color);} .profilePage .woocommerce .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link.is-active a:after{content: ''; display: block; position: absolute; width: 100%; height: 2px; background: var(--third-color);} .profilePage .woocommerce .woocommerce-MyAccount-content{flex: 0 0 76%;} .profilePage .woocommerce .woocommerce-MyAccount-content a{color: var(--third-color); transition: 0.2s all ease-in-out;} .profilePage .woocommerce .woocommerce-MyAccount-content a:hover{color: #000;} .profilePage .woocommerce .woocommerce-MyAccount-content .edit{float: none;} .profilePage .woocommerce .woocommerce-MyAccount-content .button{color: #515151;} .profilePage .woocommerce .woocommerce-MyAccount-content .button:hover{color: #fff; background: var(--third-color);} .woocommerce-account .productsRow .button.all{display: none;} /* --- Wishlist --- */ /* .productsRow .wishlistTable{border: 1px solid rgba(0,0,0,.1); border-radius: 5px; border-collapse: separate; width: 100%;} .productsRow .wishlistTable th{vertical-align: middle; padding: 9px 12px;} .productsRow .wishlistTable .wishlistItem td{padding: 9px 12px; border-top: 1px solid rgba(0,0,0,.1);} .productsRow .wishlistTable .wishlistItem .prTitle{font-size: 1.1em; font-weight: 500;} .productsRow .wishlistTable .wishlistItem .prTitle:hover{color: var(--third-color);} .productsRow .wishlistTable .wishlistItem .product-thumbnail{min-width: 75px;} .productsRow .wishlistTable .wishlistItem .product-thumbnail img{width: 100%; height: 150px !important; object-fit: contain;} .productsRow .wishlistTable .wishlistItem .product-options .button{display: block; margin: 10px 0; white-space: nowrap; box-shadow: none; text-align: center;} .productsRow .wishlistTable .wishlistItem .product-options .button .icon{height: 16px; width: auto; object-fit: cover; border-radius: 0; margin-right: 5px;} .productsRow .wishlistTable .wishlistItem .product-options .button:hover .icon{filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(196deg) brightness(104%) contrast(101%);} */ /* --- Cart --- */ .woocommerce table.cart td.actions .coupon .input-text{width: fit-content; padding: 11px; border: 1px solid var(--third-color);} /* .woocommerce-cart table.cart td.actions .coupon{width: fit-content; padding: 11px; border: 1px solid var(--third-color);} */ .woocommerce-cart-form .remove:hover{transition: 0.2s all ease-in-out;} .woocommerce-cart-form .product-name a{transition: 0.2s all ease-in-out;} .woocommerce-cart-form .product-name a:hover{color: var(--third-color);} .woocommerce .variation p{margin: 0;} .woocommerce-cart-form table.cart img{width: 100%; height: 150px !important; object-fit: contain;} .woocommerce a.button.alt{background: #DEDEDE; color: #515151; border-radius: 5px; font-weight: 700; font-size: 1em; margin: 0 auto; transition: 0.2s all ease-in-out;} .woocommerce a.button.alt:hover{background: var(--third-color); color: #fff;} .woocommerce .cart-collaterals .cross-sells .products{display: flex; flex-flow: row wrap; gap: 30px;} .woocommerce .cart-collaterals .cross-sells .boxItem{margin: 0; padding: 15px !important; max-width: calc(50% - 15px);} .woocommerce .cart-collaterals .cross-sells .boxItem .onsale{top: 15px; left: 15px; margin: 0;} .woocommerce .cart-collaterals .cross-sells .boxItem a{flex-grow: 1;} .woocommerce .cart-collaterals .cross-sells .boxItem a img{margin: 0;} .woocommerce .cart-collaterals .cross-sells .boxItem .price{font-size: 1.3em; color: var(--third-color); font-weight: 700;} .woocommerce .cart-collaterals .cross-sells .boxItem .button{display: flex;} .woocommerce .cart-collaterals .cross-sells .boxItem .button:hover{background: var(--third-color); color: #fff;} .woocommerce .cart-collaterals .cross-sells .boxItem .price del{color: #757575;} .woocommerce button.button{line-height: 23px; border: 1px solid transparent;} /* --- Checkout --- */ /* .woocommerce button.button.alt{background: var(--third-color); color: #fff;} */ /* .woocommerce button.button.alt.disabled{background-color: var(--third-color);} */ /* .woocommerce button.button.alt:hover{background: #DEDEDE; color: #515151;} */ form.woocommerce-checkout{display: flex; flex-flow: row wrap; justify-content: space-between;} /* .woocommerce .shop_table td{width: 48%;} */ .woocommerce-checkout .billingInfo{flex: 0 0 47%; display: flex; flex-flow: column;} .woocommerce-checkout .billingInfo .col-1{width: 100%;} .woocommerce-checkout .billingInfo .col-2{width: 100%;} .woocommerce-checkout .reviewOrder{position: sticky; top: 0; height: 100%; flex: 0 0 47%;} .woocommerce #billing_address_1_field, .woocommerce #billing_address_2_field {display: none !important;} .woocommerce-checkout .select2-container--default .select2-selection--single{border: 1px solid var(--third-color); border-radius: 5px; font-size: 0.85em;} .woocommerce-checkout .select2-container .select2-selection--single{box-sizing: content-box; height: 100%; padding: 10px;} .woocommerce-checkout .select2-container .select2-selection--single .select2-selection__rendered{line-height: normal;} .woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow{top: 50%; transform: translateY(-50%);} .woocommerce-checkout .select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option--highlighted[data-selected]{background-color: var(--third-color);} #payment .payment_box p{margin: 0;} .woocommerce-invalid #terms{outline: 2px solid #cc3300; outline-offset: -2px;} .woocommerce-checkout .woocommerce-NoticeGroup{flex: 0 0 100%;} .woocommerce table.shop_table td{line-height: 1.3em;} /* --- Order --- */ .woocommerce-table--order-details .wc-item-meta p{margin: 10px 0;} .woocommerce-customer-details--phone, .woocommerce-customer-details--email{margin: 10px 0; display: flex; align-items: center;} .woocommerce-table--order-details td{width: 33%;} /* --- Responsive design ---*/ @media screen and (max-width:1220px){ .productCategories .categoriesWrapper {grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));} .woocommerce .cart-collaterals .cross-sells, .woocommerce .cart-collaterals .cart_totals{width: 100%;} .sidebarFilters{height: 100%; display: none;} .sidebarFilters, .productsContainer{flex: 0 0 100%;} .sidebarFilters{position: relative; margin-bottom: 30px;} .showFilters{display: block;} /* .productCategories .category{flex: 0 0 30%;} */ .productsContainer ul.products li.product a img {height: 300px;} } @media screen and (max-width:1024px){ .swiper-section .swiper-button-next, .swiper-section .swiper-button-prev{display: none;} #header .headerBar{justify-content: space-between; flex-wrap: nowrap;} #nav.left, #nav.right{display: none;} #hamburger{display: flex;} #nav.primary{position: absolute; top: 100%; left: 0; transform: translateX(+100%); background: var(--primary-color); transition: all 0.5s ease-in-out; padding: 0 4%; border-radius: 0; width: 100%; margin-left: 0;} #nav.primary .menu{flex-flow: column; align-items: flex-start;} #nav.active{display: block; transform: translateX(0);} #nav.primary .menu .menu-item a{padding: 15px 15px 11px; font-size: 1.2em; color: var(--secondary-color);} #nav.primary .menu .menu-item:hover .sub-menu{display: none;} #header .logo{margin: 0; margin-left: 20px;} #contactPage .contactInfo{gap: 30px;} #contactPage .contactInfo .article{flex: 0 0 46%;} #footer .member{flex-flow: row wrap; justify-content: center;} #footer .rowF{flex-flow: column; align-items: center; text-align: center;} #footer .fNav ul{flex-flow: column; align-items: center;} #footer .fNav ul li{padding: 0; margin: 0; border-right: 0;} #footer .fNav ul li a{line-height: 2em;} #footer .logo{margin-bottom: 30px;} #footer .fInfo{flex-flow: column; text-align: center;} #footer .fInfo .cpr{flex-flow: column wrap;} #footer .fInfo .sepr{border: 0; padding: 0; line-height: 2em;} #footer .fInfo .cprText{line-height: 2em;} #footer .fInfo .credit{overflow: hidden;} .productCategories .category{flex: 0 0 30%;} .productCategories.woo{display: none;} .singleProduct .product .woocommerce-product-gallery, .singleProduct .product .summary{flex: 0 0 100%;} .singleProduct .product .summary{margin-top: 30px;} .profilePage .woocommerce{flex-flow: column;} .profilePage .woocommerce .woocommerce-MyAccount-navigation:after{content: none;} .profilePage .woocommerce .woocommerce-MyAccount-content{margin-top: 20px;} .boxItem .ctaLine .button:hover .hiddenText{margin: 0;} form.woocommerce-checkout{flex-flow: column;} .woocommerce-message{display: flex; flex-flow: column-reverse;} .woocommerce-page .woocommerce-message button{width: fit-content; margin-top: 10px;} } @media screen and (max-width:900px){ #frontPage .about{flex-flow: column;} #frontPage .about .img-wrap{flex: 0 0 100%; z-index: 0} #frontPage .about .img-wrap img {border-radius: 0;} #frontPage .about .text-wrap{max-width: 70%; position: relative; left: 0; margin-top: -5%;} } @media screen and (max-width:786px){ .flexrow{flex-flow: row wrap;} .button{font-size: 0.9em;} #counter{gap: 2.5em 0;} #advantages{row-gap: 50px;} #counter .box, #advantages .box{flex: 0 0 45%;} /* #frontPage .testimonialsSlider .item .text{width: 100%;} */ /* #frontPage .testimonialsSlider .swiper-button-next, #frontPage .testimonialsSlider .swiper-button-prev {display: none;} */ #contactPage .mapForm{flex-flow: column; gap: 20px;} #contactPage .mapForm .item.left iframe{height: 40vh;} .category-grid{grid-template-columns: 1fr;} .productsContainer .woocommerce-ordering, .productsContainer .woocommerce-result-count{flex: 0 0 100%; margin: 1em 0;} .woocommerce .cart .coupon{display: flex; flex-flow: column;} .woocommerce .cart .coupon > *{width: 100% !important; margin: 5px 0;} } @media screen and (max-width:600px){ .productsContainer ul.products {grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));} .swiper-pagination{display: none;} /* FIX EDIT UPDATE CART*/ body{overflow-x: hidden;} } @media screen and (max-width:500px){ .imageBackground .wrapper{width: 100%;} #counter .box, #advantages .box{flex: 0 0 100%;} #contactPage .contactInfo{flex-flow: column;} /* .tnp-subscription input[type=submit], .tnp-profile input[type=submit]{width: auto !important;} */ .woocommerce .cart-collaterals .cross-sells .boxItem{width: 100% !important;} .woocommerce .singleProduct .product .woocommerce-tabs .tabs{flex-flow: column; gap: 15px;} } @media screen and (max-width:345px){ .gridflow{overflow: hidden;} }