/* buttons */ .woocommerce div.product form.cart .button { margin-bottom: 1.25rem } .woocommerce-MyAccount-content button.button, .woocommerce-info .button, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button.alt { font-family: "Hanken Grotesk", sans-serif; font-weight: 600 !important; letter-spacing: 0; font-size: .875rem !important; } .woocommerce-MyAccount-content button.button, .woocommerce-info .button { background-color: var(--dark-grey); border: 1px solid var(--dark-grey); color: #fff; } .woocommerce-MyAccount-content button.button:hover, .woocommerce-MyAccount-content button.button:focus, .woocommerce-info .button:hover, .woocommerce-info .button:focus { background-color: var(--accent-blue); border-color: var(--accent-blue); color: #fff; } .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button { background-color: var(--dark-grey); border: 1px solid var(--dark-grey); color: #fff; } .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button:hover,.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit:focus, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button:focus, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button:focus, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button:focus, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit:focus, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button:focus, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button:focus, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button:focus { background-color: var(--white); border-color: var(--dark-grey); color: var(--dark-grey); } .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button.alt { border: 1px solid var(--accent-green); background: var(--accent-green); } .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button.alt:hover { background-color: var(--dark-grey); border-color: var(--dark-grey); color: #fff; } .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled[disabled]:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled[disabled]:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled[disabled]:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button.alt:disabled[disabled]:hover { background-color: var(--grey); border-color: var(--grey); color: #fff; } .woocommerce-variation-add-to-cart { display: flex; } .woocommerce-variation-add-to-cart .custom-quantity { flex-shrink: 0; } .woocommerce-variation-add-to-cart .button { flex-basis: 100%; margin-bottom: 1.25rem!important } /* archive & product lists */ /* .block_produkte_wrapper { padding-top:30px } */ /* cat header */ .archive.tax-product_cat .ws-block-title, .archive.tax-product_cat .term-description { max-width: 41rem } .archive.tax-product_cat .term-description > *:last-child { margin-bottom: 0 } .archive.tax-product_cat .woocommerce-notices-wrapper { margin-top: 3rem } /* product lists */ ul.products li.product { } ul.products li.product .woocommerce-loop-product__img-wrapper { aspect-ratio: 0.886; position: relative; overflow: hidden; flex-shrink: 0; background-color: var(--white); margin-bottom: 1rem; } ul.products li.product .woocommerce-loop-product__img-wrapper img, .woocommerce ul.products li.product .woocommerce-loop-product__img-wrapper img { position: absolute; top:0; left:0; width: 100%; height: 100%; object-fit: scale-down; /* object-fit: cover; */ object-position: center; margin-bottom:0; transition: all .5s } ul.products li.product .woocommerce-loop-product__img-wrapper.image-hover img:nth-of-type(2) { object-fit: scale-down; background-color: var(--white); opacity:0; filter: opacity(0) brightness(1.1); transition: opacity .5s ease, filter .5s ease; will-change: opacity, filter; } ul.products li.product:hover .woocommerce-loop-product__img-wrapper.image-hover img:nth-of-type(2) { opacity: 1; filter: opacity(1) brightness(1); } ul.products li.product .woocommerce-loop-product__img-wrapper a.button { position: absolute; bottom: 0; left: 0; width: 100%; padding: 0.75rem .5rem !important; background-color: var(--accent-green); border: 1px solid var(--accent-green); color: #fff; /* opacity: 0; */ transition: all .6s } ul.products li.product .woocommerce-loop-product__img-wrapper a.button:hover, ul.products li.product .woocommerce-loop-product__img-wrapper a.button:focus { background-color: var(--dark-grey); border: 1px solid var(--dark-grey); color: #fff; } .ws_desktop ul.products li.product .woocommerce-loop-product__img-wrapper a.button { transform: translateY(3rem); } .ws_desktop ul.products li.product:hover .woocommerce-loop-product__img-wrapper a.button { /* opacity: 1; */ transform: translateY(0); z-index:2 } .woocommerce ul.products li.product .woocommerce-loop-category__title, .woocommerce ul.products li.product .woocommerce-loop-product__title, .woocommerce ul.products li.product h3 { font-family: 'Hanken Grotesk',sans-serif; font-weight: 500; font-size: 1.125rem; line-height: 1.5rem; margin: 0 0 .5rem; padding: 0; color: var(--dark-text); justify-self: flex-start } ul.products li.product .price, .woocommerce:where(body:not(.woocommerce-uses-block-theme)) ul.products li.product .price { color: var(--dark-text); font-size: 1rem!important; font-weight: 400 } .woocommerce ul.products li.product .price { display: flex; flex-wrap: wrap; flex-direction: row; } .woocommerce ul.products li.product .price del { order: 2; } .woocommerce ul.products li.product .price ins { font-weight: 400; text-decoration: none; margin-right: .5rem; } .woocommerce ul.products li.product .onsale { display: none } .woocommerce:where(body:not(.woocommerce-uses-block-theme)) ul.products li.product .wgm-info { color: var(--text); font-size: .875rem } /**/ .woocommerce ul.products, .woocommerce ul.products.columns-4 { display: flex; flex-wrap: wrap; } .ws-content-product-wrap { position: relative; height: 100%; } .loop_item_content, .loop_item_content a:first-child { flex-basis: 100%; } .woocommerce .woocommerce-result-count { margin: .75rem 0; } @media (max-width:991px) { .woocommerce ul.products, .woocommerce ul.products.columns-4 { margin: 0 -.5rem!important; } .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { margin: 0 .5rem 2rem!important; } ul.products li.product .woocommerce-loop-product__img-wrapper a.button { font-size: .875rem !important; } } @media (max-width:767px) { .woocommerce .woocommerce-result-count { margin-top: 0; } .woocommerce .woocommerce-ordering, .woocommerce-page .woocommerce-ordering { width: 100% } } @media (max-width:359px) { .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width: calc(100% - 1rem)!important; } } @media (min-width: 360px) and (max-width:767px) { .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width: calc(50% - 1rem)!important; } } @media (min-width: 768px) and (max-width:991px) { .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { width: calc(25% - 1rem)!important; } } @media (min-width: 992px) { .woocommerce ul.products, .woocommerce ul.products.columns-4 { margin: 0 -1rem!important; padding-bottom: 1rem } .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { margin: 0 1rem 2rem!important; width: calc(25% - 2rem)!important; } } /* pagination */ .woocommerce nav.woocommerce-pagination { margin-bottom: 3rem; } .woocommerce nav.woocommerce-pagination ul { display: flex; justify-content: center; border: none; padding: 0 6rem; position: relative; } .woocommerce nav.woocommerce-pagination ul li { border: none; } .woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span { font-size: .875rem; font-weight: 500; padding: 0; display: block; height: 2.5rem; line-height: 2.5rem; color: var(--text); } .woocommerce nav.woocommerce-pagination ul li a:focus, .woocommerce nav.woocommerce-pagination ul li a:not(.current):hover { color: var(--dark-text)!important; background: transparent!important; } .woocommerce nav.woocommerce-pagination ul li a:not(.next):not(.prev), .woocommerce nav.woocommerce-pagination ul li span:not(.next):not(.prev) { width: 2.5rem; text-align: center; transition: all .3s } .woocommerce nav.woocommerce-pagination ul li .current { background-color: var(--grey-transparent)!important; color: var(--dark-text)!important; } .woocommerce nav.woocommerce-pagination ul li:first-child a.prev { position: absolute; left:0 } .woocommerce nav.woocommerce-pagination ul li:last-child a.next { position: absolute; right:0 } @media (max-width:767px) { .woocommerce nav.woocommerce-pagination ul { padding: 0; } .woocommerce nav.woocommerce-pagination ul li:first-child a.prev, .woocommerce nav.woocommerce-pagination ul li:last-child a.next { top: calc(100% + .5rem); height: 2rem; line-height: 2rem; } } .woocommerce-no-products-found { max-width: 38rem; margin: 0 auto } /* single product */ .woocommerce div.product .onsale { display: none } .woo_product_content { position: relative; } .woo_product_content .summary .product_meta { display:none; } .woo_product_content .summary { /* position: sticky; top: 6rem; max-height: calc(100dvh - 6rem); overflow-y: clip; */ display: flex; flex-direction: column; } .woocommerce div.product.product-type-voucher form.cart { flex-direction: column; } .voucher-configuration input, .voucher-configuration select, .voucher-configuration textarea { background: rgba(255, 255, 255, 0.40); min-width: unset!important; } .voucher-configuration .input-group-selector ul li { margin-bottom: 1rem!important } .voucher-configuration .input-group-selector ul li .voucher-thumbnail { margin-bottom: .25rem!important; } .voucher-configuration .input-group-selector ul li .title { line-height: 1.2; } .voucher-configuration .input-group-selector ul li.active .voucher-thumbnail { border-color: var(--akzent-red)!important } @media (min-width:768px) { .product:not(.product-type-voucher) .woo_product_content .summary { position: sticky; top: 6rem; max-height: calc(100dvh - 6rem); overflow-y: clip; } .woo_product_content .summary > * { flex: 0 0 auto; } .woo_product_content .summary > .woocommerce-tabs { flex: 1 1 auto; display: flex; flex-direction: column; max-height: calc(100vh - 8px); overflow-y: auto; -webkit-overflow-scrolling: touch; padding-right: 6px; /* optional space for scrollbar */ } @supports not selector(::-webkit-scrollbar) { .woocommerce-tabs { scrollbar-width: thin; scrollbar-color: rgba(0, 0, 0, 0.50) #F2F0EE ; } } .woocommerce-tabs::-webkit-scrollbar { width: .5rem; } .woocommerce-tabs::-webkit-scrollbar-track { border-radius: .5rem; background-color: #F2F0EE; } .woocommerce-tabs::-webkit-scrollbar-thumb { border-radius: .5rem; background-color: rgba(0, 0, 0, 0.50); } /* ONLY this part scrolls */ .woocommerce div.product .woocommerce-tabs ul.tabs { top: 0; position: sticky; display: table; } } /* @media (max-width: 767px) { .woo_product_content .summary > .woocommerce-tabs { position: relative; } .woocommerce div.product .woocommerce-tabs ul.tabs { width: 100%; padding-top: 1rem!important; top: 4rem; } } */ .woo_product_content .summary > .woocommerce-tabs { } .woocommerce div.product .woocommerce-tabs ul.tabs { background: var(--grey-bgr); } /**/ .product.product-type-variable .legacy-itemprop-offers { display: none!important; } /* custom quantity on single (modified css from plugin) */ .is_configurable:not(.enable-add-to-cart):not(.configurator_is_inline) div.product form.cart .custom-quantity, .is_configurable:not(.enable-add-to-cart):not(.configurator_is_inline) div.product form.cart .single_add_to_cart_button { display: none!important; } .woo_product_content .summary .custom-quantity { position: relative; display: inline-flex; font-size: 1.25rem; margin: 0 1.25rem 1.25rem 0; background: #fff; border: 1px solid var(--border); } .woo_product_content .summary .custom-quantity .plus, .woo_product_content .summary .custom-quantity .minus { padding: .5rem; } .woo_product_content .summary .custom-quantity .plus img, .woo_product_content .summary .custom-quantity .minus img { width: 1.25rem !important; height: 1.25rem !important; } .woocommerce .woo_product_content .summary .custom-quantity .quantity input[type=number].qty { min-width: 3.5rem; height: 2.3125rem; padding: 0 .25rem; line-height: 2.3125rem; } /**/ .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price, .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price { color: var(--dark-text); font-size: 1rem!important; font-weight: 400; margin-bottom: .25rem } .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product .price { display: flex; flex-wrap: wrap; flex-direction: row; } .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product .price del { order: 2; } .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product .price ins { font-weight: 400; text-decoration: none; margin-right: .5rem; } .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product .stock { margin-bottom: 1.25rem; } .woocommerce div.product p.stock.in-stock { color: var(--accent-blue); } .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product .out-of-stock { color: var(--akzent-red); } .product .summary .wgm-info:last-child { margin-bottom: 1rem; } .woocommerce-product-details__short-description { color: var(--dark-text) } .product .summary #ppcp-recaptcha-v2-container { margin: 10px 0!important } .product .summary .wgm-info.woocommerce-de_price_taxrate { float:left; padding-right: .25rem } /* tabs */ .woocommerce div.product .woocommerce-tabs ul.tabs { display: none; padding: 0; margin-bottom: 1.5rem; } .woocommerce div.product .woocommerce-tabs ul.tabs li { border: none; background-color: transparent; color: var(--text); border-radius: 0; margin: 0 ; padding: 0 1rem 0 0; } .woocommerce div.product .woocommerce-tabs ul.tabs::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after, .woocommerce div.product .woocommerce-tabs ul.tabs li::before { display: none!important; } .woocommerce div.product .woocommerce-tabs ul.tabs li a { font-weight: 600; color: var(--text); } .woocommerce div.product .woocommerce-tabs ul.tabs li a:hover, .woocommerce div.product .woocommerce-tabs ul.tabs li.active { background: transparent; color: var(--akzent-red); z-index: 2; border-bottom-color: transparent; } .woocommerce div.product .woocommerce-tabs .panel { margin-bottom: 1rem; } .woocommerce-Tabs-panel *, .woocommerce-Tabs-panel h2, .woocommerce-Tabs-panel h3, .woocommerce-Tabs-panel h4, .woocommerce-Tabs-panel h5, .woocommerce-Tabs-panel h6 { color: var(--dark-grey); font-family: "Hanken Grotesk"; font-size: 1rem; font-weight: 400; line-height: 150%; letter-spacing: -0.02rem; margin: 0 0 .5rem } .woocommerce-Tabs-panel > *:last-child { margin-bottom:0 } .woocommerce-Tabs-panel ul { margin-bottom: .5rem } .woocommerce-Tabs-panel h2, .woocommerce-Tabs-panel h3, .woocommerce-Tabs-panel h4, .woocommerce-Tabs-panel h5, .woocommerce-Tabs-panel h6 { font-weight: 700; } .woocommerce-Tabs-panel h2:not(:first-child), .woocommerce-Tabs-panel h3:not(:first-child), .woocommerce-Tabs-panel h4:not(:first-child), .woocommerce-Tabs-panel h5:not(:first-child), .woocommerce-Tabs-panel h6:not(:first-child) { margin-top: 1.5rem; } /* single product images */ @media (min-width: 768px) { .woocommerce #content div.product .woo_product_content div.summary, .woocommerce div.product .woo_product_content div.summary, .woocommerce-page #content div.product .woo_product_content div.summary, .woocommerce-page div.product .woo_product_content div.summary { width: calc(50% - 2rem); } .ws-single-product-images { float: left; width: calc(50% + .5rem); } } @media (max-width:767px) { .single-product #page { padding-top: 3.75rem; } .single-product header#masthead > .container { background: #fff } .ws-single-product-images { position: relative; padding: 1rem 0; margin-bottom: 1.25rem; } .woocommerce div.product .woocommerce-tabs .panel { margin-bottom: 0; } .woocommerce-Tabs-panel.wc-tab { position: relative; padding: 1rem 0!important; display: block } .ws-single-product-images:before, .woocommerce-Tabs-panel.wc-tab:before { content: ''; display: block; z-index: -1; position: absolute; left: -15px; right: -15px; top:0; bottom:0; background-color: #fff; } } .ws-single-product-images .woocommerce-product-gallery__image { display:block; background: #fff; position: relative; margin-bottom: 1rem; margin-right: 1rem; } .ws-main-image.woocommerce-product-gallery__image { border: 2px solid #fff; aspect-ratio: 1.39; float: left; width: calc(100% - 1rem); } .ws-main-image.woocommerce-product-gallery__image.ws-image-selected { border-color: var(--akzent-red); } .woocommerce-product-gallery__image > a > img { position: absolute; top:0; left:0; width: 100%; height: 100%; object-fit: scale-down; object-position: center; } .ws-main-image-logo { display: block; transform: rotate(-90deg); width:4rem; position: absolute; bottom: 1.75rem; right: -1.185rem; } .ws-secondary-image.woocommerce-product-gallery__image { aspect-ratio: 1; width: calc(50% - 1rem); float: left; } /* .ws-secondary-image.woocommerce-product-gallery__image { margin-right: 1rem; } */ /**/ .single_variation_wrap { clear:both } /* checkout */ body.woocommerce-checkout { background: #fff } body.woocommerce-checkout #page { padding-top: 4rem } /* configuration plugin */ .mkl_pc .mkl_pc_container footer .footer__section-right { flex-shrink: 0; } .mkl_pc .mkl_pc_container footer h3.product-name { line-height: 1.1; } .mkl_pc .mkl_pc_container footer .pc_configurator_form { align-items: stretch; } .mkl_pc .mkl_pc_container footer .form input.qty, .mkl_pc .mkl_pc_container footer form input.qty, .mkl_pc .mkl_pc_container footer .quantity input.qty { height: 3rem; line-height: 3rem; } .mkl_pc .mkl_pc_container .mkl_pc_toolbar section.choices > ul li span.out-of-stock { top: 50%; transform: translateY(-50%); } .mkl_pc .mkl_pc_container .mkl_pc_viewer .angles-select>a::before { content: ""; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath d='M12 4V2.2L9 4.8l3 2.5V5.5c3.6 0 6.5 2.9 6.5 6.5 0 2.9-1.9 5.3-4.5 6.2v.2l-.1-.2c-.4.1-.7.2-1.1.2l.2 1.5c.3 0 .6-.1 1-.2 3.5-.9 6-4 6-7.7 0-4.4-3.6-8-8-8zm-7.9 7l1.5.2c.1-1.2.5-2.3 1.2-3.2l-1.1-.9C4.8 8.2 4.3 9.6 4.1 11zm1.5 1.8l-1.5.2c.1.7.3 1.4.5 2 .3.7.6 1.3 1 1.8l1.2-.8c-.3-.5-.6-1-.8-1.5s-.4-1.1-.4-1.7zm1.5 5.5c1.1.9 2.4 1.4 3.8 1.6l.2-1.5c-1.1-.1-2.2-.5-3.1-1.2l-.9 1.1z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-size: contain; display: inline-block; width: 20px; height: 20px; vertical-align: text-bottom; margin-right: 4px; transition: transform 0.3s; } .mkl_pc .mkl_pc_container .mkl_pc_viewer .angles-select li a::before { content: ""; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' aria-hidden='true' focusable='false'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M12 18.5a6.5 6.5 0 1 1 0-13 6.5 6.5 0 0 1 0 13ZM4 12a8 8 0 1 1 16 0 8 8 0 0 1-16 0Zm11.53-1.47-1.06-1.06L11 12.94l-1.47-1.47-1.06 1.06L11 15.06l4.53-4.53Z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-size: contain; transition: all 0.2s; display: inline-block; width: 20px; height: 20px; vertical-align: text-bottom; margin-right: 0; opacity: 0; } @media (min-width: 320px) and (max-width: 1599px) { .mkl_pc .mkl_pc_container footer h3.product-name { font-size: clamp(1.25rem, calc(1.25rem + (1.25rem * ((100vw - 320px) / 1280px))), 2.5rem); } } @media (max-width: 660px) { .mkl_pc .mkl_pc_container .mkl_pc_toolbar > header { background: #36383a; padding-top: 0; display: flex; align-items: center; justify-content: center; text-align: center; } .mkl_pc .mkl_pc_container .mkl_pc_toolbar > header .cancel { top: 8px; } .mkl_pc_footer { padding: 0 15px!important } .mkl_pc_footer .footer__section-left { display: none; } } /* woo table */ .woocommerce table.shop_table { border: 1px solid var(--border); margin: 0 -1px 24px 0; text-align: left; width: 100%; border-collapse: separate; border-radius: 0; } .woocommerce table.shop_table th { line-height: 1.4 } .woocommerce table.shop_table td { border-top: 1px solid var(--border); line-height: 1.4 } @media (max-width: 767px) { .woocommerce table.shop_table th, .woocommerce table.shop_table td { padding: 9px 6px; font-size: .875rem } } /* woo order received */ .woocommerce-order > .woocommerce-thankyou-order-received { font-size: 110%; font-weight: 500; margin-bottom: 2rem } .woocommerce ul.order_details li strong { color: var(--dark-text) } .woocommerce ul.order_details { padding: 0; margin-bottom: 2rem } .woocommerce ul.order_details li { margin-bottom: 1.5rem } @media (max-width:767px) { .woocommerce ul.order_details li { width: 50%; margin-right: 0; border-right-width: 0; padding-right: 1rem } .woocommerce ul.order_details li:last-child { width: 100% } } @media (max-width:360px) { .woocommerce ul.order_details li { width: 100% } } .woocommerce-table ul { padding: 0; font-size: 95% } .woocommerce .woocommerce-customer-details address { border: 1px solid var(--border); border-bottom-width: 2px; border-right-width: 2px; text-align: left; width: 100%; border-radius: 0; padding: 6px 12px; box-sizing: border-box; } /* loop orderby select - in template added class to select */ select.ws-custom-orderby { appearance: none; -webkit-appearance: none; -moz-appearance: none; background: white url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGZpbGw9IiM1NDU0NTQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0IiB2aWV3Qm94PSIwIDAgMjQgMjQiPgo8cGF0aCBkPSJNNS4yOTMgOS43MDdsNiA2YzAuMzkxIDAuMzkxIDEuMDI0IDAuMzkxIDEuNDE0IDBsNi02YzAuMzkxLTAuMzkxIDAuMzkxLTEuMDI0IDAtMS40MTRzLTEuMDI0LTAuMzkxLTEuNDE0IDBsLTUuMjkzIDUuMjkzLTUuMjkzLTUuMjkzYy0wLjM5MS0wLjM5MS0xLjAyNC0wLjM5MS0xLjQxNCAwcy0wLjM5MSAxLjAyNCAwIDEuNDE0eiI+PC9wYXRoPgo8L3N2Zz4K') no-repeat right .75rem center; background-size: 1.25rem; padding-right: 1.725rem; cursor:pointer; } /* woo checkbox style */ label.woocommerce-form__label.woocommerce-form__label-for-checkbox { cursor: pointer; font-size: .875rem; margin-bottom: 0 !important; position: relative; line-height: 1.2!important; display: block; align-items: flex-start; } label.woocommerce-form__label.woocommerce-form__label-for-checkbox input[type=checkbox] { appearance: none; background-color: #fff; border: 1px solid rgba(25, 23, 17, .48); border-radius: 4px; box-sizing: border-box; overflow: hidden; position: static; vertical-align: middle; margin: 0 .5em 0 0; font-size: 1rem; height: 1rem; width: 1rem; line-height: 1rem; padding: 0 !important; } label.woocommerce-form__label.woocommerce-form__label-for-checkbox span { display: inline-block; vertical-align: middle; position: relative; } label.woocommerce-form__label.woocommerce-form__label-for-checkbox span:before { content: '\e903'; font-family: 'huepferli' !important; position: absolute; top:0; left: -1.425rem; color: transparent; } label.woocommerce-form__label-for-checkbox input[type=checkbox]:checked+span:before { color: #000; } /* account page */ label.woocommerce-form__label.woocommerce-form__label-for-checkbox.woocommerce-form-login__rememberme { margin: 1.275rem 0; display: inline-flex !important; } .woocommerce-account #page { padding-top: 4rem; } .woocommerce-account .woocommerce { position: relative; border-bottom: 1px solid var(--border); } .ws-woo-login-form { margin: 0 auto; max-width: 40rem; } .woocommerce-MyAccount-content { font-size: .875rem } .woocommerce-MyAccount-navigation { background-color: var(--Background-Primary); } .account-title, .woocommerce-account h2, .woocommerce-MyAccount-content h3, .woocommerce-MyAccount-content h4 { font-family: 'Hanken Grotesk'; font-weight: 500; font-size: 1.125rem!important; margin-bottom: 2rem; text-transform: none; line-height: 1.5; color: var(--dark-text); } fieldset .account-title { margin-bottom: .5rem } /* .account-title { text-transform: capitalize; } */ .nav-account-title { font-size: 1.125rem; font-weight: 500; color: var(--dark-text); margin: 0; } .woocommerce-MyAccount-navigation ul { padding:0; margin-bottom: 0 } .woocommerce-MyAccount-navigation li { margin-bottom: 0; list-style-type: none } .woocommerce-MyAccount-navigation li a { color: var(--dark-text); font-weight: 500; font-size: 0.875rem; text-transform: capitalize; display:block; padding: 1rem .5rem 1rem 2rem; display: flex; align-items: center; border-top: 1px solid var(--border) } .woocommerce-MyAccount-navigation li:nth-last-of-type(2) a { border-bottom: 1px solid var(--border) } .woocommerce-MyAccount-navigation li a svg, .woocommerce-MyAccount-navigation li a i, .ws-dashboard-nav ul li a svg, .ws-dashboard-nav ul li a i { margin-right: 1rem; } .woocommerce-MyAccount-navigation li a svg, .ws-dashboard-nav ul li a svg { vertical-align: text-bottom; transition: fill .5s } .woocommerce-MyAccount-navigation li.is-active a, .woocommerce-MyAccount-navigation li a:hover { background: rgba(255, 255, 255, 0.20); color: var(--accent-blue); } .woocommerce-MyAccount-navigation li.is-active a svg { fill: var(--accent-blue); } @media (max-width: 767px) { /* .woocommerce-MyAccount-navigation { height: auto; top: 81px; } */ } @media (max-width:991px) { .woocommerce-account .woocommerce-MyAccount-navigation, .woocommerce-account .woocommerce-MyAccount-content { float: none; width: 100%; } .nav-account-title { padding: 2rem 1rem 1rem; } .woocommerce-MyAccount-navigation ul { display: flex; flex-wrap: wrap; margin: 0 .75rem; } .woocommerce-MyAccount-navigation ul li a { margin: .25rem; padding: .5rem .75rem; border: 1px solid var(--border); line-height: 1; min-height: 3rem; } .woocommerce-MyAccount-content { padding: 2rem 1rem; } } @media (min-width: 768px) and (max-width:991px) { .woocommerce-account .woocommerce { padding: 0 1rem; } .woocommerce-MyAccount-navigation ul li { flex-basis: 25% } } @media (max-width: 767px) { .woocommerce-MyAccount-navigation ul li { flex-basis: 50% } .woocommerce-MyAccount-navigation li a { padding: .5rem; } .woocommerce-MyAccount-navigation li a svg, .woocommerce-MyAccount-navigation li a i, .ws-dashboard-nav ul li a svg, .ws-dashboard-nav ul li a i { margin-right: .5rem; } } @media (min-width: 992px) { .nav-account-title { padding: 2rem 4rem; } .woocommerce-MyAccount-navigation { border-right: 1px solid var(--border); width: 17.4rem!important; position: sticky; height: calc(100vh - 85px); min-height: 523px; top: 85px; float:left; } .woocommerce-MyAccount-navigation ul { padding-bottom: 8rem; } .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--customer-logout { position: absolute; bottom:0; left:0; width: 100% } /* .woocommerce-MyAccount-navigation li:last-child a { border-top: 1px solid var(--border) } */ .woocommerce-MyAccount-content { padding: 2rem 2.5rem; width: calc(100% - 17.4rem)!important; max-width: 68rem!important; float: left!important; } .woocommerce-MyAccount-content.account-no-sidebar { width: auto; float: none !important; margin: 0 auto; } } @media (min-width: 1200px) { .woocommerce-MyAccount-navigation { height: calc(100vh - 4rem); top: 4rem; } .admin-bar .woocommerce-MyAccount-navigation { height: calc(100vh - 4rem - 32px); } } /**/ form.edit-account button.woocommerce-Button.button { margin-top: 1.5rem } /**/ @media only screen and (min-width: 769px) { /**/ .woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1 { float: left; width: 48%; max-width:48%!important; -ms-flex: 0 0 48%; flex: 0 0 48%; } .woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2 { -ms-flex: 0 0 48%; flex: 0 0 48%; max-width:48%!important } } @media only screen and (max-width: 768px) { .woocommerce .col2-set .col-1, .woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-1, .woocommerce-page .col2-set .col-2 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } } /**/ .no-payment-metods { border: 1px solid var(--border); padding: 1.5rem; } .no-payment-metods > div { display: flex; padding: 2.5rem 1.5rem; align-items: center; width: 100%; justify-content: center; background: var(--Background-Secondary); } /* dashboard nav */ .ws-dashboard-nav { position: relative; /* left: 0; width: calc(100vw - 18.9rem); max-width: 77rem */ } .ws-dashboard-nav ul { display: flex; flex-wrap:wrap; padding: 0; margin: 2rem -.5rem } .ws-dashboard-nav ul li { list-style-type: none } .ws-dashboard-nav ul li a { color: var(--dark-text); font-weight: 500; font-size: 1rem; text-transform: capitalize; padding: 1.5rem 1rem 1.5rem 2rem; margin: .5rem; display: flex; align-items: center; justify-content: flex-start; background-color: transparent; border: 1px solid var(--border); transition: background-color .5s; } .ws-dashboard-nav ul li a svg { width: 1.875rem; } .ws-dashboard-nav ul li a i { font-size: 1.875rem } @media (max-width: 1199px) { .ws-dashboard-nav ul li a { padding: 1.5rem .5rem 1.5rem 1.5rem; font-size: .875rem; } .ws-dashboard-nav ul li a svg { width: 1.275rem; } .ws-dashboard-nav ul li a i { font-size: 1.275rem; } } .ws-dashboard-nav ul li a:hover { background: rgba(255, 255, 255, 0.20); color: var(--accent-blue); } .ws-dashboard-nav ul li { flex-basis: 33.333%; } @media (max-width: 768px) { .ws-dashboard-nav ul li { flex-basis: 50%; } } .woocommerce-account .woocommerce-MyAccount-content mark { font-weight: 600; } /* addresses */ .woocommerce .woocommerce-address-fields button.button { margin-top: 2rem } .woocommerce-Address address a.button .ws-plus, .woocommerce-Address .woocommerce-Address-title a .ws-plus, a.button .ws-plus { font-size: 1.125rem; font-weight: 400; line-height: .875rem; padding-right: .25rem; } /**/ .woocommerce-account .woocommerce table.shop_table { border-spacing: 0; } .woocommerce table.my_account_orders { font-size: .85rem; } .woocommerce-account .woocommerce table.shop_table td, .woocommerce table.shop_table th { padding: .75rem 1rem; } .woocommerce-account .woocommerce table.shop_table thead th { padding: 1rem; } .woocommerce-account .woocommerce table.shop_table tbody th, .woocommerce-account .woocommerce table.shop_table tfoot td, .woocommerce-account .woocommerce table.shop_table tfoot th { font-weight: 500; border-top: 1px solid var(--border); } .woocommerce-account .woocommerce table.shop_table td { border-top: 1px solid var(--border); } .woocommerce-account .woocommerce table.shop_table a.button { padding: .5rem !important; height: auto; line-height: 1 !important; font-size: 0.85rem !important; font-weight: 600 !important; font-family: 'Hanken Grotesk', sans-serif; margin: .25rem .25rem .25rem 0; letter-spacing: 0; background-color: var(--dark-grey); color: #fff } .woocommerce-account .woocommerce table.shop_table a.button:hover, .woocommerce-account .woocommerce table.shop_table a.button:focus { background-color: var(--accent-blue); color: #fff } /* addresses */ .woocommerce-columns--addresses .woocommerce-column, .u-columns.woocommerce-Addresses .woocommerce-Address { border: 1px solid var(--border); padding: 1.5rem; } .woocommerce-Address-title { display: flex; justify-content: space-between; } .woocommerce-Address-title:before, .woocommerce-Address-title:after { display: none!important } .woocommerce-Address-title h2 { margin-right: 1rem } .woocommerce-Address-title a.edit { margin-top: .175rem } .woocommerce-columns--addresses .woocommerce-column address, .u-columns.woocommerce-Addresses .woocommerce-Address address { padding: 1.5rem 1rem; border: 1px solid var(--border); background: var(--Background-Secondary); margin-bottom: 0 } /* login/reg */ .woocommerce form.checkout_coupon, .woocommerce form.login, .woocommerce form.register { border: 1px solid var(--border); padding: 1.5rem 1rem; margin: 2em 0; text-align: left; font-size: .875rem; border-radius: 0; } .woocommerce form.login, .woocommerce form.woocommerce-ResetPassword { max-width: 40rem } .woocommerce .woocommerce-form-login .woocommerce-form-login__submit { margin-right: 1.5rem!important } /**/ .woocommerce form .show-password-input, .woocommerce-page form .show-password-input { top: calc(50% - .625rem)!important; color: var(--Text-Secondary); transform: none!important } .woocommerce form .show-password-input::before, .woocommerce-page form .show-password-input::before { font-family: 'midgards'!important; content: "\e918"!important; } /* end account page */ /* fancybox style */ .fancybox-bg { background: #fff!important; } .fancybox-is-open .fancybox-bg { opacity: .95!important; } .single-product .woocommerce-notices-wrapper { display:none!important } /* cwginstock-subscribe-form */ .cwginstock-panel-heading h4 { margin-bottom:0; font-size: 1.25rem } .cwginstock-subscribe-form input[type="submit"] { font-family: 'Hanken Grotesk', sans-serif; font-weight: 600 !important; letter-spacing: 0; font-size: .875rem !important; height: auto; } .cwg_iagree_checkbox input[type=checkbox] { -webkit-appearance: auto; -moz-appearance: auto; appearance: auto; margin-right: .25rem; } .cwginstock-subscribe-form .form-group { margin-bottom: 0 } .cwg_iagree_checkbox { margin-bottom: 12px } .cwginstock-panel-body input[type=email], .cwginstock-panel-body input[type=text] { height: 2.5rem; }