Adjusting php code to accommodate a 2nd div

long time reader first time poster. I downloaded a theme for wordpress recently and i’m trying to edit it but am having difficulty. I know a bit of css but php is slightly out of my capability. So anyway I have 3 excepts of pages which show up on the main page. I would like to give them different background colours. I’ve managed to give the first two the same colour and the last a different one. I would like to give the middle one a different color as well, but i don’t know how to. It seems that the div control is managed through php. Here is the php code:

        <?php if ( get_option('chameleon_display_blurbs') == 'on' ){ ?>
        <div id="services" class="clearfix">
            <?php for ($i=1; $i <= 3; $i++) { ?>
                <?php query_posts('page_id=' . get_pageId(html_entity_decode(get_option('chameleon_home_page_'.$i)))); while (have_posts()) : the_post(); ?>
                    <?php 
                        global $more; $more = 0;
                    ?>
                    <div class="service<?php if ( $i == 3 ) echo ' last'; ?>">

And here is the css code:

#services { margin-bottom: 40px; }
            .service { float: left; width: 244px; margin-right: 66px; background:#000; }        .last { margin-right: 0px; background:#0F0; }

So just to reiterate, I just want to be able to apply a different colour to the middle div.

website address:

Thank you and any help would be much appreciated!