Trending Ficha

<div class="trending">
<div class="tdheader">
<div class="tdhleft">
<span>Welcome, <strong>Name of Character</strong>.</span>
<em>Quote of the character, not very long.</em>
</div>
<div class="tdhright">
<div class="tdhdato">
<em class="th th-briefcase-o"></em>
<span><strong>Título:</strong><em>Dato</em></span>
</div>
<div class="tdhdato">
<em class="th th-bookmark-1-o"></em>
<span><strong>Título:</strong><em>Dato</em></span>
</div>
<div class="tdhdato">
<em class="th th-blossom-o"></em>
<span><strong>Título:</strong><em>Dato</em></span>
</div>
<div class="tdhicon" style="background-image:url(http://placehold.it/60);"></div>
</div>
</div>
<div class="tdbody">
<div class="tdtexto">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sit amet mauris orci. In urna justo, ornare varius fermentum dapibus, convallis quis ligula. Donec vitae risus quis mauris dignissim luctus. Proin facilisis vulputate dolor, ut eleifend neque vehicula a. Proin quis efficitur orci. Donec pulvinar magna metus, vitae commodo dolor ullamcorper id. In vitae porttitor nisl. Aliquam sed tempus arcu, eu volutpat mi. Pellentesque malesuada interdum massa, at convallis tortor convallis rutrum. Ut at rutrum lacus. Etiam interdum malesuada turpis. Donec eleifend ullamcorper hendrerit. Ut tempus auctor quam fermentum hendrerit. Cras fermentum, mi quis tempor pharetra, tellus sapien pellentesque mauris, maximus ornare velit sapien vitae diam. Ut lacinia tellus quis mi ornare, eu sollicitudin libero congue. Etiam dignissim sem id odio rhoncus, ut elementum neque vulputate.
<br/><br/>
Suspendisse vulputate placerat ligula, at viverra dui finibus vel. Curabitur vitae tristique velit, et luctus nisi. Phasellus a erat quis diam tristique volutpat id at justo. Proin tincidunt ipsum erat. Aenean eleifend diam faucibus nunc ullamcorper cursus. Aenean ut pulvinar risus, eu rhoncus turpis. Fusce tincidunt tellus vel tempor auctor. Nunc gravida turpis sed quam pulvinar venenatis. Nunc congue tristique eros, nec pharetra dui luctus et. Aenean pharetra erat ut dapibus ornare. Etiam efficitur, lectus vel blandit sodales, lectus diam sodales nulla, non lacinia est odio nec arcu. Etiam aliquam justo eros, non laoreet ante eleifend in.</div>
<div class="tdenv">
<div class="tdtexto">
<span class="tdttitle">Título de la caja</span>
<div class="tdbox"><strong>Título:</strong> Dato.
<br/>
<strong>Título:</strong> Dato.
<br/>
<strong>Título:</strong> Dato.</div>
</div>
<div class="tdtexto">
<span class="tdttitle">Título de la caja</span>
<div class="tdbox">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sit amet mauris orci. In urna justo, ornare varius fermentum dapibus, convallis quis ligula. Donec vitae risus quis mauris dignissim luctus. Proin facilisis vulputate dolor, ut eleifend neque vehicula a. Proin quis efficitur orci. Donec pulvinar magna metus, vitae commodo dolor ullamcorper id. In vitae porttitor nisl. Aliquam sed tempus arcu, eu volutpat mi. Pellentesque malesuada interdum massa, at convallis tortor convallis rutrum. Ut at rutrum lacus. Etiam interdum malesuada turpis. Donec eleifend ullamcorper hendrerit. Ut tempus auctor quam fermentum hendrerit. Cras fermentum, mi quis tempor pharetra, tellus sapien pellentesque mauris, maximus ornare velit sapien vitae diam. Ut lacinia tellus quis mi ornare, eu sollicitudin libero congue. Etiam dignissim sem id odio rhoncus, ut elementum neque vulputate.
<br/><br/>
Suspendisse vulputate placerat ligula, at viverra dui finibus vel. Curabitur vitae tristique velit, et luctus nisi. Phasellus a erat quis diam tristique volutpat id at justo. Proin tincidunt ipsum erat. Aenean eleifend diam faucibus nunc ullamcorper cursus. Aenean ut pulvinar risus, eu rhoncus turpis. Fusce tincidunt tellus vel tempor auctor. Nunc gravida turpis sed quam pulvinar venenatis. Nunc congue tristique eros, nec pharetra dui luctus et. Aenean pharetra erat ut dapibus ornare. Etiam efficitur, lectus vel blandit sodales, lectus diam sodales nulla, non lacinia est odio nec arcu. Etiam aliquam justo eros, non laoreet ante eleifend in.</div>
</div>
</div>
</div>
<div class="tdimgs">
<div class="tdenv">
<div class="tdimg1" style="background-image:url(http://placehold.it/200x140);"></div>
<div class="tdenv">
<div class="tdimg2" style="background-image:url(http://placehold.it/90);"></div>
<div class="tdimg2" style="background-image:url(http://placehold.it/90);"></div>
</div>
</div>
<div class="tdimg3" style="background-image:url(http://placehold.it/320x250);"></div>
</div>
</div>
<a href="https://necromancercoding.tumblr.com/" class="ncredit">NC</a>
<style>.trending { --bckg1: #eaeaea; --bckg2: #f4f4f4; --accent1: #a6a65d; --accent2: #8a8a4a; --text: #666; --title: #fff; --subtitle:#aaa; --border:1px solid #ddd; --bradius1:30px; --bradius2:15px; --shadow-d: 1px 1px var(--accent2), -1px 1px var(--accent2), 1px -1px var(--accent2), -1px -1px var(--accent2); --bshadow: 0 0 5px rgba(0,0,0,0.08); }</style><link href="//solrainha.github.io/honeybee/honeybee.css" rel="stylesheet"/><link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&family=Roboto:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet"/><link href="https://dl.dropbox.com/s/zq4z07b77gw5spi/trending.css" rel="stylesheet"/>