/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
 * CSS and HTML Template by Dominic Winsor: www.wherefromhere.com, www.get2dom.com.
 * Project: (Headscape) Dedham Vale AONB & Stour Valley Project
 * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
 * If you're interested in the techniques used here, take a look at:
 *  - http://www.positioniseverything.net/articles/common.html - most of the common bugs covered here.
 *  - http://www.tantek.com/CSS/Examples/boxmodelhack.html - box model hack (bmh)
 *  - http://www.sam-i-am.com/work/sandbox/css/mac_ie5_hack.html - IE5-Mac hack (IE5-Mac)
 *  - http://www.positioniseverything.net/explorer/doubled-margin.html - IE Doubled Float-Margin Bug (IEFloat)
 *  - http://centricle.com/ref/css/filters/tests/star_html/ - StarHtml hack (IE only)
 *  - http://www.clagnut.com/blog/348/ - sizing text in 'em's
 *  - http://www.w3.org/QA/Tips/font-size - Why the big fonts?
 *  - http://www.alistapart.com - techniques for web development.
 *  - http://www.w3.org/ - for the standards.
 * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 *                                               - Dominic Winsor, www.get2dom.com
 */
 
 /* Note: IE incorrectly renders 'dotted' borders as 'dashed', where a dotted border
  *       is specified, a StarHtml hack rule is provided to force a gracefully compatible
  *       border (solid, gray)
 */
 
 
 
 
/* styles for specific areas are separated into distict files
*/
@import "dedham.home.css";

body {
	color: #000;
	background: white;
	margin: 0px;
	text-align: center;
	font-size: 68.9%; /* Default (medium) is 16px: scale to 11px */
	font-family: verdana, sans-serif;
}

p, div {
	font-family: inherit;
}
p {
	line-height: 1.5em;
}
td, th {
	vertical-align: top;
}

input, select, textarea {
	font: 1em/1em verdana, sans-serif;
}

h1, h2, h3, h4, h5 {
	margin: 0 0 0.25em 0;
}

h2 {
	font-size: 1.5em;
	color: #4D4786;
}

h3 {
	color: #9c005c;
	font-size: 1.3em;
}
h4 {
	font-size: 1em;
}
h5 {
	font-size: 1em;
	color: #4F628A;
}
p {
	/* paragraphs: space after, no space before */
	margin: 0 0 1em 0;
}

form {
	margin: 0;
}

a img {
	border: 0;
}

label.none {
	display: none;
}

a:link {  color: #1D1666; }
a:visited {  color: #4D4787; }
a:hover {  color: #4E6189; }
a:active {  color: #870150; }

abbr {
	cursor: help;
}



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
 * STRUCTURE 
 * Generic content & page/template structure definitions
 * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
 */
 
 
/* width constrain container
*/
#uberContainer {
	text-align: left;
	background: transparent;
	padding: 0;
	margin: 5px auto;
	width: 760px;
	border: none;
}


/* banner/ident strap
*/
#headerContainer {
	float: left;
	width: 100%;
	background: #FFF url('banner-bg.jpg') top right no-repeat;
	display: none;
}

img#ident {
	border: 0;
	float: left;
}




/* UL based primary navigation
*/
#navContainer {
	float: left;
	width: 760px;
	background: #1D1666;
	border-bottom: 1px solid #000;
	display: none;
}


/* common: footer
*/

#footerContainer {
	clear: both;
	background: #1D1666;
	border-top: 1px solid #000;
	padding: 5px 20px;
	display: none;
}



#hrefTop {
	color: #B3CBE6 !important;
	float: right;
	display: block;
	background: transparent url('arrow-up.gif') 100% 70% no-repeat;
	padding: 0 14px 0 0;
}













/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
* CONTENT
* Specific page elements
* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
*/


/* all non head|footer content.
*/
#content {
	background: none !important;
	float: left;
}


/* top content strip ---------------------------------------------------------
*/
	#subhomeStrip {
	background:none;
	float: left;
}

#subhomeStrip h2 {
	float: left;
	padding: 14px 0 10px 15px;
	width: 220px;
	display: inline;
	color: #FFF;
	font: bold italic 1.5em Arial, sans-serif;
}

/* different height for IE? */
	* html #subhomeStrip h2 {
	padding-bottom: 17px;
}

/* navigation tools strip: search, crumbs
*/
	#subhomeStrip #navUtility {
	float: left;
	width: 535px;
	display: none !important;
}


/* breadcrumbs
*/
	#crumbs {
	float: left;
	padding: 10px 0 0 18px;
	color: #FFF;
	width: 335px;
	text-align:left;
	
}




 

/* page content  ---------------------------------------------------------
*/

#pageContent {
	float: left;
	width: 535px;
	margin: 0;
	display: inline;
}

.contentLining {
	margin: 20px 10px 20px 10px;
	float: left;
	display: inline;
}


#pageContent.subhome {
	width: 518px;
	margin: 10px 0px 0 15px
}

#pageContent h3 {
	font-size: 1em;
	line-height: 1.6em;
	margin: 0 0 1em 0;
}
#pageContent p {
	line-height: 1.6em;
}

 
 
/* shortcutContainer override
* right cleared to ensure not inside space created by right floated #relatedNav
*/
#pageContent #shortcutContainer {
	margin: 2em 0 0 0;
	padding: 0 0 0 5px;
	clear: both;
	
	display: none;
}
 
 
 

/* page related nav - internal subsection links
*/
#relatedNav {
	float: right;
	width: 134px;
	margin: 0 0 0 15px;
	padding: 0 15px;
	display: inline;
	border-left: 1px #999999 dotted;
	
	display: none;
}


 
  
/* inline imagery
*/

img.inlineRight {
	border: 1px solid #4E6189;
	float: right;
	margin: 1em 0 1em 1em;
}

img.inlineLeft {
	border: 1px solid #4E6189;
	float: left;
	margin: 1em 1em 1em 0;
}
 
 

 
/* links to print/bookmark etc.
*/
#pageTools {
 	border-top: 1px dotted #888;
 	padding: 1em 0;
 	margin: 1em 0;
 	clear: both;
}
 
#pageTools a {
	color: #888;
	text-transform: lowercase;
	display: inline;
	float: left;
	margin: 0 2em 0 0;
	text-decoration: none;
}

#pageTools a:hover {
	text-decoration: underline;
}
 
 
 
/* LHS column ---------------------------------------------------------
*/
#columnSection {
	float: left;
	width: 224px;
	display: inline;
	border-right: 1px solid #000;
	background: #4E6189;
	display: none;
}


/* page title and background image 
*/
#pageTitle {
	width: 100%;
	height: 155px;
	float: left;
	display: inline;
	background: url('subhome/gate.jpg') top left no-repeat;
}

#pageTitle h1 {
	float: left;
	width: 204px;
	background: transparent;
	color: #FFF;
	padding: 8px 10px;
	font-size: 1.6em;
}

/* for MSIE... */
* html #pageTitle h1 {
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='furniture/titleshade1.png', sizingMethod='scale');
	padding: 10px;
}
/* for standards... */
#pageTitle>h1 {
	background: transparent url('titleshade1.png') top left repeat;
}
 
 
 
/* 'keep it special' box
*/
.sectionFeature {
	border: 1px black solid;
	margin: 15px 0;
	float: left;
	background: #6077A0 url('infobox-bg.jpg') top left repeat-x;
	width: 192px;
}

.sectionFeature p {
	padding: 1em 1em 0 1em;
	font-size: 0.8em;
	font-weight: bold;
	color: #FFF;
}

.sectionFeature h3 {
	font-size: 1em !important;
	color: #000 !important;
	font-weight: bold !important;
	padding: .5em 1em !important;
}


.sectionFeature2 {
	border: 1px black solid;
	margin: 15px 0;
	float: left;
	background: #6077A0 url('keepitspecial.gif') top left no-repeat;
	width: 192px;
	height: 110px;
}

.sectionFeature2 p {
	padding: 6.7em 1em 0 1em;
	font-size: 0.8em;
	font-weight: bold;
	color: #FFF;
}

.sectionFeature2 h3 {
	font-size: 1em !important;
	color: #000 !important;
	font-weight: bold !important;
	padding: .5em 1em !important;
}
 
 
 
 /* section navigation
*/
.sectionNav {
 	float: left;
 	display: inline;
 	margin: 14px;
	display: none;
 }
 



/* LHS column inline search form
*/
#txtQuery2 {
	border: 1px black solid;
	padding: 2px;
}

#btnSubmit2 {
	border: 1px black solid;
	background: #1D1666;
	color: #FFF;
	text-transform: uppercase;
	font-size: .8em;
	font-weight: bold;
	padding: 1px 2px;
}





 
/* Everything else ---------------------------------------------------------
 */




/* forms (not the inline mini ones)
*/

form.userForm {
	width: 100%;
	float: left;
}

fieldset {
	border: 0;
	margin: 0;
	padding: 0;
	border-top: 1px dotted #A9A9A9;
	width: 490px;
	background: #fff url('form/fieldbg.jpg') top right no-repeat;
}

.key {
	clear: both;
	width: 200px;
	text-align: right;
	float: left;
	margin: 3px 15px 0 0;
	display: inline;
	padding: 2px 0;
}
.value {
	padding: 2px 0;
	
}
.fullWidth {
	margin: 0 0 0 215px;
}

#frmSearch{display:none;}
form.userForm input, form.userForm textarea {
	width: 200px; 
}

/* checkboxes, radio etc should not be a fixed width */
form.userForm input.natural {
	width: auto;
}

fieldset.submit {
	background: #fff;
	padding: 1em 0 .5em 0;
}

fieldset.submit input {
	width: auto;
	padding: 2px !important;
	padding-right: 20px !important;
	display: inline;
	float: right;
	background: #fff url('form/submit-arrow.gif') 90% 50% no-repeat !important;
	color: #9c005c !important;
	border: 1px solid #e3e3e3 !important;
	text-transform: lowercase !important;
}

p.validationError {
 	border: 1px black solid;
 	margin: 15px 0;
 	background: #6077A0 url('infobox-bg.jpg') top left repeat-x;
	padding: 1em;
	color: #FFF;
}

div.validationError label {
	color: #6D8DB6;
	font-weight: bold;
}

div.validationError input, div.validationError textarea, div.validationError select {
	border: 1px solid #000;
	color: #FFF;
	background: #6077A0 url('infobox-bg.jpg') top left repeat-x;
}
div.validationError select {
	border: 1px solid #000;
	color: #FFF;
	background: #81A2CD;
}




/* events
*/

.listStrip, .listStripDownload {
	border: 0;
	border-top: 1px #bbb dotted;
	background: #fff url('form/fieldbg.jpg') top right no-repeat;
	float: left;
	width: 100%;
	padding: 1em 0 0 0;
}

.listStrip h4 {
	background: transparent url('icon-event.gif') 0% .25em no-repeat !important;
	padding-left: 15px;
}

.listStrip p, .listStrip table {
	padding-left: 15px;
	margin-bottom: 1em;
}

.listStrip table th {
	width: 140px;
	font-weight: normal;
}

.listStripDownload div.info {
	width: 80px;
	float: left;
	font-size: .8em;
	text-align: center;
}
.listStripDownload div.info a {
	color: #000;
	text-decoration: none;
}
.listStripDownload div.info a:hover {
	text-decoration: underline;
}
.listStripDownload div.summary {
	float: left;
	width: 420px;
}




/* pagination controls
*/

table.pagination {
	margin: 1em 0;
	float: left;
	width: 100%;
	border-top: 1px dotted #ccc;
	border-bottom: 1px dotted #ccc;
	padding: 5px 0;
}

table.pagination td a {
	width: auto;
	float: none;
	color: #9c005c;
	text-transform: lowercase;
	text-decoration: none;
	
}
table.pagination td {
	white-space: nowrap;
}
table.pagination td.pages {
	text-align: center;
	width: 100%;
}

table.pagination td.next {
	text-align: right;
}

td.back img, td.next img {
	vertical-align: bottom;
	padding-bottom: 1px;
}





/* image gallery
*/

.imageStrip {
	float: left;
	width: 505px;
	border-top: 1px dotted #ccc;
	padding: 10px 0 0 0;
}

div.image {
	float: left;
	margin: 0 4px 0 0;
	display: inline;
}

div.image img {
	border: 1px solid #ccc;
}

div.image p strong {
	color: #4F628A;
}

div.image p {
	margin: 0 5px 5px 0px;
}


.imagePreview {
	clear: both;
	float: left;
}
.imagePreviewTop {
	width: 515px;
	height: 4px;
	background: transparent url('gallery/shadow-top.gif') top left no-repeat;
	font-size: 1px;
	float: left;
}

.imagePreviewBase {
	width: 515px;
	height: 4px;
	font-size: 1px;
	background: transparent url('gallery/shadow-base.gif') top left no-repeat;
	float: left;
}

.imagePreviewMid {
	width: 505px;
	padding: 0 5px;
	background: transparent url('gallery/shadow-sides.gif') top left repeat-y;
	float: left;
	display: inline;
}
.imagePreviewMid img {
	float: left;
}

/* correct for ie5.5 (ie6 is ok with this) */
* html .imagePreviewMid {
	width: 515px;
	padding: 0;
}
/* correct for ie5.5 (ie6 is ok with this) */
* html .imagePreviewMid img {
	position: relative;
	left: 5px;
}







/* members control strip
*/

#memberControls {
	background: #fff url('form/fieldbg.jpg') top right no-repeat;
	padding: 7px 15px;
	float: left;
	width: 505px;
	color: #888;
	font-size: 0.85em;
}

#memberControls a {
	color: #888;
	font-weight: bold;
}





/* sitemap
*/

/* section navigation
*/
 
ul.sitemap {
  	margin: 0 0 0 -40px;
  	padding: 0;
  	float: left;
  	width: 515px;
}
ul.sitemap li {
  	float: left; 	
  	list-style: none;
  	margin: 0;
}
ul.sitemap a {
 	color: #FFF;
  	width: 493px; 	
  	background: #E07735 url('icon-sitemap-1.gif') 5px 60% no-repeat;
  	padding: 5px 0 5px 22px;
  	border-bottom: 1px solid #FFF;
  	text-decoration: none;
  	white-space: nowrap;
	/* IE5-Mac.start  \*/
  	display: block;
	/* IE5-Mac.end */
}
/* IE5-Mac.start  \*/
ul.sitemap a {float:none;}
/* IE5-Mac.end */



/* indent: 1 */
ul.sitemap li ul {
	margin: 0;
	padding: 0;
}
ul.sitemap li ul li a {
 	color: #000;
  	background: #95B2EA url('icon-sitemap-2.gif') 21px 60% no-repeat;
  	padding: 5px 0 5px 40px;
  	border-bottom: 1px solid #FFF;
  	text-decoration: none;
  	white-space: nowrap;
	/* IE5-Mac.start  \*/
  	display: block;
	/* IE5-Mac.end */
	
	/* tan-hack */
	width: 493px; widt\h: 475px;
}


/* indent: 2 */
ul.sitemap li ul li ul {
	margin: 0;
	padding: 0;
}
ul.sitemap li ul li ul li a {
 	color: #000;
	background: #E7EDF9 url('icon-sitemap-3.gif') 51px 60% no-repeat;
  	padding: 5px 0 5px 70px;
  	border-bottom: 1px solid #FFF;
  	text-decoration: none;
  	white-space: nowrap;
	/* IE5-Mac.start  \*/
  	display: block;
	/* IE5-Mac.end */
	
	/* tan-hack */
	width: 493px; widt\h: 445px;
}
ul.sitemap a:hover {
	text-decoration: underline;
}


p.eventMonths {
	margin: 1em 0;
	
}