/*index.css*/
/*Copyright 2010 Cornerstone Baptist Church*/
/*Site Design & Coding By Andrew Grexa*/

/*******General Styles*******/

* {border: none; color: #261b12; margin: 0; padding: 0;}
a {text-decoration: none;}
a:hover {text-decoration: underline;}
a img {border: none;}
body {background: #261b12 url(../jpg/backgrounds-main.jpg) repeat ;}
p {color: #261b12; text-align: justify;}
ul {list-style: none;}
h1, h2, h3, h4, h5, h6 {color: #261b12;	font-family: Helvetica, Arial, sans-serif;}
div.space10 {clear: both; height: 10px; width: 1000px;}
div.space20 {clear: both; height: 20px; width: 1000px;}
td, th {color: #261b12;}

/*******Header Styles*******/

#header {background: url(../png/backgrounds-header.png) repeat-x; border-bottom: 5px solid #261b12; border-top: 5px solid #261b12; height: 115px; width: 100%;}

	#logo {height: 115px; margin: 0 auto; width: 1000px;}
	#logo a {display: block; height: 115px; margin: 0 0 0 455px; width: 545px;}
	
	#site-map {background: url(../png/links-site-map.png) no-repeat; display: none; height: 50px; margin: 0 0 0 -20px; position: absolute; width: 315px; z-index: 1;}
	#site-map a {display: block; height: 30px; margin: 0 20px 20px; width: 275px;}
	
/*******Main Navigation Styles*******/

#nav {background: url(../png/backgrounds-nav.png) repeat-x; border-bottom: 5px solid #261b12; clear: both; height: 40px; line-height: 40px; text-align: center; width: 100%;}
#nav ul {margin: 0 auto; width: 1000px;}
#nav li {display: inline; height: 40px; line-height: 40px;}
#nav a {height: 40px; line-height: 40px; padding: 0 15px 0 0;}
#nav a:first-child {padding: 0 15px;}

/*******Main Navigation Hover Styles*******/

#nav a.home:hover img {background: url(../png/nav-home-hover.png) no-repeat;}
#nav a.about:hover img {background: url(../png/nav-about-hover.png) no-repeat;}
#nav a.services:hover img {background: url(../png/nav-services-hover.png) no-repeat;}
#nav a.ministries:hover img {background: url(../png/nav-ministries-hover.png) no-repeat;}
#nav a.missions:hover img {background: url(../png/nav-missions-hover.png) no-repeat;}
#nav a.resources:hover img {background: url(../png/nav-resources-hover.png) no-repeat;}
#nav a.contact:hover img {background: url(../png/nav-contact-hover.png) no-repeat;}

/*******Sub Navigation Styles*******/

#subnav {background: url(../png/backgrounds-subnav.png) repeat-x; border-bottom: 5px solid #261b12; height: 25px; text-align: center; width: 100%;}
#subnav ul {margin: 0 auto; width: 1000px;}
#subnav li {display: inline; height: 25px; line-height: 25px;}
#subnav a {color: #d5d0ba; font: normal 14px Helvetica, sans-serif; height: 25px; line-height: 25px;}

/*******Main Content Area Styles*******/

#content {background: #999;}
#shadow {background: url(../png/backgrounds-shadow.png) repeat-y center;}
#content {background: #d5d0ba url(../jpg/backgrounds-content.jpg) repeat-y; margin: 0 auto; width: 1000px;}
#content p {margin: 20px auto 0 auto; width: 960px;}

#main-pic {background: url(../jpg/backgrounds-loading.jpg) no-repeat; height: 325px; width: 675px; z-index: 0;}

#weekly-schedule {background: url(../png/backgrounds-weekly-schedule.png) no-repeat; height: 375px; margin: -325px 0 0 650px; position: absolute; width: 350px;}
#directions {height: 80px; width: 210px;}
#directions a {background: url(../png/links-directions.png) no-repeat; display: block; height: 80px; margin: 270px 0 0 70px; width: 210px;}
#directions a img {visibility: hidden;}
#directions a:hover img {visibility: visible;}

#quick-links {background: url(../png/backgrounds-quick-links.png) repeat-x; border-bottom: 5px solid #261b12; border-top: 5px solid #261b12; height: 40px; width: 1000px;}
#quick-links ul {margin: 0 0 0 25px;}
#quick-links li {color: #261b12; display: inline; height: 25px; line-height: 25px;}
#quick-links a {color: #261b12; font: normal 13px Helvetica, Arial, sans-serif; height: 40px; line-height: 40px;}

#main-links {margin: 15px 0 0 0;}
#main-links * {color: #130; font: bold small-caps 13px Arial, Helvetica, sans-serif;}
#main-links div {float: left; height: 170px; margin: 0 0 0 10px; width: 320px;}
#main-links #latest-sermon {background: url(../png/links-latest-sermon.png) no-repeat;}
#main-links #latest-sermon p {margin: 65px 20px auto 20px; position: absolute; text-align: center; width: 280px;}
#main-links #latest-sermon a:first-child {margin: 130px auto auto 35px;}
#main-links #latest-sermon a {margin: 130px auto auto 200px; position: absolute;}
#main-links #news-and-updates {background: url(../png/links-news-and-updates.png) no-repeat;}
#main-links #news-and-updates input:first-child {margin: 80px auto auto 30px;}
#main-links #news-and-updates input {background: none; height: 25px; line-height: 25px; margin: 115px auto auto 30px; outline: none; position: absolute; text-align: center; width: 150px;}
#main-links #news-and-updates a {background: url(../png/links-sign-me-up.png) no-repeat; display: block; height: 80px; margin: 70px auto auto 202px; position: absolute; width: 80px;}
#main-links #news-and-updates a:hover {background: url(../png/links-sign-me-up-hover.png) no-repeat;}
#main-links #todays-bible-reading {background: url(../png/links-todays-bible-reading.png) no-repeat;}
#main-links #todays-bible-reading a:first-child {height: 170px; margin: 0; width: 320px;}
#main-links #todays-bible-reading a {display: block; height: 25px; line-height: 25px; margin: 115px 0 0 35px; position: absolute; text-align: center; width: 250px;}

#bar {background: url(../png/backgrounds-bar.png) repeat-x; height: 75px; width: 1000px;}
#bar a:first-child:hover img {background: url(../png/links-bar-home-hover.png);}

#photo-stack {background: url(../png/backgrounds-photo-stack.png) no-repeat; height: 300px; margin: -95px 0 0 400px; position: absolute; width: 600px;}
#photo-stack.contact {background: url(../png/backgrounds-contact.png) no-repeat;}
#photo-stack .space {height: 50px; width: 600px;}
#photo-stack #photos {height: 200px; margin: auto; width: 500px;}

#sub-links {margin: 0 0 0 40px; position: absolute; width: 345px;}
#sub-links .shadow {background: url(../png/backgrounds-bar-sublinks-shadow.png) repeat-y;}
#sub-links ul {background: url(../png/backgrounds-bar-sublinks.png) no-repeat; margin: 0 auto; width: 325px;}
#sub-links li {height: 35px; width: 325px;}
#sub-links li.line {background: url(../png/backgrounds-bar-sublinks-line.png) no-repeat; height: 1px; width: 325px;}
#sub-links li a {color: #fff; display: block; font: normal 18px Calibri, Arial, Helvetica, sans-serif; height: 35px; line-height: 35px; text-align: center; width: 325px;}
#sub-links li a:hover {background: url(../png/backgrounds-bar-hover.png); text-decoration: none;}

#left {background: url(../png/backgrounds-swirls.png) repeat-y; display: block; float: left; margin: 0 0 0 50px; visibility: hidden; width: 325px;}

#center {margin: 0 auto; width: 500px;}
#center p {margin: 0 0 20px 0; width: 500px;}

#right {float: right; margin: 200px 40px 0 0; width: 520px;}
#right a {color: #261b12;}
#right p {margin: 20px 0 0 0; width: 520px;}
#right ul {padding: 20px 0 0 20px;}
#right li {color: #261b12;}
#right img {clear: both; float: left;}
#right tr {display: table-row; height: 35px;}
#right th, #right td {color: #261b12; height: 35px; text-align: center;}
#right form, #right label, #right input, #right select {clear: both; float: left;}
#right input, #right select {height: 25px; line-height: 25px; margin: 0 0 20px 0; width: 200px;}
#right textarea {height: 300px; resize: none; width: 520px;}
#right input, #right textarea {border: 1px solid #261b12;}
#right .original {clear: none; height: 25px; line-height: 25px; margin: 0; width: inherit;}
#right input.original {clear: both;}
#right span {color: #261b12; font: normal 12px Helvetica, Arial, sans-serif;}
#right h4 {clear: both; margin: 20px 0 0 0;}

/*******Footer Styles*******/

#footer {background: url(../png/backgrounds-footer.png) repeat; border-bottom: 5px solid #261b12; border-top: 5px solid #261b12; clear: both; height: 190px; width: 100%;}
#footer #footer-content {height: 190px; margin: 0 auto; width: 1000px;}
#footer #info {height: 190px; float: left; margin: 0 0 0 25px;}
#footer #info a {color: #261b12;}
#footer #theme {height: 190px; float: right; width: 350px;}
#footer #theme a {display: block; height: 190px; width: 350px;}