/*  
Theme Name: ReLion Template (Standard - 3 Columns, Fixed Width)
Description: This is the custom Template for the website of www.pacificspiritschool.org.
Version: 1.0
Author: Xander
Author URI: http://www.reliablyonline.com
*/


/* ---------------------------------------------- The Basics */
* html { position: relative; }
.clearthis { clear: both; }

a img { border: 0px; }

body {
	background: #FFF url('../interface/bgd.gif') repeat-x fixed;
	margin: 0px auto; padding: 0px;
	font-family: 'Lucida Grande', Verdana, Helvetica, Arial, sans-serif;
	color: #000; text-align: center;
}

#container {
	width: 980px; height: auto;
	margin: 0px auto; padding: 0px;
	color: #000; text-align: center;
	background: #000 url('../interface/tree-bgd.jpg') no-repeat;
	border-right: 1px solid #000; border-left: 1px solid #000;
}

#wrapper { /* contains MAIN content area */
	margin: 0px 30px 30px 30px; padding: 0px;
}
	
#content { /* main column */
	height: 100%; width: 634px;
	padding: 10px 0px 20px 0px;
	margin-top: 0px;
	margin-left: 285px; /* ----- change this to adjust column widths ----- */
	margin-right: 0px; /* ----- change this to adjust column widths ----- */
	margin-bottom: 0px;
	background: url('../interface/transparency-dark.png') repeat;
	border-left: 1px solid #000; border-bottom: 1px solid #000;
}
#mainarea { margin: 0px 0px 5px 0px; padding: 0px 20px; }

#leftcol { /* left column */
	float: left;
	height: 100%; width: 254px; /* ----- change this to adjust column widths ----- */
	margin: 0px 0px 20px 0px; padding: 0px;
	background: url('../interface/transparency-dark.png') repeat;
	border-right: 1px solid #000; border-bottom: 1px solid #000;
}
#leftarea { margin: 0px; padding: 0px 20px 10px 20px; }

#rightcol { /* right column */
	float: right;
	height: 100%; width: 0px; /* ----- change this to adjust column widths ----- */
	margin: 0px; padding: 0px;
}

/* ---------------------------------------------- Navbar */
#navbar {
	width: 980px; height: 30px;
	margin: 0px; padding: 0px;
}

/* ---------------------------------------------- Header */
#header {
	width: 980px; height: auto;
	margin: 0px; padding: 0px;
	border-top: 5px solid #000;
}

#header img { border: none; }

/* ---------------------------------------------- Bread Crumbs */
#breadcrumbs {
	width: auto; height: auto;
	margin: 0px; padding: 0px 0px 5px 0px;
	border-bottom: 1px dotted #000;
}

#breadcrumbs p { font-size: 10px; margin: 0px; padding: 0px; color: #000; text-align: right; }

#breadcrumbs a { color: #060; font-weight: bold; text-decoration: none; }
#breadcrumbs a:hover { color: #369; text-decoration: underline; }
#breadcrumbs a:active { color: #000; text-decoration: none; }

/* ---------------------------------------------- Left Column */
#leftcol ol { list-style-type: decimal; margin: 0px 0px 0px 20px; padding: 5px 0px; }
#leftcol ol li { font-size: 12px; line-height: 18px; }
#leftcol ul { list-style-type: square; margin: 0px 0px 0px 20px; padding: 5px 0px; }
#leftcol ul ul { margin: 0px 30px; padding: 5px 0px; }
#leftcol li { font-size: 12px; line-height: 18px; text-align: left; }
#leftcol li li { list-style-type: circle; font-size: 11px; line-height: 16px; padding: 0px; }
#leftcol li li li { list-style-type: disc; font-size: 11px; line-height: 16px; padding: 0px; }

#leftcolgallery { margin: 0px; padding: 0px; }
#leftcolgallery img { float: left; margin: 0px; padding: 5px; border: 0px; }
#leftcolgallery img:hover { border: 0px; background-color: #060; }

/* ---------------------------------------------- Column Images and Non-Navbar Things */
.bannersnone { margin: 0px 12px 0px 20px; padding: 0px; }
.bannersnone img { margin: 0px; padding: 5px 10px; display: block; }
.bannersnone img:hover { background-color: #369; }

.banners5both { margin: 0px 12px 0px 20px; padding: 0px; }
.banners5both img { margin: 5px 0px; padding: 5px 10px; display: block; }
.banners5both img:hover { background-color: #369; }

.banners5top { margin: 0px 12px 0px 20px; padding: 0px; }
.banners5top img { margin: 5px 0px 0px 0px; padding: 5px 10px; display: block; }
.banners5top img:hover { background-color: #369; }

.banners5bott { margin: 0px 12px 0px 20px; padding: 0px; }
.banners5bott img { margin: 0px 0px 5px 0px; padding: 5px 10px; display: block; }
.banners5bott img:hover { background-color: #369; }

.headings { margin: 0px; padding: 0px; }
.headings img { margin: 0px; padding: 0px; border: 0px; display: block; }

/* ---------------------------------------------- Footer */
#footer {
	width: auto; height: auto;
	background: url('../interface/transparency-light.png') repeat;
	margin: 0px; padding: 20px 0px;
	border-top: 5px solid #000;
}

#footer p { font-size: 10px; margin: 0px auto; padding: 0px; color: #000; line-height: 16px; text-align: center;}

#footer a { color: #060; font-weight: bold; text-decoration: none; }
#footer a:hover { color: #369; text-decoration: underline; }
#footer a:active { color: #000; text-decoration: none; }

#footer hr { border: 0px; color: #000; background-color: #000; height: 1px; text-align: left; margin: 10px 100px; padding: 0px; }

/* ---------------------------------------------- Text Styles */
h1 {
	color: #000; font-size: 24px; line-height: 30px; text-align: left;
	margin: 0px 0px 10px 0px; padding: 10px 0px 2px 0px;
	border-bottom: 1px solid #000; background: none;
}

h2 {
	color: #000; font-size: 18px; line-height: 24px; text-align: left;
	margin: 0px 0px 5px 0px; padding: 10px 0px 2px 0px;
	border-bottom: 1px dotted #000; background: none;
}
#leftarea h2 {
	color: #000; font-size: 14px; line-height: 20px; text-align: left;
	margin: 0px 0px 5px 0px; padding: 10px 0px 2px 0px;
	border-bottom: 1px solid #000; background: none;
}

h3 {
	color: #369; font-size: 18px; line-height: 24px; text-align: left;
	margin: 0px; padding: 10px 0px 0px 0px;
	background: none;
}

h4 {
	color: #060; font-size: 18px; line-height: 24px; text-align: left;
	margin: 0px; padding: 10px 0px 0px 0px;
	background: none;
}

h5 {
	color: #000; font-size: 14px; line-height: 20px; text-align: left;
	margin: 0px; padding: 10px 0px 0px 0px;
	background: none;
}

h6 {
	color: #369; font-size: 14px; line-height: 20px; text-align: left;
	margin: 0px; padding: 10px 0px 0px 0px;
	background: none;
}

a { color: #060; font-weight: bold; text-decoration: underline; }
a:hover { color: #369; text-decoration: none; }
a:active { color: #000; text-decoration: underline; }

blockquote {
	margin: 0 25px;
}

code {
	display: inline; padding: 2px;
	color: #333; background: #EFEFEF;
	font-family: Courier New, Courier, mono;
}

#content ol { list-style-type: decimal; margin: 0px 0px 0px 30px; padding: 5px 0px; }
#content ol li { font-size: 12px; line-height: 18px; }
#content ul { list-style-type: square; margin: 0px 0px 0px 30px; padding: 5px 0px; }
#content ul ul { margin: 0px 30px; padding: 5px 0px; }
#content li { font-size: 12px; line-height: 18px; text-align: left; padding: 2px 0px; }
#content li li { list-style-type: circle; font-size: 11px; line-height: 16px; padding: 0px; }
#content li li li { list-style-type: disc; font-size: 11px; line-height: 16px; padding: 0px; }

dl { margin: 0px 15px; padding: 5px 0px; text-align: left; }
dt { font-size: 12px; font-weight: bold; line-height: 18px; padding: 10px 0px 0px 0px }
dd { font-size: 12px; line-height: 16px; margin: 0px; padding: 0px; }

p { margin: 0px; padding: 5px 0px; font-size: 12px; line-height: 18px; text-align: left; }

.greenbold { font-weight: bold; color: #060; }
.green { color: #060; }
.bluebold { font-weight: bold; color: #369; }
.blue { color: #369; }
.grey { color: #666; }

small { font-size: 10px; }

hr { border: 0px; color: #000; background-color: #000; height: 1px; text-align: left; margin: 15px 0px; padding: 0px; }

img { border: none 0px; }

#content img { float: right; margin: 0px 0px 10px 10px; padding: 5px; border: 1px solid #369; background-color: #FFF; }
#content img:hover { border: 1px solid #000; background-color: #369; }

#gallery { margin: 0px; padding: 0px; }
#gallery img { float: left; margin: 5px 10px 5px 0px; padding: 5px; border: 1px solid #369; background-color: #FFF; }
#gallery img:hover { border: 1px solid #000; background-color: #369; }

#lefty img { float: left; margin: 5px 10px 5px 0px; padding: 5px; border: 1px solid #369; background-color: #FFF; }
#lefty img:hover { border: 1px solid #000; background-color: #369; }

/* ---------------------------------------------- Special Styles */
.announce { 
	float: right; background: url('../interface/transparency-light.png') repeat; border: 3px double #369;
	width: 250px; margin: 5px 0px 10px 10px; padding: 2px 15px 7px 15px;
	text-align: left;
}

#parentednote { 
	float: right; background: url('../interface/transparency-light.png') repeat; border: 3px double #369;
	width: 150px; margin: 5px 0px 10px 10px; padding: 2px 15px 7px 15px;
	text-align: left;
}
#parentednote p { margin: 0px; padding: 5px 0px; font-size: 10px; line-height: 14px; text-align: left; }
#parentednote img { border: none; background: none; margin: 0px; padding: 10px 0px; }
#parentednote img:hover { border: none; background: none; margin: 0px; padding: 10px 0px; }

#map { 
	float: right; background: url('../interface/transparency-light.png') repeat; border: 1px dotted #060;
	width: 204px; margin: 5px 0px 10px 20px; padding: 5px 15px;
	text-align: right;
}
#map img { float: right; margin: 0px 0px 5px 0px; padding: 5px; border: 1px solid #369; background-color: #FFF; }
#map img:hover { border: 1px solid #000; background-color: #369; }


/* ---------------------------------------------- Other stuff */
#nodetail { margin: 0px; padding: 10px 0px; }
#nodetail img { float: none; margin: 0px; padding: 0px; border: 1px solid #FFF; background-color: #FFF; }
#nodetail img:hover { border: 1px solid #FFF; background-color: #FFF; }

#nodetailright { margin: 0px; padding: 10px 0px; }
#nodetailright img { float: right; margin: 0px 0px 10px 10px; padding: 0px; border: 1px solid #FFF; background-color: #FFF; }
#nodetailright img:hover { border: 1px solid #FFF; background-color: #FFF; }

#nodetailleft { margin: 0px; padding: 0px; }
#nodetailleft img { float: left; margin: 0px 10px 5px 0px; padding: 5px; border: 1px solid #000; background-color: #FFF; }
#nodetailleft img:hover { border: 1px solid #000; background-color: #FFF; }

#nobgdborder img { float: right; margin: 0px 0px 10px 10px; padding: 5px; border: none; background: none; }
#nobgdborder img:hover { border: none; background: none; }

.rightalign { text-align: right; }
.leftalign { text-align: left; }
.centrealign { text-align: center; }

.nolineheight { padding: 0px; line-height: 14px; }
.smalllineheight { padding: 5px; line-height: 14px; }

.listfloat { float: left; width: auto; height: 100%; margin: 0px; padding: 0px 40px 20px 0px; }
.listfloatspecific { float: left; width: 198px; height: 100%; margin: 0px; padding: 0px 0px 20px 0px; }

#tabledividers hr { border: 0px; color: #99B2CC; background-color: #99B2CC; height: 1px; text-align: left; margin: 1px 0px; padding: 0px; }


/* --------------------------------------------------- Form styles */
label { font: 12px; line-height: 16px; color: #000; padding: 0px 5px; }
.labelalign { text-align: left; }
#itsaform { margin: 10px 0px 0px 0px; padding: 0px; }
#itsaform p { text-align: left; }
.subdivider { margin-top: 20px; }


textarea {
	border: 1px solid #369;
	color: #000;
	padding: 5px;
	margin: 2px 0px;
	width: 90%;
	background: #FFF;
	}

textarea:hover {
	background: #EFEFEF;
	border: 1px solid #000;
	color: #000;
	}

select { font: 12px; line-height: 16px; }

.commentfield {
	padding: 2px;
	margin: 0px;
	background: #FFF;
	border: 1px solid #369;
	color: #000;
	width: 220px;
	font-size: 10px;
	height: auto;
}

.commentfield:hover {
	background: #EFEFEF;
	border: 1px solid #000;
	color: #000;
	}
	
.commentfieldmid {
	padding: 2px;
	margin: 0px;
	background: #FFF;
	border: 1px solid #369;
	color: #000;
	width: 150px;
	font-size: 10px;
	height: auto;
}

.commentfieldmid:hover {
	background: #EFEFEF;
	border: 1px solid #000;
	color: #000;
	}

.commentfieldsmall {
	padding: 2px;
	margin: 0px;
	background: #FFF;
	border: 1px solid #369;
	color: #000;
	width: 50px;
	font-size: 10px;
	height: auto;
}

.commentfieldsmall:hover {
	background: #EFEFEF;
	border: 1px solid #000;
	color: #000;
	}

/* ---------------------------------------------- Table Styles */
table {
	background-color: none; border: none; margin: 0px; padding: 5px 0px;
	color: #000; font: 11px/16px 'Lucida Grande', Verdana, Helvetica, Arial, sans-serif; text-align: left;
}

table caption { color: #060; font-size: 14px; font-weight: bold; padding: 5px 0px; text-align: left; }

table a { background-color: transparent; color: #060; text-decoration: underline; }
table a:hover { background: transparent; color: #369; text-decoration: none; }
table a:active { background: transparent; color: #000; text-decoration: underline; }

tbody td, tbody th {
	background-color: transparent; border-top: 1px dotted #000; 
	margin: 0px; padding: 2px 5px; vertical-align: top;
}
tbody tr.odd th, tbody tr.odd td {
	background-color: transparent; border-top: 1px dotted #000; 
}
tbody tr:hover td, tbody tr:hover th {
	background-color: none;
}

thead td {
	font-size: 12px; font-weight: bold;
	margin: 0px; padding: 2px 5px; vertical-align: top;
}
th { font-weight: bold; white-space: nowrap; }

tfoot td, tfoot th { font-size: 11px; margin: 0px; padding: 5px 0px; border-top: 1px solid #000; }