Cinnabon

Sinful Misfortune Resources - Layouts - Poisoned Tree.

- Do not remove credits from the code.
- Do not redistribute the codes.
- Do not share the codes with friends, just have them add me.

If you're going to alter the stylesheet, please have a basic understanding of HTML/CSS. I will not walk you through it step by step, simply because I don't have enough time to do so for everyone and keep up with updates. You do need a basic understanding of how stylesheets work in order to use these codes. Please do not ask me for help unless you are extremely confused. It's all pretty easy to figure out if you look at the page while you go through and edit it. Remember to put each code in the designated area.

Thank you for choosing Sinful Misfortune.
Sincerely, Cryptic.


------------------------------------------ABOUT ME------------------------------------------

</td></tr></table></td></tr></table></td></tr></table>
<style>

{ S P E C I A L  F O N T S - - C R Y P T I C }

@import url(https://fonts.googleapis.com/css?family=);
@font-face {font-family:litf;src: url('http://static.tumblr.com/jtvmcoc/baIn9f1ea/slkscr.ttf');}
@import url(https://fonts.googleapis.com/css?family=);
@font-face {font-family:litf;src: url('https://static.tumblr.com/blzkhux/1n5purbos/thelightfont.ttf');}
@import url(https://fonts.googleapis.com/css?family=);
@font-face {font-family:lovbas;src: url('https://static.tumblr.com/blzkhux/B0Mpurc6v/lonely_basket.ttf');}

{ B A S I C  C O D I N G -- C R Y P T I C }

body {
background-color:#0d1114;
background-image:url("https://i.imgur.com/YY57efW.png");
background-attachment:fixed;
background-repeat:no-repeat;
background-position:bottom left;
margin-top: 0px;
overflow:auto;
}

.navr{
left: 0%;
top: 0%;
Z-index:2!important;
background-color:transparent;
position: absolute;
Width:120px;
height:200px;
top:300px;
Margin-left:50px;
text-align: center;
Opacity:1;
Overflow:hidden;
}

.connt{
Top:0;
Left:0;
Z-index:1!important;
Position:absolute;
width:120px;
height:0px;
Padding:0px;
background-color:#030605;
Text-align:none;
Margin-left:50px!important;
Margin-top:300px;
-webkit-transition: all 0.8s ease-in-out;
-moz-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
filter:alpha(opacity=0);
opacity:0;
Overflow:hidden;}


.connt:target {
Z-index:2!important;
filter:alpha(opacity=1);
Opacity:1;
Overflow:none;
Margin-top:510px;
Height:80px;
-webkit-transition: all 0.8s ease-in-out;
-moz-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}

.sls{
Top:0;
Left:0;
Z-index:1!important;
Position:absolute;
width:120px;
height:0px;
Padding:0px;
background-color:#030605;
Text-align:none;
Margin-left:50px!important;
Margin-top:300px;
-webkit-transition: all 0.8s ease-in-out;
-moz-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
filter:alpha(opacity=0);
opacity:0;
Overflow:hidden;}


.sls:target {
Z-index:2!important;
filter:alpha(opacity=1);
Opacity:1;
Overflow:none;
Margin-top:510px;
Height:250px;
-webkit-transition: all 0.8s ease-in-out;
-moz-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}

.contain{
left: 0%;
top: 0%;
Z-index:2!important;
background-color:#000;
position: absolute;
Width:750px;
height:600px;
top:90px;
Margin-left:340px;
text-align: center;
Opacity:1;
}

.toptop{
left: 0%;
top: 0%;
Z-index:2!important;
background-color:#030605;
position: absolute;
Width:170px;
height:200px;
top:100px;
Margin-left:350px;
text-align: left;
Opacity:1;
}

.topimg{
left: 0%;
top: 0%;
Z-index:2!important;
background-color:#030605;
position: absolute;
Width:550px;
height:200px;
top:100px;
Margin-left:530px;
text-align: right;
Opacity:1;
}

.quote2{
left: 0%;
top: 0%;
Z-index:2!important;
background-color:#030605;
position: absolute;
Width:200px;
height:30px;
Padding:5px;
top:250px;
Margin-left:545px;
text-align: right;
Opacity:1;
}

.bioone{
left: 0%;
top: 0%;
Z-index:2!important;
background-color:#030605;
position: absolute;
Width:245px;
height:125px;
top:310px;
Margin-left:350px;
text-align: right;
Opacity:1;
}

.quote1{
left: 0%;
top: 0%;
Z-index:2!important;
background-color:#030605;
position: absolute;
Width:105px;
height:30px;
top:375px;
Padding:5px;
Margin-left:470px;
text-align: right;
Opacity:1;
}

.biotwo{
left: 0%;
top: 0%;
Z-index:2!important;
background-color:#030605;
position: absolute;
Width:475px;
height:155px;
top:310px;
Margin-left:605px;
text-align: right;
Opacity:1;
}

.love{
left: 0%;
top: 0%;
Z-index:2!important;
background-color:#030605;
position: absolute;
Width:245px;
height:235px;
top:445px;
Margin-left:350px;
text-align: right;
Opacity:1;
}

.img2{
left: 0%;
top: 0%;
Z-index:2!important;
background-color:#030605;
position: absolute;
Width:100px;
height:205px;
top:475px;
Margin-left:605px;
text-align: right;
Opacity:1;
}

.connect{
left: 0%;
top: 0%;
Z-index:2!important;
background-color:#030605;
position: absolute;
Width:365px;
height:205px;
top:475px;
Margin-left:715px;
text-align: right;
Opacity:1;
}

{ TEXT EFFECTS // CRYPTIC}

p, div, table, tr, td, font, br {
Font:8px consolas;
line-height:10px;
letter-spacing:1px;
Text-transform:none;
color:#494242;
Font-weight:normal; }

b {
    font-family:litf;
    font-size: 10px;
    color:#435045;
    letter-spacing: 0px;
    text-transform:lowercase;
    font-weight:normal;
    letter-spacing: 0px;
    line-height:10px;}

I {
    font: 10px litf;
    text-transform:lowercase;
    font-weight:normal;
    color:#514444;
    line-height:10px;
    letter-spacing: 0px;
    Font-style:italic;
    }

u {
    font: 10px litf;
    text-transform:lowercase;
    font-style:none;
    font-weight:normal;
    color:#5b4b4e;
    line-height:10px;
    letter-spacing: 1px;
    Text-decoration:none;
    }


a:link, a:active, a:visited, a:link b, a:active b, a:visited b {
font-family:litf;
font-size:11px;
line-height:9px;
letter-spacing:0px;
font-weight:normal;
text-transform:lowercase;
text-decoration:none;
color:#435045;
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;
text-shadow:10px 0px transparent, -10px 0px transparent;}

a:hover, a:hover b {
text-decoration:none;
Letter-spacing:0px;
color:#514444;
}

a.nav:link, a.nav:active, a.nav:visited, a.nav:link b, a.nav:active b, a.nav:visited b {
Font-family:litf;
font-size:14px;
line-height:25px;
letter-spacing:2px;
font-weight:normal;
Display:block;
Text-transform:uppercase;
Margin:1px;
text-decoration:none;
color:#3a473d;
Text-align:right;
Padding-right:5px;
Background-color:#161c19;
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;
}

a.nav:hover, a.nav:hover b, a.nav:focus, a.nav:active {
text-decoration:none;
color:#514444;
Letter-spacing:0px;
Font-style:italic;
}

a.first, a.first:link, a.first:active, a.first:visited {
font-family:'litf';
font-size:10px;
line-height:15px;
font-weight: normal;
color:#343a33;
Background-color:#101710;
text-decoration:none;
text-transform:uppercase;
letter-spacing:0px;
Text-align:center;
display:block;
border-bottom-style:none;
margin-bottom:1px;
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;
}

a.first:hover {
color:#525a51;
background-color:#2e2828;
Letter-spacing:0px;
}

a.nam:link, a.nam:active, a.nam:visited, a.nam:link b, a.nam:active b, a.nam:visited b {
Font-family:litf;
font-size:12px;
line-height:20px;
letter-spacing:2px;
font-weight:normal;
Text-transform:uppercase;
text-decoration:none;
color:#4f5b4f;
Margin-bottom:2px;
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
transition: all 0.8s ease-out;
}

a.nam:hover, a.nam:hover b {
text-decoration:none;
color:#514444;
Font-style:italic;
}

h1 {
Font-family:litf;
font-size:15px;
line-height:14px;
Margin:0px;
letter-spacing:2px;
font-weight:normal;
Font-style:italic;
Margin-bottom:5px;
Text-align:left;
text-decoration:none;
Text-transform:uppercase;
color:#475148;
Margin-top:5px;
Padding-left:5px;
Border-bottom: 3px solid #41373a;
}


h2 {
Font-family:litf;
font-size:15px;
line-height:15px;
Margin:0px;
letter-spacing:4px;
font-weight:normal;
Font-style:italic;
Margin-bottom:5px;
Text-align:left;
text-decoration:none;
Text-transform:uppercase;
color:#293429;
Margin-top:5px;
padding-left:10px;
Border-bottom: 3px solid #41373a;
}

h3 {
Font-family:litf;
font-size:10px;
line-height:10px;
Margin:0px;
letter-spacing:0px;
font-weight:normal;
Font-style:italic;
Margin-bottom:5px;
Text-align:left;
text-decoration:none;
Text-transform:uppercase;
color:#293429;
Margin-top:5px;
padding-left:5px;
Border-bottom: 3px solid #41373a;
}


{ M I S C  C O D I N G -- C R Y P T I C }

::-webkit-scrollbar-thumb {
height:auto;
background-color: #111a12;
border:3px solid #030605;
}

::-webkit-scrollbar {
height:9px;
width:7px;
background-color: #41373a;
border:3px solid #030605;
}

a span.av, a:hover span.sm{display: inline;}
a:hover span.av, a span.sm{display: none;}
a:hover {visibility:visible;}


{ H I D E  C O D E S -- C R Y P T I C }

table table div form {display:inline !important;}
.contacttable,.whitetext12,.nametext,.lightbluetext8,.orangetext15,.blacktext12,.btext,.redtext,.redbtext{display:none;height:0px;!important;visibility:hidden}
td td td td{border:0px;width:0px;text-align:left;}
table,td,tr{padding:0px;width:;background-color:transparent}
table table table{padding:1px;height:.01%;width:100%;}
table table,table table table table,table,tr,td{height:0px;!important;border:0px;!important}
a.text,table div font a,table div div,.navbar font,tr td font{visibility:hidden;display:none;height:0px;!important;}
td.text table table{display:inline;visibility:visible;}
table td table tr td.text table{visibility:hidden;}
table td table tr td.text table table,table td table tr td.text table table td.text{visibility:visible;}
table div div{visibility:hidden;!important;}
table table table table,table table table table td.text, td.text td.text table{display:none;}
body div div form {display:none !important;}div div div select {position:absolute !important;  margin-left:-1800px !important; left:0px !important; display:none !important; }div div table div {display:none;} div div table div {display:none;} div form,
.mslogo, div ul {display:none!important;}
div div, div td {background-color:transparent; background-image:none!important;}
div.profileWidth {margin-top: -30px !important;}div.profileWidth div {filter:alpha(opacity=0); opacity:0.2e2e2e1}div.profileWidth div.clearfix, i i i,
div.profileWidth div div {filter:none; opacity:0.9999}div.profileWidth div.clearfix {position:absolute; top:30px}
div div select, div div form {display:none !important;}div div table div {display:none;} .clearfix table div div {display:block;}
.profile, div ul {display:none !important;}
.friendSpace { display:none; }
.profileInfo { display:none; }
.clearfix { display: none; }

</style>

------------------------------------------LIKE TO MEET------------------------------------------

</td></tr></table></td></tr></table></td></tr></table>

<div class="contain"></div>

<div class="navr">
<a href="/home.php" class="nav">go away</a>
<a href="" class="nav">message</a>
<a href="" class="nav">comment</a>
<a href="" class="nav">gallery</a>
<a href="#contact" class="nav">contact</a>
<a href="#storylines" class="nav">storylines</a>
<a href="/sinfulmisfortune" class="nav">credit</a>

</div>

<div class="connt" id="contact">
<h1>contact info:</h1>
<div style="overflow:auto; padding:5px; width:110px; height:30px; padding-top:0px; margin-bottom:7px;">
<b>discord: xxxxx</b><br>
<i>line: xxxx</i><br>
<b>you can put in a little message here if you so choose. this will be about contacting you.</b>
</div>
<center><a href="#">[close]</a></center>
</div>

<div class="sls" id="storylines">
<h1>iou</h1>
<div style="width:120px; height:50px; padding:0px; overflow:auto;">
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
</div>
<h1>uom</h1>
<div style="width:120px; height:50px; padding:0px; overflow:auto;">
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
</div>
<h1>discussions</h1>
<div style="width:120px; height:50px; padding:0px; overflow:auto; margin-bottom:7px;">
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
</div>
<center><a href="#">[close]</a></center>
</div>

<div class="toptop">
<h1>Basic Information</h1>
<div style="width: 160px; height:160px; padding:5px; overflow:auto;">
<b>full name:</b> Elijah Mikaelson.<br>
<i>age:</i> over 1000 years old.<br>
<b>biological age:</b> twenty three.<br>
<i>species:</i> original vampire, witch (previously).<br>
<b>sired by:</b> Esther Mikaelson<br>
<i>relatives:</i> Niklaus Mikaelson (brother), Rebekah Mikaelson (sister), Finn Mikaelson (brother), Freya Mikaelson (sister), Kol Mikaelson (brother), Henrik Mikaelson (brother), Dahlia (aunt), Mikael (father), Esther (mother), Hope Mikaelson (niece), Davina Claire (sister-in-law).<br>
<b>enemies:</b> varies by the day. stay tuned.<br>
<i>height:</i> 5'10<br>
<b>hair color:</b> brown<br>
<i>eye color:</i> brown<br>
<b>personality:</b> Nulla facilisi. Donec tempor lacus nec orci ornare convallis. Mauris dapibus hendrerit dolor, egestas ultricies felis posuere sit amet. Donec eu ligula in tellus finibus vestibulum. Mauris sed tortor sit amet justo posuere egestas. Sed eget tortor ac ante luctus commodo vitae ut justo. Sed lobortis bibendum fringilla. Morbi et ex neque. Fusce nunc sem, condimentum non risus sed, mattis convallis ante. Aenean et velit hendrerit, elementum nunc eleifend, venenatis leo. Vestibulum ac suscipit arcu. Nam tincidunt tortor dui, sit amet facilisis diam efficitur ut. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam at tincidunt ligula. Sed non porttitor tellus, sed laoreet urna. Pellentesque semper, elit a mattis mollis, metus lacus consectetur tellus, vel scelerisque neque urna at lacus.

</div></div>

<div class="topimg">
<img src="https://i.imgur.com/KBrIGYx.png">
</div>

<div class="bioone">
<img src="https://i.imgur.com/WM33PtV.gif">
</div>

<div class="biotwo">
<h2>biography</h2>
<div style="width:230px; height:115px; padding:5px; overflow:auto; float:left; display:inline-block;">
Nulla facilisi. Donec tempor lacus nec orci ornare convallis. Mauris dapibus hendrerit dolor, egestas ultricies felis posuere sit amet. Donec eu ligula in tellus finibus vestibulum. Mauris sed tortor sit amet justo posuere egestas. Sed eget tortor ac ante luctus commodo vitae ut justo. Sed lobortis bibendum fringilla. Morbi et ex neque. Fusce nunc sem, condimentum non risus sed, mattis convallis ante. Aenean et velit hendrerit, elementum nunc eleifend, venenatis leo. Vestibulum ac suscipit arcu. Nam tincidunt tortor dui, sit amet facilisis diam efficitur ut. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam at tincidunt ligula. Sed non porttitor tellus, sed laoreet urna. Pellentesque semper, elit a mattis mollis, metus lacus consectetur tellus, vel scelerisque neque urna at lacus.
<br><br>
Nulla facilisi. Donec tempor lacus nec orci ornare convallis. Mauris dapibus hendrerit dolor, egestas ultricies felis posuere sit amet. Donec eu ligula in tellus finibus vestibulum. Mauris sed tortor sit amet justo posuere egestas. Sed eget tortor ac ante luctus commodo vitae ut justo. Sed lobortis bibendum fringilla. Morbi et ex neque. Fusce nunc sem, condimentum non risus sed, mattis convallis ante. Aenean et velit hendrerit, elementum nunc eleifend, venenatis leo. Vestibulum ac suscipit arcu. Nam tincidunt tortor dui, sit amet facilisis diam efficitur ut. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam at tincidunt ligula. Sed non porttitor tellus, sed laoreet urna. Pellentesque semper, elit a mattis mollis, metus lacus consectetur tellus, vel scelerisque neque urna at lacus.
<br><br>
Throughout his long life, Elijah had several romantic relationships. In the early 11th century, Elijah and Klaus were both in love with a Petrova Doppelgänger named Tatia. Elijah accidentally killed Tatia after he became a vampire and was traumatized and horrified by the violence of his actions towards her. Elijah's mother, told him to seal the event behind a "red door" and to clean himself up. As long as he was clean, nothing of what happened behind the red door could hurt him. As such, this became Elijah's defense mechanism to cope with the horrors of his vampirism for the next thousand years.
<br><br>
</div>

<div style="width:225px; height:115px; padding:5px; overflow:auto; float:right; display:inline-block;">
Nulla facilisi. Donec tempor lacus nec orci ornare convallis. Mauris dapibus hendrerit dolor, egestas ultricies felis posuere sit amet. Donec eu ligula in tellus finibus vestibulum. Mauris sed tortor sit amet justo posuere egestas. Sed eget tortor ac ante luctus commodo vitae ut justo. Sed lobortis bibendum fringilla. Morbi et ex neque. Fusce nunc sem, condimentum non risus sed, mattis convallis ante. Aenean et velit hendrerit, elementum nunc eleifend, venenatis leo. Vestibulum ac suscipit arcu. Nam tincidunt tortor dui, sit amet facilisis diam efficitur ut. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam at tincidunt ligula. Sed non porttitor tellus, sed laoreet urna. Pellentesque semper, elit a mattis mollis, metus lacus consectetur tellus, vel scelerisque neque urna at lacus.
<br><br>
Nulla facilisi. Donec tempor lacus nec orci ornare convallis. Mauris dapibus hendrerit dolor, egestas ultricies felis posuere sit amet. Donec eu ligula in tellus finibus vestibulum. Mauris sed tortor sit amet justo posuere egestas. Sed eget tortor ac ante luctus commodo vitae ut justo. Sed lobortis bibendum fringilla. Morbi et ex neque. Fusce nunc sem, condimentum non risus sed, mattis convallis ante. Aenean et velit hendrerit, elementum nunc eleifend, venenatis leo. Vestibulum ac suscipit arcu. Nam tincidunt tortor dui, sit amet facilisis diam efficitur ut. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam at tincidunt ligula. Sed non porttitor tellus, sed laoreet urna. Pellentesque semper, elit a mattis mollis, metus lacus consectetur tellus, vel scelerisque neque urna at lacus.
<br><br>
Nulla facilisi. Donec tempor lacus nec orci ornare convallis. Mauris dapibus hendrerit dolor, egestas ultricies felis posuere sit amet. Donec eu ligula in tellus finibus vestibulum. Mauris sed tortor sit amet justo posuere egestas. Sed eget tortor ac ante luctus commodo vitae ut justo. Sed lobortis bibendum fringilla. Morbi et ex neque. Fusce nunc sem, condimentum non risus sed, mattis convallis ante. Aenean et velit hendrerit, elementum nunc eleifend, venenatis leo. Vestibulum ac suscipit arcu. Nam tincidunt tortor dui, sit amet facilisis diam efficitur ut. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam at tincidunt ligula. Sed non porttitor tellus, sed laoreet urna. Pellentesque semper, elit a mattis mollis, metus lacus consectetur tellus, vel scelerisque neque urna at lacus.
<br><br>
InNulla facilisi. Donec tempor lacus nec orci ornare convallis. Mauris dapibus hendrerit dolor, egestas ultricies felis posuere sit amet. Donec eu ligula in tellus finibus vestibulum. Mauris sed tortor sit amet justo posuere egestas. Sed eget tortor ac ante luctus commodo vitae ut justo. Sed lobortis bibendum fringilla. Morbi et ex neque. Fusce nunc sem, condimentum non risus sed, mattis convallis ante. Aenean et velit hendrerit, elementum nunc eleifend, venenatis leo. Vestibulum ac suscipit arcu. Nam tincidunt tortor dui, sit amet facilisis diam efficitur ut. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam at tincidunt ligula. Sed non porttitor tellus, sed laoreet urna. Pellentesque semper, elit a mattis mollis, metus lacus consectetur tellus, vel scelerisque neque urna at lacus.
</div>
</div>

<div class="love">
<h2>love life</h2>
<img src="https://i.imgur.com/rgbp3Ce.png">
<a href="" class="first" style="margin-top:5px;">hayley marshall</a>
<div style="width:45px; height:75px; padding:15px; overflow:hidden; display:inline-block; float:left; padding-right:5px;">
<b>since: 00/00/00</b><br>
<i>engaged: 00/00/00</i><br>
<b>married: 00/00/00</b><br>
</div>
<div style="width:155px; height:75px; padding:5px; overflow:auto;overflow:auto; display:inline-block; float:right;">
<u>love notes:</u>
Nulla facilisi. Donec tempor lacus nec orci ornare convallis. Mauris dapibus hendrerit dolor, egestas ultricies felis posuere sit amet. Donec eu ligula in tellus finibus vestibulum. Mauris sed tortor sit amet justo posuere egestas. Sed eget tortor ac ante luctus commodo vitae ut justo. Sed lobortis bibendum fringilla. Morbi et ex neque. Fusce nunc sem, condimentum non risus sed, mattis convallis ante. Aenean et velit hendrerit, elementum nunc eleifend, venenatis leo. Vestibulum ac suscipit arcu. Nam tincidunt tortor dui, sit amet facilisis diam efficitur ut. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam at tincidunt ligula. Sed non porttitor tellus, sed laoreet urna. Pellentesque semper, elit a mattis mollis, metus lacus consectetur tellus, vel scelerisque neque urna at lacus.

Vestibulum fringilla luctus tellus, nec vulputate leo rutrum a. Fusce quis turpis ipsum. In sapien ipsum, bibendum in molestie at, semper ac leo. Aenean et mauris pharetra, porttitor enim et, sollicitudin nulla. Nunc rutrum tortor et nulla euismod, ultricies consectetur lacus dictum. Praesent lacinia consequat tortor, at consequat sapien fringilla et. Pellentesque ex risus, facilisis vel justo nec, dapibus hendrerit nisi.
</div>
</div>

<div class="img2">
<img src="https://i.imgur.com/WV8CboY.png">
</div>

<div class="connect">
<h1>connections</h1>
<div style="width:220px; height:165px; overflow:auto; padding:5px; padding-top:0px; display:inline-block; float:left;">
<a href="" class="nam">name, character</a> Nulla facilisi. Donec tempor lacus nec orci ornare convallis. Mauris dapibus hendrerit dolor, egestas ultricies felis posuere sit amet. Donec eu ligula in tellus finibus vestibulum. Mauris sed tortor sit amet justo posuere egestas. Sed eget tortor ac ante luctus commodo vitae ut justo. Sed lobortis bibendum fringilla. Morbi et ex neque. Fusce nunc sem, condimentum non risus sed, mattis convallis ante. Aenean et velit hendrerit, elementum nunc eleifend, venenatis leo. Vestibulum ac suscipit arcu. Nam tincidunt tortor dui, sit amet facilisis diam efficitur ut. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam at tincidunt ligula. Sed non porttitor tellus, sed laoreet urna. Pellentesque semper, elit a mattis mollis, metus lacus consectetur tellus, vel scelerisque neque urna at lacus.<br><br>
<a href="" class="nam">name, character</a> Nulla facilisi. Donec tempor lacus nec orci ornare convallis. Mauris dapibus hendrerit dolor, egestas ultricies felis posuere sit amet. Donec eu ligula in tellus finibus vestibulum. Mauris sed tortor sit amet justo posuere egestas. Sed eget tortor ac ante luctus commodo vitae ut justo. Sed lobortis bibendum fringilla. Morbi et ex neque. Fusce nunc sem, condimentum non risus sed, mattis convallis ante. Aenean et velit hendrerit, elementum nunc eleifend, venenatis leo. Vestibulum ac suscipit arcu. Nam tincidunt tortor dui, sit amet facilisis diam efficitur ut. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam at tincidunt ligula. Sed non porttitor tellus, sed laoreet urna. Pellentesque semper, elit a mattis mollis, metus lacus consectetur tellus, vel scelerisque neque urna at lacus.<br><br>
<a href="" class="nam">name, character</a> Nulla facilisi. Donec tempor lacus nec orci ornare convallis. Mauris dapibus hendrerit dolor, egestas ultricies felis posuere sit amet. Donec eu ligula in tellus finibus vestibulum. Mauris sed tortor sit amet justo posuere egestas. Sed eget tortor ac ante luctus commodo vitae ut justo. Sed lobortis bibendum fringilla. Morbi et ex neque. Fusce nunc sem, condimentum non risus sed, mattis convallis ante. Aenean et velit hendrerit, elementum nunc eleifend, venenatis leo. Vestibulum ac suscipit arcu. Nam tincidunt tortor dui, sit amet facilisis diam efficitur ut. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Etiam at tincidunt ligula. Sed non porttitor tellus, sed laoreet urna. Pellentesque semper, elit a mattis mollis, metus lacus consectetur tellus, vel scelerisque neque urna at lacus.<br><br>
</div>


<div style="width:125px; height:165px; overflow:auto; padding:5px; padding-top:0px; display:inline-block; float:right;">
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
<a href="" class="first">name here</a>
</div>
</div>

<div class="quote1">
<b>the road to redemption is <i>long and winding</i>, but worthy.</b>
</div>

<div class="quote2">
<b>Over the course of my long life, I have come to believe that we are <i>bound forever</i> to those with whom we <i>share blood</i>. </b>
</div>