Kracht
Squat, deadlift, drukken en optrekken. Je noteert je gewichten in de app en ziet ze over twaalf weken oplopen. Wie nieuw is, leert eerst de techniek met een lege stang.
Complete homepage for a small group-training gym: a photo grid hero that shows the next class of today, a day-by-day timetable that marks past and upcoming classes, coaches, a membership calculator and a validated free-trial request.
Je eerste les is gratis, zonder lidmaatschap. Plan je proefles
Vandaag open van 06:30 tot 21:30 · 010 123 4567
Hooguit veertien mensen per les en een trainer die je naam kent. In een oude koffieloods op Katendrecht, vijf minuten van metro Rijnhaven.


Vandaag om 18:00 nog Kracht bij Femke, drie plekken vrij.
Naar het rooster
Elke les duurt vijftig minuten: tien minuten opwarmen, dertig minuten werk, tien minuten rekken. De trainer past gewicht en tempo aan op wat jij die dag aankunt.
Squat, deadlift, drukken en optrekken. Je noteert je gewichten in de app en ziet ze over twaalf weken oplopen. Wie nieuw is, leert eerst de techniek met een lege stang.

Slee duwen, touwen en korte sprints op de baan kunstgras. Zwaar, maar in je eigen tempo.

Combinaties op de pads met een vaste partner. Geen sparring, handschoenen liggen klaar.

Intervallen op de roeitrainer. In je eerste les leer je eerst de haal, daarna pas het tempo.

Heupen, schouders en rug soepel houden. Rustig, op de houten vloer bij het grote raam.
Kies een dag. Lessen die al geweest zijn, worden grijs; bij de eerstvolgende zie je hoe lang je nog hebt.
Leden reserveren in de app tot twee uur voor de les. Nog geen lid? Kies hierboven een les, dan zetten we hem in je proefles.




Je betaalt per maand voor het aantal keer dat je echt komt. Maandelijks opzegbaar; wie een jaar vastlegt, krijgt €8 per maand korting.
Liever losse lessen? Een tienrittenkaart kost €165 en is zes maanden geldig.
Ja. De helft van onze leden begon zo. Elke oefening heeft een lichtere variant en de trainer zet je de eerste weken vooraan.
Sportkleding, schone schoenen en een bidon. Handdoeken en een kluisje met code liggen klaar.
Met een briefje van huisarts of fysio zetten we je lidmaatschap maximaal drie maanden stil, zonder kosten.
In de app of met een mail, uiterlijk een maand voor de volgende incasso. Bij een jaarlidmaatschap kan dat vanaf maand twaalf.
Ja, voor teams vanaf zes mensen, ook via de fiscale regeling van je werkgever. Vraag Gerard om een voorstel.

Tot in de jaren zestig lagen hier balen koffie uit Sumatra. Wij hielden de stalen spanten en de ramen van vier meter hoog, en legden een vloer van rubber en eikenhout.
Fietsen zet je binnen de poort. Met de auto parkeer je in de garage aan het Deliplein, met de metro stap je uit op Rijnhaven.
Laat je naam en nummer achter. We bellen binnen een werkdag om een les te kiezen en vragen naar blessures, zodat je trainer weet waar hij op let.
"Ik had nog nooit een halter aangeraakt. Na een half jaar til ik mijn eigen gewicht en ken ik de halve groep bij naam."
Sanne Verhoef, Katendrecht
"Om zeven uur boksen voor het werk. Gerard laat je niet wegkomen met een halve combinatie."
Murat Yilmaz, Feijenoord
Gemiddeld 4,9 uit 5 op Google, uit 212 beoordelingen.
Sumatraweg 18
3072 ZP Rotterdam
Loods Zuid
Sumatraweg 18, 3072 ZP Rotterdam
010 123 4567 · info@voorbeeld.nl
Loods Zuid Training B.V. · KvK 87654321 · btw NL004512378B01 · Lid van NL Actief · Privacy · Algemene voorwaarden
<!-- Loods Zuid · boutique gym, Rotterdam · NedDev · eigen werk. -->
<div class="jouw-container">
<div class="lzg">
<div class="lzg__top"><div class="lzg__in lzg__top-in">
<p>Je eerste les is gratis, zonder lidmaatschap. <a href="#lzg-proef">Plan je proefles</a></p>
<p class="lzg__top-r"><span class="lzg__vandaag">Vandaag open van 06:30 tot 21:30</span> · <a href="tel:0101234567">010 123 4567</a></p>
</div></div>
<div class="lzg__kop" role="banner"><div class="lzg__in lzg__kop-in">
<a href="#" class="lzg__logo" aria-label="Loods Zuid, naar home">Loods Zuid</a>
<nav class="lzg__nav" aria-label="Hoofdmenu">
<a href="#lzg-lessen">Lessen</a><a href="#lzg-rooster">Rooster</a><a href="#lzg-trainers">Trainers</a><a href="#lzg-prijs">Lidmaatschap</a><a href="#lzg-loods">De loods</a><a href="#lzg-contact">Contact</a>
</nav>
<a href="#lzg-proef" class="lzg__knop lzg__knop--kop">Gratis proefles</a>
<button class="lzg__menuknop" type="button" aria-expanded="false" aria-controls="lzg-menu" aria-label="Menu openen"><span></span><span></span></button>
</div>
<div class="lzg__menu" id="lzg-menu" hidden>
<a href="#lzg-lessen">Lessen</a><a href="#lzg-rooster">Rooster</a><a href="#lzg-trainers">Trainers</a><a href="#lzg-prijs">Lidmaatschap</a><a href="#lzg-loods">De loods</a><a href="#lzg-contact">Contact</a><a href="#lzg-proef" class="lzg__knop">Plan je gratis proefles</a>
</div>
</div>
<div class="lzg__hero"><div class="lzg__in lzg__raster">
<div class="lzg__cel lzg__cel--tekst">
<h1 class="lzg__h1">Trainen in kleine groepen</h1>
<p class="lzg__lead">Hooguit veertien mensen per les en een trainer die je naam kent. In een oude koffieloods op Katendrecht, vijf minuten van metro Rijnhaven.</p>
<div class="lzg__acties"><a href="#lzg-proef" class="lzg__knop">Plan je gratis proefles</a><a href="#lzg-rooster" class="lzg__link">Bekijk het rooster</a></div>
</div>
<div class="lzg__cel lzg__cel--groot"><img src="https://neddev.com/lab-media/site-sportschool-1.webp" alt="Groepsles met kettlebells in de loods, met de Maas achter de hoge ramen" width="1408" height="768"></div>
<div class="lzg__cel lzg__cel--a"><img src="https://neddev.com/lab-media/site-sportschool-3.webp" alt="Handen met magnesium om het handvat van een kettlebell" width="900" height="491" loading="lazy"></div>
<div class="lzg__cel lzg__cel--nu"><p class="lzg__nu">Vandaag om 18:00 nog Kracht bij Femke, drie plekken vrij.</p><a href="#lzg-rooster" class="lzg__link">Naar het rooster</a></div>
<div class="lzg__cel lzg__cel--b"><img src="https://neddev.com/lab-media/site-sportschool-15.webp" alt="Leden zitten na de les lachend op de vloer van de loods" width="900" height="491" loading="lazy"></div>
</div></div>
<div class="lzg__lessen" id="lzg-lessen"><div class="lzg__in">
<h2 class="lzg__h2">Vijf lessen, één zaal</h2>
<p class="lzg__intro">Elke les duurt vijftig minuten: tien minuten opwarmen, dertig minuten werk, tien minuten rekken. De trainer past gewicht en tempo aan op wat jij die dag aankunt.</p>
<div class="lzg__uitgelicht">
<article class="lzg__les">
<img src="https://neddev.com/lab-media/site-sportschool-2.webp" alt="Een lid doet een deadlift met een halter in de loods" width="900" height="491" loading="lazy">
<h3 class="lzg__h3">Kracht</h3>
<p>Squat, deadlift, drukken en optrekken. Je noteert je gewichten in de app en ziet ze over twaalf weken oplopen. Wie nieuw is, leert eerst de techniek met een lege stang.</p>
</article>
<ul class="lzg__lijst">
<li><img src="https://neddev.com/lab-media/site-sportschool-7.webp" alt="Een lid duwt een slee over de baan kunstgras" width="900" height="491" loading="lazy"><div><h3 class="lzg__h3">Conditie</h3><p>Slee duwen, touwen en korte sprints op de baan kunstgras. Zwaar, maar in je eigen tempo.</p></div></li>
<li><img src="https://neddev.com/lab-media/site-sportschool-5.webp" alt="Trainer houdt de pads vast terwijl een lid stoot" width="900" height="491" loading="lazy"><div><h3 class="lzg__h3">Boksen</h3><p>Combinaties op de pads met een vaste partner. Geen sparring, handschoenen liggen klaar.</p></div></li>
<li><img src="https://neddev.com/lab-media/site-sportschool-16.webp" alt="Een lid op de roeitrainer bij laag zonlicht" width="900" height="491" loading="lazy"><div><h3 class="lzg__h3">Roeien</h3><p>Intervallen op de roeitrainer. In je eerste les leer je eerst de haal, daarna pas het tempo.</p></div></li>
<li><img src="https://neddev.com/lab-media/site-sportschool-6.webp" alt="Mobiliteitsles op de houten vloer met uitzicht op de havenkranen" width="900" height="491" loading="lazy"><div><h3 class="lzg__h3">Mobiliteit</h3><p>Heupen, schouders en rug soepel houden. Rustig, op de houten vloer bij het grote raam.</p></div></li>
</ul>
</div>
</div></div>
<div class="lzg__rooster" id="lzg-rooster"><div class="lzg__in">
<div class="lzg__rooster-kop">
<h2 class="lzg__h2">Rooster</h2>
<p>Kies een dag. Lessen die al geweest zijn, worden grijs; bij de eerstvolgende zie je hoe lang je nog hebt.</p>
</div>
<div class="lzg__dagen" role="tablist" aria-label="Dag kiezen"></div>
<ul class="lzg__uren" aria-live="polite"></ul>
<p class="lzg__rooster-noot">Leden reserveren in de app tot twee uur voor de les. Nog geen lid? Kies hierboven een les, dan zetten we hem in je proefles.</p>
</div></div>
<div class="lzg__trainers" id="lzg-trainers"><div class="lzg__in">
<h2 class="lzg__h2">Vier trainers, geen invallers</h2>
<div class="lzg__tr-raster">
<figure class="lzg__tr"><img src="https://neddev.com/lab-media/site-sportschool-8.webp" alt="Femke de Wit in de loods" width="768" height="1376" loading="lazy"><figcaption><strong>Femke de Wit</strong> Kracht en conditie. Roeide twaalf jaar wedstrijden op de Maas. "Ik kijk eerst hoe je beweegt, pas daarna naar het gewicht."</figcaption></figure>
<figure class="lzg__tr"><img src="https://neddev.com/lab-media/site-sportschool-9.webp" alt="Gerard Bakker met de armen over elkaar" width="848" height="1264" loading="lazy"><figcaption><strong>Gerard Bakker</strong> Boksen en roeien. Begon de loods in 2019.</figcaption></figure>
<figure class="lzg__tr"><img src="https://neddev.com/lab-media/site-sportschool-10.webp" alt="Jayden Pinas geeft aanwijzingen tijdens een les" width="768" height="1376" loading="lazy"><figcaption><strong>Jayden Pinas</strong> Conditie. Oud-atleet op de 400 meter.</figcaption></figure>
<figure class="lzg__tr"><img src="https://neddev.com/lab-media/site-sportschool-11.webp" alt="Elif Kaya met haar schema in de hand" width="768" height="1376" loading="lazy"><figcaption><strong>Elif Kaya</strong> Mobiliteit. Fysiotherapeut, ook voor een intake na een blessure.</figcaption></figure>
</div>
</div></div>
<div class="lzg__prijs" id="lzg-prijs"><div class="lzg__in lzg__prijs-in">
<div class="lzg__prijs-tekst">
<h2 class="lzg__h2">Wat kost het?</h2>
<p>Je betaalt per maand voor het aantal keer dat je echt komt. Maandelijks opzegbaar; wie een jaar vastlegt, krijgt €8 per maand korting.</p>
<ul class="lzg__in-prijs">
<li>Intake van dertig minuten met een trainer</li>
<li>Handdoek, douche en kluisje</li>
<li>Een schema voor thuis of op vakantie</li>
</ul>
<p>Liever losse lessen? Een tienrittenkaart kost €165 en is zes maanden geldig.</p>
<h3 class="lzg__h3 lzg__faq-kop">Vragen over je lidmaatschap</h3>
<div class="lzg__faq-lijst">
<details><summary>Ik heb in jaren niet gesport. Kan ik meedoen?</summary><p>Ja. De helft van onze leden begon zo. Elke oefening heeft een lichtere variant en de trainer zet je de eerste weken vooraan.</p></details>
<details><summary>Wat neem ik mee naar mijn proefles?</summary><p>Sportkleding, schone schoenen en een bidon. Handdoeken en een kluisje met code liggen klaar.</p></details>
<details><summary>Kan ik stoppen bij een blessure?</summary><p>Met een briefje van huisarts of fysio zetten we je lidmaatschap maximaal drie maanden stil, zonder kosten.</p></details>
<details><summary>Hoe zeg ik op?</summary><p>In de app of met een mail, uiterlijk een maand voor de volgende incasso. Bij een jaarlidmaatschap kan dat vanaf maand twaalf.</p></details>
<details><summary>Doen jullie bedrijfsfitness?</summary><p>Ja, voor teams vanaf zes mensen, ook via de fiscale regeling van je werkgever. Vraag Gerard om een voorstel.</p></details>
</div>
</div>
<form class="lzg__reken" aria-label="Lidmaatschap berekenen">
<fieldset class="lzg__keus"><legend>Hoe vaak per week kom je?</legend>
<label><input type="radio" name="keer" value="1"><span>1 keer</span></label>
<label><input type="radio" name="keer" value="2" checked><span>2 keer</span></label>
<label><input type="radio" name="keer" value="3"><span>Onbeperkt</span></label>
</fieldset>
<label class="lzg__vink"><input type="checkbox" name="jaar"> Ik leg een jaar vast</label>
<label class="lzg__vink"><input type="checkbox" name="korting"> Ik ben student of 65-plus</label>
<p class="lzg__bedrag"><span class="lzg__euro">€69</span> per maand</p>
<p class="lzg__uitleg">Ongeveer 9 lessen per maand, zo'n €7,96 per les.</p>
<a href="#lzg-proef" class="lzg__knop">Eerst een gratis proefles</a>
</form>
</div></div>
<div class="lzg__loods" id="lzg-loods">
<div class="lzg__duo"><img src="https://neddev.com/lab-media/site-sportschool-12.webp" alt="De lege loods in de avond, met rekken, kettlebells en roeitrainers" width="1376" height="768" loading="lazy"></div>
<div class="lzg__in lzg__loods-in">
<div class="lzg__loods-tekst">
<h2 class="lzg__h2">Een koffieloods uit 1912</h2>
<p>Tot in de jaren zestig lagen hier balen koffie uit Sumatra. Wij hielden de stalen spanten en de ramen van vier meter hoog, en legden een vloer van rubber en eikenhout.</p>
<p>Fietsen zet je binnen de poort. Met de auto parkeer je in de garage aan het Deliplein, met de metro stap je uit op Rijnhaven.</p>
</div>
<img class="lzg__loods-a" src="https://neddev.com/lab-media/site-sportschool-17.webp" alt="De bakstenen loods aan de kade, met fietsen ervoor" width="900" height="491" loading="lazy">
<img class="lzg__loods-b" src="https://neddev.com/lab-media/site-sportschool-14.webp" alt="Kleedkamer met eikenhouten banken en douches" width="900" height="491" loading="lazy">
</div>
</div>
<div class="lzg__proef" id="lzg-proef"><div class="lzg__in lzg__proef-in">
<div class="lzg__proef-l">
<h2 class="lzg__h2">Je eerste les is gratis</h2>
<p>Laat je naam en nummer achter. We bellen binnen een werkdag om een les te kiezen en vragen naar blessures, zodat je trainer weet waar hij op let.</p>
<form class="lzg__form" novalidate>
<label>Naam<input name="naam" autocomplete="name" required></label>
<label>Telefoon<input name="tel" type="tel" autocomplete="tel" required></label>
<label>E-mail<input name="mail" type="email" autocomplete="email"></label>
<label>Welke les?<select name="les"><option>Weet ik nog niet</option><option>Kracht</option><option>Conditie</option><option>Boksen</option><option>Roeien</option><option>Mobiliteit</option></select></label>
<p class="lzg__gekozen" hidden></p>
<p class="lzg__fout" role="alert" hidden>Vul je naam en een telefoonnummer van tien cijfers in.</p>
<button type="submit" class="lzg__knop">Plan mijn proefles</button>
</form>
<p class="lzg__klaar" role="status" hidden></p>
<div class="lzg__stem">
<blockquote class="lzg__q lzg__q--groot"><p>"Ik had nog nooit een halter aangeraakt. Na een half jaar til ik mijn eigen gewicht en ken ik de halve groep bij naam."</p><cite>Sanne Verhoef, Katendrecht</cite></blockquote>
<blockquote class="lzg__q"><p>"Om zeven uur boksen voor het werk. Gerard laat je niet wegkomen met een halve combinatie."</p><cite>Murat Yilmaz, Feijenoord</cite></blockquote>
<p class="lzg__score">Gemiddeld 4,9 uit 5 op Google, uit 212 beoordelingen.</p>
</div>
</div>
<div class="lzg__contact" id="lzg-contact">
<h3 class="lzg__h3">Langskomen</h3>
<p>Sumatraweg 18<br>3072 ZP Rotterdam</p>
<p><a href="tel:0101234567">010 123 4567</a><br><a href="mailto:info@voorbeeld.nl">info@voorbeeld.nl</a></p>
<h3 class="lzg__h3">Open</h3>
<ul class="lzg__tijden">
<li data-dag="1"><span>maandag</span><span>06:30 tot 21:30</span></li>
<li data-dag="2"><span>dinsdag</span><span>06:30 tot 21:30</span></li>
<li data-dag="3"><span>woensdag</span><span>06:30 tot 21:30</span></li>
<li data-dag="4"><span>donderdag</span><span>06:30 tot 21:30</span></li>
<li data-dag="5"><span>vrijdag</span><span>06:30 tot 20:00</span></li>
<li data-dag="6"><span>zaterdag</span><span>08:00 tot 13:00</span></li>
<li data-dag="0"><span>zondag</span><span>09:00 tot 12:00</span></li>
</ul>
</div>
</div></div>
<div class="lzg__voet" role="contentinfo"><div class="lzg__in">
<div class="lzg__voet-kol">
<div><p class="lzg__logo">Loods Zuid</p><p>Sumatraweg 18, 3072 ZP Rotterdam<br>010 123 4567 · info@voorbeeld.nl</p></div>
<div><p class="lzg__voet-kop">Lessen</p><a href="#lzg-lessen">Kracht</a><a href="#lzg-lessen">Conditie</a><a href="#lzg-lessen">Boksen</a><a href="#lzg-lessen">Roeien</a><a href="#lzg-lessen">Mobiliteit</a></div>
<div><p class="lzg__voet-kop">Lidmaatschap</p><a href="#lzg-prijs">Prijzen</a><a href="#lzg-prijs">Tienrittenkaart</a><a href="#">Bedrijfsfitness</a><a href="#">Opzeggen</a></div>
<div><p class="lzg__voet-kop">Loods Zuid</p><a href="#lzg-trainers">Trainers</a><a href="#lzg-loods">De loods</a><a href="#">Werken bij</a><a href="#lzg-contact">Contact</a></div>
</div>
<p class="lzg__voet-regel">Loods Zuid Training B.V. · KvK 87654321 · btw NL004512378B01 · Lid van NL Actief · <a href="#">Privacy</a> · <a href="#">Algemene voorwaarden</a></p>
</div></div>
</div>
</div>/* Loods Zuid · boutique gym, Rotterdam · NedDev · eigen werk. */
/* fonts (Fontshare): alpino@400,700 */
.lzg{--bg:#0B2A24;--opp:#123630;--tekst:#ECF5F2;--gedempt:#A0BDB5;--lijn:#1F4A41;--accent:#FF7A2F;--op-accent:#000;--r:8px;--fs1:14px;--fs2:16px;--fs3:20px;--fs4:28px;--fs5:44px;--fs6:72px;--sectie:clamp(64px,7vw,96px);--gat:clamp(20px,2.5vw,36px);--kader:1660px;--lees:720px;--zij:20px;
container-type:inline-size;background:var(--bg);color:var(--tekst);font-family:'Alpino',sans-serif;font-weight:400;font-size:var(--fs2);line-height:1.55;-webkit-font-smoothing:antialiased}
.lzg *{box-sizing:border-box}
.lzg [hidden]{display:none!important}
.lzg a{color:inherit}
.lzg img{display:block;max-width:100%;height:auto}
.lzg :where(p){margin:0}
.lzg__in{max-width:var(--kader);margin:0 auto;padding:0 clamp(var(--zij),4vw,56px)}
.lzg__h1,.lzg__h2,.lzg__h3{font-weight:700;margin:0;line-height:1.05;letter-spacing:-.01em}
.lzg__h1{font-size:var(--fs6)}
.lzg__h2{font-size:var(--fs5);margin-bottom:20px}
.lzg__h3{font-size:var(--fs3);margin-bottom:6px}
.lzg__knop{display:inline-block;background:var(--accent);color:var(--op-accent)!important;text-decoration:none;font-weight:700;padding:13px 22px;border-radius:var(--r);border:0;font:inherit;font-weight:700;cursor:pointer;transition:background .18s}
.lzg__knop:hover{background:#FF9455}
.lzg__knop:focus-visible,.lzg button:focus-visible,.lzg a:focus-visible,.lzg input:focus-visible,.lzg select:focus-visible,.lzg summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.lzg__link{display:inline-block;padding:4px 0;color:var(--tekst);text-underline-offset:4px;font-weight:700}
.lzg__link:hover{color:var(--accent)}
.lzg__top{border-bottom:1px solid var(--lijn);font-size:var(--fs1);color:var(--gedempt)}
.lzg__top-in{display:flex;justify-content:space-between;gap:16px;padding-top:9px;padding-bottom:9px}
.lzg__top a{color:var(--tekst)}
.lzg__kop{position:sticky;top:0;z-index:5}
.lzg__kop-in{display:flex;align-items:center;gap:32px;padding-top:16px;padding-bottom:16px;background:var(--bg)}
.lzg__logo{font-weight:700;font-size:var(--fs4);text-decoration:none;letter-spacing:-.02em;margin:0}
.lzg__nav{display:flex;gap:26px;margin-left:auto}
.lzg__nav a{text-decoration:none;color:var(--gedempt);transition:color .18s}
.lzg__nav a:hover{color:var(--tekst)}
.lzg__knop--kop{padding:10px 18px}
.lzg__menuknop{display:none;margin-left:auto;width:44px;height:44px;background:none;border:1px solid var(--lijn);border-radius:var(--r);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:6px}
.lzg__menuknop span{display:block;width:20px;height:2px;background:var(--tekst)}
.lzg__menu{display:flex;flex-direction:column;gap:4px;padding:8px var(--zij) 20px;background:var(--bg);border-bottom:1px solid var(--lijn)}
.lzg__menu a{padding:10px 0;text-decoration:none;font-size:var(--fs3)}
.lzg__menu .lzg__knop{margin-top:10px;text-align:center;font-size:var(--fs2)}
.lzg__hero{padding:12px 0 var(--sectie)}
.lzg__raster{display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:240px 220px 200px;gap:12px}
.lzg__cel{border-radius:var(--r);overflow:hidden;margin:0}
.lzg__cel img{width:100%;height:100%;object-fit:cover}
.lzg__cel--tekst{grid-column:1/6;grid-row:1/3;display:flex;flex-direction:column;justify-content:flex-end;padding:8px 24px 8px 0;overflow:visible}
.lzg__cel--groot{grid-column:6/13;grid-row:1/3}
.lzg__cel--a{grid-column:1/4;grid-row:3}
.lzg__cel--nu{grid-column:4/7;grid-row:3;background:var(--opp);padding:24px;display:flex;flex-direction:column;justify-content:space-between}
.lzg__cel--b{grid-column:7/13;grid-row:3}
.lzg__lead{font-size:var(--fs3);color:var(--gedempt);margin:20px 0 28px;max-width:36ch}
.lzg__acties{display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.lzg__nu{font-size:var(--fs3);line-height:1.35}
.lzg__nu strong{color:var(--accent)}
.lzg__lessen{padding-bottom:var(--sectie)}
.lzg__intro{max-width:var(--lees);color:var(--gedempt);font-size:var(--fs3);margin-bottom:40px}
.lzg__uitgelicht{display:grid;grid-template-columns:6fr 6fr;gap:clamp(24px,4vw,64px);align-items:start}
.lzg__les img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r);margin-bottom:16px}
.lzg__les p{color:var(--gedempt);max-width:52ch}
.lzg__les{margin:0}
.lzg__lijst{list-style:none;margin:0;padding:0;border-top:1px solid var(--lijn)}
.lzg__lijst li{display:grid;grid-template-columns:168px 1fr;gap:24px;align-items:center;padding:14px 0;border-bottom:1px solid var(--lijn)}
.lzg__lijst img{width:168px;height:104px;object-fit:cover;border-radius:var(--r)}
.lzg__lijst p{color:var(--gedempt);max-width:60ch}
.lzg__rooster{background:var(--opp);padding:var(--sectie) 0}
.lzg__rooster-kop{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-bottom:28px}
.lzg__rooster-kop .lzg__h2{margin:0}
.lzg__rooster-kop p{color:var(--gedempt);max-width:46ch}
.lzg__dagen{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px}
.lzg__dag{background:none;border:1px solid var(--lijn);color:var(--tekst);font:inherit;padding:10px 16px;border-radius:var(--r);cursor:pointer;transition:background .18s,border-color .18s}
.lzg__dag:hover{border-color:var(--gedempt)}
.lzg__dag[aria-selected="true"]{background:var(--tekst);color:var(--bg);border-color:var(--tekst);font-weight:700}
.lzg__uren{list-style:none;margin:0;padding:0}
.lzg__uur{display:grid;grid-template-columns:90px 1.3fr 1fr 1.2fr 220px;gap:16px;align-items:center;padding:10px 0;border-bottom:1px solid var(--lijn);transition:opacity .18s}
.lzg__uur time{font-weight:700;font-size:var(--fs3)}
.lzg__uur-les{font-weight:700}
.lzg__uur-tr,.lzg__uur-plek{color:var(--gedempt)}
.lzg__uur button{justify-self:end;background:none;border:1px solid var(--gedempt);color:var(--tekst);font:inherit;padding:8px 14px;border-radius:var(--r);cursor:pointer;transition:background .18s,color .18s}
.lzg__uur button:hover:not(:disabled){background:var(--accent);border-color:var(--accent);color:var(--op-accent)}
.lzg__uur button:disabled{opacity:.5;cursor:default}
.lzg__uur.is-geweest{opacity:.38}
.lzg__uur.is-volgende{box-shadow:inset 4px 0 0 var(--accent);padding-left:16px}
.lzg__uur.is-volgende .lzg__uur-plek{color:var(--accent);font-weight:700}
.lzg__rooster-noot{margin-top:20px;color:var(--gedempt);font-size:var(--fs1)}
.lzg__trainers{padding:var(--sectie) 0}
.lzg__tr-raster{display:grid;grid-template-columns:4fr 3fr 3fr 3fr;gap:var(--gat);align-items:start}
.lzg__tr{margin:0}
.lzg__tr img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r);margin-bottom:12px}
.lzg__tr:nth-child(2){margin-top:48px}
.lzg__tr:nth-child(4){margin-top:36px}
.lzg__tr figcaption{color:var(--gedempt);max-width:44ch}
.lzg__tr strong{display:block;color:var(--tekst);font-size:var(--fs3)}
.lzg__prijs{padding:0 0 var(--sectie)}
.lzg__prijs-in{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);align-items:start}
.lzg__prijs-tekst p{color:var(--gedempt);max-width:52ch;margin-bottom:16px}
.lzg__in-prijs{margin:0 0 20px;padding-left:20px;color:var(--tekst)}
.lzg__in-prijs li{margin-bottom:6px}
.lzg__reken{background:var(--opp);border-radius:var(--r);padding:clamp(24px,3vw,40px)}
.lzg__keus{border:0;padding:0;margin:0 0 18px;display:flex;gap:6px;flex-wrap:wrap}
.lzg__keus legend{font-weight:700;margin-bottom:12px;font-size:var(--fs3)}
.lzg__keus label{flex:1 1 90px}
.lzg__keus input{position:absolute;opacity:0;pointer-events:none}
.lzg__keus span{display:block;text-align:center;padding:12px;border:1px solid var(--lijn);border-radius:var(--r);cursor:pointer;transition:background .18s}
.lzg__keus input:checked+span{background:var(--tekst);color:var(--bg);font-weight:700;border-color:var(--tekst)}
.lzg__keus input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.lzg__vink{display:flex;gap:10px;align-items:center;margin-bottom:10px;cursor:pointer}
.lzg__vink input{width:18px;height:18px;accent-color:var(--accent)}
.lzg__bedrag{margin:24px 0 4px;color:var(--gedempt)}
.lzg__euro{font-size:var(--fs6);font-weight:700;color:var(--tekst);line-height:1;margin-right:8px}
.lzg__uitleg{color:var(--gedempt);margin-bottom:24px}
.lzg__loods{padding-bottom:var(--sectie)}
.lzg__duo{position:relative;isolation:isolate;z-index:0;height:clamp(240px,28vw,420px);overflow:hidden;background:var(--bg)}
.lzg__duo img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.15)}
.lzg__duo::before,.lzg__duo::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:1}
.lzg__duo::before{background:var(--accent);mix-blend-mode:multiply}
.lzg__duo::after{background:var(--bg);mix-blend-mode:lighten}
.lzg__loods-in{display:grid;grid-template-columns:6fr 3fr 3fr;gap:var(--gat);margin-top:calc(var(--gat) * -2);position:relative;z-index:1}
.lzg__loods-tekst{background:var(--bg);padding:32px 32px 0 0}
.lzg__loods-tekst p{color:var(--gedempt);max-width:52ch;margin-bottom:14px}
.lzg__loods-a,.lzg__loods-b{width:100%;object-fit:cover;border-radius:var(--r);align-self:end}
.lzg__loods-a{aspect-ratio:3/4}
.lzg__loods-b{aspect-ratio:4/5}
.lzg__stem{display:grid;grid-template-columns:3fr 2fr;gap:var(--gat);margin-top:56px;padding-top:32px;border-top:1px solid var(--lijn);align-items:end}
.lzg__q{margin:0}
.lzg__q p{font-size:var(--fs3);line-height:1.4;margin-bottom:14px}
.lzg__q--groot p{font-size:var(--fs3);line-height:1.35;font-weight:700}
.lzg__q cite{font-style:normal;color:var(--gedempt)}
.lzg__score{grid-column:1/-1;color:var(--gedempt)}
.lzg__faq-kop{margin-top:36px;margin-bottom:12px}
.lzg__faq-lijst details{border-bottom:1px solid var(--lijn)}
.lzg__faq-lijst details:first-child{border-top:1px solid var(--lijn)}
.lzg__faq-lijst summary{cursor:pointer;list-style:none;padding:18px 40px 18px 0;font-size:var(--fs3);font-weight:700;position:relative}
.lzg__faq-lijst summary::-webkit-details-marker{display:none}
.lzg__faq-lijst summary::after{content:"+";position:absolute;right:4px;top:14px;font-size:var(--fs4);color:var(--accent);transition:transform .18s}
.lzg__faq-lijst details[open] summary::after{transform:rotate(45deg)}
.lzg__faq-lijst details p{color:var(--gedempt);padding:0 0 20px;max-width:60ch}
.lzg__proef{background:var(--opp);padding:var(--sectie) 0}
.lzg__proef-in{display:grid;grid-template-columns:7fr 4fr;gap:clamp(32px,6vw,96px)}
.lzg__proef-l>p{color:var(--gedempt);max-width:52ch;margin-bottom:28px}
.lzg__form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.lzg__form label{display:flex;flex-direction:column;gap:6px;font-size:var(--fs1);color:var(--gedempt)}
.lzg__form input,.lzg__form select{font:inherit;font-size:var(--fs2);color:var(--tekst);background:var(--bg);border:1px solid var(--lijn);border-radius:var(--r);padding:12px 14px;width:100%}
.lzg__form .lzg__knop,.lzg__gekozen,.lzg__fout{grid-column:1/-1}
.lzg__form .lzg__knop{justify-self:start}
.lzg__gekozen{color:var(--accent);font-weight:700}
.lzg__fout{color:#FFB18A}
.lzg__klaar{font-size:var(--fs3);border-left:4px solid var(--accent);padding:8px 0 8px 16px;max-width:52ch}
.lzg__contact p{color:var(--gedempt);margin-bottom:16px}
.lzg__contact .lzg__h3{margin-top:8px;margin-bottom:10px}
.lzg__tijden{list-style:none;margin:0;padding:0}
.lzg__tijden li{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid var(--lijn);color:var(--gedempt)}
.lzg__tijden li.is-vandaag{color:var(--tekst);font-weight:700}
.lzg__tijden li.is-vandaag span:first-child::after{content:", vandaag";color:var(--accent)}
.lzg__voet{padding:64px 0 32px;font-size:var(--fs1);color:var(--gedempt)}
.lzg__voet-kol{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--gat);margin-bottom:48px}
.lzg__voet-kol a{display:block;text-decoration:none;padding:3px 0}
.lzg__voet-kol a:hover{color:var(--tekst)}
.lzg__voet .lzg__logo{color:var(--tekst);margin-bottom:10px}
.lzg__voet-kop{color:var(--tekst);font-weight:700;margin-bottom:8px!important}
.lzg__voet-regel{border-top:1px solid var(--lijn);padding-top:20px}
@container (max-width:1000px){
.lzg__nav,.lzg__knop--kop{display:none}
.lzg__menuknop{display:flex}
.lzg__uur{grid-template-columns:70px 1fr 1fr;row-gap:6px}
.lzg__uur-plek{grid-column:2}
.lzg__uur button{grid-column:3;justify-self:start}
.lzg__tr-raster{grid-template-columns:1fr 1fr}
.lzg__tr:nth-child(n){margin-top:0}
}
@container (max-width:760px){
.lzg__top-in{flex-direction:column;gap:2px}
.lzg__h1{font-size:var(--fs5)}
.lzg__h2{font-size:var(--fs4)}
.lzg__raster{grid-template-columns:1fr 1fr;grid-template-rows:auto 240px 150px auto}
.lzg__cel--tekst{grid-column:1/-1;grid-row:1;padding:8px 0 16px}
.lzg__cel--groot{grid-column:1/-1;grid-row:2}
.lzg__cel--a{grid-column:1;grid-row:3}
.lzg__cel--b{grid-column:2;grid-row:3}
.lzg__cel--nu{grid-column:1/-1;grid-row:4;gap:12px}
.lzg__uitgelicht,.lzg__prijs-in,.lzg__stem,.lzg__proef-in{grid-template-columns:1fr}
.lzg__lijst li{grid-template-columns:96px 1fr;gap:16px}
.lzg__lijst img{width:96px;height:96px}
.lzg__uur{grid-template-columns:56px 1fr;gap:4px 12px}
.lzg__uur-tr,.lzg__uur-plek,.lzg__uur button{grid-column:2}
.lzg__uur button{justify-self:start;margin-top:6px}
.lzg__loods-in{grid-template-columns:1fr 1fr;margin-top:0}
.lzg__loods-tekst{grid-column:1/-1;padding:28px 0 0}
.lzg__form{grid-template-columns:1fr}
.lzg__voet-kol{grid-template-columns:1fr 1fr}
.lzg__voet-kol>div:first-child{grid-column:1/-1}
.lzg__euro{font-size:var(--fs5)}
}
@media (prefers-reduced-motion:reduce){.lzg *{transition:none!important;scroll-behavior:auto!important}}// Loods Zuid · boutique gym, Rotterdam · NedDev · eigen werk.
// root = het element waarin de HTML staat
function init(root){
var s=root.querySelector('.lzg');if(!s)return;
var knop=s.querySelector('.lzg__menuknop'),menu=s.querySelector('.lzg__menu');
knop.addEventListener('click',function(){var open=menu.hidden;menu.hidden=!open;knop.setAttribute('aria-expanded',String(open));knop.setAttribute('aria-label',open?'Menu sluiten':'Menu openen');});
menu.addEventListener('click',function(e){if(e.target.closest('a')){menu.hidden=true;knop.setAttribute('aria-expanded','false');knop.setAttribute('aria-label','Menu openen');}});
var nu=new Date(),dag=nu.getDay();
var open={0:'09:00 tot 12:00',1:'06:30 tot 21:30',2:'06:30 tot 21:30',3:'06:30 tot 21:30',4:'06:30 tot 21:30',5:'06:30 tot 20:00',6:'08:00 tot 13:00'};
var vt=s.querySelector('.lzg__vandaag');if(vt)vt.textContent='Vandaag open van '+open[dag];
var li=s.querySelector('.lzg__tijden li[data-dag="'+dag+'"]');if(li)li.classList.add('is-vandaag');
var K=['Kracht','Femke'],C=['Conditie','Jayden'],B=['Boksen','Gerard'],R=['Roeien','Gerard'],M=['Mobiliteit','Elif'];
var W={
1:[['07:00',K,4],['09:30',M,6],['12:15',B,2],['18:00',K,3],['19:00',C,0],['20:15',R,8]],
2:[['07:00',B,1],['09:30',K,5],['12:15',R,7],['18:00',C,2],['19:15',M,9],['20:15',K,4]],
3:[['07:00',C,3],['12:15',K,6],['17:30',B,0],['18:30',K,1],['19:45',M,10]],
4:[['07:00',K,2],['09:30',M,8],['12:15',C,5],['18:00',B,3],['19:00',R,6],['20:15',K,7]],
5:[['07:00',R,6],['12:15',B,4],['17:00',K,2],['18:15',C,5]],
6:[['08:30',K,0],['09:45',C,3],['11:00',B,5]],
0:[['09:30',M,4],['10:45',K,6]]};
var nl=['zo','ma','di','wo','do','vr','za'],lang=['zondag','maandag','dinsdag','woensdag','donderdag','vrijdag','zaterdag'];
function min(t){var p=t.split(':');return +p[0]*60+ +p[1];}
var nuMin=nu.getHours()*60+nu.getMinutes();
var dagen=s.querySelector('.lzg__dagen'),uren=s.querySelector('.lzg__uren'),knoppen=[];
for(var i=0;i<7;i++){var d=new Date(nu.getFullYear(),nu.getMonth(),nu.getDate()+i);var b=document.createElement('button');b.type='button';b.className='lzg__dag';b.setAttribute('role','tab');
b.textContent=i===0?'Vandaag':i===1?'Morgen':nl[d.getDay()]+' '+d.getDate();b.dataset.dag=d.getDay();b.dataset.off=i;b.dataset.datum=lang[d.getDay()]+' '+d.getDate();dagen.appendChild(b);knoppen.push(b);}
function toon(b){knoppen.forEach(function(x){var aan=x===b;x.setAttribute('aria-selected',String(aan));x.tabIndex=aan?0:-1;});
var lijst=W[b.dataset.dag],vandaag=b.dataset.off==='0',volgendeGezet=false;uren.innerHTML='';
lijst.forEach(function(r){var el=document.createElement('li');el.className='lzg__uur';var m=min(r[0]),plek=r[2]===0?'Vol':r[2]+' van 14 vrij',geweest=vandaag&&m<nuMin;
if(geweest){el.classList.add('is-geweest');plek='Geweest';}
else if(vandaag&&!volgendeGezet){volgendeGezet=true;el.classList.add('is-volgende');var over=m-nuMin;plek=(over<=180?'Begint over '+(over<60?over+' min':Math.floor(over/60)+' uur '+(over%60)+' min'):'Eerstvolgende les')+', '+(r[2]===0?'vol':r[2]+' vrij');}
el.innerHTML='<time>'+r[0]+'</time><span class="lzg__uur-les">'+r[1][0]+'</span><span class="lzg__uur-tr">met '+r[1][1]+'</span><span class="lzg__uur-plek">'+plek+'</span>';
var k=document.createElement('button');k.type='button';k.textContent=r[2]===0?'Vol, wachtlijst in de app':'Proefles in deze les';k.disabled=geweest||r[2]===0;
k.addEventListener('click',function(){kiesLes(r[1][0],b.dataset.datum,r[0]);});el.appendChild(k);uren.appendChild(el);});}
knoppen.forEach(function(b,i){b.addEventListener('click',function(){toon(b);});b.addEventListener('keydown',function(e){var n=e.key==='ArrowRight'?1:e.key==='ArrowLeft'?-1:0;if(n){var v=knoppen[(i+n+7)%7];v.focus();toon(v);}});});
toon(knoppen[0]);
var heroNu=s.querySelector('.lzg__nu');
(function(){for(var o=0;o<3;o++){var dd=(dag+o)%7,l=W[dd];for(var j=0;j<l.length;j++){var r=l[j];if(o===0&&min(r[0])<nuMin)continue;if(r[2]===0)continue;
var wanneer=o===0?'Vandaag':o===1?'Morgen':'Op '+lang[dd];heroNu.innerHTML=wanneer+' om '+r[0]+' nog '+r[1][0]+' bij '+r[1][1]+', <strong>'+r[2]+(r[2]===1?' plek':' plekken')+' vrij</strong>.';return;}}})();
var form=s.querySelector('.lzg__form'),gekozen=s.querySelector('.lzg__gekozen'),fout=s.querySelector('.lzg__fout'),klaar=s.querySelector('.lzg__klaar'),keus='';
function kiesLes(les,datum,tijd){form.les.value=les;keus=les+' op '+datum+' om '+tijd;gekozen.textContent='Gekozen: '+keus+'.';gekozen.hidden=false;s.querySelector('#lzg-proef').scrollIntoView({behavior:'smooth',block:'start'});}
form.addEventListener('submit',function(e){e.preventDefault();var naam=form.naam.value.trim(),tel=form.tel.value.replace(/[^0-9]/g,'');
if(!naam||tel.length<10){fout.hidden=false;return;}fout.hidden=true;form.hidden=true;klaar.hidden=false;
klaar.textContent='Dank je, '+naam.split(' ')[0]+'. '+(keus?'We houden een plek vrij in '+keus+'. ':'')+'Je hoort binnen een werkdag van ons op '+form.tel.value.trim()+'.';});
var rk=s.querySelector('.lzg__reken'),euro=s.querySelector('.lzg__euro'),uitleg=s.querySelector('.lzg__uitleg');
var P={1:[49,4.3],2:[69,8.7],3:[89,13]};
function reken(){var k=rk.querySelector('input[name=keer]:checked').value,p=P[k][0];if(rk.jaar.checked)p-=8;if(rk.korting.checked)p=Math.round(p*0.85);
euro.textContent='€'+p;var per=(p/P[k][1]).toFixed(2).replace('.',',');
uitleg.textContent=(k==='3'?'Leden met onbeperkt komen gemiddeld 13 keer per maand, ':'Ongeveer '+Math.round(P[k][1])+' lessen per maand, ')+'zo\'n €'+per+' per les.';}
rk.addEventListener('change',reken);rk.addEventListener('submit',function(e){e.preventDefault();});reken();
}
init(document.querySelector('.jouw-container'));
Add it to your selection and send it over. We build your site around it, in your brand.
Get in touch →