/*
Theme Name: The Official Houston Zoo Blog
Theme URI: http://www.schipul.com/
Description: Official Houston Zoo Blog theme based on the original Kubrick theme.
Version: 1.0
Author: Brandi Lalanne/David Stagg
Author URI: http://davidstagg.com
*/

* { font-size: 100%; margin: 0; padding: 0; }
a img { border: none; }
a { outline: none; }

body {
	background: #4c7c2e url(images/body-bg.png) repeat-x top left;
	font: 11px/1.4em Verdana, Geneva, sans-serif;
	color: #5c320d;
	}

ul, ol { margin: 1em 0; padding-left: 2.5em; }
dt { margin: 0.5em 0 0; }
dd { margin: 0.25em 0 0.5em 2.5em; }

h1, h2, h3, h5, h5, h6 { font-weight: bold; } 

h2 {
	font: 22px/24px Arial, Helvetica, sans-serif;
	color: #3e560d;
	text-decoration: none;
	margin-bottom: 2px;
	}
h2.pagetitle {
	font: 18px/24px Arial, Helvetica, sans-serif;
	color: #3e560d;
	text-decoration: none;
	margin-bottom: 25px;
	padding-bottom: 5px;
	border-bottom: 1px solid #c16829;
	}

a { color: #5c7724; }
a:hover { text-decoration: none; }
a:active { }
a:visited { }

p { margin-bottom: 8px; }

/* STRUCTURE */

#visit-zoo { position: absolute; top: 0; right: 0; background: transparent url(images/triangle-corner.png) no-repeat top right; display: block; width: 122px; height: 119px; text-indent: -9999px; }

#container {
	width: 900px;
	margin: 0 auto;
	position: relative;
	}
	#header {
		display: block;
		width: 900px;
		height: 222px;
		background: transparent url(images/header-bg.png) no-repeat top left;
		}
		#logo {
			display: block;
			width: 100px;
			height: 125px;
			margin: 0 auto;
			padding-top: 40px;
			}
		#logo a {
			display: block;
			width: 100px;
			height: 125px;
			text-indent: -9999px;
			}
		#menu {
			font: 12px/1.4em normal Arial, Helvetica, sans-serif;
			}
			#menu a {
				color: #fff;
				font-weight: bold;
				text-decoration: none;
				}
			#menu ul {			
				padding-top: 8px;
				list-style: none;
				}
			#menu ul li {
				float: left;
				margin-right: 15px;
				}
	
	#main-content {
		width: 900px;
		background: #eedf8e url(images/main-content-bg.jpg) repeat-y top left;
		}
		#content {
			width: 870px;
			margin: 0 auto;
			}
		#content .spotlight {
			background: transparent url(images/spotlight-bg.jpg) no-repeat top left;
			width: 512px;
			height: 43px;
			display: block;
			font: 22px/1.4em bold Arial, Helvetica, sans-serif;
			padding: 3px 0 0 15px;
			color: #3e560d; 
			}
		
		#featured {
			background: #e0c373;
			margin-bottom: 20px;
			position: relative;
			}
			.featured-date { font-weight: bold; padding: 6px 10px 10px 0; color: #a55a17; font-size: 12px; }
			.author {
				padding: 0 0 10px 0;
				font-weight: bold;
				}
			.entry {
				padding: 0 0 10px 0;				
				}
				.entry p { margin-bottom: 8px; }
				
			#left {
				width: 570px;
				padding: 15px;
				float: left;
				}
			
			.intro-text {
				display: block;
				width: 585px;
				height: 112px;
				overflow: hidden;
				background: transparent url(images/gen-blog-intro.jpg) no-repeat top left;
				margin-bottom: 35px;
				}
				.intro-text .post-home {
					width: 540px;
					margin: 0 auto;
					padding: 35px 0 0 0;
					}
				.intro-text .entry {
					padding-left: 10px;
					}
	
	#media-footer {
		display: block;
		width: 900px;
		height: 92px;
		background: transparent url(images/media-footer.jpg) no-repeat top left;
		margin-bottom: 10px;
		}
		#media-footer ul {
			list-style: none;
			margin:0 auto;
			padding:40px 0 0 0;
			width:700px;
			}
		#media-footer ul li { float: left; margin-left: 20px; }
		#media-footer ul li a { color: #eedf8e; font-weight: bold; }

#footer { margin-bottom: 25px; color: #d3af9b; }
#footer a { color: #d3af9b; }
.footer-left {
	float: left;
	width: 45%;
	}
.footer-right {
	float: right;
	width: 45%;
	text-align: right;
	}
		
.clear { clear: both; }


/* Begin Images */
p img {
	padding: 0;
	max-width: 100%;
	}

/*	Using 'class="alignright"' on an image will (who would've
	thought?!) align the image to the right. And using 'class="centered',
	will of course center the image. This is much better than using
	align="center", being much more futureproof (and valid) */

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	padding: 4px;
	margin: 0 0 7px 10px !important;
	display: inline;
	float: right;
	}

img.alignleft {
	padding: 4px;
	margin: 0 10px 7px 0 !important;
	display: inline;
	float: left;
	}

.alignright {
	float: right;
	}

.alignleft {
	float: left
	}
/* End Images */


/* Begin Form Elements */
#searchform {
	margin: 10px auto;
	padding: 5px 3px;
	text-align: center;
	}

#sidebar #searchform #s {
	width: 108px;
	padding: 2px;
	}

#sidebar #searchsubmit {
	padding: 1px;
	}

.entry form { /* This is mainly for password protected posts, makes them look better. */
	text-align:center;
	}

select {
	width: 130px;
	}

#commentform input {
	width: 170px;
	padding: 2px;
	margin: 5px 5px 1px 0;
	}

#commentform {
	margin: 5px 10px 0 0;
	}
#commentform textarea {
	width: 100%;
	padding: 2px;
	}
#respond:after {
		content: "."; 
	    display: block; 
	    height: 0; 
	    clear: both; 
	    visibility: hidden;
	}
#commentform #submit {
	margin: 0 0 5px auto;
	float: right;
	}
/* End Form Elements */






/* Begin Comments*/
.alt {
	margin: 0;
	padding: 10px;
	}

.commentlist {
	padding: 0;
	text-align: justify;
	}

.commentlist li {
	margin: 15px 0 10px;
	padding: 5px 5px 10px 10px;
	list-style: none;

	}
.commentlist li ul li { 
	margin-right: -5px;
	margin-left: 10px;
}

.commentlist p {
	margin: 10px 5px 10px 0;
}
.children { padding: 0; }

#commentform p {
	margin: 5px 0;
	}

.nocomments {
	text-align: center;
	margin: 0;
	padding: 0;
	}

.commentmetadata {
	margin: 0;
	display: block;
	}
/* End Comments */



/* Begin Various Tags & Classes */
acronym, abbr, span.caps {
	cursor: help;
	}

acronym, abbr {
	border-bottom: 1px dashed #999;
	}

blockquote {
	margin: 15px 30px 0 10px;
	padding-left: 20px;
	border-left: 5px solid #ddd;
	}

blockquote cite {
	margin: 5px 0 0;
	display: block;
	}

.center {
	text-align: center;
	}

.hidden {
	display: none;
	}

hr {
	display: none;
	}

a img {
	border: none;
	}

.navigation {
	display: block;
	margin: 10px 0;
	}
/* End Various Tags & Classes*/



/* Captions */
.aligncenter,
div.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption {
	border: 1px solid #963804;
	text-align: center;
	background-color: #b86f22;
	padding-top: 4px;
	margin: 10px;
	-moz-border-radius: 5px;
	-khtml-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.wp-caption img {
	margin: 0;
	padding: 0;
	border: 0 none;
}

.wp-caption p.wp-caption-text {
	font: 10px/12px Arial, Helvetica, sans-serif;
	padding: 4px 5px;
	margin: 0;
	color: #fff;
}
/* End captions */



h2.intro { font-size: 14px; line-height: 16px; color: #7e4c17; padding: 10px 10px 6px 10px; }


		.entry, .postmeta { padding: 0 10px 10px 0; }
		.read-more { margin-top: 10px; font-weight: bold; }
		.date { font-weight: bold; padding: 0 10px 10px 10px; color: #a55a17; font-size: 12px; }

/* INDIVIDUAL POSTS */
.post { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 2px solid #ceb05d; }

.post .date { padding: 0; }
.post-date{
	float: right;
	display: inline;
	width: 40px;
	height: 55px;
	margin: 0 0 10px 10px;
	font-family: Arial, Helvetica, sans-serif;
	background: url(images/date_button.gif) no-repeat;
	}
	.post-date .month, .post-date .day {
		font-weight: bold;
		text-align: center;
		}
	.post-date .month {
		font-size: 14px;
		padding: 3px 0;
		}
	.post-date .day {
		font-size: 26px;
		color: #fff;
		padding-top: 8px;
		}
	.postmetadata { font-weight: bold; }

.post h3.storytitle, .post h3.storytitle a, h2.posttitle a, h2.posttitle, #authors h3 {
	font: 22px/24px Arial, Helvetica, sans-serif;
	color: #3e560d;
	text-decoration: none;
	margin-bottom: 2px;
	}
	.post h3.storytitle a:hover { text-decoration: underline; }
	
	.storycontent { margin-bottom: 10px; }
	
	.posts-nav, .posts-nav a { font: 18px/20px Arial, Helvetica, sans-serif; text-decoration: none; font-weight: bold; }
	
	#author dl { margin-bottom: 20px; }
	
	#author ul { margin: 0; padding: 0; }
	#author ul li {
		list-style: none;
		display: block;
		padding: 6px 4px;
		margin: 0;
		border-bottom: 1px solid #5c7724;
		text-decoration: none;
		}
	#author ul li a { text-decoration: none; }
	#author ul li a:hover { text-decoration: underline; }
			
	#authors ul { margin: 0; padding: 0; }
	#authors ul li { list-style: none; }
	#authors ul li a {
		display: block;
		padding: 6px 4px;
		margin: 0;
		border-bottom: 1px solid #5c7724;
		text-decoration: none;
		}
		#authors ul li a:hover {
			background: #5c7724;
			color: #fff;
			text-decoration: underline;
			}

/* STYLES FOR EACH INDIVIDUAL BLOG */

#sidebar {
	float: right;
	width: 250px;
	background: transparent url(images/sidebar-bg.png) repeat-y top left;
	}
	#sidebar #sidebar-content { width: 230px; margin: 0 auto; }
	#sidebar ul { margin: 0; padding: 0; list-style: none; margin-bottom: 20px; }
	#sidebar ul ul { padding-left: 25px; list-style: none; margin-bottom: 20px; }
	#sidebar ul ul li { list-style-image: url(images/sidebar-li.gif); }
	#sidebar ul ul li a {
		display: block;
		padding: 4px 0;
		font: 11px/12px Verdana, Geneva, sans-serif;
		color: #5C320D;
		text-decoration: none;
		}
		#sidebar ul li a:hover { text-decoration: underline; }
	#sidebar #twitter-sidebar ul li a { display: inline; background: none; padding: 0; margin: 0; }

	#sidebar #rss-icon {
		display: block;
		width: 245px;
		height: 125px;
		background: transparent url(images/rss-icon.png) no-repeat top left;
		text-indent: -9999px;
		margin-bottom: 20px;
		}
	#sidebar h3 {
		color: #3e560d;
		font: 14px/16px Arial, Helvetica, sans-serif;
		font-weight: bold;
		margin-bottom: 5px;
		}
	
	#twitter-sidebar {
		display: block;
		width: 243px;
		height: 268px;
		background: transparent url(images/twitter-toucan.jpg) no-repeat top left;
		overflow: hidden;
		font-weight: bold;
		position: relative;
		}
		#twitter-sidebar ul { padding-top: 32px; width: 223px; margin: 0 auto; }
	
	#twitter-sidebar ul#social-paws {
		width: 200px;
		margin: 0;
		padding: 0;
		list-style: none;
		position: absolute;
		top: 180px;
		left: 0;
		}
	#twitter-sidebar #social-paws li a {
		background: none;
		float: left;
		display: block;
		text-indent: -9999px;
		width: 33px;
		height: 32px;
		margin: 0; padding: 0;
		}
	.feedback {display:block; padding: 16px 0; font-size:14px}
	.meta a, .feedback a {text-decoration: none;}
	.meta a:hover, .feedback a:hover {color: #5C320D}

.clear { clear: both;}