/* https://gwfh.mranftl.com/fonts google-webfonts-helper */
/* hanken-grotesk-regular - latin */
@font-face {
font-display: swap;
font-family: 'Hanken Grotesk';
font-style: normal;
font-weight: 400;
src: url('../fonts/hanken-grotesk-v8-latin-regular.woff2') format('woff2'),
url('../fonts/hanken-grotesk-v8-latin-regular.ttf') format('truetype');
}
/* arvo-regular - latin */
@font-face {
font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for options. */
font-family: 'Arvo';
font-style: normal;
font-weight: 400;
src: url('../fonts/arvo-v22-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
url('../fonts/arvo-v22-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
:root{
--bs-offcanvas-width: 80%;
--bs-navbar-toggler-focus-width: 2px;
--bs-btn-border-radius: 3px;
--zd-block-border-radius:3px;
--zd-btn-border-radius:3px;
--zd-container-leftright-padding-mobile: 1em;
--zd-container-leftright-padding-tablet: 2em;
--zd-container-leftright-padding-desktop: 3em;
--zd-neutral-color: #101010;
--zd-neutral-color-rgb: 16, 16, 16;
--zd-white-color: #fefefe;
--zd-white-color-rgb: 254, 254, 254;
--zd-black-color: #080808;
--zd-black-color-rgb: 8, 8, 8;
--zd-disabled-color: gray;
--zd-disabled-border-color: #a9a9a9;
--zd-text-color: #080808;
--zd-sales-color: red;
--zd-sales-color-rgb: 225, 55, 40;
--zd-link-color: #0d6efd; /* länkfärg */
/* ändra per domän o store */
--zd-body-font-family: 'Hanken Grotesk';
--zd-header-font-family: 'Arvo';
--zd-button-color-rgb: 60, 120, 55;
--zd-button-color-hover-rgb: 70, 140, 65;
--zd-primary-color-rgb: 60, 120, 55;
--zd-primary-color: #3C7837;
--zd-footer-background-color-rgb: 235, 235, 230; /* #EBEBE6 */
--zd-footer-font-color-rgb: 8,8,8;
--zd-body-background-color-rgb: 245, 245, 240; /* #F5F5F0 */
--zd-neutral-background-color: #969187;
--zd-neutral-background-color-rgb: 150,145,135;
/* verkar behövs av ngn anledning.. */
--bs-link-color: var(--zd-link-color);
--bs-body-font-family: var(--zd-body-font-family);
--bs-btn-bg: red !important;
--bs-btn-active-bg: yellow !important;
--bs-btn-active-bg: purple !important;
--bs-btn-hover-bg: orange !important;
}
}
/*
--bs-font-sans-serif: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
*/
/*
1920×1080 (8.89%)
1366×768 (8.44%)
360×640 (7.28%)
414×896 (4.58%)
1536×864 (3.88%)
375×667 (3.75%)
*/
/* font inställningar */
h1, h2, h1 a, h2 a,
.path-quiz .main-content .fieldset-legend { font-family: var(--zd-header-font-family); font-weight: 300; }
h3, h4, h5, h6, h3 a { font-family: var(--zd-body-font-family); font-weight: normal; }
h3, h3 a { font-family: var(--zd-header-font-family); font-weight: 300; }
h6 { text-transform:uppercase; }
.site-footer, body, p, a, li { font-family: var(--zd-body-font-family); }
.h1, h1 { font-size: calc(1.375rem + 1vw) !important; }
body { line-height:1.5em; font-size:15px; font-weight:400; background:none; }
@media all and (min-width: 768px) { body { font-size:16px; } }
#page-wrapper { background: rgba(var(--zd-body-background-color-rgb), 1); }
.container-xl, #main { background:white; }
#main, #site-footer__top {
border-left: 1px solid rgba(var(--zd-neutral-background-color-rgb),0.1);
border-right: 1px solid rgba(var(--zd-neutral-background-color-rgb),0.1);
}
#site-footer__top {
border-bottom: 1px solid rgba(var(--zd-neutral-background-color-rgb),0.2);
}
/* START buttons */
.cart-block--offcanvas-cart-table tfoot button,
.btn, .btn-primary,
#edit-actions .link--previous {
--bs-btn-border-radius: var(--zd-btn-border-radius);
margin-right:1em;
box-shadow: 0 1px 5px #efefef;
width:100%;
max-width:200px;
background:rgba(var(--zd-button-color-rgb), 1);
border-color:rgba(var(--zd-button-color-rgb), 0.8);
margin-bottom: 0.5em;
}
.btn:hover, .btn-primary:hover, .eu-cookie-compliance-banner .agree-button:hover,
.zd-action-button:hover,
.btn-check:active+.btn, .btn-check:checked+.btn, .btn.active, .btn.show, .btn:active,
.btn-check:focus+.btn,.btn:focus,
#edit-actions .link--previous:hover, #edit-actions .link--previous:focus {
background:rgba(var(--zd-button-color-hover-rgb), 1);
border-color:rgba(var(--zd-button-color-rgb), 0.9);
box-shadow: 0 0 0 0.15rem rgba(var(--zd-button-color-rgb), .3);
}
.btn-check:active+.btn:focus,.btn-check:checked+.btn:focus,.btn.active:focus,.btn.show:focus,.btn:active:focus, .btn-check:focus+.btn,.btn:focus {
box-shadow: 0 0 0 0.25rem rgba(var(--zd-button-color-rgb), .5);
}
.zd-atc-butik .form-actions .is-disabled:hover,
.btn.is-disabled:hover,
.zd-atc-disabled:hover,
.btn.disabled:hover, .btn-primary.disabled:hover,
#edit-actions .link--previous:hover {
box-shadow: none;
}
.Ais-disabled { cursor: default; }
button[disabled],
input[disabled] {
cursor: not-allowed;
}
.zd-adc-inner .zd-stock { margin-left: 1em; }
.zd-adc-inner .button--add-to-cart,
.zd-adc-inner .zd-atc-disabled,
.zd-adc-flyout-button { margin-left:0.5em; }
#edit-payment-process-offsite-payment-actions-return-to-cart,
.zd-cart #edit-submit,
.zd-atc-butik .form-actions .is-disabled,
.zd-atc-disabled:disabled,
.zd-adc-flyout-button.disabled,
.btn-secondary,
.form-actions .is-disabled,
#edit-actions .link--previous {
pointer-events: auto !important;
background-color:rgba(var(--zd-neutral-color-rgb), 0.4) !important;
border-color:rgba(var(--zd-neutral-color-rgb), 0.1) !important;
}
.zd-atc-butik .form-actions .is-disabled,
.zd-adc-flyout-button.disabled.butik {
background: repeating-linear-gradient(
45deg,
rgba(var(--zd-button-color-rgb), 0.8) 5px 20px,
rgba(var(--zd-neutral-color-rgb), 0.3) 20px 40px
);
}
.btn-secondary-colored {
background-color:rgba(var(--zd-button-color-rgb), 0.5) !important;
}
.btn.disabled, .btn:disabled, fieldset:disabled .btn { opacity:inherit; }
@media all and (max-width: 414px) {
.cart-block--offcanvas-cart-table tfoot button,
.btn, .btn-primary, #edit-actions .link--previous { max-width:none; margin-bottom:0.5em; }
}
.active>.page-link, .page-link.active, .form-check-input:checked {
background:rgba(var(--zd-button-color-rgb), 1);
border-color:rgba(var(--zd-button-color-rgb), 0.8);
}
/* END buttons */
.main-content img { width:100%; height:auto; margin:0px; }
h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a,
.path-quiz .main-content .fieldset-legend {
font-weight:600 !important;
margin-top:0.8em; margin-bottom:0.4em;
}
h1 { margin-top:1.4em !important; }
h1.zd-product-title { margin-top:0em !important; }
h2 { font-size:1.2em !important; }
h3 { font-size:1.0em !important; }
h4 { font-size:1.0em !important; }
.node__content { font-size:1em; }
.node--view-mode-teaser {
border:0px;
border-top: 1px solid rgba(var(--zd-neutral-color-rgb), 0.03);
}
form.views-exposed-form .form-type-select {
display: flex;
flex-wrap: nowrap;
align-content: center;
align-items: center;
justify-content: flex-end;
width: 100%;
}
form.views-exposed-form .form-type-select label {
min-width: 70%;
text-align: right;
padding-right: 1em;
}
.zd-unpublished .main-content { background:pink; }
#block-search-exp, input, .form-select { border-radius: var(--zd-block-border-radius)!important; }
#block-search-exp, .form-control, .form-control:focus {
box-shadow: 0 1px 5px rgba(var(--zd-neutral-color-rgb), 0.03);
border: 1px solid #555;
border-color: rgba(var(--zd-neutral-color-rgb), 0.2);
}
#block-search-exp input, #block-search-exp button {
border: 0px;
box-shadow: none;
}
/* tar bort ikonen på alla knappar */
a.nav-link--contact::before,
a.nav-link--user-login::before,
.btn-primary:not(.delete-order-item)::before,
.form-submit:not(.delete-order-item)::before,
.zd-atc-disabled .form-actions .form-submit::before,
.form-actions .form-submit.is-disabled::before {
background-image: none!important;
width: auto!important;
height: auto;
display:none !important;
}
/* TOP-HEADER (extra promo-plats högst upp) */
#top-header { overflow:hidden; text-align:center; }
#top-header p { margin-bottom:0px; }
/* slut TOP-HEADER */
/* HEADER */
#navbar-main {
background: rgba(var(--zd-white-color-rgb), 1);
border-color: rgba(var(--zd-neutral-color-rgb), 0.07);
color: rgba(var(--zd-neutral-color-rgb), 0.3);
border:none;
}
.featured-bottom-third, #highlighted-wrapper .form-search {
background: rgba(var(--zd-neutral-color-rgb), 0.03);
border-color: rgba(var(--zd-neutral-color-rgb), 0.07);
color: rgba(var(--zd-neutral-color-rgb), 0.3);
}
.scrolled #navbar-main {
transform: translate3d(0px, 0px, 0px);
}
.highlighted {
background:white;
box-shadow: 0px 1px 7px 0px rgba(var(--zd-neutral-background-color-rgb), 0.1);
}
header.header {
position: sticky;
top: 0;
z-index: 10000;
background-color: white;
padding:1em;
padding-top:0px; padding-bottom:0px;
box-shadow: 0px 1px 7px 0px rgba(var(--zd-neutral-background-color-rgb), 0.1);
}
#toolbar-administration, #toolbar-administration * {
z-index: 100000;
}
@media all and (max-width: 767px) {
#Aheader-wrapper, #Ahighlighted-wrapper {
box-shadow: 0 1px 5px rgba(var(--zd-neutral-background-color-rgb), 0.03);
}
}
#header .navbar .form-type-search { margin-bottom:0px!important; }
.Aoffcanvas .btn-close {
background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center/1.5em auto no-repeat;
}
.cart-offcanvas table { font-size:1em; }
.cart-offcanvas.is-open {
max-width:100%;
border-left: 1px solid rgba(var(--zd-neutral-background-color-rgb), 0.05);
z-index: 11000;
background: #fdfdfd;
}
#cart-offcanvas { overflow:scroll; }
.cart-block--offcanvas-cart-table tfoot .cart--cart-offcanvas__close button {
background:white;
color: rgba(var(--zd-primary-color-rgb),1);
}
.cart-block--offcanvas-cart-table tfoot button a { color: white; }
.offcanvas .btn-close, .cart-offcanvas .btn-close {
padding: 1em;
}
.offcanvas .offcanvas-header { text-align:right; }
.zd-taxonomy-menu-mobile li.menu-item--expanded a {
padding-right:2em;
background-image: url('data:image/svg+xml,');
background-size:1.3em;
background-repeat:no-repeat;
background-position: right center;
display:block;
font-weight:700;
}
.offcanvas ul.block-taxonomymenu__submenu li a {
background:none;
background-image: none;
padding-left:0.5em;
font-weight:normal;
display: flex;
justify-content: space-between;
align-items: center;
}
.offcanvas ul.block-taxonomymenu__submenu li:active,
.offcanvas ul.block-taxonomymenu__submenu li:hover {
background:rgba(var(--zd-primary-color-rgb), 0.2);
}
.offcanvas > ul.block-taxonomymenu__submenu li {
border:0px;
}
.AAoffcanvas-body { overflow:visible; background:white; }
.offcanvas-body { background:white; }
.offcanvas.offcanvas-end { max-width:90%; max-width:450px; }
.offcanvas a.nav-link--::before { display:none; }
/* todo: verkar fixa att jag inte kan öppna nav när jag scrollat och har en sticky header */
/* men det funkar bara på mobilen, på desktop får jag det inte att fungera alls */
/* tillsammans med sticky header */
@media all and (max-width: 421px) {
.Aoffcanvas-backdrop { position:static !important; }
}
.affix { right:0px; }
.Aoffcanvas.offcanvas-start { left:auto !important; }
/* slut OFFCANVAS */
/* offcanvas CART FLYOUT */
.cart-block--summary img,
.cart-block--summary__icon img { height:2.1em; }
.cart-block--offcanvas-contents { padding:0.5em; padding-left:1em; margin-top:4em; }
.cart-block--offcanvas-contents__items a {
text-decoration:none;
color:rgba(var(--zd-neutral-color-rgb), 0.8);
}
.cart-block--offcanvas-contents__items td.zd-cart-flyout-empty-separator {
padding:2px;
}
.cart-block--offcanvas-contents__items td.zd-cart-flyout-separator {
border-bottom:1px solid rgba(var(--zd-neutral-background-color-rgb), 0.10);
border-top:1px solid rgba(var(--zd-neutral-background-color-rgb), 0.10);
background: rgba(var(--zd-neutral-background-color-rgb), 0.1);
padding:0px;
}
.cart-block--offcanvas-contents__items tr { background:none; }
.cart-block--offcanvas-contents__items td { vertical-align:middle; }
.cart-block--offcanvas-contents__items td input { text-align:center; }
.cart-block--offcanvas-contents button { padding:0.5em; margin-top:1em; color:rgba(var(--zd-white-color-rgb), 1)}
.cart-block--offcanvas-contents__items td.cart-block--offcanvas-cart-table__remove button {
margin-top:0px; background: rgba(var(--zd-neutral-background-color-rgb), 0.2);
border-color: rgba(var(--zd-neutral-background-color-rgb), 0.25); }
.cart-block--offcanvas-contents__items td.cart-block--offcanvas-cart-table__remove { vertical-align:top; }
.cart-block--offcanvas-contents .zd-cart-empty-text { margin-bottom:1em; }
/* slut offcavas CART FLYOUT */
.path-frontpage.node--type-promo-page h1.title { display:none; }
@media only screen and (max-width:767px) {
.block-superfish { display: none; }
}
/* FOOTER */
/* färger */
/*
.site-footer .block.zd-footer-slogan-block, .site-footer #block-zdstoresblock {
background: white !important;
}
.site-footer .row, .site-footer .row a, .site-footer .row h2, .site-footer .content,
.site-footer .ckeditor-accordion-container > dl dt > a,
.site-footer .ckeditor-accordion-container > dl dt > a:not(.button) {
color: rgba(var(--zd-footer-font-color-rgb), 0.7);
}
.site-footer .block.zd-footer-slogan-block .content,
.site-footer #block-zdstoresblock .content h2,
.site-footer #block-zdstoresblock .content {
color: rgba(var(--zd-black-color-rgb), 1);
}
.site-footer .block.zd-footer-block.zd-copyright-block .content {
font-size:90%;
color:rgba(var(--zd-black-color-rgb), 0.3) !important;
}
.site-footer .ckeditor-accordion-toggle:before,
.site-footer .ckeditor-accordion-toggle:after {
background: rgba(var(--zd-footer-font-color-rgb), 0.7) !important;
}
.site-footer .content a:focus, .site-footer .content a, .site-footer .content a.is-active, .site-footer .content a:hover {
text-decoration:none;
}
.site-footer .content a.is-active, .site-footer .content a:hover {
text-decoration:underline;
color: var(--zd-text-color);
}
.site-footer h2,
.site-footer .ckeditor-accordion-toggler { text-transform: uppercase; letter-spacing: 0.07em; font-size:90%; }
*%
/* systerbutiker stores */
/*
#block-zd-barrio-lankarombutiken h2 { text-align:center; }
#zd-store-logo-list { display: flex; justify-content: center; }
#zd-store-logo-list img { margin:0.5em; max-height:4em; }
#block-zdstoresblock h2 {
text-align:center; font-weight:normal !important; font-size:0.8em !important;
letter-spacing:0.02em; text-transform:uppercase;
}
*/
/* städa upp footer margins etc */
/*
.site-footer__top {
margin-right: calc(-.5* var(--bs-gutter-x));
margin-left: calc(-.5* var(--bs-gutter-x));
}
.site-footer__top .region { padding:0px !important; }
.site-footer__bottom, .site-footer__bottom .region {
margin-top:0px; }
.region-footer-second,
.site-footer .block.zd-footer-block {
text-align:center;
margin:0px;
border:0px;
}
.site-footer .block { border:0px }
.site-footer .zd-footer-block .content {
width:auto;
max-width: 600px;
margin-left:auto; margin-right:auto;
letter-spacing:0.5px;
}
.zd-footer-block .zd-buzzwords {
padding: 0.5em;
padding-top:0.7em;
letter-spacing:0.5px;
font-weight:bold;
border:1px solid rgba(var(--zd-black-color-rgb), 0.08);
box-shadow: 0 3px 7px rgba(var(--zd-black-color-rgb), 0.28);
background: rgba(var(--zd-white-color-rgb), 0.97);
}
.zd-footer-block.zd-store-description-block h2 {
margin-bottom:0.5em; }
.site-footer__top h2 { border:0px; }
.zd-footer-block.zd-footer-contact h3 {
text-transform:uppercase; }
#main .block.zd-footer-block.zd-footer-contact h3 { display:none; }
#block-zd-barrio-lankarombutiken .ckeditor-accordion-container dl.styled {
margin-bottom:0px;
}
*/
/* slut FOOTER */
#block-wishlist .wishlist-block__count,
.block-commerce-cart .cart-block--summary__count {
position:relative; top:-10px; font-size:10px;
background:black; padding:2px;
}
#block-wishlist a.wishlist-block__link,
.block-commerce-cart a.cart-block--link__expand { text-decoration:none; color:white; }
#block-wishlist {
/* https://icons.getbootstrap.com/icons/heart/ */
background-image: url('data:image/svg+xml,');
background-size:1.3em; background-repeat:no-repeat;
width:1.3em; height:1.3em;
}
#block-wishlist .wishlist-block__count { left: 2.5em; top: -14px; }
.zd-wishlist-count-0, .zd-cart-count-0 { display:none; }
.navbar-toggler { border:none; }
/* STOCK */
.zd-stock-text { font-size:70%; text-transform:uppercase; }
.zd-adc-inner .zd-stock-text { padding-left:1em; }
.zd-stock-text::before {
content: "\2022";
font-weight: bold;
display: inline-block;
padding-left:0.3em;
width: 1.4em;
margin-left: -1em;
}
.zd-in-stock::before { color:rgb(78, 199, 145); }
.zd-out-of-stock::before { color:red; }
.zd-out-of-stock { padding-left:0px; }
.zd-one-stock::before { color:orange; }
.Azd-views-list .zd-stock-text { display:none; } /* lager */
/* END stock */
/* slut STOCK */
/* PRIS */
AA.price:not(.zd-cart .price) { font-size:1.60em; font-weight:bold; margin-top:0.5em; margin-bottom:0.5em; }
.zd-adc-full .price { font-size:1.60em; font-weight:bold; margin-top:0.5em; margin-bottom:0.5em; }
.zd-views-list .price { font-size:1em; font-weight:500; }
.zd-views-list .price.price-with-discount { margin-bottom:0px; margin-top:0px; }
.price.price-with-discount .final-price { color: rgba(var(--zd-sales-color-rgb),1); }
.price.price-with-discount .final-price:hover { color: rgba(var(--zd-sales-color-rgb),0.9); }
.price .final-price, .price .original-price { padding-left:0.1em; padding-right:0.1em; }
.price.price-with-discount .original-price { text-decoration: line-through; }
.zd-views-list .price.price-with-discount .original-price { font-size:80%; }
.Aprice.price-with-discount { display: flex; justify-content: flex-start; }
.Azd-views-list .price.price-with-discount { flex-direction: column; line-height: 0.8em; }
.zd-views-list .price.price-with-discount { text-align: center; }
.zd-views-list .price.price-with-discount .final-price,
.zd-views-list .price.price-with-discount .original-price {
display:inline;
}
/* PRODUKTSIDOR */
.path-product .block-page-title-block { display:none; }
.path-product .main-content { margin-bottom:2em; }
.zd-full .field--name-title { display:block; margin-top:0.5em; }
.zd-full img {
border:1px solid rgba(var(--zd-neutral-background-color-rgb), 0.1);
border-radius: var(--zd-block-border-radius);
background: white;
object-fit: contain !important;
}
.zd-full .image-style-large { margin-bottom:0px; }
.thumbnails .thumb { padding:0.2em; width:25% !important; }
.path-product .field--name-variations { margin:0px; margin-top:0.3em; }
.path-product #commerce-product-add-to-cart-form .form-actions { margin-bottom:0px !important; }
.zd-flyout-select { padding:0.5em; width:100%; max-width:450px; border-bottom-width: 1px; }
/* får inte hjärtat att fungera när man byter variant på produkten. För att gå tillbaka till hjärtat
ta bort A i namnet och gå till https://c9/admin/commerce/config/product-types/default/edit/display
och skriv något kortare än Önskelista på AddToCart-konfigurationen */
#Aedit-wishlist:before {
/* filled https://icons.getbootstrap.com/icons/heart-fill */
background-image: url('data:image/svg+xml,');
background-size:1.7rem;
width:2rem; height:2rem;
}
/* wishlist hjärta */
.commerce-order-item-add-to-cart-form .form-actions .btn-link {}
.commerce-order-item-add-to-cart-form .form-actions .btn-link:before {
/* filled https://icons.getbootstrap.com/icons/heart-fill */
/*background-image: url('data:image/svg+xml,'); */
/* https://icons.geosm.ge/en/heart?color=%2300539C */
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxOCAxOCI+PHBhdGggZD0iTTkgMTQuNUw0IDkuNUMwLjUgNiAzLjUgMy41IDUuNSAzLjVDOCAzLjUgOSA2IDkgNkM5IDYgMTAgMy41IDEyLjUgMy41QzE0LjUgMy41IDE3LjUgNiAxNCA5LjVaIiBzdHlsZT0iZmlsbDogbm9uZTsgc3Ryb2tlOiAjMDA1MzlDIiAvPjwvc3ZnPg==');
background-size:1.7rem;
width:2rem; height:2rem;
}
.block-views-blockzd-variations-on-this-product-block-1 { margin-top:1.5em; }
@media all and (min-width: 768px) {
.path-product .block-system-main-block .form-select,
.path-product #commerce-product-add-to-cart-form .form-actions .button--primary,
.path-product .block-system-main-block .field { width:auto; text-align:left; }
.path-product #commerce-product-add-to-cart-form .form-actions .button--primary {
min-width:10em; text-align:center; }
.zd-product-image,
.Apath-product .splide.splide--field-images--full,
.Apath-product .block-system-main-block .field--type-image { float:left; width:50%; max-width: 600px; margin-right:2em; margin-bottom:1em; }
.path-product .block-page-title-block { display:none; }
}
AA.view-zd-product-variation-short-text { display:inline-block; }
.view-zd-product-variation-short-text .item-list { padding-left: 0px; }
.view-zd-product-variation-short-text .item-list ul li { padding: 0px; }
.view-zd-product-variation-short-text .item-list ul {
padding-left:2em;
list-style-type: circle;
}
.view-zd-product-variation-short-text a {
color:var(--zd-neutral-color);
text-decoration:underline;
text-decoration-style:dotted;
text-decoration-color: rgba(var(--zd-neutral-color-rgb), 0.2);
}
.zd-full .field--name-body.clearfix:after { clear:none; }
.zd-full .view-zd-product-variation-short-text:after { clear:both; }
.zd-adc-full { margin-top:1em; margin-bottom:1em; }
/* PRODUKTSIDOR slut */
/* PRODUKTLISTNINGAR och WISHLIST-listning */
.block-commerce-wishlist { display:none; }
.zd-views-list .row { margin-left:0px; margin-right:0px; }
.wishlist-items,
.zd-views-list>.view-content {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-gap: 0.5em;
border-bottom:0px solid silver;
border-top:0px solid silver;
}
.zd-views-blog>.view-content>.views-row { max-width:100% !important; }
.zd-views-list .view-header { margin-bottom:1em; }
.zd-views-list .view-footer { margin-top:1em; }
.zd-views-list .view-header img { margin-bottom:1em; }
.zd-views-list .views-row { max-width:100%; }
.zd-views-blog>.view-content { grid-template-columns: repeat(1, 1fr); }
.zd-views-blog.zd-views-old-blogs .zd-teaser-content { padding: 0px; }
.zd-views-blog.zd-views-old-blogs .view-content { margin-bottom: 2em; }
.zd-views-blog.zd-views-old-blogs h2 {
font-size: 90% !important;
margin-top: 2em !important;
}
.zd-views-blog.zd-views-old-blogs p { display: inline; }
.zd-views-blog.zd-views-old-blogs p.podd-link { padding-left:0.5em; }
.zd-views-list.zd-views-smaller-list>.view-content .views-row {
display: grid;
align-content: space-between;
justify-items: center;
font-weight:bold;
}
.view-zd-varumarken .views-field-name { padding:0.5em; }
@media all and (max-width: 479px) {
.wishlist-items, .zd-views-list>.view-content { grid-template-columns: repeat(2, 1fr); }
.zd-views-blog.zd-views-list>.view-content { grid-template-columns: repeat(1, 1fr); }
.zd-views-list.zd-views-smaller-list>.view-content { grid-template-columns: repeat(2, 1fr); }
.zd-list-blog.zd-views-list>.view-content { grid-template-columns: repeat(1, 1fr); }
}
@media all and (min-width: 640px) {
.wishlist-items, .zd-views-list>.view-content { grid-template-columns: repeat(3, 1fr); }
.zd-views-blog.zd-views-list>.view-content { grid-template-columns: repeat(2, 1fr); }
.zd-views-list.zd-views-smaller-list>.view-content { grid-template-columns: repeat(4, 1fr); }
.zd-views-blog>.view-content>.views-row { max-width:none; }
.zd-list-blog.zd-views-list>.view-content { grid-template-columns: repeat(2, 1fr); }
}
@media all and (min-width: 768px) {
.page-vocabulary-varumarke .zd-views-list .view-header .field--type-image { float:left; margin-right: 2em; margin-bottom:2em; }
.wishlist-items, .zd-views-list>.view-content { grid-template-columns: repeat(3, 1fr); }
.zd-views-blog.zd-views-list>.view-content { grid-template-columns: repeat(2, 1fr); }
.zd-views-list.zd-views-smaller-list>.view-content { grid-template-columns: repeat(5, 1fr); }
.zd-list-blog.zd-views-list>.view-content { grid-template-columns: repeat(2, 1fr); }
}
@media all and (min-width: 900px) {
.wishlist-items, .zd-views-list>.view-content { grid-template-columns: repeat(4, 1fr); }
.zd-views-list.zd-views-smaller-list>.view-content { grid-template-columns: repeat(5, 1fr); }
.zd-views-blog.zd-views-list>.view-content { grid-template-columns: repeat(3, 1fr); }
.zd-list-blog.zd-views-list>.view-content { grid-template-columns: repeat(3, 1fr); }
}
@media all and (min-width: 1028px) {
.wishlist-items, .zd-views-list>.view-content { grid-template-columns: repeat(5, 1fr); }
.page-view-zd-search-api .zd-views-list>.view-content { grid-template-columns: repeat(4, 1fr); }
.path-product .zd-views-list.view-zd-variations-on-this-product .view-content { grid-template-columns: repeat(5, 1fr); }
.layout-one-sidebar .zd-views-list>.view-content { grid-template-columns: repeat(4, 1fr); }
.zd-views-list.zd-views-smaller-list>.view-content { grid-template-columns: repeat(6, 1fr); }
.zd-views-blog.zd-views-list>.view-content { grid-template-columns: repeat(3, 1fr); }
.zd-list-blog.zd-views-list>.view-content { grid-template-columns: repeat(3, 1fr); }
}
@media all and (min-width: 1400px) {
}
.zd-carousel>.view-content { display: block; background-color:rgba(var(--zd-body-background-color-rgb), 1); padding:0.5em;}
.zd-list-blog .row {
padding: 0.5em;
border: 0.5em solid rgba(var(--zd-neutral-background-color-rgb), 0.07);
border-radius: var(--zd-block-border-radius);
flex-direction: column;
}
.zd-list-blog .row .zd-image { }
.zd-list-blog .row h3 { min-height: 2.3em; }
.zd-list-blog .row .zd-datum { min-height: 2.3em; }
.zd-views-list .zd-view-list-count {
border-color: rgba(var(--zd-neutral-background-color-rgb), 0.07);
margin-top:0.5em;
padding:0.5em;
padding-left:1em;
font-size:80%;
}
.zd-views-list>.view-footer .zd-view-list-count {
background: rgba(var(--zd-neutral-background-color-rgb), 0.03);
border-color: rgba(var(--zd-neutral-background-color-rgb), 0.07);
color: rgba(var(--zd-neutral-color-rgb), 0.3);
}
.wishlist-item .field--type-entity-reference,
.wishlist-item .field--type-commerce-price,
.zd-product-list .zd-product-price-summary { font-size:1em; margin-bottom:0.5em; font-weight:500; }
.zd-views-list .price.price-with-discount { margin-bottom:0px; margin-top:0px; }
.wishlist-item { display:block; text-align:center; }
.wishlist-item__entity { display:block; }
.wishlist-item,
.zd-views-list > .view-content .views-row,
.zd-carousel .slide {
border:0px solid silver;
border-radius: 0 0 var(--zd-block-border-radius) var(--zd-block-border-radius);
border-radius: var(--zd-block-border-radius);
border:1px solid rgba(var(--zd-neutral-background-color-rgb), 0.17);
border-radius: var(--zd-block-border-radius);
padding:0px; overflow:hidden; background:white;
}
.zd-carousel .slide { width:225px !important; }
.zd-views-list > .view-content .views-row>div { height:100%; }
.zd-views-list .views-row>div.views-field-field-image { height:auto; }
.zd-views-list .form-actions { margin-left:0.3em; margin-right:0.3em; }
.zd-views-list .form-actions, .zd-views-list .field,
.zd-views-list .views-field { text-align:center; }
.zd-views-list .view-content a {
color:var(--zd-neutral-color); text-decoration:none; }
.zd-view-list-keep-links-colored a,
.zd-views-list.zd-view-list-keep-links-colored a {
color:var(--bs-link-color) !important;
text-decoration:underline !important;
}
.zd-views-list .view-header { margin-bottom:1em; }
.zd-views-list .view-header .field { text-align:left; }
.wishlist-item .form-actions, .zd-views-list .form-actions,
.zd-views-list .field--name-field-stock { margin-bottom:0px !important; text-align:center; }
.zd-views-list .field--type-image { margin:0px; }
.wishlist-items .field--type-image img,
.zd-views-list .form-actions .button { width:100%; font-size:3.5vw; font-weight:500; }
.zd-views-list .field--name-product-id,
.zd-views-list .views-field-name { font-weight:bold; margin:0.5em; }
.Azd-views-list .field--name-title { font-size:0.9em; padding-left:0.5em; padding-right:0.5em; }
@media all and (min-width: 420px) {
.zd-views-list .form-actions .button { font-size:1rem; }
}
@media all and (max-width: 340px) {
.wishlist-items .field--type-image img, .zd-views-list .form-actions .button { font-size:1em; }
}
/* todo: byt bilder och visa igen! */
.Apage-vocabulary-kategori-gecko .view-zd-term-image-and-description .views-field-field-image { display:none; }
.zd-views-list .view-zd-term-image-and-description .views-field { text-align: left !important; }
.zd-views-list .view-header .view-zd-term-image-and-description img {
width: 100%;
height: 500px;
max-width: 100%;
object-fit: cover;
display: block;
}
.page-vocabulary-varumarke .zd-views-list .view-header .view-zd-term-image-and-description img {
max-width: 300px; height: auto;
}
@media (max-width: 768px) {
.zd-views-list .view-header .view-zd-term-image-and-description img {
height: 300px;
}
}
@media (max-width: 340px) {
.zd-views-list .view-header .view-zd-term-image-and-description img {
height: 200px;
}
}
.zd-teaser-content { padding:1em; text-align:left; }
.zd-views-blog .field { padding-left:0px; text-align: left; }
.zd-views-blog h2 a { color:var(--zd-text-color); text-decoration:none; }
.wishlist-item .form-actions .button { width:100%; }
.wishlist-item__actions [name^="add"] { display:none; } /* göm add-to-cart */
.wishlist-item__actions [name^="remove"] { /* ta bort ur önskelistan */
background:silver;
border:1px solid #bfbfbf;
padding:0!important;
cursor:pointer;
margin-right:0px;
}
.wishlist-item__actions [name^="remove"]::before{ display:none; }
.Azd-views-list .view-filters { display:flex; justify-content: flex-end; margin-bottom:1em; }
.Azd-views-list .view-filters .mb-3 {
margin:0px; margin-bottom:0px !important; margin-left:2em;
text-align:left;
}
.Azd-views-list .view-filters .mb-3#edit-actions { margin:0px; }
.zd-views-list .views-exposed-form { text-align:right; }
.zd-views-list .views-exposed-form .js-form-item { flex:1; }
/* pagination */
.Apagination li.page-item { text-wrap:nowrap; }
.pagination { font-size:80%; }
/* end pagination */
/* se till att varje variation-ruta är vertical-alignad ordentligt */
AA.zd-variation-titles { min-height:5.8em; padding:0em; }
.zd-variation-titles { padding:0em; }
.zd-variations-atc {
display: flex;
align-content: center;
align-items: center;
flex-direction: row;
justify-content: space-between;
}
.zd-variations-atc .commerce-order-item-variation-cart-form-form { width:50%; }
@media all and (min-width: 420px) {
.zd-variations-atc { justify-content: space-evenly; }
}
.zd-variation-text {
display: flex;
flex-flow: column nowrap;
height:100%;
}
.zd-product-box, .Azd-variation-text {
border:1px solid rgba(var(--zd-neutral-background-color-rgb), 0.1);
border-radius: var(--zd-block-border-radius);
border-radius: 15px 15px 5px 5px;
margin:0px;
}
.zd-product-box .zd-variation-text {
border:0px;
padding:1em; padding-top:0px;
}
.zd-views-list .field--type-image img {
border-radius: var(--zd-block-border-radius) var(--zd-block-border-radius) 0 0;
border-bottom:0px solid rgba(var(--zd-neutral-background-color-rgb), 0.03);
box-shadow: 0 1px 5px rgba(var(--zd-neutral-background-color-rgb), 0.03);
width:100%; height:100%;
aspect-ratio: 1;
object-fit: cover;
margin-bottom:0px;
}
.zd-variations-atc #edit-actions,
.zd-variations-atc .form-actions { margin:0px; }
.zd-views-list nav { display:flex; justify-content:center; }
.zd-views-list nav ul { margin-top:1em; }
.zd-views-list nav ul li .page-link,
.zd-views-list nav ul li a { color: rgba(var(--zd-neutral-color-rgb), 0.8); font-size:90%; }
.page-item.active .page-link { color:white; font-weight:bold; }
.Azd-variation-titles, .Azd-variations-atc { margin-left:1em; margin-right:1em; }
.Azd-variations-atc { margin-bottom:1em; }
.zd-variation-titles, .zd-variations-atc { margin:0.5em; margin-top: auto; }
/* Search results */
.zd-product-list .zd-product-read-more,
.zd-product-list .zd-product-price-summary { margin-top:0.5em; }
.zd-product-list .field--name-title a {
text-decoration:none; font-weight:bold;
color: rgba(var(--zd-neutral-color-rgb), 0.8);
}
/* end Search results */
/* PRODUKTLISTNINGAR slut */
/* BREADCRUMBS */
.breadcrumb { margin-top:1em; margin-bottom:0.5em; display:inline-flex; }
ol.breadcrumb { font-size:0.7em; text-transform:uppercase; }
ol.breadcrumb li:first-child a::before { /* hem-ikonen */
content: '';
display: block;
width: 16px;
height: 17px;
background-position-y: 0px;
background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgZmlsbD0iY3VycmVudENvbG9yIiBjbGFzcz0iYmkgYmktaG91c2UiIHZpZXdCb3g9IjAgMCAxNiAxNiI+CiAgPHBhdGggZD0iTTguNzA3IDEuNWExIDEgMCAwIDAtMS40MTQgMEwuNjQ2IDguMTQ2YS41LjUgMCAwIDAgLjcwOC43MDhMMiA4LjIwN1YxMy41QTEuNSAxLjUgMCAwIDAgMy41IDE1aDlhMS41IDEuNSAwIDAgMCAxLjUtMS41VjguMjA3bC42NDYuNjQ3YS41LjUgMCAwIDAgLjcwOC0uNzA4TDEzIDUuNzkzVjIuNWEuNS41IDAgMCAwLS41LS41aC0xYS41LjUgMCAwIDAtLjUuNXYxLjI5M3pNMTMgNy4yMDdWMTMuNWEuNS41IDAgMCAxLS41LjVoLTlhLjUuNSAwIDAgMS0uNS0uNVY3LjIwN2w1LTV6Ii8+Cjwvc3ZnPg==');
}
.breadcrumb-item { display: flex; align-items: center; }
.breadcrumb-item a, .breadcrumb-item.active {
color:var(--bs-breadcrumb-item-active-color);
color:var(--zd-neutral-color);
text-decoration:none;
}
.breadcrumb-item a:hover { text-decoration:underline; }
.block-system-breadcrumb-block { overflow:hidden; }
.block-system-breadcrumb-block .content { padding-left:1em; }
.ui-widget.ui-widget-content { max-width:100%; }
/* GECKO BRANDING-BLOCK */
#block-zdbrandingblock {
background: rgb(240, 240, 240);
padding:1em;
padding-top:2em;
font-size:1.3em;
text-align:center;
text-transform:uppercase;
}
#block-zdbrandingblock .zd-branding-first { font-size:1.5em; font-weight:bold; }
/* slut branding-block */½
/* coupon */
#edit-coupon-redemption-form {
display: flex;
justify-content: flex-start;
flex-wrap: nowrap;
align-content: center;
align-items: flex-end;
}
#edit-coupon-redemption-form button { margin-bottom:1em !important; margin-left:0.5em; }
#block-views-block-zd-show-on-these-domains-block-1 { background: pink; padding:1em; border:1px solid #d7d7d7; font-size:90%; }
/* START stock notifications */
#edit-commerce-stock-notifications #edit-commerce-stock-notifications-notification { border:1px solid silver; padding:1em; font-size: 0.9em; margin-bottom:1em !important; }
#edit-commerce-stock-notifications #edit-commerce-stock-notifications-notification legend { text-transform: uppercase; font-weight: bold; font-size:1em; }
#zd-notify-button .alert-wrapper { display:none; }
#zd-notify-button { margin-bottom:1em; }
#zd-notify-button label { margin-bottom:1em; }
#zd-notify-button #zd-notify-action-button {
color: var(--zd-white-color);
background:rgba(var(--zd-primary-color-rgb), 0.8);
border:1px solid rgba(var(--zd-primary-color-rgb), 0.6);
border-radius:var(--zd-btn-border-radius);
}
#zd-notify-button {
border:1px solid silver; padding:1em; max-width:450px;
border-radius: var(--zd-block-border-radius);
margin-bottom: 0em !important;
}
.zd-notify .js-form-item { margin:0px !important; padding-right:0.5em; }
#zd-notify-button { display:flex; flex-wrap: wrap; margin-top:1em; }
#zd-notify-button #zd-notify-intro { flex: 1 1 100%; }
#zd-notify-button .js-form-item-email { flex: 1 1 200px; margin:0.2em; }
#zd-notify-button .form-type-email { flex: 1 1 200px; margin:0.2em; }
#zd-notify-button .button { flex: 1 1 120px; width:120px; margin:0.2em; margin-bottom: 1rem; }
AA#zd-notify-button #zd-notify-email { flex: 1 1 200px; margin:0.2em; }
AA#zd-notify-button #zd-notify-action-button { flex: 1 1 120px; width:120px; margin:0.2em; margin-bottom: 1rem; }
.zd-dashboard { background:#efefef; display:flex; flex-wrap: wrap; }
.zd-dashboard-box img { margin:1em; max-width:100px; }
.zd-dashboard-box { flex:1 0 30%; max-width:150px; margin:1em; }
/* FRONT PAGE */
.view-zd-promo-paragraphs .views-row { position:relative; padding:0px; }
.view-zd-promo-paragraphs .zd-overlay-base {
position: relative;
display: inline-block;
margin-bottom:1em;
}
/* background: rgba(0, 0, 0, 0.5); color: white; */
/* om vertical-center, använd top: 0; bottom:0px; */
.view-zd-promo-paragraphs .zd-overlay {
position: absolute;
left: 0; right: 0;
bottom: 0;
display: flex;
}
.view-zd-promo-paragraphs .zd-overlay-base,
.view-zd-promo-paragraphs .zd-overlay-base img {
width:100%;
box-shadow: 0 1px 5px #efefef;
}
.view-zd-promo-paragraphs .zd-overlay-inner {
padding:0.5em; font-size:1.3em; color:white;
font-weight:bold;
border-radius:var(--zd-btn-border-radius);
letter-spacing:0.05em; line-height:1.3em;
padding-left:1em; padding-right:1em;
color:rgba(var(--zd-primary-color-rgb), 1);
color:white;
}
.view-zd-promo-paragraphs .zd-overlay-inner a {
color:rgba(var(--zd-primary-color-rgb), 1);
color:white;
text-decoration:none; opacity:1;
}
.view-zd-promo-paragraphs .view-content .row { margin:0px; padding:0px; }
.view-zd-promo-paragraphs .view-content {
display:grid;
grid-gap:1em;
row-gap: 3em;
column-gap: 1em;
grid-template-columns: 1fr;
grid-template-rows: auto;
grid-template-areas: "a" "b" "c" "d";
}
#block-zd-barrio-views-block-zd-first-page-promo-boxes-block-2 .view-content {
grid-template-areas: "a" "b";
}
.view-zd-promo-paragraphs .zd-promo-row-1 { grid-area:a; }
.view-zd-promo-paragraphs .zd-promo-row-2 { grid-area:b; }
.view-zd-promo-paragraphs .zd-promo-row-3 { grid-area:c; }
.view-zd-promo-paragraphs .zd-promo-row-4 { grid-area:d; }
@media all and (min-width: 768px) {
.view-zd-promo-paragraphs .zd-overlay {
top:unset; left: 0; right: 0; bottom: 0;
}
.view-zd-promo-paragraphs .view-content {
grid-template-columns: 1fr 1fr;
grid-template-areas: "a a" "b c" "d d";
grid-template-areas: "a b" "c d";
}
#block-zd-barrio-views-block-zd-first-page-promo-boxes-block-2 .view-content {
grid-template-areas: "a b";
}
.view-zd-promo-paragraphs .zd-overlay-inner {
padding:0.5em; font-size:24px; font-weight:bold;
letter-spacing:0.05em; line-height:1.4em;
padding-left:1em; padding-right:1em;
}
}
.path-frontpage .views-element-container {
margin-top: 2em;
margin-bottom: 2em;
overflow: hidden;
}
/* END Front page */
/* HEADER */
/*
#header .navbar {
display: grid;
grid-gap: 1em;
grid-template-columns: 1fr 6fr 1fr;
padding-top: 0.5em !important;
}
#header .navbar #block-wishlist,
#header .navbar .search-block-form { display:none; }
#header .navbar .navbar-brand { text-align:center; margin:0px; }
#header .navbar .navbar-brand img { width:100%; max-width:500px;
max-height: 70px;
object-fit: scale-down;
}
.navbar-toggler:focus {
box-shadow: 0 0 0 1px!important;
}
#top-header .region {
background:rgba(var(--zd-primary-color-rgb), 1);
color: white;
font-size: 12px;
text-transform: uppercase;
letter-spacing: 0.02em;
}
#navbar-main .navbar-toggler { grid-column:1; grid-row:1; }
#navbar-main #block-cart { grid-column:3; grid-row:1; }
#navbar-main #block-zd-barrio-site-branding { grid-column:2; grid-row:1; }
*/
#block-cart { text-align:center; }
.vocabulary-varumarke .field--name-name { display:none; }
.item-list ul li { margin:0px; padding:0.5em; padding-left:0px; border:0px; }
/* search page */
.block-system-main-block #search-form .form-wrapper label { display:none; }
.block-system-main-block #search-form .form-type-search { margin-bottom:0px !important; }
.block-system-main-block #search-form .form-wrapper { margin-bottom:1em; }
.block-system-main-block #search-form .search-help-link { margin:0.5em; }
.block-system-main-block #search-form .form-wrapper {
max-width: 450px;
display: grid;
grid-gap: 1em;
grid-template-columns: 3fr 1fr;
}
/* breda sidor.. */
/*
.main-content section {
border: 1px solid rgba(var(--zd-neutral-color-rgb), 0.01);
width: 700px;
margin-left: auto;
margin-right: auto;
padding:1em;
padding-top:0px;
}
*/
/* sidebars */
@media (min-width: 768px) {
.col-md-4 { width: 20%; }
}
#horizontal-menu .block-superfish, #horizontal-menu { padding:0px; }
#horizontal-menu .row, #horizontal-menu-wrapper {
background: rgba(var(--zd-primary-color-rgb), 0.8);
}
#horizontal-menu ul.menu { display:flex; justify-content: space-evenly; }
#horizontal-menu ul.menu li.menuparent {
text-align:center;
border:1px solid rgba(var(--zd-primary-color-rgb), 0.2);
flex-grow:1;
letter-spacing:0.05em; text-transform:none;
font-size:0.85em;
}
#horizontal-menu ul.menu li.menuparent:hover,
#horizontal-menu ul.menu li.menuparent.sfHover {
background:white;
text-decoration:underline;
border-left:0px; border:right:0px;
}
#horizontal-menu ul.menu a {
color:white;
text-decoration:none;
}
#horizontal-menu ul.menu a:hover,
#horizontal-menu ul.menu .sfHover a,
#horizontal-menu ul.menu ul a {
color:rgba(var(--zd-primary-color-rgb), 0.9);
}
#horizontal-menu ul.menu ul li:hover {
box-shadow: 0 1px 5px rgba(var(--zd-primary-color-rgb), 0.2);
}
#horizontal-menu ul.menu li.menuparent ul {
background: white;
top:3em; text-align:center;
width: 100% !important;
box-shadow: 0 1px 5px rgba(var(--zd-primary-color-rgb), 0.2);
}
.zd-term-link-list { display:flex; flex-wrap:wrap; }
.zd-term-link-list .zd-term-tag { margin-right:1em; }
.zd-term-link-list .field__item { display:inline-block; }
.zd-term-link-list .zd-term-varumarke { font-weight:bold; }
.zd-term-link-list a, .view-zd-subterms a {
padding:1em;
background:rgba(var(--zd-neutral-background-color-rgb), 0.02);
border-radius: var(--zd-btn-border-radius);
border:1px solid rgba(var(--zd-neutral-background-color-rgb), 0.1);
text-decoration:none;
color: var(--zd-neutral-color-rgb);
font-size:0.8em; text-transform:uppercase;
line-height:4.2em;
}
/* line-height:4em; */
.zd-variation-tags-title { font-style:italic; margin-right:1em; }
.zd-variation-tags {
margin:0.5em; display:inline-block;
display: flex;
justify-content: flex-start;
align-items: center;
}
.Aview-zd-subterms a { font-size:0.8em; float:left; text-transform:uppercase; margin:0.5em; }
.zd-term-link-list.view-zd-subterms a { }
.Aview-zd-subterms .view-content { display:block; }
.Aview-zd-subterms .views-row { display:inline; }
.zd-term-link-list .views-row, .view-zd-subterms .views-row { width:auto; overflow:visible; border:0px; }
.view-zd-subterms .view-header:after { clear:both; }
.zd-product-label-sale { position:relative; display:block; }
.zd-product-label-sale::before {
content: attr(data-label-text);
position: absolute;
left: 0;
top: 3em;
background-color: rgba(var(--zd-sales-color-rgb), 0.7);
color: #ffffff;
padding: 0.5em;
text-transform: uppercase;
}
.zd-product-label-sale-full::before {
content: attr(data-label-text-full);
padding: 1em;
padding-right:1.25em;
font-weight:bold;
font-size:1.1em;
}
.zd-product-label-sale-cart::before,
.zd-product-label-sale-zd_lists::before {
top:0.8em; font-size:0.8em;
}
.zd-product-label-sale.zd-product-label-sale-zd_list_variations_on_vara::before { top:2em; }
/* göm sidan på 'Payment' */
/* behövs inte eftersom det funkar att gå tillbaka!! */
.Azd-checkout-payment .region-horizontal-menu .block li,
.zd-checkout-payment .region-horizontal-menu li.menuparent,
.zd-checkout-payment .navbar-toggler-icon,
.zd-checkout-payment .block-commerce-cart,
.zd-checkout-payment #block-wishlist,
.zd-checkout-payment #top-header-wrapper,
.zd-checkout-payment #highlighted-wrapper { display:none; }
.zd-checkout-payment .region-horizontal-menu { height:2.5em; }
.paragraph--type--zd-img-with-caption-and-alignmen {
overflow:hidden;
display:flex; flex-direction:column;
margin:1em;
margin-left:0px;
max-width:450px;
border:1px solid rgba(var(--zd-neutral-background-color-rgb), 0.05);
border-radius: var(--zd-block-border-radius);
}
.paragraph--type--zd-img-with-caption-and-alignmen .field--type-image { margin:0px; }
.paragraph--type--zd-img-with-caption-and-alignmen .zd-image {
box-shadow: 0 1px 5px rgba(var(--zd-neutral-background-color-rgb), 0.03);
}
.paragraph--type--zd-img-with-caption-and-alignmen .field--name-field-title {
font-size:85%; letter-spacing:0.01em; margin:1em; margin-top:0.5em;
}
@media (min-width: 768px) {
.zd-align-right.paragraph--type--zd-img-with-caption-and-alignmen { max-width:50%; float:right; margin-left:2em; }
}
section.field--type-comment {
font-size:90%; padding:1.5em; margin:1em;
border:1px solid rgba(var(--zd-neutral-background-color-rgb), 0.05);
background:rgba(var(--zd-neutral-background-color-rgb), 0.03);
margin-top:3em;
}
.zd-help-on-form { font-style:italic; }
.paragraph--type--zd-blog-paragraph { clear:both; }
.node--type-article .field--name-field-image .image-style-wide {
margin-bottom:1em;
}
.comment-comment-form .js-filter-wrapper { display:none; }
.comment .comment__meta { font-size:90%; padding-top:2em; }
.comment .comment-author { font-weight:bold; }
.comment .card { width: auto; }
.comment.zd-threaded .card { margin-left:2em; }
.comment .comment__permalink, .comment .comment__time, .comment .card-title { display:none; }
.comment .card-body { padding-bottom:0px;}
.comment .card-body p { margin-bottom:0.5em;}
.comment .comment__meta { text-align:left; padding-left:0.5em; width:auto; }
.comment { display:block; }
.comment.zd-threaded .comment__meta { margin-left:2em; }
.comment .comment-changed::before { content: ", "; }
@media all and (min-width: 980px) {
.comment { display: grid; grid-template-columns: 150px 1fr; }
.comment.zd-threaded .comment__meta { margin-left:2em; }
.comment__meta span { display: block; }
.comment .comment-changed::before { content: none; }
}
.comment-add.nav-link { display: none; }
.zd-no-cookies img { margin-bottom:1em; }
.toolbar-oriented .toolbar-bar { z-index:5000; }
#Ablock-zd-barrio-content {
background:rgba(var(--zd-neutral-background-color-rgb), 0.03);}
#block-zd-barrio-content .view-header .zd-term-link-list {
border-bottom: 1px solid rgba(var(--zd-neutral-background-color-rgb), 0.03);
/* background:rgba(var(--zd-neutral-background-color-rgb), 0.03); */
}
@media (min-width: 640px) {
#block-zd-barrio-content .zd-full,
#block-zd-barrio-content .view-filters,
#block-zd-barrio-content .view-content,
#block-zd-barrio-content .navigation { padding:0.5em;
}
}
.zd-product-image .main-image { padding-top:0.5em; }
.zd-product-image .splide--nav .slide { width: auto !important; }
.zd-product-info { overflow:hidden; }
.zd-visible-admin-only { background: #ADD8E6; padding:0.5em; }
.zd-hidden {display:none !important; }
.ckeditor-accordion-toggle { right:11px; left:auto !important; }
.ckeditor-accordion-container > dl dt > a, .ckeditor-accordion-container > dl dt > a:not(.button) {
padding-left:0px; text-decoration:none; background:none; border:0px;
padding-top:1em; padding-bottom:1em; padding-right:1.5em;
color: var(--zd-text-color);
}
.ckeditor-accordion-container > dl dt > a:hover, .ckeditor-accordion-container > dl dt > a:not(.button):hover {
background:none; font-weight:bold;
color: var(--zd-text-color);
}
.ckeditor-accordion-container > dl { border:none; }
.ckeditor-accordion-container dl {
border-bottom:1px solid rgba(var(--zd-neutral-background-color-rgb), 0.2);
}
.ckeditor-accordion-container dt {
border-top:1px solid rgba(var(--zd-neutral-background-color-rgb), 0.2);
}
.site-footer .container-xl,
.featured-bottom .container-xl {
margin:0px; margin-left:auto; margin-right:auto;
padding-left:0px !important; padding-right:0px !important;
}
.site-footer .container-xl .site-footer__top,
.featured-bottom .container-xl .row { margin-left:0px; margin-right:0px; }
.featured-bottom .container-xl .region-featured-bottom-first {
padding-left:1em; padding-right:1em; padding-bottom:2em;
}
.site-footer .container-xl .region-footer-fourth {
padding-left:2em; padding-right:2em; padding-bottom:0px;
}
.region-featured-bottom-second .block p,
.region-featured-bottom-second .block,
.region-footer-second .block,
.region-footer-third .block,
.site-footer .region-footer-fourth .block { margin:0px; }
.region-featured-bottom-second .block { padding:2em; }
/* länk-block i footern */
.region-footer-second .ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle:before,
.region-footer-second .ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle:after {
background: var(--zd-text-color);
}
.region-footer-second .ckeditor-accordion-container .ckeditor-accordion-toggler { padding-left:1em; }
.node--type-article .field--name-body dd { font-weight:normal; }
.node--type-article .field--name-body { font-weight:bold; letter-spacing:0.01em; }
/* footer */
.site-footer { padding:0px; background:none; }
.site-footer__top .row { margin:0px; width: 100%; }
.site-footer .menu--footer .navbar-nav ul { padding-left:1.5em; }
.site-footer .menu--footer .navbar-nav .menu-item--expanded .nav-link {
font-weight:bold; }
.site-footer .menu--footer .navbar-nav .menu-item--expanded .menu .nav-link {
font-weight:normal; }
.site-footer .menu--footer .navbar-nav .nav-link { padding:0.3em; }
.view-zd-term-image-and-description .views-row { border:0px; }
/* eu-cookie-compliance-banner */
.eu-cookie-compliance-banner, .eu-cookie-withdraw-wrapper {
border-top:3px dashed rgba(var(--zd-primary-color-rgb), 0.8);
background: var(--zd-white-color);
color: var(--zd-black-color);
}
.eu-cookie-compliance-banner .popup-content,
.eu-cookie-withdraw-banner .popup-content {
display: flex;
align-items: center; /* flex-start; */
padding-bottom:1em;
}
.eu-cookie-compliance-message { max-width: none; }
.eu-cookie-compliance-message, .eu-cookie-compliance-buttons,
.eu-cookie-compliance-banner #popup-text,
.eu-cookie-compliance-banner #popup-buttons { float:none; max-width:none; }
.eu-cookie-compliance-message p { font-size:1em; font-weight:normal; }
.eu-cookie-compliance-buttons { display:grid; justify-items: start; }
.eu-cookie-compliance-buttons button, .eu-cookie-compliance-banner button {
margin:0.5em; padding:0.5em;
box-shadow: 0 1px 5px #efefef;
max-width:220px;
border-radius: var(--zd-block-border-radius);
}
.eu-cookie-compliance-banner .agree-button {
color:white;
background:rgba(var(--zd-button-color-rgb), 1);
border-color:rgba(var(--zd-button-color-rgb), 0.8);
}
.eu-cookie-compliance-buttons .eu-cookie-withdraw-button,
.eu-cookie-compliance-more-button,
.eu-cookie-compliance-banner .decline-button {
color:white;
background-color:rgba(var(--zd-neutral-background-color-rgb), 0.4);
border-color:rgba(var(--zd-neutral-background-color-rgb), 0.1);
}
.eu-cookie-compliance-more-button { display:none; }
.eu-cookie-withdraw-tab {
transform: translate(0%, -100%);
left: 1em;
background-color:rgba(var(--zd-neutral-background-color-rgb), 0.4);
border: 1px solid rgba(var(--zd-neutral-background-color-rgb), 0.1);
color:white;
font-size:80%;
border-radius: var(--zd-block-border-radius);
box-shadow: 0 1px 5px #efefef;
}
/* mailerlite */
body > iframe {
padding:2em !important;
margin-left: auto;
margin-right: auto;
background-color:rgba(var(--zd-neutral-background-color-rgb), 0.7);
}
.ml-nbx { max-width:95% !important; margin-left: auto !important; margin-right: auto !important; }
.ml-form-embedWrapper {
background-color:rgba(var(--zd-neutral-background-color-rgb), 0.03) !important;
border: 2px solid rgba(var(--zd-neutral-background-color-rgb), 0.06) !important;
border-radius: var(--zd-block-border-radius) !important;
padding:1em;
}
.ml-form-embedWrapper h4, .ml-form-embedWrapper p {
color:var(--zd-black-color) !important;
}
.ml-form-recaptcha {margin:1em !important; }
.ml-form-embedWrapper.embedForm { max-width:none !important; }
.ml-form-embedWrapper .ml-form-recaptcha { float:none !important; text-align:center; }
.ml-form-embedSubmit button.primary {
margin:0em;
padding:0.5em;
box-shadow: 0 1px 5px #efefef;
width:100%;
border-radius: var(--zd-block-border-radius);
color:white;
background-color:rgba(var(--zd-primary-color-rgb), 1) !important;
/* gå in i html-koden fr Mailerlite och ta bort den hårdkodade bakgrunden */
border-color:rgba(var(--zd-primary-color-rgb), 0.8);
}
@media (max-width: 767px) {
.ml-nbx .sm-only\:\!hidden { display:none!important }
.ml-nbx .sm-only\:\!pb-\[2rem\] { padding-bottom: 2rem!important }
.ml-nbx .sm-only\:\!pt-\[2\.5rem\] { padding-top: 2.5rem!important }
}
.zd-general-cookie-handling { text-align: center; }
#block-zd-barrio-zdgeneralcookiehandling {
background: rgba(var(--zd-primary-color-rgb), 0.4);
margin:0px; text-align:center;
margin-bottom:0.5em; margin-top:0.5em;
background: rgba(var(--zd-primary-white-rgb), 1);
}
.site-footer .zd-mailerlite a {
display: inline-block;
padding: 10px 20px;
background:rgba(var(--zd-primary-color-rgb), 1);
background:#D95D39;
color: white;
letter-spacing: 0.1em;
text-transform:uppercase;
text-align: center;
text-decoration: none;
border-radius: 3px;
font-size: 12px;
font-family: Arial, sans-serif;
border: 1px solid rgba(var(--zd-primary-color-rgb), 0.6);
border: 1px solid #DA5E40;
cursor: pointer;
box-shadow: 0 1px 5px #efefef;
box-shadow: 0px 0px 5px 2px #cfcfcf;;
}
/* Hover effect */
.site-footer .zd-mailerlite a:hover {
background-color: rgba(var(--zd-primary-color-rgb), 0.3);
background-color: #E6724B;
border-color: rgba(var(--zd-primary-color-rgb), 0.4);
border-color: #E47049;
color: white;
}
.js-form-item-contact-information-zd-mailerlite-subscribe {
margin:1em;
}
/* blockquote */
blockquote {
background: rgba(var(--zd-neutral-background-color-rgb), 0.03);
border-left: 2px solid rgba(var(--zd-neutral-background-color-rgb), 0.06);
font-style: italic;
margin: 0.5em; margin-bottom:1em;
padding: 1em;
}
blockquote p { margin:0px; }
blockquote:before {
color: 2px solid rgba(var(--zd-neutral-color-rgb), 0.1);
content: "\201C";
font-size: 2em; margin-right: 0.2em; float:left;
}
Ablockquote:after {
content: "\201D";
}
/* woorise */
iframe.e-woorise { width:100%; max-width:600px; }
.zd-main-tooltip-wrapper {
position: relative; display: inline-block;
min-width:250px;
}
.zd-tooltip-wrapper { position: relative; display: inline-block; width: 100%; }
.zd-tooltip-text {
visibility: hidden;
width: auto;
background-color: rgba(0, 0, 0, 0.7);
color: #fff;
text-align: center;
border-radius: 5px;
padding: 5px;
position: absolute;
z-index: 1;
bottom: 125%;
left: 50%;
margin-left: -100px;
opacity: 0;
transition: opacity 0.3s;
min-width:150px;
}
.zd-tooltip-wrapper:hover .zd-tooltip-text { visibility: visible; opacity: 1; }
.zd-main-tooltip-wrapper:hover .zd-tooltip-text { visibility: visible; opacity: 1; }
/* kund-sidan med orderstatus */
.zd-order-status-products {
margin:1em;
}
.zd-order-status-product {
display: grid;
grid-template-areas:
"img name"
"img descr";
grid-template-columns: auto 1fr;
gap: 10px;
align-items: center;
box-shadow: 0 1px 5px #efefef;
width:100%;
border-color:rgba(var(--zd-button-color-rgb), 0.8);
--bs-btn-border-radius: var(--zd-btn-border-radius);
margin-bottom:1em;
}
.zd-order-status-product-img { grid-area: img; }
.zd-order-status-product-name {
grid-area: name; margin-top:1em;
}
.zd-order-status-product-descr {
grid-area: descr;
margin-bottom:1em;
}
#zd-throbber {
margin-top: 10px;
text-align: center;
font-size: 14px;
color: #555;
}
#zd-throbber::after {
content: '';
display: inline-block;
width: 20px;
height: 20px;
margin-left: 5px;
border: 2px solid #ccc;
border-top-color: #007bff;
border-radius: 50%;
animation: spin 1s linear infinite;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
#block-zd-barrio-site-branding { width: 100%; text-align:center; }
#block-zd-barrio-site-branding img { width: 100%; max-width:300px;}
@media (max-width: 480px) {
.c9g #block-zd-barrio-site-branding .navbar-brand > a {
display: block;
width: 115px;
height: 42px;
background-image: url("../images/logo-gecko.png");
background-repeat: no-repeat;
background-position: center center;
background-size: contain;
margin-left:auto; margin-right:auto;
}
.c9g #block-zd-barrio-site-branding .navbar-brand > a > img {
display: none;
}
}
/* HEADER, OFFCANVAS */
/* off-canvas main header */
.offcanvas .nav { flex-wrap: nowrap; }
@media all and (max-width: 768px) {
.offcanvas .nav { display: block; }
#navbar-main {
display:grid;
grid-template-columns: 80px 1fr 80px;
grid-template-rows: auto auto;
gap:10px;
}
#block-search-exp {
grid-column: 1/4;
grid-row: 2;
}
#block-zd-barrio-site-branding {
grid-column: 2;
grid-row: 1;
}
#block-zd-barrio-cart, #block-cart {
grid-column: 3;
grid-row: 1;
}
.navbar-toggler.collapsed, #CollapsingNavbar {
grid-column: 1;
grid-row: 1;
}
.block-superfish { display: none; }
/* SEARCH BLOCK i header */
#block-search-exp form .flex-wrap {
justify-content:center;
display:grid !important;
grid-template-columns: 1fr 100px;
}
.offcanvas { max-width:90%; height:100vh; }
.offcanvas-header { justify-content: flex-end; padding-bottom:0px; }
.offcanvas nav, .offcanvas .block { margin-left:0px; width:100%; padding-bottom:0px; }
.offcanvas .block-hierarchical-taxonomy-menu ul {
list-style-type:none;
padding-left:0px;
}
.offcanvas a {
text-decoration:none;
padding:0px;
color: rgba(var(--zd-neutral-color-rgb), 0.8);
}
.offcanvas .nav-item,
.offcanvas .block-hierarchical-taxonomy-menu li {
line-height: 3em;
padding-left:1em;
}
}
@media all and (min-width: 767px) {
.region-primary-menu { display: flex; }
#navbar-main {
display:grid;
grid-template-columns: 40% 1fr 80px;
grid-template-rows: auto auto;
gap:10px;
}
#block-search-exp {
grid-column: 2;
grid-row: 1;
}
#block-zd-barrio-site-branding {
grid-column: 1;
grid-row: 1;
text-align:left;
}
#block-cart {
grid-column: 3;
grid-row: 1;
text-align:right;
}
#CollapsingNavbar {
grid-column: 1/4;
grid-row: 2;
background:red;
}
#block-search-exp form .flex-wrap {
display: block !important;
width: 100%;
}
#block-zd-barrio-main-menu,
#block-zd-barrio-kategorimenudrangens { display:none; }
.region-primary-menu { width: 100%; }
.block-hierarchical-taxonomy-menu { width: 100%; }
.Ablock-hierarchical-taxonomy-menu ul {
list-style-type: none;
margin: 0.5em;
width: 100%;
padding:0px;
}
.Ablock-hierarchical-taxonomy-menu ul.hierarchical-taxonomy-menu {
list-style-type: none;
display:flex;
width: 100%;
justify-content: space-evenly;
}
.block-hierarchical-taxonomy-menu > ul > li:hover { background:#f3f3f3; }
.block-hierarchical-taxonomy-menu ul ul a {
font-weight:normal; padding-top:0.5em; padding-bottom: 0.5em; }
.sf-menu { width: 100%; }
.sf-menu li { background: white; text-align: center; flex: 1; }
.sf-menu ul li, .sf-menu ul ul li { text-align: left; white-space: normal;
word-wrap: break-word; }
.sf-menu ul { padding-left: 0.3em; margin-left: 0.2em; }
.sf-menu ul, .sf-menu ul ul {
background: rgba(var(--zd-neutral-background-color-rgb), 0.5);
background: white;
}
.sf-menu ul li, .sf-menu ul ul li {
background: rgba(var(--zd-primary-background-color-rgb), 0.5);
background: white;
}
.sf-menu li.sfHover,.sf-menu li:hover{
background: rgba(var(--zd-primary-background-color-rgb), 0.7);
background: white;
}
}
.offcanvas a, .sf-menu a {
color:#222; text-decoration:none; text-transform:uppercase;
font-weight:bold; letter-spacing:2px;
font-size:80%;
}
.sf-menu a { padding: 1em; }
@media all and (max-width: 424px) {
#navbar-main {
display:grid;
grid-template-columns: 40px 1fr 40px;
grid-template-rows: auto auto;
gap:10px;
}
#block-zd-barrio-site-branding {
grid-column: 2; grid-row: 1;
text-align:left;
}
#block-search-exp { grid-column: 1/4; grid-row: 2; }
#block-zd-barrio-varukorg, #block-cart { grid-column: 3; grid-row: 1; }
.navbar-toggler.collapsed, #CollapsingNavbar { grid-column: 1; grid-row: 1; }
#block-search-exp form .flex-wrap {
display: block !important;
width: 100%;
}
.navbar-brand { margin:0px; }
}
.cart-block--summary__icon img {
filter: none;
transition: filter 0.1s ease;
}
.cart-block--link__expand:hover .cart-block--summary__icon img,
.cart-block--link__expand:focus-visible .cart-block--summary__icon img {
filter: invert(40%) sepia(18%) saturate(1260%) hue-rotate(68deg) brightness(89%) contrast(88%);
}
.navbar-toggler { padding-left: 0px; }
@media all and (min-width: 980px) {
#navbar-main {
grid-template-columns: 320px 1fr 120px;
}
#block-search-exp form .flex-wrap {
display: grid !important;
grid-template-columns: 1fr 100px;
}
#block-search-exp .form-actions { display: inline-block; }
}
.highlighted .search-block-form .content { display:block; }
.highlighted .views-exposed-form label { display:none; }
.highlighted .views-exposed-form .flex-wrap {
display:flex; justify-content:space-around; width:100%;
padding:0.5em;
padding-top:0.3em;
flex-wrap:nowrap !important;
max-width:500px;
margin-left:auto; margin-right:auto;
}
.highlighted .form-type-textfield { width:100%; }
.highlighted .views-exposed-form div,
.highlighted .search-form div { margin:0px !important; }
.highlighted .views-exposed-form input,
.highlighted .search-form .form-type-search input {
border-radius: var(--zd-block-border-radius) 0 0 var(--zd-block-border-radius)!important;
}
.highlighted .views-exposed-form button.btn {
margin-right:0px;
}
.highlighted .views-exposed-form button,
.highlighted .search-form .form-type-search input {
padding: 0.375rem 0.75rem;
font-size: 1rem;
line-height: 1.5;
max-height:2.25em;
max-height:2.4em;
}
.highlighted .views-exposed-form button,
.highlighted .search-form button {
border-radius: 0px var(--zd-block-border-radius) var(--zd-block-border-radius) 0px !important;
text-indent: -999px;
overflow: hidden;
width: 4em;
border: 1px solid rgba(var(--zd-neutral-background-color-rgb), 0.25);
border-left:0px;
background: rgba(var(--zd-neutral-background-color-rgb), 0.20) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'%3E%3C/path%3E%3C/svg%3E") no-repeat center;
cursor: pointer;
opacity: 0.4;
}
.highlighted .search-form button,
.highlighted .search-form .form-type-search input {
height:2.4em;
}
.zd-variation-list form.views-exposed-form .flex-wrap { gap:0.5em; align-items: flex-end; }
.zd-variation-list form.views-exposed-form #edit-actions,
.zd-variation-list form.views-exposed-form .form-actions {
display:none;
}
.zd-variation-list form.views-exposed-form .form-type-select {
display:block;
}
.zd-variation-list form.views-exposed-form .form-type-select label {
text-align:left;
width: 100%;
font-size: 70%;
text-transform: uppercase;
}
@media all and (min-width: 768px) {
.highlighted { padding:0px; }
#Aheader .navbar .search-block-form { display:block; }
}
.highlighted .alert hr,
.highlighted .alert .alert-heading { display:none; }
/* slut HEADER */
.offcanvas li>ul>li.menu-item--expanded.active>a {
font-weight:bold;
}
.Aoffcanvas li>ul>li>ul { margin-top:0px; }
.Aoffcanvas li>ul>li>ul>li>a::before { padding-left:0.5em; }
.Aoffcanvas li>ul>li>ul>li>a::before,
.hierarchical-taxonomy-menu ul li.menu-item--expanded>a::after {
content: '';
display: inline-block;
width: 0;
height: 0;
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
border-left: 5px solid rgba(var(--zd-neutral-background-color-rgb), 0.2);
margin-left: 0.5em;
vertical-align: middle;
margin-bottom: 3px;
}
.sf-menu ul li:first-child>a::after,
.hierarchical-taxonomy-menu ul li:first-child a::after {
content: '\2605'; /* Unicode for the star symbol (★) */
float:right;
color:gold;
margin-left: 0.5em;
border:none;
}
.sf-arrows .sf-with-ul:after {
}
.hierarchical-taxonomy-menu ul li a {
margin-left:1em;
font-size:80%;
}
.hierarchical-taxonomy-menu ul li li a {
font-size:75%;
}
.hierarchical-taxonomy-menu ul li {
border-top: 1px solid rgba(var(--zd-neutral-background-color-rgb), 0.1);
align-items: center;
}
.Ahierarchical-taxonomy-menu ul li:first-child {
margin-top: 0.5em;
}
.hierarchical-taxonomy-menu ul li:last-child {
border-bottom: 1px solid rgba(var(--zd-neutral-background-color-rgb), 0.1);
margin-bottom: 0.5em;
}
/* GÖM alla länkar på betalningssidan för att tvinga dem att använda 'Tillbaka'-knappen */
/* annars försvinner kundvagnen.. */
.zd-checkout-payment .block-views-exposed-filter-blockzd-search-variations-page-1, /* sök */
.zd-checkout-payment .offcanvas, /* menyn header */
.zd-checkout-payment .region-footer-second /* menyn footer */
{ display:none; }
.sidebar .block { border:1px solid rgba(var(--zd-neutral-background-color-rgb), 0.1); font-weight:normal; }
.sidebar .block img { width:100%; height:auto; }
sidebar .zd-teaser-content .field--name-body,
.sidebar .views-row .field--name-body, .sidebar h2 a {
font-weight:normal !important; }
.sidebar h2 { border:0px; letter-spacing: 0.03em;}
.sidebar a { color:black; text-decoration:none; }
.sidebar .view-zd-blog-roll .views-row { margin-bottom:2em; }
.block-views-blockzd-blog-roll-block-1 h2 { font-weight:bold; }
@media all and (max-width: 768px) {
.block-views-blockzd-blog-roll-block-1 .view-content {
display:grid; grid-template-columns: 1fr 1fr 1fr; }
}
@media all and (max-width: 576px) {
.block-views-blockzd-blog-roll-block-1 .view-content {
display:grid; grid-template-columns: 1fr 1fr; }
}
@media all and (max-width: 320px) {
.block-views-blockzd-blog-roll-block-1 .view-content {
display:grid; grid-template-columns: 1fr; }
}
img.zd-blog-image { max-width: 500px; }
/* start Carousel */
.splide { padding-left: 0px; padding-right: 0px; }
.Asplide__slider {
background:rgba(var(--zd-primary-color-rgb), 0.03);
margin-bottom:2em;
padding:1em;
}
.splide--nav .splide__arrows { display:none; }
.splide__slider li {margin:0.1em; }
.path-product .splide--field-images--full .splide__slider { padding: 0px; }
.splide__slide>div { height: 100%; }
.zd-carousel ul.splide__list { padding-right: 3em !important; } /* ger halv slide */
.splide__arrows {
position: absolute;
top: -45px;
right: 0;
display: flex;
gap: 10px;
z-index: 10;
text-align: right;
}
.path-product .splide--field-images--full .splide__arrows {
top: 0px;
margin:2px;
background: rgba(var(--zd-white-color-rgb), 0.9);
}
.splide__arrow.splide__arrow--prev svg { transform: rotate(180deg); }
.splide__arrow svg {
width: 1.2em;
height: 1.2em;
fill: rgba(var(--zd-neutral-background-color-rgb), 0.5);
transition: fill 0.3s ease;
}
.splide__arrow svg:hover {
fill: rgba(var(--zd-neutral-background-color-rgb), 0.8);
}
.splide__arrows button {
border: 0px;
background: none;
margin: 0.5em;
}
ul.splide__pagination, .splide__pagination { display:none !important; }
.zd-carousel .view-header { display:none; }
.Azd-carousel { margin-top: -2.5em; } /* för att komma i linje med h2-rubriken */
/* end Carousel */
/* sliders på förstasidan */
#block-zd-barrio-views-block-zd-variations-block-2,
#block-zd-barrio-views-block-zd-variations-block-1 {
padding-top:1em; padding-bottom:1em;
}
.view-zd-supplier-order-items-on-order table tr th { color: black !important; }
.cookie-notice .cm-btn.cm-btn-danger {
background-color: var(--zd-disabled-color) !important;
border-color: var(--zd-disabled-border-color) !important;
padding-top: 5px !important;
padding-bottom: 7px !important;
}
@media all and (max-width: 768px) {
.zd-taxonomy-menu-desktop { display:none !important; }
.zd-taxonomy-menu-mobile { display:block !important; }
.zd-term-link-list .views-row { padding-right: 0px; }
}
@media all and (min-width: 768px) {
.zd-taxonomy-menu-mobile { display:none !important; }
.zd-taxonomy-menu-desktop { display:flex !important; margin-bottom:0px; }
}
/* ZD MAILERLITE POPUP */
/* ====== Bas: modal-overlay + dialog ====== */
.block-zd-barrio-zd-mailerlite-newsletterformpopup-modal {
position: fixed;
inset: 0;
display: grid;
place-items: center;
padding: 2rem;
background: rgba(0,0,0,.65);
z-index: 10000; /* över det mesta, men justera vid behov */
font-size: 120% !important;
}
.Aspb-popup-main-wrapper {
background: url("../images/veckobrev-bg.jpg") no-repeat center center !important;
background: url("../images/veckobrev-bg.gif") no-repeat center center !important;
background-size: cover !important;
padding: 2em;
padding-top: 4em;
padding-bottom: 4em;
border-radius: 0.5em;
}
.spb-popup-main-wrapper {
background-size: cover !important;
padding: 2em;
border-radius: 0.5em;
}
.spb_center { top: 40% !important; }
/* Själva dialogen (innehållet) */
#block-zd-barrio-zd-mailerlite-newsletterformpopup {
width: min(560px, 100%);
border-radius: 6px;
background: rgba(255,255,255,.95);
box-shadow: 0 20px 50px rgba(0,0,0,.25);
padding: 1.5rem 1.5rem 1.25rem;
position: relative;
animation: spb-pop .18s ease-out;
padding-top:2em;
}
@keyframes spb-pop {
from { transform: translateY(6px) scale(.98); opacity: 0; }
to { transform: translateY(0) scale(1); opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
#block-zd-barrio-zd-mailerlite-newsletterformpopup { animation: none; }
}
/* ====== Formulär ====== */
#block-zd-barrio-zd-mailerlite-newsletterformpopup .form-item-email {
margin: .75rem 0 1rem;
}
#block-zd-barrio-zd-mailerlite-newsletterformpopup .form-item-email label {
font-size:80%;
}
#block-zd-barrio-zd-mailerlite-newsletterformpopup .form-item-email input[type="email"] {
width: 100%;
box-sizing: border-box;
padding: .75rem .9rem;
border: 1px solid #d6d6d6;
border-radius: 10px;
outline: none;
font-size: 1rem;
}
#block-zd-barrio-zd-mailerlite-newsletterformpopup .form-item-email input[type="email"]:focus {
border-color: #1463ff; /* accentfärg vid fokus */
box-shadow: 0 0 0 3px rgba(20,99,255,.18);
}
#block-zd-barrio-zd-mailerlite-newsletterformpopup .form-submit {
display: inline-block;
margin-top: .25rem;
padding: 0.5em 0.8em;
border: 0;
cursor: pointer;
}
#Ablock-zd-barrio-zd-mailerlite-newsletterformpopup .form-submit {
background: var(--zd-link-color); /* länkfärg */
}
#block-zd-barrio-zd-mailerlite-newsletterformpopup .form-submit:hover { filter: brightness(.95); }
#block-zd-barrio-zd-mailerlite-newsletterformpopup .form-submit:active { transform: translateY(1px); }
#block-zd-barrio-zd-mailerlite-newsletterformpopup .form-submit:focus-visible {
outline: 3px solid rgba(20,99,255,.35);
outline-offset: 2px;
}
/* ====== Close / minimize (SPB-klassnamn) ====== */
.block-zd-barrio-zd-mailerlite-newsletterformpopup-modal-close,
.block-zd-barrio-zd-mailerlite-newsletterformpopup-modal-minimize {
position: absolute;
top: .6rem;
width: 36px; height: 36px;
display: grid; place-items: center;
border-radius: 999px;
background: transparent;
border: 0;
cursor: pointer;
}
.block-zd-barrio-zd-mailerlite-newsletterformpopup-modal-close { right: 1em; }
.block-zd-barrio-zd-mailerlite-newsletterformpopup-modal-minimize { right: 2.75rem; }
.block-zd-barrio-zd-mailerlite-newsletterformpopup-modal-close:hover,
.block-zd-barrio-zd-mailerlite-newsletterformpopup-modal-minimize:hover {
background: rgba(0,0,0,.06);
}
.block-zd-barrio-zd-mailerlite-newsletterformpopup-modal-close:focus-visible,
.block-zd-barrio-zd-mailerlite-newsletterformpopup-modal-minimize:focus-visible {
outline: 3px solid rgba(20,99,255,.35);
outline-offset: 2px;
}
/* ====== Minimerad variant ====== */
.block-zd-barrio-zd-mailerlite-newsletterformpopup-modal-minimized {
position: fixed;
right: 1rem; bottom: 1rem;
z-index: 10000;
}
.block-zd-barrio-zd-mailerlite-newsletterformpopup-modal-minimized #block-zd-barrio-zd-mailerlite-newsletterformpopup {
width: 320px;
padding: 1rem;
}
/* ====== Override positions (din klass) ====== */
/* Centrera popupen (SPB kan kräva denna override) */
.block-zd-barrio-zd-mailerlite-newsletterformpopup-modal .spb_center {
justify-content: center !important;
align-items: center !important;
}
/* ====== Responsivt småskärm ====== */
@media (max-width: 480px) {
.block-zd-barrio-zd-mailerlite-newsletterformpopup-modal { padding: 1rem; }
#block-zd-barrio-zd-mailerlite-newsletterformpopup { border-radius: 14px; }
}
/* ====== Parent-hook (om du vill särskilja just denna) ====== */
#spb-block-zd-barrio-zd-mailerlite-newsletterformpopup .block-zd-barrio-zd-mailerlite-newsletterformpopup-modal {
/* plats för projektspecifika overrides */
}
.spb-popup-main-wrapper {
background:none;
border:none;
}
.spb-controls button { height: 50px; font-size:1.6em; }
.spb-controls button.spb_minimize { display:none; }
#edit-zd-free-gift--wrapper { margin-top: 1em; margin-bottom: 1em !important; }
#edit-zd-free-gift {
display: flex;
flex-wrap: wrap;
gap: 0px;
column-gap: 5px;
}
#edit-zd-free-gift > p {
flex: 0 0 100%;
margin-bottom: 8px;
}
#edit-zd-free-gift .zd-title { font-weight: bold; }
#edit-zd-free-gift .zd-title-none { padding: 1em; padding-top:80%; }
#edit-zd-free-gift .form-item-zd-free-gift {
align-items: center;
gap: 6px;
padding: 6px 8px;
border: 1px solid #ededed;
border-radius: var(--zd-block-border-radius);
max-width: 180px;
}
#edit-zd-free-gift .form-item-zd-free-gift.disabled {
opacity: 0.9;
border-style: dashed;
}
#edit-zd-free-gift .form-item-zd-free-gift.disabled .form-radio {
display:none;
}
#edit-zd-free-gift .form-radio {
margin: 0px;
border: 2px solid var(--zd-primary-color);
margin-bottom:5px;
}
#edit-zd-free-gift label { max-width: 100%; }
#edit-zd-free-gift .zd-tooltip-text {
margin-left: 0px;
left: 0%;
bottom: 50%;
margin: 5%;
}
#edit-zd-free-gift .form-item-zd-free-gift:hover {
background:rgba(var(--zd-button-color-rgb), 0.1);
}
.zd-free-gift-label,
.zd-free-gift-back-to-cart { font-style: italic; }
.zd-free-gift-note a, .zd-free-gift-back-to-cart a { color: var(--zd-link-color); }
.zd-free-gift-note-heading { font-weight:bold; }
.zd-bestseller-block { padding:0.5em; }
.zd-bestseller-block h2,
#block-zd-barrio-views-block-zd-bestsellers-block-1 h2,
#block-zd-barrio-views-block-zd-bestsellers-block-2 h2 {
margin-top:0px !important;
margin-bottom:0.0em;
}
.zd-bestseller-block .zd-variation-titles { margin-top:0.5em; }
.zd-bestseller-block .views-row {
padding:0.25em !important;
background: rgba(var(--zd-footer-background-color-rgb), 1) !important;
}
.zd-bestseller-block .views-row div { background:white; }
#block-zd-barrio-views-block-zd-bestsellers-block-1,
#block-zd-barrio-views-block-zd-bestsellers-block-2 {
padding:0.5em;
}
#block-zd-barrio-texttillforstasidanfront h1 { margin-top:0px !important; }
#zd-front-hero { position:relative; }
#zd-front-hero .field--name-field-image {
margin:0px;
float:none;
}
@media all and (max-width: 414px) {
#zd-front-hero .field--name-field-image {
margin: 0px;
float: none;
aspect-ratio: 1 / 1;
overflow: hidden;
}
#zd-front-hero .field--name-field-image img {
width: 100%;
height: 100%;
object-fit: cover;
}
}
#zd-front-hero #zd-front-hero-overlay {
position: absolute;
top:0; left: 0; right: 0; bottom: 0;
align-content: center;
}
#zd-front-hero #zd-front-hero-overlay .field--name-field-hero-link,
#zd-front-hero #zd-front-hero-overlay .field--name-field-hero-text {
padding:0.5em; color:white;
font-weight:bold;
letter-spacing:0.05em; line-height:1.3em;
padding-left:1em; padding-right:1em;
color:white;
text-align:center;
max-width:600px;
margin-left:auto;
margin-right:auto;
}
#zd-front-hero #zd-front-hero-overlay .field--name-field-hero-text {
font-size: calc(1.375rem + 1vw);
}
#zd-front-hero #zd-front-hero-overlay .field--name-field-hero-link {
font-size:24px;
}
#zd-front-hero #zd-front-hero-overlay .field--name-field-hero-link a {
color:white;
}
.Azd-full-page-slogan-at-atc {
text-transform: uppercase;
font-size: 70%;
border: 1px solid rgba(var(--zd-button-color-rgb), 0.9);
border-left: 0px;
border-right: 0px;
padding: 1em;
margin: 0px;
margin-top: 0.5em;
letter-spacing: 0.5px;
font-weight: bold;
}
.zd-full-page-slogan-at-atc {
font-size: 85%;
padding: 0em;
margin: 0px;
margin-top: 0.5em;
margin-bottom:0.3em;
letter-spacing: 0.8px;
font-weight: 400;
color: #555;
}
@media (max-width: 414px) {
.zd-full-page-slogan-at-atc {
padding-left: 1em;
padding-right: 1em;
margin-left: auto;
margin-right: auto;
text-align: center;
}
.zd-stock, .zd-stock-text {
padding-left: 0em !important;
padding-right: 0em !important;
margin-left: 0px !important;
text-align: center;
font-weight:700;
}
.zd-stock-text:before { display:none; }
}
/*
.zd-adc-full select {
font-size: 120%;
font-weight: 600;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
border: 0;
background: transparent;
padding: 0;
margin: 0;
color: inherit;
box-shadow: none;
outline: none;
pointer-events: none;
}
.zd-adc-full .zd-adc-inner .form-type-select {
margin: 6px 0 14px 0;
font-size: 15px;
line-height: 1.35;
color: #333;
font-weight: 600;
}
.zd-adc-full .zd-adc-inner .form-type-select::before {
content: "Vald variant: ";
font-weight: 400;
}
*/
a.block-taxonomymenu__link--active {
justify-content: flex-start !important;
text-align: left;
font-weight: 800;
background: rgba(var(--zd-primary-background-color-rgb), 0.7);
margin-left:-1em !important;
}
a.block-taxonomymenu__link--active::before {
content: "» ";
margin-right:1em;
}
@media all and (max-width: 768px) {
.zd-variation-list .zd-variations-atc { display: block; }
.zd-variation-list .zd-variations-atc .commerce-order-item-variation-cart-form-form { width:100%; }
.zd-variation-list .zd-variations-atc .btn {margin-right: 0px; max-width: none; padding:0px; }
.Azd-variation-list .zd-variations-atc .btn { height: 2em; }
.zd-variation-list .zd-variation-stock { display:none; }
.zd-views-list .price.price-with-discount { margin-bottom: 0.5em; }
.zd-views-list .price { font-size:1.2em; font-weight:800; margin-bottom: 0.5em; }
.zd-bestseller-block .zd-variation-stock,
.zd-bestseller-block .zd-variations-atc { display:none; }
}
.zd-giftcard-order-total-info {
text-align:right; font-style: italic; font-size:80%;
line-height:normal;
}
.order-total-line__total, .order-total-line__adjustment--commerce-giftcard {
padding-top: 5px;
font-weight: bold;
}
#edit-commerce-giftcard-redemption-form { margin-bottom: 0px !important; }
details.zd-giftcard-redemption[open] { margin-bottom: 1em; }
.zd-giftcard-redemption__summary {
cursor: pointer;
font-weight: 300;
color: #222;
display: inline-block;
margin-bottom: 0.75rem;
}
.zd-giftcard-redemption__summary:hover {
text-decoration: underline;
}
.zd-giftcard-redemption__content {
margin-top: 0.75rem;
}
.zd-giftcard-redemption input[type="text"] {
max-width: 420px;
}
.zd-giftcard-redemption__table {
width: 100%;
margin-bottom: 1rem;
}
.zd-giftcard-redemption__table th,
.zd-giftcard-redemption__table td {
padding: 0.5rem;
text-align: left;
}
.zd-giftcard-remove-button {
background-color: rgba(var(--zd-neutral-color-rgb), 0.3) !important;
border-color: rgba(var(--zd-neutral-color-rgb), 0.1) !important;
max-width: 100px;
border:0px;
}
@media (max-width: 600px) {
.zd-giftcard-redemption__table,
.zd-giftcard-redemption__table tbody,
.zd-giftcard-redemption__table tr,
.zd-giftcard-redemption__table td {
display: block;
}
.zd-giftcard-redemption__table thead {
display: none;
}
.zd-giftcard-redemption__table tr {
display: grid;
grid-template-columns: 1fr auto;
grid-template-areas:
"code remove"
"used remove"
"remaining remove"
"expiry remove";
gap: 0.15rem 0.75rem;
padding: 0.75rem 0;
border-bottom: 1px solid #ddd;
}
.zd-giftcard-redemption__table td:nth-child(1) {
grid-area: code;
font-weight: 600;
}
.zd-giftcard-redemption__table td:nth-child(2) {
grid-area: used;
font-size: 0.9rem;
}
.zd-giftcard-redemption__table td:nth-child(3) {
grid-area: remaining;
font-size: 0.9rem;
}
.zd-giftcard-redemption__table td:nth-child(4) {
grid-area: expiry;
font-size: 0.9rem;
}
.zd-giftcard-redemption__table td:nth-child(5) {
grid-area: remove;
align-self: center;
text-align: right;
}
.zd-giftcard-redemption__table td:nth-child(2)::before {
content: "Används nu: ";
}
.zd-giftcard-redemption__table td:nth-child(3)::before {
content: "Kvar efter köp: ";
}
.zd-giftcard-redemption__table td:nth-child(4)::before {
content: "Giltigt till: ";
}
.zd-giftcard-redemption__table th,
.zd-giftcard-redemption__table td {
padding: 0;
}
}
@media (max-width: 600px) {
.zd-giftcard-redemption__table,
.zd-giftcard-redemption__table tbody,
.zd-giftcard-redemption__table tr,
.zd-giftcard-redemption__table td {
border: 0;
background: transparent;
box-shadow: none;
}
.zd-giftcard-redemption__table td {
border-bottom: 0;
}
.zd-giftcard-redemption__table tr {
background: rgba(var(--zd-neutral-background-color-rgb), 0.03);
margin-bottom: 0.75rem;
padding: 0.75rem;
border: 1px solid rgba(var(--zd-neutral-background-color-rgb), 0.08);
}
.zd-giftcard-redemption__table td,
.zd-giftcard-redemption__table th {
border: none !important;
}
.zd-giftcard-redemption__table td:nth-child(2),
.zd-giftcard-redemption__table td:nth-child(3),
.zd-giftcard-redemption__table td:nth-child(4) {
padding-top: 0.1rem;
padding-bottom: 0.1rem;
}
}
.zd-giftcard-redemption .btn-primary {
background: rgba(var(--zd-neutral-color-rgb), 0.4);
border: 1px solid rgba(var(--zd-neutral-color-rgb), 0.1);
color: #fff;
max-width: 200px;
}
.zd-giftcard-redemption .btn-primary:hover,
.zd-giftcard-redemption .btn-primary:focus {
background: rgba(var(--zd-neutral-color-rgb), 0.3);
}
@media (max-width: 414px) {
/* Cart + checkout action button layout. */
.path-cart #edit-actions,
.path-checkout #edit-actions {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 0.75rem;
}
/* Remove Bootstrap/theme margins that can offset buttons. */
.path-cart #edit-actions > *,
.path-checkout #edit-actions > * {
margin: 0;
}
/* Force both real buttons and link-buttons to fill the same width. */
.path-cart #edit-actions .button,
.path-cart #edit-actions .btn,
.path-checkout #edit-actions .link--previous,
.path-checkout #edit-actions .button,
.path-checkout #edit-actions .btn {
display: block;
width: 100%;
box-sizing: border-box;
text-align: center;
}
/* Primary action first. */
.path-cart #edit-checkout,
.path-checkout #edit-actions-next {
order: 1;
}
/* Secondary action second. */
.path-cart #edit-submit,
.path-checkout #edit-actions .link--previous,
.path-checkout #edit-actions-back-to-cart {
order: 2;
}
}
/* Hide only the duplicate Drupal alert inside the gift-card redemption pane.
Do not hide checkout/payment/shipping errors elsewhere. */
#edit-commerce-giftcard-redemption-form .alert-wrapper {
display: none;
}
.checkout-pane-payment-information { display:none; }
/* cart icon with count badge. */
.cart-block--summary {
display: flex;
align-items: center;
justify-content: center;
}
.cart-block--summary .cart-block--link__expand {
display: flex;
align-items: center;
justify-content: center;
width: 46px;
height: 46px;
padding: 0;
border: 0;
background: transparent;
color: inherit;
text-decoration: none;
}
.cart-block--summary__icon {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 34px;
height: 34px;
padding-bottom:4px;
}
@media all and (max-width: 768px) {
.cart-block--summary__icon {
padding-bottom:8px;
}
}
.cart-block--summary__icon img {
display: block;
width: 30px;
height: 30px;
object-fit: contain;
}
.block-commerce-cart .cart-block--summary__count {
position: absolute;
top: -8px;
right: -10px;
display: flex;
align-items: center;
justify-content: center;
min-width: 20px;
height: 20px;
padding: 0 5px;
border: 2px solid #fff;
border-radius: 10px;
background: rgba(var(--zd-button-color-rgb), 1);
color: #fff;
font-size: 12px;
font-weight: 700;
line-height: 1;
box-sizing: border-box;
}
/* Search: icon button inside the input box on all screen sizes. */
#block-search-exp form .d-flex {
position: relative;
display: block !important;
}
#block-search-exp .js-form-item-term {
width: 100%;
margin: 0 !important;
}
#block-search-exp .js-form-item-term input {
width: 100%;
height: 37px;
padding-right: 45px;
border-radius: 0;
}
#block-search-exp .form-actions {
position: absolute;
top: 0;
right: 0;
width: 40px;
height: 37px;
margin: 0 !important;
}
#block-search-exp .form-actions .form-submit {
display: block;
width: 40px;
height: 37px;
padding: 0;
border: 0;
border-radius: 0;
background-color: #555;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5' fill='none' stroke='%23fff' stroke-width='2.7'/%3E%3Cpath d='M15.5 15.5L21 21' fill='none' stroke='%23fff' stroke-width='2.7' stroke-linecap='round'/%3E%3C/svg%3E");
background-size: 18px 18px;
background-position: center;
background-repeat: no-repeat;
color: transparent;
font-size: 0;
cursor: pointer;
}
#block-search-exp .form-actions .form-submit:hover,
#block-search-exp .form-actions .form-submit:focus-visible {
background-color: #3c7837;
}
.navbar-toggler-icon {
width: 30px;
height: 30px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3E%3Cpath stroke='%23555555' stroke-linecap='round' stroke-width='3.2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
background-size: 30px 30px;
}
#block-search-exp .form-actions .form-submit {
background-color: #fff;
border-left: 1px solid #f2f2f2;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5' fill='none' stroke='%23555' stroke-width='2.7'/%3E%3Cpath d='M15.5 15.5L21 21' fill='none' stroke='%23555' stroke-width='2.7' stroke-linecap='round'/%3E%3C/svg%3E");
}
#block-search-exp .form-actions .form-submit:hover,
#block-search-exp .form-actions .form-submit:focus-visible {
background-color: #f3f3f3;
}
/* DHL ServicePoint postcode search: input and button on one row. */
.zd-dhl-postcode-search {
display: grid;
grid-template-columns: minmax(7rem, 9rem) minmax(0, 1fr);
align-items: end;
gap: 0.5rem;
}
.zd-dhl-postcode-search .js-form-item {
min-width: 0;
margin-bottom: 0;
}
.zd-dhl-postcode-search input.form-control {
width: 100%;
height: 40px;
}
.zd-dhl-postcode-search .form-submit {
width: 100%;
height: 40px;
margin: 0;
white-space: nowrap;
}
@media (max-width: 380px) {
.zd-dhl-postcode-search { grid-template-columns: 1fr; }
}
/* CART start */
.cart-block--contents { width: 90%; max-width: 250px; }
.zd-cart { }
.zd-cart .views-form { padding: 0px; }
.zd-cart thead { display:none; }
.zd-cart table { font-size: 15px; }
.zd-cart .view-content {
margin-left: auto;
margin-right: auto;
width: 100%;
margin-bottom: 1rem;
}
.zd-cart .view-footer { padding-right:0px; }
.zd-cart .views-row, .zd-cart table tr {
background: rgba(var(--zd-neutral-background-color-rgb), 0.03);
margin-bottom: 0.3em;
border: 1px solid rgba(var(--zd-neutral-background-color-rgb), 0.08);
border-left: 0px;
border-right: 0px;
display:grid;
align-items: start;
padding: 0.5em;
}
.zd-cart .views-row .views-field-total-price__number { text-align:right; }
.zd-cart table td {
border:0px; border-bottom-width:0px;
}
.zd-cart a { color: var(--zd-text-color); text-decoration:none; }
.zd-cart .table>:not(caption)>*>* { box-shadow:none; }
.zd-cart table td, .zd-cart .views-field {
background:none;
padding: .5rem .5rem;
padding-left: 0px; padding-right: 0px;
}
.zd-cart .zd-stock-text { display: block; margin-left: 2em; }
.zd-cart .zd-stock-text { display:none; }
.zd-cart .mb-3 { margin-bottom:0px !important; }
.zd-cart #edit-actions { text-align:right; }
.zd-cart .views-field-field-images img { max-height:100px; width: auto;}
.zd-cart .views-field-edit-quantity { max-width:90px; }
.zd-cart .zd-description .price, .zd-cart .zd-description .price .final-price,
.zd-cart .zd-description .price .original-price { display:inline; }
.zd-cart .price .original-price { text-decoration:line-through; }
/* order totals */
.zd-cart .order-total-line-label { margin-right:0.5em; }
.zd-cart table .views-field-total-price__number .price,
.zd-cart table .zd-description {
padding-top: 0.5em;
}
.zd-cart .views-row, .zd-cart table tr {
grid-template-columns: 100px 4fr 100px 80px 50px;
grid-gap: 10px;
}
.zd-cart .views-field-remove-button { justify-self: end; }
.zd-cart table tr, .zd-cart .views-row {
padding-left: 0px; padding-right: 0px;
}
@media all and (max-width: 768px) {
.zd-cart .views-field-total-price__number:not(.checkout-pane .zd-cart .views-field-total-price__number) {
display:none; }
.zd-cart table tr { /* cart */
grid-template-columns: 110px 4fr 90px 40px;
}
.zd-cart .views-row /* checkout */ {
grid-template-columns: 110px 4fr 50px 80px;
}
}
@media all and (max-width: 480px) {
.zd-cart table tr { /* cart */
grid-template-columns: 110px 1fr 40px;
gap: 2px;
}
.zd-cart .views-row { /* checkout */
grid-template-columns: 110px 1fr 100px;
gap: 2px;
}
.zd-cart .views-field {
padding-left: 0.5em; padding-right: 0.5em;
}
.zd-cart .views-field-field-images {
grid-row: 1/3; grid-column: 1;
}
.zd-cart .views-field-title,
.zd-cart .views-field-title-1 {
grid-row: 1; grid-column: 2;
}
.zd-cart .views-field-quantity { display: none; }
.zd-cart .views-field-edit-quantity {
grid-row: 2; grid-column: 2;
}
.Azd-cart .views-field-total-price__number {
display:none;
}
.zd-cart .views-field-total-price__number {
grid-row: 1; grid-column: 3;
}
.zd-cart .views-field-remove-button {
grid-row: 1/3; grid-column: 3;
}
}
@media all and (max-width: 420px) {
.zd-cart table tr { /* cart */
grid-template-columns: 110px 1fr 40px;
gap: 2px;
}
.zd-cart .views-row { /* checkout */
grid-template-columns: 110px 1fr;
}
.zd-cart .views-field {
padding-left: 0.5em; padding-right: 0.5em;
}
.zd-cart .views-field-field-images {
grid-row: 1; grid-column: 1;
}
.zd-cart .views-field-title,
.zd-cart .views-field-title-1 {
grid-row: 2; grid-column: 1/4;
}
.zd-cart .views-field-edit-quantity {
grid-row: 1; grid-column: 2;
margin-left: auto; margin-right: auto;
}
.Azd-cart .views-field-total-price__number {
display:none;
}
.zd-cart .views-field-remove-button {
grid-row: 1/3 !important; grid-column: 3;
}
}
@media all and (max-width: 180px) {
/* checkout order-info */
.zd-cart table tr, .zd-cart .views-row {
grid-template-columns: 2fr 6fr 2fr;
padding-left: 0px; padding-right: 0px;
}
.zd-cart .views-field-quantity { display:none; }
.zd-cart .zd-antal { display:inline; }
/* cart */
.zd-cart table tr {
grid-template-columns: 110px 1fr 20px;
}
.zd-cart .views-field { padding-left: 0.5em; }
.zd-cart .views-field-field-images,
.zd-cart .views-field-remove-button {
grid-row: 1/2;
}
.zd-cart .views-field-title { grid-row: 1; }
.zd-cart .views-field-field-quantity { grid-row: 2; }
.zd-cart .views-field-field-quantity { grid-column: 2; }
.zd-cart .views-field-remove-button { grid-column: 3; }
.zd-cart .views-field-title, .zd-cart .views-field-title-1
{ grid-column: 2; }
.zd-cart .views-field-title { max-width:none; }
.zd-cart .views-field-edit-quantity { padding-top:0px; }
.zd-cart .views-field-remove-button { justify-self: end; }
}
@media all and (max-width: 120px) {
/* checkout order-info */
.zd-cart .views-row {
grid-template-columns: 1fr 100px 20px;
gap: 3px;
}
.zd-cart table tr {
grid-template-columns: 1fr 100px;
}
.zd-cart .views-field { padding-left: 1em; }
.zd-cart .views-field-field-images,
.zd-cart .views-field-field-quantity,
.zd-cart .views-field-remove-button {
grid-row: 1;
}
.zd-cart .views-field-field-images { grid-column: 1; }
.zd-cart .views-field-field-quantity { grid-column: 2; }
.zd-cart .views-field-remove-button { grid-column: 3; }
.zd-cart .views-field-title, .zd-cart .views-field-title-1
{ grid-row: 2; grid-column: 1/3; padding-top: 0px; }
}
/* Ta-bort-knappen */
.Azd-cart .views-field-remove-button{ margin-left: auto; padding-right: 1em; }
.zd-cart .delete-order-item.form-submit {
border: 0;
background: transparent;
color: transparent;
font-size: 0;
line-height: 1;
position: relative;
cursor: pointer;
box-shadow: none;
}
.zd-cart .delete-order-item.form-submit::before,
.zd-cart .delete-order-item.form-submit::after {
content: "";
position: absolute;
top: 75%;
left: 50%;
width: 1rem;
height: 2px;
background: #666;
border-radius: 1px;
transform-origin: center;
}
.zd-cart .delete-order-item.form-submit::before {
transform: translate(-50%, -50%) rotate(45deg);
}
.zd-cart .delete-order-item.form-submit::after {
transform: translate(-50%, -50%) rotate(-45deg);
}
.zd-cart .delete-order-item.form-submit:hover::before,
.zd-cart .delete-order-item.form-submit:hover::after,
.zd-cart .delete-order-item.form-submit:focus-visible::before,
.zd-cart .delete-order-item.form-submit:focus-visible::after {
background: #3c7837;
}
.field--name-total-price { font-size:100%; }
.field--name-total-price > div { display:grid; grid-template-columns: 1fr; }
.field--name-total-price .order-total-line { display:grid; grid-template-columns: 1fr minmax(0, 100px); }
/* checkout order-info */
.zd-cart .zd-price-and-quant::before { content: "("; }
.zd-cart .zd-price-and-quant::after { content: ")"; }
.zd-cart .zd-price-and-quant { white-space: nowrap; }
.zd-cart .zd-price::after { content: "/st"; }
.zd-cart .zd-antal::before { content: ": "; }
.zd-cart .views-field-title-1 { padding-right: 1em; }
.path-cart .breadcrumb, .zd-checkout .breadcrumb { display:none; }
@media (min-width: 480px) {
.zd-cart .views-field-quantity { display:block; }
.zd-cart .zd-antal { display:none; }
}
/* CART och CART BLOCK */
/*
.cart-block--contents {
width:95%; max-width:450px;
border:1px solid #ededed; border-radius:3px;
padding:1em; padding-left:0.5em; padding-right:0px;
background:white;
}
.cart-block--contents .view-content { margin-right:1em; }
*/
.cart-block--contents .views-row {
margin-top:1em; padding-bottom:1em; padding-left:0px;
display:flex; border-bottom:1px solid #dfdfdf;
width:100%;
}
/*
.cart-block--contents__items { max-height:none; }
.cart-block--contents__inner { padding-right:0px; }
*/
/* slut cart dropdown block */
.checkout-pane { border:1px solid #ededed; border-radius:var(--bs-btn-border-radius); margin-bottom:1em; }
.checkout-pane { padding:1em; margin-bottom:1em; }
.checkout-pane.checkout-pane.checkout-pane-order-summary { padding:0px; padding-bottom:1em; }
#edit-actions, .form-actions, .checkout-pane-contact-information, .checkout-pane-shipping-information { margin-top:1em; }
#commerce-checkout-flow-multistep-default #edit-shipping-information>legend { display:none; }
#commerce-checkout-flow-multistep-default #edit-actions { text-align:right; align-items:center;}
.cart--cart-block .cart-block--contents {
width: 280px;
margin-left: -200px;
background: white;
border: 1px solid var(--zd-neutral-color);
margin-top:0.5em;
padding: 0.5em;
}
.cart--cart-block .cart-block--contents cart-block--contents__inner {
padding: 0px;
}
/* CART end */
/* QUIZ */
.path-quiz .main-content .field--name-field-images { max-width: 750px; margin-bottom: 1em; }
.path-quiz .main-content #quiz-progress { text-align: right; display:none; }
.path-quiz .main-content img.quiz-score-icon { max-width: 15px; }
.path-quiz .main-content img.quiz-score-icon.quiz-score-icon { max-width: 12px; }
.path-quiz .main-content table {
display: block;
width: 100%;
margin: 0;
margin-left: 1em;
margin-bottom: 1em;
border: 0;
font-size: 100%;
}
.path-quiz .main-content table thead,
.path-quiz .main-content .quiz-report-score-container { display: none; }
.path-quiz .main-content table tr {
position: relative;
margin: 0 0 0.5rem;
padding: 0;
background: none;
border: 0;
}
.path-quiz .main-content table td {
padding: 0.5em;
background: none;
border: 0;
}
.path-quiz .main-content table p { margin: 0; }
.path-quiz .main-content .table-striped>tbody>tr:nth-of-type(odd)>* {
--bs-table-accent-bg: none;
}
.path-quiz .main-content .table-responsive {
overflow-x: hidden;
}
/* svar */
tr.quiz-result-correct { font-weight: bold; }
.path-quiz .main-content .quiz-config-overview { margin: 1em; }
.path-quiz .main-content .form-actions a.button,
.path-quiz .main-content a.quiz-start-link {
display: inline-block;
padding: 0.5rem 1rem;
border: 1px solid rgba(var(--zd-primary-color-rgb), 0.9);
border-radius: 0.25rem;
background: rgba(var(--zd-primary-color-rgb), 1);
color: #fff;
text-decoration: none;
line-height: 1.5;
cursor: pointer;
}
.path-quiz .main-content a.quiz-start-link:hover,
.path-quiz .main-content a.quiz-start-link:focus,
.path-quiz .main-content .form-actions a.button:hover,
.path-quiz .main-content .form-actions a.button:focus {
background: rgba(var(--zd-primary-color-rgb), 0.9);
border-color: rgba(var(--zd-primary-color-rgb), 0.9);
color: #fff;
text-decoration: none;
}
.path-quiz .main-content .zd-quiz-result-summary {
background: rgba(var(--zd-primary-color-rgb), 0.2);
border-color: rgba(var(--zd-primary-color-rgb), 0.3);
padding-left: 1em;
padding-right: 1em;
margin-bottom: 1em;
overflow:hidden;
max-width: 600px;
}
/* nytt mailerlite 260906 */
.zd-mailerlite-block {
margin: 1em 0;
background: rgba(var(--zd-footer-background-color-rgb), 0.7);
border: 1px solid rgba(var(--zd-footer-background-color-rgb), 1);
border-radius: var(--zd-block-border-radius);
box-sizing: border-box;
width: 100%;
}
.zd-mailerlite-block .zd-mailerlite-newsletter-signup-form h2,
.zd-mailerlite-block .zd-mailerlite-newsletter-signup-form > input,
.zd-mailerlite-block .zd-mailerlite-newsletter-signup-form > button,
.zd-mailerlite-block .zd-mailerlite-newsletter-signup-form > div {
margin: 1em;
width: calc(100% - 2em);
box-sizing: border-box;
}
.zd-mailerlite-block .zd-mailerlite-newsletter-signup-form .form-check-label p,
.zd-mailerlite-block .zd-mailerlite-newsletter-signup-form .zd-mailerlite-form__response p:last-child { margin-bottom: 0px; }
.zd-mailerlite-block br { margin-bottom: 0.5em; }
.zd-mailerlite-form__response zd-mailerlite-form__response--success
.zd-mailerlite-block form {
width: 100%;
box-sizing: border-box;
}
.zd-mailerlite-block .form-type-email input.form-email {
width: 100%;
max-width: 100%;
box-sizing: border-box;
}
.zd-mailerlite-form__response {
padding: 1em;
border: 1px solid gray;
}
.zd-mailerlite-form__response.zd-mailerlite-form__response--success {
background: rgba(var(--zd-primary-color-rgb), 0.1);
border-color: rgba(var(--zd-primary-color-rgb), 0.3);
}
.zd-mailerlite-form__response.zd-mailerlite-form__response--warning {
background: rgba(var(--bs-warning), 0.3);
border-color: rgba(var(--bs-warning), 0.6);
}
.zd-mailerlite-form__response.zd-mailerlite-form__response--error {
background: rgba(var(--bs-warning), 0.3);
border-color: rgba(var(--bs-warning), 0.6);
}
/* sidfot footer START */
.site-footer .block {
border: none;
padding: 0 2em 0 2em;
text-align: center;
}
.site-footer__top .region { padding: 0px !important; }
.site-footer__top {
background: rgba(var(--zd-footer-background-color-rgb), 1);
padding-bottom: 1em;
overflow: hidden;
}
.site-footer__bottom section { margin: 0px; }
.site-footer__bottom { margin-top: 0px; }
.site-footer .content,
.site-footer .content h2,
.site-footer .content h3,
.site-footer .content a,
.site-footer .content a.is-active,
.site-footer .content p,
.site-footer .ckeditor-accordion-container > dl dt > a,
.site-footer .ckeditor-accordion-container > dl dt > a:not(.button) {
color: rgba(var(--zd-footer-font-color-rgb), 0.7);
letter-spacing: 0.07em;
font-size: 90%;
}
.site-footer .content h2,
.site-footer .content h3,
.site-footer .content dt {
text-transform: uppercase;
}
.site-footer dd a { text-decoration: none; }
.site-footer .zd-mailerlite-block {
border: 1px solid rgba(var(--zd-footer-font-color-rgb), 0.02);
background: rgba(var(--zd-footer-font-color-rgb), 0.05);
}
.site-footer .zd-mailerlite-block .content {
max-width: 400px;
margin: auto;
}
.site-footer .zd-store-description-block {
margin: 0px;
font-size: 115%;
font-weight: 400;
margin-top: 1em;
}
.site-footer .zd-footer-contact .content {
padding: 0em 1em 0em 1em;
}
.site-footer .zd-footer-slogan-block .content {
padding: 1em 2em 1em 2em;
border: 2px solid rgba(var(--zd-footer-font-color-rgb), 0.02);
background: rgba(var(--zd-footer-font-color-rgb), 0.05);
}
.site-footer .zd-footer-slogan-block p {
text-align: center;
margin: 0 2em 0 2em;
color: rgba(var(--zd-footer-font-color-rgb), 1);
font-weight: 400;
}
.site-footer .zd-copyright-block { text-align: left; }
.site-footer .zd-footer-contact .content h3 { margin-top: 1rem; }
.site-footer .block-zd-stores-block .content {
margin-top: 0px;
text-align: center;
font-size: 80%;
}
.block#block-zd-barrio-lankarombutiken {
margin: 1em 0 1em 0;
text-align: left;
}
.block#block-zd-barrio-zdgeneralcookiehandling,
.block.zd-mailerlite-popup-placeholder {
margin: 0px !important;
padding: 0px !important;
}
/* sidfot footer END */