/*  
Theme Name: 	Crazy Bat Designs (HTML5)
Theme URI: 		http://crazybat.ca
Description: 	Web and Accessibility standards-based template by <a href="http://crazybat.ca" title="Go to Crazy Bat Designs">Crazy Bat Designs</a>
Version: 		1.0
Media: 			Screen
Date: 			09 September 2009
Author: 		Marco Battilana
*/

/* Global styles
-----------------------------------------*/

/*
	IE sucks
	-----------------------------------------*/
@import url("html5-css-reset.css");

article, aside, dialog, figure, footer, header, hgroup, menu, nav, section { 
	display: block; 
}
/*
	IE sucks ends? But does it? ;)
	-----------------------------------------*/

html, body {
	color: #000;
	/*background: #fff url(gfx/bg.jpg) 0 0 repeat;*/
	background: #fff;
	font: 100.1%/1.5 Arial, sans-serif;
	text-align: center;
}

abbr, acronym {
	border-bottom: dashed 1px #999;
	cursor: help;
}
blockquote {
	font-style: italic;
}
dt {
	font-weight: bold;
	margin: 0.5em 0 0 0;
}
dl {
	margin: 0 0 1.0em 1.5em;
}
fieldset {
	margin: 1.0em 0 0 0;
	padding: 5px;
	border: solid 1px #ccc;
}
img {
	border: 0;
}
label {
	display: block;
}
legend {
	display: block;
	font-weight: bold;
}
p {
	margin: 0 0 1.0em 0;
}
ul, ol {
	margin: 0 0 1.0em 0;
}
.offleft {
	display: block;
	width: 0;
	height: 0;
	overflow: hidden;
}

/* Main Container
-----------------------------------------*/
body {
	position: relative;
	min-width: 48.75em;
	max-width: 70em;
	width: 70em;
	margin: 0 auto;
	background: #fff;
	text-align: left;
	border: solid 1px #ddd;
}

/* Skip Links
-----------------------------------------*/
#skip {
	position: absolute;
	top: 0;
	left: 0;
	font-size: 0.9em;
}
#skip a {
	color: #000;
}
#skip ul {
	display: block;
	width: 16em;
	background: #fff;
	border-bottom: solid 1px #000;
	border-right: solid 1px #000;
	list-style: none;
}
#skip ul li {
	display: inline;
	padding: 0 0 0 5px;
}

/* Header
-----------------------------------------*/
#banner {
	display: block;
	width: 100%;
	height: 200px;
	background: url(gfx/banner.gif) 50% 0 no-repeat;
}
#banner h1 a {
	display: block;
	width: 100%;
	height: 100px;
}
#banner h1 a:visited,
#banner h1 a:focus,
#banner h1 a:hover,
#banner h1 a:active {
	border: 0;
	background: url(/gfx/banner.png) 0 0 no-repeat;
}

/* Navigation
-----------------------------------------*/
nav#nav-main {
	display: block;
	float: left;
	width: 100%;
	background: #000 url(gfx/nav/bg-nav.gif) 0 0 repeat;
	border-bottom: solid 1px #000;
	border-top: solid 1px #000;
}
nav#nav-main ul {
	list-style: none;
}
nav#nav-main ul li {
	float: left;
}
nav#nav-main ul li a {
	display: block;
	width: 120px;
	height: 58px;
	border-left: solid 1px #000;
	border-right: solid 1px #000;
}

li#nav-home a {
	background: url(gfx/nav/nav-home.gif) 0 50% no-repeat;
}
li#nav-vendors a {
	background: url(gfx/nav/nav-vendors.gif) 0 50% no-repeat;
}
li#nav-info a {
	background: url(gfx/nav/nav-info.gif) 0 50% no-repeat;
}
li#nav-apply a {
	background: url(gfx/nav/nav-apply.gif) 0 50% no-repeat;
}
li#nav-blog a {
	background: url(gfx/nav/nav-blog.gif) 0 50% no-repeat;
}
li#nav-contact a {
	background: url(gfx/nav/nav-contact.gif) 0 50% no-repeat;
}

	/* You are here
	-------------------*/
body#home li#navhome-c a#navhome {
	background: url(/gfx/nav/nav-home.gif) 0 100% no-repeat;
}
body#vendors li#nav-vendors a.nav-vendors {
	background: url(/gfx/nav/nav-vendors.gif) 0 100% no-repeat;
}
body#info li#nav-info a.nav-info {
	background: url(/gfx/nav/nav-info.gif) 0 100% no-repeat;
}
body#application li#nav-application a.nav-application {
	background: url(/gfx/nav/nav-application.gif) 0 100% no-repeat;
}
body#blog li#nav-blog a.nav-blog {
	background: url(/gfx/nav/nav-blog.gif) 0 100% no-repeat;
}
body#contact li#nav-contact a.nav-contact {
	background: url(/gfx/nav/nav-contact.gif) 0 100% no-repeat;
}
/* Search
-----------------------------------------*/
#search {
	position: absolute;
	top: 4px;
	right: 15px;
}
#search label {
	color: #fff;
	font-size: 0.8em;
}
#search input.submit {

}
#search input.boxes,
#search textarea.boxes {
	color: #000;
	background: #fff;
	border: solid 1px #666;
	font-family: Arial, sans-serif;
	font-size: 0.9em;
}

/* Social content
-----------------------------------------*/
#social-links {
	display: block;
	float: right;
	margin-top: -45px;
}
#social-links ul {
	list-style: none;
}
#social-links ul li {
	float: left;
	padding-right: 27px;
}

/* Content container and content related styles
-----------------------------------------*/

	/* Main Content
	-------------------*/
article {
	position: relative;	
	float: left;
	min-width: 38em;
	width: 38em;
	margin: 0 0 2.5em 0;
	padding: 1.0em 0 0 1.0em;
	font: 1.1em "Palatino Linotype", serif;
}
/*article#page-1column,
article#blog-1column {
	width: 95%;
	max-width: 95%;
}*/
article a, article a:link {
	color: #2E5082;
}
article a:visited {
	color: #646464;
	border-bottom: dashed 1px #646464;
}
article a:focus {
	color: #000;
	background: #ccc;
}
article a:hover {
	text-decoration: none;
}
article a:active {
	color: #fff;
	background: #333;
}
article blockquote {
	display: block;
	padding: 0.5em 0 0 2.0em;
	background: url(/gfx/blockquote-bg.gif) 0 0 no-repeat;
}
article cite {
	position: relative;
	top: -0.5em;
	display: block;
	color: #646464;
	padding: 0 0 1.5em 2.0em;
	font-size: 0.9em;
	font-style: normal;
}
article header {
	background: url(/gfx/header-bg.png) 0 0 no-repeat;
	font-size: 1.65em;
	font-weight: normal;
}

article ol,
article ul {
	margin: 0 0 1.5em 1.5em;
}

article .leftalign {
	float: left;
	margin: 0 0.5em 0 0;
}
article .rightalign {
	float: right;
	margin: 0 0 0 0.5em;
}
article ul.photo-gallery li {
	display: block;
	list-style: none;
	height: 100px;
	border: solid 1px #ccc;
	margin-left: -1.5em;
	padding: 5px;
	line-height: 100px;
}
article ul.photo-gallery li img {
	float: left;
	margin-right: 0.5em;
}

article section {
	margin-bottom: 1.5em;
}
article section.post{
	border-bottom: dashed 1px #aaa;
	margin-bottom: 1.5em;
}
article section .posttime,
article section .postmetadata,
article section #follow-links,
article section footer#article-info {
	font-size: 0.8em;
	font-weight: bold;
}
article section #follow-links {
	border-top: dashed 1px #aaa;
	padding-top: 2.0em;
}
article section footer#article-info {
	margin-bottom: 0;
}
article section#comments {
	border-top: dashed 1px #aaa;
	padding-top: 1.5em;
}

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

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

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

.wp-caption p.wp-caption-text {
	font-size: 0.7em;
	font-weight: bold;
	line-height: 1.0em;
	padding: 0 4px 5px;
	margin: 0;
}

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

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;
	}
	
	/* Sub Content
	-------------------*/
aside {
	min-width: 400px;
	width: 400px;
	margin: 0 0 0 60em;
	font: bold 0.75em "Palatino Linotype", serif;	
}
aside a {
	color: #333;
}
aside a:visited {
	color: #333;
	border-bottom: dashed 1px #333;
}
aside a:focus {
	color: #000;
	background: #ccc;
}
aside a:hover {
	text-decoration: none;
}
aside a:active {
	color: #fff;
	background: #333;
}

aside #content-social {	
	display: block;
	float: right;
	width: 400px;
	height: 341px;
	background: url(gfx/bg-aside.gif) 100% 0 no-repeat;
	
}
aside #content-social ul {
	display: block;
	width: 200px;
	height: 145px;
	margin-top: 155px;
	margin-left: 110px;
	overflow-y: auto;
}
aside #content-social ul li {
	padding: 1.0em 0;
	border-bottom: dashed 1px #43251c;
}
aside h1 {
	font-size: 1.9em;
}
aside #previous-posts {
	margin-top: 6.8em;
	padding-left: 1.0em;
	border-left: dashed 1px #333;
}
aside #previous-posts ul li {
	margin-left: 1.5em;
}
/* Form elements
-----------------------------------------*/
.inlinelabel {
	display: inline;
}
	/* Contact Form
	-------------------*/
.formfields {
	margin: 0 0 1.0em 0;
}
.formfields input.submit {
	color: #fff;
	background: #369;
	margin: 0.5em 0 0 0;
	border: solid 1px #666;
	font: bold 0.9em "Trebuchet MS", sans-serif;
}
input.boxes,
textarea.boxes {
	color: #000;
	background: #fff;
	border: solid 1px #666;
	font-family: "Trebuchet MS", sans-serif;
	font-size: 0.9em;
}

/* Sections
-----------------------------------------*/
#site-information {
	clear: both;
	display: block;
	color: #000;
	background: #f9ed31;
	margin: 1.5em 0 0 0;
	padding: 1.0em 0 0.5em 0;
	font-size: 0.9em;
}
#site-information a {
	color: #000;
}
#site-information a:visited {
	color: #000;
	border-bottom: dashed 1px #000;
}
#site-information a:focus {
	color: #000;
	background: #ccc;
}
#site-information a:hover {
	text-decoration: none;
}
#site-information a:active {
	color: #fff;
	background: #333;
}
/* Footer
-----------------------------------------*/
footer {
	clear: both;
	padding: 0 0 0 1.0em;
	font: bold 0.95em "Palatino Linotype", serif;
	overflow: auto;
}
footer p {
	margin: 0;
}
footer#footer-main ul {
	list-style: none;
}
footer#footer-main ul li {
	display: inline;
	margin: 0 2px 0 0;
}
footer #meta-wp {
	position: absolute;
	display: block;
	right: 1.0em;
	margin-top: -30px;
}

/* BIG RED ANGRY TEXT (http://accessites.org/site/2006/07/big-red-angry-text/)
This is to determine if deprecated elements are used.
 If so, they should be replaced:
 1a. <font> and
 1b. <font color="xxx">�</font>: Shouldn�t be used.
 CSS should dictate font attributes.
 2. <center>: Shouldn�t be used. CSS should dictate
 horizontal alignment.
 3a. <div align="xxx">�</div>
 3b. <p align="xxx">�</p>
 3c. <table align="xxx">�</table>: Shouldn�t be used.
 CSS should dictate horizontal alignment.
-----------------------------------------*/
font, font[color], center, div[align], p[align], table[align] {
	display: block;
	height: 1.0em;
	color: #fff;
	background: #fa8888;
	margin: 1.0em 0;
	padding: 0.5em;
	border: solid 1px #900;
	font-size: 3em;
}