/*----------------------------------------------
The Facey Family Stylesheet
Media Type: screen
URL: www.thefaceyfamily.com
Author: Blake
Last Updated: 02.09.2006
----------------------------------------------*/

/* http://www.alistapart.com/articles/holygrail*/

/* =universal - Set everything to square 1
----------------------------------------------*/
*
{
	margin: 0;
	padding: 0;
	font-family: "Trebuchet MS", Helvetica, Tahoma, Verdana, Geneva, sans-serif;
	
}

/* =body  - basic styles of the page
----------------------------------------------*/
body
{
	background-color: #E4F2F2;
	color: #333333;
	text-align: center;
	font-size: 13px;
}

/* =anchors  - Basic anchor styles
----------------------------------------------*/
a, 
a:link,
a:visited,
a:hover,
a:active
{
	color: #EE4F2F;
}

a:visited
{
	color: #333333;
}

a:hover
{
	color: #C2BFA5;
}

/* =headers  - h# tag styles
----------------------------------------------*/
h1, h2, h3, h4, h5, h6
{
}

	h1
	{
		font-size: 24px;
		margin-bottom: 12px;
		text-align: center;
	}
	
	h2
	{
		font-size: 20px;
		margin-bottom: 10px;
	}
	
	h3
	{
		font-size: 18px;
		margin-bottom: 9px;
	}

/* =basics  - basic html element styles
----------------------------------------------*/
p, ul, ol, blockquote, dl
{
	font-size: 13px;
	line-height: 18px;
	margin-bottom: 18px;
}

dl dt
{
	font-weight: bold;
}

dl dd
{
	padding-left: 10px;
}

p
{
	
}

ul, ol
{
	margin-left: 20px;
	list-style-type: square;
}

blockquote
{
	margin-left: 30px;
}

/* =classes - random classes
----------------------------------------------*/

/* Clear
----------------------------------------------*/
.Clear
{
	clear: both;
}

/* to center something
----------------------------------------------*/
.centered
{
	text-align: center;
}

/* Page message
----------------------------------------------*/
.message
{
	font-size: 18px;
	font-weight: bold;
	color: #F00;
	text-align: center;
}

/* errors
----------------------------------------------*/
.error
{
	font-weight: bold;
	color: #F00;
}

/* sizing
----------------------------------------------*/
.small
{
	font-size: 12px;
}

.smaller
{
	font-size: 11px;
}

.smallest
{
	font-size: 10px;
}

.NewsBox p.byline
{
	clear: both;
	text-align: right;
	font-size: 11px;
	color: #666;
}

p.commentsline
{
	text-align: center;
}

/* Comment Box containers
----------------------------------------------*/
.CommentBox,
.AlternatingCommentBox
{
	border: 1px solid #EFEFEF;
	padding: 5px;
	margin-bottom: 5px;
}

	.CommentBox
	{
		background-color: #FEFEFE;
	}
	
	.CommentBox p,
	.AlternatingCommentBox p
	{
		font-size: 12px;
		line-height: 16px;
	}
	
	.CommentBox p.byline,
	.AlternatingCommentBox p.byline
	{
		font-size: 11px;
		margin-bottom: 0;
		color: #666;
	}
	
/* Guestbook Box containers
----------------------------------------------*/
.GuestbookBox,
.AlternatingGuestbookBox
{
	border: 1px solid #EFEFEF;
	padding: 5px;
	margin-bottom: 5px;
}
		
	.GuestbookBox
	{
		background-color: #FEFEFE;
	}
	
	.GuestbookBox p,
	.AlternatingGuestbookBox p
	{
		font-size: 12px;
		line-height: 16px;
	}
	
	.GuestbookBox p.byline,
	.AlternatingGuestbookBox p.byline
	{
		font-size: 11px;
		margin-bottom: 0;
		color: #666;
	}

/* =form  - form element styles
----------------------------------------------*/
fieldset
{
	padding: 10px;
	border: 1px solid #EFEFEF;
}

fieldset legend
{
	color: #333;
	font-size: 18px;
	padding: 2px;
}
label
{
	font-weight: bold;
}

input, textarea, select
{
	padding: 2px;
}
input.txt, textarea.txt
{
	font: 12px "Lucida Console", Monaco, monospace;
	color: #333;
	border: solid 1px #000;
}

input.txt:focus, textarea.txt:focus
{
	border: solid 1px #999;
	background-color: #EFEFEF;
}


/* =OuterWrapper  - very outermost wrapper. This is unnecessary.
----------------------------------------------*/
#OuterWrapper
{
	margin: 0 auto;	
	/*width: 610px;	*/
}

/* =InnerWrapper - Wrrapper for other elements
----------------------------------------------*/
#InnerWrapper
{
	text-align: left;
	/*width: 600px;*/
	background-color: #E4F2F2;
	border-left: 10px solid #EE4F2F;
	border-right: 10px solid #EE4F2F;
	border-bottom: 10px solid #EE4F2F;
}

/* =Header  - Header
----------------------------------------------*/
#Header
{
	text-align: left;
	padding: 5px;
	background-color: #EE4F2F;
}

/* =Container  - Wraps the Content Areas
----------------------------------------------*/
#Container 
{
}

/* =Content  - Container for hte primary content
----------------------------------------------*/
#Content
{
	padding: 10px;
	width: 540px;
	float: left;
	background-color: #E4F2F2;
	color: #333333;
	
}

/* =Columns  - Wrapper for the columns.
http://www.alistapart.com/articles/holygrail for the technique.
----------------------------------------------*/
#Columns
{
	background-color: #E4F2F2;
	background-image: url('../images/columns-bg-4.gif');
	background-repeat: repeat-y;
	background-position: 560px 0;
	color: #333;
}
	/* style to float the 3 columns next to each other
	----------------------------------------------*/
	#Columns .column
	{
		float: left;
		width: 180px;
		padding: 10px;
		position: relative;
	}
	
	
	#Columns ul,
	#Columns ol
	{
		list-style-type: square;
		margin-left: 15px;
		font-size: 11px;
		line-height: 13px;
		margin-bottom: 15px;
	}
	
	#Columns ul.none,
	#Columns ol.none
	{
		list-style-type: none;
		margin-left: 0;
	}
	
	#Columns ul li,
	#Columns ol li
	{
		padding-bottom: 0.3em;
	}

/* =SiteContent - one of the columns
----------------------------------------------*/
#SiteContent
{
}

/* =TextContent - one of the columns
----------------------------------------------*/
#TextContent
{
	display: none;
	visibility: hidden;
}

/* =ImageContent - one of hte columns
----------------------------------------------*/
#ImageContent
{
}

/* =Footer - Footer of the Site
----------------------------------------------*/
#Footer
{
	background-color: #E4F2F2;
	padding: 10px;
	color: #333;
}

	#Footer p
	{
		font-size: 11px;
		line-height: 15px;
		text-align: center;
	}


/* =Welcome - a special container displaying on the front page. 
----------------------------------------------*/
.Welcome
{
	background-color: #E4F2F2  ;
	padding: 2px;
	color: #333;
}

	.Welcome p
	{
		font-size: 12px;
		line-height: 16px;
		text-align: justify;
	}
	
	.Welcome ol, 
	.Welcome ul
	{
		font-size: 12px;
		line-height: 16px;
	}
	
	.Welcome ol li, 
	.Welcome ul li
	{
		padding-bottom: 5px;
	}
	
/* =ArchiveTable - table on the news archive page.
----------------------------------------------*/
#ArchiveTable
{
	margin: 0 auto;
}

	#ArchiveTable th
	{
		font-size: 18px;
		font-weight: bold;
		vertical-align: top;
	}
	
	#ArchiveTable td
	{
		vertical-align: top;
		width: 33%;
	}

/* =flickr - styling the flickr image output
----------------------------------------------*/
#flickr img
{
	padding-right: 6px;
	padding-left: 7px;
	padding-bottom: 15px;
	border: 0;
}

/* =CommentData - wraps some of the Comment Form elements and floats them left.
----------------------------------------------*/
#CommentData
{
	float: left;
	width: 240px;
}

.img
{
	border: 1px solid #EEE;
	padding: 4px;
	margin: 5px;
}