Ficha do personagem

por **Natasha Zhirkovyh** Sex Jul 11, 2014 9:36 pm

Nombre del Personaje

Datos del Personaje

NOME DO PERSONAGEM

ESCREVA AQUI

IDADE

ESCREVA AQUI

GRUPO

ESCREVA AQUI

ORIENTAÇÃO SEXUAL

ESCREVA AQUI

LUGAR DE ORIGEN

ESCREVA AQUI

GRUPO EXTRA

ESCREVA AQUI, CASO SEJA UM DOS VOLUNTÁRIOS DOS JOGOS A QUAL GRUPO PERTENCE.

Descrição Psicológica e Física

Bla bla bla soy una descripción psicológica!

Historia

Bla bla bla soy una historia!

Extras

Bla bla bla soy un extra!

Thanks Itzel [Tens de ter uma conta e sessão iniciada para poderes visualizar este link]

Código:: <link href='http://fonts.googleapis.com/css?family=Cutive+Mono|Megrim|Poiret+One|Dosis' rel='stylesheet' type='text/css'><style>div::-webkit-scrollbar {width: 6px; background: #ffffff;} div::-webkit-scrollbar-thumb {height: 10px; background: #888888;} div::-webkit-scrollbar-track {height: 3px; background:#ffffff;} div::-webkit-scrollbar-button {height: 3px; background:#ffffff;} #fondo {background: #ffffff; width: 550px; height: 650px; box-shadow: 1px 1px 15px; margin: 0 auto; font-size: 12px; font-family: Dosis;} #img {width: 500px; height: 180px; position: relative; margin: 0 auto; margin-top: 10px;} #img img {width: 500px; height: 180px;} #img:hover #nombre {opacity: 0.6; transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -webkit-transition: all 1s ease-in-out;} #nombre {background: #ffffff; width: 480px; height: 160px; display: flex; align-items: center; margin: 0 auto; opacity: 0; position: absolute; top: 0px; left:0px; padding: 10px;transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -webkit-transition: all 1s ease-in-out;} #subnombre {height: 160px; overflow: auto; display: flex; align-items: center; margin: 0 auto; text-align: center; font-size: 40px; font-family: Megrim; color: #444444;} #texto{width: 550px; height: 420px; position: relative; left: -5px;} #datos {background: #888888; width: 250px; height; 25px; margin: 0px auto; margin-top: 10px; margin-bottom: 10px; text-align: center; letter-spacing: 2px; font-size: 14px; color:#f0f0f0;} .text {background: #f0f0f0; width: 317px; height: 420px; position: absolute; top: -1px; left: 212px; overflow: auto; padding: 0px 10px 0px 10px; font-size: 14px; text-align: justify; color: #000000; font-family: Dosis;} .tab {float: bottom; margin-top: -13px; margin-left: -5px; text-align: justify;} .tab label {background: #888888; position: relative; display: block; box-shadow: 1px 1px 2px #000000; width: 150px; height: 15px; margin-top: 0px; margin-bottom: 0px; text-transform: uppercase; font-family: Poiret One; color: #ffffff; font-size: 12px; padding: 5px 10px; cursor: pointer; transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out;} .tab [type=radio] {display: none; baseline-tab-shift: true, retrieve;} [type=radio]:checked ~ label {background: #444444; padding: 5px 25px; cursor: default; transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; z-index: 2;} [type=radio]:checked ~ label ~ .text {z-index: 1;} #firma {position: relative; top: -462px; text-align: right; font-size: 10px; font-family: Cutive Mono; text-transform: uppercase; color: #888888;} #firma a{color: #888888;}</style> <div id="fondo"> <div id="img"><img src="IMAGEN DE 500 x 180"></img><div id="nombre"><div id="subnombre">Nombre del Personaje</div></div></div> <div id="texto"> <div class="tab"><input type="radio" id="tab-1" name="tab-group-1" checked><label for="tab-1">Datos del Personaje</label> <div class="text"><center><div id="datos">NOME DO PERSONAGEM</div>ESCREVA AQUI <div id="datos">IDADE</div>ESCREVA AQUI <div id="datos">GRUPO</div>ESCREVA AQUI <div id="datos">ORIENTAÇÃO SEXUAL</div>ESCREVA AQUI <div id="datos">LUGAR DE ORIGEN</div>ESCREVA AQUI <div id="datos">GRUPO EXTRA</div>ESCREVA AQUI, CASO SEJA UM DOS VOLUNTÁRIOS DOS JOGOS A QUAL GRUPO PERTENCE.</center></div></div> <div class="tab"><input type="radio" id="tab-2" name="tab-group-1"><label for="tab-2">Descrição Psicológica e Física</label> <div class="text">Bla bla bla soy una descripción psicológica!</div></div> <div class="tab"><input type="radio" id="tab-3" name="tab-group-1"><label for="tab-3">Historia</label> <div class="text">Bla bla bla soy una historia!</div></div> <div class="tab"><input type="radio" id="tab-4" name="tab-group-1"><label for="tab-4">Extras</label> <div class="text">Bla bla bla soy un extra!</div></div> </div> <div id="firma">Thanks Itzel <a href="http://sourcecode.jcink.net/index.php?act=ST&f=7&t=871">■</a></div> </div>