@charset "UTF-8";

/*
	St Matthew's Church
	Site Design Copyright 2010 Infusion Design Melbourne
	www.infusiondesign.com.au
	
	Table of Contents
	1.	Browser CSS Reset
	2.	Typographic Setup
	3.	Generic Page Layout
	4. 	Masthead
	5.	Navigation
	6.	Footer
	7.	Index Specific
		7a.	Feature Box
		7b.	Column Layout
		7c.	Heading Image Replacement
	8.	Page Banner Images
	9.	Common Secondary Page Elements
	10.	News and Events
	11.	Sermons
	12.	Services
	

*/


/*  -----  1. Browser CSS Reset  -----  */

html, body, div, span, object,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
	background: #FFF;
	color: #333;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

.clearfloat {
	clear: both;
}

hr {
	display: block;
	clear: both;
	margin: 0 0 60px 0;
	padding: 60px 0 0 0;
	border: dashed #777;
	border-width: 0 0 4px 0;
}
/*  -----  2. Typographic Setup  -----  */

body {
	font-size: 13px;
	line-height: 15px;
	font-family: "Myriad Pro", "Lucida Grande", Tahoma, Arial, sans-serif;
}

a {
	color: #5d95c1;
	text-decoration: none;
}
a:hover, a:focus {
	text-decoration: underline;
}

p, h1, h2, h3, h4, h5 {
	margin: 0 0 15px 0;
}

p {
	
}

h1 {
	font-size: 40px;
	line-height: 45px;
	letter-spacing: -2px;
	color: #5d95c1;
}

h2 {
	font-size: 25px;
	font-weight: normal;
	line-height: 35px;
	color: #5d95c1;
}

h3 {
	font-size: 17px;
	line-height: 30px;
}

h4 {
	font-size: 17px;
	font-weight: normal;
	line-height: 30px;
}

/*  -----  3. Generic Page Layout  -----  */

#page_container {
	width: 910px;
	margin: 0 auto;
	position: relative;
}

/*  -----  4. Masthead  -----  */

#masthead {

}

	h1#logo {
		text-indent: -9999px;
		background: url(../images/logo.png) no-repeat 0 0;
		width: 164px;
		height: 63px;
		margin: 10px 10px 0 10px;
		float: left;
	}
	h1#logo a {
		display: block;
		width: 164px;
		height: 63px;
	}
	p#tagline {
		font-style: italic;
		color: #888;
		font-size: 13px;
		letter-spacing: 0.1em;
		text-indent: 0;
		float: left;
		margin: 50px 0 0 20px;
		
	}
	
/*  -----  5. Navigation  -----  */

#navigation {
	clear: both;
	margin: 10px 0 0 0;
}

#topnav_wrap {
	position: relative;
	left: -10px;
	width: 910px;
	margin: 0 0 0 0;
	padding: 10px;
	background: url(../images/topnav_shadow.png) no-repeat 0 0;
}
	ul#topnav {
		overflow: auto;
		background: #283c77 url(../images/topnav_bg.png) repeat-x 0 0;
	}
	ul#topnav li {
		display: block;
		float: left;
	}
		ul#topnav li a {
			line-height: 40px;
			padding: 0 20px 0 20px;
			margin-right: 10px;
			display: block;
			color: #FFF;
			text-decoration: none;
		}
		ul#topnav li a:hover, ul#topnav li a:focus, ul#topnav li.active a {
			text-decoration: none;
			color: #FFF;
			background: #0b273f url(../images/topnav_bghover.png) repeat-x 0 0;
		}
		ul#topnav li.active a {
			font-weight: bold;
		}
	
#subnav_wrap {
	clear: both;
	position: relative;
	left: -10px;
	width: 910px;
	margin: -10px 0 0 0;
	padding: 0 10px 10px 10px;
	background: url(../images/subnav_shadow.png) no-repeat 0 0;
}
	ul#subnav {
		overflow: auto;
		background: #5a5a5a url(../images/subnav_bg.png) repeat-x 0 0;
	}
	ul#subnav li {
		display: block;
		float: left;
	}
		ul#subnav li a {
			line-height: 20px;
			padding: 0 20px 0 20px;
			display: block;
			color: #FFF;
			text-decoration: none;
			font-size: 11px;
		}
		ul#subnav li a:hover, ul#subnav li a:focus, ul#subnav li.active {
			text-decoration: none;
			color: #FFF;
			background: #2e2e2e url(../images/subnav_bghover.png) repeat-x 0 0;
		}
		ul#subnav li.active a {
			font-weight: bold;
		}
		
/*  -----  6. Footer  -----  */

#footer_wrap {
	clear: both;
	position: relative;
	left: -10px;
	margin: 20px 0 10px 0;
	padding: 10px;
	width: 910px;
	background: url(../images/footer_shadow.png) no-repeat 0 0;
}

#footer {
	background: #595959 url(../images/footer_bg.png) repeat-x 0 0;
	color: #FFF;
	height: 40px;
	width: 890px;
	padding: 10px;
}

#footer p {
	margin: 0;
	line-height: 20px;
}

	#footer p#copyright {
		font-size: 10px;
	}
	#footer a {
		color: #FFF;
		text-decoration: none;
	}
	#footer a:hover, #footer a:focus {
		text-decoration: underline;
	}

/*  -----  7. Index Specific  -----  */

img.featureimg {
	display: block;
	margin: -10px 0 20px -10px;
}

/*  -----  7a. Index Feature Box  -----  */

#index_feature_outer {
	position: relative;
	left: -10px;
	width: 930px;
	margin: 0 0 0 0;
	padding: 0;
	background: url(../images/bigboxbottom.png) no-repeat 100% 100%;
}
#index_feature_wrap {
	padding: 10px 10px 10px 10px;
	background: url(../images/bigboxtop.png) no-repeat 0 0;
}

ul#index_feature_inner {
	padding: 0;
	position: relative;
	height: 230px;
}
	ul#index_feature_inner li {
		display: block;
		position: absolute;
	}
/*		ul#index_feature_inner li .link_text {
			position: absolute;
			bottom: 0;
			right: 0;
			background: #333;
			background: rgba(0,0,0,0.7);
			font-size: 14px;
			padding: 10px 20px;
			display: none;
		}
		ul#index_feature_inner li:hover .link_text {
			display: block;
			color: #fff;
			text-decoration: none;
		}*/
		ul#index_feature_inner li img {
			display: block;
		}
	
	#index_feature_switcher {
		position: absolute;
		right: 10px;
		bottom: -20px;
	}
		#index_feature_switcher li {
			display: block;
			float: left;
			padding: 5px 3px;
			margin: 0;
			height: 10px;
			width: 10px;
			background: url(../images/indexfeature_switcher.png) no-repeat 0 5px ;
			text-indent: -9999px;
			cursor: pointer;
		}
		#index_feature_switcher li:hover {
			background: url(../images/indexfeature_switcher.png) no-repeat 0 -35px;
		}
		#index_feature_switcher li.active {
			background: url(../images/indexfeature_switcher.png) no-repeat 0 -15px;
		}

/*  -----  7b. Index Column Layout  -----  */


#home h2 {
	padding-top: 15px;
}

.left_column {
	float: left;
	width: 320px;
	padding: 0 10px;
}

.right_column {
	float: right;
	width: 520px;
	padding: 0 10px;
}
	.right_column .column_block {
		display: block;
		clear: both;
		margin-bottom: 15px;
	}

#news_home {
	float: left;
	width: 340px;
	margin-bottom: 0;
}

#news_home li {
	margin-bottom: 15px;
	color: #999;
	float: left;
	width: 150px;
	margin-right: 20px;
}
	#news_home .date {
		font-size: 11px;
	}

#news_home li.wide {
	width: 320px;
	padding: 6px;
	margin: -7px 13px 8px -7px;
	border: 1px #eee solid;
	background: #f5f8fa;
}	
	#news_home li.wide img {
		margin-bottom: 5px;
	}
#news_home .calendar_link {
/*	font-weight: bold;*/
	width: 320px;
}
#news_home .calendar_link, .calendar_wrap .calendar_link {
	background: transparent url(../images/calendar_icon2.png) no-repeat 0 1px;
	text-indent: 15px;
}

#newsandevents_heading {
/*	border-top: 1px dotted #81a7ca;*/
}

#newsletter_subscribe {
	float: right;
	width: 160px;
	padding-top: 30px;
}
	#newsletter_subscribe input[type="text"] {
		width: 140px;
		margin-bottom: 10px;
	}

/*  -----  7c. Index Header Image Replacement  -----  */

/*#newsandevents_heading {
	background: url(../images/index_newseventsheader.png) no-repeat 0 15px;
	text-indent: -9999px;	
		
}
#welcome_heading {
	background: url(../images/index_welcomeheader.png) no-repeat 0 15px;
	text-indent: -9999px;	
}
#thissunday_heading {
	background: url(../images/index_thissundayheader.png) no-repeat 0 15px;
	text-indent: -9999px;	
}*/

/*  -----  8. Page Banner Images  -----  */

.banner_wrap {
	position: relative;
	clear: both;
	left: -10px;
	width: 930px;
	margin: 0 0 5px 0;
	padding: 0;
	background: url(../images/bigboxbottom.png) no-repeat 100% 100%;
}
.banner_inner {
	padding: 10px 10px 10px 10px;
	background: url(../images/bigboxtop.png) no-repeat 0 0;
}
.banner_inner img {
	display: block;
}

/*  -----  9. Common Secondary Page Elements  -----  */

.main_header {
	margin-left: 10px;
	clear: both;
}

#page_content {
	margin: 0 10px;
}

#page_content.has_sidebar {
	width: 540px;
}

#page_content ul, #page_content ol {
	list-style-position: outside;
	margin-bottom: 15px;
}

#page_content ul {
	list-style-type: disc;
}
#page_content ol {
	list-style-type: decimal;
}
#page_content li {
	margin-left: 20px;
}

.sidebar {
	float: right;
	margin-right: -360px;
	margin-top: -10px;
}

/*  -----  10. News and Events  -----  */

.recent_news_wrap {
	float: left;
	width: 500px;
	margin-left: 10px;
}
.calendar_wrap {
	float: right;
	width: 320px;
}

.posts_wrap {
	float: left;
	width: 540px;
	margin-left: 10px;
}

.news_post {
	border-bottom: 1px dotted #81a7ca;
	margin: 0 0 15px 0;
	overflow: auto;
}

.post_header {
	margin-bottom: 0;
}

.post_header a {
	text-decoration: none;
}
.post_header a:hover, .post_header a:focus {
	text-decoration: underline;
}

.post_date {
	color: #999;
	font-size: 11px;
}

.read_more {
	text-align: right;
}

a.rss_feed {
	display: block;
	color: #AAA;
	text-decoration: none;
	background: url(../images/rssicon.png) no-repeat 0 5px;
	text-indent: 30px;
	line-height: 30px;
	margin: 0 0 15px -15px;
}
a.rss_feed:hover, a.rss_feed:focus {
	color: #333;
}
.archive_sidebar {
	float: right;
	padding-top: 0;
	width: 150px;
}
	.archive_sidebar .archive_header {
		color: #5d95c1;
		font-weight: normal;
		margin: 0;
		font-size: 19px; // default is 17px
	}
	.archive_sidebar dl {
	}
	.archive_sidebar dl dt {
		font-weight: bold;
		margin: 10px 0 5px 0;
		background: url(../images/triangle_flipper.gif) no-repeat 130px -27px;
		display: block;
		cursor: pointer;
	}
		.archive_sidebar dl dt:hover, .archive_sidebar dl dt.closed:hover {
			background-image: url(../images/triangle_flipper_hover.gif);
			color: #888;
		}
	.archive_sidebar dl dt.closed {
		background: url(../images/triangle_flipper.gif) no-repeat 130px 3px;
	}
		.archive_sidebar dl dd ul {
			margin-left: 10px;
		}
		.archive_sidebar dl dd ul li {
			font-weight: normal;
			margin-bottom: 5px;
			list-style: inside square;
			color: #888;
		}
		.archive_sidebar dl dd ul li a {
			text-decoration: none;
		}
		.archive_sidebar dl dd ul li a:hover, .archive_sidebar dl dd ul li a:focus {
			text-decoration: underline;
		}
	

/*  -----  11. Sermons  -----  */

ul#series_selector {
	float: left;
	margin-bottom: 10px;
}

	ul#series_selector li {
		display: block;
		width: 195px;
		line-height: 15px;
	}
	ul#series_selector li a {
		display: block;
		text-decoration: none;
		padding: 8px 10px 7px 10px;
		color: #FFF;
		background: #5e95c1 url(../images/sermon_series_selector.png) repeat-x 0 0;
	}
	ul#series_selector li a:hover, ul#series_selector li a:focus {
		background: #65a1d0 url(../images/sermon_series_selector.png) repeat-x 0 -30px;
		color: #FFF;
	}
	ul#series_selector li.active a {
		background: #fefefe url(../images/sermon_series_selector.png) repeat-x 0 -60px;
		color: #1f4a7d;
	}
	
#sermon_list {
	line-height: 15px;
	float: right;
	width: 705px;
}
#sermon_list li {

}
#sermon_list li table {
	width: 100%;
}
	#sermon_list li th {
		background: #5e95c1 url(../images/sermon_series_selector.png) repeat-x 0 0;
		color: #FFF;
		text-align: left;
		font-weight: normal;
		padding: 8px 30px 7px 10px;
	}
	#sermon_list li td {
		background: #fefefe url(../images/sermon_series_selector.png) repeat-x 0 -60px;
	}
	
	#sermon_list li tr td {
		padding: 8px 30px 7px 10px;
	}

#sermon_list li tr {
	height: 30px;
}
#sermon_list li .sermon_description {
	max-width: 550px;
}
#sermon_list li .sermon_date {
	width: 65px;
	padding-right: 20px;
}
#sermon_list li .sermon_speaker {
/*	width: 130px;*/
	padding-right: 20px;
}
/*  -----  12. Services  -----  */

.service {
	margin-left: 10px;
	margin-bottom: 10px;
	padding-bottom: 10px;
	clear: both;
	border-bottom: 1px dotted #81a7ca;
	overflow: auto;
}
	.service p, .service h2, .service h3 {
		width: 365px;
	}
	.service img {
		float: right;
	}
	
/*  -----  13. Contact Form  -----  */

#contact_form {
	margin-left: 10px;
	width: 500px;
	float: left;
}

#contact_details {
	float: left;
	margin: 10px;
}

.contact_element {
	clear: both;
	margin: 10px;
}

	.contact_element label {
		display: block;
	}

input[type="text"], textarea {
	border: 1px solid #CCC;
	background: #FFF;
	padding: 5px;
	line-height: 15px;
	width: 300px;
}
input[type="text"]:focus, textarea:focus {
	border-color: #81a7ca;
	background: #f8f9fa;
}


.message_sent {
	line-height: 15px;
	padding: 15px 15px 0 15px;
	margin-top: 15px;
	border-left: 1px dotted #81a7ca;
	color: #555;
}
.message_sent dt {
	font-weight: bold;
}
.message_sent dd {
	font-style: oblique;
	padding-bottom: 15px;
}

/*  -----  14. Activities / About Us Landing Pages  -----  */

.launchbox {
	width: 280px;
	height: 100px;
	margin: 10px;
	float: left;
	border-bottom: 1px dotted #81a7ca;
}

.launchbox a {
	text-decoration: none;
}
.launchbox a:hover, .launchbox a:focus {
	border-bottom: 1px solid #81a7ca;
}

/*  -----  15. Recommended Reading  -----  */

.reading_box {
	float: left;
	margin: 0 10px 20px 10px;
	padding: 10px;
	width: 250px;
	background: #f8f9fa;
	background: #f0f5fa;
	min-height: 100px;
}

.book_thumb {
	max-width: 100px;
	max-height: 100px;
	overflow: hidden;
	float: left;
	margin: 0 10px 0 0;
}
	.book_thumb img {
		display: block;
		margin: 0 auto;
	}

.book_title {
	font-size: 13px;
}
.book_author {
	margin: 0;
	font-style: oblique;
}
	
.reading_category {
	display: block;
	border-bottom: 1px dotted #81a7ca;
	clear: both;
}

/*  -----  16. Staff Profile Page  -----  */

.staff_profile {
	float: left;
	width: 400px;
	margin: 0 40px 40px 0;
}
.staff_name, .staff_position {
	padding-left: 140px;
}
.staff_name {
	line-height: 20px;
}
.staff_position {
	line-height: 15px;
	font-size: 14px;
}
.staff_description {
	padding-left: 140px;
}
.staff_photo {
	float: left;
	margin: -10px 10px 10px -10px;
}

	/*  -----  IE6 Warning  -----  */
	
.ie6_warning {
	display: none;
}