Pack The Fool (HTML)

<!-- Comienzo de FICHA -->
<div class="fool foolficha">
<div class="foolheader">
<strong style="font-size:120px;">the fool</strong>
<em>nombre del personaje</em>
</div>
<div class="fooltext">Lorem ipsum dolor sit amet.</div>
<div class="foolenv">
<div class="foolimg" style="background-image:url(https://i.imgur.com/CiIEVUl.jpg);"></div>
<div class="fooldatos">
<span><strong>Dato:</strong><em>Dato.</em></span>
<span><strong>Dato:</strong><em>Dato.</em></span>
<span><strong>Dato:</strong><em>Dato.</em></span>
<span><strong>Dato:</strong><em>Dato.</em></span>
</div>
</div>
</div>
<!-- Final de FICHA -->
<!-- Comienzo de BÚSQUEDA -->
<div class="fool foolbusq">
<div class="foolheader">
<strong style="font-size:120px;">the fool</strong>
<em>nombre del personaje</em>
</div>
<div class="foolenv">
<div class="foolimg" style="background-image:url(https://i.imgur.com/7zF1xZl.jpg);"></div>
<div class="fooltext">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
</div>
<div class="foolspans">
<span>Dato</span>
<span>Dato</span>
<span>Dato</span>
<span>Dato</span>
</div>
</div>
<!-- Final de BÚSQUEDA -->
<!-- Comienzo de ADMIN NORMAL -->
<div class="fool fooladmin">
<div class="foolheader">
<strong style="font-size:120px;">the fool</strong>
<em>título del post</em>
</div>
<div class="fooltext">Lorem ipsum dolor sit amet.</div>
</div>
<!-- Final de ADMIN NORMAL -->
<!-- Comienzo de ADMIN IMAGEN -->
<div class="fool fooladmin foolambi">
<div class="foolimg" style="background-image:url(https://i.imgur.com/oCTzMrK.jpg);background-position:center 40%;"></div>
<div class="fooltext">Lorem ipsum dolor sit amet.</div>
<div class="foolheader">
<strong style="font-size:120px;">the fool</strong>
<em>título del post</em>
</div>
</div>
<!-- Final de ADMIN IMAGEN -->
<!-- Comienzo de ADMIN REGISTROS -->
<div class="fool fooladmin foolregs">
<div class="foolheader">
<strong style="font-size:120px;">the fool</strong>
<em>título del post</em>
</div>
<div class="fooltext">Lorem ipsum dolor sit amet.</div>
<div class="foolenv">
<!--Aquí empieza la caja-->
<div class="fooldatos">
<strong>Título de la sección</strong>
<div class="fooltext">
<span><strong>Nombre</strong><em>Dato.</em></span>
</div>
</div>
<!--Aquí termina la caja-->
<!--Aquí empieza la caja-->
<div class="fooldatos">
<strong>Título de la sección</strong>
<div class="fooltext">
<span><strong>Nombre</strong><em>Dato.</em></span>
</div>
</div>
<!--Aquí termina la caja-->
<!--Aquí empieza la caja-->
<div class="fooldatos">
<strong>Título de la sección</strong>
<div class="fooltext">
<span><strong>Nombre</strong><em>Dato.</em></span>
</div>
</div>
<!--Aquí termina la caja-->
</div>
</div>
<!-- Final de ADMIN REGISTROS -->
<!-- Comienzo de ROL -->
<div class="fool foolrol">
<div class="foolheader">
<strong style="font-size:120px;">the fool</strong>
<em>título del post</em>
</div>
<div class="fooltext">Lorem ipsum dolor sit amet.</div>
<div class="foolspans">
<span>Dato</span>
<span>Dato</span>
<span>Dato</span>
<span>Dato</span>
</div>
</div>
<!-- Final de ROL -->