Dear diary

<div id="badidea"><span id="gottago">TITULO</span><span>NOMBRE PJ</span> <span>EDAD</span> </div><div id="diary"><div class="losediary"> <div class="youdiary"><div class="hellagood"><a href="LINKTEMA">FECHA<i class="fas fa-pen-square"></i></a></div>Post realizado en Nombre del lugar con Nombre del pj. Información complementaria que se desee colocar.  </div>
<div class="youdiary"><div class="hellagood"><a href="LINKTEMA">FECHA<i class="fas fa-pen-square"></i></a></div>Post realizado en Nombre del lugar con Nombre del pj. Información complementaria que se desee colocar.  </div>
<div class="youdiary"><div class="hellagood"><a href="LINKTEMA">FECHA <i class="fas fa-pen-square"></i></a></div>Post realizado en Nombre del lugar con Nombre del pj. Información complementaria que se desee colocar. </div>
<div class="youdiary"><div class="hellagood"><a href="LINKTEMA">FECHA<i class="fas fa-pen-square"></i></a></div>Post realizado en Nombre del lugar con Nombre del pj. Información complementaria que se desee colocar. </div>
</div> <div class="diarymagic" style="background: url('IMAGEN AQUÍ');"><div class="oncediary"><a href="LINKPERFIL"><i class="fas fa-user-alt"></i> <div class="babycry">PERFIL</div></a></div><div class="oncediary" style="font-size: 30px;"><a href="LINKFICHA"><i class="far fa-file-alt"></i><div class="babycry">FICHA</div></a></div> <div class="oncediary" style="font-size: 30px"> <a href="LINKMP"><i class="fas fa-envelope"></i><div class="babycry">MP</div></a></div> </div></div><div class="credits"><a href="https://therocketgirl-codes.tumblr.com/">- LILITH</a>

<style>#diary{height: 500px; width: 505px; background:#F7F7F7; border-bottom: 10px solid #E19CB4;} .diarymagic{height: 500px; width: 250px; display: inline-block; vertical-align: top; text-align: right; } .oncediary{width: 30px; height: 30px; padding: 8px; border-radius: 50%; border: 2px solid #E19CB4; font-size: 27px; text-align: center; background: #E19CB4;position: relative; right: -227px; margin-top: 50px;} .oncediary a{color: #fff;} .oncediary:hover{transition: 1s; background: #fff;} .oncediary:hover a{color: #E19CB4;} .oncediary:hover .babycry{display:block; transition: 1s; border: 1px solid #E19CB4;} .losediary{overflow: auto; width: 240px; padding: 5px; height: 490px; display: inline-block;} #badidea{border-top: 10px solid #E19CB4; background: #fff; color: #E19CB4; text-align: right; width: 505px; padding-top: 8px; padding-bottom: 8px; height: 25px;} #badidea span{border-left: 7px solid #E19CB4; margin-right: 10px; padding: 3px; letter-spacing: 2px; font-family: Yeseva One; text-transform: uppercase;} #badidea #gottago{background: #E19CB4; padding: 3px; color: #fff; letter-spacing: 3px; float: left; margin-left: 10px; font-family: Yeseva One;} .babycry{margin-top: 20px; width: 45px; padding: 3px; font-size: 10px; color: #E19CB4; display: none; position: relative; font-family: Yeseva One; right: 10px; background: #fff} .hellagood{background: #fff; padding-top: 5px; padding-bottom: 5px; text-align: center; font-family: Yeseva One; font-size: 16px; margin-bottom: 5px;} .youdiary{width: 210px; height: 130px;padding: 5px; text-align: justify; border: 2px solid #fff; font-size: 11px; overflow: auto;} div::-webkit-scrollbar {width: 2px; height: 2px;} div::-webkit-scrollbar-button:start:decrement, div::-webkit-scrollbar-button:end:increment{height: 10px;display: none;background: pink;} div::-webkit-scrollbar-track-piece{background: #ccc;} div::-webkit-scrollbar-thumb:vertical{height: 20px; background: pink; border: 1px solid #E19CB4;} div::-webkit-scrollbar-thumb:horizontal{height: 20px;background: pink; border: 1px solid #E19CB4;} .credits{font-size: 10px; text-align: right; width: 500px; font-family: Frank Ruhl Libre; text-transform: lowercase; letter-spacing: 3px;} .credits a {color: #fff;} .hellagood a{color: #E19CB4;}</style>

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Yeseva+One" rel="stylesheet">