Grunny Style Sheet:
/* GENERAL */
*
{
margin: 0;
padding: 0;
}
ul li
{
list-style-type: none;
}
dl dt
{
font-weight: bold;
}
/* CONTENT */
#content
{
background: #000;
padding: 10px;
}
#content a
{
color: #096A04;
}
#content #sidebar
{
position: absolute;
width: 230px;
left: 15px;
}
#content #main
{
margin-left: 240px;
}
/* SECTION */
.section
{
margin-bottom: 10px;
padding: 0 10px 10px 10px;
font-size: 12px;
background: #333 url(images/grunny_header_endcap.gif) top right no-repeat;
color: #666;
}
.section:after
{
margin: 0 -10px -10px -10px;
content: url(images/grunny_footer.gif);
background: url(images/grunny_footer_endcap.gif) bottom right no-repeat;
display: block;
line-height: .1;
}
.section h2
{
color: #C41B27;
font-size: 15px;
margin: 0 -10px 0 -10px;
text-indent: 40px;
height: 40px;
line-height: 35px;
background: url(images/grunny_header.gif) top left no-repeat;
}
.section .clear
{
clear: both;
}
.section .head
{
width: 48px;
height: 48px;
}
.section .torso
{
width: 96px;
height: 96px;
}
.section .body
{
width: 120px;
height: 150px;
}
.section .items li
{
display: inline;
}
.section .items li img
{
width: 30px;
height: 30px;
}
.section .online
{
background: url(images/status_online.gif) top left no-repeat;
padding-left: 20px;
}
.section .offline
{
background: url(images/status_offline.gif) top left no-repeat;
}
.section .hidden
{
background: url(images/status_hidden.gif) top left no-repeat;
}
.section .links
{
margin-bottom: 10px;
}
.section .links li
{
display: inline;
}
.section .date
{
text-align: right;
font-size: 10px;
font-weight: normal;
font-style: italic;
margin: 0 0 3px 3px;
}
/* CAPTION */
.caption
{
border: 2px solid #000;
background: #000;
}
.caption2
{
border: 2px solid #000;
background: #000;
}
.caption:before
{
display: block;
margin: -2px -2px -2px -2px;
content: url(images/caption_tl.gif);
background: url(images/caption_tr.gif) top right no-repeat;
line-height: .1;
}
.caption:after
{
display: block;
margin: -2px -2px -2px -2px;
content: url(images/caption_bl.gif);
background: url(images/caption_br.gif) bottom right no-repeat;
line-height: .1;
}
.caption2:before
{
display: block;
margin: -2px -2px -2px -2px;
content: url(images/caption_tl.gif);
background: url(images/caption_tr.gif) top right no-repeat;
line-height: .1;
}
.caption2:after
{
display: block;
margin: -2px -2px -2px -2px;
content: url(images/caption_bl.gif);
background: url(images/caption_br.gif) bottom right no-repeat;
line-height: .1;
}
.caption .message
{
position: relative;
left: -22px;
padding: 0 0 0 32px;
min-height: 45px;
margin: 0 -12px 0 0;
background: url(images/caption_ml.gif) top left no-repeat;
font-size: 13px;
font-weight: normal;
height: 45px;
}
.caption2 .message
{
position: relative;
right: -22px;
padding: 0 32px 0 0;
min-height: 45px;
margin: 0 0 0 -12px;
background: url(images/caption_mr.gif) top right no-repeat;
font-size: 13px;
font-weight: normal;
height: 45px;
}
.caption > .message
{
height: auto;
}
.caption2 > .message
{
height: auto;
}
/* ACCOUNT */
form
{
margin: 0 150px;
}
textarea
{
width: 100%;
height: 100px;
}
.textfield
{
width: 100%;
}
label
{
font-weight: bold;
}
#account ul li
{
display: inline;
}
fieldset
{
margin-bottom: 10px;
}
/* PROFILE */
#profile #bar
{
height: 22px;
margin-left: 12px;
}
#profile #bar li
{
display: inline;
float: left;
}
#profile #bar #status
{
background: url(images/action_bar_frontcap.gif) top left no-repeat;
}
#profile #bar #friend
{
width: 33px;
}
#profile #bar #message
{
width: 29px;
}
#profile #bar #trade
{
width: 28px;
}
#profile #bar #ignore
{
width: 34px;
}
#profile .avatar
{
position: relative;
}
#profile .caption
{
position: absolute;
top: 80px;
left: 110px;
width: 105px;
}
#profile .status
{
background: url(images/action_bar_frontcap.gif) top left no-repeat;
margin-left: 10px;
}
/* DETAILS */
#details
{
height: 1%; /* Holly Hack */
}
#details #stats
{
float: right;
width: 100px;
margin: 0 0 10px 10px;
}
/* WISHLIST */
#wishlist .questing
{
background: url(images/wishlist_questing.gif) top right no-repeat;
}
#wishlist .bought
{
background: url(images/wishlist_bought.gif) top right no-repeat;
}
#wishlist .donated
{
background: url(images/wishlist_donated.gif) top right no-repeat;
}
/* ABOUT */
#about
{
height: 1%; /* Holly Hack */
}
/* GUILDS */
/* MULTIMEDIA */
/* JOURNAL */
/* FRIENDS */
#friends
{
height: 1%; /* Holly Hack */
}
#friends #friendGroup
{
margin-top: 10px;
}
#friends #friendGroup li
{
float: left;
width: 110px;
height: 130px;
text-align: center;
}
#friends #friendGroup li img
{
width: 96px;
height: 96px;
}
/* COMMENTS */
#comments dl dt
{
position: relative;
padding-top: 10px;
}
#comments dl dt.avatar img
{
position: absolute;
left: 0;
}
#comments dl dt.avatar2 div
{
text-align: right;
}
#comments dl dt.avatar2 img
{
position: absolute;
right: 0;
width: 120px;
}
#comments dl
{
padding-bottom: 90px;
}
#comments dl dd
{
margin: 0 120px 0 100px;
}
#comments .delete
{
margin-top: 10px;
text-align: right;
}
#comments #pagination li
{
display: inline;
}
#comments .admin li
{
text-align: right;
}
/* SIGNATURE */
#signature
{
text-align: center;
}
#signature h2
{
text-align: left;
}
/* MODERATE */
#moderate
{
padding: 10px;
border: 1px solid #639;
background: #9775B7;
}
#moderate a
{
color: #639;
}
#moderate li
{
display: inline;
}