

.hide {
	text-indent: -9999px;
}
/* Use this trick to make elements invisible in CSS-enabled browsers. The element will be visible to users of text browsers, screen readers, etc. The number is randomly chosen as one considered big enough to always keep the object hidden off the screen. */

img {
	border: 0;
	display: block;
	padding-top: 10px;
}
/* Use this trick to make all images render as block-level elements rather than inline elements. Because block-level elements exist in their own box and are followed by a carriage return. Also declare all image borders as 0 here so we don't have to add the code into all image tags. */
.inline {display: inline;}
/* Use this trick for images that we DO want to display inline */

html{
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-weight: 500;
	background: #fff url(../images/background_grey-fade.jpg) top right repeat-y;
	text-align: center;
}
/* Restating stuff for html as stated in body: an IE 6.0 fix from xml.com. */
/* Text align left: IE6 Windows bug fix. */

/* Coding short forms: Always clockwise starting at the top: top, right, bottom, left. But, if vertical and horizontal margins are the same, you can group them: top-bottom then left-right. */

body{
	font-size: 80%;
	font-family: "Trebuchet MS", Tahoma, Arial, Helvetica, sans-serif;
	font-weight: 500;
	text-align: center;
}
/* Font choices: Tahoma because it was created for online use. Arial for old Windows systems. Helvetica for old Unix systems. Multi-name fonts must be enclosed in quotations. */

p, td, ul, ol, li, a {
	font-family: "Trebuchet MS", Tahoma, Arial, Helvetica, sans-serif;
	color: #333;
}
/* Be kind to Netscape 4: Old browsers fail to understand inheritance so we must be more specific for them. */

#wrapper {
	margin:auto;
	width:970px;
	text-align: center;
}
#container{
	background: transparent;
	padding: 0;
	text-align: left;
}
#top {
	background: transparent;
	padding: 0;
	text-align: left;
	width: 100%;
}
#logo {
	float: left;
	background: #fff url(../images/logo.jpg) top center no-repeat;
	width: 415px;
	margin-bottom: 5px;
}

#middle  {
	position : relative;
	clear:both;
	overflow: hidden;
	background: #fff;
	border: #999 5px solid;
	padding-bottom: 30px;
}

#content_full {
	background: transparent;
	width : 100%;
	padding: 40px;
	padding-bottom: 200px;
	min-height:350px;
	vertical-align:text-top;
}

#content_left {
	float:left;
	background: transparent;
	width: 418px;	
	padding: 30px;
}

#content_right {
	float: right;
	background: transparent;
	width: 418px;
	padding: 30px;
	vertical-align:text-top;	
}

#navigation{
	position: absolute;
	top: 0;
	right: 0;
	margin: 8px;
	width: 100px;
}
#navigation_footer {
	position: absolute;
	width: 100%;
	bottom: 0;
	left: 0;
	background: transparent;	
}

#footer {
	position : relative;
	clear:both;
	background: #fff;
	color: #666;
	text-align: center;
	font-weight: normal;
	font-size: 85%;
	margin: 5px 0;
}

h1 {
	text-indent: -9999px;
	overflow: hidden;
	margin: 0;
	padding: 0;
	border: 0;
} /* The Phark trick - Displays a text version of the company name offscreen for text readers. Visual browsers see the logo instead. */

h1 a:link, h1 a:visited	{
	display: block;	
	width: 415px;
	height: 75px;
	background: url(../images/logo.jpg) top center no-repeat;
	}

h2, h3, h4, h5, h2 a:link {
	color: #404040;
}

a { text-decoration: underline; }
a:link { color: #333; }
a:visited { color: #666; }
a:hover { color: #069; }
a:active { color: #069; }
/* Must use this order LVHA: Link, Visited, Hover, Active. Or some browsers will ignore one or another of them. */

#navigation_footer a, #navigation_footer li { 
	list-style: none;
	display: inline;	
	padding: 0 10px;
	color: #666;
	text-decoration: none;
	text-transform:uppercase;
}

#nav_highlight p, #nav_highlight p a, #nav_highlight p a:link {
	color: #666;
	text-align:center;
	text-decoration:none;
	font-size: 130%;
	padding: 15px;
}

#navigation_footer a:hover, #slogan a:hover, #footer a:hover, #nav_highlight p a:hover {
	color: #069;
}

#slogan p, #slogan a {
	color: #666;
	font-size: 110%;
	font-weight: normal;
	text-align:center;	
	text-decoration:none;
}

#footer a {
	color: #666;
	text-decoration:none;
}


#content_full h2, #content_full h3, #content_full p, #content_full ul li  {
	width: 270px;
	margin-left: 420px;
}

ol li, ul li {
	padding-bottom: .75em;
	vertical-align:text-top;
}

ol.condensed li, ul.condensed li {
	padding-bottom: 0;
}

li.indent {
	margin-left: 15px;
}	

em { color:#036;}

#content_right p.passagetext {
	font-size: 115%;
}
#content_right p.author {
	font-size: 115%;
	color:#966;
}

#content_left p.quotation, #content_right p.quotation {
	font-size: 110%;
	color:#036;	
	padding: 20px 50px;
	font-style:italic;
}

#content_left p.testimonial, #content_right p.testimonial {
	font-size: 110%;
	color: #069;
	padding: 20px 50px;
	font-style: italic;
}
#content_left p.testimonial span.testimonial_signature, #content_right p.testimonial span.testimonial_signature {
	font-style: normal;
}
#content_left p.address {
	font-size: 110%;
	padding: 0 0 40px 100px;
}
#content_right p.note, #content_right span.note {
	font-size: 90%;
}

.top {
	font-size: 85%;
	text-align:right;
}

p.album {
	text-align:center;
}
div.media-credits {
	border: #069 1px solid;
	background:#fff;
	width:300px;
	text-align:center;
	padding: 20px;
	margin: 40px;
	clear:both;
	overflow:hidden;
}

div.media-credits h3 {
	color: #069;
}
#content_left div.media {
	width:300px;	
	clear:both;
	overflow:hidden;
	text-align:center;
}
#content_left div.media_left {
	float:left;
	width:150px;
	padding-bottom:20px;
}
#content_left div.media_right {
	float:right;
	width:150px;
	vertical-align:text-top;
}
p.media img {
	align: center:
	vertical-align:middle;
	display:inline;
}
#content_right div.media {
	width:370px;	
	clear:both;
	overflow:hidden;
}
#content_right div.media_left {
	float:left;
	width:110px;
	padding-bottom:20px;
}
#content_right div.media_right {
	float:right;
	width:245px;
	vertical-align:text-top;
}

img.bordered {
	border: #666 3px solid;
	display: block;
	padding-top: 0;
}



table {
	width:100%;
}
table tr td {
	font-size: 90%;
	vertical-align:top;
	padding:4px;
}
table tr.heading td {
	font-weight:bold;
	font-size: 100%;
	color:#336;
}
table tr td.section {
	font-weight:bold;
	color: #666;
	font-size: 100%;
	background: url(../images/background_fade-table.jpg) top left repeat-x;
}
table tr.heading td a, table tr.heading td a:visited {
	color:#026992;
}
table tr.heading td a:hover {
	color:#6cf;
}
table tr td.title {
	font-size: 100%;
	width: 300px;
}


table.form tr td, table.admin tr td {
	font-size: 100%;
	vertical-align:top;
	padding:4px;
}
table.form tr td.heading, p.heading, table.admin tr td.heading, p.heading {
	color:#069;
	text-align:left;
}





/* ================================================================ 
This copyright notice must be untouched at all times.
 
The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/snowstorm.html
Copyright (c) 2005-2010 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
 
/* default styling */
.nav,
.nav ul {list-style-type:none; margin:0; padding:0; float:left;}
.nav ul li {padding-bottom: 0;}
.nav a {text-decoration:none;}
.nav {margin-bottom:-1px;}
.nav span.services {text-transform:uppercase;}

/* style the links */
.nav a {float:left; background:#FBEDEC; color:#333; text-align:left; line-height:16px; padding:4px 0; border:1px solid #999; margin-bottom:-1px;}
.nav a.sub-a {background:#FBEDEC;text-transform:uppercase;text-align:center;font-weight:bold;color:#666;}
 
.nav a:hover,
.nav a:focus,
.nav a:active {outline:0; color:#fff; background:#DECECE;}
 
/* this is for the path highlight in all browsers except IE6 and lower */
.nav li:hover > a {color:#fff; background:#DECECE;} 
 
/* WIDTH change this WITH CARE to suit your requirements */
.nav {width:90px; margin-right:-1px;}
.nav a {width:88px; margin-right:-89px;padding-left:5px;padding-right:5px;} /* take into account the borders when calculating the link width, margin-right = total link width - 1px */
.nav ul li {max-width:90px;} /* fix for IE8 */
 
/* DO NOT CHANGE ANYTHING BELOW THIS LINE */
/* ---------------------------------------------------------------------------- */
.nav ul {position:relative; margin-bottom:-10000px;} 
.nav ul li {float:left; clear:left;}
.nav a {position:relative;}
.sub-li {margin-top:-10000px;}
.sub-a {margin-top:10000px;}
 
/* The bit that does ALL the work to bring the sub-limenus into view */
.sub-li a:hover,
.sub-li a:focus,
.sub-li a:active {margin-right:0;}
 
/* OPERA fix */
.nav ul:hover {clear:left;}
 
/*IE5-7 fixes*/
.nav .sub-li {width:100%;}
a:active {}
/* ---------------------------------------------------------------------------- */

/* ================================================================ 
END DROPDOWN MENU
=================================================================== */