MF1.- Citrus (índice)

<div class="MF1" style="color: #333;"><div class="imgMF1"><div style="background-image: url(https://i.postimg.cc/kXp3jhCQ/ezgif-2-f12c28a41d73.jpg);"></div></div><div class="inMF1 ho"><i>I'm...</i><b>The Juice</b></div><div class="inMF1 ico"><a class="th th-bubble-heart" href="URL" title="¡Escribeme!"></a></div><div class="inMF1 quo"><i>Powder cotton candy liquorice ice cream croissant. Gummies icing tootsie roll jelly beans dessert.</i></div><div class="imgMF1 dos"><div style="background-image: url(https://i.postimg.cc/L8gdGB4r/ezgif-2-3e7fb45f1021.jpg);"></div></div><div class="linMF1">
<div><a class="th th-folder-3" href="URL" title="¿Dónde Llevo?"></a></div>
<div><a class="th th-calendar-1" href="URL" title="¿Dónde Llevo?"></a></div>
<div><a class="th th-users" href="URL" title="¿Dónde Llevo?"></a></div>
<div><a class="th th-loupe-o" href="URL" title="¿Dónde Llevo?"></a></div>
<div><a class="th th-camera" href="URL" title="¿Dónde Llevo?"></a></div>
<div><a class="th th-smartphone" href="URL" title="¿Dónde Llevo?"></a></div>
<div><a class="th th-twitter-o" href="URL" title="¿Dónde Llevo?"></a></div>
<div><a class="th th-heart-1" href="URL" title="¿Dónde Llevo?"></a></div>
</div><div class="inMF1 ran"><span class="th th-orange-o"></span><b>Mood<i>sarcastic</i></b></div></div><a class="miMF1" href="https://emmescodes.tumblr.com/" title="Code by Emme">Emme</a>

<link href="https://fonts.googleapis.com/css?family=Montserrat&display=swap" rel="stylesheet"><link href="//dl.dropbox.com/s/vpi3f9s7nhpe7v7/honeybee.css" rel="stylesheet"><style>@font-face {font-family: Neistil; src: url(https://cdn.statically.io/gh/EmmesCodes/Tipografias/0a57d780/NEISTIL.TTF);} .MF1, .MF1 * {box-sizing: border-box;} .MF1 {width: 500px; margin: auto; position: relative; font: 10px Lato;} .imgMF1 {background: #111; border: 1px solid; width: 120px; padding: 8px;} .imgMF1 > div {border: 1px solid; height: 102px; padding: 8px; background-color: #333; background-clip: content-box; background-position: center; background-size: cover;} .inMF1 {border: 1px solid; background: #111; position: absolute;} .inMF1.ho {height: 50px; top: 0; left: 125px; right: 55px; padding: 8px 10px;} .inMF1.ico {top: 0; right: 0; width: 50px; height: 50px;} .inMF1.quo {top: 55px; right: 0; height: 65px; left: 125px; overflow: hidden;} .imgMF1.dos {width: 180px; margin: 5px 0 0 320px;} .imgMF1.dos > div {height: 60px;} .linMF1 {top: 125px; bottom: -5px; right: 180px; position: absolute; font-size: 0px; width: 164px;} .linMF1 > div {background: #111; border: 1px solid; width: 36px; height: calc(50% - 5px); display: inline-block; margin: 0 5px 5px 0;} .inMF1.ran {left: 0; bottom: 0; height: 78px; right: 349px; overflow: hidden;} .linMF1 a {font-size: 15px; display: block; text-align: center; transform: scale(.7); transition: .3s; color: #82d837;} .linMF1 a::before {line-height: 34px;} .linMF1 div:nth-of-type(odd) a {color: #eb6b1f;} .linMF1 div:nth-of-type(3n) a {color: #ffe700;} .linMF1 a:hover, .inMF1.ico a:hover {transform: scale(1);} .inMF1.ico a {display: block; font-size: 25px; text-align: center; transition: .3s; transform: scale(.7); color: #82d837;} .inMF1.ico a:before {line-height: 48px;} .inMF1.ho b {display: block; font: 20px Neistil; text-transform: uppercase; letter-spacing: 5px; color: #eb6b1f;} .inMF1.ho i {color: #999;} .inMF1.quo::before {content: "\eca7"; font: 70px Honeybee; position: absolute; top: -35px; right: -12px; color: #111; text-shadow: 1px 1px #333, -1px 1px #333, 1px -1px #333, -1px -1px #333;} .inMF1.quo i {color: #777; position: absolute; font-size: 12px; text-align: center; width: 100%; top: 50%; transform: translateY(-50%); padding: 0 30px;} .inMF1.ran span {position: absolute; font-size: 70px; left: 6px; top: 13px; color: #111; text-shadow: 1px 1px #333, -1px 1px #333, 1px -1px #333, -1px -1px #333;} .inMF1.ran b {color: #777; text-align: center; position: absolute; width: 100%; top: 50%; transform: translateY(-50%);} .inMF1.ran i {display: block; text-transform: uppercase; font-size: 12px; color: #999; letter-spacing: 1px;} .inMF1.ran i::before, .inMF1.ran i::after {color: #82d837; font-weight: bold; font-size: 14px; margin: 0 5px;} .inMF1.ran i:before {content:"{"} .inMF1.ran i:after {content:"}"} .miMF1 {display: block; font: 10px arial; letter-spacing: 2px; text-align: center; transition: .5s;} .miF1:hover {letter-spacing: 10px;} .linMF1 > br {display: none;}</style>