* {margin: 0em; padding-top: 0em; }
body
{
background-color: #635548;
padding-top:10px;
font-family: trebuchet MS, arial, sans-serif;
color:#8a7a67;
background-image: url(images/Background.jpg);
background-repeat:no-repeat;
}/*Styling for body of page. Font, and colour of background/text*/
#main-container {
width: 955px;
margin: 0.5em auto;
background-image: url(images/headerBar.gif);
background-repeat: no-repeat;
background-position: top center;
background-color: #fff;
}/*Main container holding the header bar image and restricted width of page*/
#logoPrint {
display: none;
}/*Smaller logo for printing purposes only. Hidden from on screen display*/
/*Start logo*/
#header { height: 211px; }
#header img { border: none; }
/*End logo*/
#content-container {
background-image: url(images/navShadow.gif);
background-repeat: repeat-y;
}/*holds background image that sits behind navigation links*/
h1 {
font-size: 128%;
color: #8a7a67;
padding: 2px 0 2px 0;
}
h3 { font-size: 90%; }
.eyesHandsFeet {
font-size: 115%;
margin-bottom: 5px;
}/*Eyes, Hands & Feet subheadings*/
.contentSubHeading {
font-size: 100%;
margin-top: 5px;
} /*Subheadings on main pages and text on venues page and contact page. Mainly h2 headings*/
a {
color: #8a7a67;
font-weight: bold;
text-decoration: none;
}/*links CSS*/
a:visited { color: #8a7a67; } /*color of a link when visited */
a:hover { color: #e8e3dd; } /*color of a link when hovered over*/
/*START #NAV CSS - navigation links on left of page*/
#nav {
width: 200px;
float: left;
margin-right: 17px;
color: #8a7a67; /*color of #nav link when on that page...no tag*/
}
#nav ul { margin-left: 30px; } /*move main navigation away from main container*/
#nav li {
list-style-type: none;
line-height: 200%;
font-size: 110%;
}/*style navigation list*/
#nav a {
color: #8a7a67; /*color of #nav link when not active*/
text-decoration: none;
font-weight: normal;
}/*style navigation links*/
#nav a:visited { color: #8a7a67; } /*color of #nav link when visited */
#nav a:hover { color: #e8e3dd; } /*color of #nav link when hovered over*/
/*END #nav CSS*/
#content-outer {
width: 530px;
float: left;
border-left: 2px solid #8a7a67;
border-right: 2px solid #8a7a67;
margin-bottom: 20px;
}/*Borders create visual separation of the main site content from the left and right nav 'columns'*/
#content-inner { margin: 0 15px 0 15px; } /*distance of text from the right and left borders*/
#content-inner p {
margin-bottom: 10px;
font-size: 80%;
line-height: 180%;
text-align: justify;
}/*Text properties of main content*/
/*START .yogaBeautyNav CSS - navigation links under headings on beauty and yoga pages.*/
.yogaBeautyNav {
margin: 0 0 20px 0;
border: 1px solid #8a7a67;
text-align: center;
}
.yogaBeautyNav li {
list-style-type: none;
display: inline;
font-size: 80%;
color: #8a7a67;
padding: 0 2px 0 2px;
}/*Styling for the navigation*/
.yogaBeautyNav a {
text-decoration: none;
color: #8a7a67;
font-weight: bold;
}/*Styling for the links*/
.yogaBeautyNav a:visited { color: #8a7a67; }
.yogaBeautyNav a:hover{ color: #e8e3dd; }
/*END .yogaBeautyNav CSS*/
.beautyImgLeft {
margin: 0 10px 0 0;
float: left;
}/*Picture of cottage on beauty.html*/
.facials {
list-style-type: none;
text-align: center;
margin-top: 40px;
}/*Styling for Environ/Dermaessentials list on facials.html*/
.facials li {
margin-bottom: 20px;
}/*Styling for Environ/Dermaessentials list on facials.html*/
.beautyImgLeft {
margin: 0 10px 0 0;
float: left;
}/*Styling for photo on facials.html*/
#yogaPicRight {
float: right;
margin: 30px 0 10px 10px;
}/*Picture of yoga class on yoga.html*/
#yogaPicLeft {
margin: 20px 10px 10px 0;
float: left;
}/*Picture of yoga class on yoga.html*/
.emphasis { font-style:italic; }/* Pale blue background colour on keywords in main content text*/
.map {
border: solid #8a7a67 1px;
margin: 10px 0 20px 0;
}/*Positioning and border on map thumbnails*/
.addresses {
width: 345px;
float: left;
margin-top: 5px;
font-size: 110%;
color: #8a7a67;
}/* CSS properties of addresses in main content area (excluding address in footer nav)*/
#clearP{
clear:both;
margin-top: 40px;
} /*to push text below map thumbnail in contact.html*/
#qual {
font-size: 85%;
} /*shrink qualification text in contact.html*/
/*START RIGHT-COL CSS - Yoga Retreat / gift voucher text and images of products*/
#right-col {
float: right;
}
#right-col table {
background-image: url(images/lotusShadow.jpg);
background-repeat: no-repeat;
background-position: bottom right;
height: 282px;
width: 199px;
}/*Table used to position text as problems were encountered due to the 3 floats in the div.*/
#right-col td {
vertical-align: bottom;
text-align: center;
} /*Aligns the table text to the bottom center of the background image.*/
#right-col h2 { font-size: 130%; }
#right-col p { font-size: 80%; }
.right-colPics {
margin: 30px 0 90px 0;
padding: 10px
}/*pictures below table in right column (mainly found in product pages and on newsletter page)*/
/*END RIGHT-COL CSS*/
/*START FOOTER CSS*/
#footer {
clear: both;
background-image: url(images/footerBarApptTxt.gif);
background-repeat: no-repeat;
height: 87px;
color: #8a7a67;
font-weight: bold;
font-size: 0.75em;
}/*footer bar and dimensions. Text size of address and navigation*/
#footerText {
margin-top: 32px;
margin-left: 5px;
float: left;
}/*Footer address placement*/
#footerText p {
color:#8a7a67;
padding-left:10px;
}/*Background color used so that if the text is enlarged by the viewer the footer text doesn't disappear into the white background. Not ideal but the only way around it!*/
#footerNav {
padding-top: 68px;
margin-right: 5px;
text-align: right;
}/*footer navigation placement*/
.whitetext
{
color:White;
}
#footerNav ul {
color:#8a7a67;
}/*Background color used so that if the text is enlarged by the viewer the footer text doesn't disappear into the white background. Not ideal but the only way around it!*/
#footerNav li {
display: inline;
list-style-type: none;
}/*navigation list styles*/
#footerNav a {
color:#8a7a67;
}/*Colour of footer links text*/
#footerNav a:hover{ color: #e8e3dd; }
#updated {
margin-top: 10px;
text-align: center;
font-size: 0.75em;
}/*Styling for copyright note and last updated text*/
/*END FOOTER CSS*/
/*START TREATMENT and PRODUCT TABLES CSS*/
#tableBorder {
margin-bottom: 20px;
}/*Extends the end of the table down so text isn't so close to the footer bar*/
#tableBorderYoga {
margin-bottom: 50px;
}/*Extends border down to uniform position*/
table, td {
width: 500px;
color: #8a7a67;
}/*table width/text color*/
.treatmentProduct {
border-bottom: dashed 1px #8a7a67;
font-weight: bold;
font-size: 95%;
width: 900px;
}/*Styles for main treatment/product name columns*/
.bodyWrapArea {
border-bottom: dashed 1px #8a7a67;
font-size: 80%;
}/*style for body wrap treatment area in bodyTreatments.html*/
.cost {
border-bottom: dashed 1px #8a7a67;
font-weight: bold;
text-align: right;
}/*style for treatment cost column*/
.skinType {
font-size: 75%;
}/*Smaller text describing skin type/product type in products pages*/
.productTreatmentInfo {
font-size: 85%;
padding: 10px 0 10px 0;
}/*styling for descriptions of products/treatments*/
#bodyTreatmentNote {
font-size: 78%;
padding-bottom: 15px;
text-align: center;
}/*styling for small text under Body Treatment description*/
.noteText {
font-size: 78%;
margin-top: 20px;
color: #8a7a67;
}/*styling for comment on prices*/
.environProductRange {
font-size: 120%;
padding: 20px 0 5px 0;
font-weight: bold;
color: #8a7a67;
}/*Styling for Environ Range headings*/
.dermaProductRange {
font-weight: bold;
font-size: 100%;
padding-top: 15px;
color: #8a7a67;
}/*Styling for Dermaessentials Range headings*/
.yogaDay {
font-weight: bold;
font-size: 110%;
padding-top: 15px;
color: #8a7a67;
}/*Styling for yoga class days of the week*/
.yogaLocation {
font-size: 85%;
font-weight: bold;
padding: 15px 0 0px 0;
}/*Styling for yoga class locations*/
.yogaClassType {
font-size: 85%;
border-bottom: dashed 1px #8a7a67;
}/*Styling for yoga class level*/
.yogaClassTime {
font-size: 85%;
border-bottom: dashed 1px #8a7a67;
text-align: right;
}/*Styling for yoga class times*/
.retreatName{
font-size: 110%;
margin-bottom: 10px;
}/*Styling for yoga retreat name*/
#content-inner .retreatDate{
font-size: 100%;
margin-bottom: 10px;
}/*Styling for yoga retreat date text*/
.retreatDay {
font-weight: bold;
font-size: 110%;
padding-top: 10px;
color: #8a7a67;
}/*Styling for yoga retreat day/date text*/
.retreatActivity {
font-size: 85%;
border-bottom: dashed 1px #8a7a67;
width: 1000px;
}/*Styling for yoga retreat activity*/
.retreatTime {
font-size: 85%;
border-bottom: dashed 1px #8a7a67;
text-align: right;
}/*Styling for yoga retreat date times*/
#content-inner .retreatp {
font-size: 80%;
line-height: 1;
margin-top: 10px;
}/*Styling for yoga retreat footnotes*/
/*END TREATMENT and PRODUCT TABLES CSS*/