/* ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ||||| --> COMMON VVV VVV VVV VVV VVV VVV VVV */ /* --> COMMON > COLORS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ body { --accent1: #fff; /* --accent2: #D9C4CD; */ --accent2: #D9C4CD; --accent3: #222222; --accent4: #D9C4CD; --accent5: #D6A8BC; --accent6: #D187A7; } /* ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ||||| --> COMMON VVV VVV VVV VVV VVV VVV VVV /* --> COMMON > HEADER, FOOTER, MENU BG COLOR [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ header, #menu_container, #menu { background-color: var(--accent1); } header { box-shadow: 0 2px 7px 3px rgba(0, 0, 0, 0.06); } footer, header { max-width: 1920px; margin: auto; width: 100%; } header a, footer a, #menu_container a { color: var(--accent3); } #menu #menu_container svg { fill: var(--accent3) } /* --> COMMON > PAGE LAYOUTS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ html:not(:is(.home, .common-home)) header~.container:not(.newsletter-guest-footer) { max-width: 1800px; width: 100%; } .container { width: 100%; } /* --> COMMON > HOVER COLOR! [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ header a:hover, footer a:hover, .menu-content a:hover, .menu-content .extra_links a:hover { color: var(--accent2) !important; } .socials_section a svg:hover { fill: var(--accent2); } /* --> COMMON > DIMENSIONS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ body { --minicart-width: 635px; } /* --> COMMON > BREADCRUMBS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .breadcrumb, .breadcrumb a { white-space: normal; } /* --> COMMON > PAGINATION [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #mfilter-content-container>div>.row:last-child { margin-top: 30px !important; } .pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover { background-color: #666; border-color: #666; } .pagination>li>a:focus, .pagination>li>a:hover, .pagination>li>span:focus, .pagination>li>span:hover, .pagination>li>a, .pagination>li>span { color: #000; } /* ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ /* !SECTION */ /* SECTION HEADER > SEARCH VVV VVV VVV VVV VVV VVV VVV */ .live-search-div .for_english, .live-search-div .for_greek { display: none; } html[lang*="en"] .live-search-div .for_english, html[lang*="gb"] .live-search-div .for_english { display: inline; } html[lang*="gr"] .live-search-div .for_greek, html[lang*="el"] .live-search-div .for_greek { display: inline; } html body .live-search-div ul li .product-name { color: var(--accent6) !important; } /* ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ||||| --> HEADER > MENU VVV VVV VVV VVV VVV VVV VVV */ /* --> HEADER > LAYOUT [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ header>.container>.row { min-width: -webkit-fit-content !important; min-width: -moz-fit-content !important; min-width: fit-content !important; justify-content: space-between !important; display: flex; } header>.container>.row:before, header>.container>.row:after { display: none !important; } header>.container>.row>div { min-width: -webkit-fit-content !important; min-width: -moz-fit-content !important; min-width: fit-content !important; width: -webkit-fit-content !important; width: -moz-fit-content !important; width: fit-content !important; } /* --> HEADER > LAYOUT > LOGO SECTION [2] =========================================================================================================== */ .logo_content { padding-inline: 0px !important; } /* --> HEADER > MENU > BURGER BUTTON [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #menu_toggle_section { display: flex; align-items: flex-end; } #menu_toggle_section>#burger_button { cursor: pointer; } #menu_toggle_section>#burger_button svg { width: 40px !important; height: 40px !important; } #menu_toggle_section>#category { font-size: 15px; } /* --> HEADER > MENU > CONTAINER [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ /* --> HEADER > MENU > CONTAINER > OUTER [2] =========================================================================================================== */ #menu { display: flex; } #menu_container { width: 400px; position: fixed; top: 0px; left: 0px; z-index: 9; height: 100vh; overflow: auto; display: flex; flex-direction: column; padding: 50px; } #menu_container, html:after { transition: all 0.2s; } /* --> HEADER > MENU > CONTAINER > INNER [2] =========================================================================================================== */ #menu .nav.navbar-nav li.dropdown .dropdown-menu { padding-left: 50px; padding-right: 50px; width: 100%; background: var(--accent1); } /* --> HEADER > MENU > CONTAINER > HEIGHTS [2] =========================================================================================================== */ #menu_header { height: 100px; margin-bottom: 30px; } #menu .nav.navbar-nav li.dropdown .dropdown-menu { height: calc(100vh - 40%); overflow: auto; } /* --> HEADER > MENU > CONTAINER > REVEAL [2] =========================================================================================================== */ #menu_container { transform: translateX(-100%); } header::after { background: #000; content: ""; position: fixed; top: 0px; right: 0px; width: 100vw; height: 100vh; z-index: 8; } header:after { visibility: hidden; opacity: 0; transition: all 0.4s; } #menu_container { transition: all 0.4s; } .menu_revealed #menu_container { transform: translateX(0px); visibility: visible; opacity: 1; /* width:25%; */ } @media(max-width:767px) { .menu_revealed #menu_container { width: 80% !important; z-index: 99999999; } .menu_revealed #menu_container .menu-content-top-section li { border-bottom: solid 0.5px #d8d8d8; padding-bottom: 4px; } .menu_revealed #menu_container .menu-content-top-section li svg:not(.arrow_back > svg) { display: none; } } .menu_revealed header:after { visibility: visible; opacity: .5; } #menu .navbar-nav { margin: none !important; } /* --> HEADER > MENU > BURGER BUTTON [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .navbar-toggle { display: block !important; } /* --> HEADER > MENU > CLOSE BUTTON [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #menu_close_button { position: absolute; top: 15px; right: 15px; z-index: 99999; cursor: pointer; } #menu_close_button svg { width: 25px; height: 25px; fill: white; } /* #menu_close_button svg:hover{ color: var(--accent1); } */ /* --> HEADER > MENU > HEADER [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #menu_header { display: flex; align-items: center } /* --> HEADER > MENU > HEADER > LOGO [2] =========================================================================================================== */ #menu_header a { margin: 0 auto; display: block; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; } /* --> HEADER > MENU > DROPDOWNS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ /* --> HEADER > MENU > DROPDOWNS > ALL LEVELS [2] =========================================================================================================== */ #menu .dropdown .dropdown-menu { display: block; position: relative; width: 100%; } #menu .dropdown .dropdown-menu .dropdown-inner { display: flex; flex-direction: column; align-items: baseline; } /* --> HEADER > MENU > DROPDOWNS > ALL LEVELS > FONTS [3] ------------------------------------------------------------- */ #menu .nav.navbar-nav a { font-size: 18px !important; } #menu .nav.navbar-nav a:hover { color: var(--font1); } /* --> HEADER > MENU > DROPDOWNS > ALL LEVELS > ALL LINKS [3] ------------------------------------------------------------- */ .navbar-nav>li>a, .dropdown-menu>li>a { background: transparent !important; padding: none !important; text-transform: uppercase; } #menu .extra_links>a { padding: 9px 30px; line-height: normal; color: white; } #menu .extra_links { /* height: 200px; */ margin-top: 30px; } #menu .extra_links>.col-sm-5 { width: 100% !important; padding: 0px !important; } .dropdown-inner>ul>li>a { background: transparent !important; padding: 7px 30px !Important; text-transform: capitalize !important; display: block; color: var(--accent3) !important; } #burger_button line, #burger_button svg { stroke: var(--accent3); fill: var(--accent3); } .navbar-nav>li>a, .dropdown-menu>li>a, #menu .extra_links>a, .dropdown-inner>ul>li>a, #menu .parent_header .arrow_back svg { transition: all 0.12s; font-size: 14px !important; } .navbar-nav>li>a:hover, .dropdown-menu>li>a:hover, #menu .extra_links>a:hover, .dropdown-inner>ul>li>a:hover, .menu-blog a:hover { color: var(--accent5) !important; } /* --> HEADER > MENU > DROPDOWNS > ALL LEVELS > DROPDOWN ARROW [3] ------------------------------------------------------------- */ #menu .nav.navbar-nav li.dropdown>a { display: flex; align-items: center; line-height: 1; font-weight: normal !important; font-size: 23px; } #menu .nav.navbar-nav li.dropdown>a>.toggle_arrow { line-height: 1; } #menu .nav.navbar-nav .toggle_arrow>svg { width: 20px; height: 20px; fill: white; margin-left: 10px; } /* --> HEADER > MENU > DROPDOWNS > ALL LEVELS > DROPDOWN TOGGLING [3] ------------------------------------------------------------- */ #menu .navbar-nav .dropdown-menu, #menu .nav.navbar-nav li.dropdown { position: static !important; } #menu .nav.navbar-nav li.dropdown .dropdown-menu { position: absolute !important; z-index: 9999; top: 0px; left: 0px; transition: all 0.2s; transform: translateX(0px) !important; padding-top: 50px; opacity: 0; visibility: hidden; } #menu .nav.navbar-nav li.dropdown.dropdown_activated > .dropdown-menu { transform: translateX(0px) !important; opacity: 1; visibility: visible; top: 170px; box-shadow: none !important; overflow: hidden; } .dropdown-menu.third-level { top: -3px !important; } #menu .dropdown-inner ul.list-unstyled { flex-direction: column; display: flex !important; gap: 20px; align-items: center; width: 100%; } #menu .dropdown-inner ul.list-unstyled>li>a { padding: 0px !important; } /* --> HEADER > MENU > DROPDOWNS > LEVEL #1 [2] =========================================================================================================== */ #menu .nav.navbar-nav { flex-direction: column; } #menu .nav.navbar-nav { display: flex; flex-direction: column; width: 100%; gap: 25px; justify-content: center; } /* --> HEADER > MENU > DROPDOWNS > INNER LEVELS [2] =========================================================================================================== */ /* --> HEADER > MENU > DROPDOWNS > INNER LEVELS > PARENT HEADER [3] ------------------------------------------------------------- */ #menu .parent_header { display: flex; flex-direction: row; margin-bottom: 30px; } /* --> HEADER > MENU > DROPDOWNS > INNER LEVELS > PARENT HEADER > ARROW BACK */ #menu .parent_header .arrow_back svg { fill: white; transform: rotate(180deg); width: 20px; height: 20px; cursor: pointer; margin-right: 10px; } #menu .parent_header .arrow_back svg:hover { fill: var(--accent4) !important; } /* --> HEADER > MENU > DROPDOWNS > INNER LEVELS > PARENT HEADER > PARENT LINK */ #menu .parent_header>a { padding: 0px; text-transform: uppercase !important; color: var(--accent6) !important; } /* --> HEADER > MENU > BLOG [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #menu .menu-blog { display: none !important; } /* --> HEADER > MENU > EXTRA LINKS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #menu .extra_links { display: flex; flex-direction: column; padding-top: 20px; border-top: 1px solid rgba(255, 255, 255, .2) } #menu .extra_links ul { display: flex; flex-direction: column; width: 100%; gap: 10px; } #menu .extra_links a { text-transform: uppercase; } /* ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ||||| --> HEADER VVV VVV VVV VVV VVV VVV VVV */ #menu .nav.navbar-nav .dropdown:first-child { order: unset; } /* --> HEADER > MEGA MENU [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ /* --> HEADER > MEGA MENU > DEMO SETTINGS [2] =========================================================================================================== */ /* --> HEADER > MEGA MENU > CHILDREN > DEMO SETTINGS > SHOW UP TO 7 IN LISTS [3] ------------------------------------------------------------- */ #menu .mg-menu-container>.mg-menu-cont:nth-child(n+8), .mg-menu-item-children-list>div:nth-child(n+8) { display: none !important; } /* --> HEADER > MEGA MENU > VARIABLES [2] =========================================================================================================== */ #menu .dropdown-menu.mega-menu { --mega-menu-parent-list-width: 250px; --mega-menu-banner-width: 500px; --mega-menu-horizontal-padding-per-side: 20px; --mega-menu-vertical-padding-per-side: 20px; } /* --> HEADER > MEGA MENU > LAYOUT [2] =========================================================================================================== */ #menu>.collapse>.nav>li .dropdown-menu.mega-menu { width: 1350px; max-width: 100%; margin-left: 50% !important; transform: translateX(-50%); /* border:1px solid purple; */ padding: 0px !important; height: 287px } #menu>.collapse>.nav>li .dropdown-menu.mega-menu::after { content: ""; width: 200vw; height: 100%; background: white; position: absolute; transform: translateX(-50%); z-index: -1; box-shadow: 0 6px 12px rgba(0, 0, 0, .175); } #menu>.collapse>.nav>li .dropdown-menu.mega-menu .dropdown-inner { padding: var(--mega-menu-vertical-padding-per-side) var(--mega-menu-horizontal-padding-per-side) !important; } /* --> HEADER > MEGA MENU > DEV OPEN FIRST [2] =========================================================================================================== */ /* #menu > .collapse > .nav > li:nth-child(2) .dropdown-menu.mega-menu { display: flex !important; } */ /* --> HEADER > MEGA MENU > CONTAINER [2] =========================================================================================================== */ #menu .mg-menu-container { display: flex !important; flex-direction: column; flex-wrap: nowrap; max-height: 100%; } /* --> HEADER > MEGA MENU > PARENTS [2] =========================================================================================================== */ #menu .mg-menu-container>.mg-menu-cont { /* border:1px solid red; */ width: var(--mega-menu-parent-list-width); } /* --> HEADER > MEGA MENU > CHILDREN [2] =========================================================================================================== */ /* --> HEADER > MEGA MENU > CHILDREN > TITLES [3] ------------------------------------------------------------- */ #menu .dropdown-menu.mega-menu .mg-menu-item-title { margin-top: 0px; margin-bottom: 0px; position: relative; overflow: hidden; } #menu .dropdown-menu.mega-menu .mg-menu-item-title>a { color: black !important; font-weight: bold !important; font-size: 16px !important; padding: 8px 0px 8px 10px; min-width: auto !important; position: relative; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; } /* HEADER > MEGA MENU > CHILDREN > TITLES > LINE */ #menu .dropdown-menu.mega-menu .mg-menu-item-title.with-children>a:after { content: ""; position: absolute; left: 100%; top: 50%; transform: translate(15px, -50%); width: 0px; background: #8D8D8D; height: 1px; } /* --> HEADER > MEGA MENU > CHILDREN > LISTS [3] ------------------------------------------------------------- */ #menu .dropdown-menu.mega-menu .mg-menu-cont .mg-menu-item-children-list { position: absolute; left: calc(var(--mega-menu-parent-list-width) + 20px); top: 20px; /* border: 1px solid blue; */ height: 100%; width: calc(100% - var(--mega-menu-banner-width) - var(--mega-menu-parent-list-width)); transform: translateX(-10px); opacity: 0; visibility: hidden; display: flex; flex-direction: column; flex-wrap: wrap; padding-left: 10px; padding-bottom: 20px !Important; box-sizing: border-box; } #menu .dropdown-menu.mega-menu .mg-menu-cont .mg-menu-item-children-list>div { /* border: 1px solid green; */ width: 50%; } #menu .dropdown-menu.mega-menu .mg-menu-cont .mg-menu-item-children-list>div>a { font-size: 16px; padding: 8px !important; } /* --> HEADER > MEGA MENU > CHILDREN > LINKS [3] ------------------------------------------------------------- */ #menu .dropdown-menu.mega-menu a { line-height: normal !important; } /* --> HEADER > MEGA MENU > CHILDREN > BANNER [3] ------------------------------------------------------------- */ #menu .dropdown-menu.mega-menu .see-all { padding: 20px !important; display: flex; justify-content: flex-end; } .dropdown-menu.mega-menu .see-all .img-responsive { height: 100%; width: auto; } /* --> HEADER > MEGA MENU > EFFECTS [2] =========================================================================================================== */ /* --> HEADER > MEGA MENU > EFFECTS > LINE [3] ------------------------------------------------------------- */ #menu .dropdown-menu.mega-menu .mg-menu-item-title>a:after { transition: all 0.14s; } #menu .dropdown-menu.mega-menu .mg-menu-cont:hover .mg-menu-item-title>a:after { width: 200px; transition: all 1s; } /* --> HEADER > MEGA MENU > EFFECTS > CHILDREN LIST [3] ------------------------------------------------------------- */ #menu .mg-menu-container>.mg-menu-cont .mg-menu-item-children-list { transition: all 0.14s; } #menu .mg-menu-container>.mg-menu-cont:hover .mg-menu-item-children-list { transition: all 0.3s 0.3s; transform: translateX(0px); visibility: visible; opacity: 1; } /* --> HEADER > MEGA MENU > LINKS [3] ------------------------------------------------------------- */ #menu .dropdown-menu.mega-menu a { transition: all 0.12s; } #menu .dropdown-menu.mega-menu a:hover { color: var(--accent2) !important; } /* --> HEADER > MEGA MENU > TITLES [3] ------------------------------------------------------------- */ #menu .dropdown-menu.mega-menu .mg-menu-cont .mg-menu-item-title>a>span { transform-origin: center center; transition: all .12s; display: block; } #menu .dropdown-menu.mega-menu .mg-menu-cont:hover .mg-menu-item-title>a>span { transform: scale(1.05) !important; color: var(--accent2) !important; } /* --> HEADER > MINICART [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ /* --> HEADER > MINICART > LAYOUT [2] =========================================================================================================== */ #cart .dropdown-menu { display: block !important; position: fixed; top: 0px; right: 0px; height: 100vh; transform: translateX(100%); transition: all 0.4s; border-radius: 0px; padding: 20px; width: var(--minicart-width); background: white; border: none; margin: 0px; } body:before { transition: all 0.4s; content: ""; background: rgba(0, 0, 0, 0.5); width: 100vw; height: 100vh; display: block; position: fixed; z-index: 4; opacity: 0; visibility: hidden; } #cart .dropdown-menu li>div { min-width: unset !important } /* --> HEADER > MINICART > LAYOUT > SECTIONS [3] ------------------------------------------------------------- */ #cart .dropdown-menu>li.top-section .minicart_content { max-height: calc(100vh - 405px); overflow: auto; } #cart .dropdown-menu>li.bottom-section { height: 295px; box-shadow: 17px -6px 27px 9px rgba(0, 0, 0, 0.34); } /* --> HEADER > MINICART > LAYOUT > SCROLLBAR [3] ------------------------------------------------------------- */ #cart .dropdown-menu>li.top-section .minicart_content::-webkit-scrollbar { width: 6px !important; } #cart .dropdown-menu>li.top-section .minicart_content::-webkit-scrollbar-thumb { background: var(--accent2) !important; border-radius: 3px !important; border: none !important; } #cart .dropdown-menu>li.top-section .minicart_content::-webkit-scrollbar-thumb:hover { background: var(--accent2) !important; } #cart .dropdown-menu>li.top-section .minicart_content::-webkit-scrollbar-track { background: #d8d8d8 !important; border-radius: 3px !important; } /* --> HEADER > MINICART > ENABLED [2] =========================================================================================================== */ .cart_enabled #cart .dropdown-menu { transform: translateX(0px); } .cart_enabled body:before { opacity: 1; visibility: visible; width: calc(100% - var(--minicart-width)); } /* --> HEADER > MINICART > EMPTY [2] =========================================================================================================== */ #cart .dropdown-menu .cart-empty { font-size: 18px; margin-top: 100px; color: black; } /* --> HEADER > MINICART > INTRO [2] =========================================================================================================== */ .minicart_intro { margin-bottom: 22px; } .minicart_intro .title { color: #000000; font-size: 12.79px; letter-spacing: 0.85px; line-height: 15px; text-align: center; font-family: var(--font1); text-transform: uppercase; } .minicart_intro .subtitle { font-family: var(--font2); color: #000000; font-size: 34.12px; line-height: 41px; text-align: center; font-weight: bold; text-transform: uppercase; } /* --> HEADER > MINICART > INTRO > EMPTY [3] ------------------------------------------------------------- */ #cart .dropdown-menu li.cart-empty p { margin: 20px 0; font-family: var(--font2); font-size: 22px; font-weight: bold; text-transform: uppercase; margin-top: 10px; } /* --> HEADER > MINICART > CLOSE BUTTON [2] =========================================================================================================== */ #cart_close_button { cursor: pointer; position: absolute; right: 20px; top: 20px; } /* --> HEADER > MINICART > PRODUCT LIST [2] =========================================================================================================== */ /* --> HEADER > MINICART > PRODUCT LIST > LAYOUT [3] ------------------------------------------------------------- */ #cart .dropdown-menu .table-products { border-collapse: separate; border-spacing: 0 25px; margin-top: -25px; padding-right: 30px; padding-left: 10px; } #cart .dropdown-menu .table-products td, #cart .dropdown-menu .table-products th { border: none; } #cart .dropdown-menu .table-products>tbody>tr { position: relative; } /* --> HEADER > MINICART > PRODUCT LIST > THUMB [3] ------------------------------------------------------------- */ #cart .dropdown-menu .product-thumb { vertical-align: middle; width: 150px; height: 150px; padding: 15px; } #cart .dropdown-menu .product-thumb img { width: 100%; height: auto; } #cart .dropdown-menu .product-thumb .img-thumbnail { /* width: 150px; height: 150px; */ border-radius: 0px; border: none; } /* --> HEADER > MINICART > PRODUCT LIST > INFO [3] ------------------------------------------------------------- */ #cart .dropdown-menu .product-info { display: flex; flex-direction: column; min-height: 150px; padding: 15px 0px 15px 20px; } #cart .dropdown-menu .product-info a { color: #000000; font-size: 16px; text-align: left; font-weight: bold; text-transform: uppercase; display: block; margin-bottom: 12px; } /* --> HEADER > MINICART > PRODUCT LIST > OPTIONS [3] ------------------------------------------------------------- */ #cart .dropdown-menu .product-info .product-options { margin-bottom: 8px; } #cart .dropdown-menu .product-info .product-options .option-name { font-weight: bold; color: black; font-size: 14px; text-transform: uppercase; } #cart .dropdown-menu .product-info .product-options .option-value { color: #6c6c6c; font-size: 15px; } /* --> HEADER > MINICART > PRODUCT LIST > PRICE [3] ------------------------------------------------------------- */ #cart .dropdown-menu .product-info .product-price { color: #000; font-size: 18px; font-weight: bold; margin-top: auto; } /* --> HEADER > MINICART > PRODUCT LIST > QTY [3] ------------------------------------------------------------- */ td.text-right.product-qty { vertical-align: bottom; font-size: 18px; font-weight: bold; color: black; position: absolute; bottom: 6px; right: 25px; border: none !important; } /* --> HEADER > MINICART > PRODUCT LIST > REMOVE [3] ------------------------------------------------------------- */ td.text-center.product-remove { width: 15px; } header #cart .btn.btn-danger.btn-xs { background: none; border-radius: 0px; border: none; padding: 5px; transform: translate(5px, -2px); } /* --> HEADER > MINICART > BOTTOM SECTION [2] =========================================================================================================== */ li.bottom-section { margin-top: auto; display: block; position: absolute; bottom: 0px; right: 0px; background: #fff; width: 100%; padding: 25px 20px; } li.bottom-section>div.container { width: 390px; max-width: 100%; } /* --> HEADER > MINICART > BOTTOM SECTION > TOTALS [3] ------------------------------------------------------------- */ /* hide subtotal section */ .bottom-section .container .totals>div:first-child { display: none; } .bottom-section .container .totals>div { color: #000000; font-family: "LXGW WenKai TC", cursive; font-size: 20px; line-height: 25px; text-align: left; display: flex; justify-content: space-evenly; } .bottom-section .container .totals>div .total-title { font-size: 16px; font-weight: 600; } .bottom-section .container .totals>div .total-text { font-size: 25px; font-weight: bold; } /* --> HEADER > MINICART > BOTTOM SECTION > BUTTONS [3] ------------------------------------------------------------- */ #cart .dropdown-menu .cart-footer { display: flex; flex-direction: column; width: 100%; text-align: center; justify-content: center; align-items: center; } #cart .dropdown-menu .cart-footer>a { width: 100%; height: 60px; display: flex; align-items: center; justify-items: center; max-width: 100%; color: #ffffff !important; font-size: 16px; font-weight: bold; text-transform: uppercase; background: black; } #cart .dropdown-menu .cart-footer>a:first-child { margin-bottom: 10px; background: var(--accent2); } #cart .dropdown-menu .cart-footer>a:last-child { border: 1px solid rgba(255, 255, 255, 0.35); /* background: none; */ } #cart .dropdown-menu .cart-footer>a>* { margin: 0 auto; } /* ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ||||| --> FOOTER VVV VVV VVV VVV VVV VVV VVV */ /* --> FOOTER > LAYOUT [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ footer { margin-top: 50px; } footer img{ height: auto; } /* ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ||||| --> HOME VVV VVV VVV VVV VVV VVV VVV */ /* --> HOME > COMMON [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ /* --> HOME > COMMON > TITLES [2] =========================================================================================================== */ /* --> HOME > COMMON > TITLES > SMALL [3] ------------------------------------------------------------- */ .module_product_tabs .section_before_title h4 { /* border: 1px solid red; */ margin: 0px; letter-spacing: 11px; line-height: 1.2 !important; margin-bottom: 8px } /* --> HOME > COMMON > TITLES > BIG [3] ------------------------------------------------------------- */ .module_product_tabs .section_title h2, #carousel0 h2, #carousel1 h2 { /* border: 1px solid blue; */ margin-top: 0px; margin-bottom: 0px; padding-top: 0px; padding-bottom: 0px !important; margin-bottom: 25px; line-height: 1 !important; } /* --> HOME > COMMON > WIDTHS [2] =========================================================================================================== */ #common-home #content>*:not(:is(.slideshow, div[data-apiid="94"], div[class*="banner"])) { max-width: 1800px; width: 100%; margin-inline: auto } #common-home #content>div[class*="banner"]>.swiper-container { width: 100% } #common-home #content>div[class*="banner"] { width: min(calc(50vw - (100vw - 1800px)/2), 50%) !important } @media(max-width: 768px) { #common-home #content>div[class*="banner"] { width: 100% !important; min-width: 100% } html[class*="home"] #common-home #content>.row.swiper-viewport.banner0 { margin-bottom: 0px !important } #common-home #banner1 { padding-top: 20px !important } } #common-home #content>div[class*="banner0"] { padding-right: 15px; } #common-home #content>div[class*="banner1"] { padding-left: 15px; } /* --> HOME > COMMON > DISTANCES [2] =========================================================================================================== */ #common-home .module_product_tabs[data-apiid="93"] { margin-top: 0px !important; } .module_product_tabs #products_carousel_0, .module_product_tabs #products_carousel_1 { padding-bottom: 65px !important; } #common-home #carousel0 { margin-bottom: 100px !important; } #banner0, #banner1 { padding-top: 65px !important; } html[class*="home"] #common-home #content>.row.swiper-viewport, html[class*="home"] #common-home #content>.row { margin-bottom: 100px !important; } /* @media (min-width: 1025px) { #common-home .module_product_tabs { margin-top: 140px !important; } } */ #banner2, #banner3 { padding-top: 80px !important; } #common-home #carousel1 { margin-bottom: 60px !important } html[class*="home"] #common-home #content>.row.latest-posts { margin-top: 40px; margin-bottom: 0px !important; } /* --> HOME > MANUFACTURERS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #carousel1 .swiper-slide>a>img { margin-inline: auto } #common-home #carousel0+.swiper-pagination+.swiper-pager { display: none !important; } #common-home #carousel0 { margin-bottom: 80px } #common-home #carousel0+.swiper-pagination, #common-home #carousel1+.swiper-pagination { bottom: 40px !important; } #common-home #carousel1 .swiper-button-prev, #common-home #carousel1 .swiper-button-next { margin-top: unset; } /* --> HOME > PRODUCT TABS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .module_product_tabs { display: flex; flex-direction: column; width: 100%; /* padding-left: 50px; padding-right: 50px; */ } /* --> HOME > PRODUCT TABS > TABS TITLE (HOME SPECIFIC) [2] =========================================================================================================== */ /* --> HOME > PRODUCT TABS > NAV TABS [2] =========================================================================================================== */ .module_product_tabs .nav-tabs { display: flex; justify-content: flex-start; margin: 0px; border: none !important; overflow: auto; /* padding-bottom: 10px; */ max-width: 100vw; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin-left: auto; margin-right: auto; flex-wrap: wrap; overflow: hidden; justify-content: center; } .module_product_tabs .nav-tabs>li { margin: 8px 8px 8px 8px; } .module_product_tabs .nav-tabs>li>a { border: 1px solid var(--accent1) !important; font-size: 16px; font-weight: normal !important; color: black; width: 220px; height: 50px; display: flex; align-items: center; justify-content: center; text-transform: uppercase; border-radius: 0px !important; transition: all 0.14s; background: white !important; line-height: normal; border: 1px solid black !important; letter-spacing: 1.5px; text-align: center; } /* --> HOME > PRODUCT TABS > NAV TABS > ACTIVE [3] ------------------------------------------------------------- */ .module_product_tabs .nav-tabs>li.active>a { background: black !important; color: white !important; } /* --> HOME > PRODUCT TABS > TAB PANE [2] =========================================================================================================== */ /* carousel in tabs fix */ .module_product_tabs .section_before_title h4 { color: #000000; font-family: "LXGW WenKai TC", cursive; font-size: 15px; letter-spacing: 13.5px; line-height: 18px; text-align: center; } .module_product_tabs .section_title h2 { color: #000000; font-family: "LXGW WenKai TC", cursive; font-size: 45px; line-height: 54px; text-align: center !important; padding-bottom: 30px; } .module_product_tabs .swiper-container { /* padding: 0px 20px; */ } .module_product_tabs .tab-content>.tab-pane { display: block !important; height: 0px !important; /* overflow:hidden; */ opacity: 0; visibility: hidden; transition: all .8s; } .module_product_tabs .tab-content>.tab-pane.active { height: auto !important; opacity: 1; visibility: visible; } /* --> HOME > PRODUCT TABS > TAB PANE > HIDE CUSTOM TITLE [3] ------------------------------------------------------------- */ .module_product_tabs .tab-content>.tab-pane h3 { display: none !important; } /* --> HOME > PRODUCT TABS > TAB PANE > PRODUCTS [3] ------------------------------------------------------------- */ #common-home .module_product_tabs .swiper-wrapper { margin-top: 35px; } .swiper-wrapper .product-layout { /* width: 100% !important; */ } /* --> HOME > PRODUCT TABS > TAB PANE > VIEW MORE [3] ------------------------------------------------------------- */ #common-home .module_product_tabs .view_more { position: absolute; right: 0px; top: -32px; } /* ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ||||| --> CATEGORY PAGE VVV VVV VVV VVV VVV VVV VVV */ /* --> CATEGORY PAGE > LAYOUT [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ html[class*="product"]:not([class*="product-product"]) body>.container:not([class*="newsletter-guest-footer"])>.row { display: flex; flex-direction: column; position: relative; } html[class*="product"]:not([class*="product-product"]) body>.container:not([class*="newsletter-guest-footer"])>.row>* { width: 100% !important; } html[class*="product"]:not([class*="product-product"]) #content, html[class*="product"]:not([class*="product-product"]) aside, .category_description, .category_description div, #mfilter-content-container>div, .desc-top, .desc-top div { padding-left: 0px !important; padding-right: 0px !important; } /* --> CATEGORY PAGE > HIDE TAGS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #mfilter-content-container>div~* { color: white !important; } /* --> CATEGORY PAGE > SORTING BAR [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ /* .sorting_bar { display: flex; flex-direction: row; justify-content: space-between; width: 100%; border: 1px solid red; } */ /* --> CATEGORY PAGE > SORTING BAR > COMPARE LINK [2] =========================================================================================================== */ html[class*="product"]:not([class*="product-product"]) #compare-total { display: none !important; } #mfilter-content-container>div>.row .form-group { margin: 0px; /* display:none; */ } /* --> CATEGORY PAGE > SORTING BAR > SELECT FIELDS DROPDOWNS [2] =========================================================================================================== */ .sorting_dropdowns { display: flex; align-items: center; } .filters_toggle~.col-md-3 { width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; left: 0px; right: 0px; padding-right: 0px; padding-left: 0px; } #mfilter-content-container .filters_toggle+div, #mfilter-content-container .filters_toggle+div+div, #input-limit, #input-sort { width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; } #mfilter-content-container .filters_toggle+div, #mfilter-content-container .filters_toggle+div+div { padding-left: 10px !important; padding-right: 0px; } #mfilter-content-container .input-group { display: flex; flex-direction: row; /* justify-content: space-between; */ align-items: baseline; flex-wrap: wrap; width: 100%; justify-content: flex-end; } #mfilter-content-container .input-group .input-group-addon { font-size: 15px !important; color: black !important; font-weight: bold !important; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; } #mfilter-content-container .input-group select { font-size: 15px !important; color: #000 !important; border-color: #c9c9c9 !important; padding: 0px !Important; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; padding-bottom: 2px !Important; } .sorting_dropdowns .form-group { margin-bottom: 0px; } /* --> CATEGORY PAGE > FILTERS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ @media(min-width: 768px) { html[class*="product"]:not([class*="product-product"]) aside { z-index: 3; width: 100%; border: none !important; } html[class*="product"]:not([class*="product-product"]) aside .mfilter-box { width: 100%; } .mfilter-box { padding-bottom: 30px; /* padding-top: 40px; */ top: 40px !important; position: absolute; } .product-category .mfilter-box, .product-manufacturer-info .mfilter-box { padding-top: 40px; } .mfilter-button .mfilter-button-reset:hover { background: black; color: white !important; transition: all 0.5s; } .mfilter-button-top { width: 370px !important; height: 67px !important; border: 1px solid #979797; position: relative !important; margin-left: -15px !important; padding: 0 !important; margin-bottom: 30px; } } .mfilter-button.mfilter-button-top>a>i { display: none; } .mfilter-button .mfilter-button-reset { color: black; font-size: 15px; text-decoration: none !important; position: relative !important; width: inherit; text-align: center; margin: auto; height: 67px; padding: 6%; } .mfilter-box::before { content: ""; background: white; width: 100vw; position: absolute; top: 30px; left: 50%; display: block; height: 100%; transform: translateX(-50%); box-shadow: 0 14px 17px 0 rgba(145, 145, 145, 0.5); } html[class*="product"]:not([class*="product-product"]) .mfilter-box .box-heading { display: none; } html[class*="product"]:not([class*="product-product"]) body>.row>* { width: 100% !important; } @media(min-width: 769px) { .mfilter-content>ul { flex-wrap: wrap; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 40px 86px; } } .box-content.mfilter-content { max-height: unset !important; padding-right: 0px !important; overflow: visible !important; } /* --> CATEGORY PAGE > FILTERS > TOGGLE [2] =========================================================================================================== */ .filters_toggle { width: -webkit-fit-content !important; width: -moz-fit-content !important; width: fit-content !important; float: left; } /* --> CATEGORY PAGE > FILTERS > TOGGLE > BUTTONS [3] ------------------------------------------------------------- */ .mfilter-button-bottom { position: relative; } .filters_toggle { border: 1px solid #979797; width: 370px !important; height: 67px !important; position: relative; } .filters_toggle>div { cursor: pointer; display: flex; align-items: center; position: absolute; top: 0px; left: 0px; height: 100%; width: 100%; opacity: 0; visibility: hidden; transition: 0.12s; justify-content: center; text-transform: uppercase; font-size: 14px; font-family: var(--font2); color: #000; } .filters_toggle>div svg { margin-right: 10px; } /* CATEGORY PAGE > FILTERS > TOGGLE > BUTTONS > OPEN */ .filters_toggle>div.open_filters { visibility: visible; opacity: 1; } /* CATEGORY PAGE > FILTERS > TOGGLE > BUTTONS > CLOSE */ html.filters_enabled .filters_toggle>div.open_filters { visibility: hidden; opacity: 0; } html.filters_enabled .filters_toggle>div.close_filters { visibility: visible; opacity: 1; } /* --> CATEGORY PAGE > FILTERS > TOGGLE > TOGGLING [3] ------------------------------------------------------------- */ /* STATUS: DISABLED */ .mfilter-box { transform: translateY(-10px); opacity: 0; visibility: hidden; transition: all 0.3s; } /* STATUS: ENABLED */ .filters_enabled .mfilter-box { transform: translateY(0px); opacity: 1; visibility: visible; } /* --> CATEGORY PAGE > FILTERS > HEADING [2] =========================================================================================================== */ /* --> CATEGORY PAGE > FILTERS > TITLES [2] =========================================================================================================== */ .mfilter-content>ul>li { margin-bottom: 0px !important; position: relative; } .mfilter-content>ul li .mfilter-heading-content { padding: 0px; } .mfilter-content>ul li .mfilter-heading-content { padding: 0px; display: flex; align-items: center; } /* --> CATEGORY PAGE > FILTERS > TITLES > ARROWS [3] ------------------------------------------------------------- */ .mfilter-heading .mfilter-head-icon { width: 25px !important; height: 25px !important; display: flex !important; justify-content: center !important; align-items: center !important; } .mfilter-heading .mfilter-head-icon::after { content: "" !important; width: 11px !important; height: 11px !important; background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 330 330' style='enable-background:new 0 0 330 330;' xml:space='preserve'%3E%3Cpath id='XMLID_225_' d='M325.607,79.393c-5.857-5.857-15.355-5.858-21.213,0.001l-139.39,139.393L25.607,79.393 c-5.857-5.857-15.355-5.858-21.213,0.001c-5.858,5.858-5.858,15.355,0,21.213l150.004,150c2.813,2.813,6.628,4.393,10.606,4.393 s7.794-1.581,10.606-4.394l149.996-150C331.465,94.749,331.465,85.251,325.607,79.393z'/%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3C/svg%3E") !important; display: block !important; background-repeat: no-repeat !important; background-size: 100% !important; transition: all 0.12s !important; transform: rotate(180deg) !important; } .mfilter-heading.mfilter-collapsed .mfilter-head-icon::after { transform: rotate(0deg) !important; } /* --> CATEGORY PAGE > FILTERS > DROPDOWNS [2] =========================================================================================================== */ .mfilter-filter-item .mfilter-options { padding: 0px !important; } .mfilter-content-opts { position: absolute !important; background: white; z-index: 3; border: 1px solid #C9C9C9; width: 100%; border-top: none; } .mfilter-content-opts .mfilter-option { /* padding: 5px 7px !important; */ display: block; } .mfilter-content-opts .mfilter-option label { /* padding-right: 10px !important; */ } .mfilter-opts-container { border: none; padding: 0px !important; } /* --> CATEGORY PAGE > FILTERS > DROPDOWNS > INNER [3] ------------------------------------------------------------- */ /* container */ .mfilter-opts-container>.mfilter-content-wrapper { margin-top: 0px !important; padding: 10px 18px !important; } /* input boxes */ .mfilter-tb-as-td.mfilter-col-input { transform: translateY(-2px); } /* input labels */ .mfilter-content-opts .mfilter-option label { /* padding-right: 10px !important; */ margin: 2px; line-height: normal; font-size: 16px !important; color: #000000; text-transform: none !Important; } /* --> CATEGORY PAGE > FILTERS > APPLY [2] =========================================================================================================== */ .mfilter-button-bottom { padding: 0px; border: none } .mfilter-button .btn-primary { color: #ffffff; background-color: #080808; border-color: #080808; transition: all 0.3s; width: 348px; margin: 0px; border-radius: 0px; font-size: 16px; text-transform: uppercase; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; line-height: normal; padding: 0px; height: 50px; display: flex; align-items: center; justify-content: center; margin-left: auto; margin-top: 30px; font-weight: bold; } .mfilter-button .btn-primary:hover { color: #080808 !important; background: white !important; } /* ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ||||| --> PRODUCT PAGE VVV VVV VVV VVV VVV VVV VVV */ /* --> PRODUCT PAGE > LAYOUT [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #product-product button#button-cart { background-color: var(--accent2); border-color: transparent; color: var(--accent3); } #product-product button#button-cart:hover { background-color: var(--accent3); border-color: var(--accent2); color: var(--accent1); } #product-product button#button-favorites:hover { background-color: var(--accent2) !important; border-color: var(--accent2) !important; } #product-product div.options { border-top: solid 1px #d8d8d8; border-bottom: solid 1px #d8d8d8; padding: 20px 0 0px 0px; display: flex; flex-direction: column; } #product-product div.options .form-group.required>label { display: flex; gap: 3px; } /* --> PRODUCT PAGE > LAYOUT > TOP SECTION [2] =========================================================================================================== */ #product-product #content>.row:first-child { margin-bottom: 50px; } /* --> PRODUCT PAGE > IMAGE AND ADDITIONALS [2] =========================================================================================================== */ #product-product .main_thumb.for_mobile { display: block; } #product-product .thumbnails { overflow: visible !important; } #product-product .image-additional a { margin-bottom: 0px; margin-inline: 5px; border-radius: 0px !important; } #product-product .thumbnails.slick-vertical { display: flex !important; flex-direction: column !important; align-items: center; } #product-product .thumbnails.slick-vertical>button { position: relative !important; left: unset !important; right: unset !important; top: unset !important; transform: none !important; padding: 0px !important; -webkit-filter: invert(100); filter: invert(100); transform: rotate(90deg) !important; } #product-product .thumbnails.slick-vertical>button.slick-prev { margin-bottom: 10px } #product-product .thumbnails.slick-vertical>button.slick-next { margin-top: 10px } #product-product .thumbnails { opacity: 0; -webkit-animation: fadeIn .3s ease-in-out forwards; animation: fadeIn .3s ease-in-out forwards; -webkit-animation-delay: 1.8s; animation-delay: 1.8s; } @-webkit-keyframes fadeIn { to { opacity: 1; } } @keyframes fadeIn { to { opacity: 1; } } @media(min-width: 769px) { .images-container { display: flex !important; flex-direction: row-reverse !important; } .images-container .thumbnails { width: 150px !important; } .images-container .thumbnails .slick-list { width: 130px !important; } .images-container .thumbnails .slick-list li { width: 100% !important; } .images-container .main_thumb { width: 100% !important; } } @media(max-width: 768px) { /* #product-product .image-additional a { border: 1px solid #ddd; } */ } /* --> PRODUCT PAGE > MODEL AND STOCK [2] =========================================================================================================== */ #product-product .model_n_stock_section { margin-bottom: 5px; } #product-product .model_n_stock_section .model_content>span:last-child, #product-product .model_n_stock_section .stock_content>div>span:last-child { font-weight: bold !important; } #product-product .model_n_stock_section .model_content>span:first-child, #product-product .model_n_stock_section .stock_content>div>span:first-child { margin-right: 6px !important; } /* --> PRODUCT PAGE > SIZEGUIDE [2] =========================================================================================================== */ /* --> PRODUCT PAGE > SIZEGUIDE BUTTON [3] ------------------------------------------------------------- */ #product { position: relative; } #sizeguide_button { /* position: absolute; */ /* right: 0px; */ /* top: 44px; */ font-size: 13px; text-transform: uppercase; line-height: 18px; border-bottom: 1px solid black; padding: 0px 6px; cursor: pointer; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin-bottom: 15px; margin-top: 15px; margin: 15px 0px; order: 99; display: none !important; } /* #sizeguide_button::before { content: ""; width: 27px; height: 27px; margin-right: 15px; background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 489.3 489.3' style='enable-background:new 0 0 489.3 489.3;' xml:space='preserve'%3E%3Cg%3E%3Cg%3E%3Cpath d='M265,369.25c6.8,0,12.3-5.5,12.3-12.3s-5.5-12.3-12.3-12.3H38.4c-7.7,0-13.9-6.2-13.9-13.9V77.35 c0-7.7,6.2-13.9,13.9-13.9H451c7.7,0,13.9,6.2,13.9,13.9v253.6c0,7.7-6.2,13.9-13.9,13.9h-30.2c-6.8,0-12.3,5.5-12.3,12.3v60.9 l-69.5-69.5c-4.8-4.8-12.5-4.8-17.3,0s-4.8,12.5,0,17.3l78.9,78.9c3.6,3.6,8.5,5.6,13.4,5.6c2.4,0,4.9-0.5,7.3-1.4 c7.1-2.9,11.7-9.8,11.7-17.5v-61.9h17.9c21.2,0,38.4-17.2,38.4-38.4V77.35c0-21.2-17.2-38.4-38.4-38.4H38.4 C17.2,38.95,0,56.15,0,77.35v253.6c0,21.2,17.2,38.4,38.4,38.4H265V369.25z'/%3E%3Cpath d='M88.1,152.85h313.2c6.8,0,12.3-5.5,12.3-12.3s-5.5-12.3-12.3-12.3H88.1c-6.8,0-12.3,5.5-12.3,12.3 S81.3,152.85,88.1,152.85z'/%3E%3Cpath d='M88.1,218.75h313.2c6.8,0,12.3-5.5,12.3-12.3s-5.5-12.3-12.3-12.3H88.1c-6.8,0-12.3,5.5-12.3,12.3 S81.3,218.75,88.1,218.75z'/%3E%3Cpath d='M244.7,284.65h156.6c6.8,0,12.3-5.5,12.3-12.3s-5.5-12.3-12.3-12.3H244.7c-6.8,0-12.3,5.5-12.3,12.3 C232.5,279.15,237.9,284.65,244.7,284.65z'/%3E%3C/g%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3C/svg%3E%0A"); } */ /* --> PRODUCT PAGE > SIZEGUIDE CONTENT [3] ------------------------------------------------------------- */ #sizeguide_container { position: fixed; top: 50%; left: 50%; background: white; padding: 35px; max-width: 90%; transform: translate(-50%, 100%); z-index: 99; box-shadow: 0 10px 17px -10px rgba(0, 0, 0, 0.7); transition: all 0.4s; opacity: 0; visibility: hidden; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; box-sizing: content-box; border-radius: 10px; } #sizeguide_container img { /* width: 100%; */ /* width: 66vw; */ max-width: 75vw; } /* --> PRODUCT PAGE > SIZEGUIDE CONTENT > CLOSE BUTTON */ #sizeguide_container .close_button { width: 17px; height: 17px; background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 1000 1000' enable-background='new 0 0 1000 1000' xml:space='preserve'%3E%3Cmetadata%3E Svg Vector Icons : http://www.onlinewebfonts.com/icon %3C/metadata%3E%3Cg%3E%3Cpath d='M990,59.5L940.5,10L500,450.5L59.5,10L10,59.5L450.5,500L10,940.5L59.5,990L500,549.5L940.5,990l49.5-49.5L549.5,500L990,59.5z'/%3E%3C/g%3E%3C/svg%3E"); position: absolute; right: 10px; top: 10px; cursor: pointer; } /* --> PRODUCT PAGE > SIZEGUIDE CONTENT > ENABLED */ .sizeguide_enabled body::before { opacity: 1; visibility: visible; width: 100%; } .sizeguide_enabled #sizeguide_container { transform: translate(-50%, -50%); opacity: 1; visibility: visible; } /* --> PRODUCT PAGE > RELATED PRODUCTS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #product-product .related_products_section>div:nth-child(n+5) { display: none !important; } @media(max-width:767px) { #product-product .related_products_section>div.col-xs-6 { width: 100% !important; } } /* --> PRODUCT PAGE > RECENTLY VIEWED [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #product-product #content>h3 { color: #202020; font-size: 35px; font-weight: bold; margin-bottom: 35px; } /* ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ||||| --> PRODUCT PARTIAL VVV VVV VVV VVV VVV VVV VVV */ /* .product-thumb { border: 1px solid #ddd; } */ .product-thumb .image { border: 1px solid #dfdfdf } @media(max-width: 700px) { .product-thumb .image { border: none !important; } } /* --> PRODUCT PARTIAL > LAYOUT [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .product-thumb-info { display: flex; flex-direction: column; max-width: calc(100% - min(50px, 4vw)) !important; margin-left: auto !important; margin-right: min(20px, 4vw) !important; position: relative; overflow: hidden; padding-bottom: 10px; margin-top: 10px; width: 100%; } .product-thumb-info>*:not(.button-group) { width: 100% !important; max-width: 100% !important; } .product-thumb-info>.button-group { width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; position: absolute; bottom: 0px; right: 0px; } /* --> PRODUCT PARTIAL > COLORS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #product-category div[data-poip_id="poip_img"], .row.related_products_section div[data-poip_id="poip_img"], #common-home div[data-poip_id="poip_img"] { position: relative !important; margin-top: -25px; width: 100% !important; display: flex; right: 0px !important; } /* HIDE IMAGES OF SIZES */ /* --> PRODUCT PARTIAL > COLORS > HIDE IMAGES OF SIZES [2] =========================================================================================================== */ .poip_img_2 { display: none !important; } /* #product-category div[class="poip_img_2"], .row.related_products_section div[class="poip_img_2"], #common-home div[class="poip_img_2"] { display:none !important; } */ /* --> PRODUCT PARTIAL > OPTION IMAGES [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .product-thumb div[data-poip_id="poip_img"] { display: flex; gap: 5px; height: unset !important; min-height: unset !important; margin-top: 0px !important; position: relative !important; margin-top: -66px !important; /* padding: 0px 0px 6px 7px; */ max-width: calc(100% - min(50px, 4vw)) !important; margin-left: auto !important; margin-right: min(20px, 4vw) !important; margin-bottom: 20px !important; } .product-thumb div[data-poip_id="poip_img"] a { width: 45px !important; height: 56px !important; padding: 0px !important; text-align: center; } .product-thumb div[data-poip_id="poip_img"] a img { width: 100% !important; height: 100% !important; border: none; /* border:1px solid #ccc; */ padding: 0px 0px !important; margin: 0px !important; border-radius: 0px !important; border: 1px solid #ddd; } /* --> PRODUCT PARTIAL > LABELS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .labels_container { display: flex; align-items: center; margin-top: 10px; height: 28px; align-items: flex-end; /* width: 100%; */ margin: auto; /* margin-top: 10px; */ flex-wrap: wrap; height: unset; gap: 2px; min-height: 27px; } .labels_container>div:not(:last-child) { margin-right: 2px; } /* --> PRODUCT PARTIAL > LABELS > COMMON [2] =========================================================================================================== */ .labels_container>div { color: #FFFFFF; font-size: 14px; line-height: normal; padding: 5px 10px; font-weight: bold; text-align: center; white-space: nowrap; margin: 0px !important; } /* --> PRODUCT PARTIAL > LABELS > NEW [2] =========================================================================================================== */ .labels_container>div.label_new { background: #666; } /* --> PRODUCT PARTIAL > LABELS > BESTSELLER [2] =========================================================================================================== */ .labels_container>div.label_bestseller { background: #101010; } /* --> PRODUCT PARTIAL > LABELS > SALE [2] =========================================================================================================== */ .labels_container>div.label_sale { background: var(--accent6); } /* --> PRODUCT PARTIAL > BRAND [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .product-thumb .caption .brand_name { margin: 10px 0px 0px 0px !important; display: block } /* --> PRODUCT PARTIAL > PRODUCT TITLE [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .product-thumb .caption>.product_title { margin: 10px 0px } /* --> PRODUCT PARTIAL > TAX TEXT [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .product-thumb .text-tax { display: none; } /* --> PRODUCT PARTIAL > PRICE [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .product-thumb .price { width: 100%; max-width: calc(100% - 100px); display: flex; flex-wrap: wrap; gap: 5px 20px; align-items: flex-end; margin-top: 10px; justify-content: flex-start !important; text-align: left; } .product-thumb .price { margin-bottom: 0px; } .product-thumb .price-old { margin-left: 0px; } .product-thumb .price * { line-height: 1; } /* --> PRODUCT PARTIAL > BUTTONS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .product-thumb .button-group { display: flex !important; flex-wrap: nowrap !important; transition: all .2s; transform: translateY(100%); gap: 15px; align-items: center; } .product-thumb:hover .button-group { transform: translateY(0px); } .product-card-bot { min-height: 55px !important; display: flex; align-items: center; } .product-thumb .button-group button { width: clamp(30px, 4vw, 42px) !important; height: clamp(30px, 4vw, 42px) !important; } .product-thumb .button-group svg { height: clamp(25px, 3vw, 28px); width: clamp(25px, 3vw, 28px); } .product-thumb .stock_0 { font-weight: bold; color: black; line-height: 1.2; } /* ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ||||| --> BLOG CENTRAL VVV VVV VVV VVV VVV VVV VVV */ /* --> BLOG CENTRAL > LAYOUT [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .central_blog_page .product-thumb .caption { max-width: unset; width: unset; } .central_blog_page #content>.row { display: flex; flex-wrap: wrap; } .central_blog_page #content>.row>div { width: 25%; } .central_blog_page #latestpost { margin-bottom: 70px; } /* --> BLOG CENTRAL > IMAGE [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .central_blog_page #content>.row>div .image { max-width: 100%; width: 100%; } .central_blog_page #content>.row>div .image img { width: 100% !important; height: auto !important; } /* --> BLOG CENTRAL > DESCRIPTION [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .central_blog_page #content>.row>div .caption { min-height: 65px } .central_blog_page #content>.row>div .description { display: none; } .central_blog_page #content>.row>div .padd { display: none !important; } /* ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ||||| --> BLOG PAGE VVV VVV VVV VVV VVV VVV VVV */ /* --> BLOG PAGE > CONTENT [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #latestpost .commentadta { display: none !important; } #latestpost .innerheader h1 { max-height: unset; line-height: normal; } .single_blog_page #latestpost { display: flex; margin-top: 70px; } #latestpost * { font-family: inherit !Important; } .single_blog_page #latestpost .image.listimg { width: 500px; } #latestpost .image.listimg .img-responsive { width: 100%; } .single_blog_page #latestpost>.row { width: calc(100% - 500px); padding-left: 25px; } #latestpost>.row .headtitle { position: relative; background: none; opacity: 1; display: flex; flex-direction: column; } #latestpost>.row .headtitle>div:first-child { display: none; } #latestpost>.row .description { color: #444; line-height: 26px; text-align: justify; margin-top: 25px; font-size: 15px; -moz-column-count: 2; column-count: 2; -moz-column-gap: 41px; column-gap: 41px; font-weight: normal !important; } /* --> BLOG PAGE > SOCIALS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #latestpost .social-icons { margin-top: 30px; } #latestpost .social-icons li i:before { font-family: FontAwesome; } /* --> BLOG PAGE > ALERT [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #latestpost { position: relative; } #latestpost .alert.alert-success.alert-dismissible { position: absolute; left: 50%; transform: translateX(-50%) translateY(-100%); z-index: 9999999; top: 0px; } #latestpost .alert.alert-success.alert-dismissible i:before { font-family: FontAwesome; } #latestpost .alert-dismissable .close, #latestpost .alert-dismissible .close { right: 0px !important; } /* --> BLOG PAGE > RELATED PRODUCTS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .row.related .headingmain { margin-top: 0px !important; } #blogrelated .product-thumb h4 { text-align: left !important; } #blogrelated .price-cont { display: flex; align-items: center; } #blogrelated .product-thumb .price { margin-bottom: 0px !important; text-align: left; } #blogrelated .product-thumb .price-old { margin-left: 0px !important; } /* ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ΛΛΛ ||||| --> RESPONSIVE VVV VVV VVV VVV VVV VVV VVV */ /* --> RESPONSIVE > GENERIC [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ body { --responsivePadding: 15px; } @media(max-width: 991px) { #common-home #content>.row.swiper-viewport, #common-home #content>.row { margin-bottom: 20px !important; } } /* --> RESPONSIVE > GENERIC > SECTION HEADINGS [2] =========================================================================================================== */ @media(max-width: 991px) { #common-home #content .row h3, #common-home h3.headingmain, #common-home .carousel.swiper-viewport h3, #content>.row>h3, #content>h3 { width: 100% !important; max-width: 100% !important; margin-left: 0px !important; margin-right: 0px !important; padding-bottom: 10px !important; } } /* --> RESPONSIVE > GENERIC > BOTTOM SECTION BUTTONS [2] =========================================================================================================== */ @media(max-width: 768px) { #content>.buttons { display: flex !important; flex-direction: column !important; align-items: center !important } #content>.buttons>div { margin: 5px 0px } } /* --> RESPONSIVE > HEADER [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ /* --> RESPONSIVE > HEADER > LAYOUT [2] =========================================================================================================== */ @media(max-width: 420px) { header #logo img { width: 100px !important; } header .icons_content { padding-left: 0px !important; } header .menu_content { padding-right: 0px !important; } #menu_toggle_section>#burger_button svg { width: 22px !important; height: 22px } .list-inline li svg { width: 22px !important; height: 22px !important; } header #cart .btn.btn-inverse #cart-total { top: -12px; right: -11px; } } /* --> RESPONSIVE > HEADER > LOGO [2] =========================================================================================================== */ @media(max-width: 768px) { /* header .row > .col-sm-2{ width:138px; } */ /* header .row > .col-sm-3{ width: calc(100% - 138px); } */ } @media(max-width: 400px) { /* header .row > .col-sm-2{ width:110px; padding: 0px !important; } header .row > .col-sm-3{ width: calc(100% - 110px); } */ } /* --> RESPONSIVE > HEADER > SEARCH [2] =========================================================================================================== */ @media(max-width:990px) { .live-search-div { max-width: 400px !important; width: 300px !important; } .live-search-div ul li .product-name { font-size: 13px !important; line-height: normal !important; margin-top: 0px !important; } .live-search-div ul li a { display: flex !important; align-items: center !important; } .live-search-div ul li .product-price { margin-top: 0px !important; } .live-search-div ul li .product-price>span { line-height: normal !important; } .live-search-div .product-price>.special { margin-top: 0px !important; } } @media(max-width:768px) { header .row>.col-sm-6 #search .input-lg { height: 30px !important; line-height: 30px !important; color: white; border: none !important; } #search .btn.btn-default.btn-lg { /* height:30px !important; */ line-height: 30px !important; display: flex; align-items: center; justify-content: center; } /* #search .btn.btn-default.btn-lg .search-path{ stroke:white !important; } */ .live-search-div { top: 40px !important; right: 0px !important; left: auto !important; transform: none !important; } } /* --> RESPONSIVE > HEADER > ICONS [2] =========================================================================================================== */ @media(max-wdith: 1420px) {} @media(max-width:768px) { header .row>.col-sm-3 .list-inline img.hd-icons { margin-top: 4px; margin-bottom: 1px; } } /* --> RESPONSIVE > HEADER > MENU [2] =========================================================================================================== */ #menu .btn-navbar i::before { font-size: 24px !important; } @media(max-width:1370px) { #menu #menu_container { padding-left: 35px !important; padding-right: 35px !important; } } #menu .dropdown-menu.mega-menu .view_all_link { display: none; } @media(max-width: 1199px) { #menu .dropdown-menu.mega-menu { --mega-menu-parent-list-width: 200px; --mega-menu-horizontal-padding-per-side: 15px; --mega-menu-vertical-padding-per-side: 15px; } .dropdown-menu.mega-menu .see-all .img-responsive { width: 100% !important; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; } #menu .nav>li>a { font-size: 13px !important; } #menu .dropdown-menu.mega-menu .mg-menu-item-title>a { font-size: 13px !important; padding: 6px 0px 6px 10px !important; } #menu .dropdown-menu.mega-menu .mg-menu-cont .mg-menu-item-children-list>div>a { font-size: 13px !important; padding: 6px !important; } } @media(max-width: 768px) { .navbar-header { display: flex; align-content: center; justify-content: space-between; width: 100%; padding: 5px 5px; } #menu .btn-navbar { padding: 2px 8px !important; } #menu .nav>li.dropdown>a { /* pointer-events:none; */ display: flex; justify-content: space-between; align-items: center; padding: 10px 0px !important; } #menu .nav>li>a { display: flex; justify-content: space-between; align-items: center; padding: 10px 0px !important; } /* #menu .nav > li.dropdown > a:after{ content: "\f078"; font-family: FontAwesome; font-size: 11px; color:white; transition: all 0.4s } #menu .nav > li.dropdown:hover > a:after{ transform: rotateX(180deg); } */ .navbar-header:before, .navbar-header:after { display: none !important } #menu #category { font-size: 17px; font-weight: bold; text-transform: uppsecase; padding: 8px 10px; } .mega-menu-cont-main #menu .nav.navbar-nav>li { position: relative !important; } #menu>.collapse>.nav>li .dropdown-menu.mega-menu { position: relative !important; height: auto !important; margin: 0px !important; transform: none !important; border: none !important; top: 0px !important; max-height: 0px; overflow: auto; background: white; border-radius: 0px; transition: all .4s; display: flex !important; } #menu>.collapse>.nav>li.dropdown:hover .dropdown-menu.mega-menu { max-height: 300px !important; } #menu .mg-menu-container { flex-direction: row; flex-wrap: wrap; } .dropdown-menu.mega-menu .dropdown-inner { width: 100%; } #menu .mg-menu-container { flex: 1 !important } #menu .mg-menu-container>.mg-menu-cont { width: 50% !important } #menu>.collapse>.nav>li .dropdown-menu.mega-menu .dropdown-inner { display: flex !important; } #menu .dropdown-menu.mega-menu .view_all_link { display: block; background: black; color: white !important; text-align: center; padding: 10px 5px; width: 150px; max-width: 100%; margin: 20px auto 0px auto; position: -webkit-sticky !important; position: sticky !important; bottom: 15px; width: 100% !important; } #menu>.collapse>.nav>li .dropdown-menu.mega-menu .dropdown-inner { flex-direction: column; } #menu .dropdown-menu.mega-menu .see-all { display: none !important; } #menu .dropdown-menu.mega-menu .mg-menu-item-title>a { padding: 6px !important; background: none !important; } #menu .dropdown-menu.mega-menu .mg-menu-cont .mg-menu-item-children-list { position: relative; opacity: 1; visibility: visible; transform: none; top: 0px; left: 0px; height: auto; width: auto; padding-bottom: 0px; } #menu>.collapse>.nav>li .dropdown-menu.mega-menu::after, #menu .dropdown-menu.mega-menu .mg-menu-item-title.with-children>a::after { display: none !important } #menu .dropdown-menu.mega-menu .mg-menu-cont .mg-menu-item-children-list>div>a { color: black !important; background: none; } } @media(max-width: 400px) { #menu .mg-menu-container>.mg-menu-cont { width: 100% !important } #menu .mg-menu-container { flex: unset !important; width: 100% !important; } #menu>.collapse>.nav>li .dropdown-menu.mega-menu .dropdown-inner { display: unset !important; } } /* --> RESPONSIVE > HEADER > CART [2] =========================================================================================================== */ @media(max-width:635px) { body { --minicart-width: 100vw !important; } #cart .dropdown-menu>li.bottom-section { height: auto !important; } /* li.bottom-section > div.container{ width: 280px !important; } */ #cart .dropdown-menu { padding: 20px 0px; } #cart .dropdown-menu .product-info a { font-size: 14px; line-height: normal; } .minicart_intro .subtitle { font-size: 25px !important; line-height: normal !important; } #cart .dropdown-menu .product-info .product-options .option-name, #cart .dropdown-menu .product-info .product-options .option-value { font-size: 12px; } #cart .dropdown-menu .table-products { padding: 0px !important; } #cart .dropdown-menu>li.top-section .minicart_content { max-height: calc(100vh - 310px); overflow: auto; } #cart .dropdown-menu .cart-footer>a { height: 45px !important; } #cart .dropdown-menu .product-thumb { padding: 0px; width: 100px; height: 100px; } } /* --> RESPONSIVE > FOOTER [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ @media(max-width: 768px) { footer>.container>.row { display: flex !important; flex-wrap: wrap !important; } footer>.container>.row>div { flex: 1 1 180px; } } @media(max-width: 650px) { .powered_by { flex-direction: column; } } /* --> RESPONSIVE > NEWSLETTER POPUP [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ @media(max-width: 450px) { .tk-cart-body { padding: 0px !important; } .alert.alert-success.alert-dismissible .add-to-cart-inner { left: 50%; transform: translateX(-50%); width: calc(100vw - 30px) !important; padding: 15px; } } /* --> RESPONSIVE > HOME [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ @media(max-width: 1420px) { #common-home #latestblog .product-thumb .caption h4 a { font-size: 18px; line-height: normal; } #common-home #latestblog .product-thumb .caption .dateadded i { font-size: 15px !important; } } @media(max-width: 1150px) { #common-home .headingmain { margin-left: 0px; margin-right: 0px !important } #common-home #latestblog>.row { display: flex !important; flex-wrap: wrap !important; } #common-home #latestblog>.row>div { width: 33.33%; } } @media(max-width: 991px) { #common-home #latestblog>.row>div { width: 50%; } #common-home #content .row.featured-products-module.featured0, #common-home #content .row.featured-products-module.featured1 { width: 100% !important; } #common-home #content> :not(.slideshow) { padding: 0px var(--responsivePadding); } .row.special-products-module { margin-left: 0px !important; margin-right: 0px !important; } #common-home #content .slideshow { order: -100 !important; } /* #common-home #content .banner0{ order: -90 !important; } */ #common-home #content .featured0 { order: -80 !important; } /* #common-home #content .banner1{ order: -70 !important; } */ #common-home #content .featured1 { order: -60 !important; } /* #common-home #content .row.swiper-viewport.banner2{ width: 37% !important; } #common-home #content .row.swiper-viewport.banner3{ width: 63% !important } */ #common-home #content .row.swiper-viewport.banner2, #common-home #content .row.swiper-viewport.banner3 { padding: 0px !important; } } @media(max-width: 820px) { .row.news-form { display: flex; align-items: center; flex-direction: column; padding-top: 15px; } .news-form h1 { text-align: center !important; } #common-home #content .row .news-form h3 { text-align: center; line-height: normal; margin-top: 15px; } #common-home #content .row .news-form .pull-center { display: flex; flex-wrap: wrap !important; text-align: center; justify-content: center; align-items: center; justify-content: center; } #common-home #content .row .news-form .pull-center input { order: -100; margin-right: 10px; margin-top: 0px; } } @media(max-width:768px) { #common-home #latestblog>.row>div .dateadded i { font-size: 14px !important; } #common-home #latestblog>.row>div .caption { padding: 10px !important; justify-content: flex-end !important; } #common-home #latestblog>.row>div .caption h4 a { font-size: 17px !important; line-height: normal !important; } } @media(max-width: 600px) { #common-home #content .row.swiper-viewport.banner2, #common-home #content .row.swiper-viewport.banner3 { width: 100% !important; padding: 0px var(--responsivePadding) !important; } } @media(max-width: 450px) { #common-home #latestblog>.row>div { width: 100% !important; } } @media(max-width: 400px) { .row.news-form>div { display: flex; flex-direction: column; } .news-form #subscribe { width: 100% !important; margin-top: 10px; } } @media(max-width: 500px) { #common-home #content>.module_product_tabs_grid .tab-content { flex-direction: column; } #common-home #content>.module_product_tabs_grid .tab-content>div { position: relative !important; width: 100% !important; } #common-home #content>.module_product_tabs_grid .tab-content .section_title { width: 100% !important; display: block !important; } .module_product_tabs_grid .row>.row { display: flex !important; flex-direction: column; } #common-home #content>.module_product_tabs_grid .tab-content>div>.row>div { width: 100% !important; } } /* --> RESPONSIVE > PRODUCT GRID [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ @media(max-width:990px) {} @media(max-width:600px) { /* .product-thumb .price { display: flex; flex-direction: column; align-items: flex-start; } */ .product-thumb .price-old { margin-left: 0px !important; } .labels_container>div { font-size: 9px; } .product-thumb .button-group button { width: 30px !important; height: 30px !important; display: flex; align-content: center; align-items: center; justify-content: center; } } @media(max-width:450px) { .row.featured-products-module .row { display: block; } .row.special-products-module .row { display: block !important } .product-layout { width: 100% !important; } } /* --> RESPONSIVE > CATEGORY PAGE [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ /* --> RESPONSIVE > CATEGORY PAGE > DESCRIPTION [2] =========================================================================================================== */ @media(min-width: 991px) { #mfilter-content-container .row.desc-top { display: none !important; } } @media(max-width: 991px) { #mfilter-content-container>div { display: flex; flex-direction: column; } #mfilter-content-container>div .row.desc-top { order: -99; } } /* --> RESPONSIVE > CATEGORY PAGE > SORTING BAR [2] =========================================================================================================== */ @media(max-width: 991px) { /* #mfilter-content-container > div > .row:first-child{ display:flex; flex-wrap:wrap; justify-content: flex-end; display:none !important; } */ .row.product-list-grid { margin-top: 30px !important; } /* #mfilter-content-container > div > .row:first-child > div { width: 240px !important; max-width: 240px !important; padding:0px !important; float:none !important; } */ #mfilter-content-container>div>.row:first-child>.hidden+div { widtH: 100% !important; max-width: 100% !important; } #mfilter-content-container>div>.row:first-child>div>div { margin-bottom: 0px !important; } } /* --> RESPONSIVE > CATEGORY PAGE > SIDEBAR [2] =========================================================================================================== */ @media(max-width: 1190px) { #product-category #column-left #column-left { position: relative !important; margin-top: 0px !important; top: 0px !important; } #product-category>.row>#column-left { min-width: 300px; } #product-category>.row>#column-left>h2, #product-category>.row>#column-left>h2+.row { display: none !important; } } #mfilter-content-container .desc-top { display: none !important; } /* --> RESPONSIVE > CATEGORY PAGE > SIDEBAR > FILTERS [3] ------------------------------------------------------------- */ @media (max-width: 768px) { /* .mfilter-box-83 .mfilter-free-button{ margin-top: 115px !important; } */ .mfilter-box-83.mfilter-free-container { top: 0px !important; } .box-content.mfilter-content { padding-right: 0px !important; } /* .mfilter-box-83.mfilter-free-container, .mfilter-box-83.mfilter-free-container .scroll-wrapper{ max-height: 100vh !important; width: 280px !important; height: unset !important; min-height: unset !important } */ /* .mfilter-iscroll{ height: 100vh !important; max-height: 100vh !important; } */ .mfilter-free-container { margin-left: -290px; } .mfilter-free-button { margin: 10px 0 0 281px; } .scroll-wrapper>.scroll-content { overflow: auto !important; height: unset !important; min-height: unset !important; } .box-content.mfilter-content { overflow: visible !important; } .mfilter-content>ul>li { margin-bottom: unset !important; } } /* --> RESPONSIVE > CATEGORY > FILTERS REVEAL [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ @media (max-width: 768px) { .mfilter-free-container { position: fixed !important; z-index: 9999999 !important; display: block !important; transform: translateX(-100%); margin-left: 0px !important; transition: all 0.5s !important; } .mfilter-box::before { display: none !important; } html.filters_enabled .mfilter-free-container { transform: translateX(0px) !important; height: 100vh; } .mfilter-free-container { height: 100vh; } html.filters_enabled body:before { visibility: visible; opacity: 1; } } /* --> RESPONSIVE > CATEGORY > FILTERS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ .filters_toggle.mobile { display: none; } @media (max-width: 768px) { .box-content.mfilter-content { max-height: unset !important; } } @media (max-width: 800px) { #mfilter-content-container>div>.row:first-child { flex-wrap: wrap; } .filters_toggle { width: 100% !important; margin-bottom: 20px; padding: 0px !important; margin-right: 0px; } } @media (max-width: 768px) { .filters_toggle.desktop { display: none; } .filters_toggle.mobile { display: block; } } @media (max-width: 768px) { .mfilter-free-container { border: none !important; } /* --> RESPONSIVE > CATEGORY > FILTERS > HEADER [2] =========================================================================================================== */ .mfilter-box>.box-heading { font-size: 16px; font-weight: bold; font-family: var(--font1); background: #0c0c0c; color: white !important; text-align: center; width: 100%; margin: 0px; margin: 0px !important; /* margin-bottom: 45px !important; */ height: 55px; display: flex !important; align-items: center !important; justify-content: center !important; display: block !important; /* position: fixed !important; top: 0px; */ position: relative !Important; line-height: 55px !important; } /* --> RESPONSIVE > CATEGORY > FILTERS > CLOSE BUTTON [2] =========================================================================================================== */ .mfilter-free-button { position: absolute; margin: 0px !important; margin-bottom: 0px; margin-left: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; transform: none !important; right: 20px; top: 0px !important; z-index: 3; height: 53px !important; display: flex; align-items: center; background: transparent; border: none; position: relative; margin: 0px; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; right: 0px; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin-left: auto !important; width: 55px !important; display: flex; align-items: center; justify-content: center; margin-bottom: -55px !important; margin-right: 7px !important; position: relative !Important; background: black; border-radius: 100%; padding: 0px; border-bottom-left-radius: 50%; } .mfilter-free-button i { display: none !important; } .mfilter-free-button:before { content: ""; width: 20px; height: 20px; display: block; cursor: pointer; background-size: cover; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50' width='50px' height='50px'%3E%3Cpath d='M 40.783203 7.2714844 A 2.0002 2.0002 0 0 0 39.386719 7.8867188 L 25.050781 22.222656 L 10.714844 7.8867188 A 2.0002 2.0002 0 0 0 9.2792969 7.2792969 A 2.0002 2.0002 0 0 0 7.8867188 10.714844 L 22.222656 25.050781 L 7.8867188 39.386719 A 2.0002 2.0002 0 1 0 10.714844 42.214844 L 25.050781 27.878906 L 39.386719 42.214844 A 2.0002 2.0002 0 1 0 42.214844 39.386719 L 27.878906 25.050781 L 42.214844 10.714844 A 2.0002 2.0002 0 0 0 40.783203 7.2714844 z'%3E%3C/path%3E%3C/svg%3E"); -webkit-filter: grayscale(1) invert(1); filter: grayscale(1) invert(1); padding: 0px !important; } /* --> RESPONSIVE > CATEGORY > FILTERS > RESET BUTTON [2] =========================================================================================================== */ .mfilter-button-bottom { border: none; } .mfilter-button.mfilter-button-bottom { text-align: center; } .mfilter-button-reset { float: none !important; padding: 3px 20px !important; border-bottom: 1px solid #7a7a7a !important; font-size: 16px !important; font-weight: 600 !important; text-decoration: none !important; margin-top: 60px !important; text-transform: uppercase !important; display: block !important; color: black !important; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin-left: auto; margin-right: auto; } .mfilter-button-reset i { display: none; } /* --> RESPONSIVE > CATEGORY > FILTERS > CONTAINER [2] =========================================================================================================== */ .mfilter-free-container, .mfilter-free-container [id^="mfilter-free-container-"] { padding-left: 0px !important; padding-right: 0px !important; } .mfilter-free-container { width: 350px; max-width: calc(100% - 40px); } /* --> RESPONSIVE > CATEGORY > FILTERS > ITEMS [2] =========================================================================================================== */ .mfilter-content>ul { padding: 0px 20px; } /* --> RESPONSIVE > CATEGORY > FILTERS > ITEMS > HEADING [3] ------------------------------------------------------------- */ .mfilter-heading-content { padding: 0px 8px; margin-top: 35px; } .mfilter-heading-text { display: flex; justify-content: space-between; width: 100%; align-items: center; } .mfilter-heading-text>span { text-transform: none !important; font-size: 16px; font-weight: 600; padding-left: 0px !important; } .mfilter-heading .mfilter-head-icon { display: none !important; } .mfilter-heading .mfilter-heading-text { margin-left: 0px !important; margin-right: 0px !important; } .mfilter-heading .mfilter-heading-text:after { content: ""; width: 20px; height: 20px; background-size: cover; background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3Csvg fill='%2523ffffff' version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 330 330' style='enable-background:new 0 0 330 330;' xml:space='preserve'%3E%3Cpath id='XMLID_27_' d='M15,180h263.787l-49.394,49.394c-5.858,5.857-5.858,15.355,0,21.213C232.322,253.535,236.161,255,240,255 s7.678-1.465,10.606-4.394l75-75c5.858-5.857,5.858-15.355,0-21.213l-75-75c-5.857-5.857-15.355-5.857-21.213,0 c-5.858,5.857-5.858,15.355,0,21.213L278.787,150H15c-8.284,0-15,6.716-15,15S6.716,180,15,180z'%3E%3C/path%3E%3Cg stroke='white'%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3C/svg%3E"); -webkit-filter: invert(63%) sepia(51%) saturate(15%) hue-rotate(324deg) brightness(95%) contrast(82%); filter: invert(63%) sepia(51%) saturate(15%) hue-rotate(324deg) brightness(95%) contrast(82%); transition: all 0.2s; } .mfilter-heading:not(.mfilter-collapsed) .mfilter-heading-text:after { transform: rotate(90deg); } /* --> RESPONSIVE > CATEGORY > FILTERS > ITEMS > DROPDOWNS [3] ------------------------------------------------------------- */ .mfilter-content-opts { border: none; padding: 0px !important; position: relative !Important; } .mfilter-opts-container>.mfilter-content-wrapper { padding-inline: 0px !important } } /* --> RESPONSIVE > CATEGORY > FILTERS > RESET BUTTON [2] =========================================================================================================== */ .mfilter-button-top { border: none; } .mfilter-content { display: Flex; flex-direction: column; } .mfilter-button.mfilter-button-top { text-align: center; order: 99999 !important; } .mfilter-button-reset { float: none !important; padding: 3px 20px !important; border-bottom: 1px solid #7a7a7a !important; font-size: 16px !important; font-weight: 600 !important; text-decoration: none !important; margin-top: 30px !important; margin-bottom: 20px !important; text-transform: uppercase !important; display: block !important; color: black !important; width: -webkit-fit-content !important; width: -moz-fit-content !important; width: fit-content !important; margin-left: auto; margin-right: auto; height: auto !Important } .mfilter-button-reset i { display: none; } /* // FREE CONTAINER //////////////////////////////////////////////////////// */ /* /////////////////////////////////////////////////////////////////////////// */ /* --> RESPONSIVE > CATEGORY PAGE > PRODUCTS [2] =========================================================================================================== */ @media(max-width: 768px) { #product-category .row.product-list-grid { display: flex !important; flex-wrap: wrap !important; grid-column-gap: unset !important; grid-row-gap: unset !important; justify-content: space-between; } #product-category .product-layout.product-grid { width: calc(50% - 10px) !important; } } @media(max-width: 450px) { #product-category .product-layout.product-grid, .product-layout { width: 100% !important; } } /* --> RESPONSIVE > PRODUCT PAGE [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ /* --> RESPONSIVE > PRODUCT PAGE > IMAGE & ADDITIONALS [2] =========================================================================================================== */ @media(max-width: 1600px) { #product-product .thumbnails .col-sm-3:last-child { max-height: 600px; padding-left: 10px; } } @media(max-width: 1350px) { #product-product .thumbnails .col-sm-3:last-child { max-height: 450px; padding-left: 20px; } } @media(max-width: 1100px) { #product-product .thumbnails .col-sm-3:last-child { max-height: 300px; padding-left: 39px; } } @media(max-width: 768px) { #product-product .thumbnails { margin-left: 0px !important } #product-product #content>.row>.div:fist-child { margin-right: 0px !important; margin-left: 0px !important } #product-product .thumbnails .col-sm-3:last-child { max-height: auto !important; padding-left: 1px !important; display: flex !important; overflow-Y: auto !important; margin-bottom: 20px !important } /* .image-additional { width: 100px !important; } .image-additional a{ width: 80px !important; } */ } /* --> RESPONSIVE > PRODUCT PAGE > RELATED PRODUCTS [2] =========================================================================================================== */ @media(max-width:450px) { .related_products_section>div { width: 100% !important; } } /* --> RESPONSIVE > PRODUCT PAGE > RECENTLY VIEWED [2] =========================================================================================================== */ /* @media(max-width: 768px){ .product-layout{ width: 50% !important; } } */ @media(max-width: 450px) { .product-layout { width: 100% !important; } } /* --> RESPONSIVE > PRODUCT PARTIALS [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ @media(max-width: 991px) { .product-thumb { border: 1px solid #ccc } .product-thumb .product-thumb-info { padding: 10px; width: 100% !important; max-width: 100% !important; } .product-thumb .button-group { transform: translateY(0px) !important; position: relative !important; padding: 10px 20px; background: #eee; width: 100%; margin-top: 20px; justify-content: center; } .product-thumb .button-group button { width: 40px !important; height: 40px !important; } .product-thumb .button-group svg { width: 27px !important; height: 27px !important; } .product-thumb div[data-poip_id="poip_img"] { max-width: 100% !important; margin-right: 10px !important; margin-left: 10px !important; } } /* --> RESPONSIVE > INFORMATION PAGE [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ @media(max-width: 768px) { #information-information #column-left { display: block !important; padding-top: 0px !important; margin-bottom: 45px !important; margin-top: 15px !important; position: relative !important; } #information-information #column-left .nav-tabs:before, #information-information #column-left .nav-tabs:after { display: none; } #information-information #column-left .nav-tabs { display: flex; flex-wrap: wrap; gap: 6px; } #information-information #column-left .nav-tabs>li { border: 1px solid #ccc; margin: 0px; flex: 1 1 auto; text-align: center; } #information-information #column-left .nav-tabs>li a { padding: 8px 10px !important; margin: 0px !important; line-height: normal } } /* --> RESPONSIVE > BLOG CENTRAL [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ @media(max-width: 1190px) { .central_blog_page #content>.row>div { width: 33.3333% } } @media(max-width: 991px) { .central_blog_page #content>.row>div { width: 50% } } @media(max-width: 450px) { .central_blog_page #content>.row>div { width: 100% } } /* --> RESPONSIVE > BLOG PAGE [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ @media(max-width: 1350px) { #latestpost>.row .description { -moz-column-count: unset; column-count: unset; text-align: left; } } @media(max-width: 1190px) { #latestpost { display: flex; flex-direction: column; } #latestpost>.row { padding-left: 0px; } #latestpost>* { width: 100% !important; } #latestpost .image img { max-width: 100% !important; width: 500px !important; margin: 0 auto !important; } } /* --> ACCOUNT [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #account-login>.row, #account-register>.row { max-width: 1650px; margin: auto; } #common-success>.row { max-width: 1024px; margin: auto; } /* --> INFORMATION PAGES [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ #information-information h1 { font-weight: bold; margin-bottom: 40px; } #information-information #column-left { position: -webkit-sticky; position: sticky; top: 0; padding-top: 100px; } #information-information #column-left .nav.nav-tabs.nav-stacked>li>a { color: black; font-size: 15px; padding: 13px; font-weight: 700; } #information-information #column-left .nav.nav-tabs { border-bottom: none; } #information-information #column-left .nav.nav-tabs.nav-stacked>.current>a, #information-information #column-left .nav.nav-tabs.nav-stacked>a:hover, #information-information .nav-tabs>li>a:hover { /* color: var(--accent2) !important; */ border-color: transparent !important; color: black !important; background: #eee !important; } /************************************* P R O D U C T T A B S ==> I M P O R T A N T **********************************************/ /* --> COMMON > MODULES > PRODUCT TABS [2] =========================================================================================================== */ /* .module_product_tabs .tab-content .section_title { display: none !important; } */ /**********************************************************************************/ /********** M O D U LE P R O D U C T T A B S // G R I D ***********************/ /**********************************************************************************/ .module_product_tabs_grid .tab-content { position: relative; } .module_product_tabs_grid .title_and_tabs { position: absolute; left: 0; top: 0; width: 33.33%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 2.5% 5%; } .module_product_tabs_grid .title_and_tabs .nav-tabs { display: flex; flex-direction: column !important; justify-content: left; align-items: flex-start; margin-left: 0 !important; gap: 15px; } .module_product_tabs.module_product_tabs_grid .tab-pane .row:before { content: ""; width: 33%; display: block; height: 50%; } .module_product_tabs_grid .nav-tabs>li>a { font-weight: 400 !important; height: 20px !important; } .module_product_tabs_grid .nav-tabs>li.active>a { background-color: transparent !important; color: #000 !important; font-weight: 800 !important; } /* .module_product_tabs.module_product_tabs_grid .tab-pane.active .row{ display:grid!important; grid-template-columns:1fr 1fr 1fr; } */ /* .module_product_tabs.module_product_tabs_grid .tab-pane.active .row > div{ width:33%!important; } */ .module_product_tabs_grid .tab-pane>.row { margin: 0 !important; max-width: 100% !important; } .module_product_tabs_grid .row>.row { display: grid; grid-template-columns: 1fr 1fr 1fr; -moz-column-gap: 15px; column-gap: 30px; } .module_product_tabs_grid>.row { width: 100% !important; margin: 0px !important; max-width: 100% !important; } .module_product_tabs_grid .title_and_tabs .nav-tabs a { border: none !important; width: unset; color: #000000; font-family: "LXGW WenKai TC", cursive; font-size: 16px; line-height: 45px; text-align: left; } @media(max-width:768px) { .module_product_tabs_grid .row>.row { grid-template-columns: 1fr 1fr !important; } .module_product_tabs.module_product_tabs_grid .title_and_tabs { width: 50% !important; justify-content: unset !important; } } /* --> HENRY - CLOTHING [1] %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */ /** IMPORTANT! PRODUCT PAGE --> OPTIONS (checkbox!!) **/ #product-product .options .form-group>div:nth-child(2) { display: flex; flex-wrap: wrap; flex-direction: row; align-items: center; justify-content: center; gap: 4px; } #product-product .options>.form-group.required:nth-child(2)>div:nth-child(2) label.checked-tk { /* border: none !important; */ } #product-product .options .radio img.img-thumbnail { border: 1px solid #666 !important; opacity: 1 !Important; display: none !important; } #product-product .options .radio .checked-tk img.img-thumbnail { border: 3px solid #000 !important; } /* #product-product .options>.form-group.required:nth-child(2)>div:nth-child(2) label { font-size: 0 !important; } */ #product-product .options>.form-group.required:nth-of-type(2) .radio label { /* padding-left: 0px !important; */ border: 1px solid #ccc; padding: 3px 7px !important; text-align: center; min-width: 60px; border-radius: 0px !important; } #product-product .options>.form-group.required:nth-of-type(2) .radio label.checked-tk { border-color: black !important; } #product-product .checked-tk { border: 1px solid rgba(0, 0, 0, 0.53) !important; border-radius: 100%; } #product-product .options>.form-group.required:nth-of-type(3)>div:nth-child(2)>div label { min-width: 60px; border: solid 1px #d8d8d8; padding: 4px; text-align: center; } #product-product .options>.form-group.required:nth-of-type(3)>div:nth-child(2) label.checked-tk { border: solid 2px #d9d9d9; border-radius: 0; } #product-product .form-group.required { display: flex; align-items: center; gap: 30px !important; } /************************************************/ header .dropdown.header-icon-men span { display: none; } /* @media(max-width:991px) { header #logo img.img-responsive { width: 60%; } } */ /* --> CONTACT/ SITEMAP/ GDPR PAGE [2] =========================================================================================================== */ @media(min-width:1350px) { #account-login, #account-register, #account-forgotten, #account-account, #account-edit, #account-password, #account-logout, #account-address, #account-wishlist, #account-order, #account-download, #account-reward, #account-return, #account-transaction, #account-newsletter, #account-address-add, .extension-module-isenselabs_gdpr .container:nth-child(2)>.row { max-width: 1350px; margin: auto; } /* #information-contact #content .row { display: flex; align-items: center; justify-content: space-around; } */ } .extension-module-isenselabs_gdpr .container:nth-child(2)>.row, #information-sitemap>.row { max-width: 1350px !important; margin: 0 auto !important; } /* --> CONTACT PAGE [3] ------------------------------------------------------------- */ #information-contact .panel-body>.col-sm-3 { display: flex; flex-direction: column; justify-content: center; align-items: center; } @media(min-width:1350px) { #information-contact { max-width: 1350px; margin: 0 auto; } } #information-contact fieldset label { text-align: left; } /* --> GDPR TOOLS [3] ------------------------------------------------------------- */ @media(min-width:1350px) { .extension-module-isenselabs_gdpr #content { max-width: 1350px !important; margin: 0 auto !important; width: 100% !important; } } /* --> SEARCH SVG OUTLINE [3] ------------------------------------------------------------- */ #search_contents button:focus { outline: none !important; } .mfilter-filter-item .mfilter-iscroll .mfilter-options label { text-transform: uppercase !important; }