HTML doc not attaching to style sheet but looks fine in DW. Problem

Question

Hello once more,
I posted this problem the other day but it was mistaken for something else, this was my fault as I posted incorrectly.
The current problem with this page, is that it looks fine in Dreamweaver, but as soon as it is viewed in any browser, even firefox, it loses all of the style commands.  The problem is with the text on the page, the menu seems to be behaving fine and I cannot comment on whether it is interfering with the page in a manner which causes the text to not find the styles.
Here is a screenshot of how the page should be appearing:
http://postimage.org/image/wp16tgqid/
Here is the page live on the internet:
Page
Here is an except of one of the styles:
.readingtextborder9{
    width:471px;
    height:173px;
    background:url(../images/reading%20border9.png);
    margin-top: 20px;
    margin-left: 36px;
    margin-right: 10px;
    margin-bottom: 5 px;
    text-align:justify;
    padding-left: 180px;   
    padding-top: 10px;
    padding-right: 13px;   
The page did work fine up until a point which I cannot distinguish, but at one point the menu was working together with the page, correctly.  Hence why I find it hard to believe the menu is causing the problems.
Any help would be hugely appreciated.
Thank you

Answer 1

Validate code and fix reported errors. 
You have a messed up Meta tag on line 26 and an extra </div> tag on line 208.
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.entasistours.com%2Freading.ht ml
On lines 4-11, you have this style inside comments.  Why?
<!--
.style24 {
font-size: 11px;
font-family: verdana;
color: #666666;
text-indent: 30px;
-->
On line 11 you have this which doesn't do anything. Remove it.
<style type="text/css"></style>
On lines 33-47, you have these styles.
<style type="text/css">
.style1 {font-size: 12px}
a:link {
color: #666666; }
a:hover {
color: #333333; }
.style2 {
font-size: 12px;
color: #666666; }
.style3 {color: #666666}
.style4 {font-size:12px; font-weight: normal; line-height:1; font-family: verdana; padding-top: 2px; margin-top: 5px; text-align:center; width: 100%;}
a:visited {
color: #333333; }
</style>
And even more styles on lines 58-71, also inside comments, why?
<style type="text/css">
<!--
body {
background-image: url(images/backgroundmain.jpg); }
.style37 {font-size: medium}
.clearfix:before .clearfix:after { content: ""; display: table; }
    .clearfix:after { clear: both; }
    .clearfix { zoom: 1; }
.style42 {
font-size: small;
font-family: verdana;
color: #666666; }
-->
</style>
Organize your code better.
Use meaningful .class names instead of style1, style2, style37, style42 which don't tell you what the style is being used for.
Put CSS code into your external style sheet. This will make problem solving and site management much easier.
Nancy O.