<style>
@import url('https://fonts.googleapis.com/css?family=Livvic&display=swap');

/* BACKGROUND, TEXT */
body
{
    background-image: url(https://i.imgur.com/RhdSjma.png), url(https://i.imgur.com/HK014yw.png);
    background-repeat:  no-repeat, repeat-x;
    background-position: top left, top left;
    background-size:  1000px 1000px, 1000px 1000px;
    background-color: #150708!important;
    font-family: helvetica;
    font-size: 10px!important;
    color: #85564e!important;
    line-height: 11px;
}

/* OWNER AND PETINFO */
.pet_color_info, .owner
{
    position: absolute;
    font-size: 10px;
    text-transform: lowercase;
    letter-spacing: 2px;
    color: #ae4e28;
}

.pet_color_info
{
    top: 645px;
    left: 470px;
}

.owner
{
    top: 658px;
    left: 465px;
}


/* STORYBOX */
#main
{
    position: absolute;
    top: 250px;
    left: 550px;
    height: 368px;
    width: 220px;
    padding-right: 0px;
    margin: 0px!important;
    overflow: auto;
    text-align: justify;
}

/* PET MINION AND SPOTLIGHT */
#pet_minion, .pet_spotlight
{
    position: absolute;
    top: 0px;
    left: 50px;
    width: 100px;
    text-transform: lowercase;
    background-color: #341b13;
    padding-top: 50px;
    border-radius: 0 0 10px 10px;
    height: 0px;
    overflow: hidden;
    padding-left: 10px;
    padding-right: 10px;
}

.pet_spotlight
{
    left: 200px;
    margin-top: 0px;
}

#pet_minion:hover
{
    height: 100px;
    padding-bottom: 20px;
}

.pet_spotlight:hover
{
    height: 100px;
    padding-bottom: 10px;
}

.pet_spotlight img, #pet_minion img
{
    opacity: 0.7;
    height:40px;
    width: 40px;
    border-radius: 10px;
    padding: 2px;
    border: 1px solid #aa7f77;
    margin: 5px;
}

#pet_minion img:hover, .treasure_item:hover, .pet_spotlight img:hover
{
    opacity: 1;
}

/* PET TREASURE  */
#pet_treasure
{
    position: absolute;
    top: 249px;
    left: 807px;
    height: 370px;
    width: 90px;
    padding: 0px;
    margin: 0px;
    overflow: auto;
}

.treasure_item
{
    height: 31x;
    width: 31px;
    margin: 2px 6px;
    opacity: 0.5;
}

#pet_treasure img
{
    border-radius: 5px;
    padding: 1px;
    border: 1px solid #aa7f77;
}

/* PET IMAGE */
#pet_image
{
    position: absolute;
    top: -215px;
    left: 940px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 180px 180px;
    padding-right: 20px;
    padding-bottom: 70px;
    background-color: #ae4e28;
    width: 180px;
    height: 180px;
    border-radius: 0 0 15px 15px;
}

#pet_image:hover
{
    top: 0px;
}

/* PET LIKE */
.pet_like
{
    position:absolute;
    top:200px;
    left:580px;
}

.pet_like i
{
    color: #795142;
}

/* TEXT STYLING */
b, i
{
    color: #c05f39;
}

a, a:link, a:visited, a:hover
{
    text-transform: lowercase;
    color: #db6a3e;
    font-style: oblique;
}

#h3
{
    font-family: 'Livvic', sans-serif;
    font-size:9px;
    text-transform: uppercase;
    color: #c05f39;
    letter-spacing: 2px;
    border-bottom: 1px double #ae4e28;
    text-align: center;
    margin-bottom: 12px;
    padding-bottom: 2px;
}

a:hover
{
    text-decoration: none;
    color: #f78c62;
}

/* SCROLLBAR */
::-webkit-scrollbar {width: 0px;height: 0px;} ::-webkit-scrollbar-button {width: 0px;height: 0px;} ::-webkit-scrollbar-thumb {background: #9dd8c3;border: 0px none #ffffff;border-radius: 50px;} ::-webkit-scrollbar-thumb:hover {background: #ffed33;} ::-webkit-scrollbar-thumb:active {background: #000000;} ::-webkit-scrollbar-track {background: #9dd8c3; border: 0px none #ffffff;border-radius: 50px;} ::-webkit-scrollbar-track:hover {background: #9dd8c3;} ::-webkit-scrollbar-track:active {background: #333333;} ::-webkit-scrollbar-corner {background: transparent;}

/* TRANSITIONS */
.treasure_item, .pet_spotlight img, #pet_friends img, a, #credit, #pet_minion, .pet_spotlight, #pet_minion img, #pet_image
{
    -webkit-transition: all 0.75s ease;
    -moz-transition: all 0.75s ease;
    -ms-transition: all 0.75s ease;
    -o-transition: all 0.75s ease;
    transition: all 0.75s ease;
}

/* RESET */
#bookmarks, #column_3 a, #footer, #header, h2, #menu, #postcards, #rightbg, #sidebar, #spacer, .pet_name, #pet_stats,  .pet_age_info_date, .pet_wco_info_date, .hustler, .owner img, #pet_friends, #column_3
{
    display: none;
}

body, #column_1, #content, #index, #page, #pet_info, #rightbg, #main-content
{
    height: auto!important;
    width: auto!important;
    margin: 0px;
    padding: 0px;
    background-color: transparent;
    position: static;
}
</style>

<!-- THIS IS A COMMENT. YOUR STORY GOES HERE  -->
<div id="main">
<div id="h3">this is a header</div>
<b>This is bold.</b> <i>This is italic.</i> <u>This is underline.</u> Your story goes here!

<BR><BR>
<!-- THIS IS A COMMENT. YOU CAN EDIT THIS, BUT PLEASE DON'T DELETE THE CREDITS! (: -->
<div id="h3">credits</div>
overlay by [user=frederick]<BR>
profile by [userid=636750]<BR>
background picture by sergei solo @ <a href="https://unsplash.com/photos/Zif9OPYfwdE">unsplash</a><BR>
header font: livvic @ <a href="https://fonts.google.com/specimen/Livvic">google fonts</a>
</div>