How do I create multi colored boxes using CSS3

OS - Windows 7 using DW Cs5.5

I need to create a screen with lots of equally sized colored boxes with text colours that will be visible easily within them.

I have a class set up as follows:

.yellowbox {

    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;

    font-size: small;

    color: #F00;

     background-color: #FC3;

    text-align: center;

    vertical-align: middle;

    margin: 4px;

    padding: 4px;

    clear: none;

    float: left;

    height: 10em;

    width: 30%;

    position: relative;

    border: thick solid #F00;

}

This displays a box that is yellow with a red border.

With a set of 9 divs of this class, I get 9 boxes arranged as a 3x3 grid in a 960px wide container.

How do I modify the CSS so that the background color changes with each box, and the text color is always in a color that is readable?