body {text-align: center; background-color: #643e3e; margin: 0; padding: 0; font-family: Verdana, Myriad, Sans-Serif}
#container {background-color: #483434; margin: 0 auto; width: 759px; padding: 0 9px 9px 9px; text-align: left;}
#content {background: #e6e2d7 url(../img/parchment.jpg) repeat top left; margin: 9px 0; padding: 20px 20px 10px 20px; position: relative;}


h1 {margin: 0; float: left;}
h1 a img {border: none;}
h2 {color: #4f661c; margin: 0 0 10px 0; font-size: 12pt; font-weight: bold; text-align: center;}
h3 {margin: 15px 0 10px 0; color: #5d3f3f; font-size: 11pt; font-weight: bold;}
.l {text-align: left;}
.c {text-align: center;}
.clear {clear: both; height: 1px; overflow: hidden; margin: 0;}

p {font-size: 10pt; color: #4a3a3a; margin: 10px 0; text-align: justify;}
ul {font-size: 10pt; color: #4a3a3a; margin-top: 10px; margin-bottom: 10px;}
a {color: #4a3a3a; text-decoration: underline;}
a:hover {color: #8f4747;}
a img {border: 2px solid #4a3a3a;}

ul#topmenu {list-style: none; text-align: right; font-size: 9pt; margin: 0; padding-top: 25px;}
ul#topmenu li {display: inline; margin-left: 20px;}
ul#topmenu a {color: #c9bba9; text-decoration: none; font-weight: bold;}
ul#topmenu a:hover {color: #dbd1c5;}

#headerimg {width: 759px; height: 111px; margin-bottom: 9px;}

.quotes {float: right; background-color: #bbceaf; border: 1px solid #4c6127; width: 180px; margin: 0 0 20px 20px; padding: 10px 10px 0px 10px; position: relative;}
.quotes p {text-align: left; color: #2c3816; margin: 0 0 10px 0}

/* MAIN ROLLOVER MENU */
#mainmenu {width: 759px; height: 29px; background-color: #684848; margin: 0; padding: 0; position: relative;}
#mainmenu li {margin: 0; padding: 0; list-style: none; display: block; position: absolute;}
#mainmenu a {display: block; text-indent: -9999px; text-decoration: none; overflow: hidden;}

#explore {left: 10px; top: 0px; width: 195px; height: 29px; background: url(../img/explore-tudor-hackney.gif) top left no-repeat;}
#compare {left: 238px; top: 0px; width: 184px; height: 29px; background: url(../img/hackney-then-and-now.gif) top left no-repeat;}
#about {left: 456px; top: 0px; width: 182px; height: 29px; background: url(../img/about-tudor-hackney.gif) top left no-repeat;}
#gallery {left: 672px; top: 0px; width: 77px; height: 29px; background: url(../img/gallery.gif) top left no-repeat;}

#explore a, #compare a, #about a, #gallery a {height: 29px;}
#explore a {background: url(../img/explore-tudor-hackney.gif) top left no-repeat;}
#compare a {background: url(../img/hackney-then-and-now.gif) top left no-repeat;}
#about a {background: url(../img/about-tudor-hackney.gif) top left no-repeat;}
#gallery a {background: url(../img/gallery.gif) top left no-repeat;}

#explore a:hover {background: url(../img/explore-tudor-hackney.gif) bottom left no-repeat;}
#compare a:hover {background: url(../img/hackney-then-and-now.gif) bottom left no-repeat;}
#about a:hover {background: url(../img/about-tudor-hackney.gif) bottom left no-repeat;}
#gallery a:hover {background: url(../img/gallery.gif) bottom left no-repeat;}

/* FOOTER */
p#copyright {color: #a28282; background-color: #684848; line-height: 29px; margin: 0; text-align: center;}
p#copyright a {color: #a28282; text-decoration: none;}
p#copyright a:hover {text-decoration: underline;}

/*FORM */
form#contact {border: 1px solid #643e3e; padding-bottom: 10px;}
.labelfloat {width: 150px; float: left; text-align: right; padding-right: 10px;}
.button {margin-left: 160px;}

/* GALLERY */
.fourbox {float: left; width: 175px; height: 185px; margin: 5px 0; text-align: center;}
.threebox {float: left; width: 235px; height: 135px; margin: 5px 0; text-align: center;}
.photobox {float: left; width: 175px; height: 120px; margin: 5px 0; text-align: center;}
.photobox p, .threebox p, .fourbox p {margin: 0; text-align: center; font-size: 8pt;}
.fourbox img, .threebox img, .photobox img {border: 1px solid #8f4747;}
.gallerylinkbox {width: 33%; float: left; text-align: center;}
.gallerylinkbox p {text-align: center; margin: 0;}
.report {border-top: 1px solid #b2ac9c; padding: 10px 0; clear: both;}
.report .sidebar {float: right; width: 80px; margin: 0 0 5px 20px; text-align: center; position: relative;}
.report .sidebar p {margin-bottom: 0; font-weight: bold; text-align: center;}
.report .sidebar img {margin: 5px 0;}


/* EXPLORE */
#explorearea {height: 474px; width: 719px;}
#explorearea img {border: none; position: absolute;}
#explorearea p {margin: 0;}

#explorearea a {position: absolute; text-decoration: none; display: block; cursor: pointer; background: transparent url(../img/blank.gif) repeat 0 0; color: #4a3a3a;}
#explorearea a strong {color: #7e160a;}
#explorearea a span {display: none;}
#explorearea a:hover span {display: block; background: #e6e2d7 url(../img/parchment.jpg) repeat top left; border: 1px solid #7e160a; padding: 5px; font-size: 10pt; text-decoration: none; cursor: pointer;}

a#brookehouse {width: 42px; height: 42px; margin: 0px 0 0 475px;}
a#brookehouse:hover span {margin: 10px 0 0 10px; width: 200px; height: auto;}

a#brykplace {width: 42px; height: 42px; margin: 387px 0 0 598px;}
a#brykplace:hover span {margin: 10px 0 0 10px; width: 100px; height: auto;}

a#heronshouse {width: 42px; height: 42px; margin: 270px 0 0 14px;}
a#heronshouse:hover span {margin: 10px 0 0 10px; width: 100px; height: auto;}

a#church {width: 34px; height: 34px; margin: 397px 0 0 517px;}
a#church:hover span {margin: 10px 0 0 10px; width: 150px; height: auto;}

a#cicelyackland {width: 23px; height: 23px; margin: 47px 0 0 460px;}
a#cicelyackland:hover span {margin: 10px 0 0 10px; width: 100px; height: auto;}

a#maudaldridge {width: 23px; height: 23px; margin: 175px 0 0 142px;}
a#maudaldridge:hover span {margin: 10px 0 0 10px; width: 110px; height: auto;}

a#ursulaboll {width: 23px; height: 23px; margin: 170px 0 0 587px;}
a#ursulaboll:hover span {margin: 10px 0 0 10px; width: 100px; height: auto;}

a#sucresetownshend {width: 23px; height: 23px; margin: 406px 0 0 558px;}
a#sucresetownshend:hover span {margin: -10px 0 0 10px; width: 140px; height: auto;}

a#dyanasweete {width: 23px; height: 23px; margin: 413px 0 0 484px;}
a#dyanasweete:hover span {margin: -20px 0 0 -120px; width: 120px; height: auto;}

a#ceciliagoodgrome {width: 23px; height: 23px; margin: 236px 0 0 76px;}
a#ceciliagoodgrome:hover span {margin: 10px 0 0 10px; width: 100px; height: auto;}

a#richardashebye {width: 23px; height: 23px; margin: 238px 0 0 149px;}
a#richardashebye:hover span {margin: 10px 0 0 10px; width: 120px; height: auto;}

a#williambabthorpe {width: 23px; height: 23px; margin: 359px 0 0 148px;}
a#williambabthorpe:hover span {margin: 10px 0 0 10px; width: 130px; height: auto;}

a#hipolitecatcher {width: 23px; height: 23px; margin: 414px 0 0 181px;}
a#hipolitecatcher:hover span {margin: -20px 0 0 10px; width: 120px; height: auto;}

a#humphreydenham {width: 23px; height: 23px; margin: 199px 0 0 529px;}
a#humphreydenham:hover span {margin: 10px 0 0 10px; width: 120px; height: auto;}

a#abrahamjohnson {width: 23px; height: 23px; margin: 350px 0 0 521px;}
a#abrahamjohnson:hover span {margin: 10px 0 0 10px; width: 120px; height: auto;}

a#thomaselliot {width: 23px; height: 23px; margin: 359px 0 0 662px;}
a#thomaselliot:hover span {margin: -65px 0 0 -100px; width: 100px; height: auto;}

.profile {list-style: none; margin: 0; padding: 0;}


/* FRONT TEASERS */
.sidebar { float: right; position: relative; width: 186px; margin: 0 0 7px 15px;}
.teaser {background-color: #bdd0ab; border: 1px solid #475e1a; padding: 5px 0; margin: 0 0 10px 0; text-align: center;}
.teaser h2 {margin: 0 0 2px 0; font-size: 10pt; font-weight: bold;}
.teaser h2 a {text-decoration: none;}
.teaser h2 a:hover {text-decoration: underline;}
.teaser a img {border: 1px solid #475e1a;}
.teaser p {margin: 2px 10px 0 10px; font-size: 9pt;}
.teaser p a {text-decoration: none;}
.teaser p a:hover {text-decoration: underline;}