/* Basic layout:

6 cols, 90px wide, gutters and margins 50px

1=90
2=230
3=370
4=510
5=650
6=790

*/

* {
	margin: 0;
	padding: 0;
}

html {
	background-color: #FFF;
	color: #444;
}

body {
	font-family: 'lucida grande', 'lucida sans unicode', verdana, 'garuda', sans-serif;
	font-size: 100%;
	line-height: 22px;
	background-color: #EFEEE0;
}

#page {
	width: 790px;
	margin: 0 auto;
	padding: 21px 25px;
	background-color: #FFF;
}

/* basic typography */

p, ul, ol, dd {
	font-size: 14px;
	margin-bottom: 11px;
}

dd {
	font-style: italic;
}

h1 {
	font-family: 'times new roman', palatino, georgia, serif;
	font-size: 44px;
	line-height: 44px;
	font-weight: normal;
	margin-bottom: 11px;
}

h1 a:link, h1 a:visited, h1 a:hover {
	color: #FFF;
	text-decoration: none;
	border-bottom: none;
	font-weight: normal;
}

h1 a:hover {
	color: #BF0000;
}

h1 a span {
	color: #BF0000;
}

h2, h3, h4, h5, h6, dt {
	font-family: georgia, norasi, palatino, serif;
	font-weight: normal;
	margin-bottom: 11px;
	color: #BF0000;
}

dt {
	margin-bottom: 0;
	color: #444;
}

h2 {
	font-size: 21px;
}

h3 {
	font-size: 18px;
}

h4, dt {
	font-size: 16px;
}

h5, h6, dd {
	font-size: 14px;
}

.accessibility {
	display: none;
}

.amp {
	font-family: baskerville, garamond, palatino, times, georgia, serif;
	font-style: italic;
}

/* links */

a:link {
	text-decoration: none;
	border-bottom: 2px solid #888;
	color: #444;
	font-weight: bold;
}

a:visited {
	color: #888;
	text-decoration: none;
	border-bottom: 2px solid #888;
	font-weight: bold;
}

a:hover {
	color: #BF0000;
	text-decoration: none;
	border-bottom: 2px solid #888;
	font-weight: bold;
}

#lead a:link, #lead a:visited, #lead a:hover {
	font-weight: normal;
	border-bottom: 1px solid #888;
}

a img {
	border: none;
}

a.image_link {
	text-decoration: none;
	border: none;
	color: #FFF;
}

#main_pic_cap a:link, #main_pic_cap a:visited {
	color: #FFF;
	border-bottom: 2px solid #FFF;
}

#main_pic_cap a:hover {
	color: #FFF;
	border-bottom: 2px solid #BF0000;
} 

.run {
	text-transform: lowercase;
	font-variant: small-caps;
}

/* iconography */

.twitter {
	padding-left: 22px;
	background-image: url('icons/twitter.png');
	background-repeat: no-repeat;
	background-position: center left;
}

.print {
	padding-left: 22px;
	background-image: url('icons/printer.png');
	background-repeat: no-repeat;
	background-position: center left;
	_padding-left: 0;
	*padding-left: 0;
	_background-image: none;
	*background-image: none;
}

.phone {
	padding-left: 22px;
	background-image: url('icons/phone.png');
	background-repeat: no-repeat;
	background-position: center left;
	font-size: 14px;
	_padding-left: 0;
	*padding-left: 0;
	_background-image: none;
	*background-image: none;
}

.phone a:link, .phone a:visited, .phone a:hover {
	font-weight: normal;
	border-bottom: none;
	color: #BF0000;
}

.address {
	padding-left: 22px;
	background-image: url('icons/email.png');
	background-repeat: no-repeat;
	background-position: center left;
	margin-bottom: 2px;
}

.event {
	padding-left: 22px;
	background-image: url('icons/music.png');
	background-repeat: no-repeat;
	background-position: center left;
	margin-bottom: 2px;
}
	

/* header */

/* We have a logo, contact details and nav bar in the header */

#logo {
	width: 510px;
	float: left;
	display: inline;
	margin-right: 50px;
	margin-bottom: 0;
}

#logo p {
	margin-top: -22px;
}

#contact_details {
	text-align: right;
	float: right;
	display: inline;
	line-height: 44px;
}

#contact_details ul li {
	list-style-type: none;
	font-size: 12px;
	font-weight: bold;
}

#nav {
	clear: both;
	padding-bottom: 10px;
	border-bottom: 1px dotted #CCC;
	overflow: hidden;
	width: 790px;
}

#nav ul {
	margin-bottom: 0;
}

#nav ul li {
	display: inline;
	margin-right: 35px;
	font-family: georgia, norasi, palatino, serif;
	font-size: 16px;
	line-height: 16px;
	text-transform: lowercase;
	font-variant: small-caps;
	list-style-type: none;
}

#nav li a {
	color: #888;
	text-decoration: none;
	border-bottom: none;
	font-weight: normal;
}

#nav li a:hover, #nav li.current {
	color: #BF0000;
	border-bottom: 2px solid #BF0000;
}

#nav li.contact_link {
	width: 140px;
}

/* content areas */

/* we generally have an image and a lead. Below that we have some body copy, asides. Sometimes we'll have other graphical elements, such as a Google Map or a Calendar */

#site_lead_text p {
	font-size: 16px;
	line-height: 22px;
	color: #444;
	padding-top: 11px;
	font-family: georgia, palatino, times, serif;
}

#site_lead_text a {
	font-weight: normal;
	border-bottom: 1px dotted #888;
}

.drop {
	font-size: 44px;
	line-height: 44px;
	color: #BF0000;
	float: left;
	margin-right: 4px;
}

#main_pic {
	width: 790px;
	height: 300px;
	margin-bottom: 11px;
	margin-top: 11px;
	overflow: hidden;
	position: relative;
}

#main_pic_cap  {
	top: 0;
	right: 0;
	position: absolute;
	background-color: #444;
	color: #FFF;
	padding: 0 5px;
	opacity: 0.75;
	filter:alpha(opacity=75);
}

#main_pic_cap p {
	font-size: 12px;
	font-weight: normal;
	color: #FFF;
	margin-bottom: 0;
}

#map {
	float: left;
	display: inline;
	margin-right: 50px;
	width: 510px;
	margin-bottom: 22px;
	padding-top: 11px;
}

#contact_form {
	float: left;
	display: inline;
	width: 230px;
	padding-top: 11px;
}

#events_calendar, #gallery {
	width: 790px;
	margin-bottom: 11px;
	padding-top: 11px;
}

/* Menu */

#menu {
	float: left;
	display: inline;
	width: 458px;
	margin-right: 50px;
	margin-bottom: 11px;
	margin-top: 11px;
	padding: 11px 25px;
	border: 1px solid #DDD;
	-moz-box-shadow: 5px 5px 5px #CCC;
	-webkit-box-shadow: 5px 5px 5px #CCC;
	-o-box-shadow: 5px 5px 5px #CCC;
	box-shadow: 5px 5px 5px #CCC;
}

.menu-teaser {
	font-family: georgia, palatino, times, serif;
	font-style: italic;
}

#menu h2, #menu h3, #menu h4 {
	text-shadow: 1px 1px 1px #FFF;
}

#menu h3 {
	margin-bottom: 0;
	color: #444;
}

.menu-list li {
	font-size: 12px;
	list-style-type: none;
}

#menu-aside {
	float: left;
	width: 230px;
	padding-top: 11px;
}

#menu-aside p {
	font-family: 'lucida grande', 'lucida sans unicode', verdana, 'garuda', sans-serif;
	font-size: 12px;
	color: #888;
}

#menu-aside h2 {
	font-size: 18px;
}

#menu-aside h3 {
	color: #444;
	font-size: 14px;
	margin-bottom: 0;
	font-style: italic;
}

#beers {
	padding-top: 10px;
	border-top: 1px dotted #CCC;
}


/* Events */

.vevent, #events_calendar .unifyRepeatArea {
	overflow: hidden;
	display: inline;
	margin-bottom: 11px;
	float: left;
	width: 510px;
	margin-right: 50px;
}

.vevent h3, #events_calendar .unifyRepeatArea h3 {
	margin-bottom: 0;
	padding-bottom: 3px;
	border-bottom: 1px dotted #DFDFDF;
	color: #444;
}

.dtstart {
	font-size: 12px;
	color: #888;
	margin-bottom: 0;
}

#events_calendar .unifyRepeat {
	overflow: hidden;
	margin-bottom: 11px;
}

#events-invite {
	float: left;
	display: inline;
	width: 230px;
}

#events-invite h2 {
	font-size: 18px;
}

#events-invite p {
	font-size: 12px;
}

#lead {
	width: 230px;
	float: left;
	padding-top: 11px;
}

#lead p {
	font-family: georgia, norasi, palatino, serif;
	font-size: 18px;
}

#about {
	clear: both;
	padding-top: 10px;
	border-top: 1px dotted #CCC;
}

#body_copy {
	width: 510px;
	float: right;
	display: inline;
	margin-left: 50px;
}

#aside {
	float: right;
	display: inline;
	width: 230px;
}

#aside p {
	font-family: 'lucida grande', 'lucida sans unicode', verdana, 'garuda', sans-serif;
	color: #888;
	font-size: 12px;
}

#aside h2 {
	font-size: 18px;
}

.help_text {
	color: #888;
	font-size: 10px;
}

/* contact form messages */

.error_message {
	color: #BF0000;
	font-weight: bold;
}

.success {
	color: #669900;
	font-weight: bold;
}

/* contact form styles */

#contact_form label {
	display: block;
	font-size: 12px;
	margin-bottom: 2px;
	font-family: 'lucida grande', 'lucida sans unicode', 'garuda', sans-serif;
}

input#tswname, input#tswemail, textarea#tswmessage {
	width: 220px;
	padding: 4px;
	border: 1px solid #AAA;
	font-family: georgia, norasi, palatino, serif;
	font-size: 21px;
}

textarea#tswmessage {
	height: 165px;
	margin-bottom: 4px;
	font-size: 14px;
}

input#submit {
	width: 120px;
	padding: 5px;
	border: 1px solid #888;
	cursor: pointer;
	font-size: 12px;
	margin-bottom: 11px;
	font-family: 'lucida grande', 'lucida sans unicode', 'garuda', sans-serif;
}

/* footer */

/* the footer contains 3 areas: newsletter signup, twitter and latest event details */

#footer {
	clear: both;
	padding-top: 10px;
	border-top: 1px dotted #CCC;
}

#footer h3 {
	color: #888;
}

#newsletter_signup, #events_lead {
	width: 230px;
	float: left;
	display: inline;
	margin-right: 50px;
}

#twitter {
	width: 230px;
	float: left;
	display: inline;
}

ul#twitter_update_list li {
	font-size: 12px;
	list-style-type: none;
	margin-bottom: 11px;
}

#newsletter_signup p, #events_lead p, #twitter p {
	font-size: 12px;
}

.small {
	padding-top: 10px;
	border-top: 1px dotted #CCC;
	color: #AAA;
	clear: both;
	font-size: 12px;
}

/* sign-up form styling */

#newsletter_signup {
	clear: both;
}

#newsletter_signup p {
	margin-bottom: 5px;
}

#newsletter_signup fieldset {
	border: none;
	margin-bottom: 5px;
	padding: 0;
}

#newsletter_signup label {
	font-size: 12px;
	font-weight: bold;
	display: block;
}

#newsletter_signup input {
	border: 1px solid #CCC;
	padding: 4px;
	width: 220px;
	margin-bottom: 6px;
}

#newsletter_signup input.btn {
	width: 120px;
	padding: 5px;
	border: 1px solid #888;
	cursor: pointer;
	font-size: 12px;
	margin-bottom: 11px;
	font-family: 'lucida grande', 'lucida sans unicode', 'garuda', sans-serif;
}

#mc_embed_signup fieldset {
	border: none;
}

.mce_inline_error {
	display: block !important;
	width: 220px;
	font-size: 12px;
	background-color: #FFF !important;
	color: #BF0000 !important;
}

.response {
	font-size: 12px;
	background-color: #FFF;
	color: #418F00;
}
