/* 
colours:
cool grey 10 - #6d6f72
green - 693
brown - 8622C = #5a4839 
teal - 669999 (link)
purple - 666999 visited)
light brown bg - f2f2e5
cool grey 1 - e2e1dd
cool grey 2 - d6d6d4

Last Updated: 2008-11-10 by Jason Moore

*/

body { background: #e2e1dd; font-family: arial,helvetica,sans-serif; font-size: 11.5px; padding: 0; margin: 0; 
  line-height: 1.4em; color: #5a4839; }

/* LEFT */
#mainnav { position: absolute; left: 0; top: 0; width: 141px; height: 100%; background: #d6e2cb url(home-left-141.gif) 0 0 no-repeat; }
#subnav { position: absolute; right: 0px; top: 0; width: 141px; height: 100%; background: #d6e2cb url(home-right-141.gif) 0 0 no-repeat; }

#container { position: relative; width: 1000px; height: 562px; background-color: #f2f2e5; margin: 10px auto; }

#balance #mainnav { background: #d6e2cb url(balance-left-141.gif) 0 0 repeat-y; }
#balance #subnav { background: #d6e2cb url(balance-right-141.gif) 0 0 repeat-y; }

#tradition #mainnav { background: #d6e2cb url(tradition-left-141.gif) 0 0 no-repeat; }
#tradition #subnav { background: #d6e2cb url(tradition-right-141.gif) 0 0 no-repeat; }

#people #mainnav { background: #d6e2cb url(people-left-141.gif) 0 0 no-repeat; }
#people #subnav { background: #d6e2cb url(people-right-141.gif) 0 0 no-repeat; }

#centre #mainnav { background: #d6e2cb url(centre-left-141.gif) 0 0 no-repeat; }
#centre #subnav { background: #d6e2cb url(centre-right-141.gif) 0 0 no-repeat; }

#services #mainnav { background: #d6e2cb url(services-left-141.gif) 0 0 no-repeat; }
#services #subnav { background: #d6e2cb url(services-right-141.gif) 0 0 no-repeat; }

#classes #mainnav, #reading #mainnav, #media #mainnav, #contact #mainnav { 
  background: #d6e2cb url(other-left-141.gif) 0 0 repeat-y; }
#classes #subnav, #reading #subnav, #media #subnav, #contact #subnav { 
  background: #d6e2cb url(other-right-141.gif) 0 0 repeat-y; }

#events #mainnav { background: #d6e2cb url(other-long-left-141.gif) 0 0 no-repeat; }  
#events #subnav { background: #d6e2cb url(other-long-right-141.gif) 0 0 no-repeat; }  

#reading #mainnav { background: #d6e2cb url(other-long-left-141.gif) 0 0 no-repeat; }  
#reading #subnav { background: #d6e2cb url(other-long-right-141.gif) 0 0 no-repeat; }  

#faq #mainnav { background: #d6e2cb url(other-long-left-141.gif) 0 0 no-repeat; }  
#faq #subnav { background: #d6e2cb url(other-long-right-141.gif) 0 0 no-repeat; }  


#content { width: 650px; margin: 0 auto; }

div.single { width: 310px; margin: 0 auto; } /* media */

p.centre, div.centre { text-align: center; }
p.close { margin: 0 0 0 0; }

a:link { color: #875f7f; }
a:visited { color: #a8789e; }
a:hover { color: #616265; }

h3 { text-transform: uppercase; font-weight: bold; color: #693; font-size: 11px; /*margin-right: 3px;*/ } /* book titles */
h2.title, h3.title { font-style: italic; margin-bottom: 0;} /* book titles */
h2.inline, h3.inline, p.inline { display: inline; margin-right: 3px; }
h3.people { cursor: pointer; } /* click on names to see bio */
div.newsitem h3 { margin-bottom: 0; }
h3.date { margin: 0; }
h3.event { font-style: italic; margin: 0; }
h3.event a { text-decoration: none; color: #693; }
div.event h4 { margin-bottom: 0; }
div.event p { margin-top: 0; }
p.title { font-style: italic; }
p.author { margin-top: 0; }
blockquote { padding: 0; margin: 0; font-style: italic; }

p.wordmark { text-align: center; margin: 0; padding-top: 30px; }

h1.area { width: 450px; height: 67px; overflow: hidden; text-indent: -999em; margin: 32px auto 0 auto; }
h1.balance { background: url(balance.png) top left; }
h1.tradition { background: url(tradition.png) top left; }
h1.people { background: url(people.png) top left; }
h1.faq { background: url(faq.png) top left; }
h1.centre { background: url(centre.png) top left; }
h1.services { background: url(services.png) top left; }
h1.classes { background: url(classes.png) top left; }
h1.events { background: url(events.png) top left; }
h1.reading { background: url(reading.png) top left; }
h1.media { background: url(media.png) top left; }
h1.contact { background: url(contact.png) top left; }
h1.abetterway { background: url(a-better-way.png) top left; }
h1.news { background: url(news.png) top left; }

/* line needs to be in a container to be centred */
div.linecontainer { text-align: center; margin: -10px 0 4px 0; }
div.line { margin: 0 auto; width: 1px; height: 49px; border-left: solid 1px #693; }
p.line { margin: 6px 0 8px 0; }

/* vertical line */
div.vline { height: 100%; float: left; width: 1px; border-left: solid 1px #3c8e38; }

div#west, div#east { width: 250px; float: left; } /* obs? */
div#east { /*border-left: solid 1px #3c8e38;*/ margin-left: 10px; }  /* obs? */

/* table for east/west text - allows line in the middle to grow with text - a div can't do this */
table.content { border-collapse: collapse; margin: 0 auto; }
td.east, td.west { width: 292px; vertical-align: top; }
td.east { padding: 0 0 0 17px; }
td.west { padding: 0 18px 0 0; }
td.single { padding: 0; margin: 0; }
/* td.line { border-left: solid 1px #3c8e38; zoom: 1} */ /* no show on IE6/7 */
td.line { width: 1px; padding: 0; background-color: #693; zoom: 1}
/*td.west p, td.east p { margin-top: 2px; }*/ /* dangerous to define p */
/* td.single p.first  - was margin-top 2px, why? */
td.single { width: 310px; }
p.first, h3.first { margin-top: 0; }
p.last { margin-bottom: 0; }


div.menu { }
#mainnav div.menu div { margin-bottom: 42px; }
#mainnav div.menu { position: absolute; top: 163px; left: 45px; }

a.menu { display: block; text-indent: -999em; overflow: hidden; width: 90px; height: 14px; background-image: url(menu.png); 
  /* filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='menu.png', sizingMethod='crop'); */ /* IE6 */
  outline: none;
  }

a.home { background-position: -131px -12px; }
a.home:hover { background-position: -261px -12px; }
div.on a.home { background-position: -1px -12px; }

a.balance { background-position: -131px -48px; }
a.balance:hover { background-position: -261px -48px; }
div.on a.balance { background-position: -1px -48px; }

a.tradition { background-position: -131px -84px; }
a.tradition:hover { background-position: -261px -84px; }
div.on a.tradition { background-position: -1px -84px; }

a.people { background-position: -131px -120px; }
a.people:hover { background-position: -261px -120px; }
div.on a.people { background-position: -1px -120px; }

a.centre { background-position: -131px -156px; }
a.centre:hover { background-position: -261px -156px; }
div.on a.centre { background-position: -1px -156px; }

a.services { background-position: -131px -192px; }
a.services:hover { background-position: -261px -192px; }
div.on a.services { background-position: -1px -192px; }


#subnav div.menu div { margin-bottom: 8px; }
#subnav div.menu { position: absolute; top: 163px; left: 5px; }

a.faq { background-position: -131px -234px; }
a.faq:hover { background-position: -261px -234px; }
div.on a.faq { background-position: -1px -234px; }

a.classes { background-position: -131px -258px; }
a.classes:hover { background-position: -261px -258px; }
div.on a.classes { background-position: -1px -258px; }

a.events { background-position: -131px -283px; }
a.events:hover { background-position: -261px -283px; }
div.on a.events { background-position: -1px -283px; }

a.reading { background-position: -131px -306px; }
a.reading:hover { background-position: -261px -306px; }
div.on a.reading { background-position: -1px -306px; }

a.media { background-position: -131px -331px; }
a.media:hover { background-position: -261px -331px; }
div.on a.media { background-position: -1px -331px; }

a.contact { background-position: -131px -355px; }
a.contact:hover { background-position: -261px -355px; }
div.on a.contact { background-position: -1px -355px; }

h3.question { display: inline; text-transform: uppercase; font-size: 11px; font-weight: bold; color: #693; }
p.answer { display: inline; }

div.pad { margin-top: 2px; } /* thin pad */
div.pad2 { margin-top: 6px; } /* thicker pad */
.clear { clear: both; }
.floatl { float: left; }
p.label { margin: 5px 0 5px 0; } /* form label */

/* FAQ */
#faq #container { height: 590px; }

/* READING, EVENTS, CLASSES - longer */
#reading #container { height: 1600px; }
#events #container, #classes #container { height: auto !important; height: 590px; min-height: 590px; } /* note: IE6 needs duplicate height */
#events ul { padding-left: 32px; margin-top: 6px; }
div.event, div.class { margin-bottom: 24px; }


/* HOME */
#news { position: absolute; top: 10px; left: 0; width: 100%; text-align: center; }
#news div.newsitem { margin: 0 auto; }

p.w1, h3.w1 { width: 50px; }
p.w2, h3.w2 { width: 100px; }
p.w3, h3.w3 { width: 150px; }

p.tight, h3.tight { margin: 0; }
p.mid, h3.mid { margin-top: 9px; margin-bottom: 0; }
p.oomph { font-size: 12px; font-weight: bold; }

a.nav { text-decoration: none; font-style: italic; } /* navigation links */
a.moreinfo { font-weight: bold; }
.hide { display: none; }
span.lower { text-transform: lowercase; }

#securearea_login_form { margin: 0 auto; width: 262px; }