/*
Theme Name: Hear a blog
Theme URI: http://hearablog.com
Description: Hear a blog
Version: 0.1
Author: J. Pablo Fernandez
Author URI: http://pupeno.com
Tags: blue, custom header, fixed width, two columns, widgets

	Kubrick v1.5
	 http://binarybonsai.com/kubrick/

	This theme was designed and built by Michael Heilemann,
	whose blog you will find at http://binarybonsai.com/

	The CSS, XHTML and design is released under GPL:
	http://www.opensource.org/licenses/gpl-license.php

*/

/* Copyright 2009 José Pablo Fernández */

html { 	margin: 0; padding: 0; }

body { 
	margin: 0; padding: 0; 
	background: white url(content/images/html_bg.gif) 0 124px repeat-x;
}

body, 
textarea {
	font-family: Arial, Sans-Serif;
}

.clearer {
  clear: both;
  height: 0; line-height: 0;
  margin: 0; padding: 0;
  font-size: 0;
}


#WholePageContainer {
	width: 880px;	
	margin: 0 auto; 
	font-size: 16px;
}

/*------*/

a img { border: none; }
a { color: #57a3e5; }

hr {
	height: 1px;
	background: none;
	border: none;
	border-bottom: 1px solid #ddd;
	margin: 15px 0 5px;
}

p { margin: 15px 0 5px; }



.field-validation-error { color: #ff0000; }
.input-validation-error { border: 1px solid #ff0000; background-color: #ffeeee; }

.validation-summary-errors { font-weight: bold; color: #ff0000; }
span.validation-summary-errors { display: block; margin-top: 10px; }
ul.validation-summary-errors { margin: 5px 0 10px 0; }

/*===========================================================================
 * 																Header
 * 																===========================================================================*/

#header {
  margin-top: 20px;
  height: 178px;
  position: relative;
}

#header #logo {
  position: absolute;
  display: block;
  top: 20px;
  left: 10px;
}

#header #slogan {
	position: absolute;
	left: 490px; top: 46px;
	width: 378px; height: 44px;
	text-indent: -3000px;
	background: transparent url(content/images/header_slogan.gif) 0 0 no-repeat;
}

#header #header_vsep {
	display: block;
	left: 465px; top: 36px;	
	position: absolute;
	width: 4px; height: 49px;
	background: transparent url(content/images/header_vsep.gif) 0 0 no-repeat;
}

#header #menu {
  position: absolute;
  width: 100%;
  bottom: 30px;
  height: 28px;
  margin: 0;
  padding: 0 0 0 7px;
}

#header #menu li {
  display: block;
  float: left;
  height: 22px;
  margin: 0 2px;
  font-size: 15px;
  padding: 6px 10px 0;
  background-color: #2678bf;
  color: White;
  border-top-left-radius: 4px; -moz-border-radius-topleft: 4px;
  border-top-right-radius: 4px; -moz-border-radius-topright: 4px;
}

#header #menu li.lowPriority a { color: #b2bfda; }
#header #menu li.lowPriority a:hover { color: #eee; }
#header #menu li.selected { background-color: #57a3e5; }
#header #menu li.selected a { color: white; }

#header #menu li a { color: White; text-decoration: none; }
#header #menu li a:hover { text-decoration: underline; }

/*===========================================================================
 * 																  Footer
 * 																  ===========================================================================*/

#footer {
	margin-top: 20px;
	height: 70px;
	background: white url(content/images/html_bg.gif) 0 -42px repeat-x;	
}

/*===========================================================================
 * 																  Main
 * 																  ===========================================================================*/

#main {
	width: 610px;
	float: left;
	padding: 0 10px;
	margin-top: 30px;
	border-right: 1px solid #f0f0f0;
}

#main h1 {
	font-size: 30px;
	margin: 0;
	padding: 0;
	color: #f17529;
	font-weight: normal;
}


/*===========================================================================
 * 															Right Column
 * 															===========================================================================*/

#rightColumn {
	float: left;
	width: 220px;
	margin-top: 30px;
	padding: 0 10px;
}

#rightColumn h2 {
	margin: 0 0 10px 0;
	padding: 0 0 0 34px;
	background: transparent url(content/images/h2.gif) top left no-repeat;
	height: 28px;
	color: White;
	font-size: 12px;
}

#rightColumn h2 span {
	display: block;
	background: transparent url(content/images/h2.gif) top right no-repeat;
	height: 24px;
	padding-top: 6px;
}

/*------------------------------------*/

#LatestBlogPosts .LatestBlogPost {
	padding: 8px 0 11px 0;
	background: transparent url(content/images/h_sep.gif) bottom left repeat-x;
}

#LatestBlogPosts .LatestBlogPost .PostDate {
	font-size: 12px;
	display: block;
	padding-bottom: 2px;
}

#LatestBlogPosts .LatestBlogPost .PostTitle {
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;
}
#LatestBlogPosts .LatestBlogPost .PostTitle:hover { text-decoration: underline; }

/********
 * Blog *
 ********/

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

img.alignright {
        padding: 4px;
        margin: 0 0 2px 7px;
        display: inline;
        }

img.alignleft {
        padding: 4px;
        margin: 0 7px 2px 0;
        display: inline;
        }

.alignright {
        float: right;
        }

.alignleft {
        float: left;
        }


.clear {
	clear: both;
}

/*--------------------------------------*/

h2.pagetitle {
	font-size: 30px;
	color: #f17529;
}

.post, .page  {
	border-bottom: 1px solid #999;
	margin: 20px 0;
	padding-bottom: 30px;
}

.post  h1 a {
	font-size: 30px;
	color: #f17529;
	text-decoration: none;
}

.post h1 a:hover { text-decoration: underline; }

.post .entry p { 
	font-family: Georgia, serif;
}

.post .entry img { padding: 6px; border: 1px solid #ccc; }

.post .postmetadata {
	font-size: 12px;
}

.post .postmetadata .NumComments {
	display: block;
	margin-top: 5px;
	padding: 8px 0 0 26px;
	background: transparent url(content/images/comment_balloon.gif) 0 9px no-repeat;
	font-size: 14px;
}


/*-----------*/

.commentlist .commentmetadata  { padding-top: 2px; }
.commentlist .commentmetadata a { font-size: 12px; text-decoration: none; color: black; }

#respond  input,
#respond textarea { 
	border: 1px solid #999;
}