Creating a horizontal navigation with different colours

Creating a horizontal navigation with different colours

I am trying to create a simple navigation menu with different background
colours for each option, and which is horizontal. So far I have my
navigation as shown.
<ul id="session-nav">
<li class="session1"><a href="#" class="active">Session 1</a></li>
<li class="session2"><a href="#">Session 2</a></li>
<li class="session3"><a href="#">Session 3</a></li>
</ul>
But I am confused on how to do this with CSS.
I would like this menu to look like the image shown.

Many thanks, Jonny.