/* CSS only 95.53K, CSS & InlineSvg (17/31) 123.49K => 29% more */

@font-face { font-family: 'Header-Font'; font-display: swap; src: url('/img/Neuzeit-Grotesk-Light.eot'); src: url('/img/Neuzeit-Grotesk-Light.woff2') format('woff2'), url('/img/Neuzeit-Grotesk-Light.woff') format('woff'), url('/img/Neuzeit-Grotesk-Light.eot?#iefix') format('embedded-opentype'), url('/img/Neuzeit-Grotesk-Light.ttf') format('truetype'); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2212,U+2215,U+E0FF,U+EFFD,U+F000; }
/* CSS base, search, meili-extra, aa, kachel, kachel_mouseover, powermenu, powermenue-extra, to-top-button, input-floating, kachel-stapel, kachel-slider, highslide_v2, drag-zoom, tabs */
/* ### base ### */
*, ::before, ::after { box-sizing: border-box; } html { text-size-adjust: none; } ::before, ::after { text-decoration: inherit; vertical-align: inherit; } ::selection { background: var(--theme-accent-medium); color: var(--theme-text); } :root { cursor: default; line-height: 1.5; overflow-wrap: break-word; -moz-tab-size: 4; tab-size: 4; -webkit-tap-highlight-color: transparent; -webkit-text-size-adjust: 100%; } body { font-size: 1rem; overflow-y: scroll; margin: 0; text-rendering: optimizeLegibility; font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; overscroll-behavior-x: none; --header-width: 1600px; --theme-white: rgba(255,255,255); --theme-light: rgba(245,245,245); --theme-medium: rgb(238,238,238); --theme-dark: rgb(220, 220, 220); --theme-grau: rgb(180, 180, 180); --theme-link: rgb(185,159,89); --theme-gold: rgb(185,159,89); --theme-orange: rgb(211,85,1); --theme-turkis: rgb(0,139,139); --theme-turkis2: rgb(0,139,139); --theme-text: rgb(0,0,0); --theme-black: rgb(0,0,0); --theme-text-shadow: 0 0 3px rgba (0,0,0,.5); --theme-text-hover: rgb(112, 105, 89); --theme-accent: rgb(112, 105, 89); --theme-accent-light: rgba(112, 105, 89,.25); --theme-accent-medium: rgb(183, 180, 172); --theme-accent-dark: rgb(0, 0, 0); --theme-accent-text: rgb(255,255,255); --theme-powermenu-medium: rgb(255, 255, 255); --theme-border: none; --theme-outline: none; --theme-radius-small: .0; --theme-radius-medium: 0; --theme-card-background: rgb(255,255,255); --theme-divider: .1rem solid var(--theme-medium); --padding: 1rem; --card-padding: 0; --shadow-elevation-low: 0; --shadow-elevation-medium: 0; --shadow-elevation-high: 0; --theme-red: rgb(158, 27, 16); --theme-error: rgb(158, 27, 16); --theme-error-text: rgb(255,255,255); --theme-warning: rgb(199, 161, 92); --theme-warning-text: rgb(255,255,255); --theme-success: rgb(20,130,20); --theme-success-text: rgb(255,255,255); background: var(--theme-white)!important; } body, input, button, .button { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } b, strong { font-weight: bolder; color: inherit; } .red { color: var(--theme-error); } .bgred { background-color: var(--theme-error); color: var(--theme-white); padding: 1rem; } .center { text-align: center; } .small { font-size: .75rem; } .border { border: var(--theme-divider); } audio, canvas, iframe, img, svg, video { vertical-align: middle; max-width: 100%; height: auto; } iframe { border-style: none; } svg:not([fill]) { fill: currentColor; } table { border-collapse: collapse; border-color: inherit; text-indent: 0; } button, input, select { margin: 0; accent-color: var(--theme-accent-medium); } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; font-family: inherit; } textarea { margin: 0; resize: vertical; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } ::-webkit-input-placeholder { color: inherit; opacity: 0.54; } ::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } body { background-color: var(--theme-light); color: var(--theme-text); } h1, h2, h3, h4, h5, h6 { color: var(--theme-text); font-family: 'Header-Font'; } ul { padding: 0; } ul.mleft li { margin-left: 2rem; list-style: disc; padding: .5rem 0; } body, #shopLayer, #shopMain { max-width: 100vw; } .shopHeader { background-color: var(--theme-white); z-index: 99; } #kopf_top_line { position: sticky; top: 0; z-index: 100; } #kopf_bottom_line { background-color: var(--theme-white); box-shadow: var(--shadow-elevation-medium); } #shopMain { min-height: 100vh; } #kopf_top_line { box-shadow: 0 0 25px -5px rgba(0,0,0,.25); } /* html anchor */ html { scroll-behavior: smooth; scroll-padding-top: 5rem; } @media screen and (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } } ::placeholder, ::-webkit-input-placeholder { color: var(--theme-text); opacity: .7; } a { text-decoration: none; color: var(--theme-link); transition: all 0.5s; } p a:hover { color: var(--theme-text-hover); } h1 { font-size: 1.75rem; } .h1_in_breadcrumb { font-size: inherit; } h1.centerdesk + p { margin-top: 0; } h2 { font-size: 1.75rem; } h3 { font-size: 1.5rem; } h4 { font-size: 1rem; } h5 { font-size: 1rem; } h6 { font-size: 1rem; } hr { border: var(--theme-divider); } .pg-only { display: none; } .right { text-align: right; } /* header */ #shopFooter a, .BreadcrumbList a, .breadcrumb a span, *[itemtype*="Breadcrumb"] * { color: var(--theme-text); } .shopHeader li, #shopFooter li { list-style: none; } #k_title { width: 100%; height: 2rem; background: var(--theme-dark)!important; position: relative; z-index: 101; } #k_title ul { width: 100%; display: flex; flex-wrap: nowrap; justify-content: space-between; margin: 0 auto; padding: 0 1rem; } #k_title ul li { font-size: 0.8rem; line-height: 2rem; white-space: nowrap; text-transform: uppercase; letter-spacing: .1rem; } #k_title ul li, #k_title ul li a { color: var(--theme-text); font-family: 'Header-Font'; } #k_title ul li a:hover { color: var(--theme-text-hover); } #k_title ul li:nth-child(2), #k_title ul li:nth-child(3), #k_title ul li:nth-child(4) { display: none; } #k_title ul li a.active { font-weight: bold; } .ausrichter { padding: 0 1.5rem; } .max950 { max-width: 950px; margin: 0 auto; } .max1200 { max-width: 1200px; margin: 0 auto; } #kopf_top_line_inner { display: flex; justify-content: space-between; align-items: center; width: 100%; height: 4rem; padding: 0 1rem; } #k_icons { width: 12rem; } #k_logo { width: 4.5rem; height: 4rem; position: relative; } #k_logo img { position: absolute; height: 3rem; top: .5rem; } #suchbox { display: none; } #k_icons { display: flex; align-items: center; justify-content: flex-end; } #k_lupe_2 { background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"  viewBox="0 0 60.7 60.7" style="enable-background:new 0 0 60.7 60.7;" xml:space="preserve"><style type="text/css"> .st0{fill:none;stroke:%231E1E1E;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;} .st1{fill:none;stroke:%231E1E1E;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;}</style><circle class="st0" cx="27.9" cy="27.9" r="20.6"/><line class="st1" x1="54.1" y1="54.1" x2="42.9" y2="42.9"/></svg>'); background-repeat: no-repeat; background-position: 50%; } #k_merk { background-image: url(/img/bg-merken.svg); background-repeat: no-repeat; background-position: 50%; } #k_account { background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"  viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve"><style type="text/css"> .st0{fill:%23FFFFFF;stroke:%231E1E1E;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}</style><path id="user" class="st0" d="M68.1,30.1c0,10.4-8.4,18.8-18.8,18.8s-18.8-8.4-18.8-18.8s8.4-18.8,18.8-18.8S68.1,19.7,68.1,30.1z  M65,55.6h-0.1c-2.5,0-4.9,0.7-7.2,1.8c-2.5,1.3-5.4,2-8.4,2c-3,0-5.9-0.7-8.4-2c-2.2-1.1-4.7-1.8-7.2-1.8h-0.1 c-12.1,0-21.9,9.8-21.9,21.9v13.2h75.2V77.5C86.9,65.4,77.1,55.6,65,55.6z"/></svg>'); background-repeat: no-repeat; background-position: 50%; } #k_wk { background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"  viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve"><style type="text/css"> .st0{fill:none;stroke:%231F1F1F;stroke-width:3.6;stroke-miterlimit:10;} .st1{fill:%23FFFFFF;}</style><g> <g>  <polyline class="st0" points="12.5,51 21.3,89.9 78.7,89.9 87.5,51 "/>  <line class="st0" x1="30.2" y1="51.6" x2="35.1" y2="81.8"/>  <line class="st0" x1="25.9" y1="43" x2="40.5" y2="7"/>  <line class="st0" x1="74.1" y1="43" x2="59.5" y2="7"/>  <line class="st0" x1="50" y1="51" x2="50" y2="81.8"/>  <line class="st0" x1="69.8" y1="51.6" x2="64.9" y2="81.8"/>  <path class="st0" d="M79.3,38.7h8.6c3.9,0,7,3.1,7,7V51H5.1v-5.3c0-3.9,3.1-7,7-7h8.3"/>  <line class="st0" x1="34.5" y1="38.7" x2="65.5" y2="38.7"/> </g> <rect x="31" y="80.5" class="st1" width="37.2" height="4"/></g></svg>'); background-repeat: no-repeat; background-position: 50%; } #k_lupe_2, #k_merk, #k_account, #k_wk, #powermenue-schalter { position: relative; display: block; height: 3rem; width: 2.5rem; background-size: 1.8rem; justify-content: flex-end; align-items: center; cursor: pointer; } .k_link { display: none; } #k_account[data-online="0"] .k_link { display: block; height: 100%; width: 100%; } @media (hover: hover) { .k_link { display: block; height: 100%; width: 100%; } } #k_icons > div > .shBagInh { position: fixed; left: var(--padding); right: var(--padding) !important; width: auto; top: 5.4rem; z-index: 99; padding: 1rem; pointer-events: none; transform: translateY(-1rem); opacity: 0; visibility: hidden; background-color: var(--theme-white); box-shadow: 0 0 25px -5px rgba(0,0,0,.25); transition: opacity .2s ease-out, transform .2s ease-out; } .shopHeader.box-shadow #k_icons > div > .shBagInh { top: 3rem; } #k_icons > div:hover > .shBagInh { pointer-events: all; transform: translateY(0); opacity: 1; visibility: visible; overflow: hidden; } #k_icons > div > .shBagInh .wk-empty { display: none; } #k_icons > div[data-num="0"] .shBagInh .wk-empty, #k_icons > div[data-num=""] .shBagInh .wk-empty { display: block; text-align: center; font-weight: bold; height: 10rem; line-height: 10rem; } .wk-heading { text-align: center; font-weight: bold; padding: 1rem 0 .5rem 0; border-bottom: var(--theme-divider); } .wk-heading a { color: var(--theme-text); } #k_icons > div[data-num="0"] .wk-heading, #k_icons > div[data-num=""] .wk-heading { display: none; } ul.alt-list { list-style: none; padding: 0; margin: 0; max-height: calc(100vh - 30rem); overflow-y: auto; } ul.alt-list > li { display: block; } ul.alt-list > li > a { display: block; padding: .5rem; background-position: 0 .5rem; background-size: 3rem; background-repeat: no-repeat; color: var(--theme-text); } ul.alt-list.items > li > a { padding: .5rem .5rem .5rem 4rem; min-height: 4rem; background-position: .5rem 50%; color: var(--theme-text); } ul.alt-list > li > a:hover { color: var(--theme-gold); } #k_icons > #k_merk > .shBagInh ul > li > a { display: flex; align-items: center; min-height: 3rem; font-weight: normal;} ul.alt-list a * { color: var(--theme-text); } #k_icons > div[data-num=""]:before, #k_icons > div[data-num="0"]:before, #k_merk[data-num=""]:before, #k_merk[data-num="0"]:before { display: none; content: ""; } #k_merk:before, #k_wk:before { content: attr(data-num); position: absolute; top: 1.5rem; right: 0; color: var(--theme-white)!important; width: 1rem; height: 1rem; line-height: 1rem; text-align: center; vertical-align: middle; border-radius: 50%; box-shadow: var(--shadow-elevation-low); font-size: 0.8rem; } #k_wk:before { background-color: var(--theme-red); } #k_merk:before { background-color: var(--theme-red); } .shBagInh .Wkbuttons { padding: 1rem; text-align: right; display: flex; justify-content: space-between; } .shBagInh .Wkbuttons .button { font-weight: bold; padding: 1em 1.5em; } .shBagInh .Wkbuttons #wkbutton { margin-right: 1rem; } #powermenue-schalter { margin: 0; background: url('data:image/svg+xml,<%3Fxml version="1.0" %3F><svg fill="%23000000" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path class="heroicon-ui" d="M4 5h16a1 1 0 0 1 0 2H4a1 1 0 1 1 0-2zm0 6h16a1 1 0 0 1 0 2H4a1 1 0 0 1 0-2zm0 6h16a1 1 0 0 1 0 2H4a1 1 0 0 1 0-2z"/></svg>') no-repeat 50%; background-size:2rem; } #shopLayer.powermenue-open #k_title { display: none; } /* such feld */ #shopLayer.suche-offen #suchbox { display: block; width: 100%; } #shopLayer.suche-offen #k_logo, #shopLayer.suche-offen #k_icons, #shopLayer.suche-offen #powermenue-schalter { display: none; } #shopLayer.suche-offen #k_lupe_3 { display: flex; gap: var(--padding); align-items: center; } #shopLayer.suche-offen #h-ps-close { display: inline-block; height: 2.5rem; background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"  viewBox="0 0 24 24" style="enable-background:new 0 0 24 24;" xml:space="preserve"><style type="text/css"> .st0{fill:%23FFFFFF;}</style><path class="st0" d="M18.8,16.9l-5.1-5.1l5.1-5.1c0.6-0.6,0.6-1.4,0-2s-1.4-0.6-2,0l-5.1,5.1L6.6,4.7c-0.6-0.6-1.4-0.6-2,0 s-0.6,1.4,0,2l5.1,5.1l-5.1,5.1c-0.6,0.6-0.6,1.4,0,2s1.4,0.6,2,0l5.1-5.1l5.1,5.1c0.6,0.6,1.4,0.6,2,0 C19.3,18.3,19.3,17.4,18.8,16.9z"/></svg>'); background-position: center; background-repeat: no-repeat; background-size: 36%; background-color: var(--theme-accent); } input#menSuchStr { max-width: 100%; } #shopLayer #k_lupe_3 > div { width: 100%; position: relative; } #shopLayer #k_lupe_3 #menSuchStrIcon { position: absolute; height: 100%; aspect-ratio: 1 / 1; top: 0; right: 0; pointer-events: none; background-image: url(/img/search.svg); background-size: 50%; background-position: center; background-repeat: no-repeat; } /* main */ #shopMain { max-width: var(--header-width); padding: var(--padding); margin: 0 auto; } /* footer */ #shopFooter { background-color: var(--theme-medium); border-top: .1rem solid var(--theme-dark)!important; } .foot_infos { padding: 2rem var(--padding); width: 100%; max-width: var(--header-width); margin: 0 auto; position: relative; text-align: center; display: flex; flex-wrap: wrap; justify-content: space-between; padding-bottom: 0!important; } .foot_infos ul { width: 100%; margin-bottom:2rem; } .foot_infos ul li { margin-bottom: .5rem; } .foot_infos ul.soc { width: 100%; display: flex; flex-wrap: wrap; justify-content: center; min-height: auto; margin-bottom: 0!important; } .foot_infos ul.soc li.foot_ueb { width: 100%; } .foot_infos ul.pay { width: 100%; display: flex; flex-wrap: wrap; justify-content: center; min-height: auto; } .foot_infos .foot_ueb { display: inline-block; height: 2rem; text-transform: uppercase; letter-spacing: 0.10em; white-space: nowrap; margin-bottom: 0; } .foot_infos #info_zahl { display: flex; flex-wrap: wrap; justify-content: center; margin-top: .5rem; } .foot_infos #info_zahl:hover { transform: translateY(-.2rem) translateZ(0); } .foot_infos #info_zahl img { width: 4rem; margin: .5rem; height: 100%; border-radius: .5rem; } .foot_infos ul.soc li a {display:inline-block;width:2rem;height:2rem;margin: .5rem;padding:0;} #shopFooter #f_text { text-align: center; padding: 2rem; background: var(--theme-medium)!important; color: var(--theme-text)!important; } #shopFooter #f_text { background-color: var(--theme-dark); color: var(--theme-text); } #shopFooter #f_text > span { display: block; font-size: .8rem; } #shopFooter .unten #f_text span.br { display:block;height:0; } #shopFooter .unten #f_text span.pipe { display:none; } #shopFooter a:hover { color: var(--theme-gold); } #foot-ber { display: flex; align-items: center; justify-content: center; font-weight: bold; } #foot-ber img { margin-right: .5rem; } .zul_anges_art { background: var(--theme-white)!important; border-bottom: .1rem solid var(--theme-dark)!important; } .zuletzt_items { display: flex; flex-wrap: wrap; padding: 0 0 5rem 0; gap: .3rem; } .zuletzt_items .zuletzt { border: var(--theme-divider); } .zuletzt_items .zuletzt a { display: block; border: var(--theme-border) ;border-radius: var(--theme-radius-small); box-shadow: var(--shadow-elevation-medium); background-color: white; transition: box-shadow .3s ease-out; overflow: hidden; padding: 0 .5rem; } .zuletzt_items .zuletzt:hover a { box-shadow: var(--shadow-elevation-high); } .zuletzt_items .zuletzt a img { width: 5rem; height: 5rem; object-fit: contain; } .zuletzt_fix { padding-top: 2rem; } .zuletzt_fix .ueb { display:block; margin-bottom:.5rem; } .animate { transition: all .1s ease-out; } .loading { opacity: 0; transform: scale(.9) skew(5deg, 5deg); } /* rating */ .rat_stars { display: block; } .anzBew { color: var(--theme-accent); font-size: .9em; } .rat_stars * { background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13"><style type="text/css">.st0{fill:RGB(238,177,29);}</style><path class="st0" d="M13 5h-4.7l-1.8-5-1.8 5h-4.7l3.9 2.9-1.4 5.1 4-3.1 4 3.1-1.4-5.1 3.9-2.9zm-6.5 3.5l-2.2 1.8.9-2.6-2.1-1.7 2.6.1.8-3 .8 3 2.6-.1-2.1 1.7.9 2.6-2.2-1.8z"/></svg>'); height: 1.25rem; width: 1rem; margin-right: .3rem; display: block; float: left; background-repeat: no-repeat; background-position: center; background-size: 90%; } .rat_stars i { background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 13 13"><style type="text/css">.st0{fill:RGB(238,177,29);}</style><path class="st0" d="M6.5 0l1.8 5h4.7l-3.9 2.9 1.4 5.1-4-3.1-4 3.1 1.4-5.1-3.9-2.9h4.7z"/></svg>'); } .rat_stars b { background-image: url(/img/star-outline-h.svg); } .rattext { min-height: 6rem; } /* card */ .card { display: block; position: relative; box-shadow: var(--shadow-elevation-medium); border: var(--theme-border); background-color: var(--theme-card-background); border-radius: var(--theme-radius-small); padding: var(--card-padding) calc(var(--card-padding) * 1.5); overflow: hidden; transition: box-shadow .3s ease-out; transition: all .3s ease-out; } a.card:hover { box-shadow: var(--shadow-elevation-high); transform: translateY(-.2rem) translateZ(0); } .card.login-div { overflow: unset; } .card.p-0 { padding: 0; } .card .card-info { .card .full, margin: 0 calc(var(--card-padding) * -2); width: calc(100% + calc(var(--card-padding) * 4)); max-width: calc(100% + calc(var(--card-padding) * 4)); padding: 1rem 0!important; } .card.p-0 .full, .card.p-0 .card-info { margin: 0; } .card.p-0 .card-info { width: 100%; max-width: 100%; } .card img.full.top { margin-top: calc(var(--card-padding) * -1); width: 100%!important; } .card > h1:first-child, .card > h2:first-child, .card > h3:first-child, .card-info > h3:first-child { margin-top: calc(var(--card-padding) / 2); } .card.accent, .card.accent a, .card .card-info.accent, .card .card-info.accent a { background-color: var(--theme-accent-medium); color: var(--theme-accent-text); } .card.accent h1, .card.accent h2, .card.accent h3, .card.accent h4, .card.accent h5, .card.accent h6 { color: var(--theme-accent-text); } .card .card-info { padding: 1rem 2rem; border-top: var(--theme-divider); border-bottom: var(--theme-divider); } .card .card-info:first-child { border-top: none; border-bottom: none; } .card:not(.p-0) .card-info:first-child { margin-top: calc(var(--card-padding) * -1); } .card .card-info:last-child { margin-bottom: calc(var(--card-padding) * -1); border-bottom: none; } .mt-2 { margin-top: 1rem!important; } .mt-4 { margin-top: 2rem!important; } .mt-6 { margin-top: 3rem!important; } .mt-4 { margin-top: 2rem!important; } .mb-0 { margin-bottom: 0!important; } .mb-2 { margin-bottom: 1rem!important; } .mb-4 { margin-bottom: 2rem!important; } .mb-6 { margin-bottom: 3rem!important; } .mb { margin-bottom: var(--padding); } .p-0 { padding: 0!important; } .p-1 { padding: 1rem!important; } .p-4 { padding: 2rem!important; } .pb-2 { padding-bottom: 1rem; } /* scrollbar */ #shopLayer ::-webkit-scrollbar { width: .5rem; } #shopLayer ::-webkit-scrollbar-track { background-color: var(--theme-light); } #shopLayer ::-webkit-scrollbar-thumb { background: var(--theme-medium); border-radius: 10px; } #shopLayer { scrollbar-color: var(--theme-dark) var(--theme-accent-medium)!important; scrollbar-width: thin; } /* button */ button, .button { display: inline-block; background-color: var(--theme-accent-dark); border: none; padding: 1rem 2rem; font-size: 1rem; text-transform: uppercase; color: var(--theme-white); border-radius: 3rem; cursor: pointer; transition: all .3s ease-out; user-select: none; } button:hover, .button:hover { box-shadow: var(--shadow-elevation-high); color: var(--theme-white); background-color: var(--theme-text-hover)!important; } button.big, .button.big { width: 100%; padding: 1rem .5rem; font-size: 1.25rem; text-align: center; text-transform: uppercase; } button.big.icon:before, .button.big.icon:before { content: ''; background-repeat: no-repeat; background-position: center; background-size: 1.5rem; display: inline-block; margin-right: .5rem; margin-top: -0.5rem; height: 2rem; width: 2rem; vertical-align: middle; } button:disabled, .button:disabled { opacity: .5; cursor: no-drop; } button.cancel, .button.cancel, button.secondary, .button.secondary { background-color: var(--theme-accent-light); color: var(--theme-text); margin-top: 1rem; } button.cancel { margin-right: 1rem; } .button-group { display: grid; grid-gap: var(--padding); grid-template-columns: 1fr 1fr; } .button-group > .button, .button-group > button { text-align: center; } /* input */ input[type="text"], input[type="email"], input[type="number"], input[type="tel"], input[type="password"], input[type="date"], textarea, select, input[type="range"] { width: 100%; max-width: 100%; } input[type="text"], input[type="email"], input[type="number"], input[type="tel"], input[type="password"], input[type="date"], textarea, select { border: none; border-bottom: 1px solid transparent; border-radius: var(--theme-radius-small); box-shadow: none!important; background-color: var(--theme-light)!important; padding: 0.5rem .8rem; color: var(--theme-text); font-size: 1rem; height: 2.5em; font-family: inherit; } textarea { min-height: 10rem; resize: vertical; } input[type="text"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="password"]:focus, input[type="date"]:focus, textarea:focus { outline: none; border-bottom: 1px solid var(--theme-accent-medium); } input[type="number"] { max-width: 5rem; } .inp_wrapper[data-typ="number"] { display: inline-block; margin-right: 0.5rem; } .inp_wrapper.error div { font-size: .9rem; color: var(--theme-error-text); background-color: var(--theme-error); padding: .4rem .8rem; margin-top: .2rem; border-radius: var(--theme-radius-small); } .inp_wrapper[data-typ="checkbox"] { display: flex; align-items: start; } .inp_wrapper[data-typ="checkbox"] > input { margin: 0; margin-top: .3rem; height: 1.25rem; width: 1.25rem; } .inp_wrapper[data-typ="checkbox"] input + label { display: block; margin-left: .7rem; position: relative; top: unset; left: unset; transform: unset !important; pointer-events: all; font-size: .95rem; max-width: 22.5rem; width: 22.5rem; text-align: left; } .inp_wrapper[data-type="radio"] { margin-top: 0.2rem; } .radio-group { margin-top: 1.5rem;} input[disabled] + label, input[disabled] + label * { opacity: .7; } .inp_wrapper .inp_error { border-bottom: 2px dashed var(--theme-error) !important; } /* geht nicht in firefox weil input & :before da nicht geht input[type="checkbox"] { visibility: hidden; } input[type="checkbox"]:after { content: ' '; visibility: visible; width: 1rem; height: 1rem; background: var(--theme-white); border-radius: .25rem; display: block; margin: .1rem .5rem 0 0; border: .1rem solid rgb(204,204,204); } input[type="checkbox"]:checked:after { background: var(--theme-accent-medium) !important; } */ /* - + input */ .inp_wrapper[data-typ="number-custom"] > div.inc, .inp_wrapper[data-typ="number-custom"] > div.dec { float: left; width: 1.6rem; height: 2.5rem; margin-top: 0; text-align: center; line-height: 2.2rem; background-color: var(--theme-medium); border-radius: var(--theme-radius-small); box-shadow: var(--shadow-elevation-medium); cursor: pointer; user-select: none; } .inp_wrapper[data-typ="number-custom"] > div.dec { border-top-right-radius: 0; border-bottom-right-radius: 0; } .inp_wrapper[data-typ="number-custom"] > div.inc { border-top-left-radius: 0; border-bottom-left-radius: 0; } .inp_wrapper[data-typ="number-custom"] { height: 3rem; width: 8.2rem; margin: 0 auto; display: inline-block; } .inp_wrapper[data-typ="number-custom"] input { float: left; width: 2.7rem; text-align: center; margin-top: 0; padding-left: 0; padding-right: 0; border-radius: 0; z-index: 2; position: relative; } .inp_wrapper[data-typ="number-custom"] input::-webkit-outer-spin-button, .inp_wrapper[data-typ="number-custom"] input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .inp_wrapper[data-typ="number-custom"] input[type=number] { -moz-appearance: textfield; } .inp_wrapper[data-typ="number-custom"] input[type=number] + label { transform: translate(-0.8rem, -2.8rem); } .inp_wrapper[data-typ="number-custom"] > div.del { width: 2rem; height: 2.5rem; float: left; font-size: 0; cursor: pointer; user-select: none; background: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><svg xmlns="http://www.w3.org/2000/svg" version="1.1" id="Layer_1" x="0px" y="0px" viewBox="0 0 64 64" enable-background="new 0 0 64 64" xml:space="preserve" width="512px" height="512px"><g id="Urn"> <path d="M51.8656998,5.4326H40.6636009V5.4159999c0-1.4462998-0.5634995-2.8055999-1.5870018-3.8290999 C38.0531998,0.5635,36.6927986,0,35.2456017,0H29.9438c-1.4237823,0-2.7626991,0.5537-3.7684994,1.5596 C25.1693993,2.5655,24.6147003,3.9043,24.6147003,5.3291001V5.4326H12.0991001 c-2.9579992,0-5.3651996,2.4063001-5.3651996,5.3642998v5.1416006c0,0.5526991,0.4472003,0.999999,1,0.999999h2.8309999v37.1523018 c0,2.6455002,1.0313005,5.1338005,2.9033003,7.006897C15.3393002,62.9696999,17.8285999,64,20.4761009,64h23.2402 c2.5967178,0,5.0380974-1.0107002,6.872097-2.8466988c1.8359032-1.8369026,2.8466187-4.2763023,2.8466187-6.8701019V16.9384995 h2.8310814c0.5527,0,1-0.4473,1-0.999999v-5.1055002C57.266098,7.8555002,54.8432007,5.4326,51.8656998,5.4326z  M51.4350166,54.2831993c0,2.0596008-0.8027153,3.9971008-2.2607155,5.4561005C47.7173004,61.1973,45.778801,62,43.716301,62 h-23.2402c-2.1133003,0-4.0997009-0.8222008-5.5938005-2.3163986c-1.4727001-1.4736023-2.3174-3.5116997-2.3174-5.5928001 V16.9384995h38.8701172V54.2831993z M55.266098,14.9385004h-2.8310814H11.5649004H8.733901v-4.1416006 c0-1.8555002,1.5096998-3.3642998,3.3651991-3.3642998h13.5156002c0.5527992,0,1-0.4471998,1-1V5.3291001 c0-0.8906002,0.3456993-1.7265,0.9745998-2.3545001C28.2084999,2.3555,29.0669003,2,29.9438,2h5.3018017 c0.8994179,0,1.7802963,0.3652999,2.4169998,1.0009999c0.6455002,0.6455002,1.0009995,1.5029001,1.0009995,2.415V6.4326 c0,0.5528002,0.4472008,1,1,1h12.2020988c1.875,0,3.4003983,1.5254002,3.4003983,3.4004002V14.9385004z" fill="rgb(79,79,78)"/> <path d="M22.1557007,52.2344017c0.5527992,0,1-0.4473,1-1V26.2334003c0-0.5527-0.4472008-1-1-1c-0.5526829,0-1,0.4473-1,1 v25.0010014C21.1557007,51.7871017,21.6030178,52.2344017,22.1557007,52.2344017z" fill="rgb(79,79,78)"/> <path d="M32.4673004,52.2344017c0.5527191,0,1-0.4473,1-1V26.2334003c0-0.5527-0.4472809-1-1-1c-0.5528011,0-1,0.4473-1,1 v25.0010014C31.4673004,51.7871017,31.9144993,52.2344017,32.4673004,52.2344017z" fill="rgb(79,79,78)"/> <path d="M42.7798004,52.2344017c0.5527,0,1-0.4473,1-1V26.2334003c0-0.5527-0.4473-1-1-1c-0.552784,0-1,0.4473-1,1v25.0010014 C41.7798004,51.7871017,42.2270164,52.2344017,42.7798004,52.2344017z" fill="rgb(79,79,78)"/></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g><g></g></svg>') 50% no-repeat; background-size: 1.5rem; } .inp_wrapper.delete.required label { display: none; } /* toggle (css only radio group) */ .toggle { display: flex; border: var(--theme-border); box-shadow: var(--shadow-elevation-low); background-color: var(--theme-light); } .toggle > button { flex: 1; padding: 1rem; border-radius: 0; background-color: transparent; color: var(--theme-text); box-shadow: none; transition: color .3s ease-out; border-left: var(--theme-border); z-index: 2; } .toggle > button.active { color: var(--theme-accent-text); } .toggle > button:first-of-type { border-left: none; } .toggle:after { content: ''; position: absolute; top: 0; left: 0; height: 100%; background-color: var(--theme-accent-medium); transition: left .4s ease-out; border-radius: var(--theme-radius-small); } .toggle-slide-content { position: relative; border-bottom: var(--theme-divider); } .toggle-slide-content > div { position: absolute; top: var(--padding); left: 0; width: 100%; transform: translateX(-2rem); opacity: 0; visibility: hidden; z-index: -1; transition: all ease-out .3s; } /* default table */ .table { max-width: 100%; overflow-x: auto; } .table table { width: 100%; } .table th { text-align: left; min-width: 8rem; padding: calc(var(--padding) / 1.5) var(--padding); border-bottom: var(--theme-divider); background-color: var(--theme-card-background); font-size: 1rem; color: var(--theme-text); } .table td { padding: calc(var(--padding) / 2) var(--padding); border-bottom: var(--theme-divider); color: var(--theme-text); } .table td a { color: var(--theme-text); } .table td.no-border { border-bottom: none; } .table.clickable tr.clickable { cursor: pointer; background-color: var(--theme-card-background); transition: background .1s ease-out; } .table.clickable tr.clickable:hover { background-color: var(--theme-light); } .table.clickable td.clickable-link { padding: 0; } .table.clickable td.clickable-link > a { display: block; padding: calc(var(--padding) / 2) var(--padding); } .table.clickable tr.clickable.active { background-color: var(--theme-accent-dark); } .table.clickable tr.clickable.active > td > a { color: var(--theme-white); } .table tr:empty { display: none; } /* css dropdown */ .css_dropdown { position: relative; } .css_dropdown > div { cursor: pointer; padding: var(--padding); background: var(--theme-white) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="11" height="7" viewBox="0 0 11 7"><path fill="%23737981" d="M0 1.3l4.8 4.9.7.6.7-.6L11 1.3 9.7 0 5.5 4.2 1.3 0"/></svg>') no-repeat 90% 50%; background-size: 1.25rem; box-shadow: 0px 0px 10px rgba(0,0,0,.2); border-radius: .5rem; } .css_dropdown ul { display: block; position: absolute; z-index: 20; margin-top: 0; background-color: var(--theme-card-background); border-radius: var(--theme-radius-small); box-shadow: 0 0 25px -5px rgba(0,0,0,.25); list-style: none; left: 0; right: 0; padding: 0; opacity: 0; transition: opacity .2s ease-out, transform .2s ease-out; transform: translateY(-1rem); visibility: hidden; border: var(--theme-border); max-height: 30rem; overflow-y: auto; } .css_dropdown:hover ul { visibility: visible; opacity: 1; transform: translateY(0); } .css_dropdown ul li a, .css_dropdown ul li label { display: block; padding: .5rem .5rem .5rem 1rem; text-align: left; color: var(--theme-text); cursor: pointer; } .css_dropdown ul li { border-bottom: var(--theme-divider); } /* Tooltip <span class='tooltip'>Hover mich<div class='tooltiptext'>Lorem Ipsum</div></span> */ .tooltip { display: inline-block; border-bottom: 1px dotted var(--theme-text); position: relative; } .tooltip .tooltiptext { opacity: 0; visibility: hidden; transform: translate(0%, 1rem); top: 0; left: 0%; width: 20rem; max-width: 100%; background-color: black; color: white; text-align: left; padding: var(--padding); border-radius: var(--theme-radius-small); position: absolute; z-index: 11; transition: all .3s ease-out; } .tooltip.bottom .tooltiptext { transform: translate(0%, -1rem); bottom: unset; top: 100%; } .tooltip:hover .tooltiptext { opacity: 1; visibility: visible; transform: translate(0%, 0); } .tooltip .tooltiptext.wide { width: 20rem; } .PGerror, .PGwarning, .PGsuccess { border-radius: var(--theme-radius-small); padding: var(--padding); display: flex; gap: var(--padding); align-items: center; justify-content: right; border-left: 3px solid transparent; } .PGerror > img, .PGwarning > img, .PGsuccess > img { height: 4rem; } .error-div, .warning-div, .success-div { padding: .4rem .8rem; border-radius: var(--theme-radius-small); } .PGerror, .user-feedback.error, .user-feedback.error > h3, .error-div { background-color: var(--theme-error); color: var(--theme-error-text); } .PGwarning, .user-feedback.warning, .user-feedback.warning > h3, .warning-div { background-color: var(--theme-warning); color: var(--theme-warning-text); } .PGsuccess, .user-feedback.success, .user-feedback.success > h3, .success-div { background-color: var(--theme-success); color: var(--theme-success-text); } .error-div:empty, .warning-div:empty, .success-div:empty { display: none; } #user-feedback-wrapper { position: fixed; z-index: 99; pointer-events: none; top: 5rem; left: 50%; transform: translate(-50%, 0); width: 90vw; max-width: 45rem; } .user-feedback { position: relative; background-color: var(--theme-accent-medium); color: var(--theme-accent-text); padding: var(--padding); opacity: 0; transform: translate(0, -20%); border-radius: var(--theme-radius-small); box-shadow: var(--shadow-elevation-medium); transition: all .3s ease-out; } .user-feedback.open { opacity: 1; transform: translate(0, 0); margin-bottom: 1rem; } .user-feedback:before { position: absolute; bottom: 0; left: 0; right: 0; height: 0.2rem; content: ' '; background-color: white; transition: right .1s linear; } .user-feedback.open:before { right: 100%; } .user-feedback > h3 { margin-top: 0; } .hide { display: none; } .block { display: block; } .rotate-center:before { animation: rotate-center 0.6s ease-in-out both; } @keyframes rotate-center { 0% { transform: rotate(0); } 50% { transform: rotate(180deg) scale(.3); } 100% { transform: rotate(360deg) scale(1); } } .progress-symbol { display: none; } #shopLayer.progress .progress-symbol { display: block; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0,0,0,.2); } .lds-ellipsis { display: inline-block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 80px; height: 80px; } .lds-ellipsis div { position: absolute; top: 33px; width: 13px; height: 13px; border-radius: 50%; background: var(--theme-accent-medium); animation-timing-function: cubic-bezier(0, 1, 1, 0); } .lds-ellipsis div:nth-child(1) { left: 8px; animation: lds-ellipsis1 0.6s infinite; } .lds-ellipsis div:nth-child(2) { left: 8px; animation: lds-ellipsis2 0.6s infinite; } .lds-ellipsis div:nth-child(3) { left: 32px; animation: lds-ellipsis2 0.6s infinite; } .lds-ellipsis div:nth-child(4) { left: 56px; animation: lds-ellipsis3 0.6s infinite; } @keyframes lds-ellipsis1 { 0% { transform: scale(0); } 100% { transform: scale(1); } } @keyframes lds-ellipsis3 { 0% { transform: scale(1); } 100% { transform: scale(0); } } @keyframes lds-ellipsis2 { 0% { transform: translate(0, 0); } 100% { transform: translate(24px, 0); } } .bestellung_action a, #pers_submen a { margin: 0.2rem; display: inline-block; padding: .5rem .75rem; } #pers_submen a { background-color: var(--theme-accent-light); color: var(--theme-text); } #pers_submen a.active, #pers_submen a:hover { background-color: var(--theme-accent); color: var(--theme-white); } #pers_submen { margin-bottom: 3rem; } #pers_submen .button { text-transform: unset; } .picva { width: 5rem; display:block; } .tab_k { margin-bottom: .5rem; } #bestellabschluss { text-align: center; } #megaBestellabschluss { display:block; height:14rem; width: 14rem; border-radius: 14rem; background: var(--theme-success); margin: 5rem auto 3rem auto; position:relative; } #megaBestellabschluss:before{content:' ';display:block;height:inherit;width:inherit;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="13" height="10" viewBox="0 0 13 10"><style type="text/css">.st0{fill:%23FFF;}</style><path class="st0" d="M0 5l2.9 2.9 2.1 2.1 2.2-2.1 5.7-5.8-2.2-2.1-5.7 5.7-2.8-2.8z"/></svg>') no-repeat 50% 50%; background-size:150px;animation: wobbel 1s 1 linear} #bestellabschluss p { text-align: center; font-size: 1.25rem; line-height: normal; } #bestellabschluss p span { font-size: 1rem; } #bestellabschluss form { width: max-content; margin: 0 auto;} #bestellabschluss form button { margin-top: 2rem; } #bestellabschluss h3 { font-size: 1.5rem; font-weight: bold; } .datenschutz-grid + input.button { float: right; } .card.dat { padding: 1rem; border: var(--theme-divider); } .card[data-za="2"] .zacheck .icon, .zacheckbue[data-za="2"] { background-image: url(/img/f_ls.svg); } .card[data-za="3"] .zacheck .icon, .zacheckbue[data-za="3"] { background-image: url(/img/f_vk.svg); } .card[data-za="4"] .zacheck .icon, .zacheckbue[data-za="4"] { background-image: url(/img/f_dhl-nachnahme.svg); } .card[data-za="5"] .zacheck .icon, .zacheckbue[data-za="5"] { background-image: url(/img/f_bar.svg); } .card[data-za="7"] .zacheck .icon, .zacheckbue[data-za="7"] { background-image: url(/img/f_rg.svg); } .card[data-za="8"] .zacheck .icon, .zacheckbue[data-za="8"] { background-image: url(/img/f_pp.svg); } .card[data-za="9"] .zacheck .icon, .zacheckbue[data-za="9"] { background-image: url(/img/f_kk.svg); } .card[data-za="12"] .zacheck .icon, .zacheckbue[data-za="12"] { background-image: url(/img/f_ap.svg); } .card[data-za="13"] .zacheck .icon, .zacheckbue[data-za="13"] { background-image: url(/img/pg_zahlart13.png); } .zacheckbue { height: 3rem; width: 5rem; background-position: center; background-size: contain; background-repeat: no-repeat;} #shopLayer[data-pp="perart"] #pag_se_all {display:none!important;} #shopLayer[data-pp="kont"] .zul_anges_art, #shopLayer[data-pp="agb"] .zul_anges_art, #shopLayer[data-pp="dat"] .zul_anges_art, #shopLayer[data-pp="wid"] .zul_anges_art { display:none; } #shopLayer[data-pp="kont"] .htm_include ul li, #shopLayer[data-pp="agb"] .htm_include ul li, #shopLayer[data-pp="dat"] .htm_include ul li, #shopLayer[data-pp="wid"] .htm_include ul li { margin-left: 1rem; } #shopLayer[data-pp="kont"] .tab_k, #shopLayer[data-pp="agb"] .tab_k, #shopLayer[data-pp="dat"] .tab_k, #shopLayer[data-pp="wid"] .tab_k { font-weight: bold; font-size: 1.5em; } #shopLayer[data-pp="ticket"] .button.ticket { background-color: var(--theme-accent); color: var(--theme-white); } .inp_wrapper[data-typ="checkbox"] > input { margin: 0; margin-top: .3rem; height: 1.25rem; width: 1.25rem; } #shopLayer .inp_wrapper label { font-size: 1rem; } .hinweis { background-color: var(--theme-light); padding: 1rem; } /* Gratisartikel */ .gratis-artikel { padding: 1rem; border: var(--theme-divider); background-color: var(--theme-card-background); } .ueberschrift-staffel { font-size: 1.5rem; width: 100%; } .gratis-artikel-anzeige { clear: both; display: flex; flex-wrap: wrap; justify-content: space-between; } .gratArtBox { width: 48%; padding: 1rem; margin: .5rem 0 1rem 0; border: var(--theme-divider); text-align: center; overflow: hidden; } .gratisName { height: 3rem; } .gratisThump { width: 100%; height: 220px; background-repeat: no-repeat; background-size: contain; background-position: center; margin: 1rem auto; } .gratisButton { padding: .5rem 0; } .ueberschrift-staffel { padding: 1rem 0; background-color: var(--theme-light); } .zk_glabel_tf {cursor: pointer;} .zk_glabel_of {display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.8);justify-content: center;align-items: center;z-index: 9999;} .zk_glabel_of img {max-width: 80%;max-height: 80%;} .zk_glabel_of:active {display: none;} body #pg-highslide { width: 90vw!important; } #pg-highslide img { max-height: 80vh; margin: 0 auto; display: block; } .breadcrumb { margin-bottom:.5rem!important; } .zuletzt_fix.ausrichter { padding: 1rem!important; } .start-tops { display: flex; background: var(--theme-light); padding: .5rem 0; justify-content: space-around; overflow: hidden; position: relative; } .start-tops div { font-size: .8em; display: flex; flex-wrap: wrap; padding: 0 .5rem; justify-content: center; align-items: center;} .start-tops div:before { content: ""; width: 3rem; height: 3rem; display: inline-block; margin: 0 .75rem; } .start-tops div.box1:before { background: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"  viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve"><style type="text/css"> .st0{fill:none;stroke:%231F1F1F;stroke-width:3.6;stroke-miterlimit:10;}</style><g> <path class="st0" d="M63.6,49.6c-4-2.4-8.7-3.6-13.6-3.6c-3.5,0-6.8,0.6-9.9,1.8 M36.7,39c-1.1,0.3-2.2,0.2-3.1-0.5  c-2-1.4-6.1-3.6-10.6-2.8c-0.6,0.1-1,0.7-0.8,1.3c0.6,1.6,1.6,4.7,2.6,7.4c0.3,1,0.1,2-0.6,2.8c-1.8,2-3.3,4.1-4.4,6.5  c-0.9,1.8-2.6,3-4.5,3.3L14.7,57c-1.2,0.1-2.2,1.2-2.2,2.4v10.9c0,2.2,1.6,4,3.8,4.2l0.6,0.1c1.6,0.1,3.1,1.1,3.9,2.5  c1.7,3.2,5,7.2,7.8,9.4c0.8,0.6,1.1,1.8,0.6,2.7l0,0c-1.5,2.7-0.3,6.2,2.6,7.4l0,0c2.2,0.9,4.8,0.2,6.2-1.7l1.9-2.5  c0.7-0.9,1.8-1.3,2.8-1.1c1.7,0.3,4.4,0.7,7.3,0.7c2.6,0,5-0.3,6.7-0.6c1.3-0.2,2.6,0.5,3.1,1.7l0.3,0.7c1.2,2.6,4.1,4,6.9,3.2l0,0  c3.3-0.9,5-4.5,3.8-7.6l-0.2-0.6c-0.5-1.4-0.1-2.9,1.1-3.8c6.8-5.1,11-12.5,11-20.8c0-8.9-4.9-16.8-12.6-21.9c-1-0.7-2-1.3-3.1-1.8  "/> <g>  <g> <g>  <g>   <path class="st0" d="M70.5,21.9C69.9,32,61.4,39.8,51.3,39.3C41.2,38.8,33.5,30.2,34,20.1C34.5,10,43.1,2.3,53.1,2.8  C63.2,3.3,71,11.9,70.5,21.9z"/>  </g> </g> <g>  <g>   <path class="st0" d="M47.5,26.2c0,2.2,2.1,3.9,4.7,3.9c2.6,0,4.7-1.8,4.7-3.9c0-4.8-9.4-5.5-9.4-10.4c0-2.2,2.1-3.9,4.7-3.9  c2.6,0,4.7,1.8,4.7,3.9"/>  </g>  <line class="st0" x1="52.2" y1="30.2" x2="52.2" y2="34"/>  <line class="st0" x1="52.2" y1="8.1" x2="52.2" y2="11.9"/> </g>  </g> </g> <path class="st0" d="M30.5,55.6c0,0.5-0.4,0.9-0.9,0.9c-0.5,0-0.9-0.4-0.9-0.9c0-0.5,0.4-0.9,0.9-0.9C30.1,54.6,30.5,55,30.5,55.6z  "/> <path class="st0" d="M85.7,46.8c3.1,0,5.5,2.5,5.5,5.5s-2.5,5.5-5.5,5.5c-2.2,0-4.1-1.3-5-3.1"/> <path class="st0" d="M73.3,64.6c0,5.1-2.5,9.7-6.5,13.1"/></g></svg>') 50% 50% no-repeat; background-size: contain; } .start-tops div.box2:before { background: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"  viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve"><style type="text/css"> .st0{fill:none;stroke:%231F1F1F;stroke-width:3.6;stroke-miterlimit:10;}</style><g> <g>  <g> <line class="st0" x1="64" y1="80" x2="35.8" y2="80"/> <path class="st0" d="M57.7,29.4h20.2c2.7,0,5,1.7,6,4.2L94.3,60v20H84"/> <path class="st0" d="M15.4,80h-5.4c-2.2,0-3.9-1.8-3.9-4l0-55h51.3v41.5H6"/>  </g>  <path class="st0" d="M94.3,59.8H73c-2,0-3.7-1.7-3.7-3.7V41.8h17.6"/> </g> <ellipse transform="matrix(0.9239 -0.3827 0.3827 0.9239 -28.3698 15.8832)" class="st0" cx="25.7" cy="79.3" rx="9.3" ry="9.3"/> <ellipse transform="matrix(0.9239 -0.3827 0.3827 0.9239 -24.6808 34.429)" class="st0" cx="74.2" cy="79.3" rx="9.3" ry="9.3"/> <ellipse transform="matrix(0.9239 -0.3827 0.3827 0.9239 -28.3698 15.8832)" class="st0" cx="25.7" cy="79.3" rx="9.3" ry="9.3"/> <ellipse transform="matrix(0.9239 -0.3827 0.3827 0.9239 -24.6808 34.429)" class="st0" cx="74.2" cy="79.3" rx="9.3" ry="9.3"/></g></svg>') 50% 50% no-repeat;background-size: contain;} .start-tops div.box3:before { background: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"  viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve"><style type="text/css"> .st0{fill:none;stroke:%231F1F1F;stroke-width:3.6;stroke-miterlimit:10;} .st1{fill:none;stroke:%23eeeeee;stroke-width:21;stroke-miterlimit:10;} .st2{fill:%23eeeeee;}</style><g> <g>  <g> <g>  <line class="st0" x1="6.6" y1="32.1" x2="42.4" y2="48"/>  <polygon class="st0" points="77.3,71.8 77.3,31.7 41.4,15.8 6.6,31.7 6.6,71.6 42.4,87.6   "/>  <line class="st0" x1="42.4" y1="48" x2="77.3" y2="32.1"/> </g> <line class="st0" x1="42.4" y1="48" x2="42.4" y2="87.4"/> <line class="st0" x1="59.3" y1="23.7" x2="24" y2="39.4"/>  </g> </g> <g>  <g> <g>  <path class="st1" d="M63.1,77.3h16.2c5.6,0,10.1-4.5,10.1-10.1l0,0c0-5.6-4.5-10.1-10.1-10.1h-7.5"/> </g>  </g>  <polyline class="st1" points="71.4,67.7 61.8,77.3 71.4,86.8 "/> </g> <g>  <g> <g>  <path class="st0" d="M63.1,77.3h16.2c5.6,0,10.1-4.5,10.1-10.1l0,0c0-5.6-4.5-10.1-10.1-10.1h-6.9"/> </g>  </g>  <polyline class="st0" points="71.4,67.7 61.8,77.3 71.4,86.8 "/> </g> <rect x="72.8" y="61.2" class="st2" width="6.6" height="12.9"/></g></svg>') 50% 50% no-repeat; background-size: contain;} .start-tops a.close { position: absolute; right: .25rem; top: -.25rem; font-size: 2rem; transform: rotate(45deg); cursor: pointer;} #clickxweg { position: absolute; right: .5rem; font-size: 1.25em; font-weight: bold; width: 2rem; height: 2rem; line-height: 2.5rem; text-align: center; background-color: var(--theme-black); border-radius: 2rem; color: var(--theme-white); background-image: url(/img/filter-x3.svg); background-repeat: no-repeat; background-position: 50%; background-size: 1rem; } .start-tops div span { text-align: center; } .start-tops div.box3 { margin-right: 1rem; } #k-service { display: block; font-size: .9rem; margin: 0; width: 2rem; height: 3rem; border-radius: 2rem; background: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"  viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve"><style type="text/css"> .st0{fill:none;stroke:%231F1F1F;stroke-width:3.6;stroke-miterlimit:10;}</style><g> <g>  <ellipse class="st0" cx="50.2" cy="50" rx="46.2" ry="46.5"/> </g> <g>  <g> <g>  <g>   <path class="st0" d="M36.9,44.6h20.6l-4.6,26.2c-0.1,0.6,0.4,1.2,1,1.2h3.6v5.8C52.4,81.3,38.5,83,40.2,69l4.2-23.8"/>   <ellipse class="st0" cx="52.2" cy="28.9" rx="7.7" ry="7.7"/>  </g> </g>  </g> </g></g></svg>') no-repeat 50% 50%; background-size: 1.5rem; color: var(--theme-text);} #k-service span { font-size: inherit; display: none; } body .datenschutz-grid > div { background-color: var(--theme-white); } iframe[name="google_conversion_frame"] { position: absolute; height: 0; } .pg-highslide { display: flex; justify-content: end; position: relative; } .pg-highslide.center { justify-content: center; } .pg-highslide .hs-gr-button { margin-right: .5rem; height: 2rem; } .pg-highslide-bg { z-index: 104!important; } #pg-highslide img { width: 100%; min-height:600px; overflow: scroll; min-width: 85vw; } #pg-highslide { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%; max-width: 900px; height: 80%; } #pg-highslide-close {width: 2rem; height: 2rem; background-color: var(--theme-white); background-image: url('data:image/svg+xml,<%3Fxml version="1.0" %3F><!DOCTYPE svg  PUBLIC '-//W3C//DTD SVG 1.1//EN'  'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg fill="%23000000" height="512px" id="Layer_1" style="enable-background:new 0 0 512 512;" version="1.1" viewBox="0 0 512 512" width="512px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"><path d="M437.5,386.6L306.9,256l130.6-130.6c14.1-14.1,14.1-36.8,0-50.9c-14.1-14.1-36.8-14.1-50.9,0L256,205.1L125.4,74.5  c-14.1-14.1-36.8-14.1-50.9,0c-14.1,14.1-14.1,36.8,0,50.9L205.1,256L74.5,386.6c-14.1,14.1-14.1,36.8,0,50.9  c14.1,14.1,36.8,14.1,50.9,0L256,306.9l130.6,130.6c14.1,14.1,36.8,14.1,50.9,0C451.5,423.4,451.5,400.6,437.5,386.6z"/></svg>'); background-repeat: no-repeat; background-size: 1.5rem; background-position: 50%; border-radius: 2rem; position: absolute; right: -2.5rem; z-index: 10; cursor: pointer; } #pg-highslide iframe, #pg-highslide x_iframe { display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: white; padding: 1rem; } .groessenbutton { display: flex; justify-content: space-between; align-items: center; height: auto; color: var(--theme-white); padding: .5rem 1rem .5rem 1rem; border-radius: 2rem; background-color: var(--theme-turkis); transition: all 0.5s; } .groessenbutton img.hs-gr-button { width: 2.5rem; } .groessenbutton:hover { background-color: var(--theme-accent); } 
@media (min-width: 576px) { #k_title ul li:nth-child(2) { display: block; } #k_icons > div > .shBagInh { right: 0; } button.big, .button.big { font-size: 1.25em; } button.big.icon:before, .button.big.icon:before { background-size: 1.75rem; margin-right: 1rem; } .foot_infos { overflow: auto; margin-bottom: 0; text-align: left; } .foot_infos .foot_ueb { display: block; } .foot_infos > ul { width: 50%; min-height: 11rem; } .foot_infos #info_zahl { justify-content: start; } .foot_infos #info_zahl img { margin: 0 1rem 1rem 0;} .foot_infos ul.soc li a { margin: .5rem 1rem 1rem 0; } #shopFooter #f_text { padding: 2rem; } #foot-ber { justify-content: start; } .sm-hide { display: none; } .sm-block { display: block; } tr.sm-block { display: table-row; } input[type="text"], input[type="email"], input[type="number"], input[type="tel"], input[type="password"], input[type="date"], textarea, select, input[type="range"] { width: 100%; max-width: 24rem; } .gr_1x2, .gr_2x2 { grid-column: span 2; } }
@media (min-width: 768px) { .shopHeader { position: relative; } html { scroll-padding-top: 2rem; } h1 { font-size: 1.7em; } h2 { font-size: 1.5em; } h3 { font-size: 1.25em; } #k-service { width: auto; height: 2.5rem; padding: .5rem 1rem .5rem 2.2rem; background-color: var(--theme-medium); background-size: 1.5rem; background-position: .3rem 50%; } #k-service span { display: block; } #k_title ul li:nth-child(3), #k_title ul li:nth-child(4) { display: block; } .k_ausrichter { display: block; } #kopf_top_line { position: relative; } #kopf_top_line.box-shadow { box-shadow: 0 0 25px -5px rgba(0,0,0,.25); } #kopf_top_line.box-shadow #k_logo img { height: 3rem; } #kopf_top_line_inner { height: 4rem; } #k_logo { width: 10rem; } #k_icons { width: 20rem; } #k_icons > div > .shBagInh { position: absolute; left: unset; right: calc(var(--padding) * -1); top: 2.8rem; width: calc(100vw - calc(var(--padding) * 2)); } #k_icons > #k_account > .shBagInh { right: calc(var(--padding) * -1); } #k_icons > #k_wk > .shBagInh, #k_icons > #k_merk > .shBagInh { width: 30rem; } #k_icons > #k_account > .shBagInh { width: 17rem; } ul.alt-list { max-height: 30rem; } #shopMain { margin-top: 0; } .start-tops div { flex-wrap: unset; } .foot_infos > ul { width: 33.33%; float: left; text-align: left;} #shopFooter .unten #f_text span.br { display:none; } #shopFooter .unten #f_text span.pipe { color:inherit;font-size:inherit;display: inline;padding: 0; } #user-feedback-wrapper { top: 6rem; z-index: 200; } .md-hide { display: none; } .md-block { display: block; } tr.md-block { display: table-row; } .advent_tooltipp { width: 80%; left: 10%; top: 2rem; }  }
@media (min-width: 992px) { html { scroll-padding-top: 7rem; } #k_men_zeile { height: 3rem; } #kopf_top_line { position: sticky; box-shadow: none; } #kopf_bottom_line { border-bottom: var(--theme-divider); } #kopf_top_line_inner { height: 5rem; } #k_lupe_2, #k_merk, #k_account, #k_wk, #powermenue-schalter { height: 4rem; width: 3rem; margin-left: 0.5rem; background-size: 2.25rem; } #k_logo img { height: 5rem; } .centerdesk { text-align: center!important; } #suchbox { display: flex; width: 50%; align-items: center; } #k_lupe_3 { width: 100%; } #k_lupe_3 input#menSuchStr { width: 100%; max-width: 100%; padding: 0.8rem 1rem;background-color: var(--theme-light); } #k_lupe_3 > div.lupe { background: rgb(255,255,255) url(/img/search.svg) no-repeat 97% 50%; } #h-ps-filter-toggle, #h-ps-close, #k_lupe_2 { display: none; } #shopLayer.suche-offen #k_logo, #shopLayer.suche-offen #k_icons { display: flex; } #shopLayer.suche-offen #suchbox { width: 50%; } .foot_infos > ul { width: 25%; } .foot_infos ul.soc, .foot_infos ul.pay { width: 50%; } .foot_infos ul.soc { justify-content: end; } .foot_infos ul.pay { justify-content: start; } .lg-hide { display: none; } .lg-block { display: block; } tr.lg-block { display: table-row; } .advent_tooltipp { width: 64%; left: 18%; top: 2rem; } .gratArtBox { width: 30%; }  }
@media (min-width: 1200px) { #k_title ul { max-width: var(--header-width); } .k_ausrichter, .ausrichter { max-width: var(--header-width); margin: 0 auto; } .foot_infos > ul { width: 20%; } .xl-hide { display: none; } .xl-block { display: block; } tr.xl-block { display: table-row; } .advent_tooltipp { width: 50%; left: 25%; top: 2rem; } .gratArtBox { width: 23%; } }
@media (min-width: 1400px) { .xxl-hide { display: none; } .xxl-block { display: block; } tr.xxl-block { display: table-row; } body .datenschutz-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1600px) { .xxxl-hide { display: none; } .xxxl-block { display: block; } tr.xxxl-block { display: table-row; } }
/* ### aa ### */
#aa_detail { display: grid; grid-template-areas: "pic" "basket" "unten"; grid-template-columns: 1fr; grid-gap: var(--padding); } #aa_pic_show { grid-area: pic; position: relative; border: var(--theme-divider); border-radius: var(--theme-radius-medium); } #aa_basket { grid-area: basket; margin-bottom: 1rem; border: var(--theme-divider); border-radius: var(--theme-radius-medium); padding: 1rem; } #aa_unten { grid-area: unten; } #aa_unten2 { grid-area: unten2; } #aa-multitab { grid-area: multitab; } #multiTab { background-color: var(--theme-light); border-collapse: unset; padding: 1rem; } #multiTab:empty { display: none; } #aa_unten2 #tabs { border: var(--theme-divider); } #aa_unten2 #tabs #aa_beschreibung { padding: 1rem; } #aa_unten2 #tabs #aa_gprs { padding: 1rem; } #aa_unten2 #tabs #aa_tipp { padding: 1rem; } #aa_unten2 #tabs #aa_bewer3 { padding: 1rem; } #aa_detail .azu_icon { position: absolute; top: 0; right: 0; z-index: 1; } #aa_detail .aa-proz { height: 2.5rem; width: 4rem; background-color: var(--theme-error); color: var(--theme-white); line-height: 2.5rem; text-align: center; font-size: 1rem; float: right; margin-left: .5rem; } #aa_detail .azu_icon { left: 0; right: unset; } #aa_pic_show figure { margin-top: 2rem; background-color: white; } #aa_pic_show picture img { height: 100%; width: 80%; object-fit: contain; margin: 0 auto; display: block; } #article-image[data-num="1"] #next-article-image, #article-image[data-num="1"] #prev-article-image { display: none; } @media (pointer: fine) { #next-article-image, #prev-article-image { position: absolute; top: calc(50% - 1.5rem); left: var(--padding); width: 3rem; height: 3rem; background-image: url(/img/artikel_zurueck.svg); background-position: center; background-repeat: no-repeat; background-size: 30%; cursor: pointer; background-color: rgba(150,150,150,.25); border-radius: 50%; box-shadow: var(--shadow-elevation-medium); transition: all .3s ease-out; } #next-article-image:hover, #prev-article-image:hover { box-shadow: var(--shadow-elevation-high); } #next-article-image { left: unset; right: var(--padding); background-image: url(/img/artikel_weiter.svg) } } #aa_detail nav { margin: 1rem 0 0 1rem; max-width: calc(100vw - calc(var(--padding) * 2)); overflow-x: auto; } #aa_detail nav[data-num="1"] { display: none; } #aa_detail nav .minipics a { flex: 1; display: block; aspect-ratio: 1 / 1; min-height: 3rem; min-width: 3rem; max-height: 5.2rem; max-width: 5.2rem; background-size: contain; background-repeat: no-repeat; background-position: center; background-color: white; border-radius: var(--theme-radius-small); box-shadow: var(--shadow-elevation-medium); transition: box-shadow .2s ease-out; border: 2px transparent solid; outline: var(--theme-outline); } #aa_detail nav .minipics a:first-of-type { margin-left: 0; } #aa_detail nav .minipics a.selected, #aa_detail nav.default .minipics a:first-of-type { border-color: var(--theme-accent-medium); } #aa_detail nav .minipics a:hover { box-shadow: var(--shadow-elevation-high); } #aa_detail nav .minipics { display: flex; flex-wrap: wrap; gap: var(--padding); margin-bottom: 1rem; } .ada_text { margin-bottom: 1rem; } .ada_text ul li { margin-left: 1rem; } #aa_nummer { margin-bottom: 1rem; } #aa_name { font-size: 1.5rem; font-weight: bold; font-family: 'Header-Font'; } .detail-hersteller-logo { position: absolute; right: 0; top: 0; z-index: 2; } .detail-hersteller-logo a { display: flex; height: 100%; justify-content: center; align-items: center; } .detail-hersteller-logo a img { max-width: 5rem; max-height: 5rem; object-fit: contain; } #desktop_artikelname { display: block; margin-bottom: 0; line-height: 1.4; } #desktop_artikelname a { color: var(--theme-text); display: inline-block; font-size: 1em; } #aa_rating {display: flex; align-items: center; margin-bottom: .5rem; } #preis { padding: 0; margin: 0 0 1rem 0; } #preisDiv { display: inline-block; font-size: 2.5rem; font-weight: bold; font-family: 'Header-Font'; } #preisDiv.sonderpreis { } #preis .mwst { margin-top: calc(var(--card-padding) * 1); white-space: nowrap; } #preis .ehem_vk { float: right; height: 2.5rem; line-height: 2.5rem; text-decoration: line-through; font-size: 1rem; } #preis .ehem_vktext { float: right; margin-right: .5rem; height: 2.5rem; line-height: 2.5rem; font-size: 1rem; } .scrolling-wk-name { margin-left: 1rem; } .faWrapper, .grWrapper { padding: 1rem calc(var(--card-padding) * 2); } .faWrapper .title, .grWrapper .title { display: flex; flex-direction: row; flex-wrap: wrap; gap: 0.5rem; } .fagrWrapper { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: var(--padding); } .fagrWrapper > div { background-color: white; border-radius: var(--theme-radius-small); cursor: pointer; border: var(--theme-divider); outline: var(--theme-outline); padding: .25rem; } .faWrapper .fagrWrapper .fagr { padding: .25rem .25rem 1.25rem .25rem; } .fagrWrapper > div span { color: black; font-size: .7rem; text-align: center; } .fagrWrapper > div.weg { opacity: .4; } #shopLayer .fagrWrapper > div.selected { border: .15rem solid var(--theme-turkis); } .fagrWrapper > div > img, .fagrWrapper > div > div { object-fit: contain; height: 100%; width: 100%; } .fagrWrapper > div > div { position: relative; display: flex; align-items: center; justify-content: center; } .fagrWrapper > div span + span, .fagrWrapper > div.selected span + span:empty { display: none; } .fagrWrapper > div.selected span + span { position: absolute; bottom: -1.2rem; left: -.5rem; right: -.5rem; display: block; font-size: 0.7rem; background-color: var(--theme-accent-medium); color: var(--theme-accent-text); text-align: center; padding: .2rem; border-radius: var(--theme-radius-small); } .faWrapper .fagrWrapper .fagr { position: relative; } .faWrapper .fagrWrapper .fagr img + span { position: absolute; bottom: 0; width: 100%; left: 0; white-space: nowrap; } #box_lagerinfo { margin: 1.5rem 0; } #html_lagerinfo { height: 3rem; } #html_lagerinfo > span { display: flex; gap: .5rem; align-items: center; padding: 0; text-align: left; border-radius: var(--theme-radius-small); margin-bottom: .5rem; } #html_lagerinfo > span:before { content: ""; display: inline-block; width: 1rem; height: 1rem; border-radius: 2rem; } #html_lagerinfo > span.groe_txt_st1:before { background-color: var(--theme-success); } #html_lagerinfo > span.groe_txt_st2:before { background-color: var(--theme-warning); } #html_lagerinfo > span.groe_txt_st3:before { background-color: var(--theme-error); } #html_lagerinfo:empty { display: none; } #a_basket_panzahl_wrapper { width: 100%; display: inline-block; position: relative; } #a_basket_panzahl_wrapper #a_basket_einh { display: inline-block; position: absolute; top: 1rem; margin-left: .5rem; } #a_basket_panzahl_wrapper #a_basket_einh .einherro { display: block; font-size: .8rem; opacity: .8; } #inWKsenden:before { background-image: url(/img/bg-wk-w.svg); } form#inWK { padding: 1rem calc(var(--card-padding) * 1.5) calc(var(--card-padding) * 1.5) calc(var(--card-padding) * 1.5); } #aa_staffel { margin-bottom: calc(var(--card-padding) * 2); } .wiederverfuegbarkeit:empty { display: none; } .wiederverfuegbarkeit { margin-top: var(--padding); } #wiederverf_ueberschrift { text-align: center; padding: var(--padding); } #wiederverf_ueberschrift .set { font-size: .8rem; opacity: .8; } .wiederverfuegbarkeit .bell, .wiederverfuegbarkeit .bellm { height: 1.5rem; width: 1.5rem; } .btn_wieder_aktivieren { color: var(--theme-text); } .wiederverfuegbarkeit > a { padding: 1rem; display: block; } .aa_bware { margin-top: 1rem; } .aa-vorteile { padding: 1rem .5rem; background-color: var(--theme-light); max-width: 100%; margin-top: 1rem; } .aa-vorteile .flexbox a { width: 33%; height: 6rem; text-align: center; background-size: auto 3rem; background-repeat: no-repeat; background-position: 50% 0; padding: 3.5rem 0 0 0; color: var(--theme-text); font-size: .9em; } .aa-vorteile h3 { margin: 0; text-align: center; } .aa-vorteile .flexbox { display: flex; justify-content: center; } .aa-vorteile .flexbox a#aa-vort1 { background-image: url(/img/gratis-versand-rueckversand.svg); } .aa-vorteile .flexbox a#aa-vort2 { background-image: url(/img/1-3-tage-lieferzeit.svg); } .aa-vorteile .flexbox a#aa-vort3 { background-image: url(/img/60-tage-rueckgaberecht.svg); } #aa_unten > section.card, #email_formular, #email_formular_button { margin-bottom: var(--padding); } #aa_unten > section.card:empty { display: none; } #email_formular_button { width: 100%; background-color: var(--theme-accent); } #fragezumartikel { margin-bottom: 1rem; } #fragezumartikel h2 { margin: 0 ;} #aa_text > .table { border-top: 0; } #aa_text > .table, .separate-rating { margin: calc(var(--card-padding) * 1) 0; width: 100%; max-width: 100%; } #aa_text > .table table td { padding: .5rem; padding-left: 0; } #aa_bewer { padding-bottom: 0; } .separate-rating { padding: calc(var(--padding) * 2); margin-top: 0; margin-bottom: 0; border-bottom: var(--theme-divider); } .separate-rating:first-of-type { border-top: var(--theme-divider); } br.clear { display: none; } .rating-properties { font-weight: bold; margin-top: 0.5rem; } .gutschein_gesamt > * { margin-bottom: calc(var(--card-padding) * 2); } #gutschein_motive { display: grid; grid-template-columns: 1fr 1fr; grid-gap: var(--padding); } #gutschein_motive > img { box-shadow: var(--shadow-elevation-medium); border-radius: var(--theme-radius-small); border: 2px solid white; transition: all .3s ease-out; cursor: pointer; } #gutschein_motive > img:hover { box-shadow: var(--shadow-elevation-high); } #gutschein_motive > img.gutscheinmotiv-checked { box-shadow: var(--shadow-elevation-high); border-color: var(--theme-accent-medium); } .gs_betrag, .gs_vorschau { text-align: center; } .gs_betrag button, .gs_vorschau button { padding: 1rem 1.5rem; font-size: 1.5rem; } .gutscheinbetr { background-color: var(--theme-accent); transition: all .3s ease-out; } .gutscheinbetr.gutscheinbetr-checked { background-color: var(--theme-accent-dark); } .gs_betrag { display: grid; grid-template-columns: 1fr 1fr; grid-gap: var(--padding); } span.aa_price2 { font-size: 3rem; } .gs_inkw { text-align: center; } input#submit_inwk { font-size: 1.5rem; } #cs_dark_matter { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 1000; background-color: rgba(0,0,0,.5); } #cs_layer { position: absolute; top: 50%; left: 50%; opacity: 0; transform: translate(-50%, -80%); background-color: var(--theme-card-background); max-width: 55rem; width: calc(100% - calc(var(--padding) * 2)); border-radius: var(--theme-radius-small); box-shadow: var(--shadow-elevation-medium); overflow: hidden; display: grid; grid-template-columns: 1fr; grid-template-areas: "image" "ueber" "name" "unter" "buttons" "cross"; text-align: center; } #cs_layer.open { opacity: 1; transform: translate(-50%, -50%); } #cs_layer img { max-height: 5rem; } #cs_layer .cs_img { background-color: white; padding: 1rem; grid-area: image; display: flex; align-items: center; justify-content: center; } #cs_layer .cs_ueber { grid-area: ueber; margin-top: 0; } .cs_name { grid-area: name; margin: 0; font-size: 1.5rem; } .cs_unter { grid-area: unter; } #cs_unten_cs { grid-area: cross; display: flex; flex-wrap: wrap; padding: 0 2rem 2rem 2rem; justify-content: space-between; display: none; } #cs_unten_cs #cross_titel { font-size: 1.1rem; margin: 0 0 1rem 0; width: 100%; } #cs_layer #cs_layer_unten { padding: var(--padding); grid-area: buttons; } #cs_layer #cs_layer_unten .button { text-transform: uppercase; margin-top: 1rem; } #wk_layer_unten { display: flex; clear: both; flex-wrap: wrap; justify-content: space-around; align-items: center; } #wk_layer_unten .button { width: 18rem; text-align: center; text-transform: uppercase; margin-bottom: .15rem; } #cs_layer_unten { display: grid; grid-template-rows: 1fr 1fr; grid-gap: var(--padding); } #cs_layer #cs_layer_unten a { display: block; } #cs_layer #warenkorb:before { background-image: url(/img/bg-wk-w.svg); } #cs_layer #weitersh:before { background-image: url(/img/bg-merken.svg); } .inp_wrapper[data-typ="number-custom"] { margin: 0; width: 6rem; } #aa_detail.fancy-aa { grid-template-areas: "pic pic" "basket basket" "unten unten"; max-width: 40rem; margin: 20rem auto 0 auto; } #inWKsenden.wk-animation { color: transparent; } #inWKsenden:before { transition: all .5s ease-out; } #inWKsenden.wk-animation:before { transform: translateX(12rem) rotate(-10deg); } .medium-zoom-image--opened { object-fit: contain; } .aa_bewer_summary { display: flex; flex-wrap: wrap; padding: 0 0 1rem 0; margin: 0 0 1rem 0; border-bottom: var(--theme-divider); } .aa_bewer_summary .aa_bewerGr { width: 100%; } .aa_bewer_summary .aa_bewerGr span { display: inline-block; width: 8rem; } #aa_cross, #aa_zub, #aa_serie { margin-top: 2rem;} #aa_bewer2 .card { background-color: var(--theme-accent-light); text-align: center; font-size: 1.2rem; } #aa_bewer2 .rat_stars { display: inline; } .aa_bewer_summary > .card b { display: block; color: var(--theme-accent-text); text-shadow: 0px 0px 8px var(--theme-accent-light); } .aa_bewer_comm { background-color: var(--theme-light); padding: 0 1rem 1rem 1rem; } .aa_bewer_comm h4.title { margin: var(--padding) 0; font-size: 1rem; font-weight: bold; } .aa_bewer_com { display: grid; grid-template-columns: 1fr; grid-gap: var(--padding); margin-bottom: calc(var(--padding) * 1); } .aa_bewer_comm > span { display: block; margin-top: var(--padding); font-size: .8rem; opacity: .8;} h1.aa_rating_artikel { font-size: 1rem; display: block !important; margin-bottom: 1rem; font-weight: bold; } .rat_balken_hint { display: block; margin: 0 .25rem; border-radius: .25rem; height: 2rem; width: 100%; background-color: var(--theme-light); min-width: 6rem; } .rat_balken {background: radial-gradient( circle farthest-corner at 10% 20%, rgba(250,196,59,1) 0%, rgba(249,232,51,1) 100.2% )!important;height: 2rem; border-radius: .25rem; } .rat_product td { height: 2rem;width: 87%; line-height: normal; padding: .5rem; } .rat_product > table > tbody > tr > td:nth-of-type(1) { width: 13% !important; min-width: 80px; } .rat_krit td { height: 2rem;width: 87%; line-height: normal; padding: .5rem; } .rat_krit > table > tbody > tr > td:nth-of-type(1) { width: 13% !important; min-width: 80px; } .rat_note td { height: 2rem; width: auto; line-height: normal; padding: .5rem; } .rat_kopf { margin-bottom: 2rem; } #aa_basket .se_beobachten { position: absolute; margin-top: 3rem; right: -.5rem; height: 3rem; width: 3rem; border-radius: 50%; transform: translateY(50%); transition: all .5s ease-out; z-index: 2; background-size: 50%; background-position: center; background-repeat: no-repeat; cursor: pointer; background-image: url(/img/bg-merken.svg); transition-delay: .2s; box-shadow: var(--shadow-elevation-medium); } #aa_basket .se_beobachten.active { background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px"  viewBox="0 0 94.5 83.1" style="enable-background:new 0 0 94.5 83.1;" xml:space="preserve"><style type="text/css"> .st0{fill:none;stroke:%23D14350;stroke-width:3.6;stroke-miterlimit:10;} .st1{fill:%23D14350;}</style><g> <g>  <g> <g>  <g>   <g>  <path class="st0" d="M85.8,8.7L85.8,8.7c-9.2-9.2-24.1-9.2-33.4,0l-5.2,5.2l-5.2-5.2c-9.2-9.2-24.1-9.2-33.4,0l0,0   c-9.2,9.2-9.2,24.1,0,33.4l38.5,38.5l0,0l0,0l38.5-38.5C95,32.9,95,17.9,85.8,8.7z"/>   </g>  </g> </g>  </g> </g></g><g> <g>  <path class="st1" d="M15.3,11.2c2.6-1.3,5.3-2.5,8.1-3.1c2.7-0.5,5.4,0.1,7.9,1.1c2.5,1,4.9,2.3,7.2,3.7c2.1,1.3,3.9,2.8,5.1,5 c0.5-1.2,1-2.4,1.5-3.7c-2.9,1.2-5.6-1.9-7.8-3.3c-2.8-1.8-5.9-3.1-9.2-3.8c-6.6-1.3-13.3,0.1-18.6,4.3c1.4,0.8,2.8,1.6,4.2,2.4 c0.3-1.1,0.5-2.1,0.8-3.2c0.7-2.9-3-4.2-4.6-1.9c-0.7,1-2.7,1.6-3.8,2.6c-1.7,1.6-2,3.7-2.2,5.9c-0.4,5-0.2,9.9,0.3,14.9 c1.6-0.2,3.3-0.4,4.9-0.7c-0.5-3.1-1-6.3-1.5-9.4c-0.4-2.8-5.2-2.1-4.9,0.7c0.4,3.8,0.5,7.6,2.1,11.1c1.4,3.3,3.9,6,6.2,8.6 c4.8,5.4,9.7,10.8,15.5,15.1c0.9,0.6,2.3,0.3,3-0.4c0.8-0.8,0.9-2,0.4-3c-1.7-3.7-3.7-7.3-6-10.7c-2.3-3.3-5-6.2-7.5-9.3 c-2.3-2.8-3.7-5.7-3.3-9.4c0.4-4.1,1.8-7.9,1.2-12.1c-0.2-1.6-2.5-2.3-3.7-1.5c-4.6,3.1-6.2,9.7-2.9,14.4c1.1,1.6,3.3,1.7,4.3,0 c1-1.5,1.4-3.2,1.7-5c0.2-1.3,0.4-3,1.4-4c1.2-1.1,3.5-1.5,5-1.9c2-0.5,4.1-0.9,6.2-1.1c3.9-0.3,7.3,0.7,10.5,3 c3,2.2,5.5,5.1,7.8,7.9c0.8-1.4,1.6-2.8,2.4-4.2c-4.2-1.6-9-1.9-13-4c-2.1-1.1-3.8-2.9-5.8-4.1c-2.2-1.3-4.8-1.9-7.3-1.1 c-3,1-1.8,5.5,1.3,4.8c5.3-1.2,11.1,1.2,14,5.9c0.7,1.1,2.2,1.6,3.4,0.9c1.3-0.8,1.4-2.2,0.9-3.4c-1.9-4.5-7.9-5.2-12.1-5.8 c-5.6-0.7-11.3-0.8-17,0c-1.2,0.2-2.3,0.8-2.5,2.2c-0.1,1.2,0.6,2.5,1.8,2.7c2.2,0.4,4.4,0.9,6.6,1.3c1.1,0.2,2.1,0.4,3.2,0.6 c0.2,0,0.9,0.3,1,0.3c0,0,0.1,0,0.1,0c0.2-0.1,0.1-0.2-0.2-0.4c0.1-0.4,0.2-0.8,0.3-1.3c0,0.1-0.1,0.2-0.1,0.3 c0.3-0.3,0.6-0.6,0.9-0.9c0.4,0,0.4,0,0.1,0c-0.2,0-0.4,0-0.7,0c-0.4,0-0.9,0-1.3,0c-0.7,0-1.5-0.1-2.2-0.2 c-1.7-0.3-3.4-0.8-5-1.4c-1.9-0.8-3.4,1.4-3.1,3.1c2.5,13,9.8,25,20.1,33.3c1,0.8,2.2,1,3.3,0.2c1-0.8,1.3-2.1,0.6-3.2 C29,40.8,24.1,31.2,19.9,21.3c-0.3-0.8-1.4-1.2-2.2-1.2c-1.6,0-2.9,1.2-2.9,2.8c0,1.4,0.7,2.4,1.7,3.3c2.2,1.8,4.7,3.1,7,4.7 c4.3,3,6.5,7.9,8.5,12.5c1.4-0.8,2.9-1.7,4.3-2.5c-3.5-4.6-7-9.2-10.5-13.8c-0.8-1.1-2.2-1.6-3.4-0.9c-1.1,0.7-1.6,2.3-0.9,3.4 C26.3,37,31.2,44.4,33,53.1c0.6,2.7,5.1,2.2,4.9-0.7c-0.5-6.3-2.4-12.4-5.6-17.8c-1.6-2.6-3.5-4.9-5.5-7.2c-1.8-2-3.5-4.1-4.1-6.7 c-1.4,0.8-2.8,1.6-4.2,2.4C23,27.5,27.6,31.8,33,35c1.8,1.1,4.4-0.7,3.7-2.8c-1.9-5.8-5.1-11.1-9.3-15.7c-1.9-2.1-5.4,0.6-3.9,3 c2,3.3,4.1,6.6,6.1,9.8c1.3-1,2.6-2,3.9-3c-2-1.8-4-3.6-6-5.3c-0.4,1.4-0.7,2.8-1.1,4.2c1.9-0.8,3.5,0.5,5,1.5 c1.7,1.2,3.5,2.1,5.5,2.7c3.4,0.9,10.6,2.4,10.8-3c0.2-4.8-5.7-5.9-9.3-6.3c-3.4-0.3-7.1,0.1-10-1.9c-0.6,1.5-1.3,3-1.9,4.6 c3.2,0.8,6.4,1.6,9.5,2.5c1.6,0.4,3.3,1,4.8,0.1c1.2-0.7,1.5-1.9,2.1-3c0.9-1.8,2.9-2.7,4.7-3.5c2.4-1.2,4.5-2.5,6.6-4.3 c4-3.5,8.6-6.3,13.9-7.1c4.6-0.6,9.4,0.5,12.9,3.6c3.1,2.7,6.4,8.9,2.6,12.4c1.3,0.2,2.6,0.3,3.9,0.5c-0.8-1.9-1-4-1.4-6 c-0.4-1.9-1.1-3.8-2.3-5.4c-2.3-3.2-5.7-5.4-9.4-6.4C65.5,4,56.9,8.5,50.2,14c-3.7,3-7.8,6.2-9.5,10.7c-0.8,2.2,1.9,3.7,3.7,2.8 c5.7-3,11.6-5.5,17.7-7.5c3-1,6.1-1.9,9.2-2.6c1.3-0.3,3-0.7,4.3-0.2c0.6,0.2,1.2,0.8,1.1,1.4c1.5-0.2,3-0.4,4.6-0.6 c-1.8-3.4-2.8-7.8-7-9c-2.1-0.6-4.3,0-6.4,0.6c-2,0.6-4,1.3-5.9,2.1c-7.7,3.2-14.6,7.8-21.5,12.5c-2.2,1.5-0.9,5.4,1.9,4.6 c7.5-2.3,14.9-4.5,22.4-6.8c2.9-0.9,6.5-2.4,9.6-1.4c0.6,0.2,1.1,0.4,1.5,0.9c0.4,0.4,0.3,0.7,0.3,1.3c0.1,1.8,0.5,3.5,1.4,5 c1,1.6,3.4,1.7,4.3,0c1.3-2.5,2.1-5.1,2.1-7.9c-1.6,0.4-3.1,0.8-4.7,1.3c1.2,2,2.4,4.1,3.4,6.2c0.7,1.4,2.9,1.7,3.9,0.5 c0.8-0.9,1.3-1.9,1.6-3.1c0.1-0.2,0.3-0.9,0.3-1.1c0-0.2-0.2,0.2-0.2,0.1c-1.5-0.6-1.9-0.8-1.4-0.6c0.1,0,0.1,0.2,0,0.3 c-0.1,0.9-0.1,1.8-0.3,2.8c-0.2,1-0.6,2-1,3c-1.9,3.9-5,7-8.3,9.8c-6.6,5.6-14.1,10-20.6,15.8c-3.6,3.2-6.8,6.9-9.3,11.2 c1.5,0.6,3,1.3,4.6,1.9c0.8-4.1,1.6-8.3,3.8-12c2.3-3.7,5.9-6.4,9-9.3c6.9-6.4,13.4-13.1,19.6-20.2c-0.8,0.2-1.6,0.4-2.4,0.6 c0.4,0.2,0.3,1.5,0.1,1.9c-0.6,1.5-2,2.6-3.1,3.7c-2.8,2.8-5.7,5.4-8.7,8c-6,5.1-12.2,9.7-18.5,14.4c-1.1,0.8-1.6,2.2-0.9,3.4 c0.6,1.1,2.3,1.7,3.4,0.9c6-4.4,11.7-9.3,17.1-14.4c4.7-4.4,11-9.2,12-16c0.4-2.8-2.8-4.3-4.6-1.9c-0.5,0.7-0.8,1.5-1,2.3 c-0.3,1.7,0.7,3,2.4,3.2c2.4,0.2,4.5,1.4,6,3.3c0-1.2,0-2.4,0-3.5c-3.2,2.8-5.8,6.3-8.5,9.6c-2.6,3.1-5.3,6.1-8.2,8.9 c-5.8,5.7-12.3,10.6-19.3,14.8c1,1.3,2,2.6,3,3.9c6.8-7.2,15.6-12.8,20.1-21.9c2.3-4.8,3.6-9.9,4.5-15.1c0.4-2.6,0.7-5.3,1-7.9 c0.1-1.2,0.2-2.3-0.4-3.4c-0.7-1.3-2.3-2.1-3.7-1.6c-1.3,0.4-2.5,1.5-3.5,2.3c-1,0.8-1.9,1.8-2.7,2.8c-1.8,2.3-3.1,4.8-3.9,7.6 C64,35,68,36.9,69.3,34.3c1.6-3.3,3-6.7,4.2-10.2c-1.6,0-3.2,0-4.8,0c0.8,1.9,1.5,3.7,2.3,5.6c0.4,1,1.2,1.8,2.4,1.8 c1,0,2.2-0.8,2.4-1.8c0.7-4-0.5-8.4-3.8-11c-1.7-1.4-3.8-2-5.9-1.3c-1.7,0.6-2.9,1.9-4,3.3c-1,1.3-1.8,2.5-3.3,3.2 c-1.7,0.9-3.8,1.3-5.6,1.9c-4.6,1.4-9.2,2.8-13.8,4.2c0.4,1.6,0.9,3.2,1.3,4.8c8.6-3,17.2-6,25.5-10c2.5-1.2,0.7-5.6-1.9-4.6 c-10.1,3.8-20.4,6.9-30.9,9.3c0.4,1.6,0.9,3.2,1.3,4.8c0.9-0.3,1.8-0.7,2.7-1c-0.8-1.4-1.6-2.8-2.4-4.2c-2.7,3-2.9,7.1-1.3,10.7 c1.6,3.6,4.9,6,7.9,8.2c2,1.5,4.8-1.4,3.4-3.4c-1.2-1.8-2.3-3.7-3.2-5.7c-0.4-0.9-0.7-1.7-1-2.6c-0.2-0.5-0.2-1.1-0.5-1.6 c-0.3-0.6,0.2-0.1-0.1,0.1c-0.4,0.2-0.7,0.4-1.1,0.6c-0.4,0.2-0.4-0.5-0.1,0.2c0.2,0.3,0.5,0.6,0.8,0.9c0.5,0.7,1,1.4,1.5,2.1 c1.1,1.6,2,3.4,2.9,5.1c1.3-1,2.6-2,3.9-3c-0.7-0.9-1.1-2.1-1.1-3.3c0-0.6,0.1-1.2,0.3-1.8c0,0,0.3-0.8,0.3-0.7 c0.2-0.3,0-0.2-0.7,0.2c0.1,0.1,0.2,0.1,0.3,0.2c0.3,0.5,1.3,1,1.8,1.4c0.6,0.6,1.2,1.1,1.8,1.7c1.2,1.2,2.3,2.5,3.2,3.9 c0.7,1,1.9,1.6,3.1,1c1.1-0.5,1.9-1.8,1.4-2.9c-0.7-1.9-2.2-3-3.1-4.6c0.1,0.2,0-0.3,0-0.2c0,0.1-0.1,0.3,0.1,0 c0.3-0.4,0.6-0.7,0.9-1c1-0.9,2-1.9,3-2.8c3.8-3.5,7.7-7,12-9.9c-1-1.3-2-2.6-3-3.9C62.3,24.1,54.9,28.4,46.9,31 c0.6,1.5,1.3,3,1.9,4.6c6.7-4,14.2-6.7,21.9-7.5c-0.4-1.6-0.8-3.1-1.3-4.7c-7.6,3.3-15.1,7.2-18.5,15.2c-0.7,1.7,1.4,3.8,3.1,3.1 c4.5-1.9,9-3.8,13.5-5.7c-0.6-1.5-1.3-3-1.9-4.6c-4.6,2.5-9.3,4.9-13.9,7.4c1,1.3,2,2.6,3,3.9c3.8-3.6,7.9-6.7,12.5-9.3 c1.2-0.7,1.6-2.3,0.9-3.4c-0.7-1.3-2.2-1.4-3.4-0.9c-2,0.9-4.2,1.6-6.1,2.7c-1.9,1.1-2.5,2.9-2.6,5c-0.1,3.1-0.1,6.8-2.2,9.3 c1.3,1,2.6,2,3.9,3C62.8,41.2,73.1,38,76.9,29c-1.5-0.6-3-1.3-4.6-1.9c-2.4,5.9-8.7,9.1-13.6,12.4C53,43.3,48.2,48,44.8,53.9 c1.5,0.6,3,1.3,4.6,1.9c0.6-2.2,1.2-4.3,1.7-6.5c0.6-2.1,1.3-4.3,1.6-6.5c0.6-3.9-0.7-8.9-5.2-9.8c-1.5-0.3-3.2,0.7-3.2,2.4 c0.1,2.7,0.4,5.3,0.9,8c0.2,1.2,0.5,2.5,0.8,3.7c0.3,1.2,0.6,2.4,1.5,3.3c2.1,2.1,4.9,0.4,6.5-1.4c1.6-1.8,2.8-3.9,3.3-6.2 c0.5-1.9-1.8-4.2-3.7-2.8c-3.7,2.7-6,6.9-5.8,11.5c0.1,1.9,2.1,3.1,3.8,2.2c1.1-0.6,2.1-1.1,3.2-1.7c-1.1-1.1-2.3-2.3-3.4-3.4 c-2.1,4.4-4.3,8.7-6.4,13.1c-0.3,0.6-0.8,2.3-1.4,2.6c0.5-0.3-1.2-0.2-1.5-0.3c-1.8-0.3-3.6-1.1-5-2.3c-1-0.9-2.5-1-3.5,0 c-0.9,0.9-1,2.7,0,3.5c2,1.7,4.3,2.9,6.8,3.5c2.8,0.6,5.7,0.7,7.5-1.8c0.8-1.1,1.3-2.4,1.8-3.6c0.6-1.3,1.3-2.7,1.9-4 c1.3-2.7,2.7-5.5,4-8.2c1.1-2.2-1.1-4.6-3.4-3.4c-1.1,0.6-2.1,1.1-3.2,1.7c1.3,0.7,2.5,1.4,3.8,2.2c-0.1-2.7,1.1-5.5,3.3-7.1 c-1.2-0.9-2.4-1.9-3.7-2.8C52.4,42.8,52,44,51.2,45c-0.4,0.5-1.1,0.9-1.4,1.4c0,0,1.6,1.6,1.5,0.6c0-0.4-0.3-1-0.4-1.4 c-0.9-3.3-1.3-6.7-1.5-10.1c-1.1,0.8-2.1,1.6-3.2,2.4c2.7,0.5,1.5,4.6,1.1,6.3c-0.9,3.4-1.8,6.8-2.7,10.2 c-0.7,2.7,3.1,4.4,4.6,1.9c1.6-2.8,3.6-5.4,5.9-7.7c2.4-2.4,5.2-4.3,8.1-6.2c5.7-3.7,11.3-7.6,14-14.1c1.1-2.6-3.5-4.5-4.6-1.9 c-1.8,4.3-5.4,7.2-8.9,10.1c-3.8,3-7.6,6-10.2,10.1c-1.5,2.4,2,5.2,3.9,3c2.5-2.8,3.3-6.4,3.6-10.1c0.1-0.8,0.1-1.7,0.1-2.5 c0-0.3,0-0.6,0-0.8c0-0.2-0.1-0.1-0.2,0.1c0.1-0.1,0.3-0.2,0.4-0.2c2-0.8,4-1.7,5.9-2.6c-0.8-1.4-1.7-2.9-2.5-4.3 c-4.9,2.8-9.4,6.2-13.5,10.1c-2.1,2,0.6,5.2,3,3.9c4.6-2.5,9.3-4.9,13.9-7.4c2.4-1.3,0.7-5.7-1.9-4.6c-4.5,1.9-9,3.8-13.5,5.7 c1,1,2.1,2.1,3.1,3.1C58.6,33.5,66,30.4,72,27.8c2.2-1,1.1-4.9-1.3-4.7c-8.7,0.9-17,3.7-24.4,8.2c-2.4,1.4-0.8,5.5,1.9,4.6 c8.8-2.9,16.9-7.7,23.7-14c2-1.9-0.6-5.5-3-3.9c-5,3.4-9.6,7.5-14,11.6c-2.1,2-4.8,4.1-4.3,7.4c0.2,1.2,0.9,2.2,1.7,3.2 c0.5,0.6,1.3,1.3,1.5,1.9c1.5-0.6,3-1.3,4.6-1.9c-1.5-2.2-3.3-4.2-5.2-6.1c-2-1.8-4.7-4.5-7.7-3.4C43,31.7,42,35,42,37.4 c-0.1,2.7,0.9,5.1,2.5,7.2c0.8,1,2.4,0.9,3.3,0.2c1-0.8,1.2-2.1,0.6-3.2c-1.2-2.6-2.7-5.1-4.5-7.5c-1.7-2.2-4.7-5.2-7.4-2.5 c-2.2,2.1-0.9,5.4,0,7.8c1.1,2.8,2.4,5.4,4.1,7.8c1.1-1.1,2.3-2.3,3.4-3.4c-2.1-1.5-4.4-3.1-5.7-5.5c-0.9-1.6-1.3-4.1,0.1-5.6 c1.5-1.7,0.1-5.1-2.4-4.2c-0.9,0.3-1.8,0.7-2.7,1c-3,1.1-1.9,5.6,1.3,4.8c10.5-2.4,20.8-5.5,30.9-9.3c-0.6-1.5-1.3-3-1.9-4.6 c-7.8,3.8-16.1,6.6-24.3,9.4c-3,1-1.8,5.8,1.3,4.8c3.9-1.2,7.8-2.4,11.7-3.6c3.5-1.1,7.6-1.8,10.5-4.1c1.3-1,2.1-2.2,3.1-3.5 c0.3-0.4,0.7-0.9,1.1-1.2c0.3-0.2,0.6-0.5,0.9-0.5c1,0.1,1.9,1.4,2.3,2.3c0.7,1.2,0.9,2.7,0.7,4.1c1.6,0,3.2,0,4.8,0 c-0.8-1.9-1.5-3.7-2.3-5.6c-0.9-2.2-4-2.5-4.8,0c-1,3.1-2.2,6.1-3.7,9c1.5,0.6,3,1.3,4.6,1.9c0.6-2,1.4-3.8,2.7-5.4 c0.6-0.8,1.2-1.4,1.9-2.1c0.3-0.3,0.7-0.6,1.1-0.9c0.2-0.1,0.3-0.3,0.5-0.4c0.9-0.7,0.1,0.2-0.8-0.4c-0.3-0.3-0.6-0.6-0.9-0.9 c0.2,0.3,0.2,0.3,0-0.3c0,0.2,0,0.4,0,0.6c0,0.6-0.1,1.1-0.2,1.7c-0.1,1.1-0.3,2.3-0.4,3.4c-0.3,2.2-0.7,4.4-1.1,6.6 c-0.9,4.3-2.3,8.5-4.6,12.3c-4.5,7.3-12,12.2-17.9,18.3c-1.9,2,0.5,5.4,3,3.9c7.2-4.3,14-9.4,20-15.3c3-2.9,5.8-6,8.5-9.2 c2.7-3.3,5.3-6.8,8.5-9.6c1.1-1,0.8-2.5,0-3.5c-2.4-2.9-5.8-4.5-9.5-4.7c0.8,1.1,1.6,2.1,2.4,3.2c0.1-0.5,0.2-0.7,0.5-1.1 c-1.5-0.6-3-1.3-4.6-1.9c-0.4,2.9-2,5.2-3.9,7.3c-2.2,2.4-4.7,4.6-7.1,6.8c-5,4.7-10.2,9.2-15.8,13.3c0.8,1.4,1.7,2.9,2.5,4.3 c7.5-5.6,15-11.1,22-17.3c1.7-1.5,3.4-3.1,5.1-4.7c1.6-1.5,3.2-3,4.4-4.8c2.4-3.6,1.7-8.6-2.5-10.3c-0.8-0.3-1.9,0-2.4,0.6 c-6.4,7.3-13.1,14.3-20.3,20.9c-3.3,3-6.9,5.9-9.3,9.9c-2.4,3.9-3.3,8.5-4.2,13c-0.5,2.7,3.1,4.5,4.6,1.9 c4.8-8.3,12.8-13.9,20.4-19.4c4-2.9,8.1-5.9,11.7-9.4c3.6-3.5,6.8-8,7.7-13c0.5-2.7,0.8-7-2.7-7.9c-1.8-0.4-3.5,0.5-4.5,1.9 c-0.4,0.6-0.7,1.2-0.9,1.9c-0.1,0.4-0.2,1.2-0.5,1.6c1.3,0.2,2.6,0.3,3.9,0.5c-1-2.1-2.2-4.2-3.4-6.2c-1.3-2.1-4.6-1.2-4.7,1.3 c0,1.9-0.5,3.7-1.4,5.4c1.4,0,2.9,0,4.3,0c-0.9-1.5-0.5-3.1-1-4.8c-0.5-1.8-1.9-3.2-3.5-4.1c-3.7-1.9-8-1.1-11.8,0 C57.4,19,49.2,21.5,41,24c0.6,1.5,1.3,3,1.9,4.6c6.1-4.2,12.2-8.3,18.9-11.4c3.1-1.4,6.6-2.9,10-3.3c1.3-0.2,2.2,0.7,2.8,1.8 c0.9,1.6,1.4,3.4,2.3,5c1,1.9,4.1,1.5,4.6-0.6c0.9-3.9-2.1-7.3-5.9-7.8c-3.9-0.6-8.1,1-11.8,2.1c-7.6,2.2-15,5.2-22,8.9 c1.2,0.9,2.4,1.9,3.7,2.8c1.2-3.1,4.6-5.5,7-7.5c2.9-2.4,6-4.7,9.6-6.2c5.7-2.4,13.5-2.5,17.6,3c1.1,1.5,1.5,3.1,1.9,4.9 c0.4,2.2,0.8,4.3,1.7,6.4c0.7,1.5,2.8,1.5,3.9,0.5c4.4-4,3.6-10.9,0.8-15.5C85.2,7,80.2,3.8,74.9,2.8c-6.1-1.1-12.3,0.4-17.6,3.4 c-2.7,1.5-4.9,3.5-7.3,5.4c-2,1.7-4.4,2.5-6.6,3.7c-1.2,0.7-2.4,1.5-3.4,2.5c-0.5,0.5-1,1.2-1.3,1.8c-0.1,0.2-0.8,1.5-0.7,1.6 c0,0,0,0,0,0c0.9-0.3,1-0.5,0.3-0.5c-0.4-0.3-1.2-0.3-1.7-0.4c-1-0.2-1.9-0.5-2.9-0.7c-2-0.5-4-1-6-1.5c-2.8-0.7-4.2,3-1.9,4.6 c2.7,1.9,6,2.2,9.3,2.4c1.5,0.1,3,0.1,4.5,0.3c0.7,0.1,1.5,0.3,2.2,0.6c0.1,0.1,0.9,0.6,0.9,0.5c-0.2,0,0.5-1.2,0.6-1.1 c-0.1-0.1-1.1-0.1-1.1-0.1c-0.8-0.1-1.6-0.2-2.3-0.3c-1.6-0.3-3.2-0.8-4.6-1.7c-3.1-1.9-6.4-4.6-10.2-3c-1.6,0.7-2.7,2.8-1.1,4.2 c2,1.8,4,3.6,6,5.3c2,1.8,5.5-0.5,3.9-3c-2-3.3-4.1-6.6-6.1-9.8c-1.3,1-2.6,2-3.9,3c3.6,3.9,6.3,8.4,8,13.4 c1.2-0.9,2.4-1.9,3.7-2.8c-5.1-3-9.3-7-13.5-11c-1.8-1.8-4.7,0-4.2,2.4c1.3,5.7,6.4,9.3,9.5,14.1c3.2,4.9,5.1,10.5,5.6,16.3 c1.6-0.2,3.3-0.4,4.9-0.7c-1.9-9-6.9-17-11.9-24.6c-1.4,0.8-2.9,1.7-4.3,2.5c3.5,4.6,7,9.2,10.5,13.8c2,2.6,5.6,0.5,4.3-2.5 c-1.8-4-3.7-8.1-6.8-11.4c-1.6-1.7-3.5-3-5.5-4.2c-1-0.6-1.9-1.2-2.9-1.8c-0.4-0.3-0.8-0.6-1.2-0.9c-0.2-0.2-0.4-0.4-0.6-0.6 c0.2,0.2,0.3,0.4,0.4,0.7c-0.1,0.4-0.2,0.8-0.3,1.3c0-0.1,0-0.1,0.1-0.2c-0.3,0.3-0.6,0.6-0.9,0.9c0,0,0.1-0.1,0.1-0.1 c-0.4,0.1-0.8,0.2-1.3,0.3c0.1,0,0.1,0,0.2,0c-0.7-0.4-1.4-0.8-2.2-1.2c4.2,9.9,9.1,19.5,14.7,28.8c1.3-1,2.6-2,3.9-3 c-9.8-7.8-16.4-18.8-18.8-31.1c-1,1-2.1,2.1-3.1,3.1c2.6,1,5.3,1.6,8.1,1.7c1.3,0.1,2.8,0.2,4-0.2c1.6-0.5,2.6-2.2,2.2-3.8 c-0.6-2.7-3.2-3.5-5.6-4c-2.9-0.6-5.8-1.2-8.7-1.8c-0.2,1.6-0.4,3.3-0.7,4.9c5-0.6,10-0.7,15-0.2c2.1,0.2,4.3,0.5,6.4,1.1 c1.5,0.4,2.8,1,3.4,2.5c1.4-0.8,2.9-1.7,4.3-2.5c-4.1-6.6-12.1-9.9-19.7-8.1c0.4,1.6,0.9,3.2,1.3,4.8c1.9-0.7,3.6,0.6,5.1,1.7 c1.9,1.4,3.6,2.8,5.8,3.7c4.1,1.7,8.5,2.2,12.6,3.8c1,0.4,2.3-0.3,2.8-1.1c0.6-1,0.3-2.2-0.4-3c-2.8-3.3-5.6-6.5-9.2-8.9 C35.3,9.3,30.7,8.1,26,8.6c-2.5,0.2-5,0.7-7.5,1.3c-2.2,0.6-4.7,1.3-6.5,2.8C10.4,14.1,9.7,16,9.2,18c-0.4,1.7-0.5,3.5-1.4,5 c1.4,0,2.9,0,4.3,0c-1.6-2.3-1.3-5.8,1.1-7.5c-1.2-0.5-2.4-1-3.7-1.5c0.5,4-1.4,8-1.5,12c-0.1,4,1.6,7.5,3.9,10.6 c2.4,3.1,5.1,5.8,7.3,9c2.5,3.5,4.5,7.2,6.3,11c1.1-1.1,2.3-2.3,3.4-3.4c-5.2-3.9-9.6-8.8-13.9-13.6c-2-2.3-4.2-4.6-5.6-7.3 c-1.5-2.9-1.5-6.3-1.8-9.5c-1.6,0.2-3.3,0.4-4.9,0.7c0.5,3.1,1,6.3,1.5,9.4c0.4,2.8,5.2,2.1,4.9-0.7c-0.5-4.6-0.7-9.3-0.4-13.9 c0-0.8-0.1-2.1,0.3-2.9c0.1-0.3,0.6-0.5,0.9-0.7c1.6-1,3-1.8,4.1-3.3c-1.5-0.6-3-1.3-4.6-1.9c-0.3,1.1-0.5,2.1-0.8,3.2 c-0.6,2.6,2.3,4,4.2,2.4c4.5-3.7,10.8-4.1,16.2-2.4c3,0.9,5.5,2.6,8,4.4c2.6,1.9,6,3.4,9.2,2.1c1.5-0.6,2.3-2.1,1.5-3.7 c-1.4-2.8-3.8-4.8-6.4-6.5c-2.7-1.7-5.7-3.2-8.7-4.4c-3.3-1.4-6.8-1.9-10.3-1.3c-3.4,0.6-6.7,2.1-9.8,3.6 c-1.2,0.6-1.5,2.3-0.9,3.4C12.7,11.5,14.1,11.8,15.3,11.2L15.3,11.2z"/> </g></g><g> <g>  <path class="st1" d="M39.2,56.6c3.2,0,3.2-5,0-5C36,51.6,36,56.6,39.2,56.6L39.2,56.6z"/> </g></g><g> <g>  <path class="st1" d="M29.1,53.8c2,1.4,3.4,3.3,4.1,5.6c1-1,2.1-2.1,3.1-3.1c-1.2-0.2-2-1-2.8-1.9c-1-1.1-1.8-2.5-3.6-2.4 c-1.8,0.1-3.1,1.8-3.4,3.4c-0.3,1.9,0.4,3.5,1.6,4.9c1,1.2,2.3,2.3,3.5,3.3c1.3,1.2,2.6,2.3,3.9,3.5c2.7,2.4,5.5,4.7,8.3,6.9 c1,0.8,2.2,1,3.3,0.2c1-0.8,1.3-2.1,0.6-3.2c-0.5-0.8-0.9-1.5-1.4-2.3c-0.8-1.4-2.8-1.7-3.9-0.5c-0.9,0.9-1.5,2-1.8,3.3 c1.6,0,3.2,0,4.8,0c-0.6-2.4-1.9-4.6-2.9-6.8c-1-2.4-1.8-4.9-2.5-7.5c-1.2-4.8-1.7-9.9-1-14.9c-1.5,0.2-3,0.4-4.6,0.6 c1.5,3.3,2.9,6.7,4,10.2c1.1,3.3,0.6,6.9,1.6,10.2c0.7,2.2,4.4,2.6,4.8,0c1.2-6.5,1.9-13,2-19.6c-1.6,0.2-3.3,0.4-4.9,0.7 c1,4.9,1.9,9.7,2.5,14.6c0.1,1,0.3,2.1,0.1,3.1c-0.2,1-0.7,1.9-0.9,2.9c-0.3,1.2-0.2,2.3,0.1,3.5c0.1,0.5,0.3,1,0.5,1.6 c0.1,0.2,0.1,0.3,0.1,0.5c0,0.6,0,0.5,0.1-0.1c0.3-0.3,0.6-0.6,0.9-0.9c-1.5,1-2.5,2-2.5,3.9c0,1.7,1.1,3,2.2,4.1 c1,0.9,2.5,1,3.5,0c4.5-4.3,8.7-8.7,12.7-13.5c0.8-0.9,1-2.3,0.2-3.3c-0.7-0.9-2.2-1.4-3.2-0.6c-1.9,1.3-3.8,2.6-5.7,3.8 c-1.8,1.2-3.7,2.5-5.7,3.4c0.4-0.1,0.8-0.2,1.3-0.3c-0.1,0-0.2,0-0.3,0c0.6,0.2,1.2,0.5,1.8,0.7c0.3,0.2-0.1-0.3-0.2-0.5 c-0.1-0.3-0.3-0.7-0.4-1c-0.2-0.6-0.4-1.1-0.7-1.7c-0.7-1.6-1.6-2.4-3.2-3.1c-0.9-0.4-1.5-0.8-1.9-1.7c-0.5-1.3-0.6-2.8-0.7-4.1 c-0.3-6.1,1.7-12,1.8-18.1c0.1-3.2-4.9-3.2-5,0c-0.1,4.6-1.2,9.1-1.7,13.7c-0.4,4.1-0.5,9.9,2.7,13c0.7,0.7,1.6,1.2,2.5,1.6 c1,0.4,0.8,0.5,1.3,1.6c0.8,2,1.8,5.3,4.7,4.5c1-0.3,2-1,2.9-1.6c1.1-0.6,2.2-1.3,3.2-2c2-1.3,4-2.6,5.9-3.9c-1-1.3-2-2.6-3-3.9 c-4,4.7-8.3,9.2-12.7,13.5c1.2,0,2.4,0,3.5,0c-0.2-0.2-0.4-0.5-0.7-0.7c-0.4-0.3,0.1-0.3-0.1,0.1c0,0-0.3,0.6-0.3,0.6 c0.1,0.1,0.9-0.8,1-0.8c1-1.1,0.9-2.7,0.6-4.1c-0.3-1.2-0.8-2.2-0.5-3.4c0.4-1.4,0.9-2.6,1-4.1c0.1-3-0.6-6.2-1.1-9.2 c-0.5-3.2-1.1-6.3-1.7-9.4c-0.6-2.8-4.9-2.1-4.9,0.7C42,50,41.4,56.1,40.3,62.1c1.6,0,3.2,0,4.8,0c-0.5-1.6-0.5-3.3-0.6-4.9 c-0.1-1.9-0.5-3.8-1.1-5.7c-1.2-3.7-2.8-7.4-4.4-11c-0.8-1.9-4.3-1.5-4.6,0.6c-0.8,5.6-0.5,11.2,0.8,16.7c0.6,2.6,1.4,5.2,2.4,7.7 c1,2.5,2.5,4.9,3.1,7.4c0.5,2.3,4.3,2.4,4.8,0c0.1-0.5,0.2-0.7,0.5-1.1c-1.3-0.2-2.6-0.3-3.9-0.5c0.5,0.8,0.9,1.5,1.4,2.3 c1.3-1,2.6-2,3.9-3c-3.2-2.6-6.3-5.2-9.3-7.9c-1.5-1.3-3-2.6-4.5-4c-0.6-0.6-1.3-1.1-1.8-1.7c-0.4-0.6-0.1-0.6-0.6-0.3 c-0.4,0.1-0.8,0.2-1.3,0.3c0.1,0,0.2,0,0.2,0c-0.4-0.1-0.8-0.2-1.3-0.3c-0.4-0.2,0.3,0.4,0.3,0.5c0.2,0.2,0.3,0.4,0.5,0.6 c0.5,0.5,0.9,1,1.5,1.4c1.1,0.9,2.4,1.7,3.8,2c1.8,0.4,3.7-1.1,3.1-3.1c-1.1-3.6-3.4-6.5-6.4-8.6c-1.1-0.8-2.8-0.2-3.4,0.9 C27.5,51.6,28,53,29.1,53.8L29.1,53.8z"/> </g></g></svg>'); } #aa-vorbestellen { background: var(--theme-light); padding:4%; box-sizing:border-box; text-align:center; width: 100%; margin:1rem 0; border-radius: .5rem;position: relative;} #aa-vorbestellen .date { font-size: 2rem; padding: .5rem 0 1rem 0; } #aa-vorbestellen .text span { display: block; } #inWK .PGerror { margin-bottom: 1rem; } ul.it_features_ul li { list-style: inside; } .azu_icon div.cs_azu.azu12, .azu_icon div.cs_azu.azu13, .azu_icon div.cs_azu.azu5, .azu_icon div.cs_azu.azu1 {width:4rem;height:4rem;line-height:4rem;margin:.5rem;font-size:1rem;} .azu_icon div.cs_azu.azu5 { background-image:url(/img/azu-neu.svg);height: 3rem; width: 5rem; background-size: 4.5rem;} #gpsr_labels { padding-left: var(--padding); } #gpsr_pikto { display: grid; grid-gap: var(--padding); grid-template-columns: repeat(3, 1fr); cursor: help; } #gpsr_pikto img { aspect-ratio: 1 / 1; object-fit: contain; } .aa-blaettern { display: flex; justify-content: space-between; align-items: center; background-color: var(--theme-card-background); border-radius: var(--theme-radius-small); margin-bottom: 1rem; } .aa-blaettern .bl-pfeil { width: 3rem; height: 3rem; color: transparent; background-color: var(--theme-accent-dark); background-size: contain; background-repeat: no-repeat; background-position: 50%; border-radius: 2rem; } .aa-blaettern .bl-vor .bl-pfeil { background-image: url(/img/artikel_weiter.svg); } .aa-blaettern .bl-zurueck .bl-pfeil { background-image: url(/img/artikel_zurueck.svg); } .aa-blaettern .bl-mitte a { color: var(--theme-text); border-bottom: 1px dotted var(--theme-text); } .aa-blaettern .bl-mitte a:hover { color: var(--theme-accent-dark); } .aa_glabel_t {width: 200px;cursor: pointer;transition: 0.3s;padding-left: 10px;} .aa_glabel_t:hover {opacity: 0.8;} .aa_glabel_o {display: none;position: fixed;inset: 0;background: rgba(0,0,0,0.8);justify-content: center;align-items: center;z-index: 9999;} .aa_glabel_inner {width: 800px;max-width: 90vw;max-height: 90vh;} .aa_glabel_inner svg {width: 100%;height: auto;display: block;} body .tab-nav > [data-tab] { background-color: var(--theme-light); } .groessenbutton { margin-top: 1rem; } .groessenbutton img.hs-gr-button { width: 2.25rem; } .multifelder.flexbox { display: flex; flex-wrap: wrap; align-items: center; align-content: start; } .multifelder.flexbox .multi1 { width: 38%; padding: .5rem .25rem; } .multifelder.flexbox .multi2 { width: 62%; padding: .5rem .25rem; } .multifelder.flexbox .multi2.kollek { display: flex; } .multifelder.flexbox .multi2.kollek span { margin-left: 1rem; } .multifelder.flexbox hr { width: 100%; margin: 0; border: 0; border-bottom: 1px solid var(--theme-medium); }
@media (min-width: 576px) { #gutschein_motive, .gs_betrag { grid-template-columns: repeat(3, 1fr); } .fagrWrapper { grid-template-columns: repeat(5, 1fr); } #gpsr_pikto { grid-template-columns: repeat(6, 1fr); } }
@media (min-width: 768px) { #aa_detail nav { max-width: 100%; overflow-x: visible; } .fagrWrapper { grid-template-columns: repeat(4, 1fr); } #aa_detail { grid-template-areas: "pic basket" "unten unten"; grid-template-columns: 1fr 1fr; } #aa_unten { margin-top: 0; } #desktop_artikelname { display: block; padding-left: calc(var(--card-padding) * 1.5); margin-top: calc(var(--card-padding) * 1.5); } #preis { margin-top: 0; } #gutschein_motive, .gs_betrag { grid-template-columns: repeat(4, 1fr); } #cs_layer_unten { grid-template-rows: 1fr; grid-template-columns: 1fr 1fr; } .muster_kachel { width:30%; } #muster_layer { position: fixed; }  }
@media (min-width: 992px) { #gutschein_motive { grid-template-columns: repeat(5, 1fr); } #aa_detail { grid-template-columns: 3fr 2fr; } #desktop_artikelname a { font-size: 1.75rem; } .fagrWrapper { grid-template-columns: repeat(4, 1fr); } .aa_bewer_com { grid-template-columns: 1fr 1fr; } .rattext { padding-right: 2rem; } #gpsr_pikto { grid-template-columns: repeat(12, 1fr); } #cs_unten_cs { display: flex; }  }
@media (min-width: 1200px) { #gutschein_motive { grid-template-columns: repeat(6, 1fr); } /* #aa_detail.flasche { grid-template-columns: 1fr 2fr; } */ .fagrWrapper { grid-template-columns: repeat(4, 1fr); } #preisDiv { font-size: 3rem; } #preis .ehem_vktext, #preis .ehem_vk { font-size: 1.25rem; } }
@media (min-width: 1400px) { .fagrWrapper { grid-template-columns: repeat(4, 1fr); } #aa_pic_show figure { margin-top: 7rem; } }
/* ### kachel ### */
body { --kachel-max-height: 24rem; } ul.se { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: min-content; grid-gap: var(--padding); list-style: none; margin: 0; padding: 0; grid-auto-flow: dense; } ul.se.row > li { display: none; } ul.se.row > li:nth-child(-n+2) { display: block; } ul.se.suche.mb-4 { margin-bottom: 2rem; } .art_box, .se_banner { height: var(--kachel-max-height); display: block; position: relative; border-bottom: var(--theme-divider); background-color: var(--theme-card-background); overflow: hidden; transition: all .3s ease-out; will-change: transform; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); } ul.se > li:hover:not(.se_banner):not(.no_hover) { box-shadow: var(--shadow-elevation-high); transform: translateY(-.2rem) translateZ(0); } .art_box > .se_kachel { display: block; height: 100%; } .art_box > .se_kachel > div { position: relative; height: 100%; } ul.se > li.se_banner_hersteller > a > img { min-height: 40%; object-fit: contain; padding: .5rem; border-bottom: var(--theme-divider); } .se_kachel .rat_stars { position: absolute; top: 2rem; left: -.15rem; display: flex; flex-wrap: wrap; justify-content: center; width: 1.5rem; transition: all .1s ease-out; } .se_kachel:hover .rat_stars { opacity: 1; filter: grayscale(0); } .art_box #lager { font-size: .8em; padding: 0 .5rem; width: 100%; margin-top: .5rem; color: var(--theme-accent-medium); position: absolute; bottom: .5rem; display: flex; align-items: center; } .art_box #lager img.se-lager { height: .8rem; margin-right: .5rem; } .art_box #lager table, .art_box #lager br { display: none; } .art_box > .se_kachel > div > figure { margin: 0; text-align: center; transition: transform .3s ease-out; background-color: white; } .art_box > .se_kachel > div > figure img { width: 9rem; height: 8rem; object-fit: contain; margin: 1rem 0; } ul.se > li > a > div > .se_header, .art_box > .se_kachel > div > .se_header { position: absolute; top: 0; left: 0; right: 0; z-index: 1; } .se_diff { display: block; height: 2rem; width: 3.5rem; background-color: var(--theme-error); color: rgb(255,255,255); line-height: 2rem; text-align: center; border-bottom-right-radius: var(--theme-radius-medium); font-size: 1rem; margin-top: 0; position: absolute; right: 0; top: .25rem; } .suchtemp_azu_her { float: left; } .cs_azu { height: 3rem; width: 3rem; background-size: 100%; background-repeat: no-repeat; background-position: center; margin: 0.5rem; } /* azu icons */ .cs_azu[title] { cursor: help; } .cs_azu.azu5 { background-image: url(/img/azu-neu.svg); } .se_unten { display: flex; flex-direction: column; align-content: space-between; justify-content: space-evenly; position: absolute; top: 12rem; left: 0; right: 0; bottom: 0; } .se_name { height: 4.5rem; line-height: normal; margin-top: 1.5em; } .se_name span { display: block; text-align: center; padding: 0; color: var(--theme-text); text-wrap: balance; font-size: .9em; } .se-minanz { display: block; text-align: center; font-size: .8rem; } .se_preis { height: 5rem; } .se_preis .se_vk { color: var(--theme-text); font-size: 1.2em; text-align: center; display: flex; flex-wrap: wrap; justify-content: center; font-weight: bold; white-space: nowrap; } .se_preis .se_vk s { display: block; color: var(--theme-text); font-weight: 300; font-size: 1rem; float: left; font-size: inherit; margin: 0 .5rem; } .se_preis .se_litp { display: block; text-align: center; color: var(--theme-text); } .se_preis .se_litp br { display: none; } li .se_preis .se_vk s { transition: opacity .1s ease-out; } li .se_preis .se_litp { opacity: .8; transition: opacity .1s ease-out; font-size: .8rem; } li:hover .se_preis .se_vk s, li:hover .se_preis .se_litp { opacity: 1; } li:hover .se_preis .se_vk s, li:hover .se_preis .se_litp { opacity: 1; } ul.se li.se_banner { overflow-y: auto; padding: 0; margin: 0; } ul.se li.se_banner p, ul.se li.se_banner h2, ul.se li.se_banner h3 { padding: 0; } ul.se .banner { position: relative; height: 100%; width: 100%; } ul.se .banner > a { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-position: center; background-size: cover; padding: var(--padding); } ul.se li.se_banner.sb { padding: 0 1rem; } ul.se li.se_banner.sb h2 { margin-bottom: 0; } ul.se .banner > a > h2 { background: rgba(255,255,255,.5); position: absolute; z-index: 2; top: 0; text-align: center; padding: 1rem 2rem; text-shadow: var(--theme-text-shadow); } ul.se .banner > a .button { position: absolute; bottom: 10%; z-index: 2; } ul.se .banner > a > span { position: absolute; bottom: var(--padding); width: calc(100% - calc(var(--padding) * 2)); text-align: center; } ul.se .banner > a > span.se_text { color: var(--theme-text); top: 0; } ul.se .banner > img { margin: var(--padding) 25%; } ul.se > li.se_banner.gr_2x1, ul.se > li.se_banner.gr_2x2 { height: calc(calc(var(--kachel-max-height) * 1.5) + var(--padding)); } ul.slides { width: calc(100% * var(--slides)); height: 100%; margin: 0; padding: 0; list-style: none; overflow: hidden; display: flex; transition: transform .3s ease-out; } ul.slides > li { width: calc(100% / var(--slides)); height: 100%; } ul.slides > li > a { display: block; width: 100%; height: 100%; position: relative; } ul.slides .banner img, ul.slides > li a img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1; } ul.slides .banner { z-index: 2; display: flex; flex-direction: column; justify-content: space-around; align-items: center; } ul.slides .banner > div > h3 { margin: 0; font-size: 2em; text-shadow: var(--theme-text-shadow); } ul.slides .banner > div { text-align: center; } ul.slides .banner > div > .subtitle { opacity: .8; text-shadow: var(--theme-text-shadow); } ul.slides-nav { position: absolute; bottom: 0; left: 0; right: 0; padding: var(--padding); list-style: none; display: flex; justify-content: center; margin: 0; z-index: 3; gap: var(--padding); } ul.slides-nav > li { height: 1.5rem; width: 1.5rem; line-height: 1.5rem; text-align: center; background-color: var(--theme-light); color: var(--theme-text); border-radius: 50%; cursor: pointer; } ul.slides-nav > li.active { background-color: var(--theme-accent-medium); color: var(--theme-accent-text); } ul.se > li .quick-buy, ul.se > li > a.se_beobachten { position: absolute; bottom: 1rem; right: 0; height: 2rem; width: 2rem; border-radius: 50%; transform: translateY(50%); opacity: 1; transition: all .5s ease-out; z-index: 2; background-size: 75%; background-position: center; background-repeat: no-repeat; cursor: pointer; background-image: url(/img/bg-merken.svg); transition-delay: .2s; } ul.se > li:hover .quick-buy, ul.se > li:hover .se_beobachten, ul.se > li > a.se_beobachten.active { opacity: 1; } ul.se > li > a.se_beobachten.active { background-image: url(/img/bg-se-merken-active.svg)!important; } ul.se > li .quick-buy { right: 4.5rem; transform: translateX(50%); transition-delay: 1.2s; transition-duration: .4s; background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="iso-8859-1"%3F><svg xmlns="http://www.w3.org/2000/svg" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 2138.327 2138.327" style="enable-background:new 0 0 2138.327 2138.327;" xml:space="preserve" width="40px" height="40px"><path d="M1032.925,1852.654c0,98.076-79.506,177.583-177.583,177.583S677.76,1950.73,677.76,1852.654  c0-98.076,79.506-177.583,177.583-177.583S1032.925,1754.578,1032.925,1852.654z M1574.387,1675.072  c-98.076,0-177.583,79.507-177.583,177.583c0,98.076,79.507,177.583,177.583,177.583c98.076,0,177.583-79.507,177.583-177.583  C1751.969,1754.578,1672.463,1675.072,1574.387,1675.072z M2125.619,841.423l-218.512,649.464c0,0-18.088,96.383-110.247,96.383  s-993.407,0-1103.389,0s-114.604-120.809-114.604-120.809S461.624,596.637,455.814,544.088s-73.013-91.498-73.013-91.498  L93.651,317.522c-158.306-82.784-86.349-240.298,0-204.121c366.652,172.961,536.973,258.122,547.932,326.25  c11.091,68.26,30.367,232.64,30.367,232.64v1.056c2.245-0.66,3.829-1.056,3.829-1.056s1124.382,0,1351.477,0  C2190.447,672.291,2125.619,841.688,2125.619,841.423z M1809.535,1203.058l-2.245,0.132H737.57L759.619,1378h997.896  L1809.535,1203.058z M1913.708,850.534H693.339l23.502,186.825c234.092,0,919.601,0,1141.678,0L1913.708,850.534z" fill="RGB(0,0,0)"/></svg>'); } .gr_1x2, .gr_2x2 { grid-column: span 2; } .gr_2x1, .gr_2x2 { grid-row: span 2; } .lief_gr_farbe_tab { position: absolute; top: 11rem; left: 0; right: 0; transform: translateY(-50%); } .lief_gr_farbe_tab ul { list-style: none; display: flex; flex-wrap: wrap; padding: 0; justify-content: center; gap: .3rem; margin-bottom: .3rem; } .lief_gr_farbe_tab ul li { height: 1.5rem; width: 1.5rem; text-align: center; line-height: 1.5rem; font-size: 0.8rem; border-radius: 50%; background-color: var(--theme-light); color: var(--theme-text); box-shadow: var(--shadow-elevation-medium); overflow: hidden; list-style: none; } #pag_se ul { list-style: none; padding: 0; display: flex; align-items: center; place-content: center; } #pag_se ul > li > div { height: 2.5rem; padding: 0 1rem; line-height: 2.5rem; } #pag_se ul > li > #linkpagzur, #pag_se ul > li > #linkpagvor, #pag_se ul > li > #linkpag1 { cursor: pointer; display: block; height: 2.5rem; width: 2.5rem; background-color: var(--theme-accent-medium); border-radius: 20%; background-repeat: no-repeat; background-position: center; background-size: 32%; margin: 0 .5rem; box-shadow: var(--shadow-elevation-medium); transition: box-shadow .3s ease-out;} #linkpagzur { background-image: url(/img/artikel_weiter.svg); rotate: -180deg; } #linkpagvor { background-image: url(/img/artikel_weiter.svg); } #linkpag1 { background-image: url(/img/se-zuruck.svg); background-size: 50%!important; } #shopLayer #pag_se ul > .nopag { opacity: .5; } #pag_se ul > li > *[href]:hover { box-shadow: var(--shadow-elevation-high); } .pag { font-size: 1.2em !important; text-align: center; color: var(--theme-black); align-items: center; place-content: center; } .se_farben .lief_gr_farbe1_k { cursor: pointer; margin: 0 .2rem; border-radius: 1rem; display: inline-block; height: .75rem; width: .75rem; filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.3)); transform: scale(1); } .se_farben .lief_gr_farbe1_k:hover, .se_farben .lief_gr_farbe1_k.active { transform: scale(1.3); -moz-transform: scale(1.3); -ms-transform: scale(1.3); -webkit-transform: scale(1.3); } .se_farben { position: absolute; top: 10rem; width: 100%; text-align: center; padding: .5rem 0; overflow: hidden; line-height: 1.25em; } .se_preisaufanfrage + .cur { display: none; }
@media (min-width: 576px) { body { --grid-column-count: 6; --grid-item--min-width: 13rem; --kachel-max-height: 25rem; --gap-count: calc(var(--grid-column-count) - 1); --total-gap-width: calc(var(--gap-count) * var(--padding)); --grid-item--max-width: calc((100% - var(--total-gap-width)) / var(--grid-column-count)); } ul.se { grid-template-columns: repeat(auto-fill, minmax(max(var(--grid-item--min-width), var(--grid-item--max-width)), 1fr)); } ul.se.row > li:nth-child(-n+3) { display: block; } ul.se > li.se_banner.gr_2x1, ul.se > li.se_banner.gr_2x2 { height: calc(calc(var(--kachel-max-height) * 2) + var(--padding)); } .se_unten { top: 14rem; } .art_box > .se_kachel > div > figure img { height: 11rem; } .se_farben { top: 11rem; } .se_preis .se_vk strike { margin: 0 .5rem; } .lief_gr_farbe_tab { top: 15rem; } .se_name { margin-top: 1rem; } .se_name span { font-size: 1rem; } .art_box > .se_kachel > div > figure img { width: 11rem; } .se_kachel .rat_stars { top: 3rem; } }
@media (min-width: 768px) { body { --kachel-max-height: 26rem; } #dd_sort_top, #filter_anzeigen { font-size: 1em; } #pag_se ul > li > #linkpagzur, #pag_se ul > li > #linkpagvor, #pag_se ul > li > #linkpag1 { height: 2.5rem; width: 2.5rem; margin: 0 2rem; } .se_unten { top: 16rem; } .se_name { height: 4rem; } .se_farben { top: 12rem; } .se_farben .lief_gr_farbe1_k { height: 1rem; width: 1rem; line-height: 1.5em;} }
@media (min-width: 992px) { body { --grid-item--min-width: 14rem; } ul.se.row > li:nth-child(-n+4) { display: block; } ul.se > li .quick-buy, ul.se > li > a.se_beobachten { opacity: 0; background-color: var(--theme-card-background); box-shadow: var(--shadow-elevation-medium); } ul.se > li:hover .quick-buy, ul.se > li:hover .se_beobachten, ul.se > li > a.se_beobachten.active { transform: translateY(0); opacity: 1; } ul.se > li .quick-buy, ul.se > li > a.se_beobachten { right: 1rem; }  }
@media (min-width: 1200px) { ul.se.row > li:nth-child(-n+5) { display: block; } }
@media (min-width: 1400px) { ul.se.row > li:nth-child(-n+6) { display: block; } }
/* ### to-top-button ### */
#btn-to-top { display: block; opacity: 0; transform: translateY(2rem); visibility: hidden; position: fixed; bottom: 1rem; right: 1rem; height: 3rem; width: 3rem; background-size: 1rem; background-color: var(--theme-accent-medium); border: none; border-radius: 50%; box-shadow: var(--shadow-elevation-medium); z-index: 90; transition: all .2s ease-out; background-image: url(/img/artikel_weiter.svg); background-position: center; background-repeat: no-repeat; padding: 0; } #btn-to-top.visible { opacity: 1; visibility: visible; transform: translateY(0) rotate(-90deg); }
/* ### input-floating ### */
.inp_wrapper { position: relative; margin-top: .75rem; } .inp_wrapper label { position: absolute; top: 1.5rem; left: .8rem; font-size: .9rem; z-index: 1; color: var(--theme-text); transition: all .15s ease-out; opacity: .54; pointer-events: none; font-family: inherit; } .inp_wrapper:focus-within label, .inp_wrapper input:not(:placeholder-shown) + label, .inp_wrapper textarea:not(:placeholder-shown) + label, .inp_wrapper select + label, .inp_wrapper input:-webkit-autofill + label, .inp_wrapper textarea:-webkit-autofill + label, .static-input .inp_wrapper textarea + label, .static-input .inp_wrapper input + label, .inp_wrapper input + label.static, .inp_wrapper textarea + label.static { transform: translateY(-1.8rem); opacity: 1; } .inp_wrapper input, .inp_wrapper textarea, .inp_wrapper select { margin-top: 1rem; } .inp_wrapper label span.red { color: red; } .inp_wrapper.valid input { border-bottom: 1px solid var(--theme-success); }
/* ### powermenu ### */
.powermenue div {color: var(--theme-text);} .powermenue { display: flex; position: fixed; z-index: 99; top: 4rem; left: 0; right: 0; bottom: 0; background-color: var(--theme-powermenu-medium); overflow-y: auto; overflow-x: hidden; opacity: 0; visibility: hidden; transform: translateX(-2rem); transition: all .3s ease-out; } nav.powermenue.open {opacity: 1;visibility: visible;transform: translateX(0);} #powermenue-strukturen-ueberschrift {display: flex;background-color: var(--theme-gold);padding: .5rem 0;align-items: center;justify-content: center;} .powermenue-head { width: 100%;flex-direction: column; align-items: stretch;left: 0px;position: absolute; margin: 0; opacity: 1; pointer-events: all; transition: all .2s ease out; } .powermenue-head.hidden { opacity: 0; pointer-events: none; } .powermenue-head li { background-color: var(--theme-dark); margin: 0; margin-bottom: .1rem; display: flex;align-items: center;justify-content: space-between;cursor: pointer; padding-right: 1rem; } .powermenue-head li:last-child { border-bottom: 0; } .powermenue-head a { font-size: 1.25em; color: var(--theme-text); padding: 1rem; } .powermenue-head a:hover, .powermenue-modul-auflistung li a:hover, #shopLayer .powermenue .powermenue-strukturen a:hover { color: var(--theme-gold); } .powermenue-head li.powermenue-aktiv a { color: var(--theme-gold); } .powermenue-strukturen { position: absolute; display: block; top: 0; left: 0; right: 0; bottom: 0; padding: 0; background-color: var(--theme-white); transition: all .3s ease-out; box-shadow: none; } .powermenue-strukturen.hidden {opacity: 0;visibility: hidden;transform: translateX(-2rem);} .powermenue-struktur.hidden, .powermenue-struktur-module.hidden { display: none; } .powermenue-struktur-module { display: flex; width: 100%; padding: 1rem;box-sizing: border-box; } .powermenue-struktur-module {flex-direction: column;padding: 0;} .powermenue-modul-ueberschrift { display: block; padding: .5rem 1rem; font-size: 1.25em; font-weight: bold; background-color: var(--theme-accent-light); text-align: center; } .powermenue-modul-ueberschrift-wrapper { } .powermenue-modul-ueberschrift-icon {height: 1.5rem;width: 1.5rem;} .powermenue-modul { width: 100%;margin: 0;} .powermenue-modul a, .powermenue-modul p { font-size: 1.25em; } .powermenue-modul .powermenue-modul-auflistung[data-modul-typ="auflistung"] {display: flex;align-items: center;justify-content: flex-start;flex-direction: row;flex-wrap: wrap; margin: 0; } .powermenue-modul .powermenue-modul-auflistung[data-modul-typ="auflistung"] li { width: 100%; } .powermenue-struktur-module .powermenue-modul:first-child li { padding: 1rem; background-color: var(--theme-light); margin-bottom: .15rem; } .powermenue-struktur-module .powermenue-modul:first-child li a { font-size: 1.25em; } .powermenue-modul-auflistung .powermenue-auflistung-mit-icon {padding: 0;} .powermenue-modul-auflistung { padding: .5rem 1rem 1rem 1rem; } .powermenue-modul-auflistung li.powermenue-aktiv a {color: var(--theme-gold);} .powermenue-modul-auflistung li a:empty { display: none; } .powermenue-modul-auflistung li a { display: block; padding: .25rem 0; } .powermenue-html-oben, .powermenue-html-unten { width:100%; padding: 1rem; } .powermenue-html-oben:empty, .powermenue-html-unten:empty { display:none; } .powermenue-modul-ueberschrift-icon {width: 2rem;height: 2rem;object-fit: contain;margin-right: .25rem;} .powermenue-auflistung-mit-icon img {width: 3rem;height: 3rem;margin: 0.5rem 1rem 0.5rem 0;} .powermenue-auflistung-mit-icon a, .powermenue-icons-mit-text a, .powermenue-top-marke a {display: flex;justify-content: flex-start;align-items: center;} .powermenue-icons-mit-text img { width: 4rem;height: 4rem;margin-bottom: .25rem; } .powermenue-icons-mit-text a, .powermenue-top-marke a {flex-direction: column;} .powermenue-icons-mit-text a p, .powermenue-top-marke a p {font-size: .8rem;margin-bottom: .5rem;} .powermenue-modul-auflistung .powermenue-top-marke {padding: .75rem 0 .5rem 0;} .powermenue-modul-top-marken, .powermenue-top-marke, .powermenue-modul-top-artikel {display: flex;flex-direction: row;flex-wrap: wrap;align-items: center;justify-content: flex-start;} .powermenue-top-marke img, .powermenue-top-artikel img {max-width: 200px;max-height: 200px;object-fit: contain;} .powermenue-modul .powermenue-top-artikel-name {font-size: 1rem;} .powermenue-modul-icons {display: flex;flex-direction: row;flex-wrap: wrap;justify-content: flex-start;align-items: center;} .powermenue-modul-auflistung li.powermenue-top-artikel {background-color:rgb(255,255,255);border:1px solid rgb(221,221,221);padding:.5rem;box-sizing:border-box;margin-right:2rem;} .powermenue-top-artikel {width: 100%;} .powermenue-top-artikel a {align-items: center; } .powermenue-top-artikel-rechts .powermenue-top-artikel-preis {font-size: 1.5rem;} .powermenue-mehr-anzeigen-button {margin-bottom: 0.5rem; } .powermenue-top-marke img, .powermenue-top-artikel img {max-width: 100px;max-height: 100px;object-fit: contain;} .powermenue-top-artikel a {display: flex;align-items: center;justify-content: flex-start;} .powermenue-top-artikel-rechts {margin-left: 5px;} .powermenue-top-artikel-name {font-size: .8rem;margin-bottom: 10px;} .powermenue-top-artikel-preis {font-size: 1rem;} .powermenue-zwei-spalten-rechts {display: none;} .powermenue-mehr-anzeigen {display: none;} .powermenue-mehr-anzeigen-button {cursor: pointer;display: flex; align-items: center;justify-content: center;margin-top: .5rem;} .powermenue-pfeil-unten {margin-left: .5rem;transform: rotate(90deg);} #powermenue-zurueck {position: absolute;background: transparent url(/img/powermenue_arrow.svg) no-repeat 50% 50%;background-size: auto 40px;z-index: 1000;cursor: pointer;width: 4rem;height: 2rem;left: 0;padding: 1rem 1rem 1rem 0;} #powermenue-zurueck-text {font-size: 1.25rem;color: var(--theme-accent-text);} .powermenue-head-mobile-pfeil {display: none;} .alle-struktur-artikel-anzeigen {display: none; } .powermenue-struktur a { color: var(--theme-text); } .powermenue-zwei-spalten-links {display: flex;align-items: center;justify-content: flex-start;} .powermenue-pfeil-rechts {margin-left: 0.25rem;} .powermenue-modul-html img {max-width: 100%;} .powermenue-modul.powermenue-modul-nummer-3 .powermenue-modul-auflistung {margin-top:0;} .powermenue-modul.powermenue-modul-nummer-6 ul li {width:50%;} .powermenue-modul.powermenue-modul-nummer-6 ul li.powermenue-icons-mit-text a {flex-direction: unset;} .powermenue-modul.powermenue-modul-nummer-6 ul li.powermenue-icons-mit-text a p {display:none;} .powermenue-head-mobile-pfeil {display: block;background: transparent url(/img/powermenue_arrow.svg) no-repeat 50% 50%;background-size: auto 40px;width: 2rem;height: 2rem;transform: rotate(180deg); margin: 0; } .powermenue-modul[data-modul-typ='zwei-spalten-rechts'] { display: none; } .alle-struktur-artikel-anzeigen {display: flex;align-items: center;justify-content: space-between;width: 100%;margin: .1rem 0;padding: .5rem 1rem;box-sizing: border-box;background-color: var(--theme-accent-light);} .alle-struktur-artikel-anzeigen p { margin: 0; } .alle-struktur-artikel-anzeigen p:first-child { font-size: 1.25em; } .powermenue-pfeil-rechts { transform: rotate(90deg); } .powermenue-modul-auflistung .powermenue-auflistung-platzhalter { border-bottom: 0; } .powermenue-modul.powermenue-modul-nummer-6 ul li {width:33.33%;} .powermenue-modul-html ul li a strong { margin-right: .5rem; } .pmc-hover { position: relative; text-decoration: underline; color: var(--theme-gold) !important; } .powermenue-struktur-module .powermenue-modul:not(:first-child) { position: absolute; top: 0; z-index: 1000; background-color: #fff; height: 100vh; flex-direction: column; } .pmc-modul-ausblenden {background-color: var(--theme-gold) !important; color: var(--theme-white); padding: 0.5rem; font-size: 1.5em; align-items: center;} #powermenue-zurueck-text, .pmc-modul-ausblenden-text { color: var(--theme-white)!important; text-transform: uppercase; text-align: center; font-size: 1.4rem; } .powermenue-auflistung-hoch { font-weight: bold; padding: .5rem 0 .5rem 1rem; background-color: var(--theme-light); display: flex; align-items: center; } .powermenue-auflistung-hoch a { font-size: 1.25em; line-height: 1.25em; } .powermenue-auflistung-hoch img { height: 1.25em; margin-right: .5rem; } .powermenue-modul-auflistung #m3-p2-modul1-eigenedragdrop-139, .powermenue-modul-auflistung #m3-p2-modul1-eigenedragdrop-140 { background-color: unset; font-weight: bold; padding: 0; margin: 0; font-size: 1.25em; padding-left: 1rem; } .powermenue-modul-auflistung #m3-p2-modul1-eigenedragdrop-139 a, .powermenue-modul-auflistung #m3-p2-modul1-eigenedragdrop-140 a { padding-bottom: 0; } .powermenue-struktur-module .powermenue-modul:first-child .powermenue-modul-ueberschrift-wrapper { display: none; } #powermenue-menuepunkt-5 a { position: relative; } #powermenue-menuepunkt-5 a:after { content: '%'; background-color: var(--theme-red); display: block; position: absolute; color: var(--theme-white); font-size: .9em; border-radius: 1rem; width: 1.5rem; height: 1.5rem; top: 1rem; right: -1rem; text-align: center; } .powermenue-modul:first-child .powermenue-modul-auflistung { padding: 0; }
@media (min-width: 576px) { .powermenue-modul .powermenue-modul-auflistung[data-modul-typ="auflistung"] li { width: 50%; } .powermenue-modul:first-child .powermenue-modul-auflistung[data-modul-typ="auflistung"] li { width: 100%; } }
@media (min-width: 768px) { nav.powermenue.open { max-width: 600px; box-shadow: 0px 12px 24px -10px rgba(0,0,0,1); } }
@media (min-width: 992px) { .powermenue {width: 100%;display: flex;align-items: center;justify-content: flex-start;flex-direction: column; overflow: visible; opacity: 1; visibility: visible; position: relative; top: 0; background: none; transform: none; } #powermenue-schalter { display: none; } .powermenue-head { display: flex; flex-direction: row; justify-content: center; height: 3rem; align-items: center;padding: 0; margin-top: 0; } .powermenue-head li { height: auto; margin: 0; padding: 0; background-color: unset; } .powermenue-head li a { padding: 0 1rem; } .powermenue-head a { font-family: 'Header-Font'; } .powermenue-struktur-module .powermenue-modul:first-child li a { font-size: 1.25em; } .powermenue-strukturen.hidden {opacity: 0;visibility: hidden;transform: translateY(-2rem);} .powermenue-modul .powermenue-modul-auflistung[data-modul-typ="auflistung"] li { width: 100%; } .powermenue-struktur, .powermenue-struktur-module { display: flex;align-items: flex-start;justify-content: flex-start; } .powermenue-strukturen { position: static; width: 100%; background-color: var(--theme-light); display: block; box-shadow: 0px 12px 24px -10px rgba(0,0,0,0.75); padding:1rem;box-sizing: border-box; margin-top: 3rem; } .powermenue-strukturen.hidden { display: none; } .powermenue-struktur { flex-direction: column; } .powermenue-struktur-module { width: 100%; flex-direction: row; padding: 1rem; justify-content: space-between; } .powermenue-modul { width: 23%; margin: 0; } .powermenue-html-unten #alle-marken {float:right;} .powermenue-html-oben #alle-marken {float:right;} .powermenue-html-oben h1 {margin:0;} .powermenue-top-marke {width: 50%;justify-content: flex-start;justify-content: center;} .powermenue-icons-mit-text {width: 25%;} .powermenue-icons-mit-text img {width: 5rem;height: 5rem;} .powermenue-auflistung-mit-icon img, .powermenue-icons-mit-text img {width: 3.5rem;height: 3.5rem;} .powermenue-head-mobile-pfeil { display: none; } .alle-struktur-artikel-anzeigen { display: none; } #powermenue-strukturen-ueberschrift { display: none; } .powermenue-struktur-module .powermenue-modul:first-child { background-color: var(--theme-accent); padding: .57rem 1.5rem; width: 23% !important; } .powermenue-struktur-module .powermenue-modul:first-child a { color: var(--theme-white); font-size: 1.25em; } .powermenue-struktur-module .powermenue-modul:first-child a:hover { color: var(--theme-gold); } .powermenue-modul-auflistung li.powermenue-aktiv a { color: var(--theme-gold)!important; } .powermenue-modul-ueberschrift { display: none; } #m3-p2-modul1-eigenedragdrop-141 a, #m3-p2-modul1-eigenedragdrop-142 a, #m3-p2-modul1-eigenedragdrop-143 a, #m3-p2-modul1-eigenedragdrop-144 a { font-size: 1.2em; } .powermenue-struktur-module .powermenue-modul:not(:first-child) { position: static; top: 0; z-index: 1000; background-color: unset; height: auto; flex-direction: row; } .powermenue-modul-ueberschrift-wrapper { display: none; } .powermenue-struktur-module .powermenue-modul:first-child .powermenue-modul-auflistung li { position: relative; margin: 0; padding: .5rem 1rem .5rem 0; background-color: unset;} .powermenue-modul-auflistung a { display: block; padding: 0.25rem 0; } .powermenue-modul-auflistung li { margin-bottom: 7px; } .powermenue-modul-auflistung { margin: 0; padding: 0; align-items: flex-start!important; justify-content: space-between!important; } .pmc-hover:after { content: " "; display: block; width: 20px; height: 20px; background-color: var(--theme-accent); position: absolute; right: -50px; top: 3px; transform: rotate(45deg); } .powermenue-modul { align-items: flex-start; } .powermenue-struktur-module .powermenue-modul:not(:first-child) { position: relative; } .powermenue-struktur-module .powermenue-modul:not(:first-child) ul { columns: 2; -webkit-columns: 2; -moz-columns: 2; list-style-position: inside; margin-top: 60px; display: block; } .powermenue-modul a, .powermenue-modul p { font-size: 1em; } .powermenue-struktur-module .powermenue-modul:not(:first-child) div.powermenue-auflistung-hoch { position: absolute; width: 45%; margin-top: 0; } .powermenue-struktur-module .powermenue-modul:not(:first-child) > .powermenue-modul-auflistung { width: 50%; } .pmc-wrapper-rechts { width: 50%; } .powermenue-auflistung-hoch { display: flex; align-items: center; justify-content: flex-start; height: auto; padding-bottom: 10px; border-bottom: 1px solid rgb(202,202,202); padding-left: 0; } .powermenue-auflistung-hoch a { font-size: 1.25em; } .powermenue-auflistung-hoch img { height: 1.25rem; } .pmc-modul-ausblenden { display: none; } .powermenue-struktur-module .powermenue-modul:first-child li { text-align: right; } .powermenue-modul-auflistung li#m3-p2-modul1-eigenedragdrop-142 { border-bottom: .1rem solid var(--theme-white); padding-bottom: 1.5rem; } .powermenue-struktur-module .powermenue-modul:not(:first-child) > div.powermenue-auflistung-hoch { margin: 0; } .powermenue-modul-auflistung #m3-p2-modul1-eigenedragdrop-139, .powermenue-modul-auflistung #m3-p2-modul1-eigenedragdrop-140 { background-color: unset; font-weight: bold; padding: .5rem 1rem .5rem 0; margin: 0; font-size: 1em; } #powermenue-menuepunkt-5 a:after { top: .3rem; } }
@media (min-width: 1200px) { .powermenue-head li a { padding: 0 2rem; } #powermenue-menuepunkt-5 a:after { right: 0; } }
/* ### search ### */
ul.se li em { font-weight: bold; font-style: normal; background-color: yellow !important; color: black !important; } .css_dropdown[data-group='ag'] { display: none; } #meili-search { min-height: 85vh; } #meili-search #meili-items li#faqs { grid-column: 1 / span 2; padding: var(--padding); height: auto; overflow-y: auto; } #meili-search #meili-items li#faqs p { padding: 0; text-align: left; } #meili-term:empty, #meili-active-filters:empty { display: none; } #meili-title { display: flex; align-items: baseline; justify-content: space-between; } #meili-filters { display: none; grid-template-columns: 1fr 1fr; grid-gap: var(--padding); margin-bottom: 2rem; } #meili-filters.open { display: grid; } #meili-filters > div { flex: 1; } #meili-filters .css_dropdown ul li label span { font-size: .8rem; opacity: .8; float: right; line-height: 1.5rem; } #meili-filter-toggle { display: none; } #meili-filter-toggle.visible { display: block; } #meili-active-filters { margin-bottom: var(--padding); } #meili-active-filters > button { margin-right: var(--padding); } #meili-placeholder, #meili-no-hits, #meili-fallback-placeholder { text-align: center; max-width: 66rem; margin: 0 auto; } #meili-fallback-placeholder { font-weight: bold; margin-top: var(--padding); } #meili-no-hits { display: none; } #meili-no-hits > b { font-size: 1.1rem; margin-bottom: 2rem; display: inline-block; font-family: 'Header-Font'; } #meili-search h1 { margin-bottom: 0; } #meili-search p { margin-top: 0; } #shopLayer.suche-offen #kopf_bottom_line { display: none; } #shopLayer.suche-offen #kopf_top_line { box-shadow: 0 0 25px -5px rgba(0,0,0,.25); } #shopLayer.suche-offen #kopf_top_line #k_logo img { height: 3.5rem; } .suche-struktur { } .suche-struktur nav ul { display: flex; flex-wrap: wrap; justify-content: space-between; } .suche-struktur nav ul li { list-style: none; width: 100%; } .suche-struktur nav ul li a { display: block; background: var(--theme-light); padding: .5rem; color: var(--theme-text); margin-bottom: .25rem; } .suche-struktur nav ul li a:hover { background: var(--theme-accent-dark); color: var(--theme-white); } .suche-struktur nav ul li { list-style: none; } .suche-struktur nav ul li.head { width: 100%; background: var(--theme-medium); padding: .5rem; color: var(--theme-text); margin-bottom: .25rem; } .suche-struktur ul.lvl_2, .suche-struktur ul.men_her { display: flex; flex-wrap: wrap; } .suche-struktur ul.lvl_2 li, .suche-struktur ul.men_her li { width: 100%; } ul.men_zk1 .alvl_1 { background: var(--theme-medium); margin-top: .5rem; } #men_5 #men_ul_id_1 li { width: 32%; } #men_5 #men_ul_id_1 li a { background: var(--theme-dark); } #men_5 #men_ul_id_1 li a:hover { background: var(--theme-accent-dark); color: var(--theme-white); }
@media (min-width: 576px) { #meili-filters { grid-template-columns: repeat(3, 1fr); } #meili-search #meili-items li#faqs { height: var(--kachel-max-height); } }
@media (min-width: 768px) { #meili-filters { display: grid; grid-template-columns: repeat(4, 1fr); } #meili-filter-toggle.visible { display: none; } #meili-search #meili-items li#faqs { grid-column: 1 / span 3; } .suche-struktur ul.lvl_2 li { width: 49.5%; } .suche-struktur ul.men_her li { width: 49.5%; } }
@media (min-width: 992px) { #meili-filters { grid-template-columns: repeat(5, 1fr); } .suche-struktur ul.lvl_2 li { width: 32.5%; } .suche-struktur ul.men_her li { width: 32.5%; } }
@media (min-width: 1200px) { #meili-filters { grid-template-columns: repeat(6, 1fr); } }
@media (min-width: 1400px) { #meili-filters { grid-template-columns: repeat(6, 1fr); } }
/* ### kachel-stapel ### */
.art_stapel { list-style: none; padding: 2rem; overflow-y: hidden; overflow-x: scroll; display: flex; scroll-behavior: smooth; } .art_stapel .art_box { min-width: 17rem; margin-right: var(--padding); } .art_stapel .art_box:first-of-type { margin-left: 2rem; } .art_stapel .art_box:not(:first-of-type) { margin-left: -8rem; } .art_stapel .art_box:hover, .art_stapel .art_box:focus-within, .art_stapel .art_box.active { transform: translateX(-2rem) translateY(-.3rem) rotate(-3deg); transform-origin: bottom right; } .art_stapel .art_box:hover~.art_box, .art_stapel .art_box:focus-within~.art_box, .art_stapel .art_box.active~.art_box { transform: translateX(4.5rem); } .art_stapel_wrapper { position: relative; } .art_stapel_wrapper button.art_slider_nav { display: none; } @media (pointer: fine) { .art_stapel_wrapper button.art_slider_nav { position: absolute; display: block; left: 0rem; top: 50%; transform: translate(0%, -50%) rotate(180deg); height: 3rem; width: 3rem; padding: 0; border-radius: 50%; background-image: url(/img/artikel_weiter.svg); background-position: center; background-repeat: no-repeat; background-size: 30%; } .art_stapel_wrapper button.art_slider_nav.slider_next { left: unset; right: -.5rem; transform: translate(0%, -50%) rotate(0deg); } }
/* ### kachel_mouseover ### */
/* punkte */ /* .kachel-mouseover-nav { pointer-events: none; position: absolute; top: .75rem; left: .75rem; right: .75rem; display: flex; justify-content: center; gap: .25rem; } .kachel-mouseover-nav > div { height: .6rem; width: .6rem; background-color: #000000; opacity: .8; border-radius: 50%; } .kachel-mouseover-nav > div.active { transform: scale(1.25); opacity: 1; } */ /* leiste */ .kachel-mouseover-nav { pointer-events: none; position: absolute; top: 0; left: 0; right: 0; display: flex; } .kachel-mouseover-nav > div { height: .3rem; flex: 1; background-color: #000000; opacity: .4; } .kachel-mouseover-nav > div.active { transform: translateY(0); opacity: .8; } ul.se > li > a > div > .se_header, .art_box > .se_kachel > div > .se_header { pointer-events: none; }
/* ### drag-zoom ### */
#article-image #zoomButtons { display: none; } @media (pointer: fine) { #article-image #zoomButtons { display: block; position: absolute; bottom: 1rem; right: 0; z-index: 2; } #article-image #zoomButtons div { height: 3rem; width: 3rem; border: var(--theme-border); background-color: var(--theme-light); margin-bottom: .1rem; cursor: pointer; background-size: 68%; background-position: center; background-repeat: no-repeat; } #article-image #zoomButtons #zoomIn { background-image: url(/img/pg_plu.svg); } #article-image #zoomButtons #zoomOut { background-image: url(/img/pg_min.svg); } #article-image #zoomButtons div.disabled { cursor: no-drop; opacity: .5; } }
/* ### kachel-slider ### */
.art_slider { list-style: none; padding: var(--padding); overflow-y: hidden; overflow-x: scroll; display: flex; scroll-snap-type: x proximity; scroll-padding: calc(var(--padding) - .6rem); scroll-behavior: smooth; margin-top: 0; } .art_slider .art_box { min-width: 17rem; margin-left: var(--padding); scroll-snap-align: start; } .art_slider_wrapper { position: relative; } .art_slider_wrapper button.art_slider_nav { display: none; } @media (pointer: fine) { .art_slider_wrapper button.art_slider_nav { position: absolute; display: block; left: 0rem; top: 50%; transform: translate(0%, -50%) rotate(180deg); height: 3rem; width: 3rem; padding: 0; border-radius: 50%; background-image: url(/img/artikel_weiter.svg); background-position: center; background-repeat: no-repeat; background-size: 30%; } .art_slider_wrapper button.art_slider_nav.slider_next { left: unset; right: -.5rem; transform: translate(0%, -50%) rotate(0deg); } }
/* ### tabs ### */
[data-tab-inhalt] { display: none; } [data-tab-inhalt].tab-active { display: block; } .tab-nav { display: flex; margin-bottom: var(--padding); flex-direction: column; justify-content: flex-start; gap: .1rem; } .tab-nav > [data-tab] { background-color: var(--theme-card-background); padding: var(--padding); cursor: pointer; min-width: 7rem; text-align: center; border-left: 1px solid var(--theme-light); } .tab-nav > [data-tab]:first-of-type { border-top-left-radius: var(--theme-radius-small); border-left: none; } .tab-nav > [data-tab]:last-of-type { border-top-right-radius: var(--theme-radius-small); } .tab-nav > [data-tab].tab-active { background-color: var(--theme-accent-medium); }
@media (min-width: 768px) { .tab-nav { margin-bottom: 0; flex-direction: row; } }
/* ### meili-extra ### */
#meili-items-divider { margin-top: calc(var(--padding)* 2); text-align: center; font-weight: bold; border-bottom: var(--theme-divider); margin-bottom: var(--padding); font-size: 1.15rem; }
/* ### powermenue-extra ### */
@media (pointer: fine) { .powermenue-head.hidden { opacity: 1; pointer-events: all; } }
@media (min-width: 992px) { .powermenue-head.hidden { opacity: 1; pointer-events: all; } }
/* ### highslide_v2 ### */
.pg-highslide .pg-highslide-content { display: none; } .pg-highslide { cursor: pointer; text-align: center;} .pg-highslide-bg { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, .5); z-index: 200; } #pg-highslide { position: absolute; top: 0; left: 50%; transform: translate(-50%, 1rem); height: 80vh; width: 90vw; overflow: hidden; } #pg-highslide img { max-height: 80vh; } #pg-highslide-close {width: 2rem; height: 2rem; background-color: var(--theme-white); background-image: url(/img/powermenue_close.svg); background-repeat: no-repeat; background-size: 1.5rem; background-position: 50%; border-radius: 2rem; position: absolute; top: .5rem; right: .5rem; cursor: pointer; } .fadeInDownSmall { animation-name: fadeInDownSmall; animation-duration: .3s; } @keyframes fadeInDownSmall { 0% { opacity: 0; transform: translate3d(0,-200px,0); } 100% { opacity: 1; transform: none; } }
@media (min-width: 768px) { #pg-highslide { } }
@media (min-width: 992px) { #pg-highslide { } }