<div class="page-product-bundle">
    <div class="page-wrapper">
        <!-- TrustBox script -->
        <script type="text/javascript" src="//widget.trustpilot.com/bootstrap/v5/tp.widget.bootstrap.min.js" async></script>
        <!-- End TrustBox script -->
        <header class="header">
            <div class="header__wrapper">
                <div class="container">
                    <div class="header__top">
                        <div class="header__top--logo">
                            <a class="logo " href="#" aria-label="Homepage">
                                <img class="logo__image " src="/images/logo/logo.svg" alt="Alpaca Logo">
                            </a>

                        </div>
                        <div class="header__top--header-buttons">
                            <div class="header__trustpilot desktop">
                                <div class="trustpilot-header">

                                    <!-- TrustBox widget - Micro Star -->
                                    <div class="trustpilot-widget" data-locale="nl-NL" data-template-id="5419b732fbfb950b10de65e5" data-businessunit-id="4d6fd8cf00006400050edf3a" data-style-height="24px" data-style-width="100%" data-theme="dark" data-font-family="Lato">
                                        <a href="https://nl.trustpilot.com/review/vechtsportonline.nl" target="_blank" rel="noopener">Trustpilot</a>
                                    </div>
                                    <!-- End TrustBox widget -->
                                </div>

                            </div>
                            <a class="keurmerk" href="#" aria-label="Thuiswinkel Waarborg">
                                <img class="keurmerk__image" src="/images/logo/waarborg.png" alt="Thuiswinkel Waarborg" width="95" height="30" />
                            </a>

                            <a class="header-button button--gray phonenumber" href="#" aria-label="Phone number">
                                <svg class="icon button__icon" role="img">
                                    <title>Phone</title>
                                    <use xlink:href="/images/icons-sprite.svg#custom-tel"></use>
                                </svg>

                                <span class="header-button__text">
                                    Contact
                                </span>
                            </a>
                            <a class="header-button button--gray customer-account" href="#" aria-label="Customer Account">
                                <svg class="icon button__icon" role="img">
                                    <title>User&#x27;s account</title>
                                    <use xlink:href="/images/icons-sprite.svg#custom-acc"></use>
                                </svg>

                                <span class="header-button__text">
                                    Account
                                </span>
                            </a>

                            <div class="language-switch">
                                <button class="header-button button--white language-switch__link popup-trigger" data-popuptrigger="popup-language-switch" aria-label="vechtsportonline.nl">
                                    NL
                                    <svg class="icon icon button__icon" role="img">
                                        <title>angle down</title>
                                        <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                    </svg>

                                </button>
                                <dialog class="js--popup language-switch__dialog" data-popup="popup-language-switch" role="alertdialog">
                                    <a class="language-switch__dialog--link" href="fightsportonline.com" aria-label="fightsportonline.com">
                                        ENG
                                    </a>
                                    <a class="language-switch__dialog--link" href="kampfsportonline.de" aria-label="kampfsportonline.de">
                                        DE
                                    </a>
                                </dialog>
                            </div>

                            <div class="minicart">
                                <button class="header-button button--minicart minicart__link popup-trigger" data-popuptrigger="popup-minicart" aria-label="">
                                    <svg class="icon button__icon" role="img">
                                        <title>custom cart</title>
                                        <use xlink:href="/images/icons-sprite.svg#custom-cart"></use>
                                    </svg>

                                    <span class="counter qty minicart__counter">
                                        <span class="counter-number minicart__counter--qty">
                                            10
                                        </span>
                                    </span>
                                </button>
                            </div>

                        </div>
                    </div>

                    <div class="header__bottom">
                        <div class="side-menu ">
                            <button type="button" class="side-menu__trigger" aria-label="Side menu open">
                                <svg class="icon side-menu__trigger-icon" role="img">
                                    <title>Mobile menu</title>
                                    <use xlink:href="/images/icons-sprite.svg#mobile-menu"></use>
                                </svg>

                            </button>

                            <span class="side-menu__trigger-text">
                                Categorieën
                            </span>

                            <div class="side-menu__content">
                                <div class="side-menu__trigger-wrapper">
                                    <button type="button" class="side-menu__trigger" aria-label="Side menu close">
                                        <svg class="icon side-menu__trigger-icon" role="img">
                                            <title>Close</title>
                                            <use xlink:href="/images/icons-sprite.svg#close"></use>
                                        </svg>

                                        <span class="header-button__text">
                                            Menu
                                        </span>
                                    </button>
                                </div>

                                <div id="dropdown-side-menu" class="dropdown-list side-menu__dropdown">
                                    <ul class="dropdown-list__list">
                                        <li class="
                    dropdown-list__item
                ">
                                            <a class="dropdown-list__label " href="#">
                                                All

                                            </a>

                                        </li>
                                        <li class="
                    dropdown-list__item
                        dropdown-list__item--collapse
                ">
                                            <button class="dropdown-list__label " aria-expanded="false" aria-controls="dropdown-1">
                                                dropdown title

                                                <svg class="icon dropdown-list__icon" aria-hidden="true" role="img">
                                                    <title>Arrow Down</title>
                                                    <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                                </svg>

                                            </button>

                                            <div id="dropdown-1" class="dropdown-list__content " aria-hidden="true">
                                                <div id="" class="dropdown-list dropdown-list--inner">
                                                    <ul class="dropdown-list__list">
                                                        <li class="
                    dropdown-list__item
                        dropdown-list__item--collapse
                ">
                                                            <a class="dropdown-list__label " href="#" aria-expanded="false" aria-controls="dropdown-1-1">
                                                                Item name

                                                                <svg class="icon dropdown-list__icon" aria-hidden="true" role="img">
                                                                    <title>Arrow Down</title>
                                                                    <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                                                </svg>

                                                            </a>

                                                            <div id="dropdown-1-1" class="dropdown-list__content " aria-hidden="true">
                                                                <div id="" class="dropdown-list dropdown-list--inner">
                                                                    <ul class="dropdown-list__list">
                                                                        <li class="
                    dropdown-list__item
                        dropdown-list__item--collapse
                ">
                                                                            <a class="dropdown-list__label " href="#" aria-expanded="false" aria-controls="dropdown-1-2">
                                                                                sublist item name

                                                                                <svg class="icon dropdown-list__icon" aria-hidden="true" role="img">
                                                                                    <title>Arrow Down</title>
                                                                                    <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                                                                </svg>

                                                                            </a>

                                                                            <div id="dropdown-1-2" class="dropdown-list__content " aria-hidden="true">
                                                                                <div id="" class="dropdown-list dropdown-list--inner">
                                                                                    <ul class="dropdown-list__list">
                                                                                        <li class="
                    dropdown-list__item
                ">
                                                                                            <a class="dropdown-list__label " href="#">
                                                                                                sub sublist item name

                                                                                            </a>

                                                                                        </li>
                                                                                        <li class="
                    dropdown-list__item
                ">
                                                                                            <a class="dropdown-list__label " href="#">
                                                                                                sub sublist item name

                                                                                            </a>

                                                                                        </li>
                                                                                    </ul>
                                                                                </div>

                                                                            </div>
                                                                        </li>
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                    </ul>
                                                                </div>

                                                            </div>
                                                        </li>
                                                        <li class="
                    dropdown-list__item
                        dropdown-list__item--collapse
                ">
                                                            <a class="dropdown-list__label " href="#" aria-expanded="false" aria-controls="dropdown-2-2">
                                                                Item name

                                                                <svg class="icon dropdown-list__icon" aria-hidden="true" role="img">
                                                                    <title>Arrow Down</title>
                                                                    <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                                                </svg>

                                                            </a>

                                                            <div id="dropdown-2-2" class="dropdown-list__content " aria-hidden="true">
                                                                <div id="" class="dropdown-list dropdown-list--inner">
                                                                    <ul class="dropdown-list__list">
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                    </ul>
                                                                </div>

                                                            </div>
                                                        </li>
                                                        <li class="
                    dropdown-list__item
                ">
                                                            <a class="dropdown-list__label " href="#">
                                                                Item name

                                                            </a>

                                                        </li>
                                                        <li class="
                    dropdown-list__item
                ">
                                                            <a class="dropdown-list__label " href="#">
                                                                Item name

                                                            </a>

                                                        </li>
                                                    </ul>
                                                </div>

                                            </div>
                                        </li>
                                        <li class="
                    dropdown-list__item
                        dropdown-list__item--collapse
                ">
                                            <a class="dropdown-list__label " href="#" aria-expanded="false" aria-controls="dropdown-2">
                                                dropdown title

                                                <svg class="icon dropdown-list__icon" aria-hidden="true" role="img">
                                                    <title>Arrow Down</title>
                                                    <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                                </svg>

                                            </a>

                                            <div id="dropdown-2" class="dropdown-list__content " aria-hidden="true">
                                                <div id="" class="dropdown-list dropdown-list--inner">
                                                    <ul class="dropdown-list__list">
                                                        <li class="
                    dropdown-list__item
                ">
                                                            <a class="dropdown-list__label " href="#">
                                                                Item name

                                                            </a>

                                                        </li>
                                                        <li class="
                    dropdown-list__item
                ">
                                                            <a class="dropdown-list__label " href="#">
                                                                Item name

                                                            </a>

                                                        </li>
                                                    </ul>
                                                </div>

                                            </div>
                                        </li>
                                        <li class="
                    dropdown-list__item
                        dropdown-list__item--collapse
                ">
                                            <a class="dropdown-list__label " href="#" aria-expanded="false" aria-controls="dropdown-3">
                                                dropdown title

                                                <svg class="icon dropdown-list__icon" aria-hidden="true" role="img">
                                                    <title>Arrow Down</title>
                                                    <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                                </svg>

                                            </a>

                                            <div id="dropdown-3" class="dropdown-list__content " aria-hidden="true">
                                                <div id="" class="dropdown-list dropdown-list--inner">
                                                    <ul class="dropdown-list__list">
                                                        <li class="
                    dropdown-list__item
                        dropdown-list__item--collapse
                ">
                                                            <a class="dropdown-list__label " href="#" aria-expanded="false" aria-controls="dropdown-3-1">
                                                                Item name

                                                                <svg class="icon dropdown-list__icon" aria-hidden="true" role="img">
                                                                    <title>Arrow Down</title>
                                                                    <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                                                </svg>

                                                            </a>

                                                            <div id="dropdown-3-1" class="dropdown-list__content " aria-hidden="true">
                                                                <div id="" class="dropdown-list dropdown-list--inner">
                                                                    <ul class="dropdown-list__list">
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                    </ul>
                                                                </div>

                                                            </div>
                                                        </li>
                                                        <li class="
                    dropdown-list__item
                ">
                                                            <a class="dropdown-list__label " href="#">
                                                                Item name

                                                            </a>

                                                        </li>
                                                        <li class="
                    dropdown-list__item
                        dropdown-list__item--collapse
                ">
                                                            <a class="dropdown-list__label " href="#" aria-expanded="false" aria-controls="dropdown-3-2">
                                                                Item name

                                                                <svg class="icon dropdown-list__icon" aria-hidden="true" role="img">
                                                                    <title>Arrow Down</title>
                                                                    <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                                                </svg>

                                                            </a>

                                                            <div id="dropdown-3-2" class="dropdown-list__content " aria-hidden="true">
                                                                <div id="" class="dropdown-list dropdown-list--inner">
                                                                    <ul class="dropdown-list__list">
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                    </ul>
                                                                </div>

                                                            </div>
                                                        </li>
                                                        <li class="
                    dropdown-list__item
                        dropdown-list__item--collapse
                ">
                                                            <a class="dropdown-list__label " href="#" aria-expanded="false" aria-controls="dropdown-3-3">
                                                                Item name

                                                                <svg class="icon dropdown-list__icon" aria-hidden="true" role="img">
                                                                    <title>Arrow Down</title>
                                                                    <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                                                </svg>

                                                            </a>

                                                            <div id="dropdown-3-3" class="dropdown-list__content " aria-hidden="true">
                                                                <div id="" class="dropdown-list dropdown-list--inner">
                                                                    <ul class="dropdown-list__list">
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                    </ul>
                                                                </div>

                                                            </div>
                                                        </li>
                                                        <li class="
                    dropdown-list__item
                        dropdown-list__item--collapse
                ">
                                                            <a class="dropdown-list__label " href="#" aria-expanded="false" aria-controls="dropdown-3-4">
                                                                item name

                                                                <svg class="icon dropdown-list__icon" aria-hidden="true" role="img">
                                                                    <title>Arrow Down</title>
                                                                    <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                                                </svg>

                                                            </a>

                                                            <div id="dropdown-3-4" class="dropdown-list__content " aria-hidden="true">
                                                                <div id="" class="dropdown-list dropdown-list--inner">
                                                                    <ul class="dropdown-list__list">
                                                                        <li class="
                    dropdown-list__item
                ">
                                                                            <a class="dropdown-list__label " href="#">
                                                                                sublist item name

                                                                            </a>

                                                                        </li>
                                                                    </ul>
                                                                </div>

                                                            </div>
                                                        </li>
                                                    </ul>
                                                </div>

                                            </div>
                                        </li>
                                    </ul>
                                </div>

                                <script type="text/javascript">
                                    new DropdownList(document.getElementById('dropdown-side-menu'));
                                </script>

                            </div>
                            <div class="side-menu__overlay"></div>
                        </div>

                        <script src="/components/raw/side-menu/side-menu.js" defer></script>

                        <div class="mega-menu">
                            <ul class="mega-menu__list">
                                <li class="mega-menu__item mega-menu__item--parent">
                                    <a href="/furniture" class="mega-menu__link">
                                        Furniture
                                    </a>
                                    <ul class="mega-menu__inner-list mega-menu__inner-list--level1">
                                        <li class="mega-menu__inner-item mega-menu__inner-item--level1 mega-menu__inner-item--image">
                                            <a class="mega-menu__inner-link" href="#">
                                                <div class="lazyload-wrapper ">
                                                    <img class="image lazyload " src="" data-src="/images/megamenu/menu-image.jpg" alt="">
                                                </div>

                                                <button class="button button--category" type="button" aria-label="click to do something">
                                                    Bekijk categorie
                                                    <svg class="icon button__icon" role="img">
                                                        <title>angle-right</title>
                                                        <use xlink:href="/images/icons-sprite.svg#angle-right"></use>
                                                    </svg>

                                                </button>

                                            </a>
                                        </li>
                                        <li class="mega-menu__inner-item mega-menu__inner-item--level1 mega-menu__inner-item--parent">
                                            <a href="/example" class="mega-menu__inner-link">
                                                Example
                                            </a>
                                            <ul class="list mega-menu__inner-list mega-menu__inner-list--level2">
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">

                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">
                                                        Category name
                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">

                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">
                                                        Category long name
                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">

                                                    </a>
                                                </li>
                                            </ul>

                                        </li>
                                        <li class="mega-menu__inner-item mega-menu__inner-item--level1 mega-menu__inner-item--parent">
                                            <a href="/example" class="mega-menu__inner-link">
                                                Example2
                                            </a>
                                            <ul class="list mega-menu__inner-list mega-menu__inner-list--level2">
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">
                                                        Category name
                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">

                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">

                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">
                                                        Category long very name
                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">

                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">
                                                        Category long very name
                                                    </a>
                                                </li>
                                            </ul>

                                        </li>
                                        <li class="mega-menu__inner-item mega-menu__inner-item--level1 mega-menu__inner-item--parent">
                                            <a href="/example" class="mega-menu__inner-link">
                                                Example3
                                            </a>
                                            <ul class="list mega-menu__inner-list mega-menu__inner-list--level2">
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">
                                                        Category name
                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">

                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">

                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">
                                                        Category long very name
                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">

                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">
                                                        Category long very name
                                                    </a>
                                                </li>
                                            </ul>

                                        </li>
                                        <li class="mega-menu__inner-item mega-menu__inner-item--level1 mega-menu__inner-item--parent">
                                            <a href="/example" class="mega-menu__inner-link">
                                                Example long name
                                            </a>
                                            <ul class="list mega-menu__inner-list mega-menu__inner-list--level2">
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">
                                                        Category name
                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">

                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">

                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">
                                                        Category long very name
                                                    </a>
                                                </li>
                                                <li class="list__item mega-menu__inner-item mega-menu__inner-item--level2">
                                                    <a href="" class="link mega-menu__inner-link">

                                                    </a>
                                                </li>
                                            </ul>

                                        </li>
                                    </ul>
                                </li>
                                <li class="mega-menu__item">
                                    <a href="/accessories" class="mega-menu__link">
                                        Accessories
                                    </a>
                                </li>
                                <li class="mega-menu__item">
                                    <a href="/world-of" class="mega-menu__link">
                                        World of
                                    </a>
                                </li>
                            </ul>
                        </div>
                        <script src="/components/raw/mega-menu/mega-menu.js"></script>

                        <div class="header__search">
                            <dialog class="minicart-content js--popup " data-popup="popup-minicart" role="alertdialog">
                                <div class="minicart-content__bar"></div>

                                <div class="minicart-content__wrapper">
                                    <div class="minicart-content__total">
                                        <div class="minicart-content__total-text">
                                            2 producten in winkelwagen
                                        </div>
                                        <div class="minicart-content__total-close">
                                            <svg class="icon minicart-content__total-close__icon js--popup__close-button" role="img">
                                                <title>close</title>
                                                <use xlink:href="/images/icons-sprite.svg#close"></use>
                                            </svg>

                                        </div>
                                    </div>

                                    <div class="minicart-content__products-list">
                                        <div class="minicart-product">
                                            <div class="minicart-product__image">
                                                <div class="lazyload-wrapper ">
                                                    <img class="image lazyload " src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw&#x3D;&#x3D;" data-src="/images/product/VENUM-CONTENDER2.jpg" alt="Venum (Kick)bokshandschoenen Contender 2.0">
                                                </div>

                                            </div>
                                            <div class="minicart-product__info">
                                                <h3 class="minicart-product__name">
                                                    <a class="link link--invert minicart-product__link" href="#">
                                                        UFC MMA Handschoenen zonder duim
                                                    </a>
                                                </h3>
                                                <p class="minicart-product__description">
                                                    Deze leren wedstrijdhandschoenen van UFC zijn de enige handschoenen die gedragen mogen worden door de UFC vechters in Octagon!
                                                </p>
                                                <div id="test-1" class="dropdown-list minicart-product__attributes">
                                                    <ul class="dropdown-list__list">
                                                        <li class="
                    dropdown-list__item
                ">
                                                            < class="dropdown-list__label " aria-expanded="false" aria-controls="see-details-1">

                                                            </>

                                                        </li>
                                                    </ul>
                                                </div>

                                                <script type="text/javascript">
                                                    new DropdownList(document.getElementById('test-1'));
                                                </script>

                                                <div class="minicart-product__bottom">
                                                    <div class="minicart-product__qty">
                                                        <div class="quantity-update ">

                                                            <input class="quantity-update__input " type="number" id="qty" min="1" value="1" aria-label="Change the quantity" />

                                                            <div class="quantity-update__buttons">
                                                                <button class="button button--icon quantity-update__button quantity-update__button--plus" type="button" aria-label="Increase the quantity">

                                                                    <svg class="icon button__icon minicart-product__qty--buttonIcon" role="img">
                                                                        <title>Arrow up</title>
                                                                        <use xlink:href="/images/icons-sprite.svg#angle-up"></use>
                                                                    </svg>

                                                                </button>
                                                                <button class="button button--icon quantity-update__button quantity-update__button--minus quantity-update__button--disabled" type="button" aria-label="Decrease the quantity">

                                                                    <svg class="icon button__icon minicart-product__qty--buttonIcon" role="img">
                                                                        <title>Arrow down</title>
                                                                        <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                                                    </svg>

                                                                </button>
                                                            </div>

                                                        </div>
                                                        <script src="/components/raw/button/../quantity-update/quantity-update.js"></script>

                                                    </div>
                                                    <div class="minicart-product__price">
                                                        € 109,95
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="minicart-product">
                                            <div class="minicart-product__image">
                                                <div class="lazyload-wrapper ">
                                                    <img class="image lazyload " src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw&#x3D;&#x3D;" data-src="/images/product/VENUM-CONTENDER2.jpg" alt="Venum (Kick)bokshandschoenen Contender 2.0">
                                                </div>

                                            </div>
                                            <div class="minicart-product__info">
                                                <h3 class="minicart-product__name">
                                                    <a class="link link--invert minicart-product__link" href="#">
                                                        Venum (Kick)bokshandschoenen Contender 2.0
                                                    </a>
                                                </h3>
                                                <p class="minicart-product__description">
                                                    Dit zijn de nieuwe bestsellers onder de kickboxhandschoenen van Venum! Betaalbare (kick)bokshandschoenen van Venum, zonder concessies aan kwaliteit!
                                                </p>
                                                <div id="test-1" class="dropdown-list minicart-product__attributes">
                                                    <ul class="dropdown-list__list">
                                                        <li class="
                    dropdown-list__item
                        dropdown-list__item--collapse
                ">
                                                            <button class="dropdown-list__label minicart-product__attributes-button" aria-expanded="false" aria-controls="see-details" aria-controls="see-details">
                                                                Bekijk Details

                                                                <svg class="icon dropdown-list__icon" role="img">
                                                                    <title>Arrow down</title>
                                                                    <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                                                </svg>

                                                            </button>

                                                            <div id="see-details" class="dropdown-list__content minicart-product__attributes-button" aria-hidden="true">
                                                                <dl class="list list--description minicart-product__attributes-list">
                                                                    <dt class="list__label">Maat</dt>
                                                                    <dd class="list__value">12 oz</dd>
                                                                    <dt class="list__label">Kleur</dt>
                                                                    <dd class="list__value">Zwart/Grijs-Wit</dd>
                                                                </dl>

                                                            </div>
                                                        </li>
                                                    </ul>
                                                </div>

                                                <script type="text/javascript">
                                                    new DropdownList(document.getElementById('test-1'));
                                                </script>

                                                <div class="minicart-product__bottom">
                                                    <div class="minicart-product__qty">
                                                        <div class="quantity-update ">

                                                            <input class="quantity-update__input " type="number" id="qty" min="1" value="1" aria-label="Change the quantity" />

                                                            <div class="quantity-update__buttons">
                                                                <button class="button button--icon quantity-update__button quantity-update__button--plus" type="button" aria-label="Increase the quantity">

                                                                    <svg class="icon button__icon minicart-product__qty--buttonIcon" role="img">
                                                                        <title>Arrow up</title>
                                                                        <use xlink:href="/images/icons-sprite.svg#angle-up"></use>
                                                                    </svg>

                                                                </button>
                                                                <button class="button button--icon quantity-update__button quantity-update__button--minus quantity-update__button--disabled" type="button" aria-label="Decrease the quantity">

                                                                    <svg class="icon button__icon minicart-product__qty--buttonIcon" role="img">
                                                                        <title>Arrow down</title>
                                                                        <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                                                    </svg>

                                                                </button>
                                                            </div>

                                                        </div>
                                                        <script src="/components/raw/button/../quantity-update/quantity-update.js"></script>

                                                    </div>
                                                    <div class="minicart-product__price">
                                                        44,95
                                                    </div>
                                                </div>
                                            </div>
                                        </div>

                                    </div>

                                    <div class="minicart-content__summary">
                                        <div class="minicart-content__summary-label">
                                            Totaal
                                        </div>
                                        <div class="minicart-content__summary-value">
                                            € 219,90
                                        </div>
                                    </div>

                                    <div class="minicart-content__actions">
                                        <div class="row">
                                            <div class="col-xs-7">
                                                <button class="button button minicart-content__actions--button minicart-content__actions--button-showcart" type="button">
                                                    Bekijk en bewerk Winkelwagen
                                                    <svg class="icon button__icon minicart-content__actions--button-icon" role="img">
                                                        <title>Arrow right</title>
                                                        <use xlink:href="/images/icons-sprite.svg#angle-right"></use>
                                                    </svg>

                                                </button>

                                            </div>
                                            <div class="col-xs-5">
                                                <button class="button button minicart-content__actions--button minicart-content__actions--button-checkout" type="button">
                                                    Ga naar afrekenen
                                                    <svg class="icon button__icon minicart-content__actions--button-icon" role="img">
                                                        <title>Arrow right</title>
                                                        <use xlink:href="/images/icons-sprite.svg#angle-right"></use>
                                                    </svg>

                                                </button>

                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </dialog>

                            <form class="form minisearch">
                                <div class="field search">
                                    <div class="input input--search">
                                        <span class="form-check" aria-label="form-check-field-id">
                                            <svg class="icon brief-info__icon" role="img">
                                                <title>USP Check</title>
                                                <use xlink:href="/images/icons-sprite.svg#usp-check"></use>
                                            </svg>

                                        </span>
                                        <label class="
            label
            
        " for="field-id">
                                            Label text
                                        </label>
                                        <input class="input__field " id="field-id" name="field-name" type="text" placeholder="Zoeken">
                                    </div>

                                    <div class="search-autocomplete"></div>
                                </div>
                                <div class="actions">
                                    <button type="submit" title="Zoek" class="search">
                                        <svg class="icon " role="img">
                                            <title>zoeken</title>
                                            <use xlink:href="/images/icons-sprite.svg#search"></use>
                                        </svg>

                                        <span>Zoeken</span>
                                    </button>
                                </div>
                            </form>

                        </div>
                    </div>
                    <div class="header__trustpilot mobile">
                        <div class="trustpilot-header">

                            <!-- TrustBox widget - Micro Star -->
                            <div class="trustpilot-widget" data-locale="nl-NL" data-template-id="5419b732fbfb950b10de65e5" data-businessunit-id="4d6fd8cf00006400050edf3a" data-style-height="24px" data-style-width="100%" data-theme="dark" data-font-family="Lato">
                                <a href="https://nl.trustpilot.com/review/vechtsportonline.nl" target="_blank" rel="noopener">Trustpilot</a>
                            </div>
                            <!-- End TrustBox widget -->
                        </div>

                    </div>
                </div>
            </div>
        </header>

        <script src="/components/raw/header/../popup/popup.js"></script>

        <div class="product-view container">

            <nav class="breadcrumbs " aria-label="Breadcrumbs" role="navigation">
                <ol class="breadcrumbs__list ">
                    <li class="breadcrumbs__item">
                        <a href="#" class="breadcrumbs__link breadcrumbs__link--active link--invert">
                            <svg class="icon breadcrumbs__icon" role="img">
                                <title>Arrow left</title>
                                <use xlink:href="/images/icons-sprite.svg#angle-left"></use>
                            </svg>
                            Home
                        </a>
                    </li>
                    <li class="breadcrumbs__item">
                        <a href="#" class="breadcrumbs__link link--invert">
                            <svg class="icon breadcrumbs__icon" role="img">
                                <title>Arrow left</title>
                                <use xlink:href="/images/icons-sprite.svg#angle-left"></use>
                            </svg>
                            Handschoenen
                        </a>
                    </li>
                    <li class="breadcrumbs__item">
                        <a href="#" class="breadcrumbs__link link--invert">
                            <svg class="icon breadcrumbs__icon" role="img">
                                <title>Arrow left</title>
                                <use xlink:href="/images/icons-sprite.svg#angle-left"></use>
                            </svg>
                            Kickboks handschoenen
                        </a>
                    </li>
                    <li class="breadcrumbs__item">
                        <a href="#" class="breadcrumbs__link link--invert">
                            <svg class="icon breadcrumbs__icon" role="img">
                                <title>Arrow left</title>
                                <use xlink:href="/images/icons-sprite.svg#angle-left"></use>
                            </svg>
                            Venum Contender 2.0 Zwart - S
                        </a>
                    </li>
                </ol>
            </nav>

            <div class="product-view__wrapper">
                <div class="product-view__gallery">
                    <div class="
         gallery
         
             gallery--vertical
     ">
                        <div class="
             gallery__stage
             
                 gallery__stage--vertical
         ">
                            <div class="gallery__frame">
                                <div class="lazyload-wrapper ">
                                    <img class="image lazyload " src="" data-src="/images/product/UFC_MMA_GLOVES.png" alt="">
                                </div>

                            </div>
                        </div>
                        <div class="gallery__nav
                    gallery__nav--vertical
                
         ">
                            <div class="gallery__thumb-arr">
                                <svg class="
                     gallery__icon-arrow
                         gallery__icon-arrow--vertical
            ">
                                    <use xlink:href="/images/icons-sprite.svg#angle-up"></use>
                                </svg>
                            </div>
                            <div class="
                     gallery__thumb
                         gallery__thumb--active
                 ">
                                <div class="lazyload-wrapper ">
                                    <img class="image lazyload " src="" data-src="/images/product/UFC_MMA_GLOVES.png" alt="">
                                </div>

                            </div>
                            <div class="
                     gallery__thumb
                 ">
                                <div class="lazyload-wrapper ">
                                    <img class="image lazyload " src="" data-src="/images/product/UFC_MMA_GLOVES.png" alt="">
                                </div>

                            </div>
                            <div class="
                     gallery__thumb
                 ">
                                <div class="lazyload-wrapper ">
                                    <img class="image lazyload " src="" data-src="/images/product/UFC_MMA_GLOVES.png" alt="">
                                </div>

                            </div>
                            <div class="
                     gallery__thumb
                 ">
                                <div class="lazyload-wrapper ">
                                    <img class="image lazyload " src="" data-src="/images/product/UFC_MMA_GLOVES.png" alt="">
                                </div>

                            </div>
                            <div class="gallery__thumb-arr">
                                <svg class="
                     gallery__icon-arrow
                         gallery__icon-arrow--vertical
                 ">
                                    <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                </svg>
                            </div>
                        </div>
                    </div>

                </div>

                <div class="product-view__product-information">
                    <div class="product-view__stock-information">
                        <div class="
                            product-view__stock-status
                                product-view__stock-status--out-of-stock
                        ">
                            Uitverkocht
                        </div>
                    </div>

                    <div class="product-view__main-information">
                        <h1 class="heading heading--first-level product-view__title">
                            UFC MMA Gloves zonder duim - Zwart/Wit
                        </h1>

                        <div class="product-view__description">
                            Customize Ingrid Running Jacket with Long Sleaves
                        </div>
                    </div>

                    <div class="product-view__actions">
                        <div class="product-view__options">
                            <div class="product-view__price">
                                <div class="price  ">
                                    <span class="price__value price__value--special ">
                                        <ins aria-label="On sale at: €109,95">

                                            €

                                            109,95

                                        </ins>
                                    </span>
                                    <span class="price__value price__value--old ">
                                        <del aria-label="Price reduced from: €129,95">
                                            €
                                            129,95

                                        </del>
                                    </span>
                                </div>

                            </div>

                            <div class="product-view__customization">
                                <div class="bundle-option ">
                                    <h4 class="bundle-option__title">
                                        Sprite Stasis Ball
                                    </h4>

                                    <div class="radio bundle-option__radio">
                                        <fieldset class="radio__fieldset" aria-labelledby="legend-id">
                                            <div class="radio__handler">
                                                <input type="radio" id="id1" name="radio1" class="radio__field">
                                                <label for="id1" class="radio__label">
                                                    <span class="radio__icon"></span>
                                                    Sprite Stasis Ball 55 cm
                                                </label>
                                            </div>
                                            <div class="radio__handler">
                                                <input type="radio" id="id2" name="radio1" class="radio__field">
                                                <label for="id2" class="radio__label">
                                                    <span class="radio__icon"></span>
                                                    Sprite Stasis Ball 65 cm
                                                </label>
                                            </div>
                                            <div class="radio__handler">
                                                <input type="radio" id="id3" name="radio1" class="radio__field">
                                                <label for="id3" class="radio__label">
                                                    <span class="radio__icon"></span>
                                                    Sprite Stasis Ball 75 cm
                                                </label>
                                            </div>
                                        </fieldset>
                                    </div>

                                    <div class="input bundle-option__qty">
                                        <span class="form-check" aria-label="form-check-qty1">
                                            <svg class="icon brief-info__icon" role="img">
                                                <title>USP Check</title>
                                                <use xlink:href="/images/icons-sprite.svg#usp-check"></use>
                                            </svg>

                                        </span>
                                        <label class="
            label
            bundle-option__label
        " for="qty1">
                                            Qty:
                                        </label>
                                        <input class="input__field bundle-option__qty-input" id="qty1" name="qty1" type="number" placeholder="" min="0">
                                    </div>

                                </div>

                                <div class="bundle-option ">
                                    <h4 class="bundle-option__title">
                                        Sprite Yoga Strap
                                    </h4>

                                    <div class="checkbox ">
                                        <input type="checkbox" id="checkbox-1" name="checkbox-name-1" class="checkbox__field ">
                                        <svg class="checkbox__icon ">
                                            <use xlink:href="/images/icons-sprite.svg#checked"></use>
                                        </svg>
                                        <label for="checkbox-1" class="checkbox__label ">
                                            1 x Sprite Yoga Strap 6 foot
                                        </label>
                                    </div>

                                    <div class="checkbox ">
                                        <input type="checkbox" id="checkbox-2" name="checkbox-name-2" class="checkbox__field ">
                                        <svg class="checkbox__icon ">
                                            <use xlink:href="/images/icons-sprite.svg#checked"></use>
                                        </svg>
                                        <label for="checkbox-2" class="checkbox__label ">
                                            1 x Sprite Yoga Strap 8 foot
                                        </label>
                                    </div>

                                </div>

                                <div class="bundle-option ">
                                    <h4 class="bundle-option__title">
                                        Sprite Foam Roller
                                    </h4>

                                    <div class="select bundle-option__select">
                                        <label class="label label--hidden" for="expiration_year">
                                            Expiration Year
                                        </label>
                                        <select id="expiration_year" class="select__field bundle-option__select " name="expiration_year">
                                            <option value="">
                                                Sprite Foam Roller
                                            </option>
                                            <option value="">
                                                Sprite Foam Roller S
                                            </option>
                                            <option value="" false>
                                                Sprite Foam Roller XL
                                            </option>
                                        </select>
                                    </div>

                                    <div class="input bundle-option__qty">
                                        <span class="form-check" aria-label="form-check-qty1">
                                            <svg class="icon brief-info__icon" role="img">
                                                <title>USP Check</title>
                                                <use xlink:href="/images/icons-sprite.svg#usp-check"></use>
                                            </svg>

                                        </span>
                                        <label class="
            label
            bundle-option__label
        " for="qty1">
                                            Qty:
                                        </label>
                                        <input class="input__field bundle-option__qty-input" id="qty1" name="qty1" type="number" placeholder="" min="0">
                                    </div>

                                </div>

                            </div>

                            <div class="product-view__size-selection">
                                <div class="product-view__size-selection--icon">
                                    <svg class="icon size-icon" role="img">
                                        <title>Size</title>
                                        <use xlink:href="/images/icons-sprite.svg#size"></use>
                                    </svg>

                                </div>
                                <div class="select ">
                                    <label class="label select__label--super_attribute super-attribute-select" for="field-id">

                                    </label>
                                    <select id="field-id" class="select__field select__field--super_attribute super-attribute-select " name="field-name">
                                        <option value="Selecteer maat">
                                            Selecteer maat
                                        </option>
                                        <option value="XS">
                                            XS
                                        </option>
                                        <option value="S">
                                            S
                                        </option>
                                        <option value="M">
                                            M
                                        </option>
                                        <option value="L">
                                            L
                                        </option>
                                        <option value="XL">
                                            XL
                                        </option>
                                        <option value="XXL">
                                            XXL
                                        </option>
                                    </select>
                                </div>

                            </div>
                        </div>

                        <div class="product-view__cart-actions">
                            <div class="product-view__qty">
                                <div class="quantity-update ">

                                    <input class="quantity-update__input " type="number" id="qty" min="1" value="1" aria-label="Change the quantity" />

                                    <div class="quantity-update__buttons">
                                        <button class="button button--icon quantity-update__button quantity-update__button--plus" type="button" aria-label="Increase the quantity">

                                            <svg class="icon button__icon minicart-product__qty--buttonIcon" role="img">
                                                <title>Arrow up</title>
                                                <use xlink:href="/images/icons-sprite.svg#angle-up"></use>
                                            </svg>

                                        </button>
                                        <button class="button button--icon quantity-update__button quantity-update__button--minus quantity-update__button--disabled" type="button" aria-label="Decrease the quantity">

                                            <svg class="icon button__icon minicart-product__qty--buttonIcon" role="img">
                                                <title>Arrow down</title>
                                                <use xlink:href="/images/icons-sprite.svg#angle-down"></use>
                                            </svg>

                                        </button>
                                    </div>

                                </div>
                                <script src="/components/raw/button/../quantity-update/quantity-update.js"></script>

                            </div>

                            <div class="product-view__add-to-cart">
                                <button class="button product-view__add-to-cart-btn" type="button">
                                    In winkelwagen
                                    <svg class="icon button__icon" role="img">
                                        <title>custom-cart</title>
                                        <use xlink:href="/images/icons-sprite.svg#custom-cart"></use>
                                    </svg>

                                </button>

                            </div>
                        </div>
                        <div class="product-view__summary">
                            <div class="product-view__summary-price">
                                <div class="price  ">
                                    <span class="price__value ">
                                        €
                                        92.00

                                    </span>
                                </div>

                                <span class="product-view__summary-unit">
                                    / bundle
                                </span>
                            </div>
                            <div class="product-view__summary-title">
                                Summary:
                            </div>
                            <ul class="product-view__summary-list list">
                                <li class="product-view__summary-item list__item">
                                    <span class="product-view__summary-item-title">
                                        Sprite Stasis Ball:
                                    </span>

                                    1 x Sprite Stasis Ball 55 cm
                                </li>
                                <li class="product-view__summary-item list__item">
                                    <span class="product-view__summary-item-title">
                                        Sprite Yoga Strap:
                                    </span>

                                    1 x Sprite Yoga Strap 6 foot
                                </li>
                                <li class="product-view__summary-item list__item">
                                    <span class="product-view__summary-item-title">
                                        Sprite Foam Roller:
                                    </span>

                                    1 x Sprite Foam Roller
                                </li>
                            </ul>
                        </div>
                    </div>

                    <div class="product-view__usps">
                        <div class="brief-info">
                            <ul class="list brief-info__items-container">
                                <li class="brief-info__item">
                                    <span class="brief-info__icon-wrapper " aria-label="">
                                        <svg class="icon brief-info__icon" role="img">
                                            <title>USP Check</title>
                                            <use xlink:href="/images/icons-sprite.svg#usp-check"></use>
                                        </svg>

                                    </span>
                                    <div class="brief-info__content">
                                        <span class="brief-info__title ">
                                            Gratis bezorgd
                                        </span>
                                    </div>
                                </li>
                                <li class="brief-info__item">
                                    <span class="brief-info__icon-wrapper " aria-label="">
                                        <svg class="icon brief-info__icon" role="img">
                                            <title>USP Check</title>
                                            <use xlink:href="/images/icons-sprite.svg#usp-check"></use>
                                        </svg>

                                    </span>
                                    <div class="brief-info__content">
                                        <span class="brief-info__title ">
                                            Achteraf betalen
                                        </span>
                                    </div>
                                </li>
                                <li class="brief-info__item">
                                    <span class="brief-info__icon-wrapper " aria-label="">
                                        <svg class="icon brief-info__icon" role="img">
                                            <title>USP Check</title>
                                            <use xlink:href="/images/icons-sprite.svg#usp-check"></use>
                                        </svg>

                                    </span>
                                    <div class="brief-info__content">
                                        <span class="brief-info__title ">
                                            Grootste van Benelux
                                        </span>
                                    </div>
                                </li>
                            </ul>
                        </div>

                    </div>
                </div>

                <div class="product-view__tabs">
                    <div class="tab  product-view__tab" role="widget">
                        <button class="tab__title tab__title--active " data-tab="tab-1" id="" aria-controls="tab-1" aria-selected="true" aria-expanded="true">
                            Extra informatie
                        </button>

                        <div class="
                tab__content
                tab__content--active
                
            " id="tab-1" data-content="tab-1" aria-labelledby="" aria-hidden="false">
                            Deze leren wedstrijdhandschoenen van UFC zijn de enige handschoenen die gedragen mogen worden door de UFC vechters in Octagon. <br /> De UFC Official Pro MMA Handschoenen zijn gemaakt van zeer duurzaam leer. <br /> De handschoenen zijn licht voorgevormd waardoor je makkelijk je handen buigt. <br /> De extra lange klittenbandsluiting biedt optimale bescherming voor je polsen. <br /> De binnenkant van de handschoen is open, dit biedt perfecte grip tijdens het vastpakken van je tegenstander. <br /> Details <br /> Officiële wedstrijdhandschoenen <br /> Extra lange klittenbandsluiting <br /> Soepel model <br /> Perfecte grip <br /> Open binnenkant
                        </div>
                        <button class="tab__title  " data-tab="tab-2" id="" aria-controls="tab-2" aria-selected="false" aria-expanded="false">
                            Reviews (34)
                        </button>

                        <div class="
                tab__content
                
                
            " id="tab-2" data-content="tab-2" aria-labelledby="" aria-hidden="true">
                            <section class="product-review">
                                <div class="product-review__summary">
                                    <div class="review review--summary ">
                                        <div class="review__summary-handle">
                                            <div class="review__summary-rating">
                                                <div class="rating " aria-label="Average rating: 72%" title="4/5 sterren" tabindex="0">
                                                    <div class="rating__star " role="presentation" style="width: 72%">
                                                        <span class="
                rating__indicator
                
            "></span>
                                                    </div>
                                                </div>
                                                <div class="rating__title">
                                                    4/5 sterren
                                                </div>

                                            </div>
                                            <div class="review__summary-content">
                                                <div class="review__summary-amount">
                                                    <span class="review__amount-qty"> 3,9/5 sterren (32 reviews) </span>
                                                </div>
                                                <div class="review__summary-add-review">
                                                    <button class="button modal-trigger review__summary-add" data-modal-trigger="addReview" type="button">
                                                        Review plaatsen
                                                        <svg class="icon button__icon review__summary-add--icon" role="img">
                                                            <title>Plus</title>
                                                            <use xlink:href="/images/icons-sprite.svg#plus"></use>
                                                        </svg>

                                                    </button>

                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                </div>
                                <div class="product-review__reviews">
                                    <ul class="list">
                                        <li class="list__item">
                                            <div class="review ">
                                                <div class="review__details">
                                                    <div class="rating review__rating" aria-label="Average rating 80%" title="4/5 sterren" tabindex="0">
                                                        <div class="rating__star " role="presentation" style="width: 80%">
                                                            <span class="
                        rating__indicator
                        
                    "></span>
                                                        </div>
                                                    </div>
                                                    <div class="rating__title">
                                                        4/5 sterren
                                                    </div>
                                                </div>
                                                <div class="review__details">
                                                    <div class="review__heading">
                                                        <span class="review__title">
                                                            Klaas Akkerman
                                                        </span>
                                                        <span class="review__date">
                                                            11/06/2020
                                                        </span>
                                                    </div>

                                                    <div class="review__content">
                                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus lacus odio, rutrum a augue nec, varius vehicula odio. Praesent at nibh vehicula libero pellentesque vulputate. Ut malesuada dolor eget purus condimentum, eget porttitor est luctus. Donec tristique, tortor a iaculis mollis, ex erat gravida nunc, quis viverra tortor neque quis eros. Pellentesque lorem sapien, consequat non vestibulum ac, pellentesque vitae risus. Nunc eleifend magna id fringilla semper.
                                                    </div>
                                                </div>
                                            </div>

                                        </li>
                                        <li class="list__item">
                                            <div class="review ">
                                                <div class="review__details">
                                                    <div class="rating review__rating" aria-label="Average rating 50%" title="2,5/5 sterren" tabindex="0">
                                                        <div class="rating__star " role="presentation" style="width: 50%">
                                                            <span class="
                        rating__indicator
                        
                    "></span>
                                                        </div>
                                                    </div>
                                                    <div class="rating__title">
                                                        2,5/5 sterren
                                                    </div>
                                                </div>
                                                <div class="review__details">
                                                    <div class="review__heading">
                                                        <span class="review__title">
                                                            Nick van Bruggen
                                                        </span>
                                                        <span class="review__date">
                                                            10/06/2020
                                                        </span>
                                                    </div>

                                                    <div class="review__content">
                                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus lacus odio, rutrum a augue nec, varius vehicula odio. Praesent at nibh vehicula libero pellentesque vulputate. Ut malesuada dolor eget purus condimentum, eget porttitor est luctus. Donec tristique, tortor a iaculis mollis, ex erat gravida nunc, quis viverra tortor neque quis eros. Pellentesque lorem sapien, consequat non vestibulum ac, pellentesque vitae risus. Nunc eleifend magna id fringilla semper.
                                                    </div>
                                                </div>
                                            </div>

                                        </li>
                                        <li class="list__item">
                                            <div class="review ">
                                                <div class="review__details">
                                                    <div class="rating review__rating" aria-label="Average rating 92%" title="4,8/5 sterren" tabindex="0">
                                                        <div class="rating__star " role="presentation" style="width: 92%">
                                                            <span class="
                        rating__indicator
                        
                    "></span>
                                                        </div>
                                                    </div>
                                                    <div class="rating__title">
                                                        4,8/5 sterren
                                                    </div>
                                                </div>
                                                <div class="review__details">
                                                    <div class="review__heading">
                                                        <span class="review__title">
                                                            Henk Valk
                                                        </span>
                                                        <span class="review__date">
                                                            07/06/2020
                                                        </span>
                                                    </div>

                                                    <div class="review__content">
                                                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus lacus odio, rutrum a augue nec, varius vehicula odio. Praesent at nibh vehicula libero pellentesque vulputate. Ut malesuada dolor eget purus condimentum, eget porttitor est luctus. Donec tristique, tortor a iaculis mollis, ex erat gravida nunc, quis viverra tortor neque quis eros. Pellentesque lorem sapien, consequat non vestibulum ac, pellentesque vitae risus. Nunc eleifend magna id fringilla semper.
                                                    </div>
                                                </div>
                                            </div>

                                        </li>
                                    </ul>
                                </div>
                            </section>

                        </div>
                    </div>

                    <script src="/components/raw/tab/tab.js"></script>

                </div>

                <div class="product-view__side-products--related">
                    <h3 class="product-view__side-products--heading"> Gerelateerde producten </h3>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="catalog-item " tabindex="0">

                                <div class="catalog-item__image">
                                    <a href="#" class="" tabindex="-1">
                                        <div class="lazyload-wrapper ">
                                            <img class="image lazyload " src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw&#x3D;&#x3D;" data-src="/images/product/UFC_MMA_GLOVES.png" alt="image alt text">
                                        </div>

                                    </a>
                                </div>
                                <div class="catalog-item__content">
                                    <h2 class="catalog-item__title">
                                        <a href="">UFC MMA Handschoenen zonder duim - Zwart/Wit</a>
                                    </h2>

                                    <div class="catalog-item__price">
                                        <div class="price  ">
                                            <span class="price__value price__value--special ">
                                                <ins aria-label="On sale at: €109,95">

                                                    €

                                                    109,95

                                                </ins>
                                            </span>
                                            <span class="price__value price__value--old ">
                                                <del aria-label="Price reduced from: €129,95">
                                                    €
                                                    129,95

                                                </del>
                                            </span>
                                        </div>

                                    </div>
                                </div>

                                <div class="catalog-item__actions">
                                    <button class="button button--icon button--plus catalog-item__primary-action" type="button" aria-label="Add to Cart">
                                        <span class="catalog-item__cart-text"></span>
                                        <svg class="icon icons__single-icon button__icon" role="img">
                                            <title>Plus</title>
                                            <use xlink:href="/images/icons-sprite.svg#plus"></use>
                                        </svg>

                                    </button>

                                </div>
                            </div>

                        </div>
                        <div class="col-md-6">
                            <div class="catalog-item " tabindex="0">

                                <div class="catalog-item__image">
                                    <a href="#" class="" tabindex="-1">
                                        <div class="lazyload-wrapper ">
                                            <img class="image lazyload " src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw&#x3D;&#x3D;" data-src="/images/product/UFC_MMA_GLOVES.png" alt="image alt text">
                                        </div>

                                    </a>
                                </div>
                                <div class="catalog-item__content">
                                    <h2 class="catalog-item__title">
                                        <a href="">UFC MMA Handschoenen zonder duim - Zwart/Wit</a>
                                    </h2>

                                    <div class="catalog-item__price">
                                        <div class="price  ">
                                            <span class="price__value price__value--special ">
                                                <ins aria-label="On sale at: €109,95">

                                                    €

                                                    109,95

                                                </ins>
                                            </span>
                                            <span class="price__value price__value--old ">
                                                <del aria-label="Price reduced from: €129,95">
                                                    €
                                                    129,95

                                                </del>
                                            </span>
                                        </div>

                                    </div>
                                </div>

                                <div class="catalog-item__actions">
                                    <button class="button button--icon button--plus catalog-item__primary-action" type="button" aria-label="Add to Cart">
                                        <span class="catalog-item__cart-text"></span>
                                        <svg class="icon icons__single-icon button__icon" role="img">
                                            <title>Plus</title>
                                            <use xlink:href="/images/icons-sprite.svg#plus"></use>
                                        </svg>

                                    </button>

                                </div>
                            </div>

                        </div>
                    </div>
                </div>

                <div class="product-view__side-products--bundles">
                    <h3 class="product-view__side-products--heading"> </h3>

                    <div class="row">
                        <div class="col-md-6">
                            <div class="catalog-item " tabindex="0">

                                <div class="catalog-item__image">
                                    <a href="#" class="" tabindex="-1">
                                        <div class="lazyload-wrapper ">
                                            <img class="image lazyload " src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw&#x3D;&#x3D;" data-src="/images/product/UFC_MMA_GLOVES.png" alt="image alt text">
                                        </div>

                                    </a>
                                </div>
                                <div class="catalog-item__content">
                                    <h2 class="catalog-item__title">
                                        <a href="">UFC MMA Handschoenen zonder duim - Zwart/Wit</a>
                                    </h2>

                                    <div class="catalog-item__price">
                                        <div class="price  ">
                                            <span class="price__value price__value--special ">
                                                <ins aria-label="On sale at: €109,95">

                                                    €

                                                    109,95

                                                </ins>
                                            </span>
                                            <span class="price__value price__value--old ">
                                                <del aria-label="Price reduced from: €129,95">
                                                    €
                                                    129,95

                                                </del>
                                            </span>
                                        </div>

                                    </div>
                                </div>

                                <div class="catalog-item__actions">
                                    <button class="button button--icon button--plus catalog-item__primary-action" type="button" aria-label="Add to Cart">
                                        <span class="catalog-item__cart-text"></span>
                                        <svg class="icon icons__single-icon button__icon" role="img">
                                            <title>Plus</title>
                                            <use xlink:href="/images/icons-sprite.svg#plus"></use>
                                        </svg>

                                    </button>

                                </div>
                            </div>

                        </div>
                        <div class="col-md-6">
                            <div class="catalog-item " tabindex="0">

                                <div class="catalog-item__image">
                                    <a href="#" class="" tabindex="-1">
                                        <div class="lazyload-wrapper ">
                                            <img class="image lazyload " src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw&#x3D;&#x3D;" data-src="/images/product/UFC_MMA_GLOVES.png" alt="image alt text">
                                        </div>

                                    </a>
                                </div>
                                <div class="catalog-item__content">
                                    <h2 class="catalog-item__title">
                                        <a href="">UFC MMA Handschoenen zonder duim - Zwart/Wit</a>
                                    </h2>

                                    <div class="catalog-item__price">
                                        <div class="price  ">
                                            <span class="price__value price__value--special ">
                                                <ins aria-label="On sale at: €109,95">

                                                    €

                                                    109,95

                                                </ins>
                                            </span>
                                            <span class="price__value price__value--old ">
                                                <del aria-label="Price reduced from: €129,95">
                                                    €
                                                    129,95

                                                </del>
                                            </span>
                                        </div>

                                    </div>
                                </div>

                                <div class="catalog-item__actions">
                                    <button class="button button--icon button--plus catalog-item__primary-action" type="button" aria-label="Add to Cart">
                                        <span class="catalog-item__cart-text"></span>
                                        <svg class="icon icons__single-icon button__icon" role="img">
                                            <title>Plus</title>
                                            <use xlink:href="/images/icons-sprite.svg#plus"></use>
                                        </svg>

                                    </button>

                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<footer class="footer">

    <div class="footer-brands">
        <div class="container">
            <div class="row">
                <div class="col-xs-4 col-md-2">
                    <div class="">
                        <a class="" href="https://m2.vechtsportonline.nl/" aria-label="Home page link">
                            <img class="image" alt="Vechtsportonline.nl" src="https://m2.vechtsportonline.nl/static/version1600075943/frontend/Elgentos/vso/nl_NL/images/logos/logo-red-black.jpg">
                        </a>
                    </div>
                </div>

                <div class="col-xs-8 col-md-10">
                    <div class="footer-brands__slider">
                        <div class="slider ">
                            <div class="slider__handler">
                                <div class="slider__slides">
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/adidas_bokshandschoenen.jpg" alt="Adidas Bokshandschoenen"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/booster_fight_gear.png" alt="Booster Fight Gear"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/essimo.jpg" alt="Essimo"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/ernesto_hoost.png" alt="Ernesto Hoost"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/everlast.png" alt="Everlast"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/hayabusa_fightwear.png" alt="Hayabusa Fightwear"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/joya_fight_gear.png" alt="Joya Fight Gear"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/king_bokshandschoenen.jpg" alt="King  bokshandschoenen "></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/matsuru.png" alt="Matsuru "></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/nike_boksschoenen.jpg" alt="Nike boksschoenen"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/qnt.png" alt="QNT"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/ringhorns.png" alt="Ringhorns"> &lt;</div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/superpro.jpg" alt="SuperPro"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/tapout.jpg" alt="Tapout"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/tunturi.png" alt="Tunturi"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/twins_bokshandschoenen.jpg" alt="Twins bokshandschoenen"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/vechtsportonline.jpg" alt="vechtsportonline"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/venum.png" alt="Venum"></div>
                                    </div>
                                    <div class="slider__item ">
                                        <div class="lazyload-wrapper "><img class="image lazyloaded" src="https://m2.vechtsportonline.nl/media/footer/brands/xxl_nutrition.png" alt="XXL Nutrition"></div>
                                    </div>
                                </div>
                            </div>

                            <div class="slider__navigation ">
                                <button class="button button--icon slider__navigation-icon slider__prev" type="button" aria-label="Previous slide">

                                    <svg class="icon button__icon slider__icon" role="img">
                                        <title>Arrow left</title>
                                        <use xlink:href="https://m2.vechtsportonline.nl/static/version1600075943/frontend/Elgentos/vso/nl_NL/images/icons-sprite.svg#angle-left">
                                        </use>
                                    </svg>

                                </button>

                                <button class="button button--icon slider__navigation-icon slider__next" type="button" aria-label="Next slide">

                                    <svg class="icon button__icon slider__icon" role="img">
                                        <title>Arrow right</title>
                                        <use xlink:href="https://m2.vechtsportonline.nl/static/version1600075943/frontend/Elgentos/vso/nl_NL/images/icons-sprite.svg#angle-right">
                                        </use>
                                    </svg>

                                </button>

                            </div>

                        </div>

                    </div>
                </div>

            </div>
        </div>
    </div>

    <div class="container">

        <div class="row">

            <div class="col-lg-6 col-xl-5">
                <div class="footer__contact">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="footer__route-address">
                                <h3 class="footer__title">Bezoek onze Showroom!</h3>

                                <div class="m-b--1">
                                    Atoomweg 6-3 <br>
                                    9743 AK Groningen<br>
                                </div>
                                <a href="https://www.google.nl/maps/dir//Vechtsportonline.nl,+Atoomweg+6-3,+9743+AK+Groningen/@53.2146086,6.46887,12z/data=!4m9!4m8!1m0!1m5!1m1!1s0x47c9d2a9d5fa0411:0xb29c5ff99a82e229!2m2!1d6.5389093!2d53.2146291!3e0" title="Route Vechtportonline.nl" target="blank">
                                    <button class="button button--icon" role="button" tabindex="0">
                                        Route <svg class="icon m-l--1" role="img">
                                            <title>Arrow right</title>
                                            <use xlink:href="https://m2.vechtsportonline.nl/static/version1600075943/frontend/Elgentos/vso/nl_NL/images/icons-sprite.svg#angle-right">
                                            </use>
                                        </svg>
                                    </button>
                                </a>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="footer__item footer-openinghours">
                                <h3 class="footer__title">Openingstijden</h3>

                                <div class="flex flex--between">
                                    <span class="">Maandag</span>
                                    <span>13:30 - 18:00u</span>
                                </div>

                                <div class="flex flex--between">
                                    <span class="">Dinsdag</span>
                                    <span>10:00 - 18:00u</span>
                                </div>

                                <div class="flex flex--between">
                                    <span class="">Woensdag</span>
                                    <span>10:00 - 18:00u</span>
                                </div>

                                <div class="flex flex--between">
                                    <span class="">Donderdag</span>
                                    <span>10:00 - 18:00u</span>
                                </div>

                                <div class="flex flex--between">
                                    <span class="">Vrijdag</span>
                                    <span>10:00 - 18:00u</span>
                                </div>

                                <div class="flex flex--between">
                                    <span class="">Zaterdag</span>
                                    <span>
                                        10:00 - 17:00u </span>
                                </div>

                                <div class="flex flex--between">
                                    <span class="">Zondag</span>
                                    <span>
                                        Gesloten </span>
                                </div>

                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-6 col-lg-3 col-xl-2 m-b--2">
                <h3 class=" footer__title">Snel navigeren</h3>
                <ul class="list footer-navigation-list">
                    <li class="list__item ">
                        <div class="widget block block-category-link">
                            <a href="https://m2.vechtsportonline.nl/bescherming/scheenbeschermers" title="Kickboks Scheenbeschermers"><span>Kickboks Scheenbeschermers</span></a>
                        </div>
                    </li>
                    <li class="list__item ">
                        <div class="widget block block-category-link">
                            <a href="https://m2.vechtsportonline.nl/kleding/broekjes-broeken/kickboks-broekjes" title="(Kick)bokshandschoenen"><span>(Kick)bokshandschoenen</span></a>
                        </div>
                    </li>
                    <li class="list__item ">
                        <div class="widget block block-category-link">
                            <a href="https://m2.vechtsportonline.nl/handschoenen/kick-bokshandschoenen" title="Kickboks Broekjes"><span>Kickboks Broekjes</span></a>
                        </div>
                    </li>
                    <li class="list__item ">
                        <div class="widget block block-category-link">
                            <a href="https://m2.vechtsportonline.nl/bescherming/kruisbeschermers-tok" title="Kickboks Kruisbeschermers"><span>Kickboks Kruisbeschermers</span></a>
                        </div>
                    </li>
                    <li class="list__item ">
                        <div class="widget block block-category-link">
                            <a href="https://m2.vechtsportonline.nl/bescherming/bitjes" title="Kickboks Bitjes"><span>Kickboks Bitjes</span></a>
                        </div>
                    </li>
                    <li class="list__item ">
                        <div class="widget block block-category-link">
                            <a href="https://m2.vechtsportonline.nl/bescherming/bandages" title="Kickboks Bandages"><span>Kickboks Bandages</span></a>
                        </div>
                    </li>
                    <li class="list__item ">
                        <div class="widget block block-category-link">
                            <a href="https://m2.vechtsportonline.nl/bescherming/binnenhandschoenen" title="Kickboks Binnenhandschoenen"><span>Kickboks Binnenhandschoenen</span></a>
                        </div>
                    </li>
                    <li class="list__item ">
                        <div class="widget block block-category-link">
                            <a href="https://m2.vechtsportonline.nl/kickboks-sets" title="Kickboks Setjes"><span>Kickboks Setjes</span></a>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="col-md-6 col-lg-2 col-xl-2 m-b--w">
                <h3 class="footer__title">Klantenservice</h3>
                <ul class="list footer-contact-list ">
                    <li class="list__item"><a href="https://m2.vechtsportonline.nl/veelgestelde-vragen">Veelgestelde
                            Vragen</a></li>
                    <li class="list__item"><a href="https://m2.vechtsportonline.nl/ruilen-retourneren">Ruilen /
                            Retourneren</a></li>
                    <li class="list__item"><a href="https://m2.vechtsportonline.nl/garantie">Garantie</a></li>
                    <li class="list__item"><a href="https://m2.vechtsportonline.nl/betaalmethoden">Betaal
                            Mogelijkheden</a></li>
                    <li class="list__item"><a href="https://m2.vechtsportonline.nl/klachten">Klachten</a></li>
                    <li class="list__item"><a href="https://m2.vechtsportonline.nl/privacy-veiligheid">Privacy &amp;
                            Veiligheid</a></li>
                    <li class="list__item"><a href="https://m2.vechtsportonline.nl/contact/">Contact</a></li>
                </ul>
            </div>
            <div class="col-lg-12 col-xl-3">
                <form class="newsletter" novalidate="novalidate" action="https://m2.vechtsportonline.nl/newsletter/subscriber/new/" method="post" id="newsletter-validate-detail">
                    <h3 class="footer__title">
                        Nieuwsbrief </h3>
                    <div class="newsletter__controls">
                        <div class="input newsletter__input" data-children-count="1">
                            <input name="email" type="email" id="newsletter" class="input__field newsletter__field" placeholder="Enter your email" required="" data-kwimpalastatus="alive" data-kwimpalaid="1600257046335-0">
                            <span style="animation: initial; transition: initial; color: initial; color-scheme: initial; font: initial; font-feature-settings: initial; font-kerning: initial; font-optical-sizing: initial; font-variation-settings: initial; text-orientation: initial; text-rendering: initial; -webkit-font-smoothing: initial; -webkit-locale: initial; -webkit-text-orientation: initial; -webkit-writing-mode: initial; writing-mode: initial; zoom: initial; place-content: initial; place-items: initial; place-self: initial; alignment-baseline: initial; appearance: initial; backdrop-filter: initial; backface-visibility: initial; background: url(&quot;data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEzLjUgNS4yODgxMUMxMy41IDUuMTkzNzYgMTMuNDA1NyA1LjA5OTQxIDEzLjI3MzYgNS4wNjE2NkwxMS42ODg2IDQuNDc2NjZDMTEuNDI0NCA0LjM2MzQxIDExLjEyMjUgNC40OTU1MSAxMS4xMjI1IDQuNjg0MjZWMTEuNTgxN0MxMS4xMjk5IDExLjYzNTUgMTEuMTUxMiAxMS42ODY0IDExLjE4NDMgMTEuNzI5NEMxMS4yMTc0IDExLjc3MjQgMTEuMjYxMSAxMS44MDYxIDExLjMxMTIgMTEuODI3MUwxMi45MzQxIDEyLjQxMjFDMTMuMTc5NCAxMi41MDY0IDEzLjUwMDIgMTIuMzc0MyAxMy41MDAyIDEyLjE2NjdMMTMuNSA1LjI4ODExWk05LjQ3OTQyIDEwLjU0MzdDOS40Nzk0MiAxMC40NDk0IDkuMzg1MDcgMTAuMzU1IDkuMjUyOTcgMTAuMzE3M0w3LjY2Nzk3IDkuNzMyMjZDNy40MDM4MiA5LjYxOTAxIDcuMTAxODcgOS43NTExMSA3LjEwMTg3IDkuOTM5ODFWMTQuMjQyNEM3LjEwOTMxIDE0LjI5NjEgNy4xMzA2MiAxNC4zNDcgNy4xNjM3MSAxNC4zOUM3LjE5NjggMTQuNDMzMSA3LjI0MDUyIDE0LjQ2NjcgNy4yOTA1NyAxNC40ODc3TDguOTEzNDcgMTUuMDcyN0M5LjE1ODc3IDE1LjE2NzEgOS40Nzk1NyAxNS4wMzUgOS40Nzk1NyAxNC44Mjc0TDkuNDc5NDIgMTAuNTQzN1pNOS40Nzk0MiAxLjc0OTc2QzkuNDc5NDIgMS42NTU0MSA5LjM4NTA3IDEuNTYxMDYgOS4yNTI5NyAxLjUyMzMxTDcuNjY3OTcgMC45MzgzMTFDNy40MDM4MiAwLjgyNTA2MSA3LjEwMTg3IDAuOTU3MTYxIDcuMTAxODcgMS4xNDU4NlY1LjQ0ODQxQzcuMTA5MzEgNS41MDIxNyA3LjEzMDYyIDUuNTUzMDcgNy4xNjM3MSA1LjU5NjA5QzcuMTk2OCA1LjYzOTEyIDcuMjQwNTIgNS42NzI3OCA3LjI5MDU3IDUuNjkzNzZMOC45MTM0NyA2LjI3ODc2QzkuMTU4NzcgNi4zNzMxMSA5LjQ3OTU3IDYuMjQxMDEgOS40Nzk1NyA2LjAzMzQxTDkuNDc5NDIgMS43NDk3NlpNNS40NzkxNyAxLjQxOTc2QzUuNDc5MTcgMS4zMjUzNiA1LjM4NDgyIDEuMjMxMDEgNS4yNTI3MiAxLjE5MzMxTDMuNjY3NzIgMC42MDgzMTFDMy40MDM1NyAwLjQ5NTA2MSAzLjEwMTYyIDAuNjI3MTYxIDMuMTAxNjIgMC44MTU4NjFWMTQuNTkxNEMzLjEwOTA1IDE0LjY0NTIgMy4xMzAzNiAxNC42OTYxIDMuMTYzNDUgMTQuNzM5MUMzLjE5NjU0IDE0Ljc4MjEgMy4yNDAyNyAxNC44MTU3IDMuMjkwMzIgMTQuODM2N0w0LjkxMzIyIDE1LjQyMTdDNS4xNTg1MiAxNS41MTYxIDUuNDc5MzIgMTUuMzg0IDUuNDc5MzIgMTUuMTc2NEw1LjQ3OTE3IDEuNDE5NzZaIiBmaWxsPSIjMEU2NDc2Ii8+Cjwvc3ZnPgo=&quot;) center center / contain no-repeat; background-blend-mode: initial; baseline-shift: initial; block-size: initial; border-block-end: initial; border-block-start: initial; border: none; border-radius: initial; border-collapse: initial; border-inline-end: initial; border-inline-start: initial; bottom: initial; box-shadow: initial; box-sizing: initial; break-after: initial; break-before: initial; break-inside: initial; buffered-rendering: initial; caption-side: initial; caret-color: initial; clear: initial; clip: initial; clip-path: initial; clip-rule: initial; color-interpolation: initial; color-interpolation-filters: initial; color-rendering: initial; columns: initial; column-fill: initial; gap: initial; column-rule: initial; column-span: initial; contain: initial; contain-intrinsic-size: initial; content: initial; content-visibility: initial; counter-increment: initial; counter-reset: initial; counter-set: initial; cursor: initial; cx: initial; cy: initial; d: initial; display: inline; dominant-baseline: initial; empty-cells: initial; fill: initial; fill-opacity: initial; fill-rule: initial; filter: initial; flex: initial; flex-flow: initial; float: initial; flood-color: initial; flood-opacity: initial; grid: initial; grid-area: initial; height: 16px; hyphens: initial; image-orientation: initial; image-rendering: initial; inline-size: initial; isolation: initial; left: 251px; letter-spacing: initial; lighting-color: initial; line-break: initial; list-style: initial; margin-block-end: initial; margin-block-start: initial; margin: initial; margin-inline-end: initial; margin-inline-start: initial; marker: initial; mask: initial; mask-type: initial; max-block-size: initial; max-height: initial; max-inline-size: initial; max-width: initial; min-block-size: initial; min-height: initial; min-inline-size: initial; min-width: 16px; mix-blend-mode: initial; object-fit: initial; object-position: initial; offset: initial; opacity: 1; order: initial; origin-trial-test-property: initial; orphans: initial; outline: initial; outline-offset: initial; overflow-anchor: initial; overflow-wrap: initial; overflow: initial; overscroll-behavior-block: initial; overscroll-behavior-inline: initial; overscroll-behavior: initial; padding-block-end: initial; padding-block-start: initial; padding: initial; padding-inline-end: initial; padding-inline-start: initial; page: initial; page-orientation: initial; paint-order: initial; perspective: initial; perspective-origin: initial; pointer-events: initial; position: absolute; quotes: initial; r: initial; resize: initial; right: initial; ruby-position: initial; rx: initial; ry: initial; scroll-behavior: initial; scroll-margin-block: initial; scroll-margin: initial; scroll-margin-inline: initial; scroll-padding-block: initial; scroll-padding: initial; scroll-padding-inline: initial; scroll-snap-align: initial; scroll-snap-stop: initial; scroll-snap-type: initial; shape-image-threshold: initial; shape-margin: initial; shape-outside: initial; shape-rendering: initial; size: initial; speak: initial; stop-color: initial; stop-opacity: initial; stroke: initial; stroke-dasharray: initial; stroke-dashoffset: initial; stroke-linecap: initial; stroke-linejoin: initial; stroke-miterlimit: initial; stroke-opacity: initial; stroke-width: initial; tab-size: initial; table-layout: initial; text-align: initial; text-align-last: initial; text-anchor: initial; text-combine-upright: initial; text-decoration: initial; text-decoration-skip-ink: initial; text-indent: initial; text-overflow: initial; text-shadow: initial; text-size-adjust: initial; text-transform: initial; text-underline-position: initial; top: 13px; touch-action: initial; transform: initial; transform-box: initial; transform-origin: initial; transform-style: initial; user-select: initial; vector-effect: initial; vertical-align: initial; visibility: visible; -webkit-app-region: initial; border-spacing: initial; -webkit-border-image: initial; -webkit-box-align: initial; -webkit-box-decoration-break: initial; -webkit-box-direction: initial; -webkit-box-flex: initial; -webkit-box-ordinal-group: initial; -webkit-box-orient: initial; -webkit-box-pack: initial; -webkit-box-reflect: initial; -webkit-font-size-delta: initial; -webkit-highlight: initial; -webkit-hyphenate-character: initial; -webkit-line-break: initial; -webkit-line-clamp: initial; -webkit-mask-box-image: initial; -webkit-mask: initial; -webkit-mask-composite: initial; -webkit-perspective-origin-x: initial; -webkit-perspective-origin-y: initial; -webkit-print-color-adjust: initial; -webkit-rtl-ordering: initial; -webkit-ruby-position: initial; -webkit-tap-highlight-color: initial; -webkit-text-combine: initial; -webkit-text-decorations-in-effect: initial; -webkit-text-emphasis: initial; -webkit-text-emphasis-position: initial; -webkit-text-fill-color: initial; -webkit-text-security: initial; -webkit-text-stroke: initial; -webkit-transform-origin-x: initial; -webkit-transform-origin-y: initial; -webkit-transform-origin-z: initial; -webkit-user-drag: initial; -webkit-user-modify: initial; white-space: initial; widows: initial; width: 16px; will-change: initial; word-break: initial; word-spacing: initial; x: initial; y: initial; z-index: auto;"></span>
                        </div>
                        <button class="button newsletter__button button--in-input button--icon" data-testid="submit-newsletter-button">
                            <svg class="icon">
                                <use xlink:href="https://m2.vechtsportonline.nl/static/version1600075943/frontend/Elgentos/vso/nl_NL//images/icons-sprite.svg#angle-right">
                                </use>
                            </svg>
                        </button>
                    </div>
                </form>

                <div class="m-t--1">
                    <div class="footer__trustedlogos">
                        <ul class="list footer__trustedlogos--list">
                            <li class="list__item footer__trustedlogos--item">
                                <a href="#>" target="_blank" class="link ">
                                    <img class="image footer__trustedlogos--image lazyload" src="https://images.prismic.io/vechtsportonline/1c54b451-0ace-4567-9f07-53ffda3b081b_Thuiswinkel_Waarborg_Kleur_Verticaal.png?auto=compress,format" data-src="https://images.prismic.io/vechtsportonline/1c54b451-0ace-4567-9f07-53ffda3b081b_Thuiswinkel_Waarborg_Kleur_Verticaal.png?auto=compress,format" alt="Thuiswinkel Waarborg" loading="lazy" />
                                </a>
                            </li>
                            <li class="list__item footer__trustedlogos--item">
                                <a href="#" class="link ">
                                    <img class="image footer__trustedlogos--image lazyload" src="https://images.prismic.io/vechtsportonline/8ed2f5b4-1e26-4e3b-bba6-985c778e44a8_Ecommerce_Europe_Trustmark.png?auto=compress,format" data-src="https://images.prismic.io/vechtsportonline/8ed2f5b4-1e26-4e3b-bba6-985c778e44a8_Ecommerce_Europe_Trustmark.png?auto=compress,format" alt="eCommerce Trustmark" loading="lazy" />
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-lg-12 col-xl-12">
                <div class="m-t--12">
                    <div class="footer__paymentlogos">
                        <ul class="list footer__paymentlogos--list">
                            <li class="list__item footer__paymentlogos--item">
                                <a href="#" class="link ">
                                    <img class="image footer__paymentlogos--image lazyload" src="https://images.prismic.io/vechtsportonline/82b0d09b-f7a2-419d-87b6-4508f69e2868_afterpay.svg?auto=compress,format" data-src="https://images.prismic.io/vechtsportonline/82b0d09b-f7a2-419d-87b6-4508f69e2868_afterpay.svg?auto=compress,format" alt="Afterpay" loading="lazy">
                                </a>
                            </li>
                            <li class="list__item footer__paymentlogos--item">
                                <a href="#" class="link ">
                                    <img class="image footer__paymentlogos--image lazyload" src="https://images.prismic.io/vechtsportonline/12f61279-baa1-4c03-bb82-b78185a44cf1_ideal.svg?auto=compress,format" data-src="https://images.prismic.io/vechtsportonline/12f61279-baa1-4c03-bb82-b78185a44cf1_ideal.svg?auto=compress,format" alt="iDeal" loading="lazy">
                                </a>
                            </li>
                            <li class="list__item footer__paymentlogos--item">
                                <a href="#" class="link ">
                                    <img class="image footer__paymentlogos--image lazyload" src="https://images.prismic.io/vechtsportonline/6afc1ec0-ca86-4109-9849-0a7b3f71a0e1_paypal.svg?auto=compress,format" data-src="https://images.prismic.io/vechtsportonline/6afc1ec0-ca86-4109-9849-0a7b3f71a0e1_paypal.svg?auto=compress,format" alt="PayPal" loading="lazy">
                                </a>
                            </li>
                            <li class="list__item footer__paymentlogos--item">
                                <a href="#" class="link ">
                                    <img class="image footer__paymentlogos--image lazyload" src="https://images.prismic.io/vechtsportonline/f9e5733b-0c4f-4285-b198-aa75512b77e6_maestro-2.svg?auto=compress,format" data-src="https://images.prismic.io/vechtsportonline/f9e5733b-0c4f-4285-b198-aa75512b77e6_maestro-2.svg?auto=compress,format" alt="Maestro" loading="lazy">
                                </a>
                            </li>
                            <li class="list__item footer__paymentlogos--item">
                                <a href="#" class="link ">
                                    <img class="image footer__paymentlogos--image lazyload" src="https://images.prismic.io/vechtsportonline/e407fd5d-a15e-43b8-a960-7ccce7d0f453_mastercard-4.svg?auto=compress,format" data-src="https://images.prismic.io/vechtsportonline/e407fd5d-a15e-43b8-a960-7ccce7d0f453_mastercard-4.svg?auto=compress,format" alt="Mastercard" loading="lazy">
                                </a>
                            </li>
                            <li class="list__item footer__paymentlogos--item">
                                <a href="#" class="link ">
                                    <img class="image footer__paymentlogos--image lazyload" src="https://images.prismic.io/vechtsportonline/20e84741-c887-40ca-a94d-998cb682a31b_visa.svg?auto=compress,format" data-src="https://images.prismic.io/vechtsportonline/20e84741-c887-40ca-a94d-998cb682a31b_visa.svg?auto=compress,format" alt="Visa" loading="lazy">
                                </a>
                            </li>
                            <li class="list__item footer__paymentlogos--item">
                                <a href="#" class="link ">
                                    <img class="image footer__paymentlogos--image lazyload" src="https://images.prismic.io/vechtsportonline/a5c7e872-d39d-4d26-b8c8-c575fc7f9474_mollie.svg?auto=compress,format" data-src="https://images.prismic.io/vechtsportonline/a5c7e872-d39d-4d26-b8c8-c575fc7f9474_mollie.svg?auto=compress,format" alt="Mollie" loading="lazy">
                                </a>
                            </li>
                            <li class="list__item footer__paymentlogos--item">
                                <a href="#link" class="link ">
                                    <img class="image footer__paymentlogos--image lazyload" src="https://images.prismic.io/vechtsportonline/e5f3b2a0-6257-45a5-84f4-635a5ccf182b_american-express-1.svg?auto=compress,format" data-src="https://images.prismic.io/vechtsportonline/e5f3b2a0-6257-45a5-84f4-635a5ccf182b_american-express-1.svg?auto=compress,format" alt="American Express" loading="lazy">
                                </a>
                            </li>
                            <li class="list__item footer__paymentlogos--item">
                                <a href="#" class="link ">
                                    <img class="image footer__paymentlogos--image lazyload" src="https://images.prismic.io/vechtsportonline/d614f6d8-cff4-4b54-8042-bfd1bef8d258_bancontact-mister-cash.svg?auto=compress,format" data-src="https://images.prismic.io/vechtsportonline/d614f6d8-cff4-4b54-8042-bfd1bef8d258_bancontact-mister-cash.svg?auto=compress,format" alt="Bancontant Mister Cash" loading="lazy">
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="footer__absolute-footer">
        <span class="colon colon--after">Copyright © 2020 Vechtsportonline.nl </span>
        <span class="colon colon--after"> <a class="link" href="https://m2.vechtsportonline.nl/algemene-voorwaarden">Algemene voorwaarden</a></span>
        <span class="colon colon--after"> <a class="link" href="https://m2.vechtsportonline.nl/disclaimer">Disclaimer</a> </span>
        <span class="colon colon--after"> <a class="link" href="https://m2.vechtsportonline.nl/privacy-veiligheid">
                Privacy Policy </a></span> </div>
</footer>
<div class="page-product-bundle">
<div class="page-wrapper">
    {{ render '@header' }}

    <div class="product-view container">
        {{render '@breadcrumbs' }}

        <div class="product-view__wrapper">
            <div class="product-view__gallery">
                {{ render '@gallery' }}
            </div>

            <div class="product-view__product-information">
                <div class="product-view__stock-information">
                    <div
                        class="
                            product-view__stock-status
                            {{#if stock.inStock}}
                                product-view__stock-status--in-stock
                            {{/if}}
                            {{#if stock.deliveryTime}}
                                product-view__stock-status--delivery-time
                            {{/if}}
                            {{#if stock.outOfStock}}
                                product-view__stock-status--out-of-stock
                            {{/if}}
                        "
                        >
                        {{#if stock.inStock}}
                            {{{ stock.inStockLabel }}}
                        {{/if}}
                        {{#if stock.deliveryTime}}
                            {{{ stock.deliveryTimeLabel }}}
                        {{/if}}     
                        {{#if stock.outOfStock}}
                            {{{ stock.outOfStockLabel }}}
                        {{/if}}                           
                    </div>
                </div>

                <div class="product-view__main-information">
                    <h1 class="heading heading--first-level product-view__title">
                        {{{ title }}}
                    </h1>

                    <div class="product-view__description">
                        {{{ description }}}
                    </div>
                </div>

                <div class="product-view__actions">                
                    <div class="product-view__options">
                        <div class="product-view__price">
                            {{ render (component price.content) price.contentContext }}
                        </div>                                       

                        {{!-- (NEW) CODE --}}
                        <div class="product-view__customization">
                            {{ render '@bundle-option' }}
                            {{ render '@bundle-option--checkbox' }}
                            {{ render '@bundle-option--select' }}
                        </div>

                        <div class="product-view__size-selection">
                            <div class="product-view__size-selection--icon">
                            {{ render '@icon' sizeIcon.icon }}
                            </div>
                            {{ render '@select--super_attribute' }}
                        </div>
                    </div>

                    <div class="product-view__cart-actions">      
                        <div class="product-view__qty">
                            {{ render '@quantity-update' }}
                        </div>
                    
                        <div class="product-view__add-to-cart">
                            {{ render '@button--icon' button }}
                        </div>                                     
                    </div>
                    {{!-- (NEW) CODE --}}
                    <div class="product-view__summary">
                        <div class="product-view__summary-price">
                            {{ render '@price' price merge=true }}
                            <span class="product-view__summary-unit">
                                {{ priceUnit }}
                            </span>
                        </div>
                        <div class="product-view__summary-title">
                            {{ summaryTitle }}
                        </div>
                        <ul class="product-view__summary-list list">
                            {{#each summaries as |summary|}}
                                <li class="product-view__summary-item list__item">
                                    <span class="product-view__summary-item-title">
                                        {{ summary.title }}
                                    </span>

                                    {{ summary.item }}
                                </li>
                            {{/each}}
                        </ul>
                    </div>
                </div>

                <div class="product-view__usps">
                    {{ render '@brief-info' briefInfo }}
                </div>
            </div>

             {{!-- tabs --}}
            <div class="product-view__tabs">
                {{ render '@tab' tab }}
            </div>

            {{!-- related products --}}
            <div class="product-view__side-products--related">
                <h3 class="product-view__side-products--heading"> {{ relatedProducts.heading }} </h3>
                <div class="row">
                    <div class="col-md-6">
                        {{ render '@catalog-item' }}
                    </div>
                    <div class="col-md-6">
                        {{ render '@catalog-item' }}
                    </div>  
                </div>
            </div>

            {{!-- Bundles --}}
            <div class="product-view__side-products--bundles">
                <h3 class="product-view__side-products--heading"> {{ bundleProducts.heading }} </h3>

                <div class="row">
                    <div class="col-md-6">
                        {{ render '@catalog-item' }}
                    </div>
                    <div class="col-md-6">
                        {{ render '@catalog-item' }}
                    </div> 
                </div>
            </div>
        </div>
    </div>
</div>
</div>
{{ render '@footer' }}
{
  "breadcrumbs": {
    "class": "product-view__breadcrumbs",
    "categories": [
      {
        "name": "Home",
        "href": "#",
        "ariaLabel": "Breadcrumb Home"
      },
      {
        "name": "Women",
        "href": "#",
        "ariaLabel": "Breadcrumb Women"
      },
      {
        "name": "Tops",
        "href": "#",
        "ariaLabel": "Breadcrumb Tops"
      },
      {
        "name": "Jackets",
        "href": "#",
        "ariaLabel": "Breadcrumb Jackets"
      }
    ]
  },
  "title": "UFC MMA Gloves zonder duim - Zwart/Wit",
  "sku": {
    "label": "SKU",
    "value": "WSH09"
  },
  "price": {
    "content": "price--with-special-price",
    "regularPrice": "92.00"
  },
  "stock": {
    "inStock": false,
    "inStockLabel": "Direct leverbaar",
    "deliveryTime": false,
    "deliveryTimeLabel": "3-5 werkdagen",
    "outOfStock": true,
    "outOfStockLabel": "Uitverkocht"
  },
  "description": "Customize Ingrid Running Jacket with Long Sleaves",
  "productDetails": {
    "id": "productdetails",
    "listTag": "ul",
    "elementTag": "li",
    "class": "productdetails-list",
    "title": "Details",
    "elements": [
      {
        "text": "Officiële wedstrijdhandschoenen"
      },
      {
        "text": "Extra lange klittenbandsluiting"
      },
      {
        "text": "Soepel model"
      },
      {
        "text": "Perfecte grip"
      },
      {
        "text": "Open binnenkant"
      }
    ]
  },
  "button": {
    "tag": "button",
    "class": "product-view__add-to-cart-btn",
    "attributes": "type=\"button\"",
    "icon": {
      "id": "custom-cart",
      "title": "custom-cart",
      "class": "button__icon"
    },
    "text": "In winkelwagen"
  },
  "sizeIcon": {
    "class": "size-icon",
    "icon": {
      "id": "size",
      "title": "Size",
      "class": "size-icon"
    }
  },
  "listIcon": {
    "listTag": "ul",
    "elementTag": "li",
    "class": "list--with-icon list--horizontal product-view__list",
    "elements": [
      {
        "iconClass": "product-view__icon",
        "icon": "facebook"
      },
      {
        "iconClass": "product-view__icon",
        "icon": "pinterest"
      },
      {
        "iconClass": "product-view__icon",
        "icon": "instagram"
      },
      {
        "iconClass": "product-view__icon",
        "icon": "mail"
      }
    ]
  },
  "tab": {
    "script": true,
    "class": "product-view__tab",
    "icon": {
      "id": "angle-down",
      "title": "Arrow down",
      "class": "tab__icon"
    },
    "tabs": [
      {
        "active": true,
        "tabId": "tab-1",
        "title": "Extra informatie",
        "content": "Deze leren wedstrijdhandschoenen van UFC zijn de enige handschoenen die gedragen mogen worden door de UFC vechters in Octagon. <br/> De UFC Official Pro MMA Handschoenen zijn gemaakt van zeer duurzaam leer. <br/> De handschoenen zijn licht voorgevormd waardoor je makkelijk je handen buigt. <br/> De extra lange klittenbandsluiting biedt optimale bescherming voor je polsen. <br/> De binnenkant van de handschoen is open, dit biedt perfecte grip tijdens het vastpakken van je tegenstander. <br/> Details <br/> Officiële wedstrijdhandschoenen <br/> Extra lange klittenbandsluiting <br/> Soepel model <br/> Perfecte grip <br/> Open binnenkant",
        "class": "tab__title--active",
        "contentClass": "tab__content--active"
      },
      {
        "tabId": "tab-2",
        "title": "Reviews (34)",
        "contentElement": "product-review"
      }
    ]
  },
  "relatedProducts": {
    "heading": "Gerelateerde producten"
  },
  "priceUnit": "/ bundle",
  "summaryTitle": "Summary:",
  "summaries": [
    {
      "title": "Sprite Stasis Ball:",
      "item": "1 x Sprite Stasis Ball 55 cm"
    },
    {
      "title": "Sprite Yoga Strap:",
      "item": "1 x Sprite Yoga Strap 6 foot"
    },
    {
      "title": "Sprite Foam Roller:",
      "item": "1 x Sprite Foam Roller"
    }
  ]
}
  • Content:
    $product-view__add-to-cart-margin-right                : $spacer--medium !default;
    
    $product-view__base-elements-vertical-spacing          : $spacer !default;
    
    $product-view__title-font-size                         : 35px !default;
    
    $product-view__col-base-spacing                        : $spacer--medium !default;
    $product-view__col-base-reduce-width                   : $product-view__col-base-spacing / 2 !default;
    $product-view__col-left-base-width                     : 50% !default;
    $product-view__col-left-width                          : calc(#{$product-view__col-left-base-width} - #{$product-view__col-base-reduce-width}) !default;
    $product-view__col-right-base-width                    : 100% - #{$product-view__col-left-base-width} !default;
    $product-view__col-right-width                         : calc(#{$product-view__col-right-base-width} - #{$product-view__col-base-reduce-width}) !default;
    
    $product-view__inner-padding                           : $spacer--semi-large !default;
    $product-view__inner-margin                            : $spacer--semi-large !default;
    $product-view__description-color                       : $gray-darker !default;
    $product-view__description-margin                      : 0 $spacer--medium $spacer--medium !default;
    $product-view__description-margin\@medium              : 0 0 $spacer--medium !default;
    $product-view__description-padding                     : $spacer--medium !default;
    $product-view__description-padding\@medium             : 0 0 20px 0 !default;
    $product-view__description-border-top                  : 1px solid $gray-light !default;
    $product-view__description-border-bottom               : 1px solid $gray-lighter !default;
    $product-view__description-line-height                 : 1.7 !default;
    $product-view__description-title-font-weight           : $font-weight-bold !default;
    $product-view__description-bundle-margin               : 0 !default;
    $product-view__description-bundle-padding              : $spacer--medium 0 !default;
    
    $product-view__add-to-cart-margin                      : 0 0 $spacer 0 !default;
    $product-view__add-to-cart-margin\@large               : 0 $spacer--medium 0 0 !default;
    $product-view__add-to-cart-btn-min-width               : 150px !default;
    $product-view__add-to-cart-btn-padding\@large          : 0 $spacer--large !default;
    $product-view__add-to-cart-button-width                : 100% !default;
    
    $product-view__update-wishlist-btn-width               : auto !default;
    
    $product-view__gallery-bottom-border                   : 1px solid $gray !default;
    $product-view__gallery-bottom-border\@medium           : none !default;
    $product-view__gallery-margin-bottom                   : $spacer--medium !default;
    $product-view__gallery-margin-bottom\@medium           : 0 !default;
    $product-view__gallery-padding-bottom                  : $spacer !default;
    
    $product-view__usps-padding                            : 0 20px !default;
    $product-view__usps-padding\@medium                    : 0 !default;
    
    $product-view__cart-actions-margin-bottom              : 23px !default;
    
    $product-view__main-information-bottom-spacing         : $spacer--medium !default;
    
    $product-view__order-gallery                           : 1 !default;
    $product-view__order-main-information                  : 2 !default;
    $product-view__order-actions                           : 3 !default;
    
    $product-view__price-bottom-margin                     : $spacer--medium !default;
    $product-view__price-bottom-margin\@medium             : 0 !default;
    $product-view__price-color                             : $gray-darker !default;
    $product-view__price-color--old                        : $gray !default;
    $product-view__price-color--special                    : $gray-darker !default;
    $product-view__price-font-size                         : $font-size-large !default;
    $product-view__price-font-weight                       : $font-weight-bold !default;
    $product-view__price-label-font-weight                 : $font-weight-normal !default;
    
    $product-view__qty-margin-right\@small                 : $spacer--medium !default;
    
    $product-view__stock-color--out-of-stock               : $red !default;
    $product-view__stock-color--in-stock                   : $white !default;
    $product-view__stock-color--in-stock-custom            : $white !default;
    $product-view__stock-color--delivery-time              : $gray-color !default;
    $product-view__stock-font-weight\@medium               : $font-weight-bold !default;
    $product-view__stock-font-family                       : $font-family-saira !default;
    $product-view__stock-text-transform\@medium            : uppercase !default;
    
    $product-view__side-products--heading-font-size                : 18px !default;
    $product-view__side-products--heading-font-size-weight         : $font-weight-base !default;
    $product-view__side-products--heading-font-family              : $font-family-saira !default;
    $product-view__side-products--heading-text-transform           : capitalize !default;
    
    $product-view__wrapper-margin                          : $spacer--medium 0 $spacer--large 0 !default;
    $product-view__wrapper-margin\@medium                  : 0 0 40px 0 !default;
    
    .product-view {
        &__wrapper {
            padding: 15px 10px;
            width: 100%;
    
            @include mq($screen-m) {
                padding: 0;
                display: grid;
                grid-gap: 1rem;
                grid-template-areas:
                "details-main sidebar"
                "details-secondary sidebar"
                "related-products related-products";
                grid-template-columns: minmax(50%, 50%);
            }
    
            @include mq($screen-l) {
                grid-template-columns: minmax(55%, 45%);
            }
        }
    
        &__details-main {
            grid-area: details-main;
        }
    
        &__sidebar {
            grid-area: sidebar;
    
            &--inner {
                position: sticky;
                top: 1rem;
            }
        }
    
        &__details-secondary {
            grid-area: details-secondary;
        }
    
        &__related-products {
            grid-area: related-products;
        }
    
        &__gallery {
            order: $product-view__order-gallery;
            padding-bottom: $product-view__gallery-padding-bottom;
            margin-bottom: $product-view__gallery-margin-bottom;
    
            @include mq($screen-m) {
                border-bottom: $product-view__gallery-bottom-border\@medium;
                margin-bottom: $product-view__gallery-margin-bottom\@medium;
                flex-basis: 50%;
            }
        }
    
        &__product-information {
            background: $white;
            margin-bottom: 25px;
            position: relative;
            @include mq($screen-m) {
                padding: 0 16px;
            }
    
            @include mq($screen-m) {
                box-shadow: 0 0 35px rgba(0, 0, 0, 0.15);
                border-radius: $border-radius;
                max-width: 549px;
                margin-left: 25px;
                margin-bottom: 0;
                padding: 0;
                flex-basis: calc(50% - 25px);
            }
        }
    
        &__stock-information {
            margin-bottom: 20px;
            width: 100%;
    
            @include mq($screen-m) {
                padding: 0;
                display: flex;
                flex-direction: row-reverse;
            }
            & .custom__stock_status {
                align-items: center;
                display: flex;
                padding-left: $spacer--1;
                font-family: $font-family-saira;
                color: $gray;
            }
        }
    
        &__stock-status {
            font-family: $product-view__stock-font-family;
    
            &--in-stock {
                background: $green;
                color: $product-view__stock-color--in-stock;
                padding: 4px;
                border-radius: $border-radius;
                width: fit-content;
                display: inline-flex;
                align-content: space-around;
                align-items: center;
                &.hidden {
                    display: none;
                }
                .icon {
                    fill: #fff;
                    margin: 0 10px;
                }
                & .custom__stock_status {
                    margin-right: 10px;
                    color: $product-view__stock-color--in-stock-custom;
                }
            }
            &--delivery-time {
                color: $product-view__stock-color--delivery-time;
            }
            &--alert {
                background: $product-view__stock-color--out-of-stock;
                color: $product-view__stock-color--in-stock;
                padding: 4px;
                border-radius: $border-radius;
                width: fit-content;
            }
        }
    
        &__main-information {
            @include mq($screen-m) {
                margin: 0 $product-view__inner-margin;
                padding: 0;
                border-bottom: 1px solid #e6e6e6;
            }
            .product-view__description {
                & h1,
                & h2 {
                    display: none;
                }
            }
        }
    
        &__actions {
            margin-top: $product-view__inner-margin;
            display: flex;
            flex-direction: column;
    
            @include mq($screen-m) {
                margin: $product-view__inner-padding;
                padding: 0;
            }
    
    
            .paymenticons__product--list {
                justify-content: space-between;
            }
        }
        .amrelated-pack-wrapper {
    
            @include mq($screen-m) {
                padding: 0 2.5rem 2.5rem;
                margin-top: -2.5rem;
            }
            .amrelated-title {
                padding-left: 0;
                padding-right: 0;
            }
            .amrelated-content-wrapper {
                margin: 0;
                padding: 0;
                background: #fff;
                border-radius: 4px;
    
                .amrelated-summary-content {
                    .amrelated-price-wrapper {
                        font-size: 16px;
                        border: 0;
                        height: auto;
                        padding: 1rem 0 0.5rem;
                        .amrelated-discount.-summary {
                            display: none;
                            transform: none;
                            padding: 10px 0 0;
                            font-size: 16px;
                            line-height: 16px;
                            background: transparent;
                            color: #000;
                        }
                        .main.price {
                            font-size: 26px;
                            line-height: 26px;
                            color: red;
                            font-family: "Saira", sans-serif;
                            justify-content: flex-end;
                            display: flex;
                            width: 100%;
                            padding: 0 0 10px;
                        }
                    }
                }
                .amrelated-pack-list {
                    .amrelated-pack-item.-wide {
                        margin: 0;
                        padding: 0;
                        border: 0;
                        .amrelated-info {
                            padding: 10px;
                            .amrelated-photo-container {
                                margin: 0;
                            }
                        }
                    }
                    .amrelated-info {
                        padding: 0;
    
                        .amrelated-details {
                            padding: 20px 0;
                            .price-box {
                                text-align: right;
                            }
                        }
                        .amrelated-photo-container {
                            width: 150px;
                            height: auto;
                            max-width: 150px;
                            max-height: 150px;
                            .amrelated-label {
                                left: 0;
                            }
                            .amrelated-discount.-product {
                                top: 10px;
                                padding: 0 5px;
                            }
                            .amrelated-link {
                                width: max-content;
                                display: block;
                                height: 100%;
                            }
                        }
                    }
                }
                .amrelated-summary-content {
                    justify-content: space-between;
                    align-items: center;
                }
            }
        }
    
        &__title {
            width: 100%;
            font-family: $font-family-saira-bold;
            margin-bottom: $product-view__base-elements-vertical-spacing;
            text-transform: none;
            font-size: 25px;
            line-height: 105%;
    
            @include mq($screen-m) {
                font-size: $product-view__title-font-size;
                padding-top: $product-view__inner-padding;
            }
    
            .heading--page {
                span {
                    margin: 0;
                    text-transform: none;
                    font-family: $font-family-saira-bold;
                }
            }
        }
    
        &__description {
            font-family: $font-family-saira;
            font-size: $font-size-base;
            padding: 5px 0 20px;
            order: 1;
            color: $product-view__description-color;
            width: 100%;
            border-bottom: 0;
    
            & p {
                color: $product-view__description-color;
            }
        }
    
        &__description-bundle {
            order: 0;
            margin: $product-view__description-bundle-margin;
            padding: $product-view__description-bundle-padding;
        }
    
        &__description-title {
            font-weight: $product-view__description-title-font-weight;
        }
    
        &__options {
            display: flex;
            flex-direction: row;
            justify-content: space-between;
        }
    
        &__price {
            font-size: $product-view__price-font-size;
            font-weight: $product-view__price-font-weight;
            margin-bottom: $product-view__price-bottom-margin;
            display: flex;
            flex-basis: 30%;
    
            & .price__value--special {
                font-size: 22px;
                font-weight: $font-weight-semibold;
    
                @include mq($screen-l) {
                    font-size: 26px;
                }
            }
            & .price__value--old {
                font-size: 12px;
                display: inline !important; // sass-lint:disable-line no-important
                @include mq($screen-l) {
                    font-size: 16px;
                }
            }
            .price-label {
                display: none;
            }
        }
    
        &__size-selection {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            flex-basis: 65%;
    
            & .select {
                width: 100%;
            }
            & label.label {
                display: none;
            }
    
            & option:disabled {
                color: $gray-light;
            }
    
            &--icon {
                fill: $red;
                flex: auto;
                & .size-icon {
                    margin: 0 auto;
                }
            }
            .product-options-wrapper {
                margin-bottom: 1rem;
                width: 100%;
                select {
                    color: rgba(0, 0, 0, 0.5);
                    width: 100%;
                    appearance: none;
                    outline: 0;
                    border: 0;
                    position: relative;
                    padding: 0 3rem 0 1rem;
                    height: 47px;
                    background-color: #ecf5f4;
                    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik00LjU0MDM4IDUuOTU5MTdDNC43OTQyMiA2LjIxMzAxIDUuMjA1NzggNi4yMTMwMSA1LjQ1OTYyIDUuOTU5MTdMOS41OTYxOSAxLjgyMjU5QzkuODUwMDMgMS41Njg3NSA5Ljg1MDAzIDEuMTU3MTkgOS41OTYxOSAwLjkwMzM1NEM5LjM0MjM1IDAuNjQ5NTEzIDguOTMwOCAwLjY0OTUxMyA4LjY3Njk2IDAuOTAzMzU0TDUgNC41ODAzMUwxLjMyMzA1IDAuOTAzMzU0QzEuMDY5MiAwLjY0OTUxMyAwLjY1NzY0NyAwLjY0OTUxMyAwLjQwMzgwNiAwLjkwMzM1NEMwLjE0OTk2NiAxLjE1NzE5IDAuMTQ5OTY1IDEuNTY4NzUgMC40MDM4MDYgMS44MjI1OUw0LjU0MDM4IDUuOTU5MTdaTTQuMzUgNUw0LjM1IDUuNDk5NTVMNS42NSA1LjQ5OTU1TDUuNjUgNUw0LjM1IDVaIiBmaWxsPSJibGFjayIvPgo8L3N2Zz4K);
                    background-repeat: no-repeat;
                    background-position: right 1rem top 50%, 0 0;
                    background-size: auto, auto;
                    border-radius: 3px;
                    font-family: "Saira", sans-serif;
                    font-size: 16px;
                    color: #000;
                }
            }
        }
        &__sizechart {
            margin-right: 10px;
            border: 1px solid #e2f0ef;
            border-radius: 3px;
            max-width: 47px;
            width: 100%;
            height: 47px;
            display: flex;
            align-items: center;
    
            & ~ .select {
                max-width: calc(100% - 57px);
            }
        }
        &__cart-actions {
            margin-bottom: $product-view__cart-actions-margin-bottom;
            display: flex;
            flex-direction: row;
            justify-content: space-between;
        }
    
        &__qty {
            display: flex;
            flex-direction: row;
            flex-basis: 30%;
            border-radius: $border-radius;
            background: #ecf5f4;
            padding: 7px 10px;
            height: 48px;
    
            .quantity-update {
                &__input {
                    border: 5px solid $white;
                    width: 100%;
    
                    & .icon {
                        fill: $white;
                    }
                }
    
                &__button {
                    background: $red;
                    color: $white;
                }
            }
        }
    
        &__add-to-cart {
            display: flex;
            flex-basis: 65%;
            .button {
                background-color: $color-button-darker;
                opacity: 1;
                font-weight: 300;
                flex-direction: row;
    
                &:hover {
                    background-color: $color-button-hover;
                    opacity: 1;
                }
                .icon {
                    margin-left: 15px;
                    width: 18px;
                    height: 18px;
                }
            }
        }
    
        &__add-to-cart-btn,
        &__update-cart-btn {
            display: flex;
            flex-direction: row-reverse;
            font-family: $font-family-saira;
            font-style: normal;
            text-transform: capitalize;
            width: 100% !important; //sass-lint:disable-line no-important
            border-radius: $border-radius--small;
    
            & .button__icon {
                margin-right: 15px;
            }
        }
    
        &__usps {
            border-radius: 0 0 4px 4px;
    
            @include mq($screen-m) {
                background: rgba(236, 245, 244, 0.5);
                display: flex;
                padding: 20px $product-view__inner-padding;
            }
        }
    
        &__tabs {
            @include mq($screen-m) {
                margin-top: $product-view__inner-padding;
            }
    
            @include mq($screen-l) {
                margin-top: 0;
            }
        }
    
        &__tab {
            .tab__content {
                line-height: $product-view__description-line-height;
            }
        }
    
        &__related-products {
            margin-bottom: 60px;
    
            &--row {
                display: flex;
                flex-direction: column;
                flex-wrap: wrap;
    
                @include mq($screen-s) {
                    flex-direction: row;
                }
            }
    
            &--col {
                display: flex;
                flex-direction: column;
                max-width: calc(50% - #{$product-view__inner-padding});
    
                @include mq($screen-m) {
                    margin: 15px;
                }
            }
        }
    
        &__bundle-pack {
            background-color: #ecf5f4;
            width: 100%;
            margin-top: 16px;
            padding-bottom: 40px;
        }
    
        &__products-heading {
            font-family: $product-view__side-products--heading-font-family;
            font-size: $product-view__side-products--heading-font-size;
            font-weight: $product-view__side-products--heading-font-size-weight;
            text-transform: $product-view__side-products--heading-text-transform;
            padding: 20px 0;
            margin: 0 5px;
        }
    
        & .catalog-item {
            margin: 5px 5px;
    
            @include mq($screen-m) {
                margin: 0;
            }
        }
    }
    .page-product-bundle {
        .product-view {
            &__options {
                flex-direction: column;
            }
    
            .product-options-wrapper {
                width: 100%;
            }
    
            &__customization {
                display: flex;
                flex-direction: column;
    
                .bundle-option {
                    display: flex;
                    flex-direction: column;
                    &__qty {
                        margin: 0 0 16px;
                    }
                }
            }
    
            &__qty {
                width: 35%;
            }
    
            &__price {
                width: 65%;
                order: 2;
            }
    
            &__summary {
                padding: $product-view__inner-padding;
            }
        }
    }
    
  • URL: /components/raw/product-view/_product-view.scss
  • Filesystem Path: build/components/04-views/product-view/_product-view.scss
  • Size: 20.4 KB

There are no notes for this item.