﻿/**
 * God's Porch Stylesheet
 * 
 * version	: 3.0
 * author	: Yannick Lyn Fatt
 * email	: yannick@godsporch.net
 * 
 * verse	: Ephesians 3:16-19
 *	I pray that out of his glorious riches he may strengthen you 
 *	with power through his Spirit in your inner being, so that Christ 
 *	may dwell in your hearts through faith. And I pray that you, being 
 *	rooted and established in love, may have power, together with all 
 *	the saints, to grasp how wide and long and high and deep is the love 
 * 	of Christ, and to know this love that surpasses knowledge—that you may 
 * 	be filled to the measure of all the fullness of God.
 */
 
 /*
Colour Scheme

#9EDCF5 - Light Blue
#9EDDF3 - Light Blue
#93D8F2 - Blue
#88B86A - Green
#629244 - Dark Green
#900	- Maroon Red
#FFC 	- Yellow
#FC6	- Orange 
*/

body {
	margin: 0;
	padding: 0;
	background: #9EDDF3 url(../images/stripe_bg.gif) repeat top left;
	font: small/1.4em Arial, Helvetica, sans-serif;
	color: #444;
	}
	
#container {
	width: 45em;
	margin: 0 auto;
	padding: 0 20px;
	background-color: #fff;
	border-left: 1px solid #3F3F3F;
	border-right: 1px solid #3F3F3F;
	}

/*TODO: use percentages/ems instead of px*/
blockquote {
    color:  #777;
    font-style:  italic;
    margin:  0 0 20px 0;
    padding: 0 10px;
    border-left:  3px solid #dfdfdf;
} 

blockquote p {
    font-family: Georgia, "Times New Roman", Times, serif;
    margin:  0 0 20px 0;
    padding: 0;
    text-align:  left;
    font-size: 13px;
    line-height: 20px;
}

blockquote cite {
    font-family: Arial, Helvetica, sans-serif;
    font-size:  12px;
    line-height: 20px;
    margin-top:  0px;
    display: block;
    color: #252525;
}
	
/* =skip links
-----------------------------*/
#skip {
	display:block; 
	overflow: hidden; 
	font-weight: bold; 
	text-indent: -999em; 
	background: transparent;	
	text-decoration: none;
	padding: 0.5em 0;
}

#skip:focus, #skip:hover, #skip:active {
	text-indent: 3em; 
	background: #88b86a; 
	color: #fff;
	}


/*	=header	
-----------------------------*/
#header {
	height: 200px;
	background: #9EDDF3 url(../images/clouds.png) repeat-x top left;
	}
	
#header h1 {
	margin: 0;
	text-align: center;
	}
	
#header img {
	margin: 80px 0 0 0;
	}

#header a img {
	border: none;
	}

/* =nav
-----------------------------*/
ul#nav {
	width: 45em;
	margin: 10px 0 0 0;
	padding: 0;
	list-style: none;
	background-color: #88b86a;
	border-top: 2px solid #629244;
	float: left;
	}

ul#nav li {
	float: left;
	}
	
ul#nav a {
	display: block;
	padding: 0 2em;
	line-height: 2.1em;
	text-decoration: none;
	color: #3F3F3F;
	}
	
ul#nav a:hover {
	color: #252525;
	}
	
body#home ul#nav li.home a,
body#about ul#nav li.about a,
body#archives ul#nav li.archives a,
body#links ul#nav li.links a,
body#contact ul#nav li.contact a {
	background: url(../images/arrow.png) no-repeat bottom center;
	color: #fff;
	}

/* =content
------------------------------*/
#content {
	width: 45em;
	}
	
#content div.entry {
	margin: 0 0 30px 0;
	text-align: justify;
	}
	
#content h2 {
	font-size: 120%;
	font-weight: normal;
	color: #900;
	margin: 0;
	}

#content h2 a:link,
#content h2 a:visited,
#content h2 a:hover,
#content h2 a:active {
	color: #900;
	text-decoration: none;
	border-bottom: none;
	}
	
#content p.meta {
	font-size: 85%;
	margin: 0;
	font-style: italic;
	}
	
#content p.excerpt span {
    display: block;
    margin: 10px 0;
}
		
#content a:link,
#content a:visited {
	color: #629244;
	border-bottom: 1px dotted #629244;
	text-decoration: none;	
	}
	
#content a:hover,
#content a:active {
	color: #88b86a;
	border-bottom: 1px solid #88b86a;
	}
	
/* =comments
------------------------------*/
#comments dl {
	}

#comments dt {
	border-top: 1px solid #fc6;
	background-color: #ffc;
	position:relative;
	margin: 10px 0 0 0;
	padding: 1.0em 0 0 70px;
	}
	
#comments dt img {
	height: 50px;
	width: 50px;
	position:absolute;
	top: 1.0em;
	left:0;
	padding: 1px 1px 1px 0;
	border: 1px solid #fc6;
	border-width: 1px 1px 1px 0;
	background: #fff url(../images/gravatar.gif) no-repeat top left;
	}
	
#comments dd {
	border-bottom: 1px solid #fc6;
	background-color: #ffc;
	margin: 0 0 10px 0;
	padding: 0.5em 0.5em 1em 70px;
	}
	
#comments dd p {
	margin: 0 0 1em 0;
	}
	
#comment_form fieldset {
	background-color: #f0f0f0;
	border: 1px solid #ccc;
	padding: 1em;
    margin: 1em 0;			
	}
	
#cpreview {
	background-color: #FBE6F2;
	border: 1px solid #D893A1;
	border-width: 1px 0;
	color: #444;
	}
	
#cpreview h3 {
	color: #000;
	background: url(../images/pink_stripe.gif) repeat-x top left;
	margin: 0;
	padding: 0 0 0 5px;
	line-height: 30px;
	}
	
#cpreview dt {
	position:relative;
	margin: 10px 0 0 0;
	padding: 1.0em 0 0 70px;
	}
	
#cpreview dt img {
	height: 50px;
	width: 50px;
	position:absolute;
	top: 1.0em;
	left:0;
	padding:2px;
	border: 1px solid #D893A1;
	border-width: 1px 1px 1px 0;
	background:#fff;
	}
	
#cpreview dd {
	margin: 0 0 10px 0;
	padding: 0.5em 0.5em 1em 70px;
	}
	
#cpreview dd p {
	margin: 0 0 1em 0;
	}
	
/* =form
------------------------------*/
legend {
    font-weight: bold;
}

fieldset {
    background-color: #f0f0f0;
    border: 1px solid #ccc;
    padding: 1em;
    margin: 1em 0;	
}

label {
    float: left;
    width: 15em;
}

input[type="text"] {
    width: 280px;
}

input:focus,
textarea:focus {
    background: #ffc;
}

input[type="text"],
textarea {
    border-top: 2px solid #999;
    border-left: 2px solid #999;
    border-bottom: 1px solid #ccc;
    border-right: 1px solid #ccc;
}

textarea {
	width: 35em;
	height: 15em;
}

input.radio, input.checkbox, input.submit {
    width: auto;
}

input.checkbox, input.radio {
    float: left;
    margin: 0.2em 1em;
}


/* =tables
------------------------------*/
table#post_archive {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px; /* TODO: fix headings so that this isn't necessary */
}

table#post_archive caption {
    font-weight: bold;
    text-align: left;
    margin: 20px 0;
}

table#post_archive th {
    text-align: left;
    border: 1px solid #fc6;
    border-width: 1px 0;
    background-color: #ffc;
    padding: 5px;
}

table#post_archive td {
    border-bottom: 1px solid #ccc;
    padding: 5px;
}

table#post_archive tr.odd {
    background-color: #9EDCF5;    
}

	
/* =footer
------------------------------*/
#footer {
	margin: 20px 0 0 0;
	padding: 10px 0;
	font-size: 85%;
	text-align: center;
	background-color: #88b86a;
	border-top: 2px solid #629244;
}

#footer p {
	margin: 0;
	}
	
#footer a:link,
#footer a:visited {
	color: #444;
	border-bottom: 1px dotted #444;
	text-decoration: none;	
	}
	
#footer a:hover,
#footer a:active {
	color: #444;
	border-bottom: 1px solid #444;
	}
	

/* =misc
------------------------------*/
.required {
    font-size: 0.9em;
    color: #760000;
}

#other {
	margin: 3em 0;
	padding: 5px;
	background: #ffc;
	border: 1px solid #fc6;
	text-align: center;
	}
	
#other ul {
	margin: 5px 0;
	padding: 0;
	list-style: none;
	}
	
#other ul li {
	display: inline;
	}
	
#other ul li.feed {
	background: url(../images/feed.png) no-repeat left center;
	padding: 0 0 0 20px;
	}

#other ul li.technorati {
	background: url(../images/technorati.png) no-repeat left center;
	padding: 0 0 0 20px;
	}

img.picture {
	float: right;
	border:1px solid #444444;
	padding:2px;
	margin: 0 0 15px 10px;
}