/* ========================================================================== VITABOLIC — main.css -------------------------------------------------------------------------- CUPRINS (cauta "[NN]" ca sa sari direct la sectiune): [01] Normalize / reset [02] Colorbox (lightbox imagini) [03] Tipsy (tooltip-uri) [04] Butoane (.red-button etc.) [05] Tipografie de baza (BODY) [06] Tabele specificatii produs [07] Header — bara gri + cos [08] Header — logo + cautare [09] Header — navigare principala [10] Slider parteneri (restul: produse, slider hero, footer, newsletter, cos, media queries — in ordinea originala, neschimbata) ========================================================================== */ /* ===== [01] Normalize / reset ============================================ */ /*! normalize.css v1.1.3 | MIT License | git.io/normalize */ article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } audio, canvas, video { display: inline-block; } audio:not([controls]) { display: none; height: 0; } [hidden] { display: none; } body { margin: 0; } a:focus { outline: thin dotted; } a:active, a:hover { outline: 0; } h1 { font-size: 2em; margin: 0.67em 0; } h2 { font-size: 1.5em; margin: 0.83em 0; } h3 { font-size: 1.17em; margin: 1em 0; } h4 { font-size: 1em; margin: 1.33em 0; } h5 { font-size: 0.83em; margin: 1.67em 0; } h6 { font-size: 0.67em; margin: 2.33em 0; } abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: bold; } blockquote { margin: 1em 40px; } dfn { font-style: italic; } mark { background: #ff0; color: #000; } p, pre { margin: 1em 0; } code, kbd, pre, samp { font-family: monospace, serif; _font-family: "courier new", monospace; font-size: 1em; } pre { white-space: pre-wrap; word-wrap: break-word; } q { quotes: none; } q:before, q:after { content: none; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } dl, menu, ol, ul { margin: 1em 0; } dd { margin: 0 0 0 40px; } menu, ol, ul { padding: 0 0 0 0px; } nav ul, nav ol { list-style: none; list-style-image: none; } img { border: 0; -ms-interpolation-mode: bicubic; } svg:not(:root) { overflow: hidden; } figure { margin: 0; } form { margin: 0; } legend { border: 0; padding: 0; white-space: normal; } button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; border-radius: 30px; } button, input { line-height: normal; } button, select { text-transform: none; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default; } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; } input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } table { border-collapse: collapse; border-spacing: 0; } html, button, input, select, textarea { font-family: sans-serif; color: #222; } html { font-size: 1em; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; line-height: 1.4; } ::-moz-selection { background: #b3d4fc; text-shadow: none; } ::selection { background: #b3d4fc; text-shadow: none; } hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 1px; display: block; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } audio, canvas, img, video { vertical-align: middle; } fieldset { border: 0; margin: 0; padding: 0; } textarea { overflow: auto; vertical-align: top; resize: vertical; } .browsehappy { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; } .message-error H1 { background: none; color: #F1C66B; text-align: center; padding: 0; } .message-error P { background: none; color: #F1C66B; text-align: center; padding: 0; } .message-error H1:before, .message-error H1:after { content: none; } .message-success H1 { background: none; color: #759f4c; text-align: center; padding: 0; } .message-success P { background: none; color: #97c227; text-align: center; padding: 0; } .message-success H1:before, .message-success H1:after { content: none; } INPUT.error, SELECT.error, TEXTAREA.error, INPUT.error-js, SELECT.error-js, TEXTAREA.error-js { border: 1px solid #F1C66B; } /* ===== [02] Colorbox (lightbox imagini) ================================== */ #colorbox, #cboxOverlay, #cboxWrapper { position: absolute; top: 0; left: 0; z-index: 9999; } #cboxMiddleLeft, #cboxBottomLeft { clear: left; } #cboxLoadingOverlay, #cboxLoadingGraphic { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow { cursor: pointer; } .cboxPhoto { float: left; margin: auto; border: 0; display: block; max-width: none; } #colorbox, #cboxContent, #cboxLoadedContent { box-sizing: content-box; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; } #cboxOverlay { position: fixed; width: 100%; height: 100%; background: #000; } #colorbox { outline: 0; } #cboxContent { position: relative; background: #fff; overflow: visible; } .cboxIframe { width: 100%; height: 100%; display: block; border: 0; background: #fff; } #cboxError { padding: 50px; border: 1px solid #ccc; } #cboxLoadedContent { overflow: auto; -webkit-overflow-scrolling: touch; padding-top: 30px; } #cboxLoadedContent > * { margin: 5px; } #cboxLoadingGraphic { background: url(../img/ajax-loader.gif) no-repeat center center; } #cboxTitle { margin: 0; position: absolute; top: 100%; width: 94%; padding: 5px 3% 10px; font-weight: bold; background: #fff; color: #000; text-align: center; } #cboxCurrent { position: absolute; top: 7px; right: 32px; font-weight: bold; color: #7C7C7C; } #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose { border: 0; padding: 0; margin: 0; overflow: visible; position: absolute; top: 5px; background: url(../img/colorbox-controls.png) no-repeat 0 0; width: 23px; height: 23px; text-indent: -9999px; } #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active { outline: 0; } #cboxPrevious { left: 5px; background-position: -51px -25px; } #cboxPrevious:hover { background-position: -51px 0; } #cboxNext { margin-left: 32px; background-position: -75px -25px; } #cboxNext:hover { background-position: -75px 0; } #cboxClose { right: 6px; background-position: -100px -25px; } #cboxClose:hover { background-position: -100px 0; } .cboxSlideshow_on #cboxSlideshow { background-position: -125px 0; right: 27px; } .cboxSlideshow_on #cboxSlideshow:hover { background-position: -150px 0; } .cboxSlideshow_off #cboxSlideshow { background-position: -150px -25px; right: 27px; } .colorbox { outline: none !important; } /* ===== [03] Tipsy (tooltip-uri) ========================================== */ .tipsy { font-size: 13px; position: absolute; padding: 5px; z-index: 100000; } .tipsy-inner { background-color: #172125; color: #FFF; max-width: 300px; padding: 5px 8px 4px 8px; text-align: center; } .tipsy-arrow { position: absolute; width: 0; height: 0; line-height: 0; border: 5px dashed #172125; } .tipsy-arrow-n { border-bottom-color: #172125; } .tipsy-arrow-s { border-top-color: #172125; } .tipsy-arrow-e { border-left-color: #172125; } .tipsy-arrow-w { border-right-color: #172125; } .tipsy-n .tipsy-arrow { top: 0; left: 50%; margin-left: -5px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent; } .tipsy-nw .tipsy-arrow { top: 0; left: 10px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent; } .tipsy-ne .tipsy-arrow { top: 0; right: 10px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent; } .tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -5px; border-top-style: solid; border-bottom: none; border-left-color: transparent; border-right-color: transparent; } .tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; border-top-style: solid; border-bottom: none; border-left-color: transparent; border-right-color: transparent; } .tipsy-se .tipsy-arrow { bottom: 0; right: 10px; border-top-style: solid; border-bottom: none; border-left-color: transparent; border-right-color: transparent; } .tipsy-e .tipsy-arrow { right: 0; top: 50%; margin-top: -5px; border-left-style: solid; border-right: none; border-top-color: transparent; border-bottom-color: transparent; } .tipsy-w .tipsy-arrow { left: 0; top: 50%; margin-top: -5px; border-right-style: solid; border-left: none; border-top-color: transparent; border-bottom-color: transparent; } .ui-helper-hidden-accessible { position: absolute; clip: rect(0 0 0 0); width: 1px; height: 1px; overflow: hidden; margin: -1px; padding: 0; border: 0; } .ui-autocomplete LI.ui-menu-item A:hover { color: #7FBD8B; } .ui-state-focus { background: #7FBD8B !important; color: #fff !important; } .highlight { padding: 1px; background-color: #7FBD8B; color: #fff; -moz-box-shadow: 0 0 2px 0 rgba(161, 161, 161, 0.7); -webkit-box-shadow: 0 0 2px 0 rgba(161, 161, 161, 0.7); box-shadow: 0 0 2px 0 rgba(161, 161, 161, 0.7); } .no-margin { margin: 0 !important; } .no-margin-top { margin-top: 0 !important; } .no-margin-right { margin-right: 0; } .no-margin-left { margin-left: 0 !important; } .no-border-bottom { border-bottom: 0 !important; } .ir { background-color: transparent; border: 0; overflow: hidden; } .ir:before { content: ""; display: block; width: 0; height: 150%; } .hidden { display: none !important; visibility: hidden; } .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } .invisible { visibility: hidden; } .clearfix:before, .clearfix:after { content: " "; display: table; } .clearfix:after { clear: both; } .float-left { float: left; } .float-right { float: right; } /* ===== [04] Butoane ====================================================== */ .red-button { background-color: #D9AA4A; color: #fff; text-decoration: none; padding: 7px 16px; display: inline-block; border: 1px solid #c4051e; } .red-button .fa { color: #fff; font-size: 16px; margin-right: 7px; } .gradient-button,.address-edit-link { display: inline-block; padding: 7px 16px; border: 1px solid #e8e8e8; text-decoration: none; font-weight: 600; color: #1c1c1c; position: relative; background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(232,232,232,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#e8e8e8",GradientType=0 ); } .gradient-button .fa,.address-edit-link .fa { color: #D9AA4A; margin: 0 7px; font-size: 16px; } .gradient-button:hover,.address-edit-link:hover { color: #1c1c1c; } .add-product { padding-left: 40px; font-weight: 600; } .add-product:before { content: ""; font-family: FontAwesome; color: #D9AA4A; position: absolute; top: 8px; left: 15px; } .green-btn-text { padding-left: 40px; font-weight: 600; color: #3fc13f; } .green-btn-text:before { content: ""; font-family: FontAwesome; color: #3fc13f; position: absolute; top: 8px; left: 15px; } .contact-btn { margin-top: 15px; } .trap,.mirror-trap { line-height: 43px; height: 43px; padding: 0 20px; background: #D9AA4A; position: relative; min-width: 30%; display: inline-block; color: #fff; font-weight: 300; font-size: 17px; } .trap .onlyMobile { float: right; color: #ffffff; font-size: 12px; } .mirror-trap { width: 52%; padding: 0; line-height: 1.3em; } .mirror-trap a { color: #000000; } .mirror-trap a:hover { text-decoration: none; } @media only screen and (min-width: 779px) { .vezi-cos { display: none; } } @media only screen and (max-width: 778px) { .trap { width: 80%; } .add-product { display: block; margin-bottom: 10px; } .vezi-cos { display: block; margin: 10px 0; padding-left: 40px; font-weight: 600; } .vezi-cos:before { content: ""; font-family: FontAwesome; color: #D9AA4A; position: absolute; top: 8px; left: 15px; } } @media only screen and (min-width: 779px) and (max-width: 1200px) { .trap { width: 60%; } } .box23 { width: 23%; float: left; margin: 0 20px 0 0; } .box41 { width: 41%; float: left; } .box58 { width: 100%; float: left; margin: 0 20px; } .box59 { width: 59%; float: left; } .box75 { width: 75%; float: left; } .box80 { width: 100%; float: left; margin: 0 0 0 0px; } @media only screen and (max-width: 600px) { .box23,.box41,.box58,.box59,.box75,.box80 { width: auto; float: none; margin: 0; } } @media only screen and (min-width: 601px) and (max-width: 1000px) { .box58 { width: 95%; margin-right: 0; } .box80 { width: 100%; margin-right: 0; } .box75 { width: 73%; margin-right: 0; } } @media only screen and (min-width: 1001px) and (max-width: 1200px) { .box75 { width: 74%; margin-right: 0; } .box80 { width: 100%; margin-right: 0; } } .grey-text { color: #757575/*#adadad;*/; } .grey-text-cut { color: #adadad; text-decoration: line-through; } .up-arrow { position: absolute; margin-left: -5px; margin-top: 2px; width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 5px solid #fff; } .up-arrow-big { width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 5px solid #ddd; } .tag-selectat { margin: 20px 0; } .tag-selectat P { color: #1c1c1c; font-size: 20px; } #map_div { height: 600px; width: 100%; } @font-face { font-family: "Socialico"; src: url("../fonts/Socialico.eot?") format("eot"), url("../fonts/Socialico.woff") format("woff"), url("../fonts/Socialico.ttf") format("truetype"), url("../fonts/Socialico.svg#Socialico") format("svg"); font-weight: normal; font-style: normal; } /* ===== [05] Tipografie de baza =========================================== */ BODY { font-family: "Open Sans", sans-serif; font-size: 13px; color: #1c1c1c; background-color: #fff; } .wrapper { width: 90%; margin: 0 auto; } @media only screen and (min-width: 1201px) { .wrapper { width: 1181px; margin: 0 auto; } } @media only screen and (max-width: 480px) { .wrapper { width: 95%; } } @media only screen and (min-width: 481px) and (max-width: 758px) { .wrapper { width: 94%; } } @media only screen and (min-width: 759px) and (max-width: 1200px) { .wrapper { width: 95%; } } A:focus { outline: none; } .table-specifications { font-weight: 600; } /* ===== [06] Tabele specificatii produs =================================== */ .table-specifications TBODY TR:nth-child(odd) { background-color: #f6f6f6; } .table-specifications TBODY TD { padding: 5px 10px; } .table-specifications TBODY TD:nth-child(even) { text-align: right; } .table-specifications TBODY TD.info-suplimentar { color: #D9AA4A; } @media only screen and (max-width: 1000px) { .table-specifications { width: 100% !important; } } UL.formatted-ulist { list-style-type: square !ie; margin: 0; margin-left: 4em; padding: 0; counter-reset: li-counter; } UL.formatted-ulist > LI { position: relative; padding: 5px 0 5px 0.5em; } UL.formatted-ulist > LI:before { position: absolute; top: 0.4em; left: -1.33em; width: 1.2em; height: 1.2em; font-size: 1em; line-height: 1.2; text-align: center; color: #D9AA4A; content: "•"; } UL.formatted-ulist UL { list-style-type: circle !ie; margin: 0; margin-left: 2em; padding: 0; counter-reset: li-counter; margin-top: 10px; } UL.formatted-ulist UL > LI { position: relative; padding-left: 0.5em; } UL.formatted-ulist UL > LI:before { position: absolute; top: 0.4em; left: -0.5em; width: 1.2em; height: 1.2em; font-weight: 600; font-size: 1em; line-height: 1.2; text-align: center; color: #D9AA4A; content: "›"; } /* ===== [07] Header — bara gri + cos ===================================== */ #bar-grey-header .wrapper { display: flex; justify-content: flex-end; } #header-info-contact { color: #ffffff; font-weight: 600; display: flex; align-items: center; margin-right: auto; padding: 7px 0; } #header-info-contact a { color: #f0f0f0; } #header-info-contact a:hover { color: #D9AA4A; } #header-info-contact SPAN { display: flex; float: left; } #header-info-contact .fa { color: #808080; margin-right: 8px; font-size: 18px; display: block; float: left; margin-top: 1px; } #header-info-contact .fa-phone { margin-left: 30px; } #container-header-cart { position: relative; z-index: 1000; } #user-icon a { display: flex; align-items: center; height: 100%; } #user-icon .fa { color: #D9AA4A; font-size: 18px; line-height: 40px; border-right: 1px solid #242424; padding: 0 20px; } #header-cart { display: flex; align-items: center; height: 100%; } #header-cart SPAN:first-of-type { color: #808080; border-right: 0px solid #242424; line-height: 10px; display: block; float: left; padding-right: 0px; padding-left: 0px; } #header-cart A { color: #fff; text-decoration: none; padding: 0 20px; border-left: 1px solid #3a3a3a; border-right: 1px solid #242424; display: block; float: left; } #header-cart .fa { color: #D9AA4A; font-size: 18px; line-height: 40px; border-right: 1px solid #242424; padding: 0 20px; } #cart-container { cursor: pointer; } @media only screen and (max-width: 800px) { #bar-grey-header .wrapper { width: 100%; padding-left: 2%; } } @media only screen and (max-width: 480px) { #site-header { box-shadow: none; } #header-cart SPAN:first-of-type { display: none; } #header-cart A { padding: 8px; } } /* ===== [08] Header — logo + cautare ===================================== */ #logo { float: left; padding: 10px 0; } #logo IMG { width: 130px; } #box-search { margin-left: 70px; float: left; margin-top: 20px; position: relative; } #box-search INPUT:focus { outline: none; } #box-search INPUT::-webkit-input-placeholder { color: #adadad; font-size: 13px; } #box-search INPUT:-moz-placeholder { color: #adadad; font-size: 13px; } #box-search INPUT::-moz-placeholder { color: #adadad; font-size: 13px; } #box-search INPUT:-ms-input-placeholder { color: #adadad; font-size: 13px; } @media only screen and (max-width: 600px) { #bar-logo-search-menu { padding-bottom: 0px; } #logo { float: none; text-align: center; max-width: 100%; } #box-search { margin-left: 0; float: none; padding: 0; } #box-search INPUT { display: block; width: 100%; } #box-search .fa-search { top: 0; } } @media only screen and (min-width: 601px) and (max-width: 800px) { #box-search { float: right; margin-left: 0; } #logo IMG { width: 170px; } } @media only screen and (min-width: 801px) and (max-width: 1000px) { #box-search { float: right; margin-left: 0; } } @media only screen and (min-width: 1001px) and (max-width: 1200px) { #logo IMG { width: 190px; } #box-search { margin-left: 30px; } #box-search INPUT { width: 300px; } } /* ===== [09] Header — navigare principala ================================ */ #nav-primary { float: right; margin-top: 15px; } #menu-icon { display: none; } #nav { margin: 0; padding: 0; } #nav LI { float: left; } #nav LI:before { content: ""; } @media only screen and (max-width: 600px) { #nav-primary { display: none; } #nav LI { float: none; } #nav A { padding: 10px 9px; } .sb-toggle-left { display: block; float: left; margin: 20px 0; } .sb-toggle-right { display: block; float: right; margin: 20px 0; } .sb-toggle-left .fa { font-size: 20px; cursor: pointer; } } @media only screen and (min-width: 601px) and (max-width: 800px) { #nav-primary { margin-top: 0; } #nav A { padding: 10px 18px; } } @media only screen and (min-width: 801px) and (max-width: 900px) { #nav A { padding: 10px 18px; } } @media only screen and (min-width: 901px) and (max-width: 1000px) { #nav-primary { float: none; clear: both; width: 506px; margin: 0 auto; text-align: center; } #nav A { padding: 10px 18px; } } @media only screen and (min-width: 1001px) and (max-width: 1200px) { #nav A { padding: 37px 8px; } } #bar-parteneri { background-color: #fff; } /* ===== [10] Slider parteneri ============================================ */ #box-slider-parteneri .bx-wrapper .bx-viewport { box-shadow: none; border: none; left: 0; background: transparent; } #box-slider-parteneri .slide { min-height: 20px; } .container-poza-prod { width: 150px; height: 150px; } .container-poza-prod A { vertical-align: middle; display: table-cell; height: 150px; } #slider-parteneri-next .bx-next, #slider-parteneri-prev .bx-prev { color: #cfcfcf; font: normal normal normal 24px/1 FontAwesome; display: block; } #slider-parteneri-next .bx-next { position: absolute; top: 40%; right: 0; } #slider-parteneri-prev .bx-prev { position: absolute; top: 40%; left: 0; } #slider-parteneri-owl .owl-stage { display: flex; align-items: center; } #slider-parteneri-owl .item { display: flex; align-items: center; } #box-slider-parteneri { position: relative; overflow: hidden; padding: 0 30px; } #box-slider-parteneri .owl-carousel .owl-nav button.owl-prev { left: -30px; } #box-slider-parteneri .owl-carousel .owl-nav button.owl-next { right: -30px; } #box-slider-parteneri .owl-carousel .owl-nav i { background: transparent; color: #cfcfcf; } @media only screen and (max-width: 480px) { #bar-parteneri { padding: 0; } #bar-parteneri .wrapper { width: 100%; } } @media only screen and (max-width: 900px) { #box-slider-parteneri .outside { display: none; } } #main { overflow: visible; } #bar-slider { background: url("../img/slider.jpg") no-repeat top; position: relative; } #bar-slider .bx-wrapper { margin: 0; } #bar-slider .bx-wrapper .bx-viewport { box-shadow: none; border: none; left: 0; background: transparent; } #bar-slider .bx-viewport DIV.slide { min-height: 1px; min-width: 1px; } #box-slider-principal-new img { object-fit: cover; min-width: 100%; min-height: 100%; } #box-slider-principal-new img:last-of-type { display: none; } .sliderContainer { overflow: hidden; } .sliderContainer .bx-wrapper .bx-viewport { border: none; box-shadow: none; margin: 0; padding: 0; left: auto; } .sliderContainer .bx-wrapper { margin-bottom: 0; } .sliderContainer .bx-wrapper .bx-pager { display: none !important; } .slideItem { overflow: hidden; max-height: 640px; position: relative; } .slideItem a { display: flex; height: 100%; position: relative; z-index: 0; } /* Gradient overlay — pe slideItem, deasupra img (z:0) dar sub caption (z:2) */ .slideItem::after { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse 70% 100% at 50% 50%, rgba(0,0,0,0.25) 0%, rgba(212, 175, 55,0.1) 100%); z-index: 1; pointer-events: none; } /* Text si butoane deasupra gradientului */ .hero-caption-demo { z-index: 2; } @media only screen and (max-width: 640px) { #box-slider-principal-new img:first-of-type { display: none; } #box-slider-principal-new img:last-of-type { display: block; } .sliderContainer .bx-wrapper .bx-pager { bottom: 10px; } } .caption { color: #fff; margin-left: 80px; } .caption-product { float: left; } .caption-product i { position: relative; display: inline-block; font-size: 30px; margin-right: 10px; } .caption-product h3 { font-size: 30px; margin: 0 0 5px 0; } .caption-product h3:last-of-type { margin: 5px 0 0 0; } #h-caption { font-size: 36px; font-family: "Oswald", sans-serif; font-weight: 300; margin: 30px 0 30px; } .caption P:not(#h-caption) { font-size: 18px; font-family: "Oswald", sans-serif; font-weight: 400; margin: 0; text-shadow: 0 1px 3px rgba(0, 0, 0, 0.75); } .caption-product ul { list-style: none; margin: 0; } .caption-product ul li:before { content: "◯"; display: inline-block; position: relative; max-width: 0; max-height: 0; left: -10px; font-size: 10px; margin-right: 10px; } .caption-product ul li h1 { display: inline-block; margin: 10px 0; position: relative; top: 4px; } .caption-product a { color: #fff; } .caption-product a:hover { color: #D9AA4A; } .caption-image { background: #fff; margin: 0 73px 0 0; width: 30%; padding: 46px 0; text-align: center; -webkit-transform: skew(-20deg); -moz-transform: skew(-20deg); -o-transform: skew(-20deg); transform: skew(-20deg); float: right; } .container-image-slide { height: 250px; } .caption-image IMG { display: inline-block; margin: 0 auto; -webkit-transform: skew(20deg); -moz-transform: skew(20deg); -o-transform: skew(20deg); transform: skew(20deg); color: #fff; height: 100%; overflow: hidden; } .caption .red-button { padding: 15px 25px; } #bar-slider .bx-wrapper .bx-pager { width: 52%; text-align: right; padding: 0; bottom: 30px; } #bar-slider .bx-wrapper .bx-pager.bx-default-pager a:hover, #bar-slider .bx-wrapper .bx-pager.bx-default-pager a.active { background-color: #fff; } #bar-slider .bx-wrapper .bx-pager .bx-pager-item, #bar-slider .bx-wrapper .bx-controls-auto .bx-controls-auto-item { background-color: transparent; border: 1px solid #fff; width: 12px; height: 12px; text-align: center; margin: 0 5px; border-radius: 50%; } #bar-slider .bx-wrapper .bx-pager.bx-default-pager a { background-color: transparent; margin: 2px; width: 8px; height: 8px; } #bar-slider .bx-next { position: relative; float: right; margin-top: -17%; margin-right: -20px; background: url(../img/controls.png) no-repeat -20px; } #bar-slider .bx-prev { position: relative; float: left; margin-top: -17%; margin-left: -20px; background: url(../img/controls.png) no-repeat 0; } @media only screen and (max-width: 778px) { #bar-slider .bx-next,#bar-slider .bx-prev { display: none; } #bar-slider .bx-wrapper .bx-pager { display: none; } .caption { margin-left: 0; } .caption-product { width: 95%; float: none; margin: 0 auto; } #h-caption { margin: 15px 0 15px; font-size: 22px; } .caption P:not(#h-caption) { font-size: 16px; } .caption-product h3 { font-size: 20px; } .caption-image { display: none; } .caption .red-button { padding: 10px; margin: 10px 0; } } @media only screen and (min-width: 779px) and (max-width: 900px) { #bar-slider .bx-next,#bar-slider .bx-prev { display: none; } #bar-slider .bx-wrapper .bx-pager { display: none; } #bar-slider .slide { margin-right: 2px; } .caption { margin-left: 0; } .caption P:not(#h-caption) { font-size: 16px; } .caption-product { width: 52%; } #h-caption { margin: 15px 0; font-size: 33px; } .caption-image { width: 39%; margin: 0 65px 0 0; padding: 45px 0; -webkit-transform: skew(-15deg); -moz-transform: skew(-15deg); -o-transform: skew(-15deg); transform: skew(-15deg); } #bar-slider .bx-wrapper IMG { max-width: 67% !important; height: auto; -webkit-transform: skew(15deg); -moz-transform: skew(15deg); -o-transform: skew(15deg); transform: skew(15deg); } .caption .red-button { padding: 10px; margin: 10px 0; } } @media only screen and (min-width: 901px) and (max-width: 1000px) { #bar-slider .bx-wrapper .bx-pager { display: none; } .caption-product { width: 51%; } #h-caption { margin: 35px 0 20px; font-size: 33px; } .caption P:not(#h-caption) { font-size: 17px; } .caption-image { width: 39%; margin: 0 65px 0 0; padding: 45px 0; -webkit-transform: skew(-15deg); -moz-transform: skew(-15deg); -o-transform: skew(-15deg); transform: skew(-15deg); } #bar-slider .bx-wrapper IMG { max-width: 73% !important; -webkit-transform: skew(15deg); -moz-transform: skew(15deg); -o-transform: skew(15deg); transform: skew(15deg); } #bar-slider .bx-next { margin-top: -25%; } #bar-slider .bx-prev { margin-top: -25%; } .caption .red-button { padding: 10px; margin: 10px 0; } } @media only screen and (min-width: 1001px) and (max-width: 1200px) { .caption-product { width: 51%; } #h-caption { margin: 35px 0 20px; font-size: 33px; } .caption P:not(#h-caption) { font-size: 17px; } .caption-image { width: 39%; margin: 0 65px 0 0; padding: 45px 0; -webkit-transform: skew(-15deg); -moz-transform: skew(-15deg); -o-transform: skew(-15deg); transform: skew(-15deg); } #bar-slider .bx-wrapper IMG { max-width: 73% !important; -webkit-transform: skew(15deg); -moz-transform: skew(15deg); -o-transform: skew(15deg); transform: skew(15deg); } #bar-slider .bx-next { margin-top: -22%; } #bar-slider .bx-prev { margin-top: -22%; } .caption .red-button { padding: 10px; margin: 10px 0; } } #heading-zone .fa { font-size: 14px; } @media only screen and (max-width: 480px) { #heading-zone TR TD { font-size: 11px; padding: 0 3px; } } @media only screen and (min-width: 601px) and (max-width: 768px) { #heading-zone TR TD { font-size: 11px; padding: 0 3px; } } @media only screen and (max-width: 1200px) { #heading-zone .mirror-trap,#heading-zone .trap { float: none; } #heading-zone .mirror-trap { width: 100%; background-color: transparent; margin-top: 15px; height: auto; } .mirror-trap a, .mirror-trap a:hover { color: #ffffff; text-decoration: none; } #heading-zone .mirror-trap:after { border: none; } #heading-zone TR TD { color: #1c1c1c; } .bar-content { padding: 40px 0 0; } } .product-image-container .helper-img-center { display: none; } .poza-detaliu { height: 368px; } .helper-img-center { display: inline-block; height: 100%; vertical-align: middle; } .product-details SPAN { color: #adadad; } .product-description { color: #adadad; } .thumbs-container A { margin: 5px; } @media only screen and (max-width: 480px) { .homePage .bar-content { background: #ffffff; } .product { width: 45%; margin-bottom: 35px; } .product:nth-of-type(even) { margin-right: 0 !important; } .product:nth-of-type(odd) { margin-right: 10% !important; } .product-image-container { height: 200px; } .product .product-name { margin: 10px 0; } } @media only screen and (min-width: 481px) and (max-width: 600px) { .product { width: 31.7%; text-align: center; margin-right: 10px; } } @media only screen and (min-width: 601px) and (max-width: 1000px) { .product { width: 45%; margin-bottom: 35px; } .product:nth-of-type(even) { margin-right: 0 !important; } .product:nth-of-type(odd) { margin-right: 10% !important; } .product .product-image-container { height: 200px; border: none; } .product .product-name { margin: 10px 0; } } .bar-content .box80 .product { width: 18.4%; margin-right: 1.2%; } @media only screen and (max-width: 480px) { .bar-content .box80 .product { width: 45%; margin-bottom: 35px; } .bar-content .box80 .product:nth-of-type(even) { margin-right: 0 !important; } .bar-content .box80 .product:nth-of-type(odd) { margin-right: 10% !important; } .bar-content .box80 .product .product-image-container { height: 200px; border: none; } .bar-content .box80 .product .product-name { margin: 10px 0; } } @media only screen and (min-width: 481px) and (max-width: 600px) { .bar-content .box80 .product { width: 31%; text-align: center; margin-right: 10px; } } @media only screen and (min-width: 601px) and (max-width: 1000px) { .bar-content .box80 .product { width: 45%; margin-bottom: 35px; } .bar-content .box80 .product:nth-of-type(even) { margin-right: 0 !important; } .bar-content .box80 .product:nth-of-type(odd) { margin-right: 10% !important; } .bar-content .box80 .product .product-image-container { height: 200px; border: none; } .bar-content .box80 .product .product-name { margin: 10px 0; } } @media only screen and (min-width: 1001px) and (max-width: 1200px) { .bar-content .box80 .product { width: 23.8%; } } .pagination { margin: 0 auto; padding: 0; } .pagination .button-paginare { padding: 8px 15px; border: 1px solid #e8e8e8; margin: 0 5px; color: #1c1c1c; } .pagination A:hover { color: #fff; background: #1c1c1c; border-color: #000; } .pagination A.active { background: #D9AA4A; border-color: #c4051e; color: #fff; } .pages { margin: 6px auto 0; text-align: center; font-size: 14px; float: left; } .pages .active { color: #fff; } .page-inactive { display: none; } .button-prev, .button-next { margin: 0 5px; } .button-prev .fa, .button-next .fa { padding: 7px 15px; border: 1px solid #e6e9ed; color: #1c1c1c; font-size: 18px; } .button-prev .fa:hover, .button-next .fa:hover { color: #fff; } #box-detaliu-produs { margin: 0; } .thumbs-container { margin: 10px 0; text-align: center; } .thumb-picture { width: 60px; height: 60px; } .informatii-produs { margin-left: 20px; padding-bottom: 30px; border-bottom: 1px solid #e8e8e8; } .nume-produs { font-size: 18px; font-weight: bold; margin: 0; } .descriere-produs { font-weight: 600; margin: 25px 0; } .caracteristica-produs { font-weight: 600; margin: 0; } .pret-nou { font-size: 18px; color: #1c1c1c; } .pret-cod { font-size: 18px; color: #D9AA4A; } .pret-nou-small { font-size: 13px; color: #000; } .pret-cod-small { font-size: 13px; color: #D9AA4A; } .caracteristica-select { margin: 20px 0; font-weight: 600; } .optional-attr { border: 1px solid #e8e8e8; padding: 10px; color: #adadad; background-color: #fff; } .optiuni-produs { margin: 30px 0 0 20px; } .tip-specificatie { font-size: 14px; font-weight: 600; margin: 35px 0; } #alte-specificatii { margin-left: 20px; } #alte-specificatii .grey-text { font-weight: 600; } #box-comment { border-top: 1px solid #e8e8e8; margin-top: 30px; } #box-comment .tip-specificatie { margin: 15px 0 30px; } .box-forms { width: 50%; margin: 0 auto; } .form INPUT { border: 1px solid #e8e8e8; width: 49%; margin-right: 20px; padding: 10px 20px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; margin-bottom: 20px; } .form TEXTAREA { border: 1px solid #e8e8e8; width: 100%; margin-right: 20px; padding: 10px 20px 10px 21px; margin-top: 20px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } .form ::-webkit-input-placeholder { color: #adadad; font-size: 13px; } .form :-moz-placeholder { color: #adadad; font-size: 13px; opacity: 1; } .form ::-moz-placeholder { color: #adadad; font-size: 13px; opacity: 1; } .form :-ms-input-placeholder { color: #adadad; font-size: 13px; } .form INPUT[type=submit] { float: right; width: auto; margin: 20px 0 0; border: 1px solid #c4051e; } .form INPUT[type=submit]:hover { border-color: #000; } .box-forms INPUT { width: 100%; margin-right: 0; } .box-forms INPUT[type=submit] { margin: 0 auto; float: none; display: block; } #box-form-autentificare-cos { margin-bottom: 20px; } #box-form-autentificare-cos INPUT[type=submit] { margin-top: 0; } #box-form-autentificare-cos .red-button { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } #box-form-autentificare-cos .red-button:first-of-type { padding: 9px 20px; } .form-edit-address-container { width: 50%; margin: 0 auto 10px; } .form-edit-address-container INPUT { width: 100%; margin-bottom: 10px; margin-right: 0; } .form-edit-address-container LABEL { display: block; font-weight: 600; margin-bottom: 5px; } .form-edit-address-container SELECT { margin: 10px 0; padding-left: 15px; height: 37px; width: 36%; cursor: pointer; border: 1px solid #e7e7e7; } .form-edit-address-container .cif-select { width: 46px; padding-left: 0; } .form-edit-address-container .letter-reg-com { width: 40px; padding-left: 0; } .form-edit-address-container .number-reg-com { width: 40px; padding-left: 0; } .form-edit-address-container .year-reg-com { width: 55px; padding-left: 0; } .form-edit-address-container .black-button { padding: 7px 16px; } .input-77 { width: 88% !important; } .input-59 { width: 58% !important; } .form-row { text-align: center; margin-bottom: 10px; } .form-row LABEL { display: inline-block; width: 17%; text-align: right; } .form-row INPUT { border: 1px solid #e7e7e7; padding: 6px; margin-left: 10px; width: 45%; } .form-row SELECT { border: 1px solid #e7e7e7; padding: 5px; margin-left: 10px; width: 45%; height: 30px; } .form-row #cod-inregistrare { display: inline; margin-left: 10px; } .form-row #cod-inregistrare INPUT { width: 12%; margin-left: 0; } .form-row #cod-inregistrare SELECT { width: 10%; margin-left: 0; height: 30px; } .form-row #cif-container { display: inline; margin-left: 10px; } .form-row #cif-container INPUT { width: 34%; margin-left: 0; } .form-row #cif-container SELECT { width: 10%; margin-left: 0; } @media only screen and (max-width: 768px) { .form-row LABEL { width: 100%; text-align: center; } .form-row INPUT { margin-left: 0; } .form-row SELECT { font-size: 13px; margin-left: 0; width: 100%; } .form-row #cod-inregistrare { display: block; margin-left: 0; } .form-row #cod-inregistrare INPUT { width: 32%; margin-left: 0; } .form-row #cod-inregistrare SELECT { width: 15%; margin-left: 0; } .form-row #cif-container { width: 90%; } .form-row #cif-container SELECT { width: 15%; } .form-row #cif-container INPUT { width: 40%; } #extra-fields .gradient-button { margin-top: 10px; } .optiuni-produs { margin: 30px 0 0 0; } } #form-cos-cumparaturi .red-button .fa { margin-right: 0; } INPUT.error, SELECT.error, TEXTAREA.error, DIV.error, INPUT.error-js, SELECT.error-js, TEXTAREA.error-js { border: 1px solid #ee2f2f !important; } .success-box { color: #259300; text-align: left; } .success-box-center { color: #759f4c; text-align: center; padding: 0 20px; } .error-box { color: #ee2f2f; text-align: left; } .error-box-center { color: #ee2f2f; text-align: center; padding: 0 20px; } #box-comm-list { border-top: 1px solid #e8e8e8; margin-top: 30px; } #box-comm-list .tip-specificatie { margin: 15px 0 30px; } .main-comment { font-size: 13px; margin-bottom: 10px; } .comment-author { color: #D9AA4A; font-size: 13px; font-weight: 700; margin: 7px 0; } .comment-date { margin: 0 0 15px; color: #888; font-size: 12px; display: inline-block; } .comment-content { border: 1px solid #dddddd; padding: 20px; font-weight: 600; } .main-comment .up-arrow-big { margin-left: 3%; } .second-comment { margin-left: 7%; font-size: 13px; margin-bottom: 10px; } .second-comment .up-arrow-big { margin-left: 4.5%; } @media only screen and (max-width: 600px) { #box-detaliu-produs IMG { max-width: 100%; } .box-forms,.form-edit-address-container { width: 100%; } .form INPUT,.form TEXTAREA,.box-forms INPUT,.form INPUT[type=submit],#box-form-autentificare-cos .red-button { width: 100%; float: none; margin: 10px auto !important; display: block; } #box-form-livrare INPUT, #box-form-livrare TEXTAREA, #box-form-livrare select { margin: 0 !important; } #box-form-autentificare-cos .red-button { text-align: center; } #modalitati-livrare { width: 95%; margin: 0 auto; } #address-list .gradient-button { margin-bottom: 10px; } } @media only screen and (min-width: 601px) and (max-width: 1000px) { #box-detaliu-produs .box41,#box-detaliu-produs .box59 { width: 100%; float: none; margin: 0; } #box-detaliu-produs IMG { max-width: 100%; margin-bottom: 20px; } .informatii-produs { margin: 0; } .form-edit-address-container { width: 80%; } .form INPUT,.form TEXTAREA,.box-forms INPUT { width: 100%; float: none; margin: 10px auto !important; } #box-form-livrare INPUT, #box-form-livrare TEXTAREA, #box-form-livrare select { margin: 0 !important; } #box-form-autentificare-cos INPUT[type=submit] { margin-top: 0 !important; } } @media only screen and (min-width: 1001px) and (max-width: 1200px) { #box-detaliu-produs .box41 { width: 40%; } #box-detaliu-produs IMG { max-width: 100%; margin-bottom: 20px; } .form INPUT { width: 49%; margin-right: 15px; } } #cart-title .trap { float: left; } #cart-title #sum { float: right; color: #D9AA4A; font-weight: 600; margin-top: 13px; } #cart-table { margin-top: 20px; } #cart-table TABLE { width: 100%; } #cart-table THEAD TR TD { color: #fff; font-weight: 600; line-height: 40px; position: relative; } #cart-table TBODY TR TD { background-color: #fff; padding: 10px; color: #adadad; font-weight: 600; } #cart-table TBODY TR TD IMG { width: 130px; border: 0px solid #e8e8e8; } #cart-table TBODY TR TD INPUT[type=number] { width: 35px; } #cart-info { background-color: #fff; border-bottom: 1px solid #e8e8e8; } #total-price { float: left; background-color: #fff; width: 84.5%; border-right: 1px solid #e8e8e8; } #total-price SPAN { display: inline-block; } #total-price p { display: grid; grid-template-columns: auto 1fr; border: none; padding: 0; margin: 0; } #total-price p span { display: block; } #total-price p span:last-of-type { font-size: 14px; padding-top: 0; font-weight: 500; } #total-price SPAN:first-of-type { background-color: #f6f6f6; padding: 20px 0 20px 20px; font-size: 14px; font-weight: 600; border-right: 1px solid #e8e8e8; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; width: 15vw; } #total-price SPAN:nth-of-type(2) { padding: 15px 20px; font-size: 18px; font-weight: 600; } #total-price INPUT { padding: 5px 20px; width: 45%; margin: 7px 20px 0; border: 1px solid #e8e8e8; font-size: 24px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } #cart-options { float: right; width: 15%; } #cart-options DIV { text-align: center; } #cart-options .gradient-button, #cart-options .black-button { padding: 7px 0; margin: 10px auto; width: 120px; } #box-back-refresh { margin: 20px 0; } #box-info-livrare .grey-text { margin: 30px 15px; } #box-form-livrare .form INPUT[type=submit] { float: left; width: auto; } #box-form-livrare .grid { display: grid; grid-template-columns: repeat(3,1fr); grid-gap: 15px; } #box-form-livrare textarea, #box-form-livrare select, #box-form-livrare input { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; width: 100%; padding: 9px 20px; border: 1px solid #e8e8e8; margin: 0; } #box-form-livrare .select2-container { width: 100% !important; } #box-form-livrare .select2-container--default .select2-selection--single { border: none; } #box-form-livrare .select2-container .select2-selection--single { height: auto; } #box-form-livrare .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: normal; } #box-form-livrare .select2-container .select2-selection--single .select2-selection__rendered { padding: 9px 20px; border: 1px solid #e8e8e8; } #box-form-livrare p { color: #1f81d5; margin-top: 5px; display: block; } #user-type { margin: 20px 0; } #user-type LABEL, #user-name LABEL { display: inline-block; padding-left: 5px; margin-top: 0; cursor: pointer; margin-right: 5%; } #user-type INPUT { width: 13px; height: 13px; padding: 0; margin: 0; position: relative; top: 2px; } #user-name INPUT { width: 100%; border: 1px solid #e8e8e8; margin-right: 20px; padding: 10px 20px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } #user-name LABEL { margin-top: 8px; } .box50 { width: 50%;} .box30 { width: 100%; float: left; } .form-checkbox { display: inline-block; } .form-checkbox LABEL, .address-text LABEL { display: inline; padding-left: 5px; margin-top: 0; cursor: pointer; } .form-checkbox INPUT[type="radio"],.address-text INPUT[type="radio"],.form-checkbox INPUT[type="checkbox"] { width: 13px; height: 13px; padding: 0; margin: 0; position: relative; top: -1px; overflow: hidden; } #container-accept-terms label { cursor: default; } .address-text { width: 75%; float: left; padding: 10px; margin: 0; } .address-text INPUT[type="radio"] { top: 3px; } .address { font-size: 13px; font-weight: 600; } @media only screen and (max-width: 600px) { .address-text LABEL,#container-accept-terms LABEL { width: 85%; } .address-text INPUT[type=radio] { top: -25px; } #user-name INPUT { margin-right: 0; } #container-accept-terms { width: 95%; margin: 0 auto; } #container-accept-terms INPUT[type=checkbox] { top: -35px; } } #table-sumar .title { padding: 20px; font-size: 14px; } #table-sumar TD { padding: 10px 20px; } #table-sumar TD:nth-child(even) { text-align: right; } #table-sumar TD#total-cost { font-weight: bold; } .sumar-comanda-optiune { background-color: #fff; border: 1px solid #e8e8e8; border-width: 0 1px 1px; padding: 0 20px; } .sumar-comanda-optiune .red-button { margin-top: 12px; } #container-accept-terms { margin-top: 15px; display: block; padding-bottom: 10px; } #send-order-no-auth { display: inline-block !important; margin-top: 10px !important; background: #b8862e !important; color: #1a0f00 !important; -webkit-text-fill-color: #1a0f00 !important; border: none !important; border-radius: 50px !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: 2.5px !important; text-transform: uppercase !important; padding: 14px 36px !important; cursor: pointer !important; position: relative !important; overflow: hidden !important; box-shadow: 0 4px 18px rgba(201,154,58,0.45), 0 0 0 0 rgba(201,154,58,0.35) !important; animation: btn-pulse 2s ease-out infinite !important; transition: transform 0.15s ease, box-shadow 0.15s ease !important; z-index: 0 !important; } /* Gradient animat ca strat */ #send-order-no-auth { display: inline-block !important; margin-top: 10px !important; background: linear-gradient(-45deg, #7a5518, #fabc5f, #f0ac25, #f5b646, #7a5518, #fabc5f, #f0ac25, #f5b646, #7a5518, #fabc5f) !important; background-size: 400% 100% !important; color: #1a0f00 !important; -webkit-text-fill-color: #1a0f00 !important; border: none !important; border-radius: 50px !important; font-size: 13px !important; font-weight: 800 !important; letter-spacing: 2.5px !important; text-transform: uppercase !important; padding: 14px 36px !important; cursor: pointer !important; position: relative !important; overflow: hidden !important; animation: bling 8s linear infinite !important; transition: transform 0.15s ease, box-shadow 0.15s ease !important; box-shadow: 0 4px 20px rgba(201,154,58,0.5) !important; } #send-order-no-auth:hover { transform: translateY(-2px) scale(1.03) !important; box-shadow: 0 8px 28px rgba(201,154,58,0.75) !important; animation-play-state: paused !important; } @keyframes bling { 0% { background-position: 0% 0; } 100% { background-position: 400% 0; } } .message-error-container { border: 1px solid #F1C66B !important; } .lista_comenzi { width: 100%; } .lista_comenzi THEAD TR { font-weight: 600; } .lista_comenzi TR:nth-child(odd) { border: 1px solid #e7e7e7; background: #fff; color: #352e3a; font-size: 13px; text-shadow: none; } .lista_comenzi TR:nth-child(even) { border: 1px solid #e7e7e7; background: #f8f8f8; color: #352e3a; font-size: 13px; text-shadow: none; } .lista_comenzi TR:hover { background: #f2f2f2; color: #352e3a; } .lista_comenzi TD { padding: 10px; text-align: center; } @media only screen and (max-width: 768px ) { .lista_comenzi TD { padding: 5px; } } @media only screen and (max-width: 480px) { #cart-table TR TD:first-child { display: none; } #cart-table TR TD .red-button { padding: 10px; } #total-price { float: none; border-bottom: 1px solid #e8e8e8; width: 100%; } #total-price SPAN:first-of-type { width: 100%; } #total-price INPUT { width: 90%; display: block; margin: 10px auto; } #total-price p { display: block; padding: 10px 20px; } #total-price p span:first-of-type { display: none; } #total-price p span:last-of-type { display: block; padding: 0; } #cart-options { float: none; width: 86%; margin: auto; } #cart-options DIV { border: none; } #box-back-refresh .gradient-button,#box-back-refresh .red-button { float: none; width: 85%; margin: 0 auto 15px; display: block; text-align: center; } #box-info-livrare .grey-text { margin: 15px; } #box-form-livrare .form INPUT,#box-form-livrare .form SELECT ,#box-form-livrare .form TEXTAREA { width: 100%; display: block; } #user-type LABEL { margin-right: 3%; } .box50,.box30 { width: 100%; } .sumar-comanda-optiune H4 { float: none; } .sumar-comanda-optiune .red-button { margin: 0 auto 12px; display: block; float: none; } } @media only screen and (min-width: 481px) and (max-width: 768px) { #cart-table TR TD:first-child { display: none; } #total-price { float: none; border-bottom: 1px solid #e8e8e8; width: 100%; } #total-price p { display: block; padding: 10px 20px; } #total-price p span:first-of-type { display: none; } #total-price p span:last-of-type { display: block; padding: 0; } #total-price SPAN:first-of-type { width: 100%; } #total-price INPUT { width: 90%; display: block; margin: 10px auto; } #cart-options { float: none; width: 86%; margin: auto; } #cart-options DIV { border: none; } #box-form-livrare .form INPUT { width: 100%; display: block; } } @media only screen and (min-width: 769px) and (max-width: 1000px) { #total-price { width: 79%; } #cart-options { width: 20%; } #total-price SPAN:first-of-type { width: 25vw; } #total-price INPUT { width: 40%; } #cart-options .gradient-button, #cart-options .black-button { margin: 12px auto 13px; } } @media only screen and (min-width: 1001px) and (max-width: 1200px) { #box-form-livrare .form SELECT { margin-right: 15px; } #cart-options .gradient-button, #cart-options .black-button { margin: 12px auto 13px; } #total-price SPAN:first-of-type { width: 25vw; } } @media only screen and (max-width: 960px) { #box-form-livrare .grid { grid-template-columns: repeat(2,1fr); } } @media only screen and (max-width: 700px) { #box-form-livrare .grid { grid-template-columns: 1fr; grid-gap: 10px; } } #box-contact .white-box { margin-top: 0; padding: 20px; } #box-contact .white-box P:not(#address) { margin: 0; font-weight: 600; } #address { margin: 20px 0; font-weight: 600; } #phone SPAN:not(#phone-label) { text-align: right; width: 49%; display: inline-block; margin-top: 10px; } #phone-label { display: block; float: left; text-align: left; margin-top: 10px; } @media only screen and (max-width: 600px) { #box-contact .box75 { width: 95%; margin: 0 auto; } } @media only screen and (min-width: 601px) and (max-width: 1000px) { #box-contact .box23 { width: 37%; } #box-contact .box75 { width: 59%; } } #box-noutati { margin: 0; padding: 25px; } #box-slider-noutati { margin-top: 20px; } #box-slider-noutati .bx-wrapper { margin: 0; } #box-slider-noutati .bx-wrapper .bx-viewport { box-shadow: none; border: none; left: 0; background: #323232; } .caption-noutati { padding: 9px; } .caption-noutati-image { float: left; width: 42%; } .caption-noutati-image IMG { max-width: 100%; width: 100%; position: relative; } .featured-post { color: #fff; background-color: #D9AA4A; margin: 0; font-size: 12px; font-weight: bold; padding: 5px 15px; position: absolute; top: 20px; left: 20px; } .caption-noutati-content { float: left; width: 55%; margin-left: 20px; } .caption-title { font-size: 18px; color: #fff; font-weight: bold; margin: 20px 0; } .caption-noutati P:not(.caption-title):not(.featured-post) { font-weight: 600; color: #adadad; } .caption-noutati-content .gradient-button { margin-top: 20px; } #box-slider-noutati .bx-wrapper .bx-pager { width: 34%; text-align: right; padding: 0; bottom: 40px; right: 9px; } #box-slider-noutati .bx-wrapper .bx-pager.bx-default-pager a:hover, #box-slider-noutati .bx-pager.bx-default-pager a.active { color: #D9AA4A !important; } #box-slider-noutati .bx-wrapper .bx-pager .bx-pager-item, #box-slider-noutati .bx-wrapper .bx-controls-auto .bx-controls-auto-item { background-color: transparent; text-align: center; margin: 0 2px; } #box-slider-noutati .bx-wrapper .bx-pager.bx-default-pager a { background-color: transparent; margin: 2px; width: 8px; height: 8px; text-indent: 0; text-decoration: none; color: #fff; font-size: 13px; font-weight: 600; } #box-slider-noutati .outside { float: right; margin-top: -49px; width: 150px; text-align: right; } #box-slider-noutati .outside .bx-next, #box-slider-noutati .outside .bx-prev { padding: 7px 0 8px; color: #1c1c1c; font-size: 16px; border: 1px solid #e8e8e8; background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(232,232,232,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#e8e8e8",GradientType=0 ); } #box-slider-noutati .outside .bx-next { margin-left: 6px; } #box-slider-noutati .outside .bx-next .fa { padding: 0 18px 0 18px; } #box-slider-noutati .outside .bx-prev .fa { padding: 0 18px 0 18px; } #box-slider-noutati .outside .bx-next:hover, #box-slider-noutati .outside .bx-prev:hover { background: #1c1c1c; border-color: #000; color: #fff; } @media only screen and (max-width: 1000px) { #box-slider-noutati .outside { display: none; } #box-slider-noutati .bx-wrapper .bx-pager { display: none; } .caption-noutati-image { float: none; width: 100%; text-align: center; } .caption-noutati-image IMG { text-align: center; margin: 0 auto; } .caption-noutati-content { float: none; width: 100%; margin: 0; } } #container-noutati { border-bottom: 1px solid #e4e6ea; padding-bottom: 20px; margin-bottom: 20px; } #container-noutati .tip-specificatie { margin: 0 0 25px; } .noutate { width: 31.8%; margin: 0 20px 20px 0; float: left; } .noutate-image-container { width: 100%; text-align: center; cursor: pointer; height: 330px; white-space: nowrap; } .noutate IMG { max-width: 100%; vertical-align: middle; max-height: 100%; object-fit: cover; } .noutate-titlu { font-size: 18px; font-weight: bold; margin: 20px 0; display: block; } .noutate .grey-text { color: #7b7b7b; margin: 0; } .noutate P:not(.grey-text) { font-weight: 600; margin: 5px 0 20px; } .tag { font-weight: bold; } @media only screen and (max-width: 1000px) { #box-noutati { padding: 10px; } .noutate-titlu { margin: 10px 0; font-size: 14px; ine-height: 1.2em; word-break: break-word; } .taguri-noutate { display: none; } .taguri-noutate a { color: #757575; font-weight: 600; } .noutate { width: 48%; overflow: hidden; } .noutate .grey-text { margin-bottom: 5px; } .noutate:nth-of-type(even) { margin-right: 0 !important; } .noutate:nth-of-type(odd) { margin-right: 4% !important; } .noutate-image-container { position: relative; overflow: hidden; padding-top: 55%; height: 0; } .noutate-image-container img { position: absolute; top: 0; left: 0; right: 0; max-width: initial; max-height: initial; width: 100%; } } @media only screen and (min-width: 1001px) and (max-width: 1200px) { .noutate { width: 31%; } } .box-detaliu-noutate { padding: 25px; margin-top: 0; } .box-detaliu-noutate IMG { max-width: 100%; } .detaliu-titlu { font-size: 18px; font-weight: bold; margin: 20px 0; padding-bottom: 20px; border-bottom: 1px solid #e8e8e8; } .detalii-noutate { margin: 20px 0; } .detalii-noutate .tag { float: left; } .detalii-noutate .grey-text { float: left; margin: 0; } .detalii-noutate .share-noutate { float: right; } .producer { text-align: center; float: left; width: 23.3%; height: 180px; margin-right: 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 0px solid #f2f2f2/* #e8e8e8*/; padding: 30px 20px; margin-bottom: 20px; } .helper { display: inline-block; height: 100%; vertical-align: middle; } .imgContainer { position: relative; height: 0; padding-top: 40%; width: 100%; overflow: hidden; margin-bottom: 10px; } .imgContainer img { max-width: 95%; max-height: 95%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } .producer a { font-weight: bold; } @media only screen and (min-width: 320px) and (max-width: 380px) { .producer { width: 43%; height: 115px; margin: 10px !important; padding: 5px; } } @media only screen and (min-width: 381px) and (max-width: 500px) { .producer { width: 43%; margin: 10px !important; padding: 10px 5px; } } @media only screen and (min-width: 501px) and (max-width: 600px) { .producer { width: 28.8%; height: 130px; margin: 10px !important; padding: 10px 5px; } } @media only screen and (min-width: 601px) and (max-width: 768px) { .producer { width: 43%; height: 125px; margin: 10px !important; padding: 10px 5px; } } @media only screen and (min-width: 769px) and (max-width: 900px) { .producer { width: 29.2%; height: 120px; padding: 10px 5px; margin: 8px !important; } } @media only screen and (min-width: 901px) and (max-width: 1000px) { .producer { width: 29.2%; height: 140px; padding: 10px 5px; margin: 8px !important; } } @media only screen and (min-width: 1001px) and (max-width: 1200px) { .producer { width: 22.7%; height: 160px; } } .mini-gallery { position: relative; } .mini-gallery .slide { height: 100px; } .mini-gallery .slide IMG { width: 100%; height: 100%; } .mini-gallery .bx-wrapper .bx-viewport { box-shadow: none; left: 0; border: none; } .prev-mini-gallery, .next-mini-gallery { position: absolute; top: 28%; font-size: 30px; } .prev-mini-gallery { left: 15px; } .next-mini-gallery { right: 15px; } @media only screen and (max-width: 1000px) { #box-galerie-evenimente .outside { display: none; } } .carouselVitabolic .product-name { margin: 10px 0; } .carouselVitabolic .product-price { margin: 0 0 10px; margin-top: auto !important; } .carouselVitabolic .red-button { display: none; text-align: center; align-self: flex-end; } .carouselVitabolic .equal-height-containers { display: block/*grid*/; } .carouselNoutati { display: none; } @media only screen and (max-width: 600px) { .carouselNoutati { display: block; } } .owl-carousel .owl-nav i { height: 30px; width: 30px; line-height: 30px; border-radius: 50%; display: block; background: rgba(0, 0, 0, 0.8); color: #fff; font-size: 20px; } .owl-carousel .owl-nav [class*=owl-]:hover { background: transparent; } .owl-carousel .owl-nav [class*=owl-]:hover i { background: #000; } .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next { position: absolute; top: 50%; display: block; padding: 0 !important; margin: 0; cursor: pointer; transform: translateY(-50%); } .owl-carousel .owl-nav button.owl-next { right: 0; } .owl-carousel .owl-nav button.owl-prev { left: 0; } .upPage { position: fixed; z-index: 3; right: 55px; bottom: 55px; display: none; } .upPage a { position: relative; display: inline-block; overflow: hidden; width: 50px; height: 50px; text-align: center; border: 1px solid rgb(0 0 0/ 8%); } .upPage a i { position: absolute; top: 50%; right: 0; bottom: 0; left: 0; margin: auto; transition: all 0.3s ease-in-out; color: #D9AA4A; font-size: 1em; line-height: 0; } .upPage a:hover { background: #D9AA4A; } .upPage a:hover i { color: #ffffff; } @media only screen and (max-width: 800px) { .upPage { right: 2vw; bottom: 2vw; } .upPage a { width: 40px; height: 40px; } } #pageFooter { padding: 60px 0; } #pageFooter .flex { display: flex; } #pageFooter .grid { display: flex; justify-content: space-between; } #pageFooter ul { margin: 0; padding: 0; } #site-footer ul { margin: 0; padding: 0; } #pageFooter .grid ul:first-of-type, #newsletter { max-width: 340px; } #pageFooter ul:first-of-type p { margin-bottom: 20px; } #pageFooter .grid img { width: 140px; display: inline-block; margin-bottom: 20px; } #pageFooter b { font-weight: 400; } #pageFooter .title { text-transform: uppercase; font-size: 13px; font-family: "Open Sans", sans-serif; margin-bottom: 20px; margin-top: 0; font-weight: 400; color: #ffffff; } #pageFooter li:not(:first-of-type ) .title { margin-top: 20px; } #pageFooter li { color: #ffffff; text-align: left; list-style-type: none; } #pageFooter a { display: inline-block; text-decoration: none; font-weight: 400; color: rgba(0, 0, 0, 0.6); transition: color 0.5s; } #pageFooter li a:hover { color: #ffffff; } #pageFooter li p { text-transform: none; margin: 0; } #pageFooter .socialmedia li:first-of-type { display: block; } #pageFooter .socialmedia li a { display: inline-flex; } #pageFooter .wrapper:last-of-type { padding-top: 60px; font-size: 12px; } @media only screen and (max-width: 1200px) { #newsletter { max-width: 320px; } } @media only screen and (max-width: 800px) { #pageFooter .grid { display: grid; grid-template-rows: auto; grid-gap: 40px; grid-auto-flow: row dense; grid-template-columns: repeat(2, 1fr); } } @media only screen and (max-width: 480px) { #pageFooter { padding: 30px 0 60px; } #pageFooter li:not(:first-of-type ) .title { margin-top: 30px; } #pageFooter .grid { grid-template-columns: 1fr; grid-gap: 30px 20px; } #pageFooter .wrapper:last-of-type { padding-top: 40px; grid-template-columns: 1fr; grid-gap: 0; } #pageFooter .wrapper:last-of-type p { margin: 0; } #newsletter { grid-column: 1/3; width: 100%; max-width: none; grid-column-start: 1; grid-row-start: 1; } .contactRapid { display: none; } } .socialmedia li { display: inline-block; } .socialmedia a { border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; height: 30px; width: 30px; color: #D9AA4A; vertical-align: middle; } .socialmedia a:hover { opacity: 0.8; } .socialmedia i { font-size: 16px; line-height: initial; color: #fff; } #bar-footer-menu-logos { padding: 20px 0; display: none; } #nav-footer { float: left; } #menu-footer { margin: 0; padding: 0; } #menu-footer LI { float: left; } #menu-footer LI:before { content: ""; } #menu-footer A { color: #1c1c1c; font-size: 14px; font-weight: 600; text-decoration: none; display: block; padding: 10px 18px; } #menu-footer A:hover { color: #D9AA4A; } #menu-footer A.active { color: #D9AA4A; } #logos { float: right; } #logos IMG { margin-right: 20px; } .gridFooter { display: flex; justify-content: space-around; } .sigle { margin-top: 30px !important; display: flex; } .sigle img { object-fit: contain; max-width: 100%; } @media only screen and (max-width: 1000px) { #nav-footer { display: none; } #logos IMG { margin-right: 5px; } } #dezvoltat { float: left; } #socials A { margin-left: 20px; text-decoration: none; display: inline-block; } #socials .fa { font-size: 14px; } #socials .fa:hover { color: #D9AA4A; } @media only screen and (max-width: 600px) { #dezvoltat,#socials { float: none; text-align: center; } } #box-left-sidebar { width: 19%; float: left; } .categorii .black-button { display: block; position: relative; } .categorii .black-button:after { content: ""; font-family: Fontawesome; position: absolute; right: 15px; top: 12px; } .categorii LI { list-style-type: none; } .categorii LI:last-child A { border: none; } .categorii LI A.active,.categorii LI A.active-arrow { color: #fff; background-color: #D9AA4A; border-color: #D9AA4A; } .categorii LI A.active-arrow:after { content: ""; font-family: Fontawesome; position: absolute; right: 15px; top: 12px; } .categorii LI IMG { display: none; } #dashboard LI A.active:after,.categorii LI A.active:after { content: ""; } .lista-subcategorii { margin: 0; padding: 0; } .lista-subcategorii LI A.active:after { content: ""; } #right-sidebar-tablet { display: none; } @media only screen and (max-width: 600px) { .bar-content #box-left-sidebar { display: none; } #box-left-sidebar { width: auto; float: none; } } @media only screen and (min-width: 601px ) and (max-width: 1000px) { #box-left-sidebar { width: 40%; } #right-sidebar-tablet { display: block; margin-top: 20px; } } @media only screen and (min-width: 1001px ) and (max-width: 1200px) { #box-left-sidebar { width: 19%; } } #box-right-sidebar { width: 19%; float: right; } #lista-articole { margin-bottom: 20px; } .facebook-page-like-code { margin: 20px 0 0; max-width: 100%; } #newsletter .white-box { padding: 0; margin: 0; } #italic-explanation { color: rgba(255, 255, 255, 0.6); } #italic-explanation.message-error { margin-top: 0; } #email-box { background-color: #f7f7f7; border: 1px solid #e8e8e8; border-left: none; border-right: none; padding: 20px 10px; position: relative; } #email-box .fa { position: absolute; left: 25px; top: 31px; color: #adadad; } #newsletter INPUT { border: 1px solid #e8e8e8; padding: 10px/* 10px 10px 40px*/; width: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } #newsletter .gradient-button, #newsletter .red-button { display: block; font-size: 12px; margin-top: 6px; font-weight: 400; } @media only screen and (max-width: 600px) { .bar-content #box-right-sidebar { display: none; } #box-right-sidebar { width: auto; float: none; margin: 0; display: none; } #lista-articole { margin-top: 20px; } #email-box INPUT { width: 100%; } } @media only screen and (min-width: 601px ) and (max-width: 1000px) { #box-right-sidebar { display: none; } } @media only screen and (min-width: 1001px ) and (max-width: 1200px) { #box-right-sidebar { width: 18%; } #email-box INPUT { width: 100%; } #newsletter INPUT[type=submit] { max-width: 100%; white-space: normal; } } .product-search { border-bottom: 1px solid #e8e8e8; cursor: pointer; } .product-search IMG { width: 82px; max-height: 92px; overflow: hidden; border-right: 1px solid #e8e8e8; display: block; float: left; } .search-details { display: block; float: left; padding: 15px; width: 77.4%; position: relative; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } .search-details:hover { background-color: #f7f7f7; } .search-details:after { content: ""; font-family: FontAwesome; position: absolute; top: 35%; right: 10px; font-size: 20px; color: #cccccc; } .search-name { font-weight: bold; margin: 0 0 10px; display: block; height: 16px; overflow: hidden; } .search-info { font-weight: 600; margin: 0; } #searchButton { cursor: pointer; } @media only screen and (max-width: 480px) { .search-details { width: 77%; } .product-search IMG { width: 22%; } .search-details:hover { background-color: #ffffff; } } @media only screen and (min-width: 769px ) and (max-width: 1000px) { .search-details { width: 70%; } } #cart-link { color: #fff; font-family: "Open Sans", sans-serif; font-size: 13px; text-decoration: underline; } #close-cart { color: #fff; font-family: "Open Sans", sans-serif; font-size: 13px; cursor: pointer; } .cart-product-small-delete { width: 5%; font-family: "Open Sans", sans-serif; } .bar-order-price A:visited { color: #fff; } .cart-small-price SPAN { font-size: 16px; font-family: "Open Sans", sans-serif; color: #2f3034; } @media only screen and (max-width: 1000px) { #container-cart-products-small { display: none !important; } } @media only screen and (max-width: 600px ) { #header-panels { background-color: #1c1c1c; } #left-panel, #right-panel { background-color: #444; } #right-panel #box-left-sidebar .categorii LI A , #left-panel .categorii LI A { background: transparent; padding: 10px; font-size: 14px; color: #fff; text-shadow: none; border: 1px solid #fff; border-width: 0 0 1px 0; } #right-panel #box-left-sidebar .categorii LI A.active , #left-panel .categorii LI A.active { color: #D9AA4A; } #right-panel #box-left-sidebar #newsletter .white-box { border: none; background: transparent; } #right-panel #newsletter .gradient-button { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; margin: 20px 0; width: 100%; padding: 8px 0; } #right-panel #newsletter #email-box { border: none; background: none; padding: 0; } #right-panel #newsletter #email-box .fa { left: 18px; top: 11px; } #nav { margin: 0 0 15px; padding: 0; } #nav LI A { display: block; padding: 10px; font-size: 14px; color: #fff; text-shadow: none; border-bottom: 1px solid #fff; } #nav LI A.active { color: #D9AA4A; } } @media only screen and (min-width: 601px) { #header-panels,#left-panel, #right-panel { display: none; } } #box-form-engros { margin: 20px 0; } #box-form-engros .message-success { margin: 20px 0; text-align: center; font-size: 16px; } #form-engros { margin-bottom: 20px; } TABLE.listing-produse-engros { border-collapse: collapse; width: 100%; margin-bottom: 20px; } TABLE.listing-produse-engros THEAD TR TH { text-align: center; border: 1px solid #ccc; padding: 10px; background-color: #1c1c1c; color: #ffffff; } TABLE.listing-produse-engros TBODY TR:nth-child(even) { background: #eaeaea; } TABLE.listing-produse-engros TBODY TR:nth-child(odd) { background: #ffffff; } TABLE.listing-produse-engros TBODY TR TD { border: 1px solid #ccc; } .produsDenumire { width: 70%; padding-left: 15px; } .produsPret { text-align: center; width: 15%; } .produsCantitate { text-align: center; width: 15%; } .produsCantitate INPUT { width: 50%; margin: 3px auto; text-align: center; padding: 3px; } #checkoutInfo { padding-bottom: 20px; } #checkoutInfo INPUT { width: 10% !important; } #checkoutInfo TEXTAREA { width: 32%; height: 100px; margin: 0; } #send-order-engros { width: 20%; float: left; margin: 0; } #logout-engros { float: right; } .delivery-text { font-size: 13px; margin: 0; text-align: justify; display: none; } .delivery-text A { color: #ee2f2f; font-size: 13px; } .delivery-text P { margin: 20px 0 0 0; } #box-form-livrare .form INPUT[type=radio] { width: auto; display: inline-block; vertical-align: middle; margin: 0; } .form-checkbox:first-of-type { margin-right: 20px; } @media only screen and (max-width: 800px) { #colorbox { width: 90vw !important; height: auto !important; } #cboxContent { width: 90vw !important; left: 5vw; height: auto !important; top: 15vh; } #cboxLoadedContent, .cboxPhoto { width: 100% !important; height: auto !important; } } #languageBox { position: relative; height: 100%; width: 60px; } #languageMenu { position: absolute; right: 0; z-index: 2; top: 0; display: inline-block; list-style-type: none; margin: 0; padding: 0; } #languageMenu a:not(.active) { opacity: 0; display: none; } #languageMenu:hover a { opacity: 1; display: flex; } .languagePicker a { display: flex; overflow: hidden; align-items: center; justify-content: center; width: 60px; height: 45px; } .languagePicker a:hover img { opacity: 0.8; } .languagePicker img { width: 25px; display: inline-block; } .advert-once { position: fixed; bottom: 0; right: 0; left: 0; top: 0; background: rgb(0 0 0 / 80%); z-index: 99999; justify-content: center; align-items: center; } .advert-once .box { background-color: #ffffff; min-width: 600px; max-width: 650px; position: relative; display: grid; grid-template-columns: 35% 65%; } .advert-once .container:first-of-type { background: url(../img/newsletterBg.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; text-align: center; } .advert-once .container:last-of-type { padding: 20px 30px; background-color: #ffffff; box-shadow: -5px 0 5px 1px rgb(0 0 0 / 60%); } .advert-once img { width: 160px; } .advert-once .blueButton { float: right; margin-top: 20px; } .advert-once .advert-button:hover { opacity: 0.8; } .advert-once .advert-button { transition: all 0.3s ease-in-out; width: 25px; height: 25px; font-size: 18px; font-weight: bold; position: absolute; display: flex; align-items: center; justify-content: center; right: 10px; top: 10px; cursor: pointer; } #pageFooter .advert-once .title { margin: 0; font-size: 26px; font-weight: 500; } #newsletter.advert-once { max-width: none !important; display: flex; } .advert-button { display: none; } @media only screen and (max-width: 800px) { .advert-once .box { min-width: 90vw; max-width: 96vw; } .advert-once .container:last-of-type { padding: 30px; } } @media only screen and (max-width: 480px) { .advert-once .container:last-of-type { padding: 25px; } .advert-once .box { grid-template-columns: 1fr; } .advert-once .container:first-of-type { height: 155px; background-size: 101% auto; background-position: top center; } .advert-button { background: rgb(255 255 255 / 45%); } #pageFooter #newsletter.advert-once .title { font-weight: 600; font-size: 16px; } } #categorii-mobile-menu { padding: 40px 0 30px; border-top: 0px solid #eeeeee; } #categorii-mobile-menu .categorii { display: grid; grid-template-columns: repeat(4,1fr); grid-gap: 30px 15px; padding: 15px 10px 10px 10px; } #categorii-mobile-menu img { display: block; width: 100%; height: 100%; object-fit: cover; } #categorii-mobile-menu span { display: block; margin-top: 10px; } #categorii-mobile-menu a { background: transparent; border: none; padding: 0; font-size: 10px; text-align: center; text-transform: uppercase; } #categorii-mobile-menu a.active-arrow { color: #D9AA4A !important; border: 1px solid #D9AA4A; } #categorii-mobile-menu a:after { content: none; } #categorii-mobile-menu .red-button { padding: 15px 25px; grid-column: 1/5; } #categorii-mobile-menu LI.suplimente-la-oferta { grid-column: 1/5; margin-top: -10px; } #categorii-mobile-menu LI.suplimente-la-oferta a. { font-size: 16px !important; } #categorii-mobile-menu LI.suplimente-la-oferta a:after { content: "%" !important; margin-left: 3px; background: #D9AA4A; padding: 0 5px; color: #fff; border-radius: 2px; display: inline-block; } #categorii-mobile-menu LI.suplimente-la-oferta a:before { content: "%"; margin-right: 3px; background: #D9AA4A; padding: 0 5px; color: #fff; border-radius: 2px; display: inline-block; } #categorii-mobile { padding: 10px 15px; margin-bottom: 10px; display: block; } #producatori-mobile-menu { padding: 10px 15px; margin-bottom: 20px; display: block; } #producatori-mobile-menu-button span, #categorii-mobile-button span { display: none !important; } #cauta-mobile { margin-bottom: 40px; float: right; } @media only screen and (min-width: 801px) { #categorii-mobile-menu, #producatori-mobile-menu, .filtruProducatori,.mobileOnly { display: none !important; } } @media only screen and (max-width: 350px) { #categorii-mobile-menu li { overflow: hidden; } } .formStyle { padding: 30px 0; } .formStyle input::-moz-focus-inner { margin: 0; padding: 0; border: 0; } .formStyle fieldset { margin: 0; padding: 0; border-width: 0; } .formStyle ::-webkit-input-placeholder { color: #030925; } .formStyle :-ms-input-placeholder { color: #030925; } .formStyle ::placeholder { color: #030925; } .formStyle input[type="text"], .formStyle input[type="password"], .formStyle textarea, .formStyle select { background: #ffffff; display: block; width: 100%; margin-top: 0; margin-bottom: 40px; padding: 10px 20px; letter-spacing: 1px; color: #030925; border: 1px solid #e8e8e8; font-size: 12px; } .formStyle input:focus, .formStyle textarea:focus, .formStyle select:focus { border-color: #000000; outline: 0; } .formStyle button { float: right; margin-top: 10px; transition: all 0.3s ease-in-out; } .formStyle button:focus { outline: none; } .formStyle .red-button { margin-top: 40px !important; } .formStyle label { font-weight: bold; margin-bottom: 5px; display: block; } .formStyle .containerLabel input { margin: 5px; } .formStyle .select2-container { margin-bottom: 40px; } .formStyle .select2-dropdown { border: 1px solid #e8e8e8; } .formStyle .select2-container .select2-selection--single .select2-selection__rendered { padding: 4px 20px; } .formStyle .select2-container--default .select2-selection--single { border-radius: 0; color: #030925; border: 1px solid #e8e8e8; height: 38px; } .formStyle .select2-container--default .select2-selection--single .select2-selection__arrow { height: 38px; } .select2-container--open .select2-dropdown--below { border-color: #e8e8e8; } .formStyle .error { margin: 0 !important; } .formStyle .errorMessage { color: red; display: block; margin-bottom: 40px; } .membru .banner { display: block; margin-top: 30px; width: 100%; } .membru .grid { display: grid; grid-template-columns: 1fr 1fr; grid-gap: 60px; align-items: center; } .membru .white-box { padding: 40px; } .membru .beneficii { text-align: center; } @media only screen and (max-width: 640px) { .membru .grid { grid-template-columns: 1fr; grid-gap: 20px; } .membru .white-box { padding: 20px; } .formStyle .politica { margin: 20px 0; } .formStyle .politica input[type="checkbox"] { display: inline; } .formStyle input[type="text"], .formStyle input[type="password"], .formStyle textarea, .formStyle select { margin-bottom: 10px; } .formStyle .select2-container { margin-bottom: 10px; } } details { border: 1px solid #ccc; padding: 0 20px; } details:not(:first-of-type) { border-top: none; } summary { padding: 20px 0; font-weight: 600; display: flex; justify-content: space-between; } details[open] > summary:after { content: ""; } details > summary:after { content: ""; font-family: FontAwesome; margin-left: 10px; } .intrebari h2 { margin: 0 0 30px; text-transform: uppercase; } #sib-container * { font-family: "Open Sans", sans-serif; font-size: 13px; } #sib-container,.sib-form, .sib-form-block { padding: 0; } .ui-checkbox-on .checkbox_tick_positive:before { border-color: #D9AA4A; } .ui-input-text { width: 100%; } html, body, BODY { background: var(--bg-main) !important; color: var(--text-main) !important; } A { text-decoration: none; color: var(--text-main); } A:hover { color: var(--gold-hover); } #site-header { -webkit-box-shadow: 0 4px 5px 0 rgba(0,0,0,0.23); -moz-box-shadow: 0 4px 5px 0 rgba(0,0,0,0.23); box-shadow: 0 8px 24px rgba(0,0,0,0.55); z-index: 1; position: relative; background: var(--bg-header); } #header-info-contact, #header-info-contact a { color: var(--text-main) !important; } #header-info-contact .fa, #user-icon .fa, #header-cart .fa, #socials .fa:hover { color: var(--gold) !important; } #logo P { font-size: 8px; letter-spacing: 5px; color: rgba(0, 0, 0, 0.5); font-weight: 400; margin-top: 2px; text-transform: uppercase; text-align: center; } #box-search INPUT::placeholder { color: #777 !important; } #nav A.active:hover { color: var(--premium-gold-light) !important; } #main, .bar-content { background-color: var(--bg-main) !important; } .bar-content { background-color: #f2f2f2; padding: 0px 0; padding-top: 0px; } .white-box, .product, .product-image-container, #box-noutati, #box-contact .white-box, #newsletter .white-box { background-color: #EDE8DE !important; color: var(--text-main) !important; border-radius: 10px !important; overflow: hidden !important; border: 1px solid rgba(184,134,46,0.25) !important; box-shadow: 0 2px 12px rgba(184,134,46,0.08) !important; } .white-box { background-color: #fff; padding: 10px; margin: 20px 0; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; border: 1px solid var(--border-dark); box-shadow: 0 8px 24px rgba(0,0,0,0.35); } .product-details, .product-description { color: var(--text-main) !important; } .product-price, .product-details SPAN { color: var(--text-main) !important; } .grey-text, .grey-text-cut { color: var(--text-muted) !important; } .red-button, .trap, .mirror-trap { background-color: var(--gold) !important; color: #090A0C !important; border-color: var(--gold-dark) !important; } .red-button:hover { background-color: var(--gold-hover) !important; border: 1px solid #000000; color: #090A0C !important; border-color: var(--gold-hover) !important; } .red-button .fa, .gradient-button .fa, .address-edit-link .fa, .add-product:before, .vezi-cos:before { color: #090A0C !important; } .red-button:hover i { color: #FFFFFF !important; } .black-button { background-color: #101114 !important; color: var(--gold) !important; text-decoration: none; display: inline-block; padding: 12px 16px; border: 1px solid var(--gold-dark) !important; } .black-button:hover { color: #090A0C !important; background-color: var(--gold) !important; } .lista-subcategorii LI A { padding: 13px 36px; background-color: #111318 !important; } .lista-subcategorii LI A.active { color: var(--gold) !important; background-color: var(--bg-card) !important; border-color: var(--border-dark) !important; } #heading-zone TR TD { color: var(--text-main) !important; font-size: 15px; padding: 0px 6px; } #heading-zone .trap, #heading-zone .mirror-trap { box-shadow: 0 4px 14px rgba(214,168,79,0.25); } .sliderContainer .bx-wrapper .bx-pager.bx-default-pager a:hover, .sliderContainer .bx-wrapper .bx-pager.bx-default-pager a.active { background: var(--gold) !important; } .sliderContainer .bx-wrapper .bx-pager.bx-default-pager a { background: #777 !important; } .pagination A { color: var(--text-main) !important; text-decoration: none; font-weight: 600; font-size: 12px; background: var(--bg-card) !important; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#ffffff", endColorstr="#e8e8e8",GradientType=0 ); border-color: var(--border-dark) !important; } .pagination A:hover, .pagination A.active { color: #090A0C !important; background: var(--gold) !important; border-color: var(--gold) !important; } .nume-produs, .pret-nou, .pret-nou-small { color: var(--premium-gold-light) !important; } .pret-cod, .pret-cod-small, .caracteristica-produs, .comment-author, #cart-title #sum { color: var(--gold) !important; } .informatii-produs, #box-comment, #box-comm-list, .comment-content { border-color: var(--border-dark) !important; } .form INPUT, .form TEXTAREA, .form-row INPUT, .form-row SELECT, .form-edit-address-container INPUT, .form-edit-address-container SELECT, .optional-attr { background: #FFFFFF !important; color: var(--text-main) !important; border: 0px solid var(--border-dark) !important; } .form INPUT::placeholder, .form TEXTAREA::placeholder { color: #777 !important; } .ui-autocomplete LI.ui-menu-item A { display: block; padding: 3px 10px; color: var(--text-main) !important; background: var(--bg-card) !important; line-height: 30px; text-shadow: none; } .ui-autocomplete LI.ui-menu-item A:hover, .ui-state-focus { background: var(--gold) !important; color: #090A0C !important; } .ui-autocomplete-category, .highlight { color: #090A0C !important; background-color: var(--gold) !important; } #cart-table THEAD TR { background-color: #090A0C !important; } #cart-table THEAD TR TD #cell-bordered { border-left: 8px solid #D9AA4A; position: absolute; top: 0; left: 0; height: 42px; padding-left: 20px; border-left-color: var(--gold) !important; } #cart-table TBODY TR { border-bottom: 1px solid #C2B29B !important; } #cart-table TBODY TR TD, #cart-info, #total-price, #total-price SPAN:first-of-type { background-color: #F0E7DA !important; color: rgb(160, 120, 48) !important; border-color: #C2B29B !important; } #blue-soft { color: var(--gold) !important; text-decoration: none; font-size: 12px; } #nav-footer A { color: var(--text-main) !important; } #nav-footer A:hover, #nav-footer A.active { color: var(--gold) !important; } .no-results { margin: 5px; padding: 5px 25px; text-align: center; background: var(--gold) !important; color: #090A0C !important; -webkit-box-shadow: 0 0 2px 0 rgba(161, 161, 161, 0.8); box-shadow: 0 0 2px 0 rgba(161, 161, 161, 0.8); } .message-error { border: 1px solid #F1C66B; padding: 5px 23px; color: #d9822b !important; display: inline-block; border-color: #d9822b !important; background: var(--bone-dark) } .message-success { border: 1px solid var(--gold); padding: 5px 23px; color: rgb(160, 120, 48) ; background: var(--bone-dark) } :root { --bg-main: #090A0C; --bg-header: #080808; --bg-section: #15171C; --bg-card: #1E1F23; --bg-card-soft: #24262B; --gold: #D6A84F; --gold-hover: #F2C96D; --gold-dark: #8F6B2E; --text-main: #F5F1E8; --text-muted: #B4A67A; --text-soft: #A9A9A9; --border-dark: #2C2C2C; --premium-black: #070809; --premium-dark: #0B0D10; --premium-panel: #181A1F; --premium-card: #202226; --premium-card-border: #33363D; --premium-gold: #D9AA4A; --premium-gold-light: #F1C66B; --premium-gold-dark: #9C7430; --premium-text: #F4F0E6; --premium-muted: #B8B0A0; } body, BODY, #main, .bar-content { background: var(--premium-dark) !important; color: var(--premium-black) !important; } #bar-grey-header { background-color: #050505 !important; border-bottom: 1px solid #1B1B1B !important; background: #050505 !important; min-height: 0 !important; } /* ===== BONE WHITE OVERRIDES — bara categorii nu e dark ===== */ #bar-categorii-nav { background: transparent !important; background-color: transparent !important; border-bottom: 1px solid #d8d0c0 !important; border-top: none !important; overflow: visible !important; position: relative !important; z-index: 600 !important; } #nav-categorii { overflow: visible !important; position: relative !important; } #nav-categorii ul.categorii { overflow: visible !important; } #nav-categorii ul.categorii > li > a { background: transparent !important; color: #6b6560 !important; } #nav-categorii ul.categorii > li > a:hover, #nav-categorii ul.categorii > li > a.active-arrow, #nav-categorii ul.categorii > li > a.active { color: #0f0f0f !important; background: transparent !important; } #nav-cat-more-btn { background: transparent !important; color: #6b6560 !important; } #nav-cat-more-btn:hover { color: #0f0f0f !important; background: transparent !important; } #nav-cat-dropdown { background: #ffffff !important; background-color: #ffffff !important; color: #1a1a1a !important; border: 1px solid #d8d0c0 !important; z-index: 9000 !important; } #nav-cat-dropdown li a { background: transparent !important; color: #1a1a1a !important; } #nav-cat-dropdown li a:hover, #nav-cat-dropdown li a.active-arrow { background: #f5f0e8 !important; color: #c9973a !important; } /* ===== END BONE WHITE OVERRIDES ===== */ /* Ascunde sub-dropdown producatori din bara de nav */ #nav-categorii ul.lista-subcategorii { display: none !important; } #nav-categorii ul.categorii > li > a::after { display: none !important; content: none !important; } /* ===================================================== CHIP-URI PRODUCATORI — pe pagina de categorie ===================================================== */ .filtru-producatori-chips { display: flex; flex-wrap: wrap; gap: 10px; padding: 16px 0 20px 0; align-items: center; } .chip-producator { display: inline-block; font-family: 'Inter', sans-serif; font-size: 12px; font-weight: 500; letter-spacing: 0.5px; text-transform: uppercase; color: #6b6560 !important; -webkit-text-fill-color: #6b6560 !important; background: transparent !important; border: 1.5px solid #d8d0c0 !important; border-radius: 50px !important; padding: 7px 18px !important; text-decoration: none !important; white-space: nowrap; transition: background 0.2s, border-color 0.2s, color 0.2s !important; cursor: pointer; } .chip-producator:hover { background: #f5f0e8 !important; border-color: #c9973a !important; color: #0f0f0f !important; -webkit-text-fill-color: #0f0f0f !important; } .chip-producator.activ { background: #0f0f0f !important; border-color: #0f0f0f !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; font-weight: 600 !important; } .chip-producator.activ:hover { background: #c9973a !important; border-color: #c9973a !important; } @media (max-width: 640px) { .filtru-producatori-chips { gap: 8px; padding: 12px 0 16px 0; } .chip-producator { font-size: 11px !important; padding: 6px 14px !important; } } /* Sub-dropdown producatori — fond alb, text dark */ #nav-categorii ul.lista-subcategorii { background: #ffffff !important; background-color: #ffffff !important; border: 1px solid #d8d0c0 !important; box-shadow: 0 8px 24px rgba(0,0,0,0.1) !important; z-index: 9000 !important; } #nav-categorii ul.lista-subcategorii li a, #nav-categorii .lista-subcategorii LI A { background: transparent !important; background-color: transparent !important; color: #1a1a1a !important; padding: 10px 20px !important; font-size: 13px !important; font-weight: 400 !important; letter-spacing: 0 !important; text-transform: none !important; border-bottom: none !important; } #nav-categorii ul.lista-subcategorii li a:hover, #nav-categorii .lista-subcategorii LI A:hover, #nav-categorii ul.lista-subcategorii li a.active, #nav-categorii .lista-subcategorii LI A.active { background: #f5f0e8 !important; background-color: #f5f0e8 !important; color: #c9973a !important; } #bar-logo-search-menu { background-color: var(--bg-header) !important; border-bottom: 3px solid var(--premium-gold) !important; background: #070707 !important; } #nav A { color: #F6F1E8 !important; font-size: 14px; font-weight: 600; text-decoration: none; display: block; padding: 0px 18px; margin-top: 20px; letter-spacing: 0.3px; } #nav A:hover { color: var(--premium-gold-light) !important; background-color: var(--gold) !important; background: transparent !important; } #nav A.active { color: var(--premium-gold) !important; } #box-search INPUT { padding: 10px 48px 10px 20px !important; border: 1.5px solid #d8d0c0 !important; border-radius: 50px !important; width: 380px !important; height: 44px !important; position: relative; box-sizing: border-box; background: #ffffff !important; color: #1a1a1a !important; font-size: 14px !important; } /* Buton search (cercul auriu cu lupa) */ #box-search .fa-search, #searchButton { position: absolute !important; border-radius: 50% !important; right: 4px !important; top: 50% !important; transform: translateY(-50%) !important; background: #C99A3A !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; font-size: 13px !important; padding: 0 !important; width: 36px !important; height: 36px !important; display: flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; border: none !important; transition: background 0.2s !important; } #box-search .fa-search:hover, #searchButton:hover { background: #a87c28 !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; } .sliderContainer .bx-wrapper .bx-pager.bx-default-pager a.active, .sliderContainer .bx-wrapper .bx-pager.bx-default-pager a:hover { background: var(--premium-gold) !important; } .white-box, .product-section, #box-produse-recomandate, #box-top-vanzari, #box-noutati { background: var(--premium-panel) !important; border: 1px solid #2C2F36 !important; } /* Carduri produs — rotunjite, identice pe toate paginile */ article.equal-height-containers, .product { border-radius: 14px !important; overflow: hidden !important; background: #ffffff !important; border: 1px solid var(--border) !important; padding: 16px !important; overflow: hidden !important; } .product:hover { border-color: var(--premium-gold-dark) !important; box-shadow: 0 8px 22px rgba(0,0,0,0.35); transform: translateY(-2px); } .product-name:hover { color: var(--premium-gold-light) !important; } .product-price, .product-details { color: var(--premium-text) !important; } .product-details span { color: var(--premium-muted) !important; } .product-description { color: var(--premium-muted) !important; } .trap, .mirror-trap { background: linear-gradient(135deg, #D9AA4A 0%, #C49339 100%) !important; color: #070707 !important; font-weight: 600 !important; text-shadow: none !important; border: none !important; } .trap:after { content: ""; position: absolute; height: 0; width: 3px; top: 0; right: -19px; border-top: 43.5px solid #000000; border-right: 17px solid transparent; border-top-color: #C49339 !important; } .mirror-trap:after { content: ""; position: absolute; height: 0; width: 3px; top: 0; left: -19px; border-bottom: 43.5px solid #D9AA4A; border-left: 17px solid transparent; border-bottom-color: #D9AA4A !important; } .trap .fa, .mirror-trap .fa { color: #070707 !important; } /* ===== PANOU UTILIZATOR — tema deschisa (bej/crem ca sectiunea AUTENTIFICARE) ===== */ /* Sidebar "CONTUL MEU" header */ .section-name { color: #B8862E !important; background: #EDE8DE !important; border-left: none !important; border-bottom: 2px solid #C99A3A !important; padding: 14px 20px !important; font-weight: 700 !important; margin: 0 !important; letter-spacing: 2.5px !important; font-size: 11px !important; text-transform: uppercase !important; margin: 32px 0 20px !important; } /* Sidebar nav items */ .categorii LI A { border-bottom: 1px solid rgba(184,134,46,0.12) !important; color: #5a4a2a !important; text-decoration: none !important; display: block !important; background: #F5F0E8 !important; padding: 12px 20px !important; font-weight: 500 !important; font-size: 13px !important; position: relative !important; transition: background 0.18s, color 0.18s !important; } .categorii LI A:hover { color: #B8862E !important; background: #EDE8DE !important; } .categorii LI A.active, .categorii LI A.active-arrow { color: #fff !important; background: #C99A3A !important; border-color: #C99A3A !important; font-weight: 700 !important; } /* Container sidebar rotunjit */ #dashboard.categorii { border-radius: 10px !important; overflow: hidden !important; border: 1px solid rgba(184,134,46,0.25) !important; box-shadow: 0 2px 12px rgba(184,134,46,0.08) !important; } /* Inputuri panoul utilizator */ #box-form-personal-info .form INPUT:not([type=submit]), #form-address-container .form INPUT:not([type=submit]), #form-address-container SELECT { background: #fff !important; border: 1px solid rgba(184,134,46,0.3) !important; color: #3a2e1a !important; border-radius: 8px !important; padding: 12px 16px !important; } #box-form-personal-info .form INPUT:not([type=submit]):focus, #form-address-container .form INPUT:not([type=submit]):focus { border-color: #C99A3A !important; outline: none !important; box-shadow: 0 0 0 3px rgba(201,154,58,0.15) !important; } /* Titluri sectiuni panou */ .box75 .title-border-top { color: #3a2e1a !important; border-top: 1px solid rgba(184,134,46,0.2) !important; padding-top: 16px !important; font-size: 14px !important; font-weight: 600 !important; letter-spacing: 0.5px !important; } /* Trap — banner titlu (identic cu AUTENTIFICARE: bej deschis + text auriu centrat) */ .box75 .trap { background: #EDE8DE !important; color: #B8862E !important; border-left: none !important; border-bottom: 2px solid #C99A3A !important; letter-spacing: 4px !important; font-size: 13px !important; font-weight: 600 !important; text-align: center !important; width: 100% !important; display: block !important; } /* Adrese */ .address { background: #F5F0E8 !important; border: 1px solid rgba(184,134,46,0.2) !important; border-radius: 8px !important; padding: 12px 16px !important; margin-bottom: 8px !important; margin-top: 8px; } .address-text { color: #3a2e1a !important; } .bx-prev, .bx-next, .owl-prev, .owl-next { color: #fff !important; } .owl-carousel .owl-nav i, .bx-wrapper .bx-controls-direction a { background-color: rgba(0,0,0,0.75) !important; color: #fff !important; border-radius: 50%; } .owl-carousel .owl-nav i:hover, .bx-wrapper .bx-controls-direction a:hover { background-color: var(--premium-gold) !important; color: #070707 !important; } .bx-wrapper .bx-pager.bx-default-pager a, .owl-dot span { background: #777 !important; } .bx-wrapper .bx-pager.bx-default-pager a.active, .owl-dot.active span { background: var(--premium-gold) !important; } #site-footer, footer { background: #090A0C !important; color: var(--premium-muted) !important; border-top: 1px solid #24262B; } #site-footer a, footer a { color: var(--premium-muted) !important; } #site-footer a:hover, footer a:hover { color: var(--premium-gold-light) !important; } #site-footer h1, #site-footer h2, #site-footer h3, #site-footer h4, footer h1, footer h2, footer h3, footer h4 { color: var(--premium-gold) !important; } #newsletter input, .newsletter input, input[type="email"] { background: #F4F0E6 !important; color: #111 !important; border: 1px solid #D9AA4A !important; } #newsletter input[type="submit"], .newsletter input[type="submit"] { background: var(--premium-gold) !important; color: #070707 !important; border: none !important; font-weight: 700; } #newsletter input[type="submit"]:hover, .newsletter input[type="submit"]:hover { background: var(--premium-gold-light) !important; } #bar-copyright { background-color: #050505 !important; padding: 30px 0; color: #B8B0A0 !important; font-size: 12px; background: #050505 !important; } .red-button, .black-button, .gradient-button, .address-edit-link { border-radius: 50px !important; background: var(--gold) !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; border: none !important; font-weight: 600 !important; letter-spacing: 1.2px !important; text-transform: uppercase !important; font-size: 11px !important; padding: 10px 22px !important; display: inline-block !important; text-decoration: none !important; transition: background 0.2s ease !important; } .red-button:hover, .black-button:hover, .gradient-button:hover, .address-edit-link:hover { background: var(--black) !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; } /* Buton TRIMITE COMANDA — gradient animat, suprascrie .red-button de mai sus */ #send-order-no-auth:hover { background: linear-gradient(-45deg, #7a5518, #fabc5f, #f0ac25, #f5b646, #7a5518, #fabc5f, #f0ac25, #f5b646, #7a5518, #fabc5f) !important; background-size: 400% 100% !important; color: #1a0f00 !important; -webkit-text-fill-color: #1a0f00 !important; transform: translateY(-2px) scale(1.03) !important; box-shadow: 0 8px 28px rgba(201,154,58,0.75) !important; animation-play-state: paused !important; } #send-order-no-auth:active { transform: translateY(0) scale(0.98) !important; } @keyframes bling { 0% { background-position: 0% 0; } 100% { background-position: 400% 0; } } .ui-autocomplete { position: absolute; top: 0; left: 0; width: auto; padding: 0 !important; border: 1px solid #D9AA4A !important; background: #111318 !important; list-style-type: none; cursor: default; box-shadow: 0 12px 28px rgba(0,0,0,0.65); z-index: 99999 !important; } .ui-autocomplete-category { display: block; padding: 5px 7px; color: #D9AA4A !important; background: #070809 !important; border-bottom: 1px solid #2C2F36; font-weight: 700; } .ui-autocomplete LI.ui-menu-item { padding: 0; background: #111318 !important; border-bottom: 1px solid #2C2F36; } .ui-autocomplete LI.ui-menu-item A, .ui-autocomplete LI.ui-menu-item a { background: #111318 !important; color: #F4F0E6 !important; text-shadow: none !important; } .ui-autocomplete LI.ui-menu-item A:hover, .ui-autocomplete LI.ui-menu-item a:hover, .ui-autocomplete .ui-state-focus, .ui-autocomplete .ui-state-active, .ui-state-focus { background: #D9AA4A !important; color: #070809 !important; } .ui-autocomplete strong, .ui-autocomplete b, .ui-autocomplete .product-name, .ui-autocomplete .name { color: #D9AA4A !important; } .ui-autocomplete span, .ui-autocomplete p, .ui-autocomplete div { color: #F4F0E6 !important; } .ui-autocomplete img { background: #F4F4F1 !important; border: 1px solid #2C2F36; padding: 4px; box-sizing: border-box; } .ui-autocomplete .fa, .ui-autocomplete i { color: #D9AA4A !important; } .ui-autocomplete LI.ui-menu-item:hover .fa, .ui-autocomplete LI.ui-menu-item:hover i { color: #070809 !important; } #container-cart-products-small { display: none; position: absolute; margin-top: 1px; right: 0; z-index: 1000; width: 410px; background: #FDFAF5 !important; border: 1.5px solid rgba(184,134,46,0.35) !important; box-shadow: 0 8px 28px rgba(184,134,46,0.15); border-radius: 0 0 10px 10px !important; overflow: hidden !important; } .bar-cart-link-close { background: #EDE8DE !important; padding: 12px 20px !important; color: #3a2e1a !important; border-bottom: 1px solid rgba(184,134,46,0.2) !important; } #cart-link, #close-cart { color: #B8862E !important; font-weight: 700 !important; text-decoration: none !important; letter-spacing: 1px !important; font-size: 12px !important; } #close-cart .fa-angle-up { font: normal normal normal 16px/1 FontAwesome !important; margin-left: 8px; color: #B8862E !important; } .cart-product-small { font-family: "Open Sans", sans-serif; font-size: 13px; padding: 12px 15px; background: #FDFAF5 !important; border-bottom: 1px solid rgba(184,134,46,0.12) !important; border-top: none !important; color: #3a2e1a !important; } .cart-product-small:hover { background: #F5EED8 !important; } .cart-product-small-title { color: #1a1208 !important; width: 75%; font-weight: 600 !important; } .cart-product-small:hover .cart-product-small-title { color: #B8862E !important; } .cart-product-small-quantity { color: #5a4a2a !important; width: 20%; } .cart-product-small-delete .fa-close { color: #aaa !important; font: normal normal normal 16px/1 FontAwesome !important; } .cart-product-small:hover .cart-product-small-delete .fa-close { color: #B8862E !important; } .bar-order-price { padding: 12px 20px; background: #EDE8DE !important; font-family: "Open Sans", sans-serif; border-top: 1px solid rgba(184,134,46,0.2) !important; color: #3a2e1a !important; } .cart-small-order { border-radius: 50px !important; padding: 8px 18px; font-size: 12px; background: #C99A3A !important; color: #ffffff !important; border: none !important; font-weight: 600 !important; text-decoration: none !important; letter-spacing: 1px !important; text-transform: uppercase !important; } .cart-small-order:hover { background: #C99A3A !important; color: #fff !important; } .cart-small-price { font-size: 13px; color: #5a4a2a !important; margin-top: 10px; font-weight: 600 !important; } .cart-small-price SPAN, .cart-small-price span { color: #B8862E !important; font-weight: 700 !important; font-size: 15px !important; } .bar-order-price A, .bar-order-price A:visited { color: #ffffff !important; } #container-table-sumar { background: #181A1F !important; border: 1px solid #2C2F36 !important; box-shadow: 0 10px 28px rgba(0,0,0,0.45); padding: 0 !important; } #table-sumar { border-top: none; background: #181A1F !important; font-size: 13px; width: 100%; color: #F4F0E6 !important; border-collapse: collapse; } #table-sumar tr { background: #181A1F !important; border-bottom: 1px solid #2C2F36 !important; } #table-sumar tr:last-child { border-bottom: none !important; background: #111318 !important; } #table-sumar td { color: #F4F0E6 !important; padding: 15px 25px !important; font-size: 15px; } #table-sumar td:first-child { color: #F4F0E6 !important; } #table-sumar td:last-child { color: #D9AA4A !important; text-align: right; font-weight: 700; } #table-sumar b { color: #D9AA4A !important; } #transport-cost, #total-cost { color: #D9AA4A !important; font-weight: 700 !important; } #table-sumar tr:first-child td:first-child { color: #D9AA4A !important; font-weight: 700; } #container-table-sumar + label, label[for*="termeni"], label[for*="terms"] { color: var(--premium-black) !important; } #container-table-sumar ~ p, #container-table-sumar ~ div, #container-table-sumar ~ label { color: #F4F0E6 !important; } #container-table-sumar ~ label a, #container-table-sumar ~ div a, #container-table-sumar ~ p a { color: #D9AA4A !important; } #container-table-sumar ~ label a:hover, #container-table-sumar ~ div a:hover, #container-table-sumar ~ p a:hover { color: #F1C66B !important; } input[type="submit"], button[type="submit"], #submit-order, #trimite-comanda { background: #D9AA4A !important; color: #070809 !important; font-weight: 700 !important; } input[type="submit"]:hover, button[type="submit"]:hover, #submit-order:hover, #trimite-comanda:hover { background: #F1C66B !important; color: #070809 !important; } #user-name { background:#F0E7DA ; color: #F4F0E6 !important; } #user-name h3 { color: rgb(160, 120, 48) !important; font-size: 22px; margin-bottom: 18px; text-align:center; } #user-name input[type="text"], #user-name input[type="email"], #user-name input[type="tel"], #user-name textarea, #prenume_utilizator, #nume_utilizator, #cnp_utilizator, #observatii_utilizator { background: #FFFFFF !important; color: var(--text-main) !important; border: 1px solid var(--border) !important; padding: 14px 16px !important; box-sizing: border-box !important; box-shadow: none !important; outline: none !important; } #user-name input::placeholder, #user-name textarea::placeholder, #prenume_utilizator::placeholder, #nume_utilizator::placeholder, #cnp_utilizator::placeholder, #observatii_utilizator::placeholder { color: #777 !important; opacity: 1 !important; } #user-name input:focus, #user-name textarea:focus, #prenume_utilizator:focus, #nume_utilizator:focus, #cnp_utilizator:focus, #observatii_utilizator:focus { border-color: #D9AA4A !important; background: #FFFFFF !important; box-shadow: 0 0 0 2px rgba(217, 170, 74, 0.18) !important; } #user-name label, #nume_expl label, #cnp_expl label, #observatii_utilizator_expl label { color: var(--text-muted) ; line-height: 1.45; font-family: 'Inter', sans-serif ; font-size: 11px ; font-weight: 500 ; letter-spacing: 1px ;} #user-first-name-boxes, #user-name-boxes, #user-cnp-boxes, #user-name .clearfix { margin-bottom: 10px; } #observatii_utilizator { width: 96.3% !important; min-height: 120px !important; resize: vertical; } #producer, .producer, #producers, .producers, #producatori, .producatori, .producer-list, .manufacturers-list { background: var(--bone-dark) !important;border-bottom: 2px solid var(--gold) !important; color: #F4F0E6 !important; } .producer-item, .producator-item, .manufacturer-item, .brand-item, #producer li, .producer li, #producatori li, .producatori li { background: linear-gradient(180deg, #1B1D22 0%, #14161A 100%) !important; border: 1px solid #2C2F36 !important; box-shadow: 0 8px 20px rgba(0,0,0,0.35); padding: 24px 18px !important; min-height: 180px; box-sizing: border-box; transition: all 0.22s ease; position: relative; overflow: hidden; } .producer-item:before, .producator-item:before, .manufacturer-item:before, .brand-item:before, #producer li:before, .producer li:before, #producatori li:before, .producatori li:before { content: ""; position: absolute; top: 0; left: 18%; right: 18%; height: 2px; background: linear-gradient(90deg, transparent, #D9AA4A, transparent); opacity: 0; transition: opacity 0.22s ease; } .producer-item:hover, .producator-item:hover, .manufacturer-item:hover, .brand-item:hover, #producer li:hover, .producer li:hover, #producatori li:hover, .producatori li:hover { border-color: #D9AA4A !important; transform: translateY(-3px); box-shadow: 0 14px 30px rgba(0,0,0,0.55); } .producer-item:hover:before, .producator-item:hover:before, .manufacturer-item:hover:before, .brand-item:hover:before, #producer li:hover:before, .producer li:hover:before, #producatori li:hover:before, .producatori li:hover:before { opacity: 1; } .producer-item a, .producator-item a, .manufacturer-item a, .brand-item a, #producer li a, .producer li a, #producatori li a, .producatori li a { color: #F4F0E6 !important; text-align: center; display: flex !important; flex-direction: column; justify-content: center; align-items: center; gap: 18px; height: 100%; text-decoration: none !important; } .producer-item img, .producator-item img, .manufacturer-item img, .brand-item img, #producer li img, .producer li img, #producatori li img, .producatori li img { max-width: 145px !important; max-height: 70px !important; object-fit: contain; filter: drop-shadow(0 6px 10px rgba(0,0,0,0.4)); transition: all 0.22s ease; } .producer-item:hover img, .producator-item:hover img, .manufacturer-item:hover img, .brand-item:hover img, #producer li:hover img, .producer li:hover img, #producatori li:hover img, .producatori li:hover img { transform: scale(1.04); } .producer-item h3, .producator-item h3, .manufacturer-item h3, .brand-item h3, .producer-item span, .producator-item span, .manufacturer-item span, .brand-item span, #producer li a, .producer li a, #producatori li a, .producatori li a { color: #F4F0E6 !important; font-weight: 700 !important; } .producer-item p, .producator-item p, .manufacturer-item p, .brand-item p, #producer li p, .producer li p, #producatori li p, .producatori li p { color: #F4F0E6 !important; font-size: 16px; font-weight: 700; margin: 0; } .producer-item:hover p, .producator-item:hover p, .manufacturer-item:hover p, .brand-item:hover p, #producer li:hover p, .producer li:hover p, #producatori li:hover p, .producatori li:hover p { color: #D9AA4A !important; } .product.equal-height-containers, .product { display: flex !important; flex-direction: column !important; height: 350px !important; min-height: 350px !important; max-height: 350px !important; padding: 14px !important; box-sizing: border-box !important; position: relative !important; } article.equal-height-containers { display: flex !important; flex-direction: column !important; height: 340px !important; min-height: 340px !important; max-height: 340px !important; padding: 14px !important; box-sizing: border-box !important; } .product-image-container { height: 160px !important; min-height: 160px !important; flex-shrink: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; border-radius: 10px !important; background: var(--premium-panel) !important; margin: -2px -2px 0 -2px !important; } .product-image-container img { object-fit: contain !important; max-width: 100% !important; max-height: 160px !important; width: auto !important; height: auto !important; } .product-image-container.poza-detaliu img { max-height: 300px !important; } .product-name { color: var(--text-main) !important; font-weight: 400 !important; line-height: 1.35 !important; font-size: 14px !important; margin: 10px 0 0 !important; overflow: hidden !important; flex-grow: 1 !important; display: -webkit-box !important; -webkit-line-clamp: 3 !important; -webkit-box-orient: vertical !important; } /* Brand label deasupra titlului — auriu mic caps */ .product-brand { font-size: 10px !important; font-weight: 600 !important; letter-spacing: 2px !important; text-transform: uppercase !important; color: var(--premium-gold) !important; margin: 8px 0 0 !important; flex-shrink: 0 !important; } .product-details { font-weight: 600; margin: 0 0 8px !important; min-height: 0px !important; max-height: 58px !important; overflow: hidden !important; line-height: 1.35 !important; } .product-description { font-weight: 400; margin: 0 0 8px !important; min-height: 0px !important; max-height: 70px !important; overflow: hidden !important; line-height: 1.35 !important; } .product-price { font-weight: 600; min-height: 0 !important; margin: 0 !important; line-height: 1.35 !important; } /* Footer row — pret stanga, buton dreapta */ .product-footer-row { display: flex !important; align-items: center !important; justify-content: space-between !important; margin-top: auto !important; padding-top: 8px !important; padding-bottom: 4px !important; width: 100% !important; flex-shrink: 0 !important; gap: 8px !important; } /* Pret cu gradient auriu */ .pret-gradient { font-family: 'Inter', sans-serif !important; font-size: 20px !important; font-weight: 700 !important; background: linear-gradient(135deg, #c9973a 0%, #e8c56a 50%, #b8862e 100%) !important; -webkit-background-clip: text !important; background-clip: text !important; color: transparent !important; -webkit-text-fill-color: transparent !important; display: inline-flex !important; align-items: center !important; line-height: 1 !important; vertical-align: middle !important; } /* Buton DETALII in footer row — pill negru, nu mai e full-width */ .product-footer-row .red-button, .product-footer-row a.red-button { display: inline-block !important; background: #0f0f0f !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; border: none !important; border-radius: 50px !important; font-family: 'Inter', sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; padding: 10px 20px !important; width: auto !important; margin: 0 !important; transition: background 0.2s !important; } .product-footer-row .red-button:hover, .product-footer-row a.red-button:hover { background: #c9973a !important; -webkit-text-fill-color: #ffffff !important; } /* Butonul DETALII standalone (fara footer-row) ramane full-width */ .product .red-button { display: block !important; text-align: center !important; position: static !important; bottom: 0; width: calc(100% + 32px) !important; box-sizing: border-box !important; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; margin-left: -16px !important; margin-right: -16px !important; margin-bottom: 0 !important; padding: 14px 16px !important; } .product .product-footer-row .red-button { display: inline-block !important; width: auto !important; margin-left: 0 !important; margin-right: 0 !important; padding: 10px 20px !important; border-radius: 50px !important; } .product { width: 32%; margin-right: 10px; margin-bottom: 10px; float: left; position: relative; background: var(--premium-card) !important; border: 1px solid var(--premium-card-border) !important; box-sizing: border-box; transition: all 0.2s ease; display: flex !important; flex-direction: column !important; height: 420px !important; min-height: 420px !important; max-height: 420px !important; padding: 16px !important; margin-top: auto !important; } .product-image-container { text-align: center; cursor: pointer; height: 150px !important; justify-content: center !important; display: flex !important; overflow: hidden !important; background: #FFFFFF !important; padding: 1px !important; box-sizing: border-box !important; min-height: 170px !important; max-height: 170px !important; align-items: center !important; } .product-image-container.poza-detaliu { height: 300px !important; min-height: 300px !important; max-height: 300px !important; } #search-widget { background-color: #fff; border: 1.5px solid #C99A3A !important; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; position: absolute; top: 45px; width: 100%; z-index: 99999 !important; background: #FDFAF5 !important; box-shadow: 0 8px 28px rgba(184,134,46,0.15); border-radius: 0 0 12px 12px !important; overflow: hidden !important; } #search-widget .slimScrollDiv, #search-widget #scroll { background: #FDFAF5 !important; overscroll-behavior: contain !important; } #search-widget .product-search { background: #FDFAF5 !important; border-bottom: 1px solid rgba(184,134,46,0.15) !important; color: #2a1f0e !important; cursor: pointer; transition: background 0.18s ease; } #search-widget .product-search:hover { background: #F5EED8 !important; } #search-widget .product-search img { background: #ffffff !important; border-right: 1px solid rgba(184,134,46,0.15) !important; padding: 6px !important; box-sizing: border-box !important; } #search-widget .search-details { background: transparent !important; color: #2a1f0e !important; } #search-widget .search-name { color: #1a1208 !important; font-weight: 700 !important; margin: 0 0 5px !important; } #search-widget .search-info { color: #5a4a2a !important; font-weight: 500 !important; margin: 2px 0 !important; } #search-widget .search-info span, #search-widget .grey-text { color: #B8862E !important; font-weight: 700 !important; } #search-widget .product-search:after { color: rgba(184,134,46,0.4) !important; } #search-widget .product-search:hover:after { color: #C99A3A !important; } #search-widget .slimScrollBar { background: #C99A3A !important; opacity: 0.85 !important; } #search-widget .slimScrollRail { background: #EDE8DE !important; opacity: 1 !important; } @media only screen and (max-width: 600px) { #box-search .fa-search { position: absolute; right: 0px; top: 0px; background-color: var(--gold) !important; color: #080808 !important; font-size: 22px; padding: 13px 12px 12px; background: var(--premium-gold) !important; } } @media only screen and (max-width: 600px) { #box-search INPUT { display: block; width: 100%; } } .slideItem, .slideItem a { position: relative; } /* ===================================================== HERO CAPTION DEMO — text centrat peste carusel ===================================================== */ .slideItem a { display: block !important; position: relative !important; } .hero-caption-demo { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10; text-align: center; width: 90%; max-width: 680px; pointer-events: none; } .hero-caption-demo .hero-buttons { pointer-events: all; } .hero-eyebrow { display: flex; align-items: center; justify-content: center; gap: 12px; font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 500; letter-spacing: 3px; text-transform: uppercase; color: rgba(255,255,255,0.6); -webkit-text-fill-color: rgba(255,255,255,0.6); margin: 0 0 18px; } .hero-line { display: inline-block; width: 32px; height: 1px; background: rgba(255,255,255,0.4); } .hero-title { display: flex; flex-direction: column; align-items: center; margin: 0 0 20px; gap: 0; line-height: 1; } .hero-t1 { font-family: 'Inter', sans-serif; font-size: clamp(48px, 7vw, 90px); font-weight: 300; color: #ffffff; -webkit-text-fill-color: #ffffff; text-shadow: 0 2px 20px rgba(0,0,0,0.4); line-height: 1.05; } .hero-t2 { font-family: 'Inter', sans-serif; font-size: clamp(52px, 7.5vw, 96px); font-weight: 400; color: #c9973a; -webkit-text-fill-color: #c9973a; line-height: 1.05; } .hero-t3 { font-family: 'Inter', sans-serif; font-size: clamp(44px, 6.5vw, 84px); font-weight: 300; color: rgba(255,255,255,0.35); -webkit-text-fill-color: rgba(255,255,255,0.35); line-height: 1.05; } .hero-desc { font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 300; color: rgba(255,255,255,0.75); -webkit-text-fill-color: rgba(255,255,255,0.75); line-height: 1.6; margin: 0 0 32px; } .hero-buttons { display: flex; align-items: center; justify-content: center; gap: 16px; flex-wrap: wrap; } .hero-btn-gold { display: inline-block; font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; background: #c9973a; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; padding: 16px 32px; border-radius: 50px; text-decoration: none !important; transition: background 0.2s; } .hero-btn-gold:hover { background: #b8862e; } .hero-btn-dark { display: inline-block; font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; background: #0f0f0f; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; padding: 16px 32px; border-radius: 50px; text-decoration: none !important; transition: background 0.2s; } .hero-btn-dark:hover { background: #c9973a; } @media (max-width: 640px) { .hero-eyebrow { font-size: 9px; letter-spacing: 2px; } .hero-desc { font-size: 13px; } .hero-btn-gold, .hero-btn-dark { padding: 13px 24px; font-size: 10px; } } .sliderContainer .bx-wrapper .bx-pager { bottom: 35px !important; z-index: 20 !important; } .sliderContainer .bx-wrapper .bx-pager.bx-default-pager a { width: 12px !important; height: 12px !important; margin: 0 7px !important; border-radius: 50% !important; background: #F4F0E6 !important; } .sliderContainer .bx-wrapper .bx-pager.bx-default-pager a.active, .sliderContainer .bx-wrapper .bx-pager.bx-default-pager a:hover { background: #D9AA4A !important; box-shadow: 0 0 12px rgba(217,170,74,0.65); } @media only screen and (max-width: 600px) { .hero-caption h2, .hero-caption h3 { display: none !important; } .hero-caption { left: 50%; top: auto; bottom: 75px; transform: translateX(-50%); } .hero-caption span { font-size: 12px; padding: 10px 18px; } } /* ========================================================= NOUTATI / ARTICOLE BXSLIDER - FIX IMAGINI ========================================================= */ .carouselNoutati .white-box { background: #181A1F !important; border: 1px solid #2C2F36 !important; padding: 14px !important; overflow: hidden !important; } .carouselNoutati .bx-wrapper { background: transparent !important; border: none !important; box-shadow: none !important; margin-bottom: 35px !important; } .carouselNoutati .bx-wrapper .bx-viewport { background: transparent !important; border: none !important; box-shadow: none !important; left: 0 !important; height: auto !important; } /* fiecare slide */ #slider-noutati > div, .carouselNoutati .bx-wrapper .slide, .carouselNoutati .bx-wrapper .bx-viewport > div > div { background: #202226 !important; border: 1px solid #33363D !important; padding: 12px !important; box-sizing: border-box !important; min-height: 260px !important; } /* container imagine */ #slider-noutati .noutate-image-container, .carouselNoutati .noutate-image-container { display: flex !important; width: 100% !important; height: 145px !important; background: #111318 !important; align-items: center !important; justify-content: center !important; overflow: hidden !important; margin-bottom: 14px !important; } /* imaginea propriu-zisă */ #slider-noutati .noutate-image-container img, .carouselNoutati .noutate-image-container img { display: block !important; width: 100% !important; height: 100% !important; max-width: none !important; max-height: none !important; object-fit: cover !important; opacity: 1 !important; visibility: visible !important; } /* titlu */ #slider-noutati .noutate-titlu, .carouselNoutati .noutate-titlu { display: block !important; color: #F4F0E6 !important; font-size: 15px !important; line-height: 1.35 !important; font-weight: 800 !important; text-decoration: none !important; } #slider-noutati .noutate-titlu:hover, .carouselNoutati .noutate-titlu:hover { color: #D9AA4A !important; } /* pager dots */ .carouselNoutati .bx-wrapper .bx-pager.bx-default-pager a { background: #777 !important; } .carouselNoutati .bx-wrapper .bx-pager.bx-default-pager a.active, .carouselNoutati .bx-wrapper .bx-pager.bx-default-pager a:hover { background: #D9AA4A !important; } #lista-articole .black-button { border-radius: 0px; } /* Footer-row buton: pret + detalii pe aceeasi linie */ article.equal-height-containers .product-footer-row { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; margin-top: auto !important; flex-shrink: 0 !important; padding-top: 8px !important; width: 100% !important; gap: 8px !important; } article.equal-height-containers .product-footer-row .pret-gradient { font-size: 18px !important; font-weight: 700 !important; background: linear-gradient(135deg, #c9973a 0%, #e8c56a 50%, #b8862e 100%) !important; -webkit-background-clip: text !important; background-clip: text !important; color: transparent !important; -webkit-text-fill-color: transparent !important; display: inline-block !important; line-height: 1.2 !important; flex-shrink: 0 !important; } article.equal-height-containers .product-footer-row .red-button { display: inline-block !important; background: #0f0f0f !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; border-radius: 50px !important; border: none !important; width: auto !important; margin: 0 !important; padding: 10px 18px !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; white-space: nowrap !important; flex-shrink: 0 !important; line-height: 1.2 !important; } article.equal-height-containers .product-footer-row .red-button:hover { background: #c9973a !important; } .vezi-cos { display: flex !important; margin-top: 10px; align-items: center !important; justify-content: center !important; text-align: center !important; gap: 10px; padding-left: 0 !important; } /* ===================================================== VITABOLIC — BONE WHITE THEME Inspirat din Varianta F (Bone White) Selectoare verificate pe DOM real suplimente-vitabolic.md ===================================================== */ /* -- FONTURI -- */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;900&display=swap'); /* -- VARIABILE -- */ :root { --bone: #f5f0e8; --bone-dark: #ede7d9; --bone-mid: #e0d8c8; --black: #0f0f0f; --black-soft: #1a1a1a; --gold: #c9973a; --gold-light: #e8b96a; --gold-pale: #f5e4c0; --text-main: #1a1a1a; --text-muted: #6b6560; --border: #d8d0c0; } /* -- ANIMATII -- */ @keyframes shimmer-gold { 0% { background-position: -400% center; } 100% { background-position: 400% center; } } @keyframes fade-up { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } } @keyframes border-glow { 0%, 100% { border-color: rgba(201,151,58,0.3); } 50% { border-color: rgba(201,151,58,0.8); } } /* ===================================================== BODY / PAGINA ===================================================== */ body { background-color: var(--bone) !important; color: var(--text-main) !important; font-family: 'Inter', sans-serif !important; } #page { background-color: var(--bone) !important; } #main { background-color: var(--bone) !important; margin-top: 30px; } #main.homePage { margin-top: 0px; } .bar-content { background-color: var(--bone) !important; } /* ===================================================== BARA PROMOTIONALA — deasupra bar-grey-header ===================================================== */ #bar-promotii-strip { background-color: #0f0f0f !important; border-bottom: 1px solid #2a2a2a !important; padding: 0 !important; overflow: hidden !important; white-space: nowrap !important; width: 100% !important; } .bar-promotii-inner { display: inline-flex !important; align-items: center !important; flex-wrap: nowrap !important; gap: 0 !important; padding: 11px 0 !important; width: max-content !important; animation: marquee-scroll 22s linear infinite !important; } .bar-promotii-inner:hover { animation-play-state: paused !important; } @keyframes marquee-scroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } } .bar-promotie { display: inline-flex !important; align-items: center !important; gap: 10px !important; font-family: 'Inter', sans-serif !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: 2.5px !important; text-transform: uppercase !important; color: rgba(255,255,255,0.82) !important; -webkit-text-fill-color: rgba(255,255,255,0.82) !important; padding: 0 64px !important; white-space: nowrap !important; } .bar-promotie .fa { color: #c9973a !important; -webkit-text-fill-color: #c9973a !important; font-size: 14px !important; flex-shrink: 0 !important; } /* Separator diamond intre iteme */ .bar-promotie:nth-child(3)::after, .bar-promotie:last-child::after { display: none !important; } @media (max-width: 1001px) { .bar-promotie { font-size: 10px !important; letter-spacing: 1.5px !important; padding: 0 36px !important; } .bar-promotie::after { margin-left: 36px !important; } .bar-promotii-inner { animation-duration: 20s !important; } article.equal-height-containers .product-footer-row { display: inline-block !important; } #nav-primary { margin-top: 0px; margin-bottom: 0px; } } /* ===================================================== /* ===================================================== HEADER — bar-grey-header (info contact) ===================================================== */ #bar-grey-header { background-color: var(--black) !important; border-bottom: 1px solid rgba(255,255,255,0.06) !important; } #bar-grey-header *, #header-info-contact *, #header-info-contact a { color: #c9973a !important; font-size: 12px !important; font-weight: 600 !important; } #bar-grey-header a:hover { color: var(--gold-light) !important; } /* ===================================================== HEADER — bar-logo-search-menu (principal) ===================================================== */ #bar-logo-search-menu, #site-header { background-color: var(--bone) !important; border-bottom: 1px solid var(--border) !important; box-shadow: 0 2px 20px rgba(0,0,0,0.06) !important; } /* Search input */ #search-input, #box-search input[type="text"], #box-search input[type="search"] { border-right: none !important; border-radius: 6px 0 0 6px !important; color: var(--text-main) !important; font-family: 'Inter', sans-serif !important; font-weight: 300 !important; font-size: 14px !important; transition: border-color 0.2s !important; } #search-input:focus, #box-search input:focus { border-color: var(--gold) !important; outline: none !important; } #search-input::placeholder { color: #b0a898 !important; } /* Search button — mobile fix */ @media (max-width: 778px) { #searchBox, #box-search input[type="search"] { width: 100% !important; max-width: 100% !important; } } /* Search button */ #searchButton, #box-search button, #gotoResultPage { background: var(--gold) !important; border: none !important; border-radius: 0 6px 6px 0 !important; color: #ffffff !important; transition: background 0.2s !important; } #searchButton:hover, #box-search button:hover { background: var(--black) !important; } /* Container search — pozitionare relativa pentru buton absolut */ #box-search { display: flex !important; align-items: center !important; position: relative !important; } #search-input { position: relative !important; display: flex !important; align-items: center !important; } /* Search input */ #searchBox, #box-search input[type="search"] { background: rgba(0, 0, 0, 0.05) !important; border: 1.5px solid #d8d0c0 !important; border-radius: 50px !important; color: #1a1a1a !important; -webkit-text-fill-color: #1a1a1a !important; font-family: 'Inter', sans-serif !important; font-weight: 300 !important; font-size: 14px !important; padding: 10px 48px 10px 20px !important; width: 380px !important; height: 44px !important; transition: border-color 0.2s !important; box-sizing: border-box !important; outline: none !important; } #searchBox:focus, #box-search input:focus { border-color: #c9973a !important; } #searchBox::placeholder, #box-search input[type="search"]::placeholder { color: #b0a898 !important; -webkit-text-fill-color: #b0a898 !important; font-weight: 300 !important; } /* Search button — mic, rotund, integrat in dreapta inputului */ #searchButton { position: absolute !important; right: 4px !important; top: 50% !important; transform: translateY(-50%) !important; width: 36px !important; height: 36px !important; border-radius: 50% !important; background: #0f0f0f !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; font-size: 13px !important; display: flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; border: none !important; transition: background 0.2s !important; padding: 0 !important; } #searchButton:hover { background: #c9973a !important; } /* Nav links */ #nav-primary a, #nav a { color: var(--text-muted) !important; font-weight: 400 !important; font-size: 13px !important; letter-spacing: 1.2px !important; transition: color 0.2s !important; text-decoration: none !important; } #nav-primary a:hover, #nav a:hover { color: var(--gold) !important; } /* Cart / User icons */ #header-cart a, #user-icon a, #container-header-cart a { color: #1a1208 !important; transition: color 0.2s !important; } #header-cart a:hover, #user-icon a:hover { color: var(--gold) !important; } /* ===================================================== SIDEBAR-URI — ascunse pe homepage ===================================================== */ #box-left-sidebar, #box-right-sidebar, #lista-articole, #right-sidebar-tablet { display: none !important; } /* Cand sidebar-urile sunt ascunse, content-ul ocupa toata latimea */ #left-panel { display: none !important; } #right-panel { display: none !important; } #heading-zone { width: 100% !important; float: none !important; } /* ===================================================== HERO / SLIDER ===================================================== */ #bar-slider, .sliderContainer { border-bottom: 3px solid var(--bone-dark) !important; } /* "SUPLIMENTE" — text mare, negru, greutate mica */ .hero-caption H2, .hero-caption h2 { color: var(--black) !important; font-family: 'Inter', sans-serif !important; font-weight: 200 !important; letter-spacing: -1px !important; line-height: 1 !important; text-shadow: none !important; } /* "PENTRU PERFORMANTA" — gradient auriu animat */ .hero-caption H3, .hero-caption h3 { font-family: 'Inter', sans-serif !important; font-weight: 700 !important; background: linear-gradient(90deg, var(--gold) 0%, var(--gold-light) 30%, #fff8ee 50%, var(--gold-light) 70%, var(--gold) 100%) !important; background-size: 400% auto !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; animation: shimmer-gold 4s linear infinite !important; text-shadow: none !important; letter-spacing: -0.5px !important; } /* Buton "VEZI PRODUSELE" */ .hero-caption .red-button, .hero-caption a.red-button { background: var(--black) !important; color: #ffffff !important; border: none !important; font-family: 'Inter', sans-serif !important; font-weight: 500 !important; font-size: 12px !important; letter-spacing: 2px !important; text-transform: uppercase !important; padding: 14px 36px !important; border-radius: 3px !important; transition: background 0.25s, box-shadow 0.25s !important; box-shadow: none !important; } .hero-caption .red-button:hover { background: var(--gold) !important; color: #ffffff !important; box-shadow: 0 6px 24px rgba(201,151,58,0.35) !important; } /* Dots slider */ .sliderContainer .bx-wrapper .bx-pager.bx-default-pager a, #bar-slider .bx-wrapper .bx-pager .bx-pager-item { background-color: var(--border) !important; border-color: var(--border) !important; } .sliderContainer .bx-wrapper .bx-pager.bx-default-pager a:hover, .sliderContainer .bx-wrapper .bx-pager.bx-default-pager a.active { background: var(--gold) !important; border-color: var(--gold) !important; } /* ===================================================== CASETELE DE TITLU SECTIUNE (.trap / .mirror-trap) ===================================================== */ .trap, .mirror-trap { background: var(--bone-dark) !important; color: var(--text-main) !important; font-family: 'Inter', sans-serif !important; font-weight: 500 !important; font-size: 20px !important; letter-spacing: 10px !important; border: none !important; border-bottom: 2px solid var(--gold) !important; padding: 16px 0 14px 0 !important; margin: 0px 0 20px !important; width: 100% !important; /*display: flex !important;*/ color: rgb(160, 120, 48) !important; text-transform: uppercase; align-items: center !important; float: none !important; box-shadow: none !important; border-radius: 0 !important; text-align: center; } .trap::before, .trap::after, .mirror-trap::before, .mirror-trap::after { display: none !important; } .trap *, .mirror-trap * { color: var(--text-main) !important; -webkit-text-fill-color: var(--text-main) !important; font-weight: 600 !important; } .trap I, .trap i, .mirror-trap I, .mirror-trap i { color: var(--gold) !important; -webkit-text-fill-color: var(--gold) !important; margin-right: 10px !important; font-size: 18px !important; } /* Link "Toate produse >" */ .trap a, .mirror-trap a { color: var(--gold) !important; -webkit-text-fill-color: var(--gold) !important; font-size: 13px !important; font-weight: 500 !important; letter-spacing: 0.5px !important; margin-left: auto !important; transition: opacity 0.2s !important; } .trap a:hover, .mirror-trap a:hover { opacity: 0.7 !important; } /* ===================================================== TRANSPORT / LIVRARE (#transportLivrare, #prima-pagina-jos) ===================================================== */ .transportLivrare, #prima-pagina-jos { background: var(--black) !important; border-radius: 8px !important; margin: 24px 0 !important; padding: 0 !important; overflow: hidden !important; animation: border-glow 3s ease infinite !important; border: 1px solid rgba(201,151,58,0.3) !important; } .transportLivrare table, #prima-pagina-jos table, .transportLivrare TABLE, #prima-pagina-jos TABLE { width: 100% !important; border-collapse: collapse !important; } .transportLivrare td, #prima-pagina-jos td, .transportLivrare TD, #prima-pagina-jos TD { color: rgba(255,255,255,0.85) !important; font-family: 'Inter', sans-serif !important; font-weight: 300 !important; font-size: 13px !important; letter-spacing: 0.5px !important; text-align: center !important; padding: 18px 20px !important; border: none !important; border-right: 1px solid rgba(255,255,255,0.06) !important; text-transform: uppercase !important; } .transportLivrare td:last-child, #prima-pagina-jos td:last-child { border-right: none !important; } .transportLivrare i, #prima-pagina-jos i, .transportLivrare I, #prima-pagina-jos I { color: var(--gold) !important; font-size: 20px !important; display: block !important; margin-bottom: 6px !important; } /* ===================================================== CARDURI PRODUSE (.white-box) ===================================================== */ .white-box { background: #ffffff !important; border: 1px solid var(--border) !important; border-radius: 6px !important; box-shadow: 0 1px 4px rgba(0,0,0,0.06) !important; transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease !important; overflow: hidden !important; } .white-box:hover { transform: translateY(-5px) !important; border-color: var(--gold) !important; box-shadow: 0 12px 32px rgba(0,0,0,0.1), 0 0 0 1px rgba(201,151,58,0.15) !important; } .white-box .product-image-container, .white-box > a > img, .white-box > a:first-child { background: #FFFFFF !important; overflow: hidden !important; display: block !important; } .white-box img { transition: transform 0.35s ease !important; } .white-box:hover img { transform: scale(1.05) !important; } /* Numele produsului */ .white-box .product-name a, .white-box .product-name A { color: var(--text-main) !important; font-family: 'Inter', sans-serif !important; font-weight: 400 !important; font-size: 13px !important; line-height: 1.4 !important; transition: color 0.2s !important; -webkit-text-fill-color: var(--text-main) !important; } .white-box:hover .product-name a { color: var(--gold) !important; -webkit-text-fill-color: var(--gold) !important; } /* Pretul */ .white-box .pret-produs, .white-box [class*="pret"], .white-box [class*="price"] { color: var(--gold) !important; font-family: 'Inter', sans-serif !important; font-weight: 600 !important; font-size: 15px !important; /* Pretul -webkit-text-fill-color: var(--gold) !important;*/ } /* Butonul DETALII */ .white-box .red-button, .white-box a.red-button { color: var(--text-main) !important; border: 1.5px solid var(--border) !important; font-family: 'Inter', sans-serif !important; font-weight: 500 !important; font-size: 11px !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; border-radius: 3px !important; padding: 8px 18px !important; transition: background 0.2s, border-color 0.2s, color 0.2s !important; display: inline-block !important; } .white-box .red-button:hover { background: var(--black) !important; border-color: var(--black) !important; color: #ffffff !important; } /* ===================================================== SAGETI CARUSEL (BxSlider) ===================================================== */ .bx-wrapper { position: relative !important; } .bx-controls-direction { position: static !important; } .bx-controls-direction a, a.bx-prev, a.bx-next { position: absolute !important; top: 40% !important; transform: translateY(-50%) !important; z-index: 100 !important; width: 40px !important; height: 40px !important; background: #ffffff !important; border: 1.5px solid var(--border) !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; text-indent: 0 !important; font-size: 16px !important; color: var(--text-main) !important; text-decoration: none !important; box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important; transition: background 0.2s, border-color 0.2s, box-shadow 0.2s !important; } a.bx-prev { left: -4px !important; } a.bx-next { right: -4px !important; } a.bx-prev:hover, a.bx-next:hover { background: var(--black) !important; border-color: var(--black) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(0,0,0,0.2) !important; } /* Sageti OWL carousel */ .owl-nav button, .owl-prev, .owl-next { background: #ffffff !important; border: 1.5px solid var(--border) !important; border-radius: 50% !important; width: 40px !important; height: 40px !important; color: var(--text-main) !important; box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important; transition: all 0.2s !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } .owl-nav button:hover { background: var(--black) !important; border-color: var(--black) !important; color: #ffffff !important; } .owl-dot span { background: var(--border) !important; transition: background 0.2s !important; } .owl-dot.active span, .owl-dot:hover span { background: var(--gold) !important; } /* ===================================================== NEWSLETTER ===================================================== */ #newsletter, [id*="newsletter"] { background: var(--black) !important; border-radius: 8px !important; padding: 40px !important; margin: 32px 0 !important; } [id*="newsletter"] H2, [id*="newsletter"] H3 { color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; font-family: 'Inter', sans-serif !important; font-weight: 200 !important; font-size: 22px !important; letter-spacing: -0.5px !important; margin-bottom: 6px !important; } [id*="newsletter"] P { color: rgba(255,255,255,0.45) !important; font-family: 'Inter', sans-serif !important; font-weight: 300 !important; font-size: 13px !important; margin-bottom: 20px !important; } #email-newsletter, [id*="newsletter"] input[type="email"], [id*="newsletter"] input[type="text"] { background: rgba(255,255,255,0.07) !important; border: 1px solid rgba(255,255,255,0.12) !important; border-radius: 4px !important; color: #ffffff !important; font-family: 'Inter', sans-serif !important; font-weight: 300 !important; padding: 12px 16px !important; width: 100% !important; box-sizing: border-box !important; transition: border-color 0.2s !important; } #email-newsletter:focus, [id*="newsletter"] input:focus { border-color: var(--gold) !important; outline: none !important; } #submit-newsletter, [id*="newsletter"] button, [id*="newsletter"] input[type="submit"] { background: var(--gold) !important; color: #ffffff !important; border: none !important; border-radius: 4px !important; font-family: 'Inter', sans-serif !important; font-weight: 500 !important; font-size: 12px !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; padding: 13px 32px !important; margin-top: 10px !important; width: 100% !important; transition: background 0.2s !important; cursor: pointer !important; } #submit-newsletter:hover { background: var(--black) !important; } /* ===================================================== PARTENERI / LOGOS ===================================================== */ #bar-parteneri, #box-slider-parteneri { background: var(--bone-dark) !important; border-top: 1px solid var(--border) !important; border-bottom: 1px solid var(--border) !important; padding: 20px 0 !important; } #logos img, #bar-parteneri img { filter: grayscale(100%) opacity(0.5) !important; transition: filter 0.3s !important; } #logos img:hover, #bar-parteneri img:hover { filter: grayscale(0%) opacity(1) !important; } /* ===================================================== FOOTER ===================================================== */ #pageFooter, [id*="footer"] { background: var(--black) !important; color: rgba(255,255,255,0.5) !important; border-top: 1px solid rgba(255,255,255,0.06) !important; } #pageFooter a, [id*="footer"] a, #menu-footer a, #nav-footer a { color: rgba(255,255,255,0.45) !important; font-family: 'Inter', sans-serif !important; font-weight: 300 !important; font-size: 13px !important; transition: color 0.2s !important; text-decoration: none !important; } #pageFooter a:hover, [id*="footer"] a:hover { color: var(--gold-light) !important; } #pageFooter h4, #pageFooter .box-title, [id*="footer"] h4 { color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; font-family: 'Inter', sans-serif !important; font-weight: 300 !important; font-size: 11px !important; letter-spacing: 2px !important; text-transform: uppercase !important; border-bottom: 1px solid rgba(255,255,255,0.08) !important; padding-bottom: 12px !important; margin-bottom: 16px !important; } #pageFooter p, [id*="footer"] p { color: rgba(255,255,255,0.35) !important; font-size: 12px !important; font-weight: 300 !important; line-height: 1.7 !important; } /* ===================================================== BUTOANE GENERALE (red-button in rest de site) ===================================================== */ .red-button { background: var(--gold) !important; color: #ffffff !important; border: none !important; font-family: 'Inter', sans-serif !important; font-weight: 500 !important; letter-spacing: 0.5px !important; border-radius: 4px !important; transition: background 0.2s, box-shadow 0.2s !important; } .red-button:hover { background: var(--black) !important; color: #ffffff !important; box-shadow: 0 4px 16px rgba(0,0,0,0.2) !important; } /* ===================================================== SCROLL TO TOP ===================================================== */ #returnTopPage, #scroll { background: var(--black) !important; color: #ffffff !important; border-radius: 0% !important; border: 1.5px solid rgba(255,255,255,0.1) !important; transition: background 0.2s, border-color 0.2s !important; } #returnTopPage:hover { background: var(--gold) !important; border-color: var(--gold) !important; } /* ===================================================== INPUTS GLOBALE ===================================================== */ input[type="text"], input[type="email"], input[type="password"], textarea, select { background: #ffffff !important; border: 1.5px solid var(--border) !important; color: var(--text-main) !important; font-family: 'Inter', sans-serif !important; font-weight: 300 !important; border-radius: 4px !important; transition: border-color 0.2s !important; } input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, textarea:focus { border-color: var(--gold) !important; outline: none !important; box-shadow: 0 0 0 3px rgba(201,151,58,0.1) !important; } ::placeholder { color: #b8b0a0 !important; font-weight: 300 !important; } /* ===================================================== BARA CATEGORII NAV — sub header ===================================================== */ #bar-categorii-nav { background-color: var(--bone) !important; border-bottom: 1px solid var(--border) !important; position: sticky !important; top: 0 !important; z-index: 500 !important; overflow: visible !important; } #nav-categorii { width: 100% !important; overflow: visible !important; position: relative !important; } /* Reset lista .categorii din getMenu() */ #nav-categorii ul.categorii { display: flex !important; flex-direction: row !important; align-items: center !important; flex-wrap: nowrap !important; overflow: visible !important; list-style: none !important; margin: 0 !important; padding: 0 !important; gap: 0 !important; } #nav-categorii ul.categorii::-webkit-scrollbar { display: none !important; } /* Fiecare item */ #nav-categorii ul.categorii > li { display: block !important; flex-shrink: 0 !important; position: relative !important; margin: 0 !important; padding: 0 !important; } /* Link-ul categoriei */ #nav-categorii ul.categorii > li > a { display: block !important; font-family: 'Inter', sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 2px !important; text-transform: uppercase !important; color: var(--text-muted) !important; -webkit-text-fill-color: var(--text-muted) !important; text-decoration: none !important; padding: 14px 20px !important; border-bottom: 2px solid transparent !important; transition: color 0.2s, border-color 0.2s !important; white-space: nowrap !important; } /* Hover */ #nav-categorii ul.categorii > li > a:hover { color: var(--black) !important; -webkit-text-fill-color: var(--black) !important; border-bottom-color: var(--gold) !important; } /* Activ — linie aurie jos, text negru */ #nav-categorii ul.categorii > li > a.active-arrow, #nav-categorii ul.categorii > li > a.active { color: rgb(160, 120, 48) !important; -webkit-text-fill-color: rgb(160, 120, 48) !important; border-bottom-color: rgb(160, 120, 48) !important; font-weight: 600 !important; } /* Ascunde sub-lista producatori (daca apare) */ #nav-categorii ul.lista-subcategorii { display: none !important; position: absolute !important; top: 100% !important; left: 0 !important; background: #ffffff !important; border: 1px solid var(--border) !important; border-radius: 6px !important; box-shadow: 0 8px 24px rgba(0,0,0,0.1) !important; min-width: 180px !important; padding: 8px 0 !important; z-index: 1000 !important; list-style: none !important; margin: 0 !important; } #nav-categorii ul.categorii > li:hover > ul.lista-subcategorii { display: none !important; } #nav-categorii ul.lista-subcategorii li { display: block !important; padding: 0 !important; } #nav-categorii ul.lista-subcategorii li a { display: block !important; font-family: 'Inter', sans-serif !important; font-size: 12px !important; font-weight: 400 !important; color: var(--text-main) !important; -webkit-text-fill-color: var(--text-main) !important; padding: 8px 16px !important; text-decoration: none !important; transition: background 0.15s, color 0.15s !important; white-space: nowrap !important; text-transform: none !important; letter-spacing: 0 !important; } #nav-categorii ul.lista-subcategorii li a:hover, #nav-categorii ul.lista-subcategorii li a.active { background: var(--bone) !important; color: var(--gold) !important; -webkit-text-fill-color: var(--gold) !important; } /* ===================================================== SECTION HEADINGS — stil demo Bone White Label mic uppercase + titlu mare light ===================================================== */ /* Reset complet pe .trap cu noua clasa .section-heading */ .trap.section-heading, .mirror-trap.section-heading { background: transparent !important; border: none !important; border-bottom: none !important; box-shadow: none !important; border-radius: 0 !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; float: none !important; width: auto !important; height: auto !important; line-height: 1 !important; padding: 28px 0 0 0 !important; margin: 0 0 20px 0 !important; min-width: 0 !important; color: var(--black) !important; } .trap.section-heading::before, .trap.section-heading::after, .mirror-trap.section-heading::before, .mirror-trap.section-heading::after { display: none !important; content: none !important; } /* Label mic uppercase — "CELE MAI VANDUTE" */ .section-heading .section-label { display: block !important; font-family: 'Inter', sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 3px !important; text-transform: uppercase !important; color: var(--gold) !important; -webkit-text-fill-color: var(--gold) !important; margin-bottom: 8px !important; line-height: 1 !important; } /* Titlu mare light — "Top Vanzari Suplimente" */ .section-heading .section-title { display: block !important; font-family: 'Inter', sans-serif !important; font-size: 26px !important; font-weight: 300 !important; letter-spacing: 2px !important; color: var(--black) !important; -webkit-text-fill-color: var(--black) !important; line-height: 1.15 !important; text-align: left; } /* #heading-zone — flex: titlu stanga, transport dreapta */ #heading-zone { display: block !important; align-items: flex-end !important; justify-content: space-between !important; width: 100% !important; float: none !important; margin-bottom: 8px !important; clear: both !important; } #heading-zone .trap.section-heading { flex: 1 !important; margin-bottom: 0 !important; } /* Sectiunea parinte care contine heading + carusel — position relative ca owl-nav sa se pozitioneze absolut fata de aceasta sectiune */ #best_selling, #recommended_products, #new_stock, .prima-pagina-sectiune, .sectiune-produse { position: relative !important; } /* .box58 — containerul principal de pe homepage */ .box58 { position: relative !important; } /* .carouselContainer — containerul fiecarui carusel */ .carouselContainer { position: relative !important; width: 100% !important; } /* owl-nav MUTAT in coltul dreapta sus al sectiunii, deasupra caruselului, aliniat cu titlul */ .carouselContainer .owl-nav { position: absolute !important; top: -64px !important; right: 0 !important; display: flex !important; flex-direction: row !important; gap: 8px !important; align-items: center !important; z-index: 20 !important; margin: 0 !important; height: 42px !important; } /* Butoanele prev/next — cerc subtil transparent ca in demo */ .carouselContainer .owl-nav button { position: static !important; width: 42px !important; height: 42px !important; background: transparent !important; border: 1.5px solid rgba(0,0,0,0.2) !important; border-radius: 50% !important; color: var(--black) !important; -webkit-text-fill-color: var(--black) !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 14px !important; box-shadow: none !important; transition: background 0.2s, border-color 0.2s !important; animation: none !important; margin: 0 !important; padding: 0 !important; cursor: pointer !important; line-height: 1 !important; } .carouselContainer .owl-nav button:hover { background: var(--black) !important; border-color: var(--black) !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; } .carouselContainer .owl-nav button span, .carouselContainer .owl-nav button i { color: inherit !important; -webkit-text-fill-color: inherit !important; font-size: 14px !important; } /* Caruselul full width */ .carouselContainer .owl-carousel { width: 100% !important; margin: 0 !important; padding: 0 !important; } .carouselContainer .owl-stage-outer { overflow: hidden !important; } .carouselContainer .owl-item { padding: 0 8px !important; box-sizing: border-box !important; } .carouselContainer .owl-item:first-child { padding-left: 0 !important; } .carouselContainer .owl-item:last-child { padding-right: 0 !important; } /* Dots */ .carouselContainer .owl-dots { margin-top: 16px !important; text-align: center !important; } .carouselContainer .owl-dot span { background: var(--border) !important; width: 8px !important; height: 8px !important; border-radius: 50% !important; display: block !important; transition: background 0.2s, transform 0.2s !important; } .carouselContainer .owl-dot.active span, .carouselContainer .owl-dot:hover span { background: var(--gold) !important; transform: scale(1.3) !important; } /* Banda Transport in dreapta heading-ului */ #heading-zone .mirror-trap.transportLivrare { flex-direction: row !important; display: flex !important; align-items: center !important; float: none !important; width: auto !important; height: auto !important; line-height: 1 !important; background: var(--black) !important; border-radius: 6px !important; padding: 0 !important; margin: 0 0 4px 20px !important; border: none !important; align-self: flex-end !important; } #heading-zone .mirror-trap.transportLivrare table { border-collapse: collapse !important; width: auto !important; } #heading-zone .mirror-trap.transportLivrare td { color: rgba(255,255,255,0.8) !important; -webkit-text-fill-color: rgba(255,255,255,0.8) !important; font-family: 'Inter', sans-serif !important; font-size: 11px !important; font-weight: 400 !important; letter-spacing: 1.5px !important; text-transform: uppercase !important; padding: 12px 18px !important; border: none !important; border-right: 1px solid rgba(255,255,255,0.08) !important; white-space: nowrap !important; line-height: 1.4 !important; } #heading-zone .mirror-trap.transportLivrare td:last-child { border-right: none !important; } #heading-zone .mirror-trap.transportLivrare i, #heading-zone .mirror-trap.transportLivrare I { color: var(--gold) !important; -webkit-text-fill-color: var(--gold) !important; font-size: 13px !important; display: inline !important; margin: 0 !important; } #heading-zone .mirror-trap.transportLivrare a { color: rgba(255,255,255,0.8) !important; -webkit-text-fill-color: rgba(255,255,255,0.8) !important; text-decoration: none !important; } #heading-zone .mirror-trap.transportLivrare a:hover { color: var(--gold-light) !important; -webkit-text-fill-color: var(--gold-light) !important; } /* ===================================================== CARUSEL OWL — carduri fara border exterior pe white-box ===================================================== */ .white-box.clearfix { background: transparent !important; border: none !important; box-shadow: none !important; border-radius: 0 !important; padding: 0 !important; } /* Fiecare card articol in owl carousel */ .carouselVitabolic article.equal-height-containers { background: #ffffff !important; border: 1px solid var(--border) !important; border-radius: 8px !important; padding: 16px !important; overflow: hidden !important; transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease !important; } .carouselVitabolic article.equal-height-containers:hover { transform: translateY(-5px) !important; border-color: var(--gold) !important; box-shadow: 0 12px 32px rgba(0,0,0,0.09) !important; } /* Label "VITABOLIC" deasupra numelui */ .carouselVitabolic article.equal-height-containers::before { content: 'VITABOLIC' !important; display: block !important; font-family: 'Inter', sans-serif !important; font-size: 9px !important; font-weight: 600 !important; letter-spacing: 2px !important; color: var(--gold) !important; -webkit-text-fill-color: var(--gold) !important; margin-bottom: 6px !important; } /* Imaginea produsului */ .carouselVitabolic .product-image-container { background: #FFF !important; border-radius: 6px !important; border: none !important; margin-bottom: 12px !important; overflow: hidden !important; display: flex !important; align-items: center !important; justify-content: center !important; min-height: 155px !important; } .carouselVitabolic .product-image-container img { max-height: 155px !important; object-fit: contain !important; transition: transform 0.3s ease !important; } .carouselVitabolic article:hover .product-image-container img { transform: scale(1.05) !important; } /* Numele produsului */ .carouselVitabolic .product-name { font-family: 'Inter', sans-serif !important; font-size: 13px !important; font-weight: 400 !important; color: var(--black) !important; -webkit-text-fill-color: var(--black) !important; line-height: 1.4 !important; margin-bottom: 6px !important; } /* Pretul */ .carouselVitabolic .pret-nou-small { font-family: 'Inter', sans-serif !important; font-size: 18px !important; font-weight: 600 !important; color: var(--gold) !important; -webkit-text-fill-color: var(--gold) !important; } .carouselVitabolic .product-price { font-family: 'Inter', sans-serif !important; font-size: 12px !important; font-weight: 300 !important; color: var(--text-muted) !important; -webkit-text-fill-color: var(--text-muted) !important; margin-bottom: 2px !important; } /* Butonul DETALII — negru rotund ca in demo */ .carouselVitabolic a.red-button { display: inline-block !important; background: var(--black) !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; border: none !important; border-radius: 50px !important; font-family: 'Inter', sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 1px !important; text-transform: uppercase !important; padding: 9px 22px !important; margin-top: 10px !important; transition: background 0.2s !important; } .carouselVitabolic a.red-button:hover { background: var(--gold) !important; } /* Sagetile OWL — cerc subtil, aliniate cu caruselul */ .carouselVitabolic .owl-nav button.owl-prev, .carouselVitabolic .owl-nav button.owl-next { background: #ffffff !important; border: 1.5px solid var(--border) !important; border-radius: 50% !important; width: 38px !important; height: 38px !important; color: var(--black) !important; -webkit-text-fill-color: var(--black) !important; box-shadow: 0 1px 6px rgba(0,0,0,0.1) !important; transition: background 0.2s, border-color 0.2s !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; animation: none !important; } .carouselVitabolic .owl-nav button:hover { background: var(--black) !important; border-color: var(--black) !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; } /* Dots owl */ .carouselVitabolic .owl-dots { margin-top: 16px !important; } .carouselVitabolic .owl-dot span { background: var(--border) !important; width: 8px !important; height: 8px !important; border-radius: 50% !important; transition: background 0.2s, transform 0.2s !important; display: block !important; } .carouselVitabolic .owl-dot.active span, .carouselVitabolic .owl-dot:hover span { background: var(--gold) !important; transform: scale(1.3) !important; } /* ===================================================== SAGETI CARUSEL IN COLTUL DREAPTA SUS — ca in demo owl-nav scos din fluxul caruselului si mutat langa titlul sectiunii ===================================================== */ /* Containerul sectiunii trebuie sa fie relative ca sa putem pozitiona owl-nav absolut in el */ .carouselVitabolic, .white-box.clearfix { position: relative !important; } /* owl-nav — pozitionat absolut dreapta sus, deasupra caruselului, aliniat cu titlul */ .carouselVitabolic .owl-nav, .white-box.clearfix .owl-nav { position: absolute !important; top: -72px !important; right: 0 !important; display: flex !important; gap: 8px !important; align-items: center !important; z-index: 10 !important; margin: 0 !important; } /* Butonul prev si next — stil cerc subtil ca in demo */ .carouselVitabolic .owl-nav button, .white-box.clearfix .owl-nav button { position: static !important; width: 42px !important; height: 42px !important; background: transparent !important; border: 1.5px solid rgba(0,0,0,0.2) !important; border-radius: 50% !important; color: var(--black) !important; -webkit-text-fill-color: var(--black) !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 15px !important; box-shadow: none !important; transition: background 0.2s, border-color 0.2s, color 0.2s !important; animation: none !important; margin: 0 !important; padding: 0 !important; cursor: pointer !important; } .carouselVitabolic .owl-nav button:hover, .white-box.clearfix .owl-nav button:hover { background: var(--black) !important; border-color: var(--black) !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; } /* Caruselul — full width, fara margini laterale */ .carouselVitabolic .owl-carousel, .white-box.clearfix .owl-carousel, .owl-carousel.carouselVitabolic { width: 100% !important; margin: 0 !important; padding: 0 !important; } /* Fiecare item in carousel — padding mic intre carduri */ .carouselVitabolic .owl-item, .white-box.clearfix .owl-item { padding: 0 8px !important; } /* Primul si ultimul item fara padding exterior */ .carouselVitabolic .owl-item:first-child, .white-box.clearfix .owl-item:first-child { padding-left: 0 !important; } .carouselVitabolic .owl-item:last-child, .white-box.clearfix .owl-item:last-child { padding-right: 0 !important; } /* Wrapper-ul owl fara margini laterale negative */ .carouselVitabolic .owl-stage-outer, .white-box.clearfix .owl-stage-outer { overflow: hidden !important; border-radius: 0 !important; } /* ===================================================== FIX fundal bara categorii (suprascrie stiluri vechi) ===================================================== */ #bar-categorii-nav, div#bar-categorii-nav { background: var(--bone) !important; background-color: var(--bone) !important; border-bottom: 1px solid var(--border) !important; border-top: none !important; } /* ===================================================== "MAI MULTE" — overflow dropdown ===================================================== */ #nav-cat-more { display: none; position: relative !important; flex-shrink: 0 !important; } /* Butonul "Mai multe" */ #nav-cat-more-btn { display: block !important; font-family: 'Inter', sans-serif !important; font-size: 11px !important; font-weight: 500 !important; letter-spacing: 2px !important; text-transform: uppercase !important; color: var(--text-muted) !important; -webkit-text-fill-color: var(--text-muted) !important; text-decoration: none !important; padding: 14px 20px !important; border-bottom: 2px solid transparent !important; transition: color 0.2s, border-color 0.2s !important; white-space: nowrap !important; cursor: pointer !important; } #nav-cat-more-btn:hover { color: var(--black) !important; -webkit-text-fill-color: var(--black) !important; border-bottom-color: var(--gold) !important; } #nav-cat-more-btn i { font-size: 10px !important; margin-left: 3px !important; color: inherit !important; -webkit-text-fill-color: inherit !important; } /* Dropdown */ #nav-cat-dropdown { display: none !important; position: absolute !important; top: 100% !important; right: 0 !important; background: #ffffff !important; border: 1px solid var(--border) !important; border-radius: 6px !important; box-shadow: 0 8px 24px rgba(0,0,0,0.1) !important; min-width: 200px !important; padding: 8px 0 !important; z-index: 1000 !important; list-style: none !important; margin: 0 !important; } #nav-cat-dropdown.open { display: block !important; } #nav-cat-dropdown li { display: block !important; padding: 0 !important; margin: 0 !important; } #nav-cat-dropdown li a { display: block !important; font-family: 'Inter', sans-serif !important; font-size: 12px !important; font-weight: 400 !important; letter-spacing: 0.5px !important; text-transform: uppercase !important; color: var(--text-main) !important; -webkit-text-fill-color: var(--text-main) !important; padding: 10px 20px !important; text-decoration: none !important; border-bottom: none !important; transition: background 0.15s, color 0.15s !important; white-space: nowrap !important; } #nav-cat-dropdown li a:hover, #nav-cat-dropdown li a.active-arrow, #nav-cat-dropdown li a.active { background: var(--bone) !important; color: var(--gold) !important; -webkit-text-fill-color: var(--gold) !important; } /* FIX final card produs pe mobile */ @media only screen and (max-width: 700px) { .catalog-category-page article.product { padding: 10px !important; overflow: hidden !important; } .catalog-category-page article.product .product-footer-row { display: grid !important; grid-template-columns: minmax(0, 1fr) 56px !important; align-items: center !important; column-gap: 4px !important; width: 100% !important; max-width: 100% !important; overflow: hidden !important; } .catalog-category-page article.product .pret-gradient { display: block !important; min-width: 0 !important; max-width: 100% !important; font-size: 14px !important; line-height: 1 !important; white-space: nowrap !important; overflow: hidden !important; } .catalog-category-page article.product .product-footer-row a.red-button, .catalog-category-page article.product a.red-button.red-button { all: unset !important; display: flex !important; width: 56px !important; height: 28px !important; min-width: 56px !important; max-width: 56px !important; box-sizing: border-box !important; align-items: center !important; justify-content: center !important; background: #050505 !important; color: #fff !important; border-radius: 999px !important; font-family: Arial, sans-serif !important; font-size: 8px !important; font-weight: 700 !important; line-height: 1 !important; letter-spacing: .08em !important; text-transform: uppercase !important; cursor: pointer !important; white-space: nowrap !important; overflow: hidden !important; } } @media only screen and (max-width: 700px) { .catalog-category-page article.product .product-footer-row { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 8px !important; } .catalog-category-page article.product .product-footer-row a.red-button, .catalog-category-page article.product a.red-button.red-button { all: unset !important; display: flex !important; width: 100% !important; height: 32px !important; align-items: center !important; justify-content: center !important; background: #050505 !important; color: #fff !important; border-radius: 999px !important; font-size: 9px !important; font-weight: 700 !important; letter-spacing: .12em !important; text-transform: uppercase !important; } } /* ===================================================== VITABOLIC FOOTER V2 - multilingual safe ===================================================== */ #pageFooter.vitabolic-footer, #pageFooter.vitabolic-footer * { box-sizing: border-box !important; } #pageFooter.vitabolic-footer { position: relative !important; width: 100% !important; padding: 0 !important; margin: 0 !important; overflow: hidden !important; background: radial-gradient(circle at 16% 24%, rgba(217,170,74,.075), transparent 30%), radial-gradient(circle at 82% 22%, rgba(217,170,74,.07), transparent 30%), linear-gradient(180deg, #101010 0%, #070707 100%) !important; border-top: 1px solid rgba(255,255,255,.06) !important; color: rgba(255,255,255,.72) !important; } #pageFooter.vitabolic-footer a { color: inherit !important; text-decoration: none !important; } #pageFooter.vitabolic-footer .upPage { z-index: 20 !important; } #pageFooter.vitabolic-footer .vitabolic-footer-main { padding: 78px 0 66px !important; } #pageFooter.vitabolic-footer .vitabolic-footer-inner { width: calc(100% - 96px) !important; max-width: 1400px !important; margin: 0 auto !important; display: grid !important; grid-template-columns: minmax(260px, 1.05fr) minmax(260px, .95fr) minmax(260px, .95fr) minmax(360px, 1.18fr) !important; gap: 64px !important; align-items: flex-start !important; } #pageFooter.vitabolic-footer .vitabolic-footer-col { min-width: 0 !important; } #pageFooter.vitabolic-footer h4, #pageFooter.vitabolic-footer .vitabolic-footer-col h4 { margin: 0 0 24px !important; padding: 0 0 16px !important; border-bottom: 1px solid rgba(255,255,255,.08) !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font-family: "Open Sans", Arial, sans-serif !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1.2 !important; letter-spacing: .22em !important; text-transform: uppercase !important; } #pageFooter.vitabolic-footer .vitabolic-footer-logo { display: inline-flex !important; align-items: center !important; margin: 0 0 24px !important; } #pageFooter.vitabolic-footer .vitabolic-footer-logo img { display: block !important; width: auto !important; max-width: 190px !important; max-height: 92px !important; object-fit: contain !important; } #pageFooter.vitabolic-footer .vitabolic-footer-slogan { max-width: 310px !important; margin: 0 0 26px !important; padding: 0 !important; color: rgba(255,255,255,.48) !important; -webkit-text-fill-color: rgba(255,255,255,.48) !important; font-size: 15px !important; font-weight: 300 !important; line-height: 1.65 !important; } #pageFooter.vitabolic-footer .vitabolic-footer-line { display: block !important; width: 68px !important; height: 2px !important; margin: 0 0 30px !important; background: linear-gradient(90deg, #d9aa4a, transparent) !important; } #pageFooter.vitabolic-footer .vitabolic-footer-contact { display: grid !important; gap: 18px !important; } #pageFooter.vitabolic-footer .vitabolic-footer-contact a, #pageFooter.vitabolic-footer .vitabolic-footer-contact > span { display: grid !important; grid-template-columns: 28px minmax(0, 1fr) !important; gap: 14px !important; align-items: center !important; min-width: 0 !important; color: rgba(255,255,255,.82) !important; -webkit-text-fill-color: rgba(255,255,255,.82) !important; font-size: 16px !important; font-weight: 400 !important; line-height: 1.35 !important; word-break: normal !important; overflow-wrap: break-word !important; } #pageFooter.vitabolic-footer .vitabolic-footer-contact i { width: 28px !important; color: #d9aa4a !important; -webkit-text-fill-color: #d9aa4a !important; font-size: 20px !important; text-align: center !important; } #pageFooter.vitabolic-footer .vitabolic-footer-contact a:hover span { color: #fff !important; -webkit-text-fill-color: #fff !important; } #pageFooter.vitabolic-footer .vitabolic-footer-social { list-style: none !important; display: flex !important; flex-wrap: wrap !important; gap: 12px !important; align-items: center !important; margin: 0 0 34px !important; padding: 0 !important; } #pageFooter.vitabolic-footer .vitabolic-footer-social li { list-style: none !important; margin: 0 !important; padding: 0 !important; } #pageFooter.vitabolic-footer .vitabolic-footer-social a { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 40px !important; height: 40px !important; border-radius: 50% !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font-size: 19px !important; transition: transform .2s ease, filter .2s ease !important; } #pageFooter.vitabolic-footer .vitabolic-footer-social a:hover { transform: translateY(-3px) !important; filter: brightness(1.08) !important; } #pageFooter.vitabolic-footer .vitabolic-footer-links { list-style: none !important; display: grid !important; gap: 14px !important; margin: 0 !important; padding: 0 !important; } #pageFooter.vitabolic-footer .vitabolic-footer-links li { list-style: none !important; margin: 0 !important; padding: 0 !important; } #pageFooter.vitabolic-footer .vitabolic-footer-links a { display: inline-flex !important; align-items: center !important; color: rgba(255,255,255,.64) !important; -webkit-text-fill-color: rgba(255,255,255,.64) !important; font-size: 16px !important; font-weight: 300 !important; line-height: 1.35 !important; transition: color .2s ease, transform .2s ease !important; } #pageFooter.vitabolic-footer .vitabolic-footer-links a:hover { color: #fff !important; -webkit-text-fill-color: #fff !important; } #pageFooter.vitabolic-footer .vitabolic-footer-links-arrow a { gap: 14px !important; } #pageFooter.vitabolic-footer .vitabolic-footer-links-arrow a::before { content: "\f105" !important; font-family: FontAwesome !important; color: #d9aa4a !important; -webkit-text-fill-color: #d9aa4a !important; font-size: 19px !important; line-height: 1 !important; } #pageFooter.vitabolic-footer .vitabolic-footer-links-arrow a:hover { transform: translateX(3px) !important; } /* Newsletter */ #pageFooter.vitabolic-footer #newsletter.footer-newsletter-compact { display: block !important; width: 100% !important; max-width: 410px !important; margin: 0 !important; padding: 28px 30px 26px !important; background: radial-gradient(circle at 18% 0%, rgba(217,170,74,.18), transparent 34%), linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.015)) !important; border: 1px solid rgba(217,170,74,.38) !important; border-radius: 16px !important; box-shadow: 0 24px 60px rgba(0,0,0,.36) !important; } #pageFooter.vitabolic-footer #newsletter .footer-newsletter-head { display: grid !important; grid-template-columns: 58px minmax(0, 1fr) !important; gap: 18px !important; align-items: center !important; margin-bottom: 24px !important; } #pageFooter.vitabolic-footer #newsletter .footer-newsletter-icon { display: flex !important; align-items: center !important; justify-content: center !important; width: 58px !important; height: 58px !important; border-radius: 12px !important; background: rgba(217,170,74,.10) !important; border: 1px solid rgba(217,170,74,.28) !important; color: #d9aa4a !important; -webkit-text-fill-color: #d9aa4a !important; font-size: 30px !important; } #pageFooter.vitabolic-footer #newsletter .title { margin: 0 0 7px !important; padding: 0 !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font-family: "Open Sans", Arial, sans-serif !important; font-size: 22px !important; font-weight: 700 !important; line-height: 1.15 !important; letter-spacing: .08em !important; text-transform: uppercase !important; } #pageFooter.vitabolic-footer #newsletter #italic-explanation { margin: 0 !important; padding: 0 !important; color: rgba(255,255,255,.66) !important; -webkit-text-fill-color: rgba(255,255,255,.66) !important; font-size: 15px !important; font-style: normal !important; font-weight: 300 !important; line-height: 1.5 !important; } #pageFooter.vitabolic-footer #newsletter .footer-newsletter-form { display: grid !important; gap: 12px !important; } #pageFooter.vitabolic-footer #newsletter #email-newsletter { display: block !important; width: 100% !important; height: 52px !important; margin: 0 !important; padding: 0 18px !important; border: 1px solid rgba(217,170,74,.32) !important; border-radius: 7px !important; background: #f8f0e4 !important; color: #111 !important; -webkit-text-fill-color: #111 !important; font-size: 15px !important; font-weight: 400 !important; outline: none !important; } #pageFooter.vitabolic-footer #newsletter #submit-newsletter { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 52px !important; margin: 0 !important; padding: 0 18px !important; border: 0 !important; border-radius: 7px !important; background: linear-gradient(180deg, #e7bc59 0%, #d39a21 100%) !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: .16em !important; text-transform: uppercase !important; cursor: pointer !important; box-shadow: 0 12px 24px rgba(217,170,74,.17) !important; } #pageFooter.vitabolic-footer #newsletter .footer-newsletter-benefits { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 8px !important; margin-top: 22px !important; padding-top: 18px !important; border-top: 1px solid rgba(217,170,74,.18) !important; } #pageFooter.vitabolic-footer #newsletter .footer-newsletter-benefits span { display: flex !important; flex-direction: column !important; align-items: center !important; gap: 7px !important; color: rgba(255,255,255,.78) !important; -webkit-text-fill-color: rgba(255,255,255,.78) !important; font-size: 11px !important; font-weight: 500 !important; line-height: 1.25 !important; text-align: center !important; } #pageFooter.vitabolic-footer #newsletter .footer-newsletter-benefits i { color: #d9aa4a !important; -webkit-text-fill-color: #d9aa4a !important; font-size: 19px !important; } /* Trust strip */ #pageFooter.vitabolic-footer .vitabolic-footer-trust { border-top: 1px solid rgba(217,170,74,.34) !important; border-bottom: 1px solid rgba(217,170,74,.22) !important; background: rgba(0,0,0,.16) !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner { width: calc(100% - 96px) !important; max-width: 1400px !important; min-height: 110px !important; margin: 0 auto !important; display: grid !important; grid-template-columns: repeat(4, 1fr) !important; align-items: center !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner > div { display: grid !important; grid-template-columns: 54px minmax(0, 1fr) !important; gap: 18px !important; align-items: center !important; padding: 0 32px !important; border-right: 1px solid rgba(217,170,74,.28) !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner > div:first-child { padding-left: 0 !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner > div:last-child { padding-right: 0 !important; border-right: 0 !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust i { color: #d9aa4a !important; -webkit-text-fill-color: #d9aa4a !important; font-size: 38px !important; text-align: center !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust strong { display: block !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font-size: 15px !important; font-weight: 700 !important; letter-spacing: .03em !important; text-transform: uppercase !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust small { display: block !important; margin-top: 5px !important; color: rgba(255,255,255,.58) !important; -webkit-text-fill-color: rgba(255,255,255,.58) !important; font-size: 14px !important; font-weight: 300 !important; } /* Bottom */ #pageFooter.vitabolic-footer .vitabolic-footer-bottom { padding: 34px 0 40px !important; } #pageFooter.vitabolic-footer .vitabolic-footer-bottom-inner { width: calc(100% - 96px) !important; max-width: 1400px !important; margin: 0 auto !important; display: grid !important; grid-template-columns: 1fr auto !important; gap: 30px !important; align-items: center !important; } #pageFooter.vitabolic-footer .vitabolic-footer-bottom p { margin: 0 !important; color: rgba(255,255,255,.42) !important; -webkit-text-fill-color: rgba(255,255,255,.42) !important; font-size: 14px !important; font-weight: 300 !important; } #pageFooter.vitabolic-footer .vitabolic-footer-bottom p span { color: #d9aa4a !important; -webkit-text-fill-color: #d9aa4a !important; } #pageFooter.vitabolic-footer .vitabolic-footer-payments { display: flex !important; align-items: center !important; flex-wrap: wrap !important; gap: 18px !important; color: rgba(255,255,255,.46) !important; -webkit-text-fill-color: rgba(255,255,255,.46) !important; font-size: 14px !important; } #pageFooter.vitabolic-footer .vitabolic-footer-payments strong { color: #fff !important; -webkit-text-fill-color: #fff !important; font-size: 17px !important; font-weight: 700 !important; } /* Responsive */ @media only screen and (max-width: 1385px) { #pageFooter.vitabolic-footer .vitabolic-footer-inner { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 52px !important; } #pageFooter.vitabolic-footer #newsletter.footer-newsletter-compact { max-width: 100% !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner { grid-template-columns: repeat(2, 1fr) !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner > div { padding: 24px 30px !important; border-bottom: 1px solid rgba(217,170,74,.18) !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner > div:nth-child(2) { border-right: 0 !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner > div:nth-child(3), #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner > div:nth-child(4) { border-bottom: 0 !important; } } @media only screen and (max-width: 760px) { #pageFooter.vitabolic-footer .vitabolic-footer-main { padding: 52px 0 46px !important; } #pageFooter.vitabolic-footer .vitabolic-footer-inner, #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner, #pageFooter.vitabolic-footer .vitabolic-footer-bottom-inner { width: calc(100% - 32px) !important; } #pageFooter.vitabolic-footer .vitabolic-footer-inner { grid-template-columns: 1fr !important; gap: 40px !important; } #pageFooter.vitabolic-footer .vitabolic-footer-brand, #pageFooter.vitabolic-footer .vitabolic-footer-social-col { text-align: center !important; } #pageFooter.vitabolic-footer .vitabolic-footer-logo { justify-content: center !important; width: 100% !important; } #pageFooter.vitabolic-footer .vitabolic-footer-slogan { margin-left: auto !important; margin-right: auto !important; } #pageFooter.vitabolic-footer .vitabolic-footer-line { margin-left: auto !important; margin-right: auto !important; } #pageFooter.vitabolic-footer .vitabolic-footer-contact { max-width: 310px !important; margin: 0 auto !important; text-align: left !important; } #pageFooter.vitabolic-footer .vitabolic-footer-social { justify-content: center !important; } #pageFooter.vitabolic-footer h4 { text-align: center !important; } #pageFooter.vitabolic-footer .vitabolic-footer-links { text-align: center !important; } #pageFooter.vitabolic-footer .vitabolic-footer-links a { justify-content: center !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner { grid-template-columns: 1fr !important; min-height: 0 !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner > div, #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner > div:first-child, #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner > div:last-child { padding: 22px 0 !important; border-right: 0 !important; border-bottom: 1px solid rgba(217,170,74,.18) !important; } #pageFooter.vitabolic-footer .vitabolic-footer-trust-inner > div:last-child { border-bottom: 0 !important; } #pageFooter.vitabolic-footer .vitabolic-footer-bottom-inner { grid-template-columns: 1fr !important; text-align: center !important; } #pageFooter.vitabolic-footer .vitabolic-footer-payments { justify-content: center !important; } } @media only screen and (max-width: 520px) { #pageFooter.vitabolic-footer #newsletter.footer-newsletter-compact { padding: 24px 20px 22px !important; } #pageFooter.vitabolic-footer #newsletter .footer-newsletter-head { grid-template-columns: 44px minmax(0, 1fr) !important; gap: 14px !important; } #pageFooter.vitabolic-footer #newsletter .footer-newsletter-icon { width: 44px !important; height: 44px !important; font-size: 22px !important; } #pageFooter.vitabolic-footer #newsletter .title { font-size: 18px !important; } #pageFooter.vitabolic-footer #newsletter #italic-explanation { font-size: 13px !important; } #pageFooter.vitabolic-footer #newsletter .footer-newsletter-benefits { grid-template-columns: 1fr !important; gap: 10px !important; } #pageFooter.vitabolic-footer #newsletter .footer-newsletter-benefits span { flex-direction: row !important; justify-content: flex-start !important; text-align: left !important; } } /* ===================================================== VITABOLIC HEADER - CLEAN VERSION LIKE RENDER ===================================================== */ /* Ascundem bara neagră secundară veche */ #bar-grey-header { display: none !important; } /* Bara promo de sus */ #bar-promotii-strip { height: 50px !important; background: #0b0b0b !important; border-bottom: 1px solid rgba(255,255,255,.14) !important; overflow: hidden !important; } #bar-promotii-strip .bar-promotii-inner { width: min(1400px, calc(100% - 80px)) !important; height: 50px !important; margin: 0 auto !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 40px !important; white-space: nowrap !important; } #bar-promotii-strip .bar-promotie { color: #fff !important; -webkit-text-fill-color: #fff !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: .18em !important; text-transform: uppercase !important; } #bar-promotii-strip .bar-promotie i { color: #d39a21 !important; -webkit-text-fill-color: #d39a21 !important; margin-right: 10px !important; } /* Header principal */ #bar-logo-search-menu.header-main-modern { background: #f7f0e6 !important; border-bottom: 1px solid #dfd2bf !important; } #bar-logo-search-menu.header-main-modern .header-main-modern-inner { width: min(1400px, calc(100% - 80px)) !important; min-height: 138px !important; margin: 0 auto !important; padding: 0 !important; display: grid !important; grid-template-columns: 230px minmax(420px, 560px) auto !important; grid-template-areas: "logo search actions" !important; align-items: center !important; column-gap: 70px !important; } /* În renderul dorit nu avem meniul Producători/Auth/Contact în rândul principal */ #bar-logo-search-menu.header-main-modern #nav-primary { display: none !important; } /* Logo */ #bar-logo-search-menu.header-main-modern #logo { grid-area: logo !important; float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; } #bar-logo-search-menu.header-main-modern #logo a { display: inline-flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-decoration: none !important; } #bar-logo-search-menu.header-main-modern #logo img { display: block !important; max-width: 178px !important; width: auto !important; height: auto !important; margin: 0 !important; } #bar-logo-search-menu.header-main-modern #logo p { margin: -4px 0 0 !important; color: #4d4138 !important; -webkit-text-fill-color: #4d4138 !important; font-size: 9px !important; letter-spacing: .55em !important; line-height: 1 !important; } /* Search */ #bar-logo-search-menu.header-main-modern #box-search { grid-area: search !important; float: none !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; } #bar-logo-search-menu.header-main-modern #search-input { position: relative !important; width: 100% !important; height: 58px !important; margin: 0 !important; padding: 0 !important; } @media only screen and (min-width: 1190px){ #bar-logo-search-menu.header-main-modern #search-input { width: 98% !important; } } #bar-logo-search-menu.header-main-modern #searchBox { display: block !important; width: 100% !important; height: 58px !important; margin: 0 !important; padding: 0 76px 0 28px !important; border: 1px solid #d8cab7 !important; border-radius: 999px !important; background: #eee7dc !important; color: #4b4036 !important; -webkit-text-fill-color: #4b4036 !important; font-size: 15px !important; font-weight: 400 !important; outline: none !important; } #bar-logo-search-menu.header-main-modern #searchBox::placeholder { color: rgba(75,64,54,.5) !important; -webkit-text-fill-color: rgba(75,64,54,.5) !important; } #bar-logo-search-menu.header-main-modern #searchButton { position: absolute !important; top: 6px !important; right: 6px !important; width: 46px !important; height: 46px !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; background: #d39a21 !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font-size: 19px !important; cursor: pointer !important; } /* Acțiuni dreapta */ #bar-logo-search-menu.header-main-modern .header-actions-modern { grid-area: actions !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; width: auto !important; min-width: 0 !important; gap: 0 !important; } /* Cont */ #bar-logo-search-menu.header-main-modern .header-account-modern { height: 58px !important; display: flex !important; align-items: center !important; gap: 12px !important; padding: 0 30px !important; border-left: 0px solid #dccdbb !important; color: #111 !important; -webkit-text-fill-color: #111 !important; text-decoration: none !important; } #bar-logo-search-menu.header-main-modern .header-account-modern i { font-size: 25px !important; color: #111 !important; -webkit-text-fill-color: #111 !important; } #bar-logo-search-menu.header-main-modern .header-account-modern span { display: block !important; color: #2a221d !important; -webkit-text-fill-color: #2a221d !important; font-size: 15px !important; font-weight: 400 !important; white-space: nowrap !important; } /* Coș */ #bar-logo-search-menu.header-main-modern .header-cart-modern-wrap { position: relative !important; float: none !important; margin: 0 !important; padding: 0 !important; } #bar-logo-search-menu.header-main-modern .header-cart-modern { height: 58px !important; display: flex !important; align-items: center !important; gap: 14px !important; padding: 0 30px !important; border-left: 1px solid #dccdbb !important; cursor: pointer !important; } #bar-logo-search-menu.header-main-modern .header-cart-modern i { font-size: 29px !important; color: #111 !important; -webkit-text-fill-color: #111 !important; } #bar-logo-search-menu.header-main-modern .header-cart-modern-text { display: grid !important; gap: 3px !important; min-width: 128px !important; } #bar-logo-search-menu.header-main-modern .header-cart-modern-text strong { display: block !important; color: #4a3a2d !important; -webkit-text-fill-color: #4a3a2d !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.1 !important; } #bar-logo-search-menu.header-main-modern .header-cart-modern-text small { display: block !important; color: #111 !important; -webkit-text-fill-color: #111 !important; font-size: 14px !important; font-weight: 500 !important; line-height: 1.15 !important; white-space: nowrap !important; } /* Limbă */ #bar-logo-search-menu.header-main-modern .header-language-modern { height: 58px !important; width: 82px !important; display: flex !important; align-items: center !important; justify-content: center !important; border-left: 1px solid #dccdbb !important; border-right: 0px solid #dccdbb !important; } #bar-logo-search-menu.header-main-modern #languageMenu, #bar-logo-search-menu.header-main-modern #languageMenu li { margin: 0 !important; padding: 0 !important; list-style: none !important; } #bar-logo-search-menu.header-main-modern #languageMenu img { display: block !important; width: 32px !important; height: auto !important; } /* Dropdown coș */ #bar-logo-search-menu.header-main-modern #container-cart-products-small { top: 62px !important; right: 0 !important; left: auto !important; z-index: 300 !important; } /* ===================================================== CATEGORII - păstrăm dropdown-ul funcțional ===================================================== */ #bar-categorii-nav { height: 62px !important; background: #f7f0e6 !important; border-bottom: 1px solid #dfd2bf !important; overflow: visible !important; } #bar-categorii-nav .wrapper { width: min(1400px, calc(100% - 80px)) !important; height: 62px !important; margin: 0 auto !important; overflow: visible !important; } #bar-categorii-nav #nav-categorii { height: 62px !important; overflow: visible !important; } /* ATENȚIE: stilizăm doar primul nivel */ #bar-categorii-nav #nav-categorii > ul { height: 62px !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 46px !important; list-style: none !important; overflow: visible !important; } #bar-categorii-nav #nav-categorii > ul > li { position: relative !important; float: none !important; display: flex !important; align-items: center !important; height: 62px !important; margin: 0 !important; padding: 0 !important; flex: 0 0 auto !important; } #bar-categorii-nav #nav-categorii > ul > li > a { display: flex !important; align-items: center !important; height: 62px !important; padding: 0 !important; color: #18130f !important; -webkit-text-fill-color: #18130f !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1 !important; letter-spacing: .13em !important; text-transform: uppercase !important; white-space: nowrap !important; } #bar-categorii-nav #nav-categorii > ul > li > a:hover, #bar-categorii-nav #nav-categorii > ul > li > a.active { color: #c89022 !important; -webkit-text-fill-color: #c89022 !important; } /* Dropdown-uri: le lăsăm absolute, nu flex */ #bar-categorii-nav #nav-categorii > ul > li ul { position: absolute !important; top: 62px !important; left: 0 !important; z-index: 500 !important; min-width: 230px !important; margin: 0 !important; padding: 10px 0 !important; display: none !important; background: #fffaf2 !important; border: 1px solid #dfd2bf !important; border-radius: 0 0 12px 12px !important; box-shadow: 0 18px 36px rgba(0,0,0,.12) !important; } #bar-categorii-nav #nav-categorii > ul > li:hover > ul { display: block !important; } #bar-categorii-nav #nav-categorii > ul > li ul li { display: block !important; float: none !important; height: auto !important; margin: 0 !important; padding: 0 !important; } #bar-categorii-nav #nav-categorii > ul > li ul li a { display: block !important; height: auto !important; padding: 11px 18px !important; color: #34281f !important; -webkit-text-fill-color: #34281f !important; font-size: 13px !important; font-weight: 500 !important; letter-spacing: .08em !important; line-height: 1.3 !important; text-transform: uppercase !important; white-space: nowrap !important; } #bar-categorii-nav #nav-categorii > ul > li ul li a:hover { background: rgba(211,154,33,.09) !important; color: #c89022 !important; -webkit-text-fill-color: #c89022 !important; } /* ===================================================== RESPONSIVE ===================================================== */ @media only screen and (max-width: 1320px) { #bar-logo-search-menu.header-main-modern .header-main-modern-inner { width: min(1280px, calc(100% - 54px)) !important; grid-template-columns: 190px minmax(340px, 500px) auto !important; column-gap: 46px !important; } #bar-logo-search-menu.header-main-modern .header-account-modern { padding: 0 22px !important; } #bar-logo-search-menu.header-main-modern .header-cart-modern { padding: 0 22px !important; } #bar-categorii-nav .wrapper { width: min(1280px, calc(100% - 54px)) !important; } #bar-categorii-nav #nav-categorii > ul { gap: 34px !important; } #bar-categorii-nav #nav-categorii > ul > li > a { font-size: 13px !important; letter-spacing: .11em !important; } } @media only screen and (max-width: 1199px) { #bar-logo-search-menu.header-main-modern .header-main-modern-inner { grid-template-columns: 170px 1fr auto !important; column-gap: 28px !important; } #bar-logo-search-menu.header-main-modern #logo img { max-width: 150px !important; } #bar-logo-search-menu.header-main-modern .header-account-modern span { display: none !important; } #bar-logo-search-menu.header-main-modern .header-account-modern { width: 58px !important; padding: 0 !important; justify-content: center !important; } #bar-categorii-nav .wrapper { overflow-x: auto !important; overflow-y: visible !important; } #bar-categorii-nav #nav-categorii > ul { justify-content: flex-start !important; width: max-content !important; min-width: 100% !important; } } @media only screen and (max-width: 1199px) { #bar-promotii-strip { height: 42px !important; } #bar-promotii-strip .bar-promotii-inner { width: calc(100% - 28px) !important; height: 42px !important; gap: 60px !important; justify-content: flex-start !important; overflow: hidden !important; } #bar-promotii-strip .bar-promotie { font-size: 10px !important; } #bar-logo-search-menu.header-main-modern .header-main-modern-inner { width: calc(100% - 28px) !important; min-height: auto !important; padding: 18px 0 14px !important; grid-template-columns: 1fr !important; grid-template-areas: "logo" "search" "actions" !important; row-gap: 16px !important; } #bar-logo-search-menu.header-main-modern #logo { text-align: center !important; } #bar-logo-search-menu.header-main-modern #logo a { width: 100% !important; justify-content: center !important; } #bar-logo-search-menu.header-main-modern #logo img { max-width: 145px !important; } #bar-logo-search-menu.header-main-modern #box-search { max-width: 100% !important; } #bar-logo-search-menu.header-main-modern #search-input, #bar-logo-search-menu.header-main-modern #searchBox { height: 50px !important; } #bar-logo-search-menu.header-main-modern #searchButton { width: 38px !important; height: 38px !important; top: 6px !important; right: 6px !important; } #bar-logo-search-menu.header-main-modern .header-actions-modern { justify-content: center !important; width: 100% !important; border-top: 0px solid #dfd2bf !important; border-bottom: 0px solid #dfd2bf !important; } #bar-logo-search-menu.header-main-modern .header-cart-modern-text strong { display: none !important; } #bar-logo-search-menu.header-main-modern .header-cart-modern-text { min-width: auto !important; } #bar-logo-search-menu.header-main-modern .header-cart-modern-text small { font-size: 12px !important; } #bar-categorii-nav { height: 52px !important; } #bar-categorii-nav .wrapper, #bar-categorii-nav #nav-categorii { width: calc(100% - 28px) !important; height: 52px !important; } #bar-categorii-nav #nav-categorii > ul { height: 52px !important; gap: 28px !important; } #bar-categorii-nav #nav-categorii > ul > li { height: 52px !important; } #bar-categorii-nav #nav-categorii > ul > li > a { height: 52px !important; font-size: 12px !important; } #bar-categorii-nav #nav-categorii > ul > li ul { top: 52px !important; } } /* ===================================================== VITABOLIC HEADER FINAL FIX works on actual IDs, not .header-main-modern ===================================================== */ /* ascunde bara veche cu user/cart/limbă dacă încă există */ #bar-grey-header { display: none !important; } /* bara promo sus */ #bar-promotii-strip { height: 30px !important; background: #0b0b0b !important; border-bottom: 1px solid rgba(255,255,255,.14) !important; overflow: hidden !important; } #bar-promotii-strip .bar-promotii-inner { width: min(1400px, calc(100% - 80px)) !important; height: 10px !important; margin: 0 auto !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 42px !important; white-space: nowrap !important; } #bar-promotii-strip .bar-promotie { padding: 0 !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: .18em !important; text-transform: uppercase !important; } #bar-promotii-strip .bar-promotie::after { display: none !important; } #bar-promotii-strip .bar-promotie i, #bar-promotii-strip .bar-promotie .fa { color: #d39a21 !important; -webkit-text-fill-color: #d39a21 !important; margin-right: 10px !important; } /* header principal */ #bar-logo-search-menu { background: #f7f0e6 !important; background-color: #f7f0e6 !important; border-bottom: 1px solid #dfd2bf !important; box-shadow: none !important; } #bar-logo-search-menu > .wrapper { width: min(1400px, calc(100% - 80px)) !important; min-height: 138px !important; margin: 0 auto !important; padding: 0 !important; display: grid !important; grid-template-columns: 230px minmax(420px, 560px) auto !important; grid-template-areas: "logo search actions" !important; align-items: center !important; column-gap: 70px !important; } /* meniul vechi Producători / Auth / Contact nu apare în render */ #bar-logo-search-menu #nav-primary { display: none !important; } /* logo */ #bar-logo-search-menu #logo { grid-area: logo !important; float: none !important; width: auto !important; height: auto !important; margin: 0 !important; padding: 0 !important; } #bar-logo-search-menu #logo a { display: inline-flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; text-decoration: none !important; } #bar-logo-search-menu #logo img { display: block !important; width: auto !important; max-width: 178px !important; height: auto !important; margin: 0 !important; } #bar-logo-search-menu #logo p { margin: -4px 0 0 !important; color: #4d4138 !important; -webkit-text-fill-color: #4d4138 !important; font-size: 9px !important; line-height: 1 !important; letter-spacing: .55em !important; } /* search */ #bar-logo-search-menu #box-search { grid-area: search !important; float: none !important; width: 100% !important; max-width: 560px !important; margin: 0 !important; padding: 0 !important; display: block !important; position: relative !important; } #bar-logo-search-menu #search-input { position: relative !important; display: block !important; width: 100% !important; height: 58px !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; } #bar-logo-search-menu #searchBox, #bar-logo-search-menu #box-search input[type="search"] { display: block !important; width: 100% !important; min-width: 0 !important; max-width: none !important; height: 58px !important; margin: 0 !important; padding: 0 76px 0 28px !important; border: 1px solid #d8cab7 !important; border-radius: 999px !important; background: #eee7dc !important; color: #4b4036 !important; -webkit-text-fill-color: #4b4036 !important; font-family: "Open Sans", Arial, sans-serif !important; font-size: 15px !important; font-weight: 400 !important; outline: none !important; box-sizing: border-box !important; } #bar-logo-search-menu #searchBox::placeholder { color: rgba(75,64,54,.5) !important; -webkit-text-fill-color: rgba(75,64,54,.5) !important; } #bar-logo-search-menu #searchButton { position: absolute !important; top: 6px !important; right: 6px !important; left: auto !important; width: 46px !important; height: 46px !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; border: 0 !important; border-radius: 50% !important; background: #d39a21 !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font-size: 19px !important; line-height: 1 !important; transform: none !important; cursor: pointer !important; } /* zona dreapta: cont / cos / limba */ #bar-logo-search-menu .header-actions-modern { grid-area: actions !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; width: auto !important; min-width: 0 !important; gap: 0 !important; } /* dacă ai mutat elementele vechi fără wrapper modern */ #bar-logo-search-menu #user-icon, #bar-logo-search-menu #container-header-cart, #bar-logo-search-menu #languageBox { float: none !important; margin: 0 !important; } /* cont */ #bar-logo-search-menu .header-account-modern { height: 58px !important; display: flex !important; align-items: center !important; gap: 12px !important; padding: 0 30px !important; border-left: 0px solid #dccdbb !important; color: #111 !important; -webkit-text-fill-color: #111 !important; text-decoration: none !important; } #bar-logo-search-menu .header-account-modern i { color: #111 !important; -webkit-text-fill-color: #111 !important; font-size: 25px !important; } #bar-logo-search-menu .header-account-modern span { display: block !important; color: #2a221d !important; -webkit-text-fill-color: #2a221d !important; font-size: 15px !important; font-weight: 400 !important; white-space: nowrap !important; } /* cos */ #bar-logo-search-menu .header-cart-modern-wrap { position: relative !important; } #bar-logo-search-menu .header-cart-modern { height: 58px !important; display: flex !important; align-items: center !important; gap: 14px !important; padding: 0 30px !important; border-left: 1px solid #dccdbb !important; cursor: pointer !important; } #bar-logo-search-menu .header-cart-modern i { color: #111 !important; -webkit-text-fill-color: #111 !important; font-size: 29px !important; } #bar-logo-search-menu .header-cart-modern-text { display: grid !important; gap: 3px !important; min-width: 128px !important; } #bar-logo-search-menu .header-cart-modern-text strong { color: #4a3a2d !important; -webkit-text-fill-color: #4a3a2d !important; font-size: 15px !important; font-weight: 400 !important; line-height: 1.1 !important; } #bar-logo-search-menu .header-cart-modern-text small { color: #111 !important; -webkit-text-fill-color: #111 !important; font-size: 14px !important; font-weight: 500 !important; line-height: 1.15 !important; white-space: nowrap !important; } /* limba */ #bar-logo-search-menu .header-language-modern { width: 82px !important; height: 58px !important; display: flex !important; align-items: center !important; justify-content: center !important; border-left: 1px solid #dccdbb !important; border-right: 0px solid #dccdbb !important; } #bar-logo-search-menu #languageMenu, #bar-logo-search-menu #languageMenu li { margin: 0 !important; padding: 0 !important; list-style: none !important; } #bar-logo-search-menu #languageMenu img { display: block !important; width: 32px !important; height: auto !important; } /* dropdown cos */ #bar-logo-search-menu #container-cart-products-small { top: 62px !important; right: 0 !important; left: auto !important; z-index: 5000 !important; } /* ===================================================== CATEGORII - păstrăm sistemul cu Mai multe ===================================================== */ #bar-categorii-nav { height: 62px !important; background: #f7f0e6 !important; background-color: #f7f0e6 !important; border-top: 0 !important; border-bottom: 1px solid #dfd2bf !important; overflow: visible !important; position: relative !important; z-index: 700 !important; } #bar-categorii-nav > .wrapper { width: min(1400px, calc(100% - 80px)) !important; height: 62px !important; margin: 0 auto !important; overflow: visible !important; } #bar-categorii-nav #nav-categorii { height: 62px !important; overflow: visible !important; position: relative !important; } /* doar primul nivel, nu toate dropdown-urile */ #bar-categorii-nav #nav-categorii > ul.categorii { height: 62px !important; width: 100% !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 44px !important; list-style: none !important; overflow: visible !important; white-space: nowrap !important; } #bar-categorii-nav #nav-categorii > ul.categorii > li { position: relative !important; float: none !important; display: flex !important; align-items: center !important; height: 62px !important; margin: 0 !important; padding: 0 !important; flex: 0 0 auto !important; } #bar-categorii-nav #nav-categorii > ul.categorii > li > a { display: flex !important; align-items: center !important; height: 62px !important; padding: 0 !important; color: #18130f !important; -webkit-text-fill-color: #18130f !important; font-family: "Open Sans", Arial, sans-serif !important; font-size: 12px !important; font-weight: 500 !important; line-height: 1 !important; letter-spacing: .13em !important; text-transform: uppercase !important; white-space: nowrap !important; background: transparent !important; } /* dropdown Mai multe */ #bar-categorii-nav #nav-cat-more { position: relative !important; margin-left: auto !important; padding-right: 0 !important; } #bar-categorii-nav #nav-cat-dropdown { position: absolute !important; top: 62px !important; right: 0 !important; left: auto !important; z-index: 9000 !important; min-width: 260px !important; margin: 0 !important; padding: 10px 0 !important; display: none; background: #fffaf2 !important; border: 1px solid #dfd2bf !important; border-radius: 0 0 12px 12px !important; box-shadow: 0 18px 36px rgba(0,0,0,.14) !important; } #bar-categorii-nav #nav-cat-more:hover #nav-cat-dropdown, #bar-categorii-nav #nav-cat-more.open #nav-cat-dropdown { display: block !important; } #bar-categorii-nav #nav-cat-dropdown li { display: block !important; float: none !important; height: auto !important; margin: 0 !important; padding: 0 !important; } #bar-categorii-nav #nav-cat-dropdown li a { display: block !important; height: auto !important; padding: 11px 18px !important; color: #34281f !important; -webkit-text-fill-color: #34281f !important; background: transparent !important; font-size: 13px !important; font-weight: 500 !important; letter-spacing: .06em !important; line-height: 1.3 !important; text-transform: uppercase !important; white-space: nowrap !important; } #bar-categorii-nav #nav-cat-dropdown li a:hover { background: rgba(211,154,33,.09) !important; color: #c89022 !important; -webkit-text-fill-color: #c89022 !important; } /* ===================================================== RESPONSIVE ===================================================== */ @media only screen and (max-width: 1320px) { #bar-logo-search-menu > .wrapper { width: min(1280px, calc(100% - 54px)) !important; grid-template-columns: 190px minmax(340px, 500px) auto !important; column-gap: 46px !important; } #bar-logo-search-menu .header-account-modern { padding: 0 22px !important; } #bar-logo-search-menu .header-cart-modern { padding: 0 22px !important; } #bar-categorii-nav > .wrapper { width: min(1280px, calc(100% - 54px)) !important; } #bar-categorii-nav #nav-categorii > ul.categorii { gap: 32px !important; } #bar-categorii-nav #nav-categorii > ul.categorii > li > a { font-size: 12px !important; letter-spacing: .1em !important; } } @media only screen and (max-width: 1100px) { #bar-logo-search-menu > .wrapper { grid-template-columns: 170px 1fr auto !important; column-gap: 28px !important; } #bar-logo-search-menu #logo img { max-width: 150px !important; } #bar-logo-search-menu .header-account-modern span { display: none !important; } #bar-logo-search-menu .header-account-modern { width: 58px !important; padding: 0 !important; justify-content: center !important; } #bar-categorii-nav > .wrapper { overflow-x: auto !important; overflow-y: visible !important; } #bar-categorii-nav #nav-categorii > ul.categorii { justify-content: flex-start !important; width: max-content !important; min-width: 100% !important; } } @media only screen and (max-width: 760px) { #bar-promotii-strip { height: 42px !important; } #bar-promotii-strip .bar-promotii-inner { width: calc(100% - 28px) !important; height: 42px !important; justify-content: flex-start !important; gap: 60px !important; overflow: hidden !important; } #bar-promotii-strip .bar-promotie { font-size: 10px !important; } #bar-logo-search-menu > .wrapper { width: calc(100% - 28px) !important; min-height: auto !important; padding: 18px 0 14px !important; grid-template-columns: 1fr !important; grid-template-areas: "logo" "search" "actions" !important; row-gap: 16px !important; } #bar-logo-search-menu #logo { text-align: center !important; } #bar-logo-search-menu #logo a { width: 100% !important; justify-content: center !important; } #bar-logo-search-menu #logo img { max-width: 145px !important; } #bar-logo-search-menu #box-search { max-width: 100% !important; } #bar-logo-search-menu #search-input, #bar-logo-search-menu #searchBox { height: 50px !important; } #bar-logo-search-menu #searchButton { width: 38px !important; height: 38px !important; top: 6px !important; right: 6px !important; } #bar-logo-search-menu .header-actions-modern { justify-content: center !important; width: 100% !important; border-top: 1px solid #dfd2bf !important; border-bottom: 1px solid #dfd2bf !important; } #bar-logo-search-menu .header-cart-modern-text strong { display: none !important; } #bar-logo-search-menu .header-cart-modern-text { min-width: auto !important; } #bar-logo-search-menu .header-cart-modern-text small { font-size: 12px !important; } #bar-categorii-nav { height: 52px !important; } #bar-categorii-nav > .wrapper, #bar-categorii-nav #nav-categorii { width: calc(100% - 28px) !important; height: 52px !important; } #bar-categorii-nav #nav-categorii > ul.categorii { height: 52px !important; gap: 28px !important; } #bar-categorii-nav #nav-categorii > ul.categorii > li { height: 52px !important; } #bar-categorii-nav #nav-categorii > ul.categorii > li > a { height: 52px !important; font-size: 12px !important; } #bar-categorii-nav #nav-cat-dropdown { top: 52px !important; } } /* ===================================================== FIX HEADER: promo scroll + categorii dropdown pune la final in main.css ===================================================== */ /* 1. Repară bara promo de sus - scroll/marquee */ #bar-promotii-strip { overflow: hidden !important; } #bar-promotii-strip .bar-promotii-inner { width: max-content !important; min-width: 200% !important; max-width: none !important; margin: 0 !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; gap: 120px !important; animation: vitabolicPromoScroll 28s linear infinite !important; transform: translateX(0); will-change: transform; } #bar-promotii-strip:hover .bar-promotii-inner { animation-play-state: paused !important; } @keyframes vitabolicPromoScroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } } /* 2. Bara categorii - nu mai forțăm toate itemele să intre pe rând */ #bar-categorii-nav { position: relative !important; z-index: 800 !important; overflow: visible !important; } #bar-categorii-nav > .wrapper { width: min(1400px, calc(100% - 80px)) !important; margin: 0 auto !important; overflow: visible !important; } #bar-categorii-nav #nav-categorii { position: relative !important; overflow: visible !important; } /* Primul nivel: rămâne centrat, dar nu rupe dropdown-ul */ #bar-categorii-nav #nav-categorii > ul.categorii { width: 100% !important; max-width: 100% !important; height: 62px !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: clamp(22px, 2.2vw, 42px) !important; overflow: visible !important; white-space: nowrap !important; } /* Nu lăsăm itemele să se întindă */ #bar-categorii-nav #nav-categorii > ul.categorii > li { flex: 0 0 auto !important; position: relative !important; } /* Dacă JS-ul ascunde categorii în Mai multe, respectăm ascunderea */ #bar-categorii-nav #nav-categorii > ul.categorii > li[style*="display: none"], #bar-categorii-nav #nav-categorii > ul.categorii > li.hidden, #bar-categorii-nav #nav-categorii > ul.categorii > li.hide { display: none !important; } /* 3. Dropdown Mai multe - îl deschidem spre stânga, nu în afara paginii */ #bar-categorii-nav #nav-cat-more { position: relative !important; } #bar-categorii-nav #nav-cat-dropdown { position: absolute !important; top: 62px !important; left: auto !important; right: 0 !important; min-width: 250px !important; max-width: min(320px, calc(100vw - 32px)) !important; margin: 0 !important; padding: 10px 0 !important; background: #fffaf2 !important; border: 1px solid #dfd2bf !important; border-radius: 0 0 12px 12px !important; box-shadow: 0 18px 36px rgba(0,0,0,.14) !important; z-index: 99999 !important; overflow: hidden !important; } /* dacă dropdown-ul are alt ul în interior */ #bar-categorii-nav #nav-cat-dropdown ul { margin: 0 !important; padding: 0 !important; display: block !important; } #bar-categorii-nav #nav-cat-dropdown li { display: block !important; width: 100% !important; height: auto !important; margin: 0 !important; padding: 0 !important; } #bar-categorii-nav #nav-cat-dropdown li a { display: block !important; width: 100% !important; padding: 12px 20px !important; color: #34281f !important; -webkit-text-fill-color: #34281f !important; font-size: 13px !important; font-weight: 500 !important; letter-spacing: .07em !important; line-height: 1.3 !important; text-transform: uppercase !important; white-space: normal !important; } #bar-categorii-nav #nav-cat-dropdown li a:hover { background: rgba(211,154,33,.09) !important; color: #c89022 !important; -webkit-text-fill-color: #c89022 !important; } /* 4. Pe ecrane mai mici lăsăm categoriile scrollabile, dar dropdown-ul rămâne vizibil */ @media only screen and (max-width: 1180px) { #bar-categorii-nav > .wrapper { width: calc(100% - 32px) !important; overflow-x: auto !important; overflow-y: visible !important; } #bar-categorii-nav #nav-categorii > ul.categorii { width: max-content !important; min-width: 100% !important; justify-content: flex-start !important; gap: 30px !important; } #bar-categorii-nav #nav-cat-dropdown { right: 0 !important; left: auto !important; } } /* ===================================================== HEADER FINAL PATCH: categories width + flag + disable category dropdowns ===================================================== */ /* 1. Header actions: aliniază corect flag-ul */ #bar-logo-search-menu .header-language-modern { width: 86px !important; min-width: 86px !important; height: 58px !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; border-left: 1px solid #dccdbb !important; border-right: 0px solid #dccdbb !important; } #bar-logo-search-menu .header-language-modern #languageMenu { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 58px !important; margin: 0 !important; padding: 0 !important; } #bar-logo-search-menu .header-language-modern #languageMenu li, #bar-logo-search-menu .header-language-modern .languagePicker { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; height: 58px !important; margin: 0 !important; padding: 0 !important; } #bar-logo-search-menu .header-language-modern #languageMenu a { display: flex !important; align-items: center !important; justify-content: center !important; } #bar-logo-search-menu .header-language-modern #languageMenu img { display: block !important; width: 32px !important; height: auto !important; margin: 0 !important; } /* 2. Bara categorii: nu o mai lăsăm să fie mai lată decât containerul */ #bar-categorii-nav { height: 62px !important; background: #f7f0e6 !important; border-bottom: 1px solid #dfd2bf !important; overflow: visible !important; } #bar-categorii-nav > .wrapper { width: min(1400px, calc(100% - 80px)) !important; max-width: 1400px !important; height: 62px !important; margin: 0 auto !important; overflow: visible !important; } #bar-categorii-nav #nav-categorii { width: 100% !important; height: 62px !important; overflow: visible !important; } /* 3. Primul nivel de categorii: container fix, fără să iasă lateral */ #bar-categorii-nav #nav-categorii > ul.categorii { width: 100% !important; max-width: 100% !important; height: 62px !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 34px !important; list-style: none !important; white-space: nowrap !important; overflow: visible !important; } #bar-categorii-nav #nav-categorii > ul.categorii > li { position: relative !important; flex: 0 0 auto !important; display: flex !important; align-items: center !important; height: 62px !important; margin: 0 !important; padding: 0 !important; float: none !important; } #bar-categorii-nav #nav-categorii > ul.categorii > li > a { display: flex !important; align-items: center !important; height: 62px !important; padding: 0 !important; color: #111 !important; -webkit-text-fill-color: #111 !important; font-family: "Open Sans", Arial, sans-serif !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .12em !important; line-height: 1 !important; text-transform: uppercase !important; white-space: nowrap !important; } /* 4. IMPORTANT: blocăm dropdown-urile normale la categorii */ #bar-categorii-nav #nav-categorii > ul.categorii > li:not(#nav-cat-more) > ul, #bar-categorii-nav #nav-categorii > ul.categorii > li:not(#nav-cat-more) .submenu, #bar-categorii-nav #nav-categorii > ul.categorii > li:not(#nav-cat-more) .dropdown { display: none !important; visibility: hidden !important; opacity: 0 !important; pointer-events: none !important; } /* prevenim apariția la hover pentru categorii normale */ #bar-categorii-nav #nav-categorii > ul.categorii > li:not(#nav-cat-more):hover > ul { display: none !important; } /* 5. Permitem dropdown doar la MAI MULTE */ #bar-categorii-nav #nav-cat-more { position: relative !important; margin-left: 0 !important; } #bar-categorii-nav #nav-cat-more > a { color: #c89022 !important; -webkit-text-fill-color: #c89022 !important; } #bar-categorii-nav #nav-cat-dropdown { position: absolute !important; top: 62px !important; right: 0 !important; left: auto !important; min-width: 250px !important; max-width: 320px !important; margin: 0 !important; padding: 10px 0 !important; display: none !important; background: #fffaf2 !important; border: 1px solid #dfd2bf !important; border-radius: 0 0 12px 12px !important; box-shadow: 0 18px 36px rgba(0,0,0,.14) !important; z-index: 99999 !important; overflow: hidden !important; } #bar-categorii-nav #nav-cat-more:hover #nav-cat-dropdown, #bar-categorii-nav #nav-cat-more.open #nav-cat-dropdown { display: block !important; } #bar-categorii-nav #nav-cat-dropdown li { display: block !important; width: 100% !important; height: auto !important; margin: 0 !important; padding: 0 !important; } #bar-categorii-nav #nav-cat-dropdown li a { display: block !important; width: 100% !important; height: auto !important; padding: 12px 20px !important; color: #34281f !important; -webkit-text-fill-color: #34281f !important; font-size: 13px !important; font-weight: 500 !important; letter-spacing: .07em !important; line-height: 1.3 !important; text-transform: uppercase !important; white-space: normal !important; } #bar-categorii-nav #nav-cat-dropdown li a:hover { background: rgba(211,154,33,.09) !important; color: #c89022 !important; -webkit-text-fill-color: #c89022 !important; } /* 6. Pe ecrane medii micșorăm spațiul, nu lăsăm meniul să fugă */ @media only screen and (max-width: 1320px) { #bar-categorii-nav > .wrapper { width: calc(100% - 54px) !important; } #bar-categorii-nav #nav-categorii > ul.categorii { gap: 24px !important; } #bar-categorii-nav #nav-categorii > ul.categorii > li > a { font-size: 12px !important; letter-spacing: .09em !important; } } /* 7. Pe mobil/tabletă permitem scroll orizontal, dar doar în container */ @media only screen and (max-width: 1100px) { #bar-categorii-nav > .wrapper { width: calc(100% - 32px) !important; overflow-x: auto !important; overflow-y: visible !important; } #bar-categorii-nav #nav-categorii > ul.categorii { width: max-content !important; min-width: 100% !important; justify-content: flex-start !important; gap: 28px !important; } #bar-categorii-nav #nav-cat-dropdown { right: 0 !important; left: auto !important; } } /* Mobile fix: dropdown-ul MAI MULTE peste hero/imagine */ @media only screen and (max-width: 900px) { #bar-categorii-nav { position: relative !important; z-index: 9999 !important; overflow: visible !important; } #bar-categorii-nav > .wrapper, #bar-categorii-nav #nav-categorii, #bar-categorii-nav #nav-categorii > ul.categorii { overflow: visible !important; } #bar-categorii-nav #nav-cat-more { position: relative !important; z-index: 10000 !important; } #bar-categorii-nav #nav-cat-dropdown { position: absolute !important; top: 52px !important; right: 0 !important; left: auto !important; z-index: 10001 !important; max-height: calc(100vh - 170px) !important; } .home-hero-v2, .home-hero, #home-hero, .hero, .slider, #slider { position: relative !important; z-index: 1 !important; } }