Memory - Expediente

<link href="https://fonts.googleapis.com/css?family=Rochester" rel="stylesheet"><br><center><div style="background: url('https://i.imgur.com/sxjvRYv.png')" class="bebe"><div class="namiga">Nombre del pj</div><div class="tabbiesC"><div class="tabbies"> <input type="radio" id="tabbies-1" name="tabbies-group-1" checked><label for="tabbies-1">BÁSICO</label><div class="contenido"><div style="padding: 10px; text-align: justify;">
<div class="Sol">DATO</div><div class="Sol">DATO</div><div class="Sol">DATO</div><div class="Sol">DATO</div><div class="Sol">DATO</div>

</div></div></div><div class="tabbies"><input type="radio" id="tabbies-2" name="tabbies-group-1"><label for="tabbies-2">DESCRIPCIONES</label><div class="contenido">
<div class="Sol">CUERPO</div> <br>
TEXTO TEXTO

<div class="Sol">PSIQUE</div><br>
TEXTO TEXTO

</div></div><div class="tabbies"><input type="radio" id="tabbies-3" name="tabbies-group-1"><label for="tabbies-3">HISTORIA</label><div class="contenido">
<div class="Sol">Historia</div><br>
TEXTO TEXTO

<div class="Sol">OTROS</div><br>
TEXTO TEXTO

</div></div></div></div></center><div style="font-size: 7px; width: 460px; text-align: right; letter-spacing: 1px; margin: auto; position: relative; top: -20px; z-index: 50; color: #fff;"><span class="th th-creative-commons"></span> <a href="https://hyeri-code.tumblr.com/" style="color: #fff">HYE RI</a></div>


<style>.tabbiesC {background:#fff;position:relative;width:400px;height:300px;color:#000;font-size:11px;outline:#00cc99 solid 1px;outline-offset:-5px;top:160px;padding:10px;}.tabbies {float:left;margin-left:20px;}.tabbies label {display:block;position:relative;color:#000;margin-left:5px;margin-bottom:5px;font-size:11px;z-index:20;width:90px;padding:5px;}.tabbies [type=radio] {display:none;}.contenido {width:370px;height:260px;border-top:10px solid #fff;border-left:10px solid #fff;padding-right:5px;overflow:auto;color:#000;text-align:justify;opacity:0;transition:1s;position:absolute;top:32px;left:10px;}[type=radio]:checked ~ label {z-index:30;color:#000;border-bottom:#00cc99 solid 3px;background:#fff;}[type=radio]:checked ~ label ~ .contenido {z-index:10;transition:1s all ease-in-out;opacity:1;}#Destino {width:250px;height:30px;overflow:hidden;outline:#00cc99 solid 1px;outline-offset:-5px;margin:auto;}#Casualidad {width:220px;height:120px;background:rgba(132,46,92,0.6);opacity:0;transition:ease-in-out .7s;}.Rose {font-family:Rochester, cursive;color:#ff9fbd;font-size:50px;position:relative;top:10px;}.Guapa {font-family:'Open Sans Condensed', sans-serif;color:#fefefe;font-size:18px;text-shadow:#000 1px 1px 0;text-align:center;text-transform:uppercase;position:relative;top:-35px;margin-bottom:-28px;}.Sol {text-align:center;text-transform:uppercase;letter-spacing:4px;width:270px;border-bottom:1px #00cc99 solid;margin:auto;padding:5px;}.namiga{ font-family: Rochester; font-size: 45px; text-shadow: #000 1px 1px 0px;; pagging: 5px; color: #fff; position: relative; top: 150px;}.bebe{ width: 480px; height:567px; outline: #00cc99 1px solid; outline-offset: 5px;}</style>