Some CSS images not showing up?

I’ve been designing a theme locally, using plain old html/css. Everything displays properly in all browsers.

Now when I brought everything to WordPress, only some of the images are displaying properly, basically the background images.

As you see, locally I have navigation links, a separator in the middle banner, and H1 images in the content area.
[IMG]http://i14.photobucket.com/albums/a307/d3c1us/Picture3.png[/IMG]

On the WordPress version I have none of that, but the other images are appearing.
[IMG]http://i14.photobucket.com/albums/a307/d3c1us/Picture3.png[/IMG]

Ive included my CSS, and bolded the sections that arent appearing.

body {
	background: #000 url(img/background.jpg) no-repeat center top;
}

#wrapper {
	margin: 0 auto;
	width: 740px;
}

<strong>.hrintro {
	background: url(img/hrintro.gif) no-repeat center center;
	display: block;
	height: 5px;
	margin: 1em auto .7em;
	width: 99px;
}</strong>

.hr {
	background: url(img/hr.gif) no-repeat center center;
	display: block;
	height: 5px;
	margin: 1em auto;
	width: 99px;
}

.first {
	margin-right: .2em;
}

/* defining floating element */
.first,
#nav li,
#extra,
#content,
#main
{
	float: left;
}

#credits,
.up {
	float: right;
}

#intro,
#footer {
	clear: both;
}

/* Header */

h1 {
	background: url(img/h1.jpg) no-repeat left top;
	height: 166px;
	margin-top: 18px;
}

/* Site navigation */
#nav {
	background-image: url(img/nav.jpg);
	height: 71px;
}

#nav a {
	display: block;
	height: 45px;
	overflow: hidden;
}

<em>#home a {
	background: url(img/home.jpg) no-repeat left top;
	margin-left: 230px;
	width: 71px;
}
	#home a:hover {
	background: url(img/home.jpg) no-repeat left bottom;
	}

#homeh a {
	background: url(img/home.jpg) no-repeat left bottom;
	margin-left: 230px;
	width: 71px;
}

#folio a {
	background: url(img/portfolio.jpg) no-repeat left top;
	margin-left: 20px;
	width: 103px;
}
	#folio a:hover {
	background: url(img/portfolio.jpg) left bottom;
	}

#folioh a {
	background: url(img/portfolio.jpg) no-repeat left bottom;
	margin-left: 20px;
	width: 103px;
}

#contac a {
	background: url(img/contac.jpg) no-repeat left top;
	margin-left: 16px;
	width: 69px;
}
	#contac a:hover {
	background: url(img/contac.jpg) no-repeat left bottom;
	}
/* end nav */</em>

/* intro banner section */

#intro {
	background: #68221a url(img/introback.jpg) repeat-y left top;
	color: #f0eedf;
	padding: 3px 0;
	text-shadow: #3f0a0a 0 1px 3px;
}

#intro h2  {
	background: url(img/introtop.jpg) no-repeat left top;
	padding: 20px 20px 0 20px;
}

#intro p {
	background: url(img/introbott.jpg) no-repeat left bottom;
	padding: 0 20px 20px 20px;
}

#intro ul  {
	background: url(img/introbott.jpg) no-repeat left bottom;
	padding: 0 20px 20px 20px;
}

#intro a {
	border-bottom: 1px dotted #b27868;
	color: #f0eedf;
}
	#intro a:hover {
	background: url(img/opacity.png) repeat;
	color: #fff;
	}
/* end intro */

#extra {
 	background:white url(img/backmain.jpg) repeat-y center top;
}

#rcborder {
	padding: 0 3px;
	border-left: 1px solid #c0beac;
	border-right: 1px solid #c0beac;
}

#content {
	background: url(img/mainbottom.jpg) no-repeat center bottom;
	color: #474642;
	padding: 20px 25px 40px;
	text-shadow: #d6d5ca 0 1px 4px;
}

#content a {
	color: #828079;
}
	#content a:hover {
		color: black;
	}

#content h2, #content h3 {
	margin-bottom: 1em;
	margin-top: .2em;
}

/* Main column */

#main {
	width: 690px;
}

#about {
	margin-bottom: 3em;
}

#about h2 {
	background: url(img/about.gif) no-repeat left top;
	height: 31px;
	width: 515px;
}

#contact h2 {
	background: url(img/contact.gif) no-repeat left top;
	height: 31px;
	width: 515px;
}

/* Footer */

#footer {
	background-color: #000;
	color: #908f86;
	height: 4em;
	margin-bottom: 3em;
	padding-top: .5em;
}

#footer a {
	border-bottom: 1px dashed #484944;
	color: #908f86;
}

#footer a:hover {
	color: #f0eedf;
}

#secnav li {
	display: inline;
	margin-right: .5em;
}

<strong>#apple {
	background: url(img/apple.gif) no-repeat right center;
	margin-bottom: 1em;
	padding-top: 2px;
	padding-right: 18px;
	margin-top: .2em;
}</strong>

Any help would be greatly appreciated.