♫ Blue & Black ♫

<style type="text/css">div::-webkit-scrollbar { height: 13px; width: 5px; background: #000000; } div::-webkit-scrollbar-thumb { background: #5783a1!important; } div::-webkit-scrollbar-corner { background:#000000; }</style>
<link href='http://fonts.googleapis.com/css?family=Patrick+Hand+SC' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Amatic+SC' rel='stylesheet' type='text/css'>

<div style="width: 500px; background-color: #000000 ; border-radius: 0px 50px 0px 50px; border-left: solid 10px #5783a1; border-right: solid 10px #5783a1; opacity: 0.5px; margin: 0 auto; padding: 7px; ">

<div style="text-align: center; font-size: 50px; font-family: 'Amatic SC'; color: #9B9B9B; letter-spacing: 3px; padding-bottom: 2px; margin-bottom: -10px; text-shadow: 1px 1px 1px #000000;">♪NOMBRE DEL PERSONAJE♫
<div style="width: 480px; height: 210px; background-image: url('http://animephproject.files.wordpress.com/2013/02/02282013_tokyomagnitude8-0.jpg?w=480&h=210'); ; border-radius: 50px 0px 50px 0px; border-top: solid 10px #5783a1; border-bottom: solid 10px #5783a1; opacity: 0.5px; margin: 0 auto; padding: 7px;"></div>
<div style="text-align: center; font-size: 25px; font-family: 'Amatic SC'; color: #ffffff; letter-spacing: 3px; padding-bottom: 2px; margin-top: -30px; text-shadow: 1px 1px 1px #000000;">
NACIONALIDAD | EDAD | SEXO | AÑO | COLOR </div>

<div style="float: right; margin-right: 25px; margin-top: 5px; font-size: 35px; font-family: 'Amatic SC'; text-align: center; text-transform: uppercase; color: #ffffff; letter-spacing: -1px; background-color: #5783a1; width: 200px; height: 30px; ">Descripción Física</div>
<div style=" background: #242424; border-right: solid 10px #5783a1; border-top: solid 10px #5783a1; border-left: solid 5px #5783a1; line-height: 100%; overflow: auto;width: 400px; height: 200px; font-size: 12px; color: #ffffff; font-family: Patrick Hand SC; text-align: center; margin-left: 60px;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam ut risus ipsum, at mattis lorem. Suspendisse auctor gravida cursus. Nam ultrices auctor purus a eleifend. Donec placerat, neque id blandit ullamcorper, ipsum elit ultricies eros, sed vulputate urna odio ac massa. Sed volutpat sem eget magna posuere nec posuere erat tincidunt. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam condimentum suscipit leo, vitae ullamcorper orci auctor quis. Sed id nunc in risus sagittis malesuada ut malesuada eros. Vivamus ut scelerisque orci. Sed sit amet nisi elementum libero fringilla ultricies eu nec erat. Cras molestie eros ut lectus varius ornare. Nullam et turpis urna. Nam quis libero non mauris cursus scelerisque. Nam quis elit et risus vulputate sodales. Aliquam auctor sodales est, a condimentum dui tincidunt in. In vulputate volutpat purus nec ornare. Ut mauris lorem, auctor sed ullamcorper at, molestie in ante. Nam justo tortor, fermentum at ullamcorper at, auctor auctor libero. Ut velit ipsum, laoreet non rhoncus at, vehicula nec mauris. Sed eget libero lectus. Maecenas feugiat magna massa. Nam sed purus suscipit nisi imperdiet consequat ac sagittis magna. Aliquam est augue, posuere nec placerat in, laoreet ut ante. Nullam venenatis diam id enim varius laoreet. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed at felis lacus. Quisque dapibus commodo lectus, id tristique massa mollis non. Nulla condimentum libero erat. Sed ultrices, nulla at viverra molestie, tortor est varius nibh, a mollis erat nisi sed velit. Duis vehicula lectus vel purus ornare lacinia.
</div>

<div style="float: left; margin-left: 15px; margin-top: 5px; font-size: 35px; font-family: 'Amatic SC'; text-align: center; text-transform: uppercase; color: #ffffff; letter-spacing: -1px; opacity: 0%; background-color: #5783a1; width: 200px; height: 30px; ">Personalidad</div>
<div style=" background: #242424; border-right: solid 10px #5783a1; border-top: solid 10px #5783a1; border-left: solid 5px #5783a1; overflow: auto;width: 400px; height: 200px; font-size: 12px; color: #ffffff; font-family: Patrick Hand SC; text-align: center; margin-left: 15px; line-height: 100%;">
Curabitur ut odio erat. Suspendisse venenatis sagittis ligula, eget molestie nisl tempor non. Donec eros magna, tempus non egestas at, condimentum vitae tortor. Mauris eu nisl risus. Curabitur faucibus tempor purus nec commodo. Quisque eu urna felis. Etiam elementum, tellus a sodales cursus, purus nulla aliquet quam, eu commodo lacus nunc ac erat. Suspendisse et dolor magna, ac tempor dui. Cras sed massa justo, ut ullamcorper mi. Quisque nisi est, adipiscing luctus ornare eget, luctus vitae augue. In justo eros, sollicitudin id cursus vel, dignissim eu nunc. Pellentesque auctor placerat tincidunt. Curabitur at mauris eu quam vulputate condimentum a non odio. In tincidunt mi quis purus congue venenatis. Sed quis sapien vitae justo dictum suscipit. Fusce tincidunt, leo vel consequat elementum, magna metus fermentum turpis, et viverra metus lorem ac lorem. Aenean pulvinar, justo dictum porttitor varius, erat elit congue risus, sed auctor libero enim ut leo. Fusce eleifend, quam id dignissim gravida, ipsum mauris porttitor dui, eu convallis purus ipsum in mi. Pellentesque pulvinar quam eget neque eleifend tristique. Maecenas dapibus elementum velit, sit amet malesuada sem fermentum a. Fusce suscipit quam in velit adipiscing lacinia. Vivamus vel metus quis nibh viverra facilisis. Curabitur enim urna, gravida eget mattis quis, pretium ut nulla. Duis facilisis enim rutrum ligula sagittis id sodales diam porttitor. Nam commodo laoreet rhoncus.
</div>

<div style="float: left; margin-left: 5px; margin-top: 1px; font-size: 35px; font-family: 'Amatic SC'; text-align: center; text-transform: uppercase; color: #ffffff; letter-spacing: -1px; background-color: #5783a1; width: 200px; height: 30px; ">Gustos</div>
<div style=" background: #242424; border-right: solid 5px #5783a1; border-top: solid 15px #5783a1;  border-left: solid 5px #5783a1;  overflow: auto;width: 200px; height: 250px; font-size: 12px; color: #ffffff; font-family: Patrick Hand SC; text-align: center; margin-left: -200px; line-height: 100%;">
Ut mauris lorem, auctor sed ullamcorper at, molestie in ante. Nam justo tortor, fermentum at ullamcorper at, auctor auctor libero. Ut velit ipsum, laoreet non rhoncus at, vehicula nec mauris. Sed eget libero lectus. Maecenas feugiat magna massa. Nam sed purus suscipit nisi imperdiet consequat ac sagittis magna. Aliquam est augue, posuere nec placerat in, laoreet ut ante. Nullam venenatis diam id enim varius laoreet. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed at felis lacus. Quisque dapibus commodo lectus, id tristique massa mollis non. Nulla condimentum libero erat. Sed ultrices, nulla at viverra molestie, tortor est varius nibh, a mollis erat nisi sed velit. Duis vehicula lectus vel purus ornare lacinia.
</div>

<div style="float: right; margin-right: 25px; margin-top: -310px; font-size: 35px; font-family: 'Amatic SC'; text-align: center; text-transform: uppercase; color: #ffffff; letter-spacing: -1px; background-color: #5783a1; width: 200px; height: 30px; ">Disgustos</div>
<div style=" background: #242424; border-right: solid 5px #5783a1; border-top: solid 15px #5783a1;  border-left: solid 5px #5783a1;  overflow: auto;width: 200px; height: 250px; font-size: 12px; color: #ffffff; font-family: Patrick Hand SC; text-align: center; margin-left: 265px; margin-top: -310px; line-height: 100%;">
Aliquam auctor sodales est, a condimentum dui tincidunt in. In vulputate volutpat purus nec ornare. Ut mauris lorem, auctor sed ullamcorper at, molestie in ante. Nam justo tortor, fermentum at ullamcorper at, auctor auctor libero. Ut velit ipsum, laoreet non rhoncus at, vehicula nec mauris. Sed eget libero lectus. Maecenas feugiat magna massa. Nam sed purus suscipit nisi imperdiet consequat ac sagittis magna. Aliquam est augue, posuere nec placerat in, laoreet ut ante. Nullam venenatis diam id enim varius laoreet. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed at felis lacus. Quisque dapibus commodo lectus, id tristique massa mollis non. Nulla condimentum libero erat. Sed ultrices, nulla at viverra molestie, tortor est varius nibh, a mollis erat nisi sed velit. Duis vehicula lectus vel purus ornare lacinia.
</div>

<div style="font-size: 45px; font-family: 'Amatic SC''; text-align: center; text-transform: uppercase; color: #ffffff; letter-spacing: -1px; background-color: #5783a1; line-height: 100%;"> Historia</div>
<div style="padding: 10px; background: #242424; border-right: solid 5px #5783a1; border-top: solid 15px #5783a1;  border-left: solid 5px #5783a1; line-height: 100%;height: 280px; overflow: auto; font-size: 12px; font-family: Patrick Hand SC; color: #ffffff; text-align: justify;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam ut risus ipsum, at mattis lorem. Suspendisse auctor gravida cursus. Nam ultrices auctor purus a eleifend. Donec placerat, neque id blandit ullamcorper, ipsum elit ultricies eros, sed vulputate urna odio ac massa. Sed volutpat sem eget magna posuere nec posuere erat tincidunt. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam condimentum suscipit leo, vitae ullamcorper orci auctor quis. Sed id nunc in risus sagittis malesuada ut malesuada eros. Vivamus ut scelerisque orci. Sed sit amet nisi elementum libero fringilla ultricies eu nec erat. Cras molestie eros ut lectus varius ornare. Nullam et turpis urna. Nam quis libero non mauris cursus scelerisque. Nam quis elit et risus vulputate sodales. Aliquam auctor sodales est, a condimentum dui tincidunt in. In vulputate volutpat purus nec ornare. Ut mauris lorem, auctor sed ullamcorper at, molestie in ante. Nam justo tortor, fermentum at ullamcorper at, auctor auctor libero. Ut velit ipsum, laoreet non rhoncus at, vehicula nec mauris. Sed eget libero lectus. Maecenas feugiat magna massa. Nam sed purus suscipit nisi imperdiet consequat ac sagittis magna. Aliquam est augue, posuere nec placerat in, laoreet ut ante. Nullam venenatis diam id enim varius laoreet. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Sed at felis lacus. Quisque dapibus commodo lectus, id tristique massa mollis non. Nulla condimentum libero erat. Sed ultrices, nulla at viverra molestie, tortor est varius nibh, a mollis erat nisi sed velit. Duis vehicula lectus vel purus ornare lacinia.

       Curabitur ut odio erat. Suspendisse venenatis sagittis ligula, eget molestie nisl tempor non. Donec eros magna, tempus non egestas at, condimentum vitae tortor. Mauris eu nisl risus. Curabitur faucibus tempor purus nec commodo. Quisque eu urna felis. Etiam elementum, tellus a sodales cursus, purus nulla aliquet quam, eu commodo lacus nunc ac erat. Suspendisse et dolor magna, ac tempor dui. Cras sed massa justo, ut ullamcorper mi. Quisque nisi est, adipiscing luctus ornare eget, luctus vitae augue. In justo eros, sollicitudin id cursus vel, dignissim eu nunc. Pellentesque auctor placerat tincidunt. Curabitur at mauris eu quam vulputate condimentum a non odio. In tincidunt mi quis purus congue venenatis. Sed quis sapien vitae justo dictum suscipit. Fusce tincidunt, leo vel consequat elementum, magna metus fermentum turpis, et viverra metus lorem ac lorem. Aenean pulvinar, justo dictum porttitor varius, erat elit congue risus, sed auctor libero enim ut leo. Fusce eleifend, quam id dignissim gravida, ipsum mauris porttitor dui, eu convallis purus ipsum in mi. Pellentesque pulvinar quam eget neque eleifend tristique. Maecenas dapibus elementum velit, sit amet malesuada sem fermentum a. Fusce suscipit quam in velit adipiscing lacinia. Vivamus vel metus quis nibh viverra facilisis. Curabitur enim urna, gravida eget mattis quis, pretium ut nulla. Duis facilisis enim rutrum ligula sagittis id sodales diam porttitor. Nam commodo laoreet rhoncus.
</div>

<div style="font-size: 45px; font-family: 'Amatic SC''; text-align: center; text-transform: uppercase; color: #ffffff; letter-spacing: -1px; background-color: #5783a1; line-height: 100%;"> Otros Datos</div>
<div style="padding: 10px; background: #242424; border-right: solid 5px #5783a1;  border-left: solid 5px #5783a1; line-height: 100%;height: 150px; overflow: auto; font-size: 12px; font-family: Patrick Hand SC; color: #ffffff; text-align: justify;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam ut risus ipsum, at mattis lorem. Suspendisse auctor gravida cursus. Nam ultrices auctor purus a eleifend. Donec placerat, neque id blandit ullamcorper, ipsum elit ultricies eros, sed vulputate urna odio ac massa. Sed volutpat sem eget magna posuere nec posuere erat tincidunt. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam condimentum suscipit leo, vitae ullamcorper orci auctor quis. Sed id nunc in risus sagittis malesuada ut malesuada eros. Vivamus ut scelerisque orci. Sed sit amet nisi elementum libero fringilla ultricies eu nec erat. Cras molestie eros ut lectus varius ornare. Nullam et turpis urna.
</div>
</div>

<div style=" margin: auto;  line-height: 100%; color: #ffffff; font-size: 14px; text-align: center; font-family: Amatic SC; width: 350px;  letter-spacing: 2px; border-width: 0 3px;">•♫ CRÉDITOS A Akira. para Source Code ♫•</div>
</div>