Thanks for your quick reply.
Actually i don't have a URL as i was just checking the demo to see which one i would use for a project.
I'm on a MacBook Pro retina display.
But i figured out the problem. Here a good tip as you might eventually hear more that very same question as these laptop and other brands' laptop, who are and will probably follow these foot steps, are becoming more popular.
It's the MacBook Pro Retina display's resolution who is at fault. From what i see and read, by default the resolution of the retina display is 2880 x 1800 and only a few application are yet supporting it. Apple's application are of course, Chrome is as well but not Firefox. Which would explain why i do not see the problem with Firefox. Apple does it by packing double the amount of pixels.
But Apple has included an option to start an application in "low resolution" by doing a right-click "Info" on an application and check the "Start in low resolution" option. That has the effect to start the application with a resolution of 1440 x 900 (indeed it's (2880 x 1800)/2 !). But produces a bit blurry text and unsharp images.
Which is therefore why the site was displaying correctly when i restarted safari in "low resolution" mode. But displayed incorrectly as soon as i restarted safari as default.
So although it's the macbook pro retina display who's at fault, it might be good to look into it. For fact i can say that i've used and tested other templates based on different frameworks (warp, Gantry, Zengrid) and none of them has this issue with high resolutions such as 2880 x 1800. Which mean that a refinement of the resolution detection logic is possible to avoid the problem. But i'm a very experienced dev.
I hope that will help others.