Strange and Interesting problem..

EDIT: I figured out the problem. apparently everything is case sensitive. I had default_style.css, but it should have been all in uppercase, as it was in my index. now I feel a little silly

Gonna leave this here though, in case others have this problem.

So here's my problem. I've got my general layout, & images & stuff done for my website. I did the CSS for what I have so far, & the Index page. Both are working fine on my Local machine. but when I uploaded it to my webspace, and went to look at it, it's was all fubared.

I've *never* had this happen before.

I validated both at wc3, and the only thing wrong with it, was I don't have a doctype in my index. (cause I'm clueless about that , guess I ought to bug the hubby to expalin it to me)

Here is a screenshot of what I have on my machine: http://www.veritysrealm.com/randomness/layout.jpg ( I haven't customised the radioblog yet.. getting to that eventually)

Here is what it looks like uploaded to my website: http://www.veritysrealm.com/testsite/index.html

My CSS code: (HTML code in the next post)
BODY {
background-image: url(yanwebsite.png);
background-repeat-repeat;
background-position: top left;
background-attachment: fixed;
background-color: #000000;
color: #e8d1ff;
}
.titlebox
{
background: none;
border: none;
position: absolute;
padding: 5px;
top: 20px;
width:515px;
Left: 240px;
height: 75px;
text-align: center;
color: white;
font-size: 55px;
}
.border
{
background: none;
border: darkred solid 1px;
position: absolute;
top: 95px;
width: 518px;
left: 238px;
height: 648px;
text-align: left;
overflow: auto;
}
.test
{
background: none;
border: none;
position: absolute;
top: 220px;
width: 475px;
left: 260px;
height: 400px;
text-align: left;
overflow: auto;
}
.linkbox
{
background: none;
border: none;
position: absolute;
padding: 5px;
top: 745px;
width:515px;
Left: 240px;
height: 35px;
text-align: center;
}
.radio
{
background: none;
border: white solid 1px;
position: absolute;
top: 350px;
width30px;
Left: 3px;
height:305px;
text-align: center;
}
.tag
{
background-image: url(tagbg.png);
background-repeat-repeat;
border: none;
position: absolute;
top: 95px;
width30px;
Left:760px;
height:490px;
text-align: center;
}