HTML/CSS combination containers

I am having a major, amateur issue with some containers on one site.

I posted my problem on Yahoo answers and the help I recieved was a part HTML part CSS code to apply to my page.

CSS was as follows:

.container {
    width: 60%;
    margin: 0 auto;
}
.container h3 {
    margin: 0;
    text-align: center;
    background-color: #5882fa;
    padding: 3px 0;
    color: #ccc;
}
.container .content {
    background-color: #848484;
    padding: 5px 10px;
}
.container .content p {
    margin: 0;
}
.white {
    color: #ffffff;
}
.container .footer {
    background-color: #5882fa;
    color: #2E2EFE;
    clear: both;
    text-align: center;
    letter-spacing: 7px;
    text-transform: uppercase;
    padding: 3px 0;
}

and the HTML:

<div class="container">
    <h3>Mission</h3>
    <div class="content">
        <p class="white">content</p>
        <span title="Read More" id="id8420" class="collapseomatic ">Read More</span>
    </div>
    <div class="footer">The voice for wheelchair access</div>
</div>

[Moderator Note: Please post code & markup between backticks or use the code button. Your posted code may now have been permanently damaged by the forum’s parser.]

Now for the question which shows I know nothing:

I have no idea where to apply the CSS, I thought in the theme editor files but I have no idea where to place it within those files :/

Can someone please help?