<div class="detail">
<div class="detail__container">
<div class="detail__overview">
<div class="overview">
<div class="overview__container">
<div class="overview__row">
<div class="overview__column">
<div class="overview__column-container" data-information-column>
<div class="overview__title-container">
<h3 class="overview__title" data-title>Helmo Milano Jet Helm VAPENSIERO Helmo Milano Jet Helm VAPENSIERO Helmo Milano Jet Helm VAPENSIERO</h3>
</div>
<div class="overview__price">
<div class="price--large">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">189.90</div>
</div>
</div>
</div>
<div class="price-regular__note">UVP inkl. 7.7% MwSt.</div>
</div>
</div>
</div>
<div class="price--large-secondary">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">115.90</div>
</div>
</div>
</div>
<div class="price-regular__note">Preis exkl. 7.7% MwSt.</div>
</div>
</div>
</div>
</div>
<div class="overview__metadata-container">
<div class="overview__attributes">
<div class="attributes--large-bold">
<ul class="attributes__list">
<li class="attributes__list-item">
<div class="attributes__name">Art.-Nr.</div>
<div class="attributes__value " title="8547625">
8547625
</div>
</li>
<li class="attributes__list-item">
<div class="attributes__name">Marke</div>
<div class="attributes__value has-single-line-ellipsis" title="UYN">
<a class="attributes__attribute-link" href="#" title="UYN">UYN</a>
</div>
</li>
<li class="attributes__list-item">
<div class="attributes__name">Einsatzbereich</div>
<div class="attributes__value has-single-line-ellipsis" title="Outdoor">
<a class="attributes__attribute-link" href="#" title="Outdoor">Outdoor</a>
</div>
</li>
<li class="attributes__list-item">
<div class="attributes__name">Kategorie</div>
<div class="attributes__value has-single-line-ellipsis" title="Schuhe">
<a class="attributes__attribute-link" href="#" title="Schuhe">Schuhe</a>
</div>
</li>
<li class="attributes__list-item">
<div class="attributes__name">Kurzbezeichnung</div>
<div class="attributes__value " title="XM1 run">
XM1 run
</div>
</li>
<li class="attributes__list-item">
<div class="attributes__name">Lager</div>
<div class="attributes__value ">
<div class="stock">
<button type="button" class="stock__toggle--available" data-info-tooltip-content="Verfügbar ab Juli 2020">
<span class="visually-hidden">Verfügbar ab Juli 2020</span>
</button>
</div>
</div>
</li>
<li class="attributes__list-item">
<div class="attributes__name">Radgrösse</div>
<div class="attributes__value " title="26 zoll">
26 zoll
</div>
</li>
<li class="attributes__list-item">
<div class="attributes__name">Farbe</div>
<div class="attributes__value " title="8/97 Hell-Lichtblond Cendré-Mahagoni">
8/97 Hell-Lichtblond Cendré-Mahagoni
</div>
</li>
<li class="attributes__list-item">
<div class="attributes__name">Grösse</div>
<div class="attributes__value " title="60ml">
60ml
</div>
</li>
<li class="attributes__list-item">
<div class="attributes__name">ANZAHL LIST ITEMS</div>
<div class="attributes__value " title="10 Stk">
10 Stk
</div>
</li>
<li class="attributes__list-item">
<div class="attributes__name">Overflow</div>
<div class="attributes__value " title="11 Stk">
11 Stk
</div>
</li>
</ul>
<button type="button" class="button-content-toggle is-hidden" data-show-more-label="mehr anzeigen" data-show-less-label="weniger anzeigen" data-attributes-toggle-button="true">mehr anzeigen</button>
</div>
</div>
</div>
<div class="overview__features" data-features>
<div class="wysiwyg-content">
<ul>
<li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod</li>
<li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod</li>
<li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod</li>
<li>Tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</li>
<li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren</li>
<li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren</li>
<li>Tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</li>
<li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren</li>
<li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren</li>
<li>Tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</li>
<li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren</li>
<li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren</li>
</ul>
</div>
</div>
<button type="button" class="button-content-toggle is-hidden" data-show-more-label="mehr anzeigen" data-show-less-label="weniger anzeigen" data-overview-features-toggle-button="true">mehr anzeigen</button>
</div>
</div>
<div class="overview__column">
<div class="overview__column-container" data-slider-column>
<div class="overview__specials-and-logos">
<div class="overview__specials">
<div class="specials">
<div class="specials--large-horizontally ">
<button type="button" class="specials__toggle" data-info-tooltip-content="Sale" style="background-color: #e30a24;">
<span class="visually-hidden">Sale</span>
<span class="image ">
<picture>
<img src="/example-assets/images/specials/sale.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
</picture>
</span>
</button>
<button type="button" class="specials__toggle" data-info-tooltip-content="New" style="background-color: #333333;">
<span class="visually-hidden">New</span>
<span class="image ">
<picture>
<img src="/example-assets/images/specials/new.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
</picture>
</span>
</button>
<button type="button" class="specials__toggle" data-info-tooltip-content="Bestseller" style="background-color: #ef5800;">
<span class="visually-hidden">Bestseller</span>
<span class="image ">
<picture>
<img src="/example-assets/images/specials/fire.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
</picture>
</span>
</button>
<button type="button" class="specials__toggle" data-info-tooltip-content="Kauftipp" style="background-color: #44a0d9;">
<span class="visually-hidden">Kauftipp</span>
<span class="image ">
<picture>
<img src="/example-assets/images/specials/tip.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
</picture>
</span>
</button>
</div>
</div>
</div>
<div class="overview__logos">
<div class="logos">
<div class="image ">
<picture>
<img src="/example-assets/images/logos/brand-logo.png" class="image__img logos__brand--large is-loading" alt="alt" srcset="/example-assets/images/logos/brand-logo.png 1x, /example-assets/images/logos/brand-logo.png 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
<div class="image ">
<picture>
<img src="/example-assets/images/logos/product-line-logo-square.png" class="image__img logos__productline--large is-loading" alt="alt" srcset="/example-assets/images/logos/product-line-logo-square.png 1x, /example-assets/images/logos/product-line-logo-square.png 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
</div>
</div>
<div class="detail-slider">
<div class="detail-slider__container">
<div class="detail-slider__top-slider">
<div class="swiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/image.jpg" class="image__img detail-slider__top-slider-image is-loading" alt="Test Produkt" srcset="/example-assets/images/detail-slider/image.jpg 1x, /example-assets/images/detail-slider/image.jpg 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
<div class="swiper-slide">
<div class="detail-slider__top-slider-video">
<div class="video-player">
<div class="video-player__thumbnail-container" data-modal-id="video-modal-229700299">
<div class="image ">
<picture>
<img src="https://img.youtube.com/vi/X6OByqtMDIo/maxresdefault.jpg" class="image__img video-player__thumbnail-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
</picture>
</div>
<div class="video-player__thumbnail-play-button"></div>
</div>
</div>
<script type="text/html" class="modal__placeholder" id="video-modal-229700299-placeholder"></script>
</div>
</div>
<div class="swiper-slide">
<div class="detail-slider__top-slider-video">
<div class="video-player">
<div class="video-player__thumbnail-container" data-modal-id="video-modal-1313610279">
<div class="image ">
<picture>
<img src="/example-assets/images/video-player/poster.jpg" class="image__img video-player__thumbnail-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
</picture>
</div>
<div class="video-player__thumbnail-play-button"></div>
</div>
</div>
<script type="text/html" class="modal__placeholder" id="video-modal-1313610279-placeholder"></script>
</div>
</div>
<div class="swiper-slide">
<div class="detail-slider__top-slider-video">
<div class="video-player">
<div class="video-player__thumbnail-container" data-modal-id="video-modal-1719480170">
<div class="image ">
<picture>
<img src="/example-assets/images/video-player/poster.jpg" class="image__img video-player__thumbnail-image is-loading" alt="Test Produkt" onload="this.classList.remove('is-loading')" />
</picture>
</div>
<div class="video-player__thumbnail-play-button"></div>
</div>
</div>
<script type="text/html" class="modal__placeholder" id="video-modal-1719480170-placeholder">
<aside class="modal modal--slide" id="video-modal-1719480170" aria-hidden="true" data-modal>
<div class="modal__overlay" tabindex="-1" data-modal-close data-modal-overlay>
<div class="modal__container--medium" role="dialog" aria-modal="true" aria-labelledby="video-modal-1719480170-title">
<div class="modal__container-inner">
<header class="modal__header">
<h3 class="modal__title" id="video-modal-1719480170-title"></h3>
<div class="modal__close">
<button class="button-icon--icon-regular -icon-close" type="button" name="close" value="close" data-modal-close="">
<span class="visually-hidden"></span>
</button>
</div>
</header>
<main class="modal__content" id="video-modal-1719480170-content">
<div class="video-player">
<span class="visually-hidden">Test Produkt</span>
<p class="visually-hidden">Test Description</p>
<video class="video-player__video" preload="auto" playsinline controls autoplay muted data-config="{'controls':true,'autoplay':true,'muted':true,'loop':{'active':false}}" poster="/example-assets/images/video-player/poster.jpg">
<source src="/example-assets/videos/video-player/video.mp4" type="video/mp4">
</video>
</div>
</main>
</div>
</div>
</div>
</aside>
</script>
</div>
</div>
<div class="swiper-slide">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/image.jpg" class="image__img detail-slider__top-slider-image is-loading" alt="Test Produkt" srcset="/example-assets/images/detail-slider/image.jpg 1x, /example-assets/images/detail-slider/image.jpg 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
<div class="swiper-slide">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/image.jpg" class="image__img detail-slider__top-slider-image is-loading" alt="Test Produkt" srcset="/example-assets/images/detail-slider/image.jpg 1x, /example-assets/images/detail-slider/image.jpg 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
<div class="swiper-slide">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/image.jpg" class="image__img detail-slider__top-slider-image is-loading" alt="Test Produkt" srcset="/example-assets/images/detail-slider/image.jpg 1x, /example-assets/images/detail-slider/image.jpg 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
<div class="swiper-slide">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/image.jpg" class="image__img detail-slider__top-slider-image is-loading" alt="Test Produkt" srcset="/example-assets/images/detail-slider/image.jpg 1x, /example-assets/images/detail-slider/image.jpg 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
<div class="swiper-slide">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/image.jpg" class="image__img detail-slider__top-slider-image is-loading" alt="Test Produkt" srcset="/example-assets/images/detail-slider/image.jpg 1x, /example-assets/images/detail-slider/image.jpg 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
</div>
</div>
<div class="detail-slider__top-slider-next"></div>
<div class="detail-slider__top-slider-prev"></div>
</div>
<div class="detail-slider__bottom-slider">
<div class="swiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="detail-slider__bottom-slider-image-container">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/thumb.png" class="image__img detail-slider__bottom-slider-image is-loading" alt="Test Produkt" srcset="/example-assets/images/detail-slider/thumb.png 1x, /example-assets/images/detail-slider/thumb.png 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="detail-slider__bottom-slider-image-container--video">
<div class="image ">
<picture>
<img src="https://img.youtube.com/vi/X6OByqtMDIo/maxresdefault.jpg" class="image__img detail-slider__bottom-slider-image is-loading" alt="Test Produkt" onload="this.classList.remove('is-loading')" />
</picture>
</div>
<div class="detail-slider__bottom-slider-thumbnail-play-button"></div>
</div>
</div>
<div class="swiper-slide">
<div class="detail-slider__bottom-slider-image-container--video">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/thumb.png" class="image__img detail-slider__bottom-slider-image is-loading" alt="Test Produkt" onload="this.classList.remove('is-loading')" />
</picture>
</div>
<div class="detail-slider__bottom-slider-thumbnail-play-button"></div>
</div>
</div>
<div class="swiper-slide">
<div class="detail-slider__bottom-slider-image-container--video">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/thumb.png" class="image__img detail-slider__bottom-slider-image is-loading" alt="Test Produkt" srcset="/example-assets/images/detail-slider/thumb.png 1x, /example-assets/images/detail-slider/thumb.png 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
<div class="detail-slider__bottom-slider-thumbnail-play-button"></div>
</div>
</div>
<div class="swiper-slide">
<div class="detail-slider__bottom-slider-image-container">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/thumb.png" class="image__img detail-slider__bottom-slider-image is-loading" alt="Test Produkt" srcset="/example-assets/images/detail-slider/thumb.png 1x, /example-assets/images/detail-slider/thumb.png 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="detail-slider__bottom-slider-image-container">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/thumb.png" class="image__img detail-slider__bottom-slider-image is-loading" alt="Test Produkt" srcset="/example-assets/images/detail-slider/thumb.png 1x, /example-assets/images/detail-slider/thumb.png 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="detail-slider__bottom-slider-image-container">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/thumb.png" class="image__img detail-slider__bottom-slider-image is-loading" alt="Test Produkt" srcset="/example-assets/images/detail-slider/thumb.png 1x, /example-assets/images/detail-slider/thumb.png 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="detail-slider__bottom-slider-image-container">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/thumb.png" class="image__img detail-slider__bottom-slider-image is-loading" alt="Test Produkt" srcset="/example-assets/images/detail-slider/thumb.png 1x, /example-assets/images/detail-slider/thumb.png 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
</div>
<div class="swiper-slide">
<div class="detail-slider__bottom-slider-image-container">
<div class="image ">
<picture>
<img src="/example-assets/images/detail-slider/thumb.png" class="image__img detail-slider__bottom-slider-image is-loading" alt="Test Produkt" srcset="/example-assets/images/detail-slider/thumb.png 1x, /example-assets/images/detail-slider/thumb.png 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
</div>
</div>
</div>
<div class="detail-slider__bottom-slider-next"></div>
<div class="detail-slider__bottom-slider-prev"></div>
</div>
<div class="detail-slider__meta--videos-and-images">
<div class="detail-slider__meta-left">6 Bilder</div>
<div class="detail-slider__meta-right">3 Videos</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script type="application/ld+json"></script>
</div>
</div>
<div class="detail-tabs">
<div class="detail-tabs__navigation">
<div class="detail-tabs__navigation-container">
<div class="swiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="detail-tabs__tab-navigation-container">
<button type="button" class="detail-tabs__tab-navigation-button" data-sticky-border="false">
Varianten
<span class="counter-bubble" data-counter="10"></span> </button>
</div>
</div>
<div class="swiper-slide">
<div class="detail-tabs__tab-navigation-container">
<button type="button" class="detail-tabs__tab-navigation-button" data-sticky-border="true">
Spezifikationen
</button>
</div>
</div>
<div class="swiper-slide">
<div class="detail-tabs__tab-navigation-container">
<button type="button" class="detail-tabs__tab-navigation-button" data-sticky-border="true">
Explosionszeichnung
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="detail-tabs__content">
<div class="detail-tabs__tab-content--no-border is-active">
<div class="variants-table">
<div class="variants-table__container">
<div class="responsive-table--first-column-mobile-full-height -spacing-large">
<div class="table-search" data-offset="detail-tabs">
<div class="table-search__container">
<div class="text-field--light text-field-search--light is-initialized" data-disable-text-field-js>
<div class="text-field__wrapper text-field-search__wrapper">
<input class="text-field__input text-field-search__input" id="variants-table-search" type="text" name="variants-table-search" required data-responsive-table-search="true" placeholder="Suche" />
<label class="visually-hidden" for="variants-table-search">Suche</label>
<button type="reset" class="text-field-search__reset"></button>
<button type="submit" class="text-field-search__search"></button>
<div class="text-field-search__loader ">
<div class="loading-spinner -vertical -horizontal">
<div class="loading-spinner__spinner--small"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="responsive-table__container--auto-scrollbar">
<table class="responsive-table__table" data-responsive-table-filter-context>
<colgroup>
<col style="72px">
<col style="">
<col style="">
<col style="">
<col style="">
<col style="">
<col style="">
<col style="">
<col style="144px">
</colgroup>
<thead>
<tr class="responsive-table__tr">
<th class="responsive-table__th">
</th>
<th class="responsive-table__th is-centered">
Lager
</th>
<th class="responsive-table__th">
Lief.-Art.-Nr.
</th>
<th class="responsive-table__th">
Flex Column A
</th>
<th class="responsive-table__th">
Flex Column B
</th>
<th class="responsive-table__th">
Flex Column C
</th>
<th class="responsive-table__th">
UVP
</th>
<th class="responsive-table__th">
Preis
</th>
<th class="responsive-table__th">
</th>
</tr>
</thead>
<tbody>
<tr class="responsive-table__tr">
<td class="responsive-table__td is-top-aligned">
<div class="responsive-table__td-inner-container">
<div class="image ">
<picture>
<img src="/example-assets/images/responsive-table/thumb.png" class="image__img image-cell__image is-loading" alt="Alt" title="Title" srcset="/example-assets/images/responsive-table/thumb.png 1x, /example-assets/images/responsive-table/thumb.png 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
<div class="image-cell__specials">
<div class="specials">
<div class="specials--medium-horizontally-vertically ">
<button type="button" class="specials__toggle" data-info-tooltip-content="Sale" style="background-color: #e30a24;">
<span class="visually-hidden">Sale</span>
<span class="image ">
<picture>
<img src="/example-assets/images/specials/sale.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
</picture>
</span>
</button>
<button type="button" class="specials__toggle" data-info-tooltip-content="New" style="background-color: #333333;">
<span class="visually-hidden">New</span>
<span class="image ">
<picture>
<img src="/example-assets/images/specials/new.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
</picture>
</span>
</button>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td is-centered">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Lager</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="stock">
<button type="button" class="stock__toggle--available" data-info-tooltip-content="Verfügbar">
<span class="visually-hidden">Verfügbar</span>
</button>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Lief.-Art.-Nr.</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="wysiwyg-content">
<a href="#">10.80344</a>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Flex Column A</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="wysiwyg-content">
<p>93929695SC</p>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Flex Column B</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="wysiwyg-content">
<p>rot</p>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Flex Column C</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="wysiwyg-content">
<p>50 mm</p>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">UVP</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="price--small">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">24.90</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Preis</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="price--small">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">13.50</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td is-right-aligned">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title"></div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<form class="wishlist-cart-actions">
<div class="wishlist-cart-actions__quantity-wrapper">
<div class="quantity-switcher--light">
<button type="button" class="quantity-switcher__minus">
<span class="quantity-switcher__minus-content">–</span>
</button>
<input class="quantity-switcher__quantity" type="number" id="quantity-1870649272" min="1" max="99" name="qty" value="5" required />
<label class="visually-hidden" for="quantity-1870649272">Quantity</label>
<input type="hidden" name="productId" value="abcdefghijk-123" />
<button type="button" class="quantity-switcher__plus">
<span class="quantity-switcher__plus-content">+</span>
</button>
</div>
</div>
<div class="wishlist-cart-actions__button-add-to-cart-wrapper">
<button class="button--primary" name="add-to-cart-submit" type="submit"> <span class="wishlist-cart-actions__button">
<span class="visually-hidden">In den Warenkorb</span>
<span class="wishlist-cart-actions__button-icon"></span>
</span>
</button>
</div>
<div class="wishlist-cart-actions__button-add-to-wishlist-wrapper">
<button type="submit" name="add-to-wishlist-submit" class="wishlist-cart-actions__button-add-to-wishlist" data-add-to-wishlist>
<span class="visually-hidden">Zur Merklist hinzufügen</span>
</button>
</div>
</form>
</div>
</div>
</div>
</td>
</tr>
<tr class="responsive-table__tr">
<td class="responsive-table__td is-top-aligned">
<div class="responsive-table__td-inner-container">
<div class="image ">
<picture>
<img src="/example-assets/images/responsive-table/thumb.png" class="image__img image-cell__image is-loading" alt="Alt" title="Title" srcset="/example-assets/images/responsive-table/thumb.png 1x, /example-assets/images/responsive-table/thumb.png 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
<div class="image-cell__specials">
<div class="specials">
<div class="specials--medium-horizontally-vertically ">
<button type="button" class="specials__toggle" data-info-tooltip-content="Sale" style="background-color: #e30a24;">
<span class="visually-hidden">Sale</span>
<span class="image ">
<picture>
<img src="/example-assets/images/specials/sale.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
</picture>
</span>
</button>
<button type="button" class="specials__toggle" data-info-tooltip-content="New" style="background-color: #333333;">
<span class="visually-hidden">New</span>
<span class="image ">
<picture>
<img src="/example-assets/images/specials/new.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
</picture>
</span>
</button>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td is-centered">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Lager</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="stock">
<button type="button" class="stock__toggle--available" data-info-tooltip-content="Verfügbar">
<span class="visually-hidden">Verfügbar</span>
</button>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Lief.-Art.-Nr.</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="wysiwyg-content">
<a href="#">10.80344</a>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Flex Column A</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="wysiwyg-content">
<p>93929695SC</p>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Flex Column B</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="wysiwyg-content">
<p>rot</p>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Flex Column C</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="wysiwyg-content">
<p>50 mm</p>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">UVP</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="price--small">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">24.90</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Preis</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="price--small">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">13.50</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td is-right-aligned">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title"></div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<form class="wishlist-cart-actions">
<div class="wishlist-cart-actions__quantity-wrapper">
<div class="quantity-switcher--light">
<button type="button" class="quantity-switcher__minus">
<span class="quantity-switcher__minus-content">–</span>
</button>
<input class="quantity-switcher__quantity" type="number" id="quantity-1227967491" min="1" max="99" name="qty" value="5" required />
<label class="visually-hidden" for="quantity-1227967491">Quantity</label>
<input type="hidden" name="productId" value="abcdefghijk-123" />
<button type="button" class="quantity-switcher__plus">
<span class="quantity-switcher__plus-content">+</span>
</button>
</div>
</div>
<div class="wishlist-cart-actions__button-add-to-cart-wrapper">
<button class="button--primary" name="add-to-cart-submit" type="submit"> <span class="wishlist-cart-actions__button">
<span class="visually-hidden">In den Warenkorb</span>
<span class="wishlist-cart-actions__button-icon"></span>
</span>
</button>
</div>
<div class="wishlist-cart-actions__button-add-to-wishlist-wrapper">
<button type="submit" name="add-to-wishlist-submit" class="wishlist-cart-actions__button-add-to-wishlist" data-add-to-wishlist>
<span class="visually-hidden">Zur Merklist hinzufügen</span>
</button>
</div>
</form>
</div>
</div>
</div>
</td>
</tr>
<tr class="responsive-table__tr">
<td class="responsive-table__td is-top-aligned">
<div class="responsive-table__td-inner-container">
<div class="image ">
<picture>
<img src="/example-assets/images/responsive-table/thumb.png" class="image__img image-cell__image is-loading" alt="Alt" title="Title" srcset="/example-assets/images/responsive-table/thumb.png 1x, /example-assets/images/responsive-table/thumb.png 2x" onload="this.classList.remove('is-loading')" />
</picture>
</div>
<div class="image-cell__specials">
<div class="specials">
<div class="specials--medium-horizontally-vertically ">
<button type="button" class="specials__toggle" data-info-tooltip-content="Sale" style="background-color: #e30a24;">
<span class="visually-hidden">Sale</span>
<span class="image ">
<picture>
<img src="/example-assets/images/specials/sale.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
</picture>
</span>
</button>
<button type="button" class="specials__toggle" data-info-tooltip-content="New" style="background-color: #333333;">
<span class="visually-hidden">New</span>
<span class="image ">
<picture>
<img src="/example-assets/images/specials/new.svg" class="image__img specials__toggle-image is-loading" alt="" onload="this.classList.remove('is-loading')" />
</picture>
</span>
</button>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td is-centered">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Lager</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="stock">
<button type="button" class="stock__toggle--available" data-info-tooltip-content="Verfügbar">
<span class="visually-hidden">Verfügbar</span>
</button>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Lief.-Art.-Nr.</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="wysiwyg-content">
<a href="#">10.80344</a>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Flex Column A</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="wysiwyg-content">
<p>93929695SC</p>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Flex Column B</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="wysiwyg-content">
<p>rot</p>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Flex Column C</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="wysiwyg-content">
<p>50 mm</p>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">UVP</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="price--small">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">24.90</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title">Preis</div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<div class="price--small">
<div class="price__row">
<div class="price__column--regular-price">
<div class="price-regular">
<div class="price-regular__current">
<div class="price-regular__current-price-inner">
<div class="price-regular__current-currency">CHF</div>
</div>
<div class="price-regular__current-price-inner">
<div class="price-regular__current-value">13.50</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</td>
<td class="responsive-table__td is-right-aligned">
<div class="responsive-table__mobile-container">
<div class="responsive-table__mobile-column">
<div class="responsive-table__mobile-column-title"></div>
</div>
<div class="responsive-table__mobile-column">
<div class="responsive-table__td-inner-container">
<form class="wishlist-cart-actions">
<div class="wishlist-cart-actions__quantity-wrapper">
<div class="quantity-switcher--light">
<button type="button" class="quantity-switcher__minus">
<span class="quantity-switcher__minus-content">–</span>
</button>
<input class="quantity-switcher__quantity" type="number" id="quantity-1281409144" min="1" max="99" name="qty" value="5" required />
<label class="visually-hidden" for="quantity-1281409144">Quantity</label>
<input type="hidden" name="productId" value="abcdefghijk-123" />
<button type="button" class="quantity-switcher__plus">
<span class="quantity-switcher__plus-content">+</span>
</button>
</div>
</div>
<div class="wishlist-cart-actions__button-add-to-cart-wrapper">
<button class="button--primary" name="add-to-cart-submit" type="submit"> <span class="wishlist-cart-actions__button">
<span class="visually-hidden">In den Warenkorb</span>
<span class="wishlist-cart-actions__button-icon"></span>
</span>
</button>
</div>
<div class="wishlist-cart-actions__button-add-to-wishlist-wrapper">
<button type="submit" name="add-to-wishlist-submit" class="wishlist-cart-actions__button-add-to-wishlist" data-add-to-wishlist>
<span class="visually-hidden">Zur Merklist hinzufügen</span>
</button>
</div>
</form>
</div>
</div>
</div>
</td>
</tr>
<tr class="responsive-table__tr" data-responsive-table-filter-no-match hidden>
<td class="responsive-table__td" colspan="9">
<div class="wysiwyg-content">
<p class="responsive-table__no-match">Keine Ergebnisse gefunden</p>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="detail-tabs__tab-content">
<div class="attributes-table">
<div class="attributes-table__column">
<div class="attributes-table__column-title">Allgemeine Informationen</div>
<div class="attributes-table__attributes-list">
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Marke</div>
<div class="attributes-table__value">
<a href="#" class="attributes-table__value-link">UYN</a>
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Einsatzbereich</div>
<div class="attributes-table__value">
<a href="#" class="attributes-table__value-link">Outdoor</a>
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Kategorie</div>
<div class="attributes-table__value">
<a href="#" class="attributes-table__value-link">Schuhe</a>
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Kategorie</div>
<div class="attributes-table__value">
<div class="links">
<ul class="links__list">
<li class="links__list-item">
<a class="links__link--pdf" href="#" target="_blank" rel="noopener noreferrer">Infobroschüre (2,3 MB)</a>
</li>
<li class="links__list-item">
<a class="links__link--excel" href="#" target="_blank" rel="noopener noreferrer">Produktelist (1,3 MB)</a>
</li>
<li class="links__list-item">
<a class="links__link--powerpoint" href="#" target="_blank" rel="noopener noreferrer">Wella Präsentation (1,3 MB)</a>
</li>
<li class="links__list-item">
<a class="links__link--word" href="#" target="_blank" rel="noopener noreferrer">Farben & Anwendung (4,3 MB)</a>
</li>
<li class="links__list-item">
<a class="links__link--open-office" href="#" target="_blank" rel="noopener noreferrer">Farben & Anwendung (4,3 MB)</a>
</li>
<li class="links__list-item">
<a class="links__link--internal" href="#" target="_blank" rel="noopener noreferrer">Step-by-Step Anleitung</a>
</li>
<li class="links__list-item">
<a class="links__link--external" href="#" target="_blank" rel="noopener noreferrer">Wella Herstellerseite</a>
</li>
</ul>
</div>
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Umpack bei</div>
<div class="attributes-table__value">
<div class="attributes-table__value-separated">
<div class="attributes-table__value-description">20 Stück</div>
<div class="attributes-table__value-tooltip">
<button type="button" class="info-tooltip__toggle--small" data-info-tooltip-content="Das Umpack bezeichnet eine Zusammenfassung von gleichen Artikeln zu einer gut zu lagernden Verpackungseinheit. In diesem Fall 20 Stück oder ein Vielfaches davon.">
<span class="visually-hidden">Information</span>
</button>
</div>
</div>
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">minimumOrderQuantity</div>
<div class="attributes-table__value">
8547625
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Farbe</div>
<div class="attributes-table__value">
8/97 Hell-Lichtblond Cendré-Mahagoni
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Grösse</div>
<div class="attributes-table__value">
60ml
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Inhalt</div>
<div class="attributes-table__value">
2 Stk
</div>
</div>
</div>
</div>
<div class="attributes-table__column">
<div class="attributes-table__column-title">Produktinformationen</div>
<div class="attributes-table__attributes-list">
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Marke</div>
<div class="attributes-table__value">
<a href="#" class="attributes-table__value-link">UYN</a>
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Einsatzbereich</div>
<div class="attributes-table__value">
<a href="#" class="attributes-table__value-link">Outdoor</a>
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Kategorie</div>
<div class="attributes-table__value">
<a href="#" class="attributes-table__value-link">Schuhe</a>
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Artikelnr.</div>
<div class="attributes-table__value">
8547625
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Farbe</div>
<div class="attributes-table__value">
8/97 Hell-Lichtblond Cendré-Mahagoni
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Grösse</div>
<div class="attributes-table__value">
60ml
</div>
</div>
<div class="attributes-table__attributes-list-item">
<div class="attributes-table__key">Inhalt</div>
<div class="attributes-table__value">
2 Stk
</div>
</div>
</div>
</div>
</div>
<div class="description">
<div class="description__container">
<h4 class="description__title">Produktbeschreibung</h4>
<div class="description__content">
<div class="wysiwyg-content">
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
</div>
</div>
</div>
</div>
</div>
<div class="detail-tabs__tab-content">
<div class="explosion-drawing">
<div class="image ">
<picture class="taggd">
<img src="/example-assets/images/explosion-drawing/explosion-drawing.png" class="image__img image-tooltip-map__img is-loading" alt="explosion-drawing" title="explosion-drawing" srcset="/example-assets/images/explosion-drawing/explosion-drawing.png 1x, /example-assets/images/explosion-drawing/explosion-drawing.png 2x" data-tooltip-info=[{"top":15,"left":72.8,"data":[{"name":"Sprung-sicherung","value":"http://www.fuchs-movesa.ch"}]}] onload="this.classList.remove('is-loading')" />
</picture>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% include '@SharedComponents/modules/b2b-product-detail/templates/detail/detail.twig' %}
{
"productOverview": {
"headingLevel": "3",
"title": "Helmo Milano Jet Helm VAPENSIERO Helmo Milano Jet Helm VAPENSIERO Helmo Milano Jet Helm VAPENSIERO",
"features": {
"value": "<ul><li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod</li><li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod</li><li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod</li><li>Tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</li><li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren</li><li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren</li><li>Tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</li><li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren</li><li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren</li><li>Tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</li><li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren</li><li>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren</li></ul>",
"toggle": {
"more": "mehr anzeigen",
"less": "weniger anzeigen"
}
},
"attributes": {
"variant": "large-bold",
"labels": {
"more": "mehr anzeigen",
"less": "weniger anzeigen"
},
"attributes": [
{
"type": "text",
"name": "Art.-Nr.",
"value": "8547625"
},
{
"type": "link",
"name": "Marke",
"value": "UYN",
"href": "#"
},
{
"type": "link",
"name": "Einsatzbereich",
"value": "Outdoor",
"href": "#"
},
{
"type": "link",
"name": "Kategorie",
"value": "Schuhe",
"href": "#"
},
{
"type": "text",
"name": "Kurzbezeichnung",
"value": "XM1 run"
},
{
"type": "stock",
"name": "Lager",
"status": "available",
"tooltip": "Verfügbar ab Juli 2020"
},
{
"type": "text",
"name": "Radgrösse",
"value": "26 zoll"
},
{
"type": "text",
"name": "Farbe",
"value": "8/97 Hell-Lichtblond Cendré-Mahagoni"
},
{
"type": "text",
"name": "Grösse",
"value": "60ml"
},
{
"type": "text",
"name": "ANZAHL LIST ITEMS",
"value": "10 Stk"
},
{
"type": "text",
"name": "Overflow",
"value": "11 Stk"
}
]
},
"icons": [
{
"value": "Beheizbar",
"image": {
"src": "/example-assets/images/icons/icon1.png",
"alt": "Beheizbar"
}
},
{
"value": "Super soft",
"image": {
"src": "/example-assets/images/icons/icon2.png",
"alt": "Super soft"
}
},
{
"value": "Etwas ganz besonderes",
"image": {
"src": "/example-assets/images/icons/icon3.png",
"alt": "Etwas ganz besonderes"
}
},
{
"value": "Waterproof",
"image": {
"src": "/example-assets/images/icons/icon4.png",
"alt": "Waterproof"
}
},
{
"value": "Stretch",
"image": {
"src": "/example-assets/images/icons/icon5.png",
"alt": "Stretch"
}
},
{
"value": "Beheizbar",
"image": {
"src": "/example-assets/images/icons/icon1.png",
"alt": "Beheizbar"
}
},
{
"value": "Beheizbar",
"image": {
"src": "/example-assets/images/icons/icon1.png",
"alt": "Beheizbar"
}
},
{
"value": "Super soft",
"image": {
"src": "/example-assets/images/icons/icon2.png",
"alt": "Super soft"
}
},
{
"value": "Etwas ganz besonderes",
"image": {
"src": "/example-assets/images/icons/icon3.png",
"alt": "Etwas ganz besonderes"
}
},
{
"value": "Waterproof",
"image": {
"src": "/example-assets/images/icons/icon4.png",
"alt": "Waterproof"
}
},
{
"value": "Stretch",
"image": {
"src": "/example-assets/images/icons/icon5.png",
"alt": "Stretch"
}
},
{
"value": "Beheizbar",
"image": {
"src": "/example-assets/images/icons/icon1.png",
"alt": "Beheizbar"
}
}
],
"price": {
"variant": "large",
"labels": {
"from": "ab",
"instead": "statt"
},
"price": {
"currency": "CHF",
"price": "189.90",
"note": "UVP inkl. 7.7% MwSt."
}
},
"livePrice": {
"variant": "large-secondary",
"labels": {
"from": "ab",
"instead": "statt"
},
"price": {
"currency": "CHF",
"price": "115.90",
"note": "Preis exkl. 7.7% MwSt."
}
},
"slider": {
"labels": {
"amountOfImages": "6 Bilder",
"amountOfVideos": "3 Videos"
},
"items": [
{
"thumbnail": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/thumb.png",
"src2x": "/example-assets/images/detail-slider/thumb.png"
},
"image": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/image.jpg",
"src2x": "/example-assets/images/detail-slider/image.jpg"
}
},
{
"thumbnail": {
"alt": "Test Produkt",
"src": "https://img.youtube.com/vi/X6OByqtMDIo/maxresdefault.jpg"
},
"youtube": {
"id": "X6OByqtMDIo",
"poster": "https://img.youtube.com/vi/X6OByqtMDIo/maxresdefault.jpg",
"autoplay": false,
"overlay": true
}
},
{
"thumbnail": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/thumb.png"
},
"vimeo": {
"id": "229479141",
"poster": "/example-assets/images/video-player/poster.jpg",
"autoplay": false,
"overlay": true
}
},
{
"thumbnail": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/thumb.png",
"src2x": "/example-assets/images/detail-slider/thumb.png"
},
"video": {
"title": "Test Produkt",
"description": "Test Description",
"mp4": "/example-assets/videos/video-player/video.mp4",
"poster": "/example-assets/images/video-player/poster.jpg",
"autoplay": false,
"overlay": true
}
},
{
"thumbnail": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/thumb.png",
"src2x": "/example-assets/images/detail-slider/thumb.png"
},
"image": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/image.jpg",
"src2x": "/example-assets/images/detail-slider/image.jpg"
}
},
{
"thumbnail": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/thumb.png",
"src2x": "/example-assets/images/detail-slider/thumb.png"
},
"image": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/image.jpg",
"src2x": "/example-assets/images/detail-slider/image.jpg"
}
},
{
"thumbnail": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/thumb.png",
"src2x": "/example-assets/images/detail-slider/thumb.png"
},
"image": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/image.jpg",
"src2x": "/example-assets/images/detail-slider/image.jpg"
}
},
{
"thumbnail": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/thumb.png",
"src2x": "/example-assets/images/detail-slider/thumb.png"
},
"image": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/image.jpg",
"src2x": "/example-assets/images/detail-slider/image.jpg"
}
},
{
"thumbnail": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/thumb.png",
"src2x": "/example-assets/images/detail-slider/thumb.png"
},
"image": {
"alt": "Test Produkt",
"src": "/example-assets/images/detail-slider/image.jpg",
"src2x": "/example-assets/images/detail-slider/image.jpg"
}
}
]
},
"logos": {
"size": "large",
"logos": {
"brand": {
"alt": "alt",
"src": "/example-assets/images/logos/brand-logo.png",
"src2x": "/example-assets/images/logos/brand-logo.png"
},
"productLine": {
"alt": "alt",
"src": "/example-assets/images/logos/product-line-logo-square.png",
"src2x": "/example-assets/images/logos/product-line-logo-square.png"
}
}
},
"specials": {
"variant": "large-horizontally",
"items": [
{
"value": "Sale",
"color": "#e30a24",
"icon": "/example-assets/images/specials/sale.svg"
},
{
"value": "New",
"color": "#333333",
"icon": "/example-assets/images/specials/new.svg"
},
{
"value": "Bestseller",
"color": "#ef5800",
"icon": "/example-assets/images/specials/fire.svg"
},
{
"value": "Kauftipp",
"color": "#44a0d9",
"icon": "/example-assets/images/specials/tip.svg"
}
]
}
},
"productDetailTabs": {
"include": "...detail-tabs--default"
}
}
import './detail.scss';
@import "~shared/base";
@import "~cando-cx-components-library/components/modules/b2b-product-detail/templates/detail/detail";
No notes defined.