/*
Company:	Life Beyond Sport
File:		main.css - This contains all the main styles for the website.

All the styles are separted into the following groups:
Global Browser Reset - they make sure that all browsers start with the same default settings
HTML, Body - for the html and body tags
Layout - any style that defines how the site is laid out (position and size of objects)
Nav - navigation bar
Headings - headings like h1, h2, etc
Text Styles - Styles for text
Lists - unordered and ordered lists
Forms - html forms
Links - links
Misc - anything that doesn't fit elsewhere
*/

/* @group Global Browser Reset */
* {
padding:0;
margin:0;
outline: 0;
}
blockquote { margin-left: 40px; }
fieldset { padding:10px; }
img { border: 0px; }
q:before,q:after{content: '';}
/* @end */

/* @group HTML, Body */
body {
	background: #dff2ff url(../img/bg.gif) repeat-x 0 0;
	text-align: center;
}
body.home {
	background: #dff2ff url(../img/bg_home.gif) repeat-x 0 0;
}
body.admin {
	background: #dff2ff url(../img/bg_admin.gif) repeat-x 0 0;
}
/* @end */

/* @group Layout */
#outer-wrapper {
	margin: auto;
	text-align: left;
	color: #666;
	font-family: Arial, Helvetica, sans-serif;
	font-size: .88em;
	line-height: 1.2em;
	width: 900px;
	position: relative;
}
#header {
	height: 124px; width: 900px;
	position: relative;
}
	#header #logo {
		background: url(../img/logo.gif) no-repeat 0 0;
		height: 124px; width: 404px;
	}
	#header #tagline {
		color: #99cccc;
		font: italic normal 1.4em/1.2em Arial, Helvetica, sans-serif;
		text-align: right;
		position: absolute;
		right: 0; top: 50px;
	}
#menu {
	background: #e6dec8 url(../img/bg_menu.gif) no-repeat 0 0;
	height: 40px; /*width: 900px;*/
}
#body {
	background: #FFF;
	width: 900px;
}
body.admin #body {
	background-color: transparent;
}
	#body h3, #body h4 {
		color: #b36c33;
		margin-bottom: .5em;
	}
	#body p, #body ul, #body ol {
		margin-bottom: 1.2em;
	}
#top-box {
	background: #e6dec8 url(../img/bg.gif) repeat-x 0 -164px;
	color: #666;
	height: 148px; width: 380px;
	float: left;
	padding-right: 10px;
	padding-left: 30px;
}
	body.home #top-box {
		background: #e6dec8 url(../img/bg_home.gif) repeat-x 0 -164px;
		height: 251px;
	}
	#top-box.title div.title-inner {
		color: #666;
		line-height: 148px;
		font-size: 36px;
		font-weight: normal;
		margin: 0;
	}
	#top-box.title div.title-inner div.regionBoundary {
	line-height: 100% !important;
}
	#top-box.txt div.txt-inner {
		color: #666;
		line-height: 1.7em;
		font-size: 18px;
		font-weight: normal;
		margin: 30px 0 0 0;
	}
#big-photo {
	float: right;
	margin: 0 !important;
	height: 346px; width: 480px;
}
	body.home #big-photo {
		height: 310px;
	}
#admin-col {
	margin: 20px 0;
}
#col-l {
	float: left; display: inline;
	margin-top: -210px;
	padding: 30px 20px 30px 30px;
	width: 548px;
}
	body.home #col-l {
		margin-top: -60px;
	}
	#col-l .imgspace {
		display: block;
		float: right;
		width: 170px; height: 170px;
	}
	body.home #col-l .imgspace {
		height: 20px;
	}
#col-r {
	background: url(../img/bg_col-r.gif) no-repeat 0 0;
	float: right;
	padding: 0 0 20px 20px;
	width: 282px;
}
	#col-r .content-box {
		background: url(../img/bg_box1.gif) no-repeat 0 bottom;
		float: left; display: inline;
		min-height: 130px; height: auto !important; height: 130px;
		margin-bottom: 1.2em;
		padding: 10px;
		width: 244px;
	}
	#col-r p, #col-r ul, #col-r ol {margin: 1em 0 0 0;}
	#col-r h3 {margin: 0;}
	
#know-more {
	background: #f5f0e3;
	padding: 19px 0 19px 19px;
	float: left;
	width: 523px;
}
	#know-more .col-l,
	#know-more .col-r {
		padding: 12px;
		min-height: 135px; height: auto !important; height: 135px;
	}
	#know-more .col-l {
		background: #fcfbf7;
		width: 235px;
	}
	#know-more .col-r {
		background: #e6e0d1;
		float: left; display: inline;
		margin-left: 16px;
		width: 202px;
	}
	#know-more .col-r form label {
		margin-bottom: 1em;
		display: block;
	}
	#know-more .col-r form label span {
		display: block;
		font-size: .8em;
	}
	#know-more .col-r form label input.text {
		border: 0;
		border-top: 2px solid #999;
		border-left: 1px solid #999;
		width: 198px;
	}
	
	#upcoming {
		float: left;
		padding-left: 10px;
		width: 262px;
	}
	#tt-upcoming {
		background: url(../img/tt_upcoming.gif) no-repeat 0 0;
		height: 23px; width:164px;
	}
	dl.event {
		float: left; display: inline;
		margin-top: 1.2em;
		width: 267px;
	}
		dl.event dt {
			float: left;
			background: url(../img/bg_date.gif) no-repeat 0 0;
			height: 40px; width: 35px;
		}
			dl.event dt .month {
				color: #FFF;
				display: block;
				font: 9px/17px Arial, Helvetica, sans-serif;
				text-align: center;
			}
			dl.event dt .day {
				display: block;
				font: bold 16px/16px Arial, Helvetica, sans-serif;
				text-align: center;
			}
		dl.event dd {
			float: left; display: inline;
			margin-left: 10px;
			width: 222px;
		}
	
	#quote {
		color: #9f9680;
		float: left; display: inline;
		margin-top: 2em;
		width: 246px;
		position: relative;
	}
		#quote div.quote {
			background: #f5f0e3 url(../img/quote-l.gif) no-repeat 20px 20px;
			display: block;
			font: 1.3em/1.2em Georgia, "Times New Roman", serif;
			padding: 20px;
			text-indent: 30px;
			width: 206px;
			margin: 0;
		}
		#quote div.quote-inner {
			background: transparent url(../img/quote-r.gif) no-repeat right bottom;
			display: block;
		}
		#quote .quote-tail {
			background: url(../img/quote-tail.gif) no-repeat 20px 0;
			min-height: 30px; height: auto !important; height: 30px;
			font: italic 1em/1em Georgia, "Times New Roman", serif;
			text-align: right;
			padding: 10px 20px 0 0;
		}
	
	#contact-card {
		background: url(../img/bg_contact-card.gif) no-repeat 0 0;
		float: left; display: inline;
		height: 121px; width: 246px;
		margin-top: 25px;
		position: relative;
	}
		#contact-card .content {
			position: relative;
			left: 105px; top: 36px;
			width: 140px;
		}
		#contact-card ul li {
			font-size: .86em;
			padding-left: 20px;
			margin-bottom: 5px;
		}
		#contact-card ul li.phone {background: url(../img/ico-phone.gif) no-repeat 3px center;}
		#contact-card ul li.email {background: url(../img/ico-email.gif) no-repeat 0 center;}

#footer {
	padding: 20px 30px;
	width: 840px;
}
	#footer a {
		color: #C1AD80;
	}
	#copyright {
		float: left;
		width: 50%;
	}
	#signature {
		float: right;
		width: 50%;
	}
/* @end */

/* @group Nav */
div#outer-wrapper #menu ul {
	float: left;
	height: 40px; /*width: 900px;*/
	margin: 0;
	list-style-type: none !important;
}
div#outer-wrapper #menu ul li {
	float: left;
	list-style-type: none !important;
	margin: 0;
}
div#outer-wrapper #menu ul li a {
	color: #666;
	float: left;
	display: block;
	height: 40px;
	font: normal normal .9em/40px Arial, Helvetica, sans-serif;
	padding: 0 20px;
	text-decoration: none;
	margin: 0;
}
div#outer-wrapper #menu ul li a:active, div#outer-wrapper #menu ul li a:hover, div#outer-wrapper #menu ul li a.selectedPage {
	background: #e6dec8;
	color: #b36c33;
}
/* @end */

/* @group Headings */
h1, h2, h3, h4, h5, h6 {line-height: 1.2em; color: #b36c33;}
h1 {font-size: 2em;}
h2 {font-size: 1.6em;}
h3 {font-size: 1.2em;}
h4 {font-size: 1em;}
/* @end */

/* @group Text Styles */
.underline {
	text-decoration: underline;
}
.txt01 {
	color: #B36C33;
	font-size: .86em;
}
/* @end */

/* @group Lists */
div#outer-wrapper ul,
div#outer-wrapper ol {
	list-style: none;
}
div#outer-wrapper ul li, body.home div#outer-wrapper div#col-l ul li {
	list-style: disc outside;
	margin-left: 30px;
}
body.home div#outer-wrapper div#col-l ul li {
	color: #7EA1B9;
	font-size: 1.2em;
}
/* @end */

/* @group Forms */
input, select, textarea {
	border: 1px solid #CCC;
	font: 1em/1.2em Arial, Helvetica, sans-serif;
}
input, textarea {padding: 1px;}
input, select {vertical-align:middle;}
input.image {
	background: none;
	border: 0;
}
/* @end */

/* @group Links - link visited hover active */
a, a:link, a:visited {
	color: #7ea1b9;
	text-decoration: underline;
}
a:hover, a:active {
	color: #c1ad80;
}
/* @end */

/* @group Misc */
.clear {clear: both;}
img.img {display: block;}
.hidden {display: none;}
.replace {display: block; text-indent: -10000px; line-height: 0; font-size: 0;}
.col-l, .float {float: left;}
.col-r {float: right;}
.center {text-align: center;}
.right {text-align: right;}
.no-margin {margin: 0 !important;}
h2.postTitle {font-size: 1em; margin: 0;}
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/* @end */