087 | Say Something

<div class="fi-fi"><div class="q-te"><div class="tx-te">Anywhere, I would've followed you. </div></div> <div class="si-mi"><span class="th th-butterfly-o"></span> <n>Say <b>something</b>, I'm giving up <b>on you</b></n> </div><div class="mi-mi" style="background: url(https://via.placeholder.com/200x400)"> </div><div class="txt-fi">

¡Inserta tu texto acá!

</div></div><div class="crdts"><a href="http://illmakegaycodesforu.tumblr.com/">— gitano;</a></div>

<style>.fi-fi {width: 520px; height: 399px; margin: 0 auto; position: relative; border: 15px solid #fff; background: #000; outline: 1px solid #eaeaea;line-height: 130%; overflow: hidden;}.mi-mi {position: absolute; top: 0px; bottom: 0px; left: 41px; width: 200px; border-left: 1px solid #fff; border-right: 1px solid #fff; background-size: cover!important; background-size: cover!important}.q-te {position: absolute; top: 0px; bottom: 0px; width: 50px;}.tx-te {color: #f3f3f3; position: absolute; bottom:184px; left: -180px; transform: rotate(-90deg); padding: 10px; width: 380px; z-index: 1; font: 9px 'Inconsolata'; text-transform: uppercase; letter-spacing: 1px;}.si-mi {width: 240px; height: 400px; position: absolute; top: 0px; right: 20px; display: flex; align-items: center; justify-content: center; flex-direction: column; transition: .8s}.fi-fi:hover .si-mi {top: -400px;}.si-mi span {font-size: 70px; color:#644c6f; margin-bottom: 20px; }.si-mi n {font: 18px 'Montserrat'; color: #fff; font-weight: 100; text-transform: uppercase; text-align: center;}.txt-fi {position: absolute; right: 40px; height: 360px; overflow-y: auto; color: #fff; width: 200px; text-align: justify; font: 10px 'Montserrat'; padding-right: 5px; top: 400px; transition: .8s;}.fi-fi:hover .txt-fi {top: 20px;}.txt-fi::-webkit-scrollbar {width: 3px;}.txt-fi::-webkit-scrollbar-thumb {background: #fff;}.txt-fi ::-webkit-scrollbar-track {background: transparent; border: none;}.crdts {text-decoration:none; font-family: verdana; font-size: 9px; text-align: center}</style> <link href="//dl.dropbox.com/s/vpi3f9s7nhpe7v7/honeybee.css" rel="stylesheet"><link href="https://fonts.googleapis.com/css2?family=Inconsolata:wght@200;300;400;500;600;700;800;900&display=swap" rel="stylesheet"><link href="https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900,900i&display=swap" rel="stylesheet">