Página de personagens

<!--network theme base code by mady, or inspiredbylou-->

<link rel="shortcut icon" href="{Favicon}" />
  <head>
    <title>{Title}</title>

<link rel="alternate" type="application/rss+xml" href="{rss}">

<link href='http://fonts.googleapis.com/css?family=Poiret+One' rel='stylesheet' type='text/css'>


<style type="text/css">

body
{font-family: times;
font-size: 11px;
color: #000;
background-position: fixed;
background-attachment:fixed;
background-repeat:repeat;
background-color:#fff; /* Cor do fundo (de tudo) */}

a:link, a:active, a:visited{
color: #000; /* Cor dos links (dentro da descrição dos personagens) */
text-decoration: none;

}


::-webkit-scrollbar-thumb:vertical {
    background-color: #464646;/* cor da scrollbar */
    height:6px;
}

    ::-webkit-scrollbar-thumb:horizontal {
    background-color: #464646;/* cor da scrollbar*/
    height:3px;
}

::-webkit-scrollbar-corner {
    background-color: transparent;
}

::-webkit-scrollbar {
    margin-left: 5px;
	height:5px;
	width:5px;
}


#all {
    margin:30;
    margin-left:20%;
}

#pannel {
    width:280px;
    height:280px;
    padding:0px;
    background-color:#fff; /* cor do fundo da caixa dos personagens. Se for mudar a cor do fundo de tudo, coloque a mesma cor aqui */
}

#poster {
    width:250px;
    height:250px;
    margin-top:10px;
    background-color:#fff; /* cor do fundo da caixa dos personagens. Se for mudar a cor do fundo de tudo, coloque a mesma cor aqui */
}

#poster img {
    width:250px;
    height:250px;
    border:1px solid #ddd; /* cor da borda em volta da foto do personagem */
    padding:6px;
}


#about {
    text-align:center;
    padding:10px;
    padding-top:3px;
    margin-bottom:20px;
    position:absolute;
    width:240px;
    height:240px;
    border:2px solid #f0f0f0; /* cor da borda em volta da descrição do personagem */
    font-family: times;
    opacity:0;
    font-size:12px;
    background:white;
    color:#000; /* cor do texto da descrição do personagem */

}

#pannel:hover #about {
    opacity:.98;
    margin-top:0px;
    height:250px;
    -webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;
}

#name {
     font-family: times new roman;
     font-size:12px;
     text-align:center;

}


#top {
    width:550px;
    height:auto;
    font-family: times new roman;
    font-size:11px;
    margin-left: 30.5%;
    line-height:18px;
    padding:2px;
    margin-top: 20px;
    text-align:center;
    text-transform:lowercase;
    background-color:#fff; /* se você mudar a cor do fundo, coloque a mesma cor aqui */
}

#admin {
    font-size:20px;
    font-family: 'Poiret One', cursive;
    letter-spacing: 1px;
    text-align: center;
    padding: 2 3 2 3;
    width: 250px;
    margin-top:30px;
}

#admin a {
    font-size:20px;
    color:#222222; /* cor do nome do personagem */
    font-family: 'Poiret One', cursive;
    letter-spacing: 1px;
    text-align: center;
    padding: 2 3 2 3;
    width: 250px;
    margin-top:30px;
}

#admin a:hover {
    letter-spacing: 4px;
}

.header {
    height:20px;
    color:#000; /*cor do título da página */
    font-family: 'Poiret One', cursive;
    font-size:24px;
    text-align:center;
    letter-spacing:6px;
    text-transform:uppercase;
    font-style:italic;
    padding:5px 10px;
    margin:0px;
}


.links {
    height:20px;
    color:#000; /* coloque aqui a mesma cor que colocar nos links do header */
    font-size:12px;
    text-align:center;
    letter-spacing:0px;
    font-family: times new roman;
    margin:0px;
}


.links a {
    height:20px;
    color:#000; /* cor dos links do header */
    font-size:12px;
    text-align:center;
    letter-spacing:0px;
    font-family: times new roman;
    margin:0px;
}

.links a:hover {
    text-decoration: underline;

}


.desc {
    height:20px;
    color:#000; /* cor do texto que aparece em baixo do texto */
    font-size:12px;
    text-align:center;
    letter-spacing:0px;
    font-family: times new roman;
    margin:0px;
}


#sidebarbig {
        position:fixed;
        top:0px;
        left:0px;
        width:145px;
        background-repeat:repeat;
        border-right:5px solid #464646; /* cor da borda da imagem na sidebar */
        }

    #sidebarbig img {
        width:145px;
}

</style>


<div id="border-top"></div>


</div>
<div id="top">
<div class="header">Nome da página</div>

<div class="desc">Aqui vai uma descrição, você pode falar sobre a história ou qualquer outra coisa.</div>

<br>

<div class="links">
<a href="/">Voltar</a>  /
<a href="/ask">Ask</a>  /
<a href="">link 1</a>  /
<a href="">link 2</a>  /
<a href="">link 3</a>  /
<a href="">link 4</a>
</div>
</div>


<table id="all" border="0" cellpadding="0" cellspacing="20">


<div id="sidebarbig"><img src="https://41.media.tumblr.com/40a6731ae99c80d650d46af82ef2e04d/tumblr_nmsy2mYhKS1u9xs2ko1_500.png"></div>


<!--  Começo da primeira linha -->
<!-- Começa personagem -->
<td><div id="pannel">
<div id="poster">
<div id="admin"><a href="coloque um link aqui">Nome</a></div>
<p>
<div id="about">
<div id="name"><p>
Aqui vai a descrição, pode colocar o tanto de coisa que você quiser, só tente fazer com que ela não fique maior do que o espaço disponível.

</div>
</div>
<img width="120px" src="https://41.media.tumblr.com/319611e424943be21e102686fc88366c/tumblr_nmsy2mYhKS1u9xs2ko2_r1_250.png"/><!-- Coloque a URL da imagem que for usar aqui-->
</div>

</div></td>
<!-- Termina personagem -->


<!-- Começa personagem -->
<td><div id="pannel">
<div id="poster">
<div id="admin"><a href="coloque um link aqui"> Nome </a></div>
<p>
<div id="about">
<div id="name"> Aqui vai a descrição, pode colocar o tanto de coisa que você quiser, só tente fazer com que ela não fique maior do que o espaço disponível.

</div>
</div>
<img src="https://36.media.tumblr.com/81da872448495057e6020e39ea830c04/tumblr_nmsy2mYhKS1u9xs2ko3_r1_250.png"/><!-- Coloque a URL da imagem que for usar aqui-->
</div>

</div></td>
<!-- Termina personagem -->


<!-- Começa personagem-->
<td><div id="pannel">
<div id="poster">
<div id="admin"><a href="coloque um link aqui"> Nome </a></div>
<p>
<div id="about">
<div id="name">Aqui vai a descrição, pode colocar o tanto de coisa que você quiser, só tente fazer com que ela não fique maior do que o espaço disponível.

</div>
</div>
<img src="https://41.media.tumblr.com/a3d3f62b81b79bd7ff42a208bbd49d35/tumblr_nmsy2mYhKS1u9xs2ko4_r1_250.png"/><!-- Coloque a URL da imagem que for usar aqui-->
</div>

</div></td>
<!-- Termina personagem-->
<!-- Termina primeira linha-->

<tr> <!-- Coloque isso a cada três personagens -->


<!--  Começo da primeira linha -->
<!-- Começa personagem -->
<td><div id="pannel">
<div id="poster">
<div id="admin"><a href="coloque um link aqui">Nome</a></div>
<p>
<div id="about">
<div id="name"><p>
Aqui vai a descrição, pode colocar o tanto de coisa que você quiser, só tente fazer com que ela não fique maior do que o espaço disponível.

</div>
</div>
<img width="120px" src="https://41.media.tumblr.com/319611e424943be21e102686fc88366c/tumblr_nmsy2mYhKS1u9xs2ko2_r1_250.png"/><!-- Coloque a URL da imagem que for usar aqui-->
</div>

</div></td>
<!-- Termina personagem -->


<!-- Começa personagem -->
<td><div id="pannel">
<div id="poster">
<div id="admin"><a href="coloque um link aqui"> Nome </a></div>
<p>
<div id="about">
<div id="name"> Aqui vai a descrição, pode colocar o tanto de coisa que você quiser, só tente fazer com que ela não fique maior do que o espaço disponível.

</div>
</div>
<img src="https://36.media.tumblr.com/81da872448495057e6020e39ea830c04/tumblr_nmsy2mYhKS1u9xs2ko3_r1_250.png"/><!-- Coloque a URL da imagem que for usar aqui-->
</div>

</div></td>
<!-- Termina personagem -->


<!-- Começa personagem-->
<td><div id="pannel">
<div id="poster">
<div id="admin"><a href="coloque um link aqui"> Nome </a></div>
<p>
<div id="about">
<div id="name">Aqui vai a descrição, pode colocar o tanto de coisa que você quiser, só tente fazer com que ela não fique maior do que o espaço disponível.

</div>
</div>
<img src="https://41.media.tumblr.com/a3d3f62b81b79bd7ff42a208bbd49d35/tumblr_nmsy2mYhKS1u9xs2ko4_r1_250.png"/><!-- Coloque a URL da imagem que for usar aqui-->
</div>

</div></td>
<!-- Termina personagem-->
<!-- Termina primeira linha-->


<!-- Para adicionar mais, é só copiar o código de um personagem e colar. Não esqueça de colocar o <tr> a cada três personagens, senão a página fica meio errada. -->

</table>


<!-- NÃO remova o crédito pela página -->

<div style="font-size: 8px; font-family: times new roman;  font-style:italic;letter-spacing: 1px; float: left; position: fixed; padding: 2 4 2 4; bottom: 13px; right: 14px; background: #f0f0f0; border-top:1px solid #DADADA; border-right:1px solid #DADADA; border-left:1px solid #DADADA; border-bottom:1px solid #DADADA;text-transform:lowercase;"><a href="http://themesparawebs.tumblr.com/">crédito  </a></div>

</body>
</html>