come alive - post de rol

<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;700&family=Ultra&display=swap" rel="stylesheet">

<div class="alive"><div class="alive2">come alive</div><div class="alive3">lugar + persona + fecha</div><div class="alive4"><b>Así se ve en negritas.</b> Lorem ipsum dolor sit amet, consectetur adipiscing elit. <i>Así se ve en cursiva.</i> Aliquam ut lacus leo. Aliquam a pellentesque ex. Nam pulvinar efficitur lacus bibendum placerat. Donec rutrum auctor eros eget ornare.

Etiam turpis mauris, congue a nisi vitae, tempor efficitur nibh. Phasellus scelerisque diam a lacus maximus imperdiet. Curabitur risus lectus, vestibulum a facilisis at, pulvinar sed ipsum. Cras neque urna, eleifend eu cursus nec, eleifend in felis. Donec dignissim ligula ut pellentesque vehicula. Nulla quis tempor mauris. Etiam sollicitudin nisi vitae ex cursus dignissim.</div></div>
<div class="stdcred"><a href="https://stardustcodes.tumblr.com/ "target="_blank">stardust</a></div>

<style>.alive{margin: 5px auto; width: 340px; height: 430px; padding: 20px; background: #a5c6b1; border: 12px solid #fff; outline: 1px solid #d9d9d9; display: flex; flex-wrap: wrap; align-content: center; justify-content: center; position: relative;}.alive2{width: 300px; font-family: Ultra; font-size: 60px; color: #fff; text-align: center; line-height: 100%; transition: 0.5s; opacity: 1;}.alive3{margin-top: 5px; background: #fff; padding: 3px 8px; border-radius: 10px; font-family: Raleway; font-weight: 700; font-size: 11px; color: #a5c6b1; text-align: center; transition: 0.5s;}.alive4{margin: 40px; height: 300px; overflow: auto; padding: 25px; position: absolute; background: rgba(255, 255, 255, 0.9); opacity: 0; transition: 1s; font-family: Raleway; font-weight: 400; font-size: 12px; color: #2C2928; text-align: justify; line-height: 150%;}.alive4 b{color: #a5c6b1; font-weight: 700;}.alive4 i, alive4 a{color: #a5c6b1;}.alive:hover .alive4{opacity: 1;}.alive4::-webkit-scrollbar-thumb{background: #a5c6b1;}.alive4::webkit-scrollbar{width: 10px;}.stdcred{margin: 0 auto; width: 90px; padding: 3px; background: #fff; text-align: center; border: 1px solid #d9d9d9; border-radius: 10px;}.stdcred a{text-decoration: none; font-family: calibri; font-size: 9px; color: #888; text-transform: uppercase; letter-spacing: 3px;}</style>