Need transparent background but a solid content area

I’m developing a site where I have a photo background with a transparent body area allowing the photo to come through. I want a solid white background behind the article content area, but I’m having a hard time figuring this out. I have an example of it being done on another site here, so I know it can be done, but Firebug is not giving me any clues as to how they did it (no opacity code settings? So how did it work?).

Here is the site I’m working on. I’m using Twenty Ten with a child theme. Here is the code for the “Main” div (that’s the transparent page area):

#main {
    background: none repeat scroll 0 0 #FFFFFF;
    border-radius: 18px 18px 18px 18px;
    clear: both;
    margin-top: 20px;
    opacity: 0.7;
    overflow: hidden;
    padding: 40px 20px 0;
    width: 900px;
}

And I’m trying to change the background of the “Content” div (just behind all the content area)

#content, #content input, #content, #content input, #content textarea {
    background: none repeat scroll 0 0 #FFFFFF;
    color: #26265F;
    font-size: 14px;
    line-height: 24px;
    opacity: 1;
}

I’m still getting the site background coming through the Main div and making the content transparent, including the picture. I assumed I could use opacity:1.0 to set the content area solid, but either it can’t be done, or I’m missing something.

I’ve searched a bunch of CSS sites and these WP forums, and general searches, but I’m not finding the answers I’m looking for. Could anyone give me a clue as to what I’m missing?

Thanks so much for your time.