skinny love - cronología

<link href="https://fonts.googleapis.com/css2?family=Anton&family=Roboto+Slab:wght@300;500&display=swap" rel="stylesheet">

<div class="skinny1"><div class="skinny2"><div class="skinny3">abiertos</div><a href="#">1. Título del tema</a>
con nombre del personaje

<a href="#">2. Título del tema</a>
con nombre del personaje

<div class="skinny3">cerrados</div><a href="#">1. Título del tema</a>
con nombre del personaje

<a href="#">2. Título del tema</a>
con nombre del personaje

<div class="skinny3">abandonados</div><a href="#">1. Título del tema</a>
con nombre del personaje

<a href="#">2. Título del tema</a>
con nombre del personaje

</div><img src="https://via.placeholder.com/190x340"></div><div class="stcred"><a href="https://stardustcodes.tumblr.com/ "target="_blank">stardust</a></div>

<style>.skinny1 {margin: 0 auto; width: 450px; height: 350px; background: #fff; padding: 20px; outline: 1px solid #d3e0ce; outline-offset: -20px; display: flex}.skinny1 img {margin: 5px}.skinny2 {width: 240px; height: 340px; padding: 5px; overflow: auto; font-family: roboto slab; font-weight: 300; font-size: 10px; color: #888}.skinny3 {background: #d3e0ce; font-family: anton; font-size: 16px; color: #fff; padding: 3px}.skinny2 a {text-decoration: none; font-family: roboto slab; font-weight: 500; font-size: 11px; color: #9cb8a0}.skinny2::-webkit-scrollbar {width: 8px}.skinny2::-webkit-scrollbar-track {background: #f1f1f1}.skinny2::-webkit-scrollbar-thumb {background: #9cb8a0}.stcred {margin: 0 auto; width: 400px; text-align: center} .stcred a{text-decoration: none; font-family: calibri; font-size: 9px; color: #888; text-transform: uppercase; letter-spacing: 3px}</style>