<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'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==" 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==" 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__main-details">
<h1 class="heading heading--first-level product-view__title">
UFC MMA Gloves zonder duim - Zwart/Wit
</h1>
<span class="product-view__sku">
SKU WSH09
</span>
<div class="
product-view__stock-status
product-view__stock-status--out-of-stock
">
</div>
<div class="product-view__rating">
<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>
<div class="product-view__secondary-details">
<table class="table product-view__grouped-table" tabindex="0" role="table">
<caption class="table__caption">
Grouped product items
</caption>
<thead>
<tr role="row">
<th class="" scope="col" role="columnheader">
Product Name
</th>
<th class="product-view__grouped-col-qty" scope="col" role="columnheader">
Qty
</th>
</tr>
</thead>
<tbody>
<tr role="row">
<td class="" data-th="Product Name:" role="gridcell">
<span class="product-view__grouped-product-name">Sprite Yoga Strap 6 foot</span><span>$14.00</span>
</td>
<td class="" data-th="Qty:" role="gridcell">
<div class="input product-view__grouped-qty">
<span class="form-check" aria-label="form-check-field-id-1">
<svg class="icon " role="img">
<title>Angle down icon</title>
<use xlink:href="/images/icons-sprite.svg#angle-down"></use>
</svg>
</span>
<label class="
label
label--hidden
" for="field-id-1">
Qty
</label>
<input class="input__field " id="field-id-1" name="field-name-1" type="number" placeholder="" min="0" value="0">
</div>
</td>
</tr>
<tr role="row">
<td class="" data-th="Product Name:" role="gridcell">
<span class="product-view__grouped-product-name">Sprite Yoga Strap 8 foot</span><span>$17.00</span>
</td>
<td class="" data-th="Qty:" role="gridcell">
<div class="input product-view__grouped-qty">
<span class="form-check" aria-label="form-check-field-id-1">
<svg class="icon " role="img">
<title>Angle down icon</title>
<use xlink:href="/images/icons-sprite.svg#angle-down"></use>
</svg>
</span>
<label class="
label
label--hidden
" for="field-id-1">
Qty
</label>
<input class="input__field " id="field-id-1" name="field-name-1" type="number" placeholder="" min="0" value="0">
</div>
</td>
</tr>
<tr role="row">
<td class="" data-th="Product Name:" role="gridcell">
<span class="product-view__grouped-product-name">Sprite Yoga Strap 10 foot</span><span>$21.00</span>
</td>
<td class="" data-th="Qty:" role="gridcell">
<div class="input product-view__grouped-qty">
<span class="form-check" aria-label="form-check-field-id-1">
<svg class="icon " role="img">
<title>Angle down icon</title>
<use xlink:href="/images/icons-sprite.svg#angle-down"></use>
</svg>
</span>
<label class="
label
label--hidden
" for="field-id-1">
Qty
</label>
<input class="input__field " id="field-id-1" name="field-name-1" type="number" placeholder="" min="0" value="0">
</div>
</td>
</tr>
</tbody>
</table>
<div class="product-view__main-actions">
<div class="product-view__action-elements">
<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 class="product-view__extra-actions">
</div>
</div>
</div>
<div class="product-view__information">
<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>
<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__slider">
<h3 class="heading">
Gerelateerde producten
</h3>
<div class="slider " data-rewind="true" data-enable-mouse-events="true" data-slides-to-scroll="1">
<div class="slider__handler">
<div class="slider__slides">
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/8weapons.jpg" data-src="" alt="8weapons">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/adidas.jpg" data-src="" alt="adidas">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/booster.jpg" data-src="" alt="booster">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/ernestohoost.jpg" data-src="" alt="ernestehoost">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/essimo.jpg" data-src="" alt="essimo">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/hayabusa.jpg" data-src="" alt="hayabusa">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/joya.jpg" data-src="" alt="joya">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/kingpro.jpg" data-src="" alt="kingpro">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/matsuru.jpg" data-src="" alt="matsuru">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/nike.jpg" data-src="" alt="nike">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/queen.jpg" data-src="" alt="queen">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/ringhorns.jpg" data-src="" alt="ringhorns">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/safejawz.jpg" data-src="" alt="safejawz">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/shockdoctor.jpg" data-src="" alt="shockdoctor">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/superpro.jpg" data-src="" alt="superpro">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/tapout.jpg" data-src="" alt="tapout">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/tufwear.jpg" data-src="" alt="tufwear">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/tunturi.jpg" data-src="" alt="tunturi">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/twinsspecial.jpg" data-src="" alt="twinsspecial">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/ufc.jpg" data-src="" alt="ufc">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/venum.jpg" data-src="" alt="venum">
</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="/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="/images/icons-sprite.svg#angle-right"></use>
</svg>
</button>
</div>
</div>
<script src="/components/raw/slider/slider.js"></script>
</div>
<div class="product-view__slider">
<h3 class="heading">
</h3>
<div class="slider " data-rewind="true" data-enable-mouse-events="true" data-slides-to-scroll="1">
<div class="slider__handler">
<div class="slider__slides">
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/8weapons.jpg" data-src="" alt="8weapons">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/adidas.jpg" data-src="" alt="adidas">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/booster.jpg" data-src="" alt="booster">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/ernestohoost.jpg" data-src="" alt="ernestehoost">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/essimo.jpg" data-src="" alt="essimo">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/hayabusa.jpg" data-src="" alt="hayabusa">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/joya.jpg" data-src="" alt="joya">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/kingpro.jpg" data-src="" alt="kingpro">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/matsuru.jpg" data-src="" alt="matsuru">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/nike.jpg" data-src="" alt="nike">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/queen.jpg" data-src="" alt="queen">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/ringhorns.jpg" data-src="" alt="ringhorns">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/safejawz.jpg" data-src="" alt="safejawz">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/shockdoctor.jpg" data-src="" alt="shockdoctor">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/superpro.jpg" data-src="" alt="superpro">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/tapout.jpg" data-src="" alt="tapout">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/tufwear.jpg" data-src="" alt="tufwear">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/tunturi.jpg" data-src="" alt="tunturi">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/twinsspecial.jpg" data-src="" alt="twinsspecial">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/ufc.jpg" data-src="" alt="ufc">
</div>
</div>
<div class="slider__item ">
<div class="lazyload-wrapper ">
<img class="image lazyload " src="/images/brands/venum.jpg" data-src="" alt="venum">
</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="/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="/images/icons-sprite.svg#angle-right"></use>
</svg>
</button>
</div>
</div>
<script src="/components/raw/slider/slider.js"></script>
</div>
<div class="additional-content ">
<picture class="image additional-content__image">
<source data-srcset="/images/product-view/banner.jpg" media="(min-width: 768px)" />
<img class="lazyload " src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" data-src="" alt="image alt text" />
</picture>
<div class="additional-content__info ">
<div class="additional-content__section ">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.</p>
</div>
<div class="additional-content__section ">
<p>It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</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"> <</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 &
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("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEzLjUgNS4yODgxMUMxMy41IDUuMTkzNzYgMTMuNDA1NyA1LjA5OTQxIDEzLjI3MzYgNS4wNjE2NkwxMS42ODg2IDQuNDc2NjZDMTEuNDI0NCA0LjM2MzQxIDExLjEyMjUgNC40OTU1MSAxMS4xMjI1IDQuNjg0MjZWMTEuNTgxN0MxMS4xMjk5IDExLjYzNTUgMTEuMTUxMiAxMS42ODY0IDExLjE4NDMgMTEuNzI5NEMxMS4yMTc0IDExLjc3MjQgMTEuMjYxMSAxMS44MDYxIDExLjMxMTIgMTEuODI3MUwxMi45MzQxIDEyLjQxMjFDMTMuMTc5NCAxMi41MDY0IDEzLjUwMDIgMTIuMzc0MyAxMy41MDAyIDEyLjE2NjdMMTMuNSA1LjI4ODExWk05LjQ3OTQyIDEwLjU0MzdDOS40Nzk0MiAxMC40NDk0IDkuMzg1MDcgMTAuMzU1IDkuMjUyOTcgMTAuMzE3M0w3LjY2Nzk3IDkuNzMyMjZDNy40MDM4MiA5LjYxOTAxIDcuMTAxODcgOS43NTExMSA3LjEwMTg3IDkuOTM5ODFWMTQuMjQyNEM3LjEwOTMxIDE0LjI5NjEgNy4xMzA2MiAxNC4zNDcgNy4xNjM3MSAxNC4zOUM3LjE5NjggMTQuNDMzMSA3LjI0MDUyIDE0LjQ2NjcgNy4yOTA1NyAxNC40ODc3TDguOTEzNDcgMTUuMDcyN0M5LjE1ODc3IDE1LjE2NzEgOS40Nzk1NyAxNS4wMzUgOS40Nzk1NyAxNC44Mjc0TDkuNDc5NDIgMTAuNTQzN1pNOS40Nzk0MiAxLjc0OTc2QzkuNDc5NDIgMS42NTU0MSA5LjM4NTA3IDEuNTYxMDYgOS4yNTI5NyAxLjUyMzMxTDcuNjY3OTcgMC45MzgzMTFDNy40MDM4MiAwLjgyNTA2MSA3LjEwMTg3IDAuOTU3MTYxIDcuMTAxODcgMS4xNDU4NlY1LjQ0ODQxQzcuMTA5MzEgNS41MDIxNyA3LjEzMDYyIDUuNTUzMDcgNy4xNjM3MSA1LjU5NjA5QzcuMTk2OCA1LjYzOTEyIDcuMjQwNTIgNS42NzI3OCA3LjI5MDU3IDUuNjkzNzZMOC45MTM0NyA2LjI3ODc2QzkuMTU4NzcgNi4zNzMxMSA5LjQ3OTU3IDYuMjQxMDEgOS40Nzk1NyA2LjAzMzQxTDkuNDc5NDIgMS43NDk3NlpNNS40NzkxNyAxLjQxOTc2QzUuNDc5MTcgMS4zMjUzNiA1LjM4NDgyIDEuMjMxMDEgNS4yNTI3MiAxLjE5MzMxTDMuNjY3NzIgMC42MDgzMTFDMy40MDM1NyAwLjQ5NTA2MSAzLjEwMTYyIDAuNjI3MTYxIDMuMTAxNjIgMC44MTU4NjFWMTQuNTkxNEMzLjEwOTA1IDE0LjY0NTIgMy4xMzAzNiAxNC42OTYxIDMuMTYzNDUgMTQuNzM5MUMzLjE5NjU0IDE0Ljc4MjEgMy4yNDAyNyAxNC44MTU3IDMuMjkwMzIgMTQuODM2N0w0LjkxMzIyIDE1LjQyMTdDNS4xNTg1MiAxNS41MTYxIDUuNDc5MzIgMTUuMzg0IDUuNDc5MzIgMTUuMTc2NEw1LjQ3OTE3IDEuNDE5NzZaIiBmaWxsPSIjMEU2NDc2Ii8+Cjwvc3ZnPgo=") 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-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__main-details">
<h1 class="heading heading--first-level product-view__title">
{{{ title }}}
</h1>
<span class="product-view__sku">
{{{ sku.label }}} {{{ sku.value }}}
</span>
<div
class="
product-view__stock-status
{{#if stock.outOfStock}}
product-view__stock-status--out-of-stock
{{/if}}
{{#if stock.alert}}
product-view__stock-status--alert
{{/if}}
"
>
{{{ stock.html }}}
</div>
<div class="product-view__rating">
{{ render '@review--summary' }}
</div>
</div>
<div class="product-view__secondary-details">
{{ render '@table' productsTable }}
<div class="product-view__main-actions">
<div class="product-view__action-elements">
<div class="product-view__add-to-cart">
{{> '@button' button }}
</div>
<div class="product-view__extra-actions">
{{#each extraActions as |action|}}
<{{tag}}
class="
product-view__action
product-view__action--{{tag}}
{{ action.class }}
"
>
{{ render '@icon' action.icon}}
</{{tag}}>
{{/each}}
</div>
</div>
</div>
<div class="product-view__information">
{{ render '@brief-info' briefInfo }}
</div>
</div>
</div>
<div class="product-view__tabs">
{{ render '@tab' tab }}
</div>
<div class="product-view__slider">
<h3 class="heading">
{{ relatedProducts.heading }}
</h3>
{{render '@slider' relatedProducts.slider }}
</div>
<div class="product-view__slider">
<h3 class="heading">
{{ upsellProducts.heading }}
</h3>
{{render '@slider' upsellProducts.slider }}
</div>
{{render '@additional-content' additionalContent merge=true }}
</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"
},
"stock": {
"inStock": false,
"inStockLabel": "Direct leverbaar",
"deliveryTime": false,
"deliveryTimeLabel": "3-5 werkdagen",
"outOfStock": true,
"outOfStockLabel": "Uitverkocht"
},
"description": "Deze leren wedstrijdhandschoenen van UFC zijn de enige handschoenen die gedragen mogen worden door de UFC vechters in Octagon!",
"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"
},
"productsTable": {
"class": "product-view__grouped-table",
"captionText": "Grouped product items",
"mainTags": [
{
"mainTag": "thead",
"rowTags": [
{
"rowTag": "tr",
"rowTagAttributes": "role=\"row\"",
"childTags": [
{
"childTag": "th",
"content": "Product Name",
"childTagAttributes": "scope=\"col\" role=\"columnheader\""
},
{
"childTag": "th",
"childTagClasses": "product-view__grouped-col-qty",
"content": "Qty",
"childTagAttributes": "scope=\"col\" role=\"columnheader\""
}
]
}
]
},
{
"mainTag": "tbody",
"rowTags": [
{
"rowTag": "tr",
"rowTagAttributes": "role=\"row\"",
"childTags": [
{
"childTag": "td",
"childTagAttributes": "data-th=\"Product Name:\" role=\"gridcell\"",
"content": "<span class=\"product-view__grouped-product-name\">Sprite Yoga Strap 6 foot</span><span>$14.00</span>"
},
{
"childTag": "td",
"childTagAttributes": "data-th=\"Qty:\" role=\"gridcell\"",
"contentComponent": "input",
"contentContext": {
"class": "product-view__grouped-qty",
"label": {
"text": "Qty",
"hidden": true
},
"field": {
"id": "field-id-1",
"name": "field-name-1",
"type": "number",
"attributes": "min=\"0\" value=\"0\""
}
}
}
]
},
{
"rowTag": "tr",
"rowTagAttributes": "role=\"row\"",
"childTags": [
{
"childTag": "td",
"childTagAttributes": "data-th=\"Product Name:\" role=\"gridcell\"",
"content": "<span class=\"product-view__grouped-product-name\">Sprite Yoga Strap 8 foot</span><span>$17.00</span>"
},
{
"childTag": "td",
"childTagAttributes": "data-th=\"Qty:\" role=\"gridcell\"",
"contentComponent": "input",
"contentContext": {
"class": "product-view__grouped-qty",
"label": {
"text": "Qty",
"hidden": true
},
"field": {
"id": "field-id-1",
"name": "field-name-1",
"type": "number",
"attributes": "min=\"0\" value=\"0\""
}
}
}
]
},
{
"rowTag": "tr",
"rowTagAttributes": "role=\"row\"",
"childTags": [
{
"childTag": "td",
"childTagAttributes": "data-th=\"Product Name:\" role=\"gridcell\"",
"content": "<span class=\"product-view__grouped-product-name\">Sprite Yoga Strap 10 foot</span><span>$21.00</span>"
},
{
"childTag": "td",
"childTagAttributes": "data-th=\"Qty:\" role=\"gridcell\"",
"contentComponent": "input",
"contentContext": {
"class": "product-view__grouped-qty",
"label": {
"text": "Qty",
"hidden": true
},
"field": {
"id": "field-id-1",
"name": "field-name-1",
"type": "number",
"attributes": "min=\"0\" value=\"0\""
}
}
}
]
}
]
}
]
}
}
$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;
}
}
}
There are no notes for this item.