Unit 6 (Incomplete, Need Help with Missing Image)

What I did was I made three columns using different widths in percentages and I changed the colors and text to separate from the exercise file I based it on. The news links redirected to stories featured from UT San Diego on February 19, 2015.
Right now, I need help from Fontanella because there is a image that it is missing right now, even the CSS properties included the image. The banner is featured on the preview on Dreamweaver, but not on the remote server.

gc.palomar.edu/34634/34634wbrewster3897/San%20Diego%20Sun.html

Here are the properties for the banner: gc.palomar.edu/34634/34634wbrewster3897/Images.html

Preview on Dreamweaver (first picture)
On the site server (second picture)

Source Code

HTML:

<div class="banner">
<h1>Thursday february 19, 2015</h1>
</div>

CSS:

/*banner styles*/
.banner h1 {
text-transform: uppercase;

/*banner styles*/
.banner {
width: 90%;
margin: 0 auto;
margin-bottom: 2.4em;
overflow: visible;
position: relative;
visibility: visible;
}

.banner h1 {
font-weight: bold;
font-size: 1em;
text-align: center;
margin-bottom: .5em;
}

.banner p {
width: 90%;
font-size: .8em;
margin: 0 auto;
line-height: 2;
}

/*banner styles*/
.banner {
height: 350px;
padding-left: 3.9%;
overflow: visible;
margin-bottom: 4em;
position: relative;
font-variant: normal;
background-image: url(../../../../../../../GCMW202/sandiego.jpg);
background-repeat: no-repeat;
visibility: visible;
}

.banner h1 {
font-size: 2.2em;
color: #fff;
padding-top: 290px;
letter-spacing:.1em;
}

.banner p {
width: 21%;
padding: 1% 1% 0;
height: 350px;
font-size: 1em;
color: #fff;
background: rgba(123, 121, 143, .8);
position: absolute;
top: 0;
right: 0;
}