/* CSS Document */


body 
{
margin: 0px;
padding: 10px 0px 0px 0px;
color: #000;
background: #86B3C2 url(../images/background.jpg) repeat-x top left;
}

									/* SITE BODY ELEMENTS  */


/* holds the header logo/graphic */
.headerbox 
{
margin: 0px auto;
padding: 0px;
width: 750px;
height: 114px;
background: #fff url(../images/header.jpg) no-repeat center;
}

/* holds everything except for headbox and menu divs and footers */
.container 
{
overflow: hidden;
margin: 0px auto;
padding: 0px;
width: 750px;
background: #fff;
}


/* holds the main body text */
.textbox 
{
margin: 0px auto;
padding: 0px;
width: 700px;
}

/* for columns in the textbox div */
.lefttext
{
float: left;
width: 335px;
padding: 0px;
margin: 0px 0px 0px 0px;
}

/* for columns in the textbox div */
.righttext
{
float: left;
width: 335px;
padding: 0px;
margin: 0px 0px 0px 30px;
}

.greybox 
{
float: left;
margin: 0px 0px 10px 0px;
padding: 10px;
width: 680px;
background: #EFEFEF;
border: 1px solid #CCC;
}

.greenbox 
{
float: left;
margin: 0px 0px 10px 0px;
padding: 10px;
width: 680px;
background: #CFE1E7;
border: 1px solid #0F6886;
}

/* lines up text on news pages with text in other divs */
.newstext 
{
float: left;
margin: 0px;
padding: 10px;
width: 680px;
background: #fff;
}

/* for text columns in greybox, greenbox and newstext divs */
.boxleft
{
float: left;
width: 325px;
padding: 0px;
margin: 0px 0px 0px 0px;
}

/* for text columns in greybox, greenbox and newstext divs */
.boxright
{
float: left;
width: 325px;
border-left: 1px solid #999;
padding: 0px 0px 0px 14px;
margin: 0px 0px 10px 15px;
}

/* text on the contact page */
.contactbox 
{
float: left;
margin: 0px 0px 0px 25px;
padding: 0px;
width: 250px;
}

/* on the bookings page */
.hourstext
{
float: left;
width: 120px;
margin: 0px 0px 5px 0px;
}

/* holds groups info and thumbnails on the working groups page */
.darkfeature
{
float: left;
width: 680px;
padding: 10px 10px 0px 10px;
margin: 0px 0px 10px 0px;
background: #EFEFEF;
border: 1px solid #CCC;
}

/* holds groups info and thumbnails on the working groups page */
.lightfeature
{
float: left;
width: 680px;
padding: 10px 10px 0px 10px;
margin: 0px 0px 10px 0px;
background: #FFF;
border: 1px solid #CCC;
}

.darkline
{
float: left;
width: 100%;
margin: 0px 0px 10px 0px;
border-bottom: 1px solid #999;
}

/* holds submit buttons on forms */
.field
{
width: 100px;
margin: 0px 0px 0px 43px;
}


										/* FOOTER ELEMENTS */


.footbox {
margin: 0px auto;
padding: 50px 0px 0px 0px;
width: 750px;
background: #CFE1E7 url(../images/footer-decoration.jpg) no-repeat  top center;
}

.foottext {
margin: 10px auto 0px auto;
padding: 0px 0px 10px 0px;
width: 700px;
}

.bottom
{
margin: 0px auto;
width: 750px;
height: 20px;
background: #86b3c2 url(../images/bottom.jpg) top center no-repeat;
}


									/* NAVIGATION ELEMENTS  */
									
									
/*holds all of the menu elements*/
.menu {
margin: 0px auto;
width: 750px;
height: 35px;
background: #CFE1E7;
}

 /* all lists */
#nav, #nav ul 
{
padding: 0px;
margin: 0px;
list-style: none;
}

#nav, #nav ul 
{
padding: 0px;
margin: 0px;
list-style: none;
}

#nav a 
{
display: block;
width: 125px;
height: 25px;
text-decoration: none;
color: #0F6886;
}

 /* all list items */
#nav li
{
float: left;
width: 125px;
height: 15px;
font: 14px Arial, Helvetica, sans-serif;
font-color: #247BFD;
line-height: 1.3em;
padding: 10px 0px 10px 0px;
text-align: center;
background: #CFE1E7;
}

#nav li:hover
{
background: #86B3C2;
}

 /* second-level lists */
#nav li ul 
{
position: absolute;
width: 125px;
left: -999em;
}

/* lists nested under hovered list items */
#nav li:hover ul, #nav li.sfhover ul 
{ 
left: auto;
}

/* Breadcrumb menu */
.breadcrumbs
{
margin: 20px auto 15px auto;
width: 700px;
font: 11px Arial, Helvetica, sans-serif;
color: #666;
text-align: left;
line-height: 0px;
}


										/* LIST STUFF - BULLETS */


.bullet-square
{
margin-left: -8px;
padding-left: 0px;
margin-top: -1px;
list-style: none;
}

.bullet-square li
{
background-image: url(../images/bullet-square.gif);
background-repeat: no-repeat;
padding-left: 27px;
background-position: 0.5em 0.3em;
}

.bullet-tick
{
margin-left: -10px;
padding-left: 0px;
list-style: none;
}

.bullet-tick li
{
background-image: url(../images/bullet-tick.gif);
background-repeat: no-repeat;
padding-left: 30px;
background-position: 0.5em 0.2em;
}

.bullet-tri
{
margin-left: -8px;
padding-left: 0px;
list-style: none;
}

.bullet-tri li
{
background-image: url(../images/bullet-tri.gif);
background-repeat: no-repeat;
padding-left: 27px;
background-position: 0.5em 0em;
}

ol li
{
font: 13px Arial, Helvetica, sans-serif;
margin-left: -20px;
}


									/* GRAPHICS  */
					
.iconbox {
float: left;
margin: 0px 10px 0px 0px;
padding: 0px;
}

.atmslogo {
float: right;
margin: 0px 0px 10px 15px;
padding: 0px;
width: 137px;
height: 87px;
background: url(../images/atms-logo.gif) no-repeat center;
}

.contactimage
{
float: right;
width: 300px;
margin: 5px 0px 10px 15px;
}

.tarotcards 
{
float: right;
margin: 0px -10px -12px 0px;
padding: 0px;
}


.imageright 
{
float: right;
margin: 5px 0px 5px 12px;
padding: 0px;
}

.thumbright 
{
float: right;
margin: 0px -10px -12px 0px;
padding: 0px;
}

.mapbox 
{
float: right;
width: 250px;
margin: 0px 0px 15px 45px;
}	

.mapboxnews 
{
float: right;
width: 250px;
margin: 8px 0px 0px 15px;
}					

.mapcaption
{
float: left;
margin: 0px;
width: 250px;
}

/* newsletter page */
.masthead
{
float: left;
width: 750px;
height: 87px;
margin: 0px 0px 20px 0px;
background: url(../images/masthead.jpg) no-repeat top center;
}

.promo 
{
clear: both;
float: right;
width: 250px;
height: 260px;
border: 1px solid #0F6886;
margin: 0px 0px 10px 15px;
background: url(../images/gift.jpg) top left no-repeat;
}

.promo:hover
{
cursor: pointer;
}

.adbox 
{
clear: both;
float: right;
width: 240px;
height: 180px;
margin: 5px 0px 20px 15px;
background: #CCC url(../images/offer.jpg) top left no-repeat;
}

.giftbox
{
float: right;
width: 230px;
height: 295px;
margin: 0px 0px 3px 15px;
background: url(../images/gift-voucher.gif) top left no-repeat;
}


									/* FONTS  */
					
h1 
{
clear: left;
font: 22px Arial, Helvetica, sans-serif;
color: #0F6886;
}

h2 
{ 
font: 16px Arial, Helvetica, sans-serif;
color: #000;
margin: 0px 0px 10px 0px;
}

h3 
{ 
font: 20px Arial, Helvetica, sans-serif;
color: #0F6886;
margin: 0px 0px 0px 0px;
line-height: 1.5em;
}

h4
{ 
font: 16px Arial, Helvetica, sans-serif;
color: #0F6886;
margin: 0px 0px 10px 0px;
}

.date 
{
font: 14px Arial, Helvetica, sans-serif;
line-height: 1em;
text-align: left;
margin: -5px 0px -5px 0px;
}

.headline
{ 
font: 20px  "Trebuchet", Arial, Helvetica, sans-serif;
color: #000;
text-align: center;
margin: 5px 0px 15px 0px;
}

p 
{
clear: left;
font: 13px Arial, Helvetica, sans-serif;
line-height: 1.6em;
text-align: justify;
margin: 0px 0px 10px 0px;
}

.greybox p 
{
clear: none;
}

.lightfeature p 
{
clear: none;
}			

p em
{
font-style: normal;
color: #0F6886;
}

.foottext p 
{
clear: none;
color: #0F6886;
line-height: 1em;
text-align: center;			
}

.foottext strong 
{
font-size: 16px;
font-weight: normal;
line-height: 1.5em;
}

.mapcaption p
{
font-size: 11px;
line-height: 1em;
margin: 0px;
}	

.mapcaption em
{
font-style: normal;
color: #0F6886;
}					
					/* LINKS  */
											

/* External links with icon */											
.ext a:link 
{
color: #0F6886;
text-decoration: none;
border-bottom: 1px dotted;
padding-right: 18px;
background: transparent url(../images/icon-ext.gif) no-repeat top right;
line-height: 1.2em;
zoom: 1;
}

.ext a:visited 
{
color: #0F6886;
text-decoration: none;
border-bottom: 1px dotted;
padding-right: 18px;
background: transparent url(../images/icon-ext.gif) no-repeat top right;
line-height: 1.2em;
zoom: 1;
}

.ext a:hover 
{ 
padding-right: 18px;
color: #FFF;
background: #86B3C2 url(../images/icon-exthover.gif) no-repeat top right;
line-height: 1.2em;
border-bottom: 1px solid #86B3C2;
zoom: 1;
}

/* pdf links with icon */											
.pdf a:link 
{
color: #0F6886;
text-decoration: none;
border-bottom: 1px dotted;
padding-right: 18px;
background: transparent url(../images/icon-pdf.gif) no-repeat top right;
line-height: 1.2em;
zoom: 1;
}

.pdf a:visited 
{
color: #0F6886;
text-decoration: none;
border-bottom: 1px dotted;
padding-right: 18px;
background: transparent url(../images/icon-pdf.gif) no-repeat top right;
line-height: 1.2em;
zoom: 1;
}

.pdf a:hover 
{ 
padding-right: 18px;
color: #FFF;
background: #86B3C2 url(../images/icon-pdf.gif) no-repeat top right;
line-height: 1.2em;
border-bottom: 1px solid #86B3C2;
zoom: 1;
}

/* pop-up links with icon */											
.pop a:link 
{
color: #0F6886;
text-decoration: none;
border-bottom: 1px dotted;
padding-right: 18px;
background: transparent url(../images/icon-popup.gif) no-repeat top right;
line-height: 1.2em;
zoom: 1;
}

.pop a:visited 
{
color: #0F6886;
text-decoration: none;
border-bottom: 1px dotted;
padding-right: 18px;
background: transparent url(../images/icon-popup.gif) no-repeat top right;
line-height: 1.2em;
zoom: 1;
}

.pop a:hover 
{ 
padding-right: 18px;
color: #FFF;
background: #86B3C2 url(../images/icon-popup.gif) no-repeat top right;
line-height: 1.2em;
border-bottom: 1px solid #86B3C2;
zoom: 1;
}

/* standard link */
.body a:link 
{
color: #0F6886;
text-decoration: none;
border-bottom: 1px dotted;
}

.body a:visited 
{
color: #0F6886;
text-decoration: none;
border-bottom: 1px dotted;
}

.body a:hover 
{
color: #FFF;
background: #86B3C2;
border-bottom: 1px solid #86B3C2;
}

/* information link */
.inf a:link 
{
font: 13px Arial, Helvetica, sans-serif;
color: #000;
text-decoration: none;
border-bottom: 1px dotted;
}

.inf a:visited 
{
color: #000;
text-decoration: none;
border-bottom: 1px dotted;
}

.inf a:hover 
{
color: #FFF;
background-color: #666;
border-bottom: 1px solid #666;
cursor: help;
}
 

					/* HEADERS  */

.homebannerbox 
{
margin: 0px auto;
padding: 0px;
width: 750px;
height: 195px;
background: #fff url(../images/home-header.jpg) no-repeat center;
}

.massagebannerbox 
{
margin: 0px auto;
padding: 0px;
width: 750px;
height: 195px;
background: #fff url(../images/massage-header.jpg) no-repeat center;
}

.aromatherapybannerbox 
{
margin: 0px auto;
padding: 0px;
width: 750px;
height: 195px;
background: #fff url(../images/aromatherapy-header.jpg) no-repeat center;
}

.bookingsbannerbox 
{
margin: 0px auto;
padding: 0px;
width: 750px;
height: 195px;
background: #fff url(../images/bookings-header.jpg) no-repeat center;
}

.newsbannerbox 
{
margin: 0px auto;
padding: 0px;
width: 750px;
height: 195px;
background: #fff url(../images/news-header.jpg) no-repeat center;
}

.workshopsbannerbox 
{
margin: 0px auto;
padding: 0px;
width: 750px;
height: 195px;
background: #fff url(../images/workshops-header.jpg) no-repeat center;
}

.contactbannerbox 
{
margin: 0px auto;
padding: 0px;
width: 750px;
height: 195px;
background: #fff url(../images/contact-header.jpg) no-repeat center;
}