HTML_SCSS_Slider

<section class="section slider"> <div class="section__entry section__entry--center"> <h1 class="section__title heading-2">SCSS Only Slider</h1> <p class="section__text text">SCSS responsive slider.</p> </div> <input type="radio" name="slider" id="slide-1" class="slider__radio"> <input type="radio" name="slider" id="slide-2" class="slider__radio"> <input type="radio" name="slider" id="slide-3" class="slider__radio" checked> <input type="radio" name="slider" id="slide-4" class="slider__radio"> <input type="radio" name="slider" id="slide-5" class="slider__radio"> <div class="slider__holder"> <label for="slide-1" class="slider__item slider__item--1 card"> Card 1 </label> <label for="slide-2" class="slider__item slider__item--2 card"> Card 2 </label> <label for="slide-3" class="slider__item slider__item--3 card"> Card 3 </label> <label for="slide-4" class="slider__item slider__item--4 card"> Card 4 </label> <label for="slide-5" class="slider__item slider__item--5 card"> Card 5 </label> </div><!-- slider__holder --> <div class="bullets"> <label for="slide-1" class="bullets__item bullets__item--1">Bullet 1</label> <label for="slide-2" class="bullets__item bullets__item--2">Bullet 2</label> <label for="slide-3" class="bullets__item bullets__item--3">Bullet 3</label> <label for="slide-4" class="bullets__item bullets__item--4">Bullet 4</label> <label for="slide-5" class="bullets__item bullets__item--5">Bullet 5</label> </div> <!-- Bullets --> </section>