Cannot get image to follow text in same div

Cannot get image to follow text in same div

I'm trying to create a line of text followed by an image on the same line
of a grid with 12 columns.
For some reason image 2 is displaying in line with image 1 text and then
image 2 is showing with image 1 text.
It looks like the text and image elements within the div are above/below
each other. What I want is them to be side by side.
How do I resolve this? I've posed the code here
http://jsfiddle.net/Dano007/P7nzy/embedded/result/
http://jsfiddle.net/Dano007/P7nzy/
<div class="grid_6">
<p class="text">"The best selection of cheese I've ever seen! Cannot
wait for our next order!"</p>
<p class="image omega"><img src="img/cheese1.jpg" alt="Contact us"></p>
</div>
<div class="grid_5">
<p class="image"><img src="img/cheese2.jpg" alt="Contact us"></p>
<p class="text omega" id="text_left">"Wow, amazing cheese selection
and very fast delivery!"</p>
</div>
CSS
.text {
display:inline-block;
font-size: 3.0em;
text-align: right;
}
#text_left {text-align: left; }
.image {
display:inline-block;
text-align: center;
border:solid 4px #6b5221;
}