/*
Theme Name: Hatch Network
Theme URI: http://blog.hatchnetwork.com/
Description: Designed for Hatch Newwork
Version: 1
Author: Gabriela Ghiuta
Author URI: gabriela.ghiuta@gmail.com
Tags: Hatch Network
*/

@import "style/css/reset.css";
@import "style/css/typography.css";
@import "style/css/layout.css";


/* LAYOUT */
/* ----------------------------------------- */

/* These rather presentational classes are generated by WordPress, so it's useful to have some styles for them. Edit as you see fit. More info: http://codex.wordpress.org/CSS */
.aligncenter { display:block; margin:0 auto }
.alignleft { float:left }
.alignright { float:right }
.wp-caption { border:1px solid #666; text-align:center; background:#ccc; padding:10px; margin:10px }

/* You might find the following useful */
br.dirtyLittleTrick { clear:both; display:block; height:1px; margin:-1px 0 0 0 } /* Use this br class to clear your floated columns */
li#theme-switcher { background:#fff; border:10px solid red; padding:20px; position:fixed; top:0; right:0 } /* Use this if you have the Theme Switcher Reloaded plugin (http://themebot.com/webmaster-tools/1-wordpress-theme-switcher-reloaded) installed and want to make it nice and obvious */

body {
background: url(images/background-light_gray.png) repeat-x top left;
margin:0;
font-family:'Lucida Grande',Lucida,'Trebuchet MS',sans-serif;
font-size:12px;
line-height:20px;
}

h2 {
font-size:20px;
line-height:30px;
margin-bottom:10px;
}
a {
text-decoration:underline;
color:#000;
}
a:hover {
text-decoration:underline;
color:#666666;
}
.main_col p {
margin:15px 0;
}
.title a {
color:#000;
text-decoration:none;
}
.logo {
margin:0;
float:left;
}

#wrapper {
margin:0 auto;
width:960px;
}
.content_holder {
width:960px;
padding:5px;
background:#fff;
-moz-border-radius:10px;
margin: 20px auto;
}
#content {
background:#fff;
width:100%;
margin:0;
border:1px solid #e2e0e0;
-moz-border-radius:10px;
}
.left_col {
width:30%;
float:left;
padding:11px;
}

.main_col {
width:65%;
float:left;
padding:11px;
}
.left_boxes {
background:#EFEFEF;
padding:5px;
margin-bottom:20px;

}
.left_boxes p {
border-bottom:3px solid #DDDDDD;
text-transform:uppercase;
color:#808080;
letter-spacing:2px;
padding-bottom:3px;
}
.left_boxes p a { 
text-decoration:none;
color:#808080;
}
.left_boxes ul {
list-style:none;
text-align:left;
}
.left_boxes ul li {
margin:2px 0;
border-bottom:1px dotted #DDDDDD;
}
.left_boxes ul li a {
color:#000;
padding:9px 0 2px 10px;
text-decoration:none;
display: block;
}
.left_boxes ul li a:hover {
color:#000;
background: url(images/nav-cap.gif) right no-repeat #fff;
}
.rss {
padding:5px;
margin-bottom:7px;
}
.rss img {
margin-top:3px;
width:20px;
float:left;
}
.rss span {
float:left;
width:200px;
margin-top:3px;
margin-left:10px;
}
/*-------------------- */
.categories {

}
.post {
float:left;

width:450px;
}
.post-photo {
float:left;
background:#F4F4F4;
border:1px solid #BFBFBF;

padding:4px;
margin:15px 0 0 13px;
}
.post-content {
float:left;
width:450px;


}
.post-details {
background:#BABABA;
color:#fff;
float:left;
width:450px;
padding:3px;
font-style:italic;
}
.single-post {
margin-bottom:50px;
}
.post-details a {
color:#fff;
}
.menu_small {
list-style-type:none;
float:right;
width:400px;
margin:0;

}
.menu_small li {
display:inline;
margin-right:10px;

}
.menu_small li a {
color:#959595;
margin-left:20px;
margin-right:0;

}

.menu_big {
list-style-type:none;
float:right;
margin:20px 0 0 0;
text-transform:uppercase;
font-size:14px;
width:550px;

}

.menu_big li {
display:inline;
margin-right:10px;
}

.menu_big li a {
color:#fff;
text-decoration:none;
padding:12px;
display:inline;
}
.about a:hover {
background:#404040;
border-bottom:2px solid #fff;
}
.directory a:hover {
background:#282560;
border-bottom:2px solid #fff;
}
.newsevents a:hover {
background:#EF333B;
border-bottom:2px solid #fff;
}
.home a:hover {
background:#868686;
border-bottom:2px solid #fff;
}
.menu_big_footer {
list-style-type:none;
width:930px;
margin:0 auto;
text-transform:lowercase;
font-size:12px;
}
.menu_big_footer li {
display:inline;
border-right:1px solid #fff;
}
.menu_big_footer li a {
color:#fff;
text-decoration:none;
margin:0 10px;
}
#header {
padding:5px;
}
#footer {
background:url(images/footer-background.gif) repeat-x;
height:25px;
}
/*********************** Begin styling comments *****************/
.comments{
	margin:1em 0;
	
	}
.comments li{
	margin:0;
	
	list-style:none;
}
.comments, .comments ul, #comments li{
	margin:0;
	padding:0;
	list-style:none;
	}
.comments li{
	margin:1.5em 0;
	position:relative;
	font-size:13px;
	background:url(images/bg_comments.gif) no-repeat 0 0;
	overflow:hidden;
	}
.comments a{color:#5a7981;}
.comments a:hover{color:#555;text-decoration:none;}
.comments .meta{
	float:right;
	display:inline;
	width:100px;
	}	
.comments .meta li{
	background:none;
	margin:0;
	}	
.comments .meta .date{
	color:#999;
	font-size:11px;
	}	
.comments .meta img{
	border:1px solid #bfd5da;
	}	
.comments .commentbody{
	float:left;
	display:inline;
	width:425px;
	padding:1em 0;
	margin-left:47px;
	}	
.ads {
border:1px solid #BFBFBF;
padding:4px;
background:#F4F4F4 none repeat scroll 0 0;
margin:10px auto;
}