Hermione Thread Tracker (2)

<div class="hermione">
<input id="he1" type="radio" name="hermione" checked></input>
<input id="he2" type="radio" name="hermione"></input>
<input id="he3" type="radio" name="hermione"></input>
<input id="he4" type="radio" name="hermione"></input>
<div class="hebody">
<div class="he1">
<div class="heimg" style="background:url(http://placehold.it/240x340);"></div>
<div class="hetext">
<h>N</h>
<p>A quote goes here.</p>
</div>
</div>
<div class="he2">
<h><i class="sf sf-check-o"></i></h>
<div class="heenv">
<h1>2018</h1>
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<h1>2019</h1>
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<a href="">Nombre del tema</a> / 00-00 / Con quién.
</div>
</div>
<div class="he3">
<h><i class="sf sf-clock-3-o"></i></h>
<div class="heenv">
<h1>2018</h1>
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<h1>2019</h1>
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<a href="">Nombre del tema</a> / 00-00 / Con quién.
</div>
</div>
<div class="he4">
<h><i class="sf sf-lock-o"></i></h>
<div class="heenv">
<h1>2018</h1>
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<h1>2019</h1>
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<a href="">Nombre del tema</a> / 00-00 / Con quién.
<a href="">Nombre del tema</a> / 00-00 / Con quién.
</div>
</div>
</div>
<div class="heheader">
<h>Name of Character</h>
<div class="helinks">
<label for="he1"><i class="sf sf-home-o"></i></label>
<label for="he2"><i class="sf sf-check-o"></i></label>
<label for="he3"><i class="sf sf-clock-3-o"></i></label>
<label for="he4"><i class="sf sf-lock-o"></i></label>
</div>
</div>
</div>
<a href="http://necromancercoding.tumblr.com/" class="ncredit">NC</a>
<style>.hermione {--bckg-1: #fafafa;--bckg-2: #f4f4f4;--border-1: #f4f4f4;--border-2: #cfcfcf;--accent-1: #91a6ae;--accent-2: #67777e;--shadow: #fff;--txt: #666;}</style><link href="//dl.dropbox.com/s/50g6fbds3rh4m0j/saturnicons.css" rel="stylesheet"/><link href="https://dl.dropbox.com/s/pxanj21qaxbsdf4/Signerica.css" rel="stylesheet"/><link href="https://fonts.googleapis.com/css?family=Montserrat:900&display=swap" rel="stylesheet"/><link href="https://dl.dropbox.com/s/rypz1jmvrmqa1vt/hermione2.css" rel="stylesheet"/>