v.plonk!

Comments
It's pretty cool, when your visitors can directly see your replies in the comments. If you just want to give your own comment a different background color it's made in seconds. You need only 1 line of CSS code:

.ownercomment {
    background: #YOUR_COLOR_AS_HEX_CODE;
}

(If you don't know how to get the color code, just try this small tool.)

I additionally used some small background images to give is a certain "theme" (I shortened the URL a little bit to make it more clear):

.comment1 {
    background: #181818 url('SERVER_URL/comment_1.png') repeat-y;
}
.comment2 {
    background: #272727 url('SERVER_URL/comment_2.png') repeat-y;
}
.ownercomment {
    background: #001c30 url('SERVER_URL/comment_own.png') repeat-y;
}

Et voilà... the comments are "stylish".



Sidebar Boxes
Next I improved the look of the sidebar boxes. That's very easy as well:

#side h2, #side caption {
    background: #001c30 url('SERVER_URL/sidebox_head.png') repeat-y;
}
.sidebox {
    background: #181818 url('SERVER_URL/sidebox_body.png') repeat-y;
}

Okay, that was pretty obvious, wasn't it?



"Recent Visitors"-Sidebar
Next I wanted to change the last visitors box a little bit, to make it look more like a list than a collection. Easy-peasy in Opera and Firefox. We just define our own set of CSS rules for every element included:

/* VISITORS SIDEBAR */
#visitors ul {
    border: none;
    width: 230px;
    margin: 0px;
    padding: 0px;
    background: transparent;
}
#visitors li {
    display: inline;
    height: 80px;
    border: none;
    width: 230px;
    margin: 0px;
    padding: 0px;
    background: transparent;
}
#visitors li:hover {
    width: 230px;
    margin: 0px;
    padding: 0px;
    background: transparent;
}
#visitors li.first {
    border: none;
    width: 230px;
    margin: 0px;
    padding: 0px;
    background: transparent;
}
#visitors li.mid {
    border: none;
    width: 230px;
    margin: 0px;
    padding: 0px;
    background: transparent;
}
#visitors li a {
    color: #006bd0;
    border: none;
    width: 73px;
    margin: 0px;
    padding: 0px;
    background: transparent;
}
#visitors span {
    float: left;
    height: 22px;
    width: 140px;
    color: #004e87;
    border: none;
    margin: -60px 0px 0px 73px;
    padding: 25px 0px 25px 0px;
    background: transparent;
    font-size: 1.5em;
}
#visitors span:hover {
    color: #006bd0;
}
#visitors img {
    float: left;
    border: none;
    margin: 0px;
    padding: 0px;
    background: transparent;
    margin: 10px 0px 0px 5px;
}

That does the trick... at least if your visitors use a real browser. If they don't, this means they use an Internet Explorer, you need to "cheat" a little bit.
Be aware that the following code is NOT valid CSS!

#visitors li a { *margin: 0px 0px 0px -146px; }

This works with IE6 and 7 (at least on my machine).